:root{font-family:system-ui,sans-serif;color:#233e54;background:#e8f5ff}*{box-sizing:border-box}body{margin:0}main{max-width:1020px;margin:auto;padding:16px 20px 30px}header{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;margin-bottom:16px}a{color:#346487;text-decoration:none}header b{font-size:1.05rem}.tools{display:flex;gap:7px}button{font:inherit;cursor:pointer;border:0;color:inherit;border-radius:13px;min-height:44px;padding:9px 15px;background:#fff}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #3567d9;outline-offset:3px}h1{font-size:clamp(1.4rem,3vw,1.85rem);line-height:1.2;margin:0 0 8px}p{line-height:1.55}.intro p{margin:7px 0 18px;color:#5a7183;font-size:.94rem}.sets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.set{position:relative;overflow:hidden;text-align:left;background:#fff0bb;min-height:188px;border-radius:20px;padding:17px;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate}.set:nth-child(3n+2){background:#e5dafb}.set:nth-child(3n){background:#c6eee1}.set-art{position:absolute;right:7px;top:6px;width:57%;height:106px;z-index:-1;display:flex;align-items:center;justify-content:center;gap:0}.set-art img{width:64%;height:100%;object-fit:contain;mix-blend-mode:multiply}.set-art img+img{margin-left:-28px;transform:translateY(15px);width:54%;height:80%}.set-symbol{font-size:3.1rem;opacity:.85}.set-number{position:absolute;left:16px;top:15px;display:grid;place-items:center;width:29px;height:29px;background:#fff8;border-radius:9px;font-size:.9rem;font-weight:800}.set strong{font-size:1.03rem;margin-top:75px}.set small{font-size:.78rem;color:#526b7e;margin-top:5px;line-height:1.3}.set .set-status{font-size:.72rem;color:#4e6a7c;display:flex;justify-content:space-between;margin-top:9px}.set.ready{box-shadow:inset 0 0 0 2px #dcb54d50}.set:hover{filter:brightness(.985)}.topic-link{display:block;margin:22px 0 12px;padding:14px 0;font-weight:650}.collection,.note{font-size:.83rem;color:#60798a}details{font-size:.9rem;color:#536d7e;margin:12px 0}summary{cursor:pointer;padding:12px 0}.panel{max-width:760px;margin:auto;background:white;padding:22px;border-radius:24px}.primary{background:#3567d9;color:white;font-weight:750}.soft{background:#edf3fa}.progress{display:flex;justify-content:space-between;gap:10px;font-size:.85rem;color:#627889}.track{height:7px;background:#e7eef7;border-radius:10px;overflow:hidden;margin:11px 0 15px}#fill{height:100%;background:#65b99d;transition:width .25s}.game-heading{display:flex;align-items:center;justify-content:center;gap:9px;text-align:center}.game-heading h1{margin:0}.game-heading>span{font-size:1.8rem}.subprompt{text-align:center;color:#667c8d;font-size:.9rem;margin:7px 0 10px;min-height:22px}.model{display:block;width:100%;max-width:370px;background:#fffaed;min-height:0;padding:5px;margin:0 auto;border-radius:20px}.model img{width:100%;height:min(31vh,270px);object-fit:contain;display:block;mix-blend-mode:multiply}.answers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.answers.two{grid-template-columns:repeat(2,minmax(0,1fr))}.answer{background:#f5f1fb;border:3px solid transparent;min-width:0;padding:7px;min-height:140px}.answer img{display:block;width:100%;height:min(25vh,180px);object-fit:contain;mix-blend-mode:multiply}.answer.correct{background:#dcf5e8;border-color:#62ad87}.answer.wrong{border-color:#edc292}.answer.hinted{border-color:#3567d9;background:#e7f0ff}.answer:disabled{opacity:1}#feedback{min-height:26px;text-align:center;font-weight:700;margin:12px 0;color:#346b57}.controls{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.auto{display:flex;justify-content:center;align-items:center;gap:8px;font-size:.78rem;color:#69808e;margin:14px 0 0}.auto input{width:18px;height:18px}.finish{text-align:center}.trophy{font-size:4.5rem}.learned{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}.learned img{width:54px;height:54px;object-fit:contain}.finish details{text-align:left}dialog{max-width:480px;width:calc(100% - 32px);border:0;border-radius:22px;padding:25px;color:inherit}dialog::backdrop{background:#17394a66}.dialog-close{float:right;background:#edf3fa;font-size:1.5rem}#previewWords{line-height:1.9}.confetti{position:fixed;top:25%;left:50%;pointer-events:none;font-size:1.7rem;animation:cheer 1.2s ease-out forwards;z-index:50}@keyframes cheer{to{transform:translate(var(--x),var(--y)) rotate(120deg);opacity:0}}[hidden]{display:none!important}@media(max-width:600px){main{padding:10px 12px 24px}header{flex-wrap:wrap;margin-bottom:12px}header>a{font-size:.9rem}header b{font-size:1rem}.tools button{padding:7px 10px;font-size:.83rem}.sets{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.set{min-height:174px;padding:13px;border-radius:17px}.set strong{font-size:.94rem}.set small{font-size:.74rem}.set-art{width:67%;height:88px}.set-number{left:12px;top:12px}.set strong{margin-top:73px}.panel{padding:16px}.answers{gap:8px}.answer{padding:3px;min-height:110px}.answer img{height:min(23vh,155px)}.model img{height:min(29vh,220px)}.game-heading h1{font-size:1.4rem}.subprompt{font-size:.82rem}.auto{margin-top:11px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.confetti{display:none}}

.learning #next{font-size:2.7rem;line-height:1;width:104px;min-height:66px;padding:4px 20px;border-radius:22px;box-shadow:0 5px 0 #244ea9}.learning #next:disabled{opacity:.38;box-shadow:none;cursor:default}.learning .controls{align-items:center}.learning #next.ready-next{animation:invite 1.8s ease-in-out infinite}.model{overflow:hidden}.model img{transition:transform .5s ease}.model.second-view{background:#eef8f2}.model.second-view img{transform:scale(1.09)}.model:disabled{cursor:default;opacity:1}@keyframes invite{50%{transform:translateX(4px);box-shadow:0 5px 0 #244ea9,0 0 0 6px #3567d91a}}@media(prefers-reduced-motion:reduce){.learning #next.ready-next{animation:none}.model img{transition:none}}

/* Compact menu and learning screen. Blend the entire artwork group with its card. */
.intro{margin:6px 0 14px}.collection{margin:12px 0 16px}.set{justify-content:flex-start;min-height:190px}.set-art{mix-blend-mode:multiply;height:88px;top:8px}.set strong{margin-top:86px;min-height:1.3em;line-height:1.3}.set small{min-height:2.6em}.set .set-status{display:block;margin-top:auto;padding-top:7px}.set-art img{mix-blend-mode:normal}.learning .model{margin:0 auto 12px}.learning .game-heading{margin-top:0}.learning #feedback:empty{min-height:0;margin:0}.learning .controls{margin-top:12px}.parent-settings{margin:12px 0 0;text-align:center;font-size:.76rem}.parent-settings summary{padding:7px;color:#708494}.parent-settings .auto{margin:5px 0 12px}.parent-settings .note{margin:8px 0;font-size:.75rem}.learning .model img{height:min(32vh,260px)}@media(max-width:600px){.intro h1{font-size:1.35rem}.set{min-height:182px}.set strong{margin-top:80px;font-size:.9rem}.set small{font-size:.72rem}.set .set-status{font-size:.68rem}.set-art{height:80px}.panel{padding:14px}.learning .model img{height:min(31vh,235px)}.learning .track{margin-bottom:10px}.learning .subprompt{margin-bottom:4px}.learning #next{min-height:60px;width:96px}.tools button{min-height:40px}.learning .game-heading h1{font-size:1.55rem}}

/* Full set contents, with separated art above the word list. */
.set{padding:16px;min-height:260px;gap:10px;justify-content:flex-start}.set strong{margin:0;min-height:0;font-size:1rem;line-height:1.3}.set-art{position:static;z-index:auto;top:auto;right:auto;width:100%;height:105px;flex:none;display:flex;gap:6px;mix-blend-mode:multiply}.set-art img,.set-art img+img{width:calc(50% - 3px);height:100%;margin:0;transform:none;object-fit:contain;mix-blend-mode:normal}.set small{margin:0;min-height:0;font-size:.82rem;line-height:1.55;overflow-wrap:normal}.set .set-status{padding-top:5px;margin-top:auto;font-size:.75rem;line-height:1.4}@media(max-width:600px){.set{padding:13px 11px;gap:9px;min-height:260px}.set strong{font-size:.88rem;margin:0}.set-art{height:88px;gap:4px}.set-art img,.set-art img+img{width:calc(50% - 2px);height:100%;margin:0;transform:none}.set small{font-size:.76rem;line-height:1.5}.set .set-status{font-size:.7rem}}

.sets>a.set{color:inherit;text-decoration:none;cursor:pointer}.sets>a.set:focus-visible{outline:3px solid #ed9a23;outline-offset:4px}
