:root{color-scheme:light dark;font-family:system-ui,sans-serif;background:#f5f3ef;color:#292b30}body{margin:0;display:grid;min-height:100svh;place-items:center}main{width:min(340px,calc(100vw - 48px));padding:32px}.mark{display:grid;place-items:center;width:48px;height:48px;border:1px solid;border-radius:12px;font-weight:700}h1{margin:24px 0 4px;font-size:28px}p{color:#777}label{display:block;margin:32px 0 10px}input,button{box-sizing:border-box;font:inherit;width:100%;padding:12px;border:1px solid #aaa;border-radius:6px}button{margin-top:16px;background:#303c38;color:white;cursor:pointer}button:disabled{opacity:.6}#feedback{font-size:14px;line-height:1.6}@media(prefers-color-scheme:dark){:root{background:#1e2220;color:#e5e6e2}input{background:#282e2a;color:inherit}p{color:#adb5ae}}