.twins-player{--tw-bg:#6744b5;--tw-ink:#fffdf5;--tw-purple:#ffda70;--tw-muted:#e6dcfa;--tw-line:#4d328e;--tw-gap:8px;--tw-radius:24px;--tw-touch:72px;position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:radial-gradient(ellipse at 110% 10%,#805acc55,transparent 48%),var(--tw-bg);color:var(--tw-ink);font-family:Fredoka,ui-rounded,sans-serif;overscroll-behavior:contain}.twins-player *{box-sizing:border-box}.twins-player::backdrop{background:var(--tw-bg)}body:has(.twins-player[open]){overflow:hidden}.twins-shell{max-width:480px;margin:auto;min-height:100svh;padding:max(14px,env(safe-area-inset-top)) 16px max(18px,env(safe-area-inset-bottom));display:flex;flex-direction:column}.twins-player button{min-height:var(--tw-touch);border:0;font-family:Fredoka,ui-rounded,sans-serif;cursor:pointer;touch-action:manipulation;transition:transform 150ms}.twins-player button:focus-visible{outline:3px solid #ffdf83;outline-offset:3px}.twins-next:active,.twins-reset:active{transform:scale(.96)}.twins-top{display:flex;justify-content:space-between;align-items:center;font-size:22px;gap:8px}.twins-icon{width:72px;min-width:72px;border-radius:24px;background:#ffffff17;color:white;display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px #ffffff20}.twins-icon svg{width:28px;height:28px}.twins-progress{display:flex;gap:8px;margin:14px 0 0}.twins-progress>span{flex:1;height:9px;border-radius:999px;background:#4d328e}.twins-progress>.current{background:#ffda70}.twins-progress>.done{background:#ffda70}.twins-main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:20px 0 12px}.twins-eyebrow{font:11px Andika,sans-serif;letter-spacing:1.2px;color:var(--tw-muted);text-align:center;margin:0 0 10px}.twins-main h1{font:600 30px/1.15 Fredoka,sans-serif;text-align:center;margin:0;color:white}.twins-instruction{font:14px/1.5 Andika,sans-serif;text-align:center;color:var(--tw-muted);margin:10px 0 22px}.twins-board{position:relative;width:100%;align-self:center;max-width:390px}.twins-grid{display:grid;grid-template-columns:repeat(var(--grid),minmax(0,1fr));gap:var(--tw-gap);touch-action:none;user-select:none;-webkit-user-select:none}.twins-cell{position:relative;isolation:isolate;aspect-ratio:1;min-width:0;min-height:0!important;border-radius:18px;background:#493080;color:white;display:grid;place-items:center;padding:0}.tone-0{--pair-light:#267f70;--pair-ink:#fff;--pair-route:#16b887;--pair-tile:#13a77b}.tone-1{--pair-light:#a06c39;--pair-ink:#fff;--pair-route:#ffbe43;--pair-tile:#efa921}.tone-2{--pair-light:#564da1;--pair-ink:#fff;--pair-route:#af91ff;--pair-tile:#9461dc}.tone-3{--pair-light:#337ba1;--pair-ink:#fff;--pair-route:#4cc9f0;--pair-tile:#229bca}.twins-cell.visited{background:var(--pair-light)}.twins-cell.endpoint{z-index:2;background:var(--pair-tile);box-shadow:0 4px 0 #33226c55,inset 0 2px 0 #ffffff27}.twins-cell.active{outline:3px solid #fff4cc;outline-offset:-3px}.twins-cell.paired{box-shadow:0 4px 0 #33226c55,inset 0 0 0 2px #ffffff60}.twins-letter-toy{position:absolute;inset:18%;display:block;width:64%;height:64%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}.twins-lines,.twins-example{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:1}.twins-route{fill:none;stroke:var(--pair-route);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round}.twins-example{opacity:0;transition:opacity 160ms}.twins-example.show{opacity:1}.twins-example-route{fill:none;stroke:var(--pair-route);stroke-width:3;stroke-linecap:round;stroke-dasharray:3 4;animation:twins-demo 2.5s linear infinite}.twins-pair-count{text-align:center;font:500 18px Fredoka,sans-serif;color:#fff2cd;margin:18px 0 12px}.twins-coach{display:flex;align-items:center;gap:12px;min-height:66px;padding:10px 12px;border-radius:24px;background:#ffffff12}.twins-coach img{width:52px;height:58px;object-fit:contain}.twins-status{font:14px/1.5 Andika,sans-serif;margin:0;color:#fffdf5}.twins-bottom{display:flex;align-items:center;gap:14px;margin-top:4px;min-height:72px}.twins-reset{width:72px;min-width:72px;border-radius:24px;background:#ffffff17;color:white;display:grid;place-items:center}.twins-reset svg{width:26px;height:26px}.twins-footer-note{font:13px/1.5 Andika,sans-serif;margin:0;color:#e6dcfa}.twins-next{flex:1;display:flex;align-items:center;justify-content:center;gap:12px;min-height:72px;background:#ffda70;color:#302b55;border-radius:24px;box-shadow:0 5px 0 #d29b35;font:600 22px Fredoka,sans-serif;padding:16px}.twins-next svg{width:26px;height:26px}.twins-player [hidden]{display:none!important}.twins-summary{justify-content:center;align-items:center;gap:24px;text-align:center}.twins-summary>img{width:200px;height:220px;object-fit:contain}.twins-stars{display:flex;gap:16px;color:#ffda70}.twins-stars svg{width:52px;height:52px}.twins-summary h1{font:600 34px Fredoka,sans-serif;margin:0}.twins-summary p{font:16px/1.6 Andika,sans-serif;margin:0}.twins-summary .twins-next{flex:0;width:100%}.twins-again{background:none;color:#ffe6a3;font-size:18px}.twins-player h1:focus{outline:none}@keyframes twins-demo{to{stroke-dashoffset:-28}}
@media(max-width:370px){.twins-shell{padding-left:12px;padding-right:12px}.twins-grid{gap:6px}.twins-cell{border-radius:20px}.twins-main h1{font-size:27px}.twins-top{font-size:20px}}
@media(max-width:340px){.twins-shell{padding-left:8px;padding-right:8px}.twins-grid{gap:4px}}
@media(max-height:760px) and (orientation:portrait){.twins-main{padding-top:14px}.twins-instruction{margin-bottom:16px}.twins-coach{padding:6px 10px}.twins-shell{padding-top:8px}}
@media(prefers-reduced-motion:reduce){.twins-player *{animation:none!important;transition:none!important}}

.tone-4{--pair-light:#99445d;--pair-ink:#fff;--pair-route:#ff7892;--pair-tile:#df4f70}