:root{--night: #1b2440;--sky: #2f6fdb;--sky-deep: #1f4fa8;--lamp-gold: #f2a93b;--gold-text: #7a4e06;--ivory: #fff3da;--surface: #f3f6fa;--card: #ffffff;--muted: #55607a;--line: #e1e7f0;--sky-tint: #e3ecfb;--gold-tint: #fdf1dc;--family: #a15f00;--family-bg: #fbf6ec;--couples: #a8324a;--kids: #17794d;--kids-tint: #e2f3ea;--kids-bg: #eaf6ef;--puzzle: #5b3fb8;--puzzle-tint: #efebfb;--teal: #0b6b63;--teal-tint: #ddf1ee;--wrong-tint: #fbe8e5;--radius: 16px;font-family:Nunito,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--night);-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--surface)}button{font-family:inherit}a{color:var(--sky-deep)}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}.app{min-height:100%;max-width:480px;margin:0 auto;display:flex;flex-direction:column;background:var(--surface)}.screen{flex:1;min-height:100vh;min-height:100dvh;width:100%;max-width:480px;margin:0 auto;display:flex;flex-direction:column;gap:16px;padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));animation:slide-in .22s ease-out}@keyframes slide-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.grow{flex:1}.row{display:flex;align-items:center;gap:12px}.between{justify-content:space-between}.stack{display:flex;flex-direction:column;gap:10px}.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}h1{margin:0;font-size:26px;font-weight:900;line-height:1.15;text-wrap:balance}h2{margin:0;font-size:18px;font-weight:900}p{margin:0;line-height:1.5}.muted{color:var(--muted)}.small{font-size:13px}.center{text-align:center}.card{background:var(--card);border-radius:20px;padding:16px}.pill{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:6px 10px;font-size:14px;font-weight:800}.btn{min-height:56px;border-radius:var(--radius);border:none;background:var(--sky);color:#fff;font-size:18px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 18px;cursor:pointer;text-decoration:none;width:100%}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.45;cursor:default}.btn.secondary{background:var(--card);color:var(--night);border:1.5px solid #c9d3e3;font-size:16px;min-height:48px}.btn.dark{background:var(--night)}.btn.family{background:var(--family)}.btn.kids{background:var(--kids)}.btn.puzzle{background:var(--puzzle)}.linkbtn{background:none;border:none;color:var(--sky-deep);font-size:15px;font-weight:800;min-height:44px;cursor:pointer;padding:0 4px}.iconbtn{width:44px;height:44px;flex-shrink:0;border-radius:12px;border:none;background:var(--card);display:flex;align-items:center;justify-content:center;cursor:pointer}:focus-visible{outline:3px solid var(--lamp-gold);outline-offset:2px}.option{min-height:58px;border-radius:var(--radius);border:2px solid var(--line);background:var(--card);font-size:18px;font-weight:800;color:var(--night);text-align:left;padding:10px 18px;cursor:pointer;display:flex;align-items:center;gap:10px;width:100%}.option.right{border-color:var(--kids);background:var(--kids-tint)}.option.wrong{border-color:#d8b9b3;background:var(--wrong-tint)}.option.dim{opacity:.55}.input{height:52px;border-radius:12px;border:1.5px solid #c9d3e3;background:var(--card);padding:0 14px;font-family:inherit;font-size:17px;color:var(--night);width:100%}label.lbl{font-size:14px;font-weight:800}.tile{min-height:92px;border-radius:18px;background:var(--card);padding:12px 8px 10px;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--night);box-shadow:0 1px 2px #1b24400f}.tile .ic{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center}.tile span.t{font-size:13.5px;font-weight:900;line-height:1.15;text-align:center}.nav{position:sticky;bottom:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--card);border-top:1px solid var(--line);padding:8px 8px max(12px,env(safe-area-inset-bottom))}.nav button{min-height:48px;background:none;border:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:12px;font-weight:700;color:var(--muted);cursor:pointer}.nav button.on{color:var(--sky-deep);font-weight:900}.bar{height:10px;border-radius:999px;background:var(--line);overflow:hidden}.bar>div{height:100%;border-radius:999px;background:var(--sky);transition:width .25s ease-out}.avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;flex-shrink:0}.toast{position:fixed;left:50%;bottom:96px;transform:translate(-50%);background:var(--night);color:#fff;padding:10px 16px;border-radius:999px;font-weight:800;font-size:14px;z-index:20}.pop{animation:pop .26s ease-out}@keyframes pop{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#1b24408c;display:flex;align-items:flex-end;justify-content:center;z-index:30}.sheet{width:100%;max-width:480px;background:var(--card);border-radius:28px 28px 0 0;padding:12px 20px max(24px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px;animation:slide-in .22s ease-out}.pin{-webkit-text-security:disc;text-security:disc}.admin{max-width:860px;margin:0 auto;padding:20px 16px 80px;min-height:100dvh;background:var(--bg, #F3F6FA)}.admin-tabs{gap:6px;flex-wrap:wrap}.admin-tab{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;border:2px solid var(--line);background:var(--card);font:inherit;font-weight:800;color:inherit;cursor:pointer}.admin-tab.on{border-color:var(--sky);background:#e3ecfb}.admin-count{background:var(--sky);color:#fff;border-radius:999px;font-size:12px;padding:1px 7px}.tile.modetile{padding:8px 8px 10px;gap:6px;justify-content:flex-start;min-height:108px;transition:transform .16s ease-out,box-shadow .16s ease-out}.modeart{width:100%;height:auto;aspect-ratio:120 / 72;border-radius:12px;display:block;overflow:hidden}.modeart .mv{transition:transform .26s cubic-bezier(.3,1.6,.5,1);transform-box:fill-box;transform-origin:center}.tile.modetile:active{transform:scale(.96)}.tile.modetile:active .modeart .mv,.tile.modetile:focus-visible .modeart .mv{transform:translateY(-3px) scale(1.12) rotate(-4deg)}@media(hover:hover){.tile.modetile:hover{transform:translateY(-2px);box-shadow:0 6px 16px #1b24401f}.tile.modetile:hover .modeart .mv{transform:translateY(-2px) scale(1.06)}}.intro-art{border-radius:22px}html[data-theme=evening]{--surface: #e6d9c4;--card: #d6c6ab;--line: #c2b090;--muted: #564c3c;background:#e6d9c4;filter:invert(1) hue-rotate(180deg) sepia(.18);color-scheme:light}html[data-theme=evening] body{background:#e6d9c4}html[data-theme=evening] svg:not([viewBox="0 0 24 24"]),html[data-theme=evening] img,html[data-theme=evening] video{filter:invert(1) hue-rotate(180deg);opacity:.9}html[data-theme=evening] svg:not([viewBox="0 0 24 24"]) svg,html[data-theme=evening] svg:not([viewBox="0 0 24 24"]) img{filter:none;opacity:1}html[data-theme=evening] .sheet-backdrop{background:#e2d8c49e}html[data-theme=evening] .tile,html[data-theme=evening] .card,html[data-theme=evening] .tile.modetile:hover{box-shadow:none}.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;background:var(--surface);border-radius:14px;padding:4px}.seg button{min-height:44px;border:none;border-radius:10px;background:none;font-weight:800;font-size:15px;color:var(--muted);cursor:pointer}.seg button.on{background:var(--card);color:var(--night);box-shadow:0 1px 3px #1b244026}.screen{animation:unroll .21s cubic-bezier(.2,.8,.3,1)}@keyframes unroll{0%{opacity:0;clip-path:inset(0 0 35% 0 round 0 0 24px 24px);transform:translateY(-4px)}to{opacity:1;clip-path:inset(0 0 0 0 round 0);transform:none}}.celebration{position:relative;border-radius:24px;overflow:hidden}.cel-people{position:absolute;left:0;right:0;bottom:8px;display:flex;justify-content:space-between;align-items:flex-end;padding:0 22px;pointer-events:none}.cel-avatar,.cel-lumi{transition:transform .3s ease-out;display:inline-flex}.cel-caption{position:absolute;top:12px;left:0;right:0;text-align:center;color:#fff;font-weight:900;font-size:22px;text-shadow:0 2px 8px rgba(27,20,10,.45);padding:0 12px}.cel-flame{transform-box:fill-box;transform-origin:50% 100%;animation:flicker 1.6s ease-in-out infinite}@keyframes flicker{0%,to{transform:scale(1)}50%{transform:scale(.94,1.06)}}.medal{position:relative;display:inline-block;flex-shrink:0}.medal svg{display:block;overflow:visible}.medal-icon{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center}.medal-sheen{position:absolute;left:50%;transform:translate(-50%);border-radius:50%;overflow:hidden;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 45%,transparent 60%) no-repeat;background-size:250% 100%;background-position:var(--sx, 120%) 0;animation:sheen 4.5s ease-in-out infinite;mix-blend-mode:screen}@keyframes sheen{0%,60%{background-position:140% 0}85%,to{background-position:-60% 0}}.badge-tile{position:relative;gap:4px}.badge-tile .medal.earned{filter:drop-shadow(0 2px 3px rgba(27,36,64,.18))}.badge-new{position:absolute;top:6px;right:6px;background:var(--lamp-gold);color:#3a2400;font-size:11px;font-weight:900;border-radius:999px;padding:2px 7px}.medal-stage{position:relative;display:flex;flex-direction:column;align-items:center;perspective:600px;touch-action:none;padding-top:6px}.medal-tilt{transform:rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));transition:transform .12s ease-out;transform-style:preserve-3d}.medal-stage.sway .medal-tilt{animation:sway 3.6s ease-in-out infinite}.medal-stage.sway:hover .medal-tilt{animation:none}@keyframes sway{0%,to{transform:rotateY(-10deg) rotateX(2deg)}50%{transform:rotateY(10deg) rotateX(-2deg)}}.unlock-lamp{margin-top:-6px}.unlock-lamp .ul-flame{transform-box:fill-box;transform-origin:50% 100%;animation:flicker 1.6s ease-in-out infinite}.medal-stage.unlocking .medal{animation:medal-rise 1.3s cubic-bezier(.2,.9,.3,1.2) both}.medal-stage.unlocking .ul-flame{animation:lamp-light .7s .15s ease-out both,flicker 1.6s .85s ease-in-out infinite}.medal-stage.unlocking .ul-glow{animation:glow-grow 1.1s .3s ease-out both;transform-box:fill-box;transform-origin:center}@keyframes medal-rise{0%{filter:grayscale(1) brightness(.55);transform:translateY(16px) scale(.8)}45%{filter:grayscale(.6) brightness(.8)}to{filter:none;transform:none}}@keyframes lamp-light{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes glow-grow{0%{transform:scale(.2);opacity:0}60%{transform:scale(1.5);opacity:1}to{transform:scale(1);opacity:1}}.unlock-title{color:#a15f00;font-size:15px;letter-spacing:.06em;text-transform:uppercase;animation:pop .4s .7s both}.scene{position:relative;margin:-16px -16px 2px;border-radius:20px 20px 0 0;overflow:hidden;background:var(--ivory)}.scene>svg{display:block;opacity:.92}.scene:after{content:"";position:absolute;inset:auto 0 0 0;height:14%;background:linear-gradient(to bottom,rgba(255,255,255,0),var(--card));pointer-events:none}.scene-lumi{position:absolute;right:10px;bottom:2px;z-index:1;filter:drop-shadow(0 2px 3px rgba(27,36,64,.18))}.q-enter{animation:q-enter .36s cubic-bezier(.2,.8,.3,1) both}@keyframes q-enter{0%{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}.unfold{animation:unfold .42s cubic-bezier(.2,.8,.3,1) both;transform-origin:top center}@keyframes unfold{0%{opacity:0;transform:perspective(600px) rotateX(-70deg)}to{opacity:1;transform:none}}.lumi-mood g{transform-box:fill-box;transform-origin:50% 90%}.lumi-mood .lm-head{transform-origin:50% 85%}.lumi-mood .lm-arms{transform-origin:20% 80%}.lumi-mood .lm-glow{transform-origin:50% 50%}.lm-idle .lm-all{animation:lm-breathe 3.2s ease-in-out infinite}.lm-thinking .lm-head{animation:lm-tilt 2.4s ease-in-out infinite}.lm-thinking .lm-all{animation:lm-breathe 2.4s ease-in-out infinite}.lm-cheer .lm-all{animation:lm-hop .62s ease-out 2}.lm-cheer .lm-arms{animation:lm-raise .62s ease-out 2}.lm-gentle .lm-head{animation:lm-nod 1.2s ease-in-out 2}.lm-celebrate .lm-all{animation:lm-hop .52s ease-out 4}.lm-celebrate .lm-arms{animation:lm-raise .52s ease-out 4}.lm-celebrate .lm-glow{animation:lm-glow 1s ease-in-out 3}@keyframes lm-breathe{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes lm-tilt{0%,to{transform:rotate(0)}30%{transform:rotate(-8deg)}60%{transform:rotate(4deg)}}@keyframes lm-hop{0%,to{transform:translateY(0)}40%{transform:translateY(-22px)}70%{transform:translateY(2px)}}@keyframes lm-raise{0%,to{transform:translateY(0) rotate(0)}40%{transform:translateY(-26px) rotate(-6deg)}}@keyframes lm-nod{0%,to{transform:rotate(0)}35%{transform:rotate(6deg) translateY(4px)}}@keyframes lm-glow{0%,to{transform:scale(1)}50%{transform:scale(1.6)}}.lamp-timer{display:inline-flex;align-items:center;gap:2px;background:var(--card);border-radius:999px;padding:2px 10px 2px 6px;font-weight:900;font-size:15px;color:var(--night)}.lamp-timer.low{animation:lt-pulse 1s ease-in-out infinite;color:#8a4b00}.lamp-timer .lt-num{min-width:18px;text-align:right;font-variant-numeric:tabular-nums}@keyframes lt-pulse{0%,to{box-shadow:0 0 #f2a93b00}50%{box-shadow:0 0 0 6px #f2a93b59}}.streak-lamp{display:inline-flex;align-items:center;gap:2px;font-size:14px;color:var(--gold-text)}.streak-lamp .sl-glow{transform-box:fill-box;transform-origin:center;animation:lm-breathe 2s ease-in-out infinite}.confetti{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:25}.confetti .cf{position:absolute;top:-12px;width:9px;height:9px;border-radius:50%;animation-name:cf-fall;animation-timing-function:cubic-bezier(.3,.6,.5,1);animation-fill-mode:both}.confetti .cf.leaf{width:7px;height:14px;border-radius:0 100%}@keyframes cf-fall{0%{transform:translate(0) rotate(0);opacity:1}to{transform:translate(var(--drift),70vh) rotate(var(--spin));opacity:0}}.dyk{display:flex;flex-direction:column;gap:4px;background:var(--gold-tint);border-radius:14px;padding:10px 12px;color:#4a3206}.dyk-h{font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-text)}
