:root{color-scheme:light;--paper:#f6f3ee;--ink:#28263c;--muted:#706d7f;--violet:#6550b9;--line:#e3dfe8;--green:#166b54;--orange:#a34d24;font-family:ui-rounded,'Avenir Next',system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0}button,a,select{-webkit-tap-highlight-color:transparent}button,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:0;color:inherit}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #8069d6;outline-offset:4px}a{color:inherit;text-decoration:none}h1,h2,p{margin:0}h2{font-size:1.4rem;letter-spacing:-.04em}[hidden]{display:none!important}#app{max-width:1000px;margin:auto;padding:0 max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}.topbar{height:86px;display:flex;align-items:center;gap:15px;padding-top:env(safe-area-inset-top)}.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:18px}.brand span{font-size:10px;letter-spacing:.13em;border-left:1px solid #ccc7d4;margin-left:6px;padding-left:14px;color:var(--muted)}.icon-button{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:#ffffff85;font-size:23px;flex-shrink:0}.topbar>#help{margin-left:auto}.hero{display:flex;align-items:center;min-height:320px;padding:25px 30px 35px;gap:24px}.hero-copy{flex:1}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.15em;color:var(--violet)}h1{font-size:clamp(45px,7vw,74px);line-height:1.02;letter-spacing:-.07em;margin:15px 0 20px;font-weight:850}h1 span{color:var(--violet)}.hero-copy>p:not(.eyebrow){color:var(--muted);font-size:15px;line-height:1.6}.pill{display:inline-block;border:1px solid #dcd5e7;border-radius:24px;padding:8px 12px;margin-top:18px;font-size:11px;font-weight:650}.hero-art{width:290px;height:280px;position:relative;isolation:isolate}.hero-art:before{content:'';position:absolute;inset:26px 0;background:#ebe4f3;border-radius:50%;z-index:-1}.mini-card{background:#fff;padding:11px;border-radius:22px;box-shadow:0 18px 35px #40325915;position:absolute;width:174px}.mini-card img{width:100%;border-radius:15px}.mini-card b{display:block;text-align:center;margin:7px 0;font-size:18px}.card-front{left:24px;top:49px;transform:rotate(-12deg)}.card-back{right:3px;top:10px;transform:rotate(14deg);height:205px}.spark{position:absolute;font-size:45px;color:#b694d6;left:15px;top:0}.hero-check{position:absolute;right:5px;bottom:22px;background:#d5e9ce;color:#42774a;border:5px solid var(--paper);width:66px;height:66px;border-radius:50%;display:grid;place-items:center;font-size:32px}.section-title{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:15px 0 18px}.section-title span{font-size:12px;color:var(--muted)}.decks{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.deck{border:1px solid var(--line);background:#fffaf6;border-radius:19px;text-align:left;padding:12px;transition:transform .15s,border-color .15s;position:relative}.deck:hover{transform:translateY(-3px)}.deck.selected{border:2px solid var(--violet);padding:11px;background:#f0ebfa}.deck.selected:after{content:'✓';position:absolute;right:7px;top:7px;border-radius:50%;width:22px;height:22px;background:var(--violet);color:white;text-align:center;line-height:22px;font-size:13px}.deck img,.deck-art{width:64px;height:64px;border-radius:16px;object-fit:cover;margin-bottom:12px}.deck-art{display:grid;place-items:center;font-size:37px;font-weight:750}.mix-art{background:#e6dff6;color:#7760b9}.vocab-art{background:#dcebe5;color:#48755e;font-size:28px}.deck strong,.deck small{display:block}.deck strong{font-size:12px;white-space:nowrap}.deck small{font-size:11px;color:var(--muted);margin-top:6px}.settings-row{display:flex;justify-content:space-between;gap:15px;align-items:end;margin:25px 0 20px}fieldset{border:0;padding:0;margin:0}legend,label{font-size:12px;font-weight:700;margin-bottom:10px}.segmented{display:flex;gap:4px;background:#ebe7e4;padding:5px;border-radius:13px}.segmented button{min-width:53px;height:40px;background:none;border-radius:9px;font-size:13px}.segmented .selected{background:#fff;box-shadow:0 2px 7px #30284110;color:var(--violet);font-weight:750}.toggles{display:flex;gap:8px}.toggle{border:1px solid var(--line);border-radius:12px;min-height:46px;padding:10px 14px;background:#fff;font-size:13px}.toggle[aria-pressed=true]{background:#e9e2f6;border-color:#cec1e8;color:#584196}.toggle[aria-pressed=false]{color:var(--muted)}.orientation-choice{display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid var(--line);padding:17px 0 5px}
.orientation-choice>div:first-child{min-width:0}
.orientation-choice strong{font-size:13px}
.orientation-choice small{display:block;color:var(--muted);font-size:11px;line-height:1.45;margin-top:5px}
.orientation-segmented{flex-shrink:0}
.orientation-segmented button{min-width:104px;padding:0 12px}
.control-choice{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:17px 0;gap:10px}.control-choice strong{font-size:13px}.control-choice small{display:block;color:var(--muted);font-size:11px;margin-top:6px;max-width:430px;line-height:1.5}.primary{background:var(--violet);color:white;border-radius:16px;min-height:58px;width:100%;font-weight:750;font-size:17px;box-shadow:0 6px 16px #6550b920;transition:background .15s}.primary:hover{background:#55409f}.footnote{text-align:center;color:var(--muted);font-size:11px;line-height:1.6;margin:13px 0}.notice{background:#fff0d3;color:#815d19;padding:14px;border-radius:12px;font-size:13px;line-height:1.5;margin-bottom:10px}.text-button{padding:15px 18px;background:none;font-weight:650;min-height:48px;font-size:14px;color:var(--violet)}#category-wrap{margin-top:16px;display:flex;align-items:center;justify-content:space-between;gap:10px}select{max-width:60%;border:1px solid var(--line);border-radius:10px;padding:12px;background:white;font-size:13px}.centered{text-align:center;max-width:580px;margin:30px auto}.centered h2{font-size:32px;margin:13px 0}.centered>p:not(.eyebrow){color:var(--muted);line-height:1.7}.guide-image{width:210px;max-width:65%;margin:20px auto;border-radius:30px;display:block}.tilt-hints{display:flex;justify-content:center;gap:15px;margin:22px 0}.tilt-hints span{background:#e4eee7;color:var(--green);padding:12px 20px;border-radius:14px;font-size:22px}.tilt-hints span+span{background:#f4e5d9;color:var(--orange)}.tilt-hints b{font-size:14px}.game-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.game-top #score{margin-right:auto;color:var(--green);font-weight:800;font-size:23px}#time{font-variant-numeric:tabular-nums;font-size:27px;font-weight:800;min-width:45px}.time-bar{height:5px;background:#e1dbed;border-radius:4px;overflow:hidden}.time-bar>div{height:100%;width:100%;background:var(--violet);transition:width .15s linear}.time-low #time{color:#a04041}.time-low .time-bar>div{background:#a04041}.play{height:calc(100dvh - 106px);min-height:360px;display:grid;grid-template-rows:48px 5px minmax(0,1fr) 23px 64px;gap:12px;max-width:1000px;margin:auto}.game-card{background:white;border:1px solid var(--line);border-radius:26px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px 20px;min-height:0;overflow:hidden}.game-card img{min-height:0;max-height:calc(100% - 88px);width:100%;flex:1;object-fit:contain;margin:9px 0;border-radius:18px}.game-card h2{font-size:clamp(24px,5vw,44px);text-align:center;line-height:1.1;overflow-wrap:anywhere;max-width:100%}.game-card .eyebrow{flex-shrink:0}.game-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.game-actions button{border-radius:17px;font-size:24px;font-weight:750}.game-actions span{font-size:19px}.pass{background:#f1dfcd;color:#884217}.correct{background:#cce6d6;color:#13563f}.motion-hint{font-size:11px;color:var(--muted);text-align:center;align-self:center}.overlay{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:25px}.countdown{background:#ece7f8;color:#55419a}.countdown strong{font-size:140px}.countdown span{font-size:22px;font-weight:750}.countdown small{font-size:18px}.feedback{background:#d4eddd;color:#145b40}.feedback.passed{background:#f7e2c9;color:#874315}.feedback strong{font-size:120px;line-height:1.2}.feedback span{font-size:38px;font-weight:800}.feedback small{margin-top:25px;font-size:15px}.result-star{display:block;font-size:65px;color:#aa8bc8}.result-counts{display:flex;justify-content:center;gap:55px;margin:25px 0}.result-counts strong{display:block;font-size:62px;letter-spacing:-.06em;color:var(--green)}.result-counts div+div strong{color:var(--orange)}.result-counts span{font-size:13px;color:var(--muted)}.review{margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left}.review-item{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:14px;background:#fff;font-size:13px}.review-item img{width:50px;height:50px;object-fit:contain;border-radius:9px}.review-item span:last-child{margin-left:auto;font-size:19px}.review-item[data-correct=true] span:last-child{color:var(--green)}.review-item[data-correct=false] span:last-child{color:var(--orange)}dialog{border:1px solid var(--line);border-radius:25px;padding:28px;max-width:440px;width:calc(100% - 32px);max-height:90dvh;overflow:auto;background:var(--paper);color:var(--ink);text-align:center}dialog::backdrop{background:#26223e99;backdrop-filter:blur(7px)}dialog h2{margin:12px 0}dialog .close{position:absolute;right:12px;top:12px}dialog .guide-image{width:155px;margin:14px auto}.instructions{padding-left:22px;text-align:left;font-size:13px;line-height:1.7}.instructions li{margin:9px 0}body.playing .topbar{display:none}body.playing #app{padding-top:max(12px,env(safe-area-inset-top))}body.playing .play{height:calc(100dvh - max(12px,env(safe-area-inset-top)) - max(20px,env(safe-area-inset-bottom)))}
@media(max-width:600px){#app{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}.topbar{height:72px}.hero{padding:20px 0 25px;min-height:270px;gap:0}.hero-copy{min-width:0}h1{font-size:48px}.hero-copy .eyebrow{font-size:8px;letter-spacing:.09em}.hero-copy>p:not(.eyebrow){font-size:12px}.hero-art{width:145px;height:225px;flex-shrink:0}.mini-card{width:113px;padding:7px;border-radius:16px}.card-front{left:-6px;top:65px}.card-back{top:29px;right:-2px;height:146px}.mini-card b{font-size:13px}.spark{font-size:30px;top:10px}.hero-check{height:45px;width:45px;font-size:23px;bottom:0}.pill{font-size:10px}.section-title h2{font-size:20px}.section-title span{font-size:10px}.decks{gap:8px;grid-template-columns:repeat(2,1fr)}.deck{padding:12px 9px}.deck.selected{padding:11px 8px}.deck:first-child,.deck:nth-child(2){grid-column:auto}.deck strong{font-size:11px}.deck small{font-size:10px}.deck img,.deck-art{width:47px;height:47px;margin-bottom:8px}.settings-row{flex-wrap:wrap;align-items:center;gap:14px}.orientation-choice{align-items:flex-start;flex-direction:column}.orientation-segmented{width:100%}.orientation-segmented button{flex:1;min-width:0}.toggles{margin-left:auto}.toggle{padding:10px;font-size:12px}.toggles span{font-size:11px}.segmented button{min-width:45px}.centered{margin-top:20px}.review{grid-template-columns:1fr}.brand span{display:none}.game-card{padding:12px}.game-card h2{font-size:32px}.game-card img{max-height:calc(100% - 75px)}}
@media(max-width:370px){h1{font-size:42px}.hero-art{width:125px}.hero-copy>p:not(.eyebrow){font-size:11px}.hero-copy .eyebrow{font-size:7px}.toggles{margin-left:0}}
@media(orientation:landscape) and (max-height:600px){
body.playing #app{max-width:none;padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}
body.playing .play{grid-template-rows:40px 4px minmax(0,1fr) 15px 50px;gap:6px;min-height:250px}
.game-top .icon-button{width:36px;height:36px}
.game-top #score{font-size:19px}#time{font-size:22px}
.game-card{display:grid;grid-template-columns:minmax(0,46%) minmax(0,54%);grid-template-rows:22px 1fr;padding:8px 18px;column-gap:12px;border-radius:20px}
.game-card img{grid-column:1;grid-row:1/3;height:100%;max-height:100%;margin:0;object-fit:contain}
.game-card .eyebrow{grid-column:2;text-align:center;font-size:9px;align-self:end}
.game-card h2{grid-column:2;font-size:clamp(30px,6.5vw,58px);align-self:center}
.game-actions{gap:8px}
.game-actions button{font-size:18px;border-radius:14px}
.game-actions span{font-size:16px}
.motion-hint{font-size:10px}
.guide-image{width:120px}.centered{margin:15px auto}.countdown strong{font-size:100px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}

.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}.ui-icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;flex-shrink:0}.pill .ui-icon{width:14px;height:14px;margin-right:3px}.toggle .ui-icon{width:17px;height:17px}.control-choice strong .ui-icon{margin-right:4px}.countdown small .ui-icon{width:24px;height:24px}

/* Large, high-contrast words and a fresh color on every card. */
.game-card{background:var(--card-color,#e1d6fa);border-color:transparent}
.game-card h2{font-size:clamp(44px,8vw,76px);font-weight:850;letter-spacing:-.045em;color:#242238;line-height:1.08;flex-shrink:0}
.game-card img{max-height:calc(100% - 115px)}
.game-card .eyebrow{color:#45405b}
@media(max-width:600px){.game-card h2{font-size:clamp(40px,11vw,64px)}.game-card img{max-height:calc(100% - 110px)}}
@media(orientation:landscape) and (max-height:600px){.game-card{grid-template-columns:minmax(0,46%) minmax(0,54%);column-gap:12px}.game-card h2{font-size:clamp(36px,7vw,68px);max-height:100%;overflow-wrap:anywhere}.game-card img{max-height:100%}}


/* Premium visual layer — mobile-first, playful and image-led. */
body{background:
 radial-gradient(circle at 88% 7%,#e9ddff 0,transparent 25rem),
 radial-gradient(circle at 4% 32%,#dff4ec 0,transparent 22rem),
 linear-gradient(180deg,#fbfaf8 0%,#f5f1f8 100%);min-height:100dvh}
.topbar{position:relative;z-index:3}.brand img{filter:drop-shadow(0 5px 10px #493e7530)}
.hero{position:relative;overflow:hidden;border:1px solid #ffffffc7;border-radius:34px;background:linear-gradient(135deg,#ffffffc7,#f5efffc4);box-shadow:0 24px 70px #41345d12,inset 0 1px #fff;margin-bottom:30px}
.hero:after{content:'';position:absolute;width:220px;height:220px;border-radius:50%;right:-70px;bottom:-110px;background:#a68ee61c;filter:blur(2px);pointer-events:none}
.hero-copy,.hero-art{position:relative;z-index:1}.pill{background:#ffffffb8;box-shadow:0 8px 24px #44375d0b}
.section-title h2{font-weight:850}.decks{gap:14px}
.deck{overflow:hidden;min-height:154px;border-color:#ffffff;background:linear-gradient(145deg,#ffffff,#faf7fc);box-shadow:0 10px 30px #3c31570d,inset 0 1px #fff}
.deck:before{content:'';position:absolute;width:90px;height:90px;border-radius:50%;right:-35px;top:-35px;background:#8b71d80d}
.deck:hover{box-shadow:0 15px 34px #3c315715}.deck.selected{background:linear-gradient(145deg,#f4efff,#ebe3ff);box-shadow:0 14px 34px #6550b91b}
.deck img,.deck-art{box-shadow:0 7px 16px #30274312}.primary{background:linear-gradient(135deg,#765fd0,#5740ad);box-shadow:0 12px 28px #6550b936, inset 0 1px #ffffff38;letter-spacing:.01em}
.primary:active{transform:translateY(1px);box-shadow:0 6px 15px #6550b92d}
.toggle,.segmented{box-shadow:0 7px 22px #3b31530a}.orientation-choice,.control-choice{border-color:#ded8e6}
.game-top{background:#ffffffb8;border:1px solid #ffffffd6;border-radius:20px;padding:5px 8px;box-shadow:0 8px 26px #2c234817;backdrop-filter:blur(12px)}
.game-card{position:relative;border:1px solid #ffffffbd;box-shadow:0 24px 70px #2f254929,inset 0 1px #fff;isolation:isolate}
.game-card:before{content:'';position:absolute;inset:0;background:linear-gradient(145deg,#ffffff50,transparent 48%);pointer-events:none;z-index:-1}
.game-card img{filter:drop-shadow(0 15px 18px #29213d22)}
.game-card h2{text-shadow:0 2px #ffffff7d}.game-card .eyebrow{background:#ffffff82;padding:6px 11px;border-radius:999px;letter-spacing:.12em}
.game-actions button{box-shadow:0 10px 25px #2c244b14;border:1px solid #ffffff70;transition:transform .12s,filter .12s}.game-actions button:active{transform:scale(.98);filter:saturate(1.12)}
.correct{background:linear-gradient(135deg,#c8ead7,#b8e0c9)}.pass{background:linear-gradient(135deg,#f7e2cd,#efd1b5)}
#pause{background:#fff3;border:2px solid #6b55bd;font-weight:900;color:#4f3b9c;box-shadow:0 5px 14px #4f3b9c18}
.feedback{backdrop-filter:blur(8px)}.feedback strong{animation:premium-pop .28s cubic-bezier(.2,.8,.2,1.2)}
.result-star{filter:drop-shadow(0 10px 18px #765fa638)}
.review-item{box-shadow:0 8px 20px #352c4d0b;background:#ffffffc9}
dialog{box-shadow:0 30px 100px #1711274a;border-color:#ffffff80}
@keyframes premium-pop{0%{transform:scale(.72);opacity:.2}100%{transform:scale(1);opacity:1}}
@media(max-width:600px){.hero{border-radius:26px;padding-left:14px;padding-right:8px}.decks{gap:10px}.deck{min-height:128px;border-radius:21px}.game-top{border-radius:17px}.game-card{border-radius:30px}.game-actions button{min-height:62px}}
@media(orientation:landscape) and (max-height:600px){.game-card{border-radius:26px}.game-card img{filter:drop-shadow(0 10px 14px #29213d20)}.game-top{padding:2px 7px}.game-actions button{min-height:48px}}
