.game-screen{gap:14px;position:relative}.game-controls{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}.quiet-feedback{font-size:14px;color:var(--ink)}.dot-field{position:relative;overflow:hidden;min-height:320px;touch-action:manipulation}.dot-target{position:absolute;min-width:44px;min-height:44px;border-radius:999px;border:0;background:var(--magenta);box-shadow:0 0 0 8px #d946ef24;padding:0;touch-action:manipulation;animation:dot-hop .26s cubic-bezier(.34,1.56,.64,1)}.dot-eye{position:absolute;top:30%;width:20%;height:24%;border-radius:999px;background:#fff}.dot-eye-left{left:24%}.dot-eye-right{right:24%}.dot-eye span{position:absolute;left:32%;top:34%;width:46%;height:46%;border-radius:999px;background:var(--ink)}.memory-panel{align-items:center;justify-content:center;gap:12px;padding:18px;min-height:320px}.game-panel-hint{font-size:13px;color:var(--muted);text-align:center}.memory-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%;max-width:280px}.memory-card{aspect-ratio:3 / 4;min-width:44px;min-height:64px;border-radius:12px;border:2px solid #fed7aa;background:#fff7ed;display:flex;align-items:center;justify-content:center;padding:0;transition:background .15s,border-color .15s,transform .38s cubic-bezier(.4,0,.2,1);transform:rotateY(180deg);animation:cell-in .26s cubic-bezier(.2,.8,.2,1) backwards;touch-action:manipulation}.memory-card[data-up=true]{background:#fff;transform:rotateY(0)}.memory-card[data-matched=true]{transform:rotateY(0) scale(.94)}.compass-game,.piano-game{padding:18px;gap:14px;min-height:360px}.game-instruction{text-align:center}.direction-arrow{display:block;font-size:48px;line-height:1.2;color:#c2410c}.direction-clue{margin-top:4px;font-size:17px;font-weight:700;line-height:1.35}.direction-fact{margin-top:6px;font-size:12.5px;color:var(--muted)}.compass-field-wrap{flex:1;display:flex;align-items:center;justify-content:center;min-height:250px}.compass-field{position:relative;width:250px;height:250px;max-width:100%;border-radius:999px;background:#fff7ed;border:1px solid #fed7aa}.compass-ring{position:absolute;left:50%;top:50%;width:150px;height:150px;transform:translate(-50%,-50%);border-radius:999px;border:1px dashed #fdba74}.compass-ring:after{content:"";position:absolute;left:calc(50% - 5px);top:calc(50% - 5px);width:10px;height:10px;border-radius:999px;background:#c2410c}.direction-button{position:absolute;transform:translate(-50%,-50%);width:52px;height:52px;padding:0;border-radius:999px;border:1px solid var(--line);background:#fff;color:#c2410c;box-shadow:var(--shadow-card);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:20px;touch-action:manipulation}.direction-label{font-size:9px;font-weight:700;color:var(--ink)}.piano-game{padding:12px}.piano-sequence{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:10px;min-height:32px}.piano-step{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:2px solid var(--line-strong);border-radius:8px}.piano-step[data-done=true]{border-color:#be185d;background:#fdf2f8}.piano-keys{flex:1;display:flex;align-items:stretch;gap:3px;background:#18212f;border-radius:14px;padding:10px 4px 12px;min-height:220px;overflow-x:auto}.piano-key{flex:1 0 44px;min-width:44px;border:0;padding:0 0 12px;border-radius:6px 6px 10px 10px;background:#fff;color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;font-size:13px;font-weight:700;box-shadow:0 3px #00000040;transition:box-shadow .12s,transform .12s;touch-action:manipulation}.piano-key[aria-current=true]{box-shadow:inset 0 0 0 4px var(--key-color);transform:translateY(2px)}.piano-key-mark{width:12px;height:4px;border-radius:999px;background:var(--key-color)}.game-screen button:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.game-screen button:disabled{cursor:default}[data-reduce-motion=true] *,[data-reduce-motion=true] *:before,[data-reduce-motion=true] *:after{animation:none!important;transition:none!important}:root{--ink: #16202a;--ink-2: #3b4656;--muted: #667085;--faint: #667085;--cloud: #f6f8fb;--mist: #eef2f7;--line: #e5eaf2;--line-strong: #d8dfeb;--white: #fff;--tile: #f3f5f8;--magenta: #d946ef;--magenta-deep: #a72dc7;--magenta-soft: #fff4fd;--magenta-line: #f0c6f3;--blue: #3b82f6;--cyan: #0891b2;--green: #10b981;--green-deep: #047857;--green-soft: #ecfdf5;--amber: #f59e0b;--red: #e11d48;--indigo: #4f46e5;--r-card: 16px;--r-inner: 12px;--r-ctl: 9px;--r-pill: 999px;--shadow-card: 0 1px 2px rgba(22,32,42,.04);--shadow-float: 0 6px 16px rgba(22,32,42,.06);--shadow-sheet: 0 -8px 30px rgba(22,32,42,.16);--focus: 0 0 0 2px rgba(217,70,239,.14);--font: Inter, system-ui, -apple-system, sans-serif;--app-bg: radial-gradient(60% 40% at 20% 0%, rgba(124,58,237,.04), transparent), radial-gradient(50% 40% at 90% 10%, rgba(217,70,239,.04), transparent), radial-gradient(60% 50% at 50% 100%, rgba(8,145,178,.03), transparent), linear-gradient(#fff, var(--cloud))}@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/InterVariable.woff2) format("woff2")}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);color:var(--ink);background:#eef2f7;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}button,input{font-family:inherit}button{cursor:pointer}a{color:var(--magenta-deep)}a:hover{color:#86198f}.app{height:100%;width:100%;max-width:430px;margin:0 auto;display:flex;flex-direction:column;position:relative;overflow:hidden;background:var(--app-bg)}@media (min-width: 520px) and (min-height: 600px){#root{display:flex;align-items:center;justify-content:center}.app{width:402px;height:min(874px,100dvh - 40px);border-radius:44px;border:1px solid #d8dfeb;box-shadow:0 24px 60px #16202a24}}.screen{flex:1;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 64px) 20px calc(env(safe-area-inset-bottom) + 32px);gap:14px;overflow:auto;position:relative}.eyebrow{font-size:10.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--faint)}.h1{font-size:26px;font-weight:700;letter-spacing:-.012em;line-height:1.2;margin:0;text-wrap:balance}.body{font-size:16px;color:var(--muted);line-height:1.45;margin:0;text-wrap:pretty}.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--shadow-card);padding:16px}.panel{flex:1;display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-card);animation:game-in .36s cubic-bezier(.2,.8,.2,1) both}.row{display:flex;align-items:center;gap:12px}.grow{flex:1;min-width:0}.num{font-variant-numeric:tabular-nums}.seg{flex:1;height:40px;border-radius:9px;border:2px solid var(--line);background:var(--white);font-size:13px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}.seg[aria-pressed=true]{border-color:var(--magenta);background:var(--magenta-soft)}.seg:focus-visible,.btn:focus-visible,.input:focus-visible{outline:none;box-shadow:var(--focus);border-color:#fad1fb}.input{height:56px;width:100%;border-radius:12px;border:1px solid var(--line-strong);padding:0 16px;font-size:18px;background:var(--white);color:var(--ink);outline:none}.input:focus{border-color:#fad1fb;box-shadow:var(--focus)}.pill{display:inline-flex;align-items:center;padding:5px 9px;border-radius:var(--r-pill);font-size:11px;font-weight:600;border:1px solid var(--line);background:var(--tile);color:var(--muted);white-space:nowrap}.icon-btn{width:44px;height:44px;border-radius:var(--r-pill);border:1px solid var(--line);background:var(--white);display:flex;align-items:center;justify-content:center;flex:none;color:var(--ink)}.icon-btn:hover{background:var(--cloud)}.avatar{border-radius:var(--r-pill);background-size:cover;background-position:center;background-color:var(--mist);flex:none}.strip{display:flex;gap:8px;overflow-x:auto;margin:0 -20px;padding:2px 20px 6px;scrollbar-width:none;cursor:grab;touch-action:pan-x;-webkit-user-select:none;user-select:none}.strip::-webkit-scrollbar{display:none}.stripes{background:repeating-linear-gradient(45deg,#eef2f7 0,#eef2f7 7px,#f6f8fb 7px,#f6f8fb 14px)}@keyframes crew-reveal{0%{transform:scale(0) rotate(-30deg);opacity:0}60%{transform:scale(1.15) rotate(6deg);opacity:1}to{transform:scale(1) rotate(0)}}@keyframes sheet-up{0%{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes halo-breathe{0%,to{transform:scale(1);opacity:.76}50%{transform:scale(.94);opacity:.46}}@keyframes dot-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes dot-jump{0%,to{transform:translateY(0) scale(1)}30%{transform:translateY(-22px) scale(1.04,.96)}55%{transform:translateY(0) scale(.97,1.03)}70%{transform:translateY(-8px)}}@keyframes dot-blink{0%,92%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}@keyframes float-slow{0%,to{transform:translate(0)}33%{transform:translate(6px,-10px)}66%{transform:translate(-5px,-4px)}}@keyframes confetti-fall{0%{transform:translateY(-40px) rotate(0);opacity:0}10%{opacity:1}to{transform:translateY(560px) rotate(540deg);opacity:0}}@keyframes wiggle{0%,to{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}@keyframes sparkle{0%,to{transform:scale(.6);opacity:.3}50%{transform:scale(1.1);opacity:1}}@keyframes game-in{0%{transform:translateY(18px) scale(.97);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@keyframes cell-in{0%{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}@keyframes burst-ring{0%{transform:translate(-50%,-50%) scale(.2);opacity:.9}to{transform:translate(-50%,-50%) scale(2.2);opacity:0}}@keyframes burst-spark{0%{transform:translate(-50%,-50%) rotate(var(--a)) translateY(0) scale(1);opacity:1}to{transform:translate(-50%,-50%) rotate(var(--a)) translateY(-46px) scale(.2);opacity:0}}@keyframes float-up{0%{transform:translate(-50%,-50%) scale(.6);opacity:0}20%{transform:translate(-50%,-70%) scale(1.15);opacity:1}to{transform:translate(-50%,-160%) scale(1);opacity:0}}@keyframes miss-shake-a{0%,to{transform:translate(0)}20%{transform:translate(-7px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(3px)}}@keyframes miss-shake-b{0%,to{transform:translate(0)}20%{transform:translate(-7px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(3px)}}@keyframes score-bump{0%{transform:scale(1)}40%{transform:scale(1.28)}to{transform:scale(1)}}@keyframes piece-drop{0%{transform:translateY(-26px);opacity:0}60%{transform:translateY(4px);opacity:1}to{transform:translateY(0)}}@keyframes dot-hop{0%{transform:scale(.5) translateY(10px);opacity:0}60%{transform:scale(1.12) translateY(-3px);opacity:1}to{transform:scale(1) translateY(0)}}@keyframes bar-shine{0%{transform:translate(-100%)}to{transform:translate(300%)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.field-label{font-size:14px;font-weight:600;color:var(--ink)}.seg{min-height:44px}.btn,.screen button{flex-shrink:0}.screen>*{flex-shrink:0}.h2{margin:0;font-size:17px}.home-extras>button{min-width:0}.home-extras>button>div:first-child{flex-wrap:wrap;gap:4px}.home-extras .avatar,.home-extras .avatar+div:last-child{flex:1 1 0!important;min-width:0;max-width:34px;height:auto!important;aspect-ratio:1}