@font-face{font-family:Quicksand;src:url('assets/quicksand.ttf') format('truetype');font-weight:300 700;font-display:swap}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;color:#281544;background:#fffdf7;font-family:'Quicksand',ui-rounded,'Trebuchet MS',sans-serif;font-size:18px;line-height:1.65}a{color:inherit}header,footer{max-width:1260px;margin:auto;padding:28px 5%;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-size:21px;text-decoration:none;white-space:nowrap}.brand-star{color:#9e42c8;margin-left:14px;font-size:26px}nav{display:flex;gap:28px}nav a{text-decoration:none;font-size:16px;font-weight:700}nav a:hover{text-decoration:underline}.skip{position:absolute;top:-80px;background:white;padding:12px;z-index:5}.skip:focus{top:0}.hero{background:#bcefeb;display:grid;grid-template-columns:1.12fr .88fr;gap:7%;padding:70px max(6%,calc((100vw - 1100px)/2));align-items:center;border-radius:0 0 80px 0}.eyebrow{font-size:13px;letter-spacing:2px;font-weight:800;margin:0 0 22px}h1,h2,h3{line-height:1.1;margin:0;letter-spacing:-1.5px}h1{font-size:clamp(48px,5.6vw,78px);font-weight:800}h1 span{color:#7334b1}p{margin:0 0 20px}.intro{max-width:470px;font-size:20px;margin:28px 0}.hero-actions{display:flex;flex-direction:column;align-items:flex-start;gap:16px}.button{display:inline-flex;gap:35px;align-items:center;text-decoration:none;font-weight:800;padding:15px 24px;border-radius:100px;background:#4a217e;color:white;box-shadow:0 5px 0 #331455}.button:hover{background:#673396}.button:focus-visible,a:focus-visible{outline:3px solid #da7400;outline-offset:5px}.coming{font-size:14px;font-weight:700}.cover{margin:0;transform:rotate(3deg);max-width:390px;justify-self:center}.cover img{display:block;width:100%;height:auto;max-height:560px;object-fit:contain;border-radius:9px;box-shadow:14px 18px 0 #6937a326,0 16px 32px #223c4830}.cover figcaption{font-size:12px;font-weight:800;text-align:center;letter-spacing:1px;margin-top:20px;line-height:1.5}.ribbon{padding:22px 6%;display:flex;gap:36px;justify-content:center;align-items:center;font-size:16px;font-weight:800;background:#ffd86b;margin-top:35px}.ribbon b{color:#8540ac}.section{max-width:1160px;margin:auto;padding:95px 35px}.section-heading{max-width:720px;margin:auto;text-align:center}h2{font-size:clamp(35px,4vw,52px)}.section-heading>p:last-child{margin:25px auto 0;max-width:640px}.crew{max-width:800px;margin:40px auto}.crew img{width:100%;max-height:450px;object-fit:contain;display:block;border-radius:28px}.crew p{text-align:center;font-size:15px;font-weight:700;margin-top:14px}.details{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:45px}.details article{border-top:2px solid #e6d9f3;padding-top:24px}.number{font-size:14px;font-weight:800;color:#8550af}.details h3{font-size:23px;letter-spacing:-.5px;line-height:1.25;margin:13px 0}.details p{font-size:17px;margin:0}.author{max-width:none;display:grid;grid-template-columns:.85fr 1.15fr;gap:9%;background:#efe4ff;padding:80px max(6%,calc((100vw - 1090px)/2))}.author-label{padding-top:20px}.little-heart{font-family:cursive;font-size:100px;color:#8c42b1;display:block;transform:rotate(-12deg);margin-left:35px}.letter{background:#fffefa;border-radius:6px 35px 6px 35px;padding:42px;box-shadow:8px 8px 0 #d7c3ec;max-width:610px}.letter p{font-size:18px}.signature{margin-bottom:0!important}.signature span{font-family:'Segoe Print','Bradley Hand',cursive;font-size:36px;color:#68348b}.closing{text-align:center;padding:90px 24px;background:#fff7d9}.closing h2{font-size:40px}.closing>p:not(.eyebrow){margin:22px 0}.status{display:inline-block;border:1px solid #7a568d;border-radius:40px;padding:9px 25px;font-size:15px;font-weight:700}footer p{font-size:14px;margin:0} @media(max-width:700px){header{padding:20px 6%}.brand{font-size:18px}.brand-star{display:none}nav{gap:16px}nav a{font-size:14px}.hero{grid-template-columns:1fr;padding:45px 7% 50px;gap:40px;border-radius:0 0 45px 0}h1{font-size:52px}.intro{font-size:18px}.cover{width:75%;max-width:310px}.ribbon{flex-wrap:wrap;gap:6px 16px;font-size:14px;padding:18px}.ribbon b{display:none}.section{padding:60px 7%}.details{grid-template-columns:1fr;gap:25px}.crew{margin:28px auto}.author{grid-template-columns:1fr;gap:25px}.little-heart{display:none}.letter{padding:28px}.closing{padding:60px 7%}.closing h2{font-size:34px}footer{align-items:flex-start;flex-direction:column;gap:10px;padding:30px 7%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
button{font:inherit;cursor:pointer}button:disabled{opacity:.5;cursor:default}button:focus-visible{outline:3px solid #d77400;outline-offset:4px}.button{border:0}.character-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.character{border:2px solid #e4d0f4;border-radius:25px;background:#fff;padding:12px 12px 18px;color:#482174;min-width:0}.character:hover{border-color:#8648ba}.portrait{display:block;width:100%;aspect-ratio:1;background-image:url('assets/headshots.png');background-size:200% 200%;border-radius:18px}.portrait-0{background-position:0 0}.portrait-1{background-position:100% 0}.portrait-2{background-position:0 100%}.portrait-3{background-position:100% 100%}.character strong{font-size:17px}.character.hello{animation:hello .65s ease}.greeting{background:#fff0ba;border:2px solid #ecc35e;border-radius:28px;padding:20px;min-height:76px;font-size:20px!important}.small-button{padding:10px 18px;border-radius:22px;border:1px solid #765396;background:white;color:#46216c;font-weight:700;font-size:15px}.small-button:hover:not(:disabled){background:#eadef6}dialog{width:min(94vw,720px);max-height:94dvh;border:0;border-radius:25px;padding:25px;color:#281544;box-shadow:0 20px 100px #25113b88}dialog::backdrop{background:#241137b8}body:has(dialog[open]){overflow:hidden}.preview-top,.preview-controls{display:flex;align-items:center;justify-content:space-between;gap:12px}.preview-top h2{font-size:28px}.preview-top+p{font-size:15px;margin:8px 0 12px}#preview-page{width:100%;max-height:65dvh;object-fit:contain;display:block;background:#fff}.preview-controls{margin-top:15px}.game-section{text-align:center}.game-section>p:not(.eyebrow){max-width:680px;margin:20px auto}.game-bar{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;margin:24px 0 12px}#game-status{margin-right:auto;font-weight:700}#game{width:100%;height:auto;display:block;background:#bcefeb;border:3px solid #74449a;border-radius:24px;touch-action:none}.game-controls{display:flex;justify-content:center;gap:14px;margin:18px 0}.game-controls button{touch-action:none;user-select:none;min-width:68px;padding:13px 25px;background:#4a217e;color:white;border:0;border-radius:18px;font-weight:800}.game-help{font-size:14px}.game-section h2{margin-bottom:20px}@keyframes hello{0%,100%{transform:rotate(0)}25%{transform:rotate(-5deg) translateY(-10px)}70%{transform:rotate(5deg) translateY(-4px)}}@media(max-width:700px){.character-grid{grid-template-columns:repeat(2,1fr);gap:12px}.preview-top h2{font-size:23px}dialog{padding:16px}.preview-controls{gap:8px}.preview-controls button{padding:10px 12px;font-size:14px}.game-controls button{padding:12px 22px}#game-status{width:100%;margin:0}}@media(prefers-reduced-motion:reduce){.character.hello{animation:none}}

/* Full character cutouts, with a single caption and no portrait cards. */
.character-grid{align-items:end;gap:22px}.character{border:0;border-radius:0;background:transparent;padding:12px 4px;color:#482174}.character:hover{background:transparent}.character-figure{display:block;width:100%;height:280px;object-fit:contain;object-position:bottom;margin:0 auto 18px;transform-origin:50% 90%;filter:drop-shadow(0 8px 5px #55258b15)}.character:nth-child(3) .character-figure,.character:nth-child(4) .character-figure{height:220px}.character.hello{animation:none}.character.hello .character-figure{animation:wave-greeting 1.1s ease-in-out}.character:hover .character-figure{transform:translateY(-5px)}.character:focus-visible{outline:3px dashed #8151a8;outline-offset:4px;border-radius:16px}.author-label h2{font-size:clamp(30px,3.6vw,46px);line-height:1.24}.game-section{max-width:1260px}#game{aspect-ratio:16/9;border:4px solid #8153b0;box-shadow:0 15px 35px #62319320;background:#72dce9}#game-status{font-size:16px}.game-controls button:active{background:#8752c2;transform:translateY(2px)}@keyframes wave-greeting{0%,100%{transform:rotate(0) translateY(0)}18%{transform:rotate(-7deg) translateY(-12px)}38%{transform:rotate(6deg) translateY(-5px)}60%{transform:rotate(-4deg) translateY(-8px)}80%{transform:rotate(3deg)}}@media(max-width:700px){.character-figure{height:235px}.character:nth-child(3) .character-figure,.character:nth-child(4) .character-figure{height:190px}.character-grid{gap:10px 20px}.game-section{padding-left:3%;padding-right:3%}.game-section>p,.game-section>h2{padding-left:4%;padding-right:4%}.game-bar{padding:0 4%}}@media(prefers-reduced-motion:reduce){.character.hello .character-figure{animation:none}.character:hover .character-figure{transform:none}}

.player-picker{border:0;padding:0;margin:25px auto;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.player-picker legend{font-weight:700;margin-bottom:16px}.player-choice{background:#fff;border:2px solid #decbed;border-radius:18px;color:#482174;width:108px;padding:8px;font-size:15px;font-weight:700}.player-choice img{display:block;width:100%;height:90px;object-fit:contain;margin-bottom:6px}.player-choice[aria-pressed=true]{border-color:#562d88;background:#fff1bc;box-shadow:0 3px 0 #562d88}.quest-progress{list-style:none;display:flex;gap:10px;justify-content:center;padding:0;flex-wrap:wrap;font-size:16px;font-weight:700}.quest-progress li{padding:8px 16px;border:2px solid #d9c8eb;border-radius:25px}.quest-progress li.complete{background:#cef5df;border-color:#2f7254}.friend-tip{min-height:54px;font-weight:700;color:#542b7e}.feedback-section{display:grid;grid-template-columns:1fr 230px;align-items:center;gap:40px}.feedback-section h2{margin-bottom:24px}.feedback-section img{max-width:100%;height:auto;object-fit:contain}.feedback-small{font-size:14px;margin:20px 0}.feedback-section .button{gap:8px}.feedback-section .signature{margin-top:25px}@media(max-width:700px){header{flex-wrap:wrap}nav{flex-wrap:wrap}.feedback-section{grid-template-columns:1fr}.feedback-section>img{display:none}.player-choice{width:78px;font-size:14px;padding:6px}.player-choice img{height:70px}.quest-progress{font-size:14px;gap:5px}.quest-progress li{padding:6px 9px}}
