@import "https://fonts.googleapis.com/css2?family=Outfit:wght@700;800&family=Plus+Jakarta+Sans:wght@400;500;700&display=swap";:root{--color-background:#fffdf5;--color-foreground:#1e293b;--color-muted:#f1f5f9;--color-muted-foreground:#64748b;--color-accent:#2563eb;--color-accent-foreground:#fff;--color-secondary:#f472b6;--color-tertiary:#fbbf24;--color-quaternary:#34d399;--color-border:#e2e8f0;--color-input:#fff;--color-card:#fff;--color-ring:#2563eb;--font-heading:"Outfit", system-ui, sans-serif;--font-body:"Plus Jakarta Sans", system-ui, sans-serif;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-full:9999px;--border-width:2px;--shadow-pop:4px 4px 0 0 var(--color-foreground);--shadow-pop-hover:6px 6px 0 0 var(--color-foreground);--shadow-pop-active:2px 2px 0 0 var(--color-foreground);--shadow-sticker-violet:8px 8px 0 0 #bfdbfe;--shadow-sticker-pink:8px 8px 0 0 #fec5e7;--shadow-sticker-yellow:8px 8px 0 0 #fde68a;--shadow-sticker-mint:8px 8px 0 0 #a7f3d0;--container-width:1120px;--ease-bounce:cubic-bezier(.34, 1.56, .64, 1);--transition-fast:.18s;--transition-normal:.3s}*{box-sizing:border-box}html,body,#root{min-height:100%}body{font-family:var(--font-body);background:radial-gradient(circle at 1px 1px, #1e293b14 1px, transparent 0) 0 0 / 24px 24px, radial-gradient(circle at 15% 10%, #fff7d6 0%, transparent 35%), radial-gradient(circle at 80% 0%, #ffe2f3 0%, transparent 30%), var(--color-background);color:var(--color-foreground);margin:0;line-height:1.6}a{color:inherit}h1,h2,h3{font-family:var(--font-heading);letter-spacing:-.02em;margin:0;line-height:1.15}p{margin:0}.app-shell{min-height:100vh;position:relative;overflow-x:clip}.app-shell__bg{z-index:0;border:var(--border-width) solid var(--color-foreground);opacity:.4;pointer-events:none;width:260px;height:260px;position:fixed}.app-shell__bg--yellow{background:var(--color-tertiary);border-radius:45% 55% 63% 37%;top:-100px;right:-70px}.app-shell__bg--mint{background:var(--color-quaternary);border-radius:45% 55% 44% 56%;bottom:6%;left:-120px}.top-nav{z-index:30;border-bottom:var(--border-width) solid var(--color-foreground);background:color-mix(in srgb, var(--color-background) 92%, #fff);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);position:sticky;top:0}.top-nav__inner{max-width:var(--container-width);background:0 0;justify-content:space-between;align-items:center;gap:12px;margin:0 auto;padding:14px 18px;display:flex}.brand{font-family:var(--font-heading);align-items:center;gap:9px;font-size:1.2rem;font-weight:800;text-decoration:none;display:inline-flex}.brand__dot{border-radius:var(--radius-sm);border:var(--border-width) solid var(--color-foreground);background:var(--color-tertiary);width:22px;height:22px;box-shadow:2px 2px 0 0 var(--color-foreground);transform:rotate(10deg)}.brand__tag{border:var(--border-width) solid color-mix(in srgb, var(--color-border) 85%, #94a3b8);border-radius:var(--radius-full);letter-spacing:.08em;text-transform:uppercase;color:var(--color-muted-foreground);background:#fff;margin-left:6px;padding:5px 10px;font-size:.66rem;font-weight:700}.top-nav__links{align-items:center;gap:8px;display:flex}.top-nav__link{border:var(--border-width) solid transparent;border-radius:var(--radius-full);transition:all var(--transition-fast) ease;padding:7px 14px;font-weight:600;text-decoration:none}.top-nav__link:hover,.top-nav__link--active{border-color:var(--color-foreground);background:color-mix(in srgb, var(--color-tertiary) 80%, #fff);box-shadow:3px 3px 0 0 color-mix(in srgb, var(--color-foreground) 28%, transparent)}.top-nav__actions{align-items:center;gap:10px;display:flex}.page-wrap{z-index:1;width:min(var(--container-width), calc(100% - 32px));margin:24px auto 80px;position:relative}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--color-muted-foreground);align-items:center;gap:8px;font-size:.78rem;font-weight:700;display:inline-flex}.lede{color:var(--color-muted-foreground);margin-top:12px}.muted{color:var(--color-muted-foreground)}.sticker-card{background:var(--color-card);border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-lg);transition:transform var(--transition-normal) var(--ease-bounce);padding:24px;position:relative}.sticker-card:hover{transform:rotate(-1deg)scale(1.01)}.sticker-card--violet{box-shadow:var(--shadow-sticker-violet)}.sticker-card--pink{box-shadow:var(--shadow-sticker-pink)}.sticker-card--yellow{box-shadow:var(--shadow-sticker-yellow)}.sticker-card--mint{box-shadow:var(--shadow-sticker-mint)}.btn{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-full);min-height:48px;font-family:var(--font-body);cursor:pointer;transition:transform var(--transition-fast) var(--ease-bounce), box-shadow var(--transition-fast) var(--ease-bounce), background var(--transition-fast) ease;justify-content:center;align-items:center;gap:8px;padding:10px 18px;font-size:.95rem;font-weight:700;display:inline-flex}.btn:disabled{opacity:.7;cursor:not-allowed}.btn--md{min-height:48px}.btn--sm{min-height:40px;padding:8px 14px}.btn--primary{background:var(--color-accent);color:var(--color-accent-foreground);box-shadow:var(--shadow-pop)}.btn--primary:not(:disabled):hover{box-shadow:var(--shadow-pop-hover);transform:translate(-2px,-2px)}.btn--primary:not(:disabled):active{box-shadow:var(--shadow-pop-active);transform:translate(2px,2px)}.btn--secondary{color:var(--color-foreground);background:0 0}.btn--secondary:hover{background:var(--color-tertiary)}.btn--ghost{background:var(--color-muted);color:var(--color-foreground);box-shadow:none}.btn--ghost:hover{background:var(--color-quaternary)}.btn__spinner{border:2px solid;border-right-color:#0000;border-radius:999px;width:16px;height:16px;animation:.9s linear infinite spin}.input-field{flex-direction:column;gap:6px;display:flex}.input-field__label{text-transform:uppercase;letter-spacing:.14em;color:var(--color-muted-foreground);font-size:.72rem;font-weight:700}.input-field__control{border-radius:var(--radius-md);border:var(--border-width) solid color-mix(in srgb, var(--color-border) 88%, #94a3b8);width:100%;min-height:48px;color:var(--color-foreground);background:var(--color-input);transition:border-color var(--transition-fast) ease, box-shadow var(--transition-fast) ease;padding:12px 14px;font-family:inherit;font-size:.95rem}.input-field__control:focus-visible{border-color:var(--color-ring);box-shadow:4px 4px 0 0 var(--color-ring);outline:none}.input-field--error .input-field__control{border-color:#f43f5e}.input-field__error,.input-field__hint{font-size:.82rem}.input-field__error{color:#e11d48}.input-field__hint{color:var(--color-muted-foreground)}.form-message{border-radius:var(--radius-md);border:var(--border-width) solid var(--color-foreground);padding:10px 12px;font-size:.9rem}.sticker-card>.form-message{margin-top:12px}.form-message--error{color:#9f1239;background:#ffe4e6}.form-message--success{color:#166534;background:#dcfce7}.auth-page,.quiz-page,.room-page,.result-page{place-items:center;display:grid}.auth-card{width:min(620px,100%)}.auth-page__decor{border:var(--border-width) dashed var(--color-foreground);background:repeating-linear-gradient(-45deg, color-mix(in srgb, var(--color-secondary) 45%, transparent) 0, color-mix(in srgb, var(--color-secondary) 45%, transparent) 8px, transparent 8px, transparent 16px);z-index:-1;border-radius:999px;width:220px;height:220px;position:absolute;top:180px;left:max(0px,50% - 450px)}.auth-page__decor--right{background:repeating-linear-gradient(45deg, color-mix(in srgb, var(--color-quaternary) 45%, transparent) 0, color-mix(in srgb, var(--color-quaternary) 45%, transparent) 8px, transparent 8px, transparent 16px);left:auto;right:max(0px,50% - 450px)}.auth-form{gap:14px;margin-top:16px;display:grid}.auth-card__footer{color:var(--color-muted-foreground);margin-top:18px}.auth-card__footer a{color:var(--color-accent);font-weight:700}.home-page{gap:22px;display:grid}.hero-grid{grid-template-columns:1.35fr 1fr;gap:20px;display:grid}.hero-panel h1{margin-top:10px;font-size:clamp(1.9rem,4.2vw,3rem)}.hero-panel__actions,.join-room-box,.quiz-actions,.room-actions,.result-actions{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}.home-side-column{gap:16px;display:grid}.stats-grid{grid-template-columns:1fr 1fr;gap:12px;margin-top:14px;display:grid}.stats-grid div{border:var(--border-width) solid var(--color-border);border-radius:var(--radius-md);background:var(--color-muted);padding:10px}.stats-grid span{text-transform:uppercase;letter-spacing:.08em;color:var(--color-muted-foreground);font-size:.75rem;display:block}.stats-grid strong{font-size:1.1rem;font-family:var(--font-heading)}.stats-rank{align-items:center;gap:8px;margin-top:14px;display:inline-flex}.leaderboard-mini{gap:8px;margin:14px 0 0;padding:0;list-style:none;display:grid}.leaderboard-mini li{border:var(--border-width) solid var(--color-border);border-radius:var(--radius-md);background:color-mix(in srgb, var(--color-muted) 80%, transparent);justify-content:space-between;align-items:center;padding:10px 12px;display:flex}.leaderboard-mini li a{font-weight:700;text-decoration:none}.leaderboard-mini li a:hover{text-decoration:underline}.leaderboard-mini--room li strong{color:var(--color-accent)}.leaderboard-page{display:grid}.leaderboard-card{width:min(1024px,100%)}.leaderboard-table-wrap{border:var(--border-width) solid var(--color-border);border-radius:var(--radius-md);background:#fff;margin-top:16px;overflow-x:auto}.leaderboard-table{border-collapse:collapse;width:100%;min-width:680px}.leaderboard-table th,.leaderboard-table td{text-align:left;border-bottom:1px solid var(--color-border);padding:10px 12px}.leaderboard-table th{background:color-mix(in srgb, var(--color-muted) 70%, #fff);text-transform:uppercase;letter-spacing:.06em;font-size:.8rem}.leaderboard-table td a{font-weight:700;text-decoration:none}.leaderboard-table td a:hover{text-decoration:underline}.leaderboard-pagination{justify-content:space-between;align-items:center;gap:10px;margin-top:14px;display:flex}.quiz-card,.room-page__panel,.result-card{width:min(980px,100%)}.quiz-card__header,.room-page__header{justify-content:space-between;align-items:center;gap:10px;display:flex}.room-id-copy{color:var(--color-foreground);font-family:var(--font-heading);letter-spacing:-.02em;cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:8px;margin-top:2px;padding:0;font-size:clamp(1.5rem,3.4vw,2.2rem);font-weight:800;line-height:1.15;display:inline-flex}.room-id-copy span{overflow-wrap:anywhere}.room-id-copy:hover:not(:disabled){text-decoration:underline;text-decoration-thickness:2px}.room-id-copy:focus-visible{outline:2px solid var(--color-foreground);outline-offset:3px;border-radius:var(--radius-sm)}.room-id-copy:disabled{cursor:not-allowed;opacity:.65}.timer-pill,.room-status{border-radius:var(--radius-full);border:var(--border-width) solid var(--color-foreground);background:var(--color-tertiary);align-items:center;gap:6px;padding:6px 12px;font-weight:700;display:inline-flex}.quiz-progress{border-radius:var(--radius-full);border:var(--border-width) solid var(--color-foreground);background:var(--color-muted);height:12px;margin-top:16px;overflow:hidden}.quiz-progress__bar{border-radius:inherit;background:repeating-linear-gradient(90deg, var(--color-accent), var(--color-accent) 8px, color-mix(in srgb, var(--color-secondary) 90%, white) 8px, color-mix(in srgb, var(--color-secondary) 90%, white) 16px);height:100%;transition:width var(--transition-normal) ease}.option-grid{gap:10px;margin-top:16px;display:grid}.option-tile{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-md);background:var(--color-input);color:var(--color-foreground);text-align:left;cursor:pointer;transition:all var(--transition-fast) ease;justify-content:space-between;align-items:center;padding:14px;font-family:inherit;font-weight:600;display:flex}.option-tile:hover:not(:disabled){background:color-mix(in srgb, var(--color-secondary) 20%, var(--color-input))}.option-tile--selected{background:color-mix(in srgb, var(--color-accent) 20%, var(--color-input));box-shadow:4px 4px 0 0 color-mix(in srgb, var(--color-accent) 75%, #0f172a)}.option-tile--locked{opacity:.85}.room-grid{grid-template-columns:1.3fr 1fr;gap:16px;margin-top:16px;display:grid}.room-grid__right{gap:14px;display:grid}.player-list{gap:8px;margin:12px 0 0;padding:0;list-style:none;display:grid}.player-list li{border:var(--border-width) solid var(--color-border);border-radius:var(--radius-md);background:var(--color-muted);justify-content:space-between;align-items:center;padding:10px;display:flex}.offline-banner{border:var(--border-width) solid #f97316;border-radius:var(--radius-md);color:#9a3412;background:#fff7ed;align-items:center;gap:8px;margin-top:12px;padding:8px 10px;display:inline-flex}.status-dot{border:1px solid var(--color-foreground);background:#ef4444;border-radius:999px;width:10px;height:10px}.status-dot--on{background:#22c55e}.result-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px;display:grid}.result-grid div{border-radius:var(--radius-md);border:var(--border-width) solid var(--color-foreground);background:var(--color-muted);padding:12px}.result-grid span{text-transform:uppercase;letter-spacing:.12em;color:var(--color-muted-foreground);font-size:.78rem;display:block}.result-grid strong{font-size:1.25rem;font-family:var(--font-heading)}.result-board{margin-top:16px}.route-spinner-wrap{place-items:center;gap:12px;min-height:60vh;display:grid}.spinner{border:4px solid var(--color-foreground);border-right-color:#0000;border-radius:999px;width:32px;height:32px;animation:.8s linear infinite spin}.global-loading{z-index:999;background:linear-gradient(90deg, var(--color-secondary), var(--color-accent), var(--color-tertiary));opacity:0;width:0;height:4px;transition:width .4s,opacity .16s;position:fixed;top:0;left:0}.global-loading--visible{opacity:1;width:100%}.landing-page{gap:28px;display:grid}.landing-hero{background:radial-gradient(circle at 22% 16%,#fff5a7 0,#0000 35%),radial-gradient(circle at 82% 80%,#d6ecff 0,#0000 40%),#fff;grid-template-columns:1.25fr 1fr;align-items:stretch;gap:22px;padding-top:30px;display:grid;position:relative;overflow:hidden}.landing-hero h1{margin-top:8px;font-size:clamp(2.4rem,4.7vw,4rem);line-height:1.1}.landing-hero__copy{z-index:2;position:relative}.landing-kicker{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-sm);font-family:var(--font-heading);letter-spacing:.05em;text-transform:uppercase;background:var(--color-tertiary);box-shadow:4px 4px 0 0 var(--color-foreground);margin-bottom:14px;padding:9px 14px;font-size:.86rem;display:inline-block;transform:rotate(-2.3deg)}.landing-hero__actions{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}.landing-hero__media{z-index:2;grid-template-rows:1fr auto auto auto;align-self:stretch;gap:10px;display:grid;position:relative}.landing-hero__media-frame{border:var(--border-width) solid var(--color-foreground);background:linear-gradient(150deg,#ebedf4,#d7dbe8);border-radius:36px 36px 30px 30px;min-height:290px;position:relative;overflow:hidden}.landing-hero__media-frame:before,.landing-hero__media-frame:after{content:"";border:var(--border-width) solid var(--color-foreground);pointer-events:none;position:absolute}.landing-hero__media-frame:before{background:color-mix(in srgb, var(--color-secondary) 82%, #fff);border-radius:16px;width:70px;height:70px;top:42px;right:-20px}.landing-hero__media-frame:after{background:color-mix(in srgb, var(--color-tertiary) 88%, #fff);border-radius:999px;width:68px;height:68px;bottom:30px;left:-22px}.landing-hero__media-avatar{border:var(--border-width) solid var(--color-foreground);background:#fde047;border-radius:28px;justify-content:center;align-items:center;display:flex;position:absolute;inset:20px;box-shadow:inset 0 -6px #0000001a}.landing-hero__media-overlay{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-md);color:#f8fafc;background:#0f172ae6;padding:8px 10px;position:absolute;bottom:16px;left:18px;right:18px}.landing-hero__media-overlay span{text-transform:uppercase;letter-spacing:.1em;color:#cbd5e1;font-size:.72rem;display:block}.landing-hero__media-overlay strong{font-family:var(--font-heading);font-size:1rem}.landing-hero__stat-card{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-md);transition:transform var(--transition-fast) var(--ease-bounce);background:#fff;padding:10px 12px}.landing-hero__stat-card:hover{transform:translate(-2px,-2px)}.landing-hero__stat-card span{color:var(--color-muted-foreground);text-transform:uppercase;letter-spacing:.08em;font-size:.76rem;display:block}.landing-hero__ring{border:4px solid color-mix(in srgb, var(--color-secondary) 44%, #fff);pointer-events:none;border-radius:999px;width:112px;height:112px;position:absolute;top:72px;left:-24px}.landing-hero__shape{z-index:1;border:var(--border-width) solid var(--color-foreground);pointer-events:none;position:absolute}.landing-hero__shape--pink{background:color-mix(in srgb, var(--color-secondary) 70%, #fff);border-radius:40% 60% 56% 44%;width:130px;height:130px;top:-56px;right:44%}.landing-hero__shape--blue{background:color-mix(in srgb, var(--color-accent) 42%, #fff);border-radius:50% 50% 20% 80%;width:104px;height:104px;bottom:-34px;right:-38px}.landing-hero__chips{flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;list-style:none;display:flex}.landing-hero__chips li{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-full);background:#fff;padding:6px 12px;font-size:.82rem;font-weight:600}.landing-hero__burst{border:var(--border-width) solid var(--color-foreground);letter-spacing:.08em;background:var(--color-tertiary);box-shadow:3px 3px 0 0 var(--color-foreground);border-radius:100px 100px 100px 16px;justify-self:end;margin-top:4px;padding:6px 14px;font-size:.76rem;font-weight:800}.landing-marquee{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-full);background:linear-gradient(90deg,#fff,#eaf3ff);align-items:center;height:46px;display:flex;position:relative;overflow:hidden}.landing-marquee span{white-space:nowrap;letter-spacing:.18em;color:color-mix(in srgb, var(--color-foreground) 88%, #334155);padding-left:100%;font-size:.83rem;font-weight:800;animation:20s linear infinite landing-marquee}.landing-section{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-lg);background:radial-gradient(circle at 1px 1px,#1e293b17 1px,#0000 0) 0 0/18px 18px,#fffef8;padding:24px}.landing-section h2{text-align:center;font-size:clamp(1.9rem,3.7vw,3rem)}.landing-section__badge{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-sm);width:fit-content;font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.08em;color:#f8fafc;background:var(--color-secondary);box-shadow:4px 4px 0 0 var(--color-foreground);margin:0 auto 10px;padding:8px 14px;font-size:.84rem;transform:rotate(1.4deg)}.landing-section__badge--light{color:var(--color-accent);background:color-mix(in srgb, var(--color-accent) 12%, #fff);border-color:color-mix(in srgb, var(--color-accent) 45%, #1e293b);box-shadow:4px 4px 0 0 color-mix(in srgb, var(--color-accent) 22%, #94a3b8)}.landing-section__sub{text-align:center;max-width:720px;color:var(--color-muted-foreground);margin:10px auto 0;font-size:1.05rem}.landing-feature-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px;display:grid}.landing-feature{padding-top:56px;position:relative;overflow:hidden}.landing-feature h3{font-size:1.45rem}.landing-feature__icon{border:var(--border-width) solid var(--color-foreground);background:color-mix(in srgb, var(--color-secondary) 80%, #fff);border-radius:999px;place-items:center;width:44px;height:44px;display:grid;position:absolute;top:16px;left:18px}.landing-feature__corner{border:var(--border-width) solid var(--color-foreground);border-radius:8px 8px 8px 0;width:24px;height:24px;position:absolute;top:10px;right:10px}.landing-feature__corner--violet{background:var(--color-accent)}.landing-feature__corner--pink{background:#ec4899}.landing-feature__corner--yellow{background:#fbbf24}.landing-feature__corner--mint{background:#34d399}.landing-section--steps{background:#fffef8}.landing-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:28px 0 0;padding:0;list-style:none;display:grid;position:relative}.landing-steps:before{content:"";border-top:3px dashed color-mix(in srgb, var(--color-accent) 20%, #64748b);position:absolute;top:39px;left:8%;right:8%}.landing-steps li{text-align:center;z-index:2;position:relative}.landing-steps__index{border:var(--border-width) solid var(--color-foreground);width:76px;height:76px;font-family:var(--font-heading);color:var(--color-accent);background:#fff;border-radius:999px;place-items:center;margin:0 auto 12px;font-size:2rem;display:grid}.landing-steps h3{font-size:1.6rem}.landing-steps p{color:var(--color-muted-foreground);margin-top:8px}.landing-value{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-lg);background:#f5f9ff;grid-template-columns:1.1fr .9fr;gap:20px;padding:24px;display:grid}.landing-value__copy h2{margin-top:8px;font-size:clamp(1.8rem,3.4vw,2.7rem)}.landing-value__copy p{color:#475569;margin-top:12px;font-size:1.03rem}.landing-value__copy blockquote{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-md);color:#334155;background:#fff;margin:18px 0 0;padding:14px;font-style:italic}.landing-value__art{min-height:290px;position:relative}.landing-value__circle{border:var(--border-width) solid var(--color-foreground);background:#f8fafc;border-radius:999px;width:210px;height:210px;position:absolute;top:4px;right:10px}.landing-value__circle:after{content:"";background:#1e293b;border-radius:999px;width:42px;height:42px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.landing-value__square{border:var(--border-width) solid var(--color-foreground);background:#fbbf24;width:78px;height:78px;position:absolute;top:158px;right:170px;transform:rotate(12deg)}.landing-value__card{border:var(--border-width) solid var(--color-foreground);background:#f8fafc;border-radius:24px;width:230px;height:170px;position:absolute;bottom:14px;left:24px}.landing-value__card span{background:#1e293b;width:54px;height:54px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(45deg)}.landing-value__pill{border:var(--border-width) solid var(--color-foreground);background:var(--color-accent);border-radius:999px;width:114px;height:114px;position:absolute;bottom:118px;left:200px}.app-footer{color:#f8fafc;background:#1e2b45;margin-top:40px;padding:58px 0 22px;position:relative}.app-footer__wave{pointer-events:none;height:60px;position:absolute;top:-59px;left:0;right:0;overflow:hidden}.app-footer__inner{width:min(var(--container-width), calc(100% - 32px));grid-template-columns:1.2fr repeat(3,minmax(0,1fr));gap:24px;margin:0 auto;padding:0;display:grid}.app-footer__brand-block{max-width:260px}.app-footer__brand{font-family:var(--font-heading);color:#fff;font-size:2rem;font-weight:800}.app-footer__tagline{color:#94a3b8;margin-top:10px;font-size:1.05rem}.app-footer__column{align-content:start;gap:8px;display:grid}.app-footer__column h3{color:var(--color-accent);margin:0 0 4px;font-size:1.1rem}.app-footer__column a{color:#e2e8f0;width:fit-content;transition:border-color var(--transition-fast) ease;border-bottom:1px solid #0000;text-decoration:none}.app-footer__column a:hover{border-color:#fbbf24}.app-footer__meta{color:#94a3b8;border-top:1px solid #94a3b84d;grid-column:1/-1;margin-top:10px;padding-top:16px;font-size:.82rem;font-weight:700}.profile-page{gap:16px;display:grid}.profile-grid{grid-template-columns:1fr 1.2fr;gap:16px;display:grid}.profile-card{width:100%}.profile-card--identity{align-content:start;gap:10px;display:grid}.profile-avatar-wrap{justify-content:start;display:grid}.profile-avatar{border:var(--border-width) solid var(--color-foreground);object-fit:cover;background:var(--color-muted);border-radius:999px;width:112px;height:112px}.profile-avatar--placeholder{place-items:center;display:grid}.profile-avatar-controls{gap:10px;display:grid}.profile-avatar-input{border:var(--border-width) dashed var(--color-border);border-radius:var(--radius-md);width:100%;font-family:var(--font-body);color:var(--color-muted-foreground);cursor:pointer;background:#fff;padding:10px 12px}.profile-avatar-input::file-selector-button{border:var(--border-width) solid var(--color-foreground);border-radius:var(--radius-full);background:var(--color-quaternary);color:var(--color-foreground);font-family:var(--font-body);cursor:pointer;transition:transform var(--transition-fast) var(--ease-bounce);margin-right:10px;padding:8px 14px;font-weight:700}.profile-avatar-input:hover::file-selector-button{transform:translate(-1px,-1px)}.profile-avatar-input:focus-visible{border-color:var(--color-ring);box-shadow:4px 4px 0 0 var(--color-ring);outline:none}.profile-switch-link{color:var(--color-accent);font-family:var(--font-body);cursor:pointer;text-underline-offset:3px;background:0 0;border:0;width:fit-content;padding:0;font-size:.92rem;font-weight:700;text-decoration:underline}.profile-switch-link:hover{color:color-mix(in srgb, var(--color-accent) 80%, #0f172a)}.legal-page{place-items:center;display:grid}.legal-card{width:min(920px,100%)}.legal-updated{margin-top:6px}.legal-content{gap:10px;margin-top:18px;display:grid}.legal-content h2{margin-top:8px;font-size:1.25rem}.legal-content p{color:var(--color-muted-foreground)}.profile-form{gap:12px;margin-top:10px;display:grid}.achievement-list{gap:8px;margin:14px 0 0;padding:0;list-style:none;display:grid}.achievement-list li{border:var(--border-width) solid var(--color-border);border-radius:var(--radius-md);background:var(--color-muted);justify-content:space-between;align-items:center;padding:10px 12px;display:flex}@keyframes spin{to{transform:rotate(360deg)}}@keyframes landing-marquee{to{transform:translate(-100%)}}@media (width<=960px){.top-nav__inner{flex-wrap:wrap;justify-content:space-between;padding:12px 14px}.top-nav__links{flex-wrap:wrap;order:3;justify-content:center;width:100%}.page-wrap{width:calc(100% - 24px);margin:18px auto 56px}.hero-grid,.landing-hero,.landing-feature-grid,.profile-grid,.room-grid,.result-grid{grid-template-columns:1fr}.leaderboard-pagination{flex-direction:column;align-items:stretch}.sticker-card{box-shadow:4px 4px 0 0 color-mix(in srgb, var(--color-foreground) 30%, transparent);padding:18px}.brand{flex-wrap:wrap;justify-content:flex-start}.brand__tag{margin-left:0}.btn{width:100%}.hero-panel__actions,.landing-hero__actions,.landing-hero__chips,.join-room-box,.quiz-actions,.room-actions,.result-actions{flex-direction:column}.landing-hero__shape,.landing-hero__ring,.landing-marquee{display:none}.landing-hero__chips li{width:100%}.landing-steps{grid-template-columns:1fr;gap:14px}.landing-steps:before{display:none}.landing-value{grid-template-columns:1fr}.landing-value__art{min-height:220px}.app-footer{padding-top:42px}.app-footer__wave{height:40px;top:-39px}.app-footer__inner{grid-template-columns:1fr;gap:14px;width:calc(100% - 24px)}.app-footer__meta{margin-top:2px}.app-shell__bg{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}