:root{color-scheme:light dark;--bg: #f5f5f4;--surface: #ffffff;--surface-2: #e7e5e4;--border: #d6d3d1;--text: #1c1917;--text-muted: #57534e;--accent: #4f46e5;--accent-text: #ffffff;--in-tune: #15803d;--danger: #b91c1c;--radius: 12px;--tap: 48px;--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px)}@media(prefers-color-scheme:dark){:root{--bg: #1c1917;--surface: #292524;--surface-2: #3a3532;--border: #44403c;--text: #fafaf9;--text-muted: #a8a29e;--accent: #818cf8;--accent-text: #1c1917;--in-tune: #4ade80;--danger: #f87171}}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.4;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;overscroll-behavior:none}button,input,select{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.page{display:flex;flex-direction:column;min-height:100dvh;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left)}.page-header{display:flex;align-items:center;gap:4px;min-height:56px;padding:4px 8px}.page-header h1{flex:1;margin:0;font-size:1.15rem;font-weight:600}.page-content{flex:1;padding:8px 16px 24px}.icon-button{display:inline-flex;align-items:center;justify-content:center;min-width:var(--tap);min-height:var(--tap);padding:0;border:none;border-radius:50%;background:transparent}.icon-button:disabled{opacity:.35;cursor:default}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);padding:0 20px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);font-weight:500}.button.primary{border-color:var(--accent);background:var(--accent);color:var(--accent-text)}.button.danger{color:var(--danger)}.button:disabled{opacity:.45;cursor:default}.link-button{min-height:var(--tap);padding:0 8px;border:none;background:none;color:var(--accent);font-weight:500}.card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
