@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;700&family=Space+Grotesk:wght@400;500;700&display=swap";:root{--bg-main: radial-gradient(circle at 8% 0%, #e8f1ff 0%, #dbe7f7 35%, #cdd6e8 100%);--bg-grid: rgba(15, 23, 42, .05);--text-main: #0e1a2f;--text-muted: #3b4a63;--surface: rgba(245, 248, 255, .9);--surface-2: #f1f5ff;--card: #ffffff;--border: rgba(80, 103, 143, .28);--shadow: 0 18px 42px rgba(16, 30, 58, .16);--accent: #1e88ff;--accent-2: #00c2ff;--accent-strong: #0058c7;--good: #18d19f;--danger: #ff5f7c;font-family:Space Grotesk,sans-serif;line-height:1.45;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--text-main);background:var(--bg-main)}:root[data-theme=dark]{--bg-main: radial-gradient(circle at 8% 0%, #111827 0%, #070d1b 45%, #040810 100%);--bg-grid: rgba(52, 211, 255, .08);--text-main: #e6f1ff;--text-muted: #9cb0cc;--surface: rgba(8, 15, 30, .86);--surface-2: #0c1428;--card: #0a1223;--border: rgba(130, 164, 215, .24);--shadow: 0 18px 42px rgba(0, 0, 0, .5);--accent: #37b3ff;--accent-2: #6af0ff;--accent-strong: #1d8dff;--good: #22d3a9;--danger: #ff7890}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:var(--bg-main);position:relative}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(to right,var(--bg-grid) 1px,transparent 1px),linear-gradient(to bottom,var(--bg-grid) 1px,transparent 1px);background-size:36px 36px;-webkit-mask-image:radial-gradient(circle at 40% 20%,black 28%,transparent 86%);mask-image:radial-gradient(circle at 40% 20%,black 28%,transparent 86%)}h1,h2,h3,h4,button{font-family:Space Grotesk,sans-serif}button,label,small,span,select{font-family:JetBrains Mono,monospace}button{cursor:pointer;transition:transform .14s ease,box-shadow .2s ease,opacity .2s ease}button:hover{transform:translateY(-1px)}#root{max-width:1200px;margin:0 auto;padding:24px 18px 36px}.app-shell{display:grid;gap:20px;grid-template-columns:1fr}.checkin-panel,.results-panel{border-radius:20px;padding:22px;background:var(--surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border);box-shadow:var(--shadow);animation:breatheShadow 4.2s ease-in-out infinite}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.eyebrow{margin:0;text-transform:uppercase;letter-spacing:.1em;font-size:.74rem;color:var(--accent);font-weight:700}.theme-toggle{border:1px solid #cfd4df;border-radius:999px;background:#eef1f6;color:var(--text-main);padding:4px;width:112px;height:54px;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 8px 20px #13213a29}.theme-switch-track{width:100%;height:100%;position:relative;border-radius:999px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;color:#efab3e}.theme-icon{width:22px;height:22px;display:inline-grid;place-items:center;font-size:1.3rem;line-height:1;z-index:2}.theme-icon.moon{font-size:1.18rem}.theme-knob{position:absolute;top:50%;left:3px;width:40px;height:40px;border-radius:999px;background:#f2e4cb;border:6px solid #efab3e;transform:translateY(-50%);transition:transform .25s ease}.theme-toggle.is-dark .theme-knob{transform:translate(58px,-50%)}:root[data-theme=dark] .theme-toggle{border-color:#31415f;background:#131d31;box-shadow:0 8px 20px #0006}:root[data-theme=dark] .theme-switch-track{color:#efb65d}:root[data-theme=dark] .theme-knob{background:#20314f;border-color:#64d3ff}.friends-presence{border:1px solid var(--border);border-radius:12px;padding:10px;background:color-mix(in srgb,var(--surface-2) 90%,transparent)}.friends-presence p{margin:0 0 8px;color:var(--text-main);font-size:.78rem;font-weight:700}.friends-list{margin:0;padding-left:18px}.friends-list li{margin-bottom:5px}.friends-list span{display:block;font-size:.8rem;color:var(--text-main)}.friends-list small{color:var(--text-muted);font-size:.72rem}.friends-note{display:inline-block;margin-top:6px;color:var(--text-muted);font-size:.72rem}h1{margin:.35rem 0 .75rem;font-size:clamp(1.75rem,4vw,2.65rem);line-height:1.05;color:var(--text-main)}.subtitle{margin:0 0 1rem;color:var(--text-muted);max-width:58ch}label,span{color:var(--text-main);font-weight:600;font-size:.86rem}.time-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.time-input-wrap{display:inline-flex;align-items:center;gap:6px}.time-input{width:74px;height:34px;border-radius:8px;border:1px solid var(--border);background:color-mix(in srgb,var(--surface-2) 86%,transparent);color:var(--text-main);padding:0 8px}input[type=range]{width:100%;margin:8px 0 18px;accent-color:var(--accent)}.row-group{display:grid;gap:14px}.chip-row{display:flex;gap:8px;margin-top:8px}.chip-row.wrap{flex-wrap:wrap}.chip{border:1px solid var(--border);border-radius:999px;background:color-mix(in srgb,var(--surface-2) 88%,transparent);color:var(--text-main);padding:8px 14px;font-weight:700;font-size:.78rem}.chip.active{background:linear-gradient(120deg,var(--accent),var(--accent-2));color:#031129;border-color:transparent;box-shadow:0 8px 20px color-mix(in srgb,var(--accent) 45%,transparent)}.device-row{display:grid;gap:7px}select{height:40px;border-radius:10px;border:1px solid var(--border);padding:0 10px;background:color-mix(in srgb,var(--surface-2) 86%,transparent);color:var(--text-main)}.checkbox-row{display:flex;align-items:center;gap:9px;font-weight:600}.cta{margin-top:12px;width:100%;background:linear-gradient(120deg,var(--accent-strong),var(--accent-2));color:#f4fbff;border:0;border-radius:12px;height:44px;font-size:.84rem;font-weight:700;box-shadow:0 10px 26px color-mix(in srgb,var(--accent) 42%,transparent)}.cta:disabled{opacity:.72;cursor:not-allowed}.error-note{margin-top:12px;color:var(--danger);font-size:.86rem}.placeholder{color:var(--text-muted);margin:0}.top-pick-card{border-radius:16px;border:1px solid var(--border);background:var(--card);padding:16px;animation:rise .36s ease;box-shadow:0 10px 28px color-mix(in srgb,var(--accent) 16%,transparent)}.label{margin:0;font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:700}.top-pick-card img{width:100%;height:180px;object-fit:cover;border-radius:12px;margin-top:10px;border:1px solid var(--border)}.top-pick-card h2{margin:12px 0 6px;color:var(--text-main);font-size:1.35rem}.top-pick-card p{margin:0;color:var(--text-muted)}.meta-row{margin:12px 0;display:flex;gap:8px;flex-wrap:wrap}.meta-row span{font-size:.72rem;background:color-mix(in srgb,var(--surface-2) 90%,transparent);border-radius:999px;padding:6px 10px;border:1px solid var(--border);color:var(--text-main)}ul{margin:14px 0 0;padding-left:20px;color:var(--text-main);font-size:.9rem}.decision-row{display:flex;gap:10px;margin-top:16px}.decision-row button{flex:1;border-radius:10px;border:1px solid var(--border);background:color-mix(in srgb,var(--surface-2) 88%,transparent);color:var(--text-main);height:38px;font-weight:700;font-size:.78rem}.feedback{margin-top:10px;color:var(--good);font-weight:600;font-size:.84rem}.alt-list{margin-top:16px}.alt-list h3{margin:0 0 8px;color:var(--text-main)}.alt-card{display:grid;grid-template-columns:72px 1fr auto;gap:10px;align-items:center;padding:9px;border-radius:12px;background:var(--card);border:1px solid var(--border);margin-bottom:8px}.alt-card img{width:72px;height:54px;border-radius:8px;object-fit:cover;border:1px solid var(--border)}.alt-card h4{margin:0;color:var(--text-main);font-size:.94rem}.alt-card p,.alt-card small{margin:0;color:var(--text-muted);font-size:.78rem}.alt-card strong{color:var(--accent);font-size:.9rem}@keyframes rise{0%{transform:translateY(8px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes breatheShadow{0%{box-shadow:0 12px 30px #101e3a26}50%{box-shadow:0 20px 46px color-mix(in srgb,var(--accent) 24%,rgba(16,30,58,.18))}to{box-shadow:0 12px 30px #101e3a26}}@media(prefers-reduced-motion:reduce){.checkin-panel,.results-panel{animation:none}}@media(min-width:920px){.app-shell{grid-template-columns:430px 1fr;align-items:start}.checkin-panel,.results-panel{min-height:640px}}
