:root{--ink:#1e2543;--body:#4a5565;--muted:#929c9a;--bg:#faf8e8;--card:#fff;--border:#e4e7ec;--border-soft:#f2f4f7;--pill-border:#e3e0cf;--pill-active-bg:#f2efe0;--pill-active-border:#d9d3b8;--cta:#ffdd48;--cta-pressed:#ffdd48b3;--accent:#538cf8;--success:#29c766;--danger:#e5484d;--stage:#1e2543;--stage-ink:#fff}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{color:var(--body);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,sans-serif;font-size:14px}h1,h2,h3{color:var(--ink);font-family:Poppins,system-ui,sans-serif;font-weight:600}button{cursor:pointer;background:0 0;border:none;font-family:inherit}button:focus-visible,input:focus-visible,a:focus-visible,label:focus-within{box-shadow:0 0 0 2px var(--accent);outline:none}.page{flex-direction:column;width:100%;max-width:560px;min-height:100%;margin:0 auto;padding:0 2.5% 32px;display:flex}.shell{justify-content:space-between;align-items:center;gap:12px;padding:16px 0 12px;display:flex}.brand{color:var(--ink);align-items:center;gap:6px;font-family:Poppins,system-ui,sans-serif;font-size:15px;font-weight:600;display:inline-flex}.surface{background:var(--card);border:1px solid var(--border);border-radius:30px;gap:20px;min-width:0;padding:24px 20px;display:grid}.surface>*{min-width:0}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden}.card-header{border-bottom:1px solid var(--border-soft);color:var(--ink);justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;font-family:Poppins,system-ui,sans-serif;font-size:15px;font-weight:600;display:flex}.card-body{padding:20px}.card-row{border-bottom:1px solid var(--border-soft);justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.card-row:last-child{border-bottom:none}.page-title{color:var(--ink);font-family:Poppins,system-ui,sans-serif;font-size:18px;font-weight:500}.item-title{color:var(--ink);font-family:Inter,system-ui,sans-serif;font-size:20px;font-weight:600}.label-upper{color:var(--muted);letter-spacing:1.4px;text-transform:uppercase;font-size:10px;font-weight:500}.meta{color:var(--muted);font-size:12px}.badge{border-radius:9999px;align-items:center;gap:6px;height:24px;padding:0 10px;font-size:12px;font-weight:500;display:inline-flex}.btn{border-radius:9999px;justify-content:center;align-items:center;gap:6px;min-width:44px;height:48px;min-height:44px;padding:0 28px;font-family:Inter,system-ui,sans-serif;font-size:14px;font-weight:600;display:inline-flex}.btn-primary{background:var(--cta);color:var(--ink)}.btn-primary:active{background:var(--cta-pressed)}.btn-primary:disabled{opacity:.5;cursor:default}.btn-ghost{background:var(--card);color:var(--ink);border:1px solid var(--pill-border)}.btn-sm{height:36px;padding:0 16px;font-size:13px;font-weight:500}.chip{white-space:nowrap;border:1px solid var(--pill-border);background:var(--card);height:40px;color:var(--ink);border-radius:9999px;align-items:center;gap:6px;min-height:44px;padding:0 18px;font-size:13px;font-weight:500;display:inline-flex}.chip[aria-pressed=true]{background:var(--pill-active-bg);border-color:var(--pill-active-border)}.input{border:1px solid var(--pill-border);background:var(--card);width:100%;height:48px;color:var(--ink);border-radius:9999px;padding:0 20px;font-family:Inter,system-ui,sans-serif;font-size:14px}.input::placeholder{color:var(--muted)}.carousel{scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px;margin:-4px -20px;padding:4px 20px;scroll-padding:20px;display:flex;overflow-x:auto}.carousel::-webkit-scrollbar{display:none}.carousel-card{scroll-snap-align:start;text-align:left;background:var(--card);border:1px solid var(--border);border-radius:12px;flex:0 0 68%;max-width:240px;padding:0;display:grid;overflow:hidden}.carousel-card[aria-pressed=true]{border-color:var(--cta);box-shadow:0 0 0 2px var(--cta)}.carousel-card .art{aspect-ratio:3/2;border-bottom:1px solid var(--border-soft);overflow:hidden}.carousel-card .art img{object-fit:cover;width:100%;height:100%;display:block}.carousel-dots{justify-content:center;gap:6px;margin-top:12px;display:flex}.carousel-dots span{background:var(--pill-active-border);border-radius:9999px;width:6px;height:6px}.carousel-dots span[data-active=true]{background:var(--ink)}.action-bar{padding:12px 2.5% calc(16px + env(safe-area-inset-bottom));background:var(--card);border-top:1px solid var(--border);position:fixed;bottom:0;left:0;right:0}.action-bar-inner{gap:12px;max-width:560px;margin:0 auto;display:flex}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes boxPop{0%{opacity:0;transform:scale(.6)}70%{opacity:1;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes scanSweep{0%{opacity:0;transform:translateY(-8%)}12%{opacity:1}88%{opacity:1}to{opacity:0;transform:translateY(108%)}}@keyframes barGrow{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes chipPop{0%{opacity:0;transform:translateY(8px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes pulseSoft{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}.motion-card{background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden}.motion-stage{align-content:center;min-height:240px;padding:20px;display:grid;position:relative}.motion-fade{animation:.5s ease-out both fadeUp}.motion-pop{animation:.45s ease-out both chipPop}.motion-bar{transform-origin:0;animation:.9s cubic-bezier(.2,.8,.2,1) both barGrow}.motion-pulse{animation:2.4s ease-in-out infinite pulseSoft}.motion-scan{animation:3.2s ease-in-out infinite scanSweep}.motion-bbox{animation:.5s ease-out both boxPop}@media (prefers-reduced-motion:reduce){.motion-fade,.motion-pop,.motion-bar,.motion-pulse,.motion-scan,.motion-bbox{opacity:1!important;animation:none!important;transform:none!important}}.marker{background:var(--cta);color:var(--ink);-webkit-box-decoration-break:clone;box-decoration-break:clone;border-radius:8px;padding:0 8px}.btn:active,.chip:active,.carousel-card:active{transform:scale(.98)}.btn,.chip,.carousel-card{transition:transform .1s ease-out}.stat-num{color:var(--ink);font-family:Poppins,system-ui,sans-serif;font-size:34px;font-weight:600;line-height:1.1}.stopwatch{color:var(--ink);font-variant-numeric:tabular-nums;font-family:Poppins,system-ui,sans-serif;font-size:44px;font-weight:600;line-height:1}.viewfinder{pointer-events:none;position:absolute;inset:5%}.viewfinder:before,.viewfinder:after,.viewfinder span:before,.viewfinder span:after{content:"";border:4px solid var(--cta);border-radius:2px;width:34px;height:34px;position:absolute}.viewfinder:before{border-bottom:none;border-right:none;border-top-left-radius:12px;top:0;left:0}.viewfinder:after{border-bottom:none;border-left:none;border-top-right-radius:12px;top:0;right:0}.viewfinder span:before{border-top:none;border-right:none;border-bottom-left-radius:12px;bottom:0;left:0}.viewfinder span:after{border-top:none;border-left:none;border-bottom-right-radius:12px;bottom:0;right:0}@media (prefers-reduced-motion:reduce){.btn:active,.chip:active,.carousel-card:active{transform:none}}@keyframes rotateHint{0%,20%{transform:rotate(0)}55%,80%{transform:rotate(90deg)}to{transform:rotate(90deg)}}.rotate-hint{animation:1.8s ease-in-out infinite rotateHint}@media (prefers-reduced-motion:reduce){.rotate-hint{animation:none;transform:rotate(90deg)}}