.play-player{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--play-bg);color:var(--play-ink);font-family:var(--play-title)}.play-player *{box-sizing:border-box}.play-player::backdrop{background:var(--play-bg)}body:has(.play-player[open]){overflow:hidden}.play-shell{max-width:440px;min-height:100svh;margin:auto;padding:16px 20px max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column}.play-player button{min-height:var(--play-touch);border:0;border-radius:var(--play-radius);font:500 18px var(--play-title);cursor:pointer;touch-action:manipulation;color:var(--play-ink)}.play-player button:focus-visible{outline:3px solid var(--play-primary);outline-offset:4px}.play-player button:active{transform:scale(.96)}.play-player svg{width:28px;height:28px}.play-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.play-top strong{font-size:20px;text-align:center}.play-top button{min-width:72px;width:72px;background:var(--play-soft);display:grid;place-items:center;color:var(--play-primary)}.play-progress{display:flex;gap:8px;margin-top:16px}.play-progress span{height:8px;flex:1;background:#e9dff2;border-radius:20px}.play-progress .lit{background:var(--play-primary)}.play-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:22px 0 16px}.play-kicker{font:11px var(--play-copy);letter-spacing:1px;color:var(--play-muted);margin:0}.play-main h1{font:500 29px/1.2 var(--play-title);text-align:center;margin:0}.play-player h1:focus{outline:none}.play-target{width:190px;height:190px;display:grid;place-items:center;background:#f0e8dc;border-radius:36px;box-shadow:inset 0 0 0 2px #e3d6c6}.play-target .play-shape{width:176px;height:176px}.play-shape{fill:var(--play-green);stroke:var(--play-line);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}.play-shape.square{fill:var(--play-gold)}.play-shape.triangle{fill:var(--play-coral)}.play-shape.outline{fill:none;stroke:#9f8a75;stroke-width:4;stroke-dasharray:6 7}.play-target.filled{background:#e0eee3}.play-instruction{font:13px/1.5 var(--play-copy);color:var(--play-muted);text-align:center;margin:0}.play-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%}.play-choice{position:relative;display:grid;place-items:center;height:118px;padding:7px;border:2px solid #fff!important;box-shadow:0 5px 0 #c0af9b;touch-action:none!important;user-select:none}.tint-0{background:#dceee5}.tint-1{background:#eee3fb}.tint-2{background:#ffebcc}.play-choice>.play-shape{width:100%;height:100%}.play-choice>img{width:100%;height:100px;object-fit:contain;pointer-events:none}.play-choice.correct{outline:4px solid #36694d;outline-offset:3px}.play-choice.hint{outline:4px solid #7351bc;outline-offset:3px}.play-check{position:absolute;right:-4px;top:-14px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:white;background:#36694d}.play-check svg{width:24px;height:24px}.play-coach{display:flex;align-items:center;gap:12px;width:100%;min-height:68px}.play-coach img{width:52px;height:60px;object-fit:contain}.play-status{font:14px/1.5 var(--play-copy);margin:0}.play-next,.play-help{width:100%;display:flex;align-items:center;justify-content:center;gap:12px}.play-next{background:var(--play-primary);color:white!important;box-shadow:0 5px 0 #52358e}.play-help{background:var(--play-soft);color:#594285!important}.play-player [hidden]{display:none!important}.play-hero{position:relative;width:210px;height:220px;background:#e0eee3;display:grid;place-items:center;border-radius:40px!important}.play-hero>img{width:180px;height:190px;object-fit:contain;pointer-events:none}.play-hero>span{position:absolute;right:-8px;bottom:0;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--play-primary);color:white}.play-word{font:32px var(--play-copy);margin:0}.play-listen{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;background:var(--play-soft);color:var(--play-primary)!important}.play-visual-help{width:112px;height:112px;background:#e0eee3;border-radius:24px;padding:8px}.play-visual-help img{width:100%;height:100%;object-fit:contain}.play-parent-note{font:11px/1.5 var(--play-copy);text-align:center;color:var(--play-muted);margin:12px 0 0}.play-ghost{position:fixed;z-index:20;transform:translate(-50%,-50%);pointer-events:none;width:100px;height:100px;filter:drop-shadow(0 6px 6px #3333)}.play-ghost svg{width:100%;height:100%}.play-summary{align-items:center;justify-content:center;gap:24px;text-align:center}.play-summary>img{width:160px;height:180px;object-fit:contain}.play-summary h1{font:500 30px/1.2 var(--play-title);margin:0}.play-stars{display:flex;gap:16px;color:#d69a15}.play-stars svg{width:44px;height:44px}.play-recap{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.play-recap>div{background:#e0eee3;border-radius:24px;padding:8px}.play-recap img,.play-recap .play-shape{width:100%;height:100px;object-fit:contain}@media(max-width:350px){.play-shell{padding-left:16px;padding-right:16px}.play-top strong{font-size:17px}.play-main h1{font-size:25px}.play-choices{gap:10px}}@media(max-height:780px){.play-main{gap:14px;padding:16px 0 12px}.play-main h1{font-size:26px}.play-target{width:160px;height:160px}.play-target .play-shape{width:150px;height:150px}.play-choice{height:104px}.play-choice>img{height:86px}.play-hero{width:180px;height:184px}.play-hero>img{width:156px;height:164px}.play-word{font-size:28px}}@media(prefers-reduced-motion:reduce){.play-player *{animation:none!important;transition:none!important}}

.play-shape.rectangle{fill:#7b9dd8}.play-shape.pentagon{fill:#b18ad4}.play-recap{grid-template-columns:repeat(3,minmax(0,1fr))}

.play-shape.outline{fill:none}

@media(max-height:760px){.play-summary{gap:16px}.play-summary>img{width:120px;height:136px}.play-summary h1{font-size:26px}.play-summary .play-recap img,.play-summary .play-recap .play-shape{height:70px}}
