@import "https://fonts.googleapis.com/css2?family=Sora:wght@400;600;700&family=Space+Grotesk:wght@500;700&display=swap";:root{--canvas:#eef2f8;--panel:#fff;--panel-soft:#f2f6fd;--line:#c5d1e5;--ink:#334155;--ink-strong:#0f172a;--accent:#1d4ed8;--heading:"Space Grotesk", sans-serif;--body:"Sora", sans-serif}*{box-sizing:border-box}body{font-family:var(--body);color:var(--ink);background:radial-gradient(circle at 0% 0%, #2563eb24, transparent 34%), radial-gradient(circle at 100% 0%, #0e74901a, transparent 38%), var(--canvas);margin:0}#root{min-height:100vh}h1,h2,h3{color:var(--ink-strong);font-family:var(--heading);margin:0}h1{font-size:clamp(2rem,4vw,3.4rem);line-height:1.05}h2{font-size:clamp(1.2rem,3vw,1.6rem)}p{margin:0;line-height:1.55}.app-shell{min-height:100vh}.top-nav{border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:color-mix(in oklab, var(--canvas) 85%, #fff);z-index:10;justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex;position:sticky;top:0;box-shadow:0 18px 30px -28px #152a4aa6}.brand{color:var(--ink-strong);letter-spacing:.03em;font-size:1.1rem;font-weight:700;text-decoration:none}.top-nav nav{gap:.8rem;display:flex}.top-nav nav a{color:var(--ink);border-radius:999px;padding:.5rem .9rem;font-size:.95rem;text-decoration:none;transition:all .18s}.top-nav nav a:hover{background:color-mix(in oklab, var(--panel-soft) 76%, #fff);color:var(--ink-strong)}.page{max-width:1200px;margin:0 auto;padding:1.2rem}.landing-page{align-items:center;min-height:calc(100vh - 84px);display:grid}.panel{background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:1.3rem;box-shadow:0 24px 46px -38px #101e3875}.hero-panel{background:radial-gradient(circle at 20% 20%, #facc154d, transparent 40%), radial-gradient(circle at 75% 10%, #2dd4bf40, transparent 35%), var(--panel);border:1px solid var(--line);border-radius:28px;padding:clamp(1.5rem,4vw,4rem);box-shadow:0 20px 60px -36px #0c2c4280}.hero-panel-dark{color:#edf2ff;background:radial-gradient(circle at 12% 15%,#22d3ee38,#0000 33%),radial-gradient(circle at 82% 8%,#facc1529,#0000 28%),linear-gradient(160deg,#04070f 0%,#0c1325 58%,#101826 100%);border:1px solid #1f2b40;gap:1.25rem;display:grid}.hero-copy h1{color:#f8fafc;margin:0;font-size:clamp(1.9rem,5vw,3.4rem);line-height:1.05}.hero-panel-dark .hero-kicker{color:#22d3ee}.hero-panel-dark .hero-subtitle{color:#cbd5e1;margin-top:.8rem}.hero-panel-dark .button.ghost{color:#e2e8f0;border-color:#2b3d5a}.commute-anime{background:#0a1220;border:1px solid #2a3a56;border-radius:20px;overflow:hidden}.commute-anime svg{width:100%;height:auto;display:block}.anime-bg{fill:#060c17}.city-silhouette{fill:#16253d;opacity:.95}.office-door{fill:#0f172a}.workout-device{fill:#334155}.workout-screen{fill:#22d3ee;animation:12s ease-in-out infinite device-pulse}.commute-lane{stroke:#334155;stroke-width:6px;stroke-dasharray:12 12}.commute-ground{stroke:#1f2937;stroke-width:10px}.stick-head{fill:#fde047}.stick-part{stroke:#22d3ee;stroke-width:6px;stroke-linecap:round}.stickman-commute{animation:14s linear infinite commute-run}.stickman-exercise{transform-origin:50%;animation:14s linear infinite exercise-loop}.torso,.arm-left,.arm-right,.leg-left,.leg-right{animation:14s linear infinite limb-drive}@keyframes commute-run{0%{opacity:1;transform:translate(0)}12%{opacity:1;transform:translate(210px)}26%{opacity:1;transform:translate(390px)}42%{opacity:1;transform:translate(390px)}50%{opacity:.75;transform:translate(475px)}56%{opacity:0;transform:translate(475px)}62%{opacity:0;transform:translate(475px)}68%{opacity:.9;transform:translate(475px)}76%{opacity:1;transform:translate(390px)}88%{opacity:1;transform:translate(390px)}to{opacity:1;transform:translate(0)}}@keyframes exercise-loop{0%{transform:translateY(0)scaleY(1)}25%{transform:translateY(0)scaleY(1)}30%{transform:translateY(52px)scaleY(.45)}34%{transform:translateY(0)scaleY(1)}38%{transform:translateY(54px)scaleY(.42)}42%{transform:translateY(0)scaleY(1)}56%{transform:translateY(0)scaleY(1)}74%{transform:translateY(0)scaleY(1)}80%{transform:translateY(30px)scaleY(.78)}84%{transform:translateY(0)scaleY(1)}88%{transform:translateY(30px)scaleY(.78)}92%{transform:translateY(0)scaleY(1)}to{transform:translateY(0)scaleY(1)}}@keyframes limb-drive{0%{stroke:#22d3ee;stroke-width:6px}24%{stroke:#22d3ee;stroke-width:6px}44%{stroke:#f97316;stroke-width:6px}56%{stroke:#64748b;stroke-width:5px}72%{stroke:#22d3ee;stroke-width:6px}92%{stroke:#22d3ee;stroke-width:7px}to{stroke:#22d3ee;stroke-width:6px}}@keyframes device-pulse{0%{opacity:.65}30%{opacity:1}44%{opacity:.9}76%{opacity:1}to{opacity:.7}}.hero-kicker{text-transform:uppercase;letter-spacing:.12em;color:var(--accent);margin-bottom:.8rem;font-weight:700}.hero-subtitle{color:var(--ink);max-width:60ch;font-size:1.1rem}.hero-actions{flex-wrap:wrap;gap:.8rem;margin-top:1.2rem;display:flex}.button{font:inherit;cursor:pointer;border:1px solid #0000;border-radius:14px;justify-content:center;align-items:center;padding:.78rem 1.05rem;font-weight:600;text-decoration:none;transition:transform .15s,box-shadow .2s,background-color .2s;display:inline-flex}.button.primary{color:#fff;background:linear-gradient(135deg,#1d4ed8,#1e40af);box-shadow:0 14px 28px -20px #2563ebcc}.button.ghost{border:1px solid var(--line);color:var(--ink-strong);background:color-mix(in oklab, white 76%, var(--panel-soft))}.button-small{padding:.45rem .7rem;font-size:.85rem}.button.warn{color:#fff;background:#dc2626}.button:disabled{opacity:.6;cursor:not-allowed}.button:not(:disabled):hover{transform:translateY(-1px)}.button.primary:not(:disabled):hover{box-shadow:0 22px 30px -24px #2563ebe6}.form-panel{max-width:620px;margin:0 auto}.stack{gap:.9rem;margin-top:1rem;display:grid}label{color:var(--ink-strong);gap:.45rem;font-weight:600;display:grid}input{border:1px solid var(--line);font:inherit;background:#fff;border-radius:10px;padding:.65rem .7rem}.inline-link{color:var(--accent);margin-top:.9rem;display:inline-block}.challenge-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin-top:1rem;display:grid}.challenge-select-panel>h1,.challenge-select-panel>p{text-align:center}.challenge-card{border:1px solid var(--line);text-align:center;background:linear-gradient(160deg, color-mix(in oklab, #fff 90%, var(--panel-soft)), var(--panel-soft));border-radius:18px;justify-items:center;gap:.7rem;padding:1.05rem;display:grid;box-shadow:0 18px 28px -30px #19315680}.challenge-doodle{border:1px solid color-mix(in oklab, var(--line) 76%, #fff);background:#f8fbff;border-radius:16px;overflow:hidden}.challenge-video{border:1px solid color-mix(in oklab, var(--line) 76%, #fff);aspect-ratio:11/6;object-fit:cover;background:#0f172a;border-radius:16px;width:100%;display:block;overflow:hidden}.challenge-doodle svg{width:100%;height:auto;display:block}.doodle-bg{fill:#f7fbff}.doodle-ground{stroke:#bfccdd;stroke-width:4px}.doodle-head{fill:#f59e0b}.robot-head-shell{fill:#dbe5f1;stroke:#5b6b82;stroke-width:1.5px}.robot-visor{fill:#0ea5e9}.robot-torso{fill:#c7d4e6;stroke:#516177;stroke-width:1.5px}.robot-core{fill:#0ea5e9}.robot-pelvis{fill:#8fa2bb}.doodle-line{stroke:#2d4366;stroke-width:5.5px;stroke-linecap:round}.squat-body{transform-origin:110px 70px;animation:1.35s ease-in-out infinite squat-body-bob}.squat-arm-left{transform-origin:100px 52px;animation:1.35s ease-in-out infinite squat-arm-left}.squat-arm-right{transform-origin:120px 52px;animation:1.35s ease-in-out infinite squat-arm-right}.squat-leg-left{transform-origin:110px 70px;animation:1.35s ease-in-out infinite squat-leg-left}.squat-leg-right{transform-origin:110px 70px;animation:1.35s ease-in-out infinite squat-leg-right}.jj-body{transform-origin:110px 70px;animation:1.1s ease-in-out infinite jj-body-bounce}.jj-arm-left{transform-origin:100px 51px;animation:1.1s ease-in-out infinite jj-arm-left}.jj-arm-right{transform-origin:120px 51px;animation:1.1s ease-in-out infinite jj-arm-right}.jj-leg-left{transform-origin:110px 70px;animation:1.1s ease-in-out infinite jj-leg-left}.jj-leg-right{transform-origin:110px 70px;animation:1.1s ease-in-out infinite jj-leg-right}.points{color:var(--accent);font-weight:700}.workout-grid{grid-template-columns:minmax(700px,3fr) minmax(280px,1fr);gap:1.1rem;display:grid}.camera-wrapper{background:#111827;border-radius:18px;min-height:560px;max-height:72vh;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff14}.camera-feed{object-fit:cover;width:100%;height:100%;transform:scaleX(-1)}.camera-overlay{width:100%;height:100%;position:absolute;inset:0;transform:scaleX(-1)}.stats-panel{border:1px solid var(--line);background:var(--panel-soft);border-radius:18px;align-content:start;gap:.8rem;padding:1.05rem;display:grid}.hint{color:var(--ink);font-size:.9rem}.leaderboard-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;margin-block:1rem;display:grid}table{border-collapse:collapse;width:100%;margin-top:.6rem}th,td{border-bottom:1px solid var(--line);text-align:left;padding:.5rem .45rem;font-size:.95rem}th{color:var(--ink-strong)}.stats-cards{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.8rem;margin-top:1rem;display:grid}.stats-cards article{border:1px solid var(--line);background:var(--panel-soft);border-radius:14px;padding:.9rem}.metric{color:var(--accent);margin:0;font-size:2rem;font-weight:700}.admin-actions{flex-wrap:wrap;gap:.7rem;margin-top:1rem;display:flex}.settings-panel{border-style:dashed;margin-top:1rem}.settings-panel h3{margin-top:1rem}.settings-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.8rem;display:grid}.validation-list{color:#7f1d1d;background:#fef2f2;border:1px solid #fecaca;border-radius:12px;margin:.8rem 0 0;padding:.8rem 1rem}.field-error{color:#991b1b;margin-top:.25rem;font-size:.82rem;font-weight:600}.error{color:#b91c1c;font-weight:600}@keyframes squat-body-bob{0%,to{transform:translateY(0)}35%,65%{transform:translateY(12px)}}@keyframes squat-arm-left{0%,to{transform:rotate(0)}35%,65%{transform:rotate(34deg)}}@keyframes squat-arm-right{0%,to{transform:rotate(0)}35%,65%{transform:rotate(-34deg)}}@keyframes squat-leg-left{0%,to{transform:rotate(0)}35%,65%{transform:rotate(18deg)}}@keyframes squat-leg-right{0%,to{transform:rotate(0)}35%,65%{transform:rotate(-18deg)}}@keyframes jj-body-bounce{0%,to{transform:translateY(0)scaleY(1)}50%{transform:translateY(-8px)scaleY(1.03)}}@keyframes jj-arm-left{0%,to{transform:rotate(0)}50%{transform:rotate(120deg)}}@keyframes jj-arm-right{0%,to{transform:rotate(0)}50%{transform:rotate(-120deg)}}@keyframes jj-leg-left{0%,to{transform:rotate(0)}50%{transform:rotate(33deg)}}@keyframes jj-leg-right{0%,to{transform:rotate(0)}50%{transform:rotate(-33deg)}}.empty{color:var(--ink)}@media (width<=900px){.hero-panel-dark{padding:1.2rem}.anime-label{font-size:16px}.workout-grid{grid-template-columns:1fr}.camera-wrapper{min-height:400px;max-height:none}.top-nav{flex-direction:column;align-items:flex-start;gap:.6rem}.top-nav nav{flex-wrap:wrap}}
