:root{font:16px system-ui;color:#344934;background:#d4e3d5}body{margin:0;min-height:100dvh;display:grid;place-items:center}main{width:min(390px,calc(100% - 64px));background:#f8f9f1;padding:32px;border-radius:24px;box-shadow:0 20px 80px #2c48351a}h1{font:36px Georgia}small{letter-spacing:2px}form{display:grid;gap:12px;margin:28px 0}input,button{box-sizing:border-box;width:100%;padding:14px;border-radius:10px;border:1px solid #b4c7ad;font:inherit}button{background:#587452;color:white;cursor:pointer}.note{font-size:13px;line-height:1.6;color:#697861}#status{font-size:14px;min-height:20px}
.modes{display:flex;gap:8px}.modes button{background:#e8eddf;color:#344934}.modes [aria-pressed=true]{background:#587452;color:white}input[readonly]{background:#e8eddf}button:disabled{opacity:.5}