:root{color-scheme:dark;--pink:#ff43bb;--gold:#ffd65c;--violet:#7422c7;--deep:#29043e}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overscroll-behavior:none}body{background:#14021f;font-family:'Trebuchet MS','Arial Rounded MT Bold',Arial,sans-serif;color:white;display:grid;place-items:center}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:disabled{opacity:.4;cursor:default}button:focus-visible{outline:3px solid #69ffec;outline-offset:3px}[hidden]{display:none!important}#phone{width:min(100%,460px);height:100dvh;max-height:960px;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 10% 15%,#a420ba88,transparent 45%),radial-gradient(ellipse at 85% 60%,#c1147866,transparent 45%),linear-gradient(#3a0758,#481060 45%,#270437);box-shadow:0 0 80px #cc25ff19;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top)}.stars{position:absolute;inset:0;z-index:-1;background-image:radial-gradient(circle,#ffeda0 1px,transparent 2px),radial-gradient(circle,#e4acff 1px,transparent 2px);background-size:91px 129px,137px 77px;opacity:.22;pointer-events:none}.hud{height:65px;flex-shrink:0;display:flex;justify-content:space-between;align-items:center;padding:9px 17px;background:linear-gradient(#41075bbd,#41075b00)}.brand{text-align:center;font-size:12px;font-weight:900;line-height:1.08;letter-spacing:3px;text-shadow:0 2px #270237}.brand b{font-size:20px;letter-spacing:1px;color:#ffeaa6}.round{width:40px;height:40px;border-radius:14px;border:2px solid #bd64dc;background:linear-gradient(#9b44ca,#65208e);box-shadow:inset 0 2px #dc94ee66,0 3px #260335;font-size:25px;font-weight:bold;flex-shrink:0}.screen{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;padding:4px 17px 12px;display:flex;flex-direction:column;align-items:center}.screen::-webkit-scrollbar{display:none}.ribbon{font-size:9px;letter-spacing:1.5px;font-weight:900;color:#ffda87;text-align:center;margin:8px 0 9px}h1{text-align:center;font-size:33px;line-height:1.03;letter-spacing:-1px;margin:3px 0 8px;font-weight:1000;text-shadow:0 3px #27022d,2px 0 #27022d,-2px 0 #27022d}h1 em{font-style:normal;color:#ffbdeb}h2,p{margin:0}.boyfriend-stage{position:relative;width:100%;flex:1;min-height:220px;max-height:405px;margin:8px 0 10px;border:3px solid #ecb969;border-radius:90px 90px 26px 26px;box-shadow:0 0 0 5px #6f2090,0 0 27px #fa42a044;overflow:hidden;background:#481564}.host-art{background-image:url('assets/boyfriends-atlas.png');background-size:300% 100%;background-position:0% 50%;background-repeat:no-repeat}.hero{position:absolute;inset:0;background-size:300% auto;background-position:0% 20%;}.boyfriend-stage:after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#2c034dd9 65%,#250535)}.host-title{position:absolute;bottom:15px;left:25px;right:25px;text-align:center;z-index:2}.host-title>span{color:#ffd66b;font-size:9px;letter-spacing:2px;font-weight:bold}.host-title h2{font-size:40px;line-height:1.1;text-shadow:0 3px #311042}.host-title p{font-size:13px;color:#ffe3ed;margin-top:7px;font-weight:700}.previous,.next{position:absolute;top:43%;z-index:3;background:linear-gradient(#fa68d7,#b8219d);border-color:#ffd1fb}.previous{left:8px}.next{right:8px}.heart{position:absolute;z-index:3;color:#ff49a7;font-size:30px;filter:drop-shadow(0 3px 0 #760d66);transform:rotate(-18deg)}.h1{left:25px;top:18px}.h2{right:22px;top:43px;transform:rotate(20deg);font-size:22px}.host-options{display:flex;gap:7px;width:100%;margin:3px 0 12px}.host-options button{border:1px solid #9b47bf;background:#361049;border-radius:15px;padding:9px 3px;font-size:11px;flex:1;font-weight:bold}.host-options button[aria-pressed=true]{background:linear-gradient(#ae55e7,#7730b7);border:2px solid #ffd768;box-shadow:0 2px #24052f}.big-button{width:100%;border-radius:19px;border:2px solid #ffb7ed;background:linear-gradient(#ff82d7 0,#fa44b7 38%,#d82199 85%);box-shadow:inset 0 3px #ffe2f288,0 5px #850b6e,0 8px 16px #18032266;padding:14px 15px;font-size:20px;font-weight:1000;text-shadow:0 2px #8c125d;flex-shrink:0}.big-button span{float:right;color:#ffecbc}.big-button:active{transform:translateY(3px);box-shadow:inset 0 3px #ffe2f288,0 2px #850b6e}.prototype{display:block;text-align:center;font-size:7px;letter-spacing:1px;color:#d6abd8;margin-top:13px}.bottom-nav{display:flex;justify-content:space-around;flex-shrink:0;min-height:63px;background:linear-gradient(#722185,#330541);border-top:2px solid #a545ab;padding:5px 12px calc(6px + env(safe-area-inset-bottom))}.bottom-nav button{border:0;background:none;min-width:80px;font-size:24px;color:#e9b8ed;text-shadow:0 2px #270536}.bottom-nav small{display:block;font-size:10px;font-weight:bold}.bottom-nav button.active{color:#ffe382}.chapter-book{display:flex;width:100%;min-height:320px;position:relative;perspective:900px;margin:25px 0 16px;transform:rotate(-2deg);border:6px solid #d870e5;border-radius:13px;box-shadow:0 8px 0 #590f72,0 12px 0 #bd5dbe,0 19px 30px #1b013a}.page{flex:1;background:linear-gradient(90deg,#ffebbf,#fff8df 85%,#d4b784);color:#4e2451;position:relative;padding:16px 9px;display:flex;flex-direction:column;align-items:center;justify-content:center}.page-right{background:linear-gradient(90deg,#d4b784,#fff4d5 12%,#ffedc6);border-left:1px solid #ae8c62}.page-left h2{font-family:Georgia,serif;font-size:24px;text-align:center;line-height:1.2}.page-left p{font-size:10px;text-align:center;margin-top:10px}.page-number{position:absolute;bottom:6px;font-size:9px;color:#9c7c76}.crest{font-size:30px;color:#d7368b;margin-bottom:8px}.contents{font-size:10px;font-weight:bold;letter-spacing:2px;color:#914e65;margin-bottom:16px}.chapter-book.opening{animation:openBook .6s ease both}.page-left .mini-art{width:70px;height:70px;margin:12px auto 0;border-radius:20px}.chapter-entry{width:100%;display:block;text-align:left;border:0;border-bottom:1px dashed #cfaaa6;color:#653353;background:none;padding:12px 0;font-size:12px;font-weight:bold;line-height:1.3}.chapter-entry span{display:block;color:#b35880;font-size:10px;margin-bottom:3px}.chapter-entry:disabled{opacity:.4}.small-note{text-align:center;color:#e8bceb;font-size:13px;line-height:1.5;margin:6px 0 18px}.secondary{background:#582077;border:2px solid #aa50cc;border-radius:15px;padding:13px;font-weight:bold;width:100%;box-shadow:0 3px #250633}.secondary span{float:right;color:#ffda8c}.chapter-hud{display:flex;align-items:center;gap:12px;width:100%;margin:4px 0 10px}.chapter-hud small{color:#ffe08e;letter-spacing:1.7px;font-size:9px;font-weight:bold}.chapter-hud h2{font-size:23px;text-shadow:0 2px #16032b}.moves{margin-left:auto;background:linear-gradient(#9b43df,#552288);border:2px solid #b272e6;border-radius:15px;padding:5px 15px;text-align:center;box-shadow:0 3px #220334}.moves b{display:block;font-size:27px;line-height:1}.moves span{font-size:8px;font-weight:bold;color:#efcbed}.host-bubble{display:flex;width:100%;gap:10px;align-items:center;background:linear-gradient(120deg,#842583,#48115b);border:1px solid #d76bc9;border-radius:18px;padding:7px 10px 7px 7px;box-shadow:0 3px #250634;margin-bottom:11px}.host-bubble .host-art{width:62px;height:67px;border:2px solid #f4c47a;border-radius:14px;flex-shrink:0;background-size:300% auto;background-position:0% 20%;}.host-bubble b{font-size:10px;color:#ffd48b;letter-spacing:.6px}.host-bubble p{font-size:14px;font-weight:800;line-height:1.25;margin:3px 0 5px}.host-bubble small{font-size:6px;letter-spacing:.7px;color:#dab6da}.goal{display:flex;align-items:center;gap:8px;background:#2b0a46;border:2px solid #9952c8;border-radius:17px;width:100%;padding:5px 10px 5px 5px;margin-bottom:12px}.goal-icon{width:44px;height:44px;flex-shrink:0;border-radius:11px}.goal>div:nth-child(2){flex:1}.goal span{font-size:11px;font-weight:bold}.goal strong{color:#ffdf7b;font-size:18px}.track{height:7px;border-radius:8px;background:#18032d;margin-top:5px;overflow:hidden;border:1px solid #562666}.track i{display:block;height:100%;width:0;background:linear-gradient(#8fffed,#1dd6b7);transition:width .3s}#board-shell{position:relative;width:100%;aspect-ratio:1;border-radius:23px;background:linear-gradient(145deg,#a53bec,#5f128e);border:3px solid #d594ed;box-shadow:inset 0 3px 1px #f8d6ff77,0 6px 0 #340b57,0 10px 23px #18022199;padding:8px;flex-shrink:0}#board{position:relative;width:100%;height:100%;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:6px;touch-action:none}.tile{padding:0;border:2px solid #cd82eb;border-radius:17px;position:relative;box-shadow:inset 0 2px #fff5,0 3px #411058;overflow:hidden;background:#5a1c88;user-select:none;touch-action:none}.sprite{background-image:url('assets/misfits-atlas.png');background-size:300% 200%;background-repeat:no-repeat;display:block}.tier-0{background-position:0% 0%}.tier-1{background-position:50% 0%}.tier-2{background-position:100% 0%}.tier-3{background-position:0% 100%}.tier-4{background-position:50% 100%}.tier-5{background-position:100% 100%}.tile .sprite{position:absolute;inset:0;pointer-events:none;transform:scale(1.02)}.tile.selected{outline:3px solid #ffe87b;outline-offset:1px;z-index:2;animation:selected .5s ease-in-out infinite alternate}.tile.hinted{outline:3px solid #70ffe9;outline-offset:1px;animation:selected .5s ease-in-out 3 alternate}.tile.fresh{animation:birth .55s cubic-bezier(.2,1.6,.45,1)}.tile.fresh .sprite{animation:wiggle .6s .3s ease}.hint{text-align:center;font-size:10px;color:#ffdf91;min-height:24px;line-height:1.25;padding-top:11px;margin-bottom:7px}.tools{display:flex;gap:8px;width:100%;margin:0 0 7px}.tools button{flex:1;background:linear-gradient(#8e3cc7,#571b86);border:2px solid #a967d7;border-radius:14px;padding:5px 3px 7px;box-shadow:0 3px #270635;font-weight:bold;font-size:10px}.tools button span{display:block;font-size:21px;color:#ffda70;line-height:1.1}.merge-chain{display:flex;align-items:center;justify-content:center;gap:3px;width:100%;padding:7px 2px;background:#270439;border-radius:14px;flex-shrink:0}.merge-chain .sprite{width:38px;height:38px;border-radius:9px;border:1px solid #b04faf}.merge-chain b{font-size:18px;color:#ffcf74}#fx{position:absolute;inset:0;pointer-events:none;z-index:8;overflow:visible}.flying{position:fixed;z-index:40;border-radius:17px;pointer-events:none;border:2px solid #fff0b3;box-shadow:0 0 25px #ffe670aa;transition:transform .32s cubic-bezier(.45,0,.7,.4),opacity .32s}.puff{position:absolute;width:100px;height:100px;transform:translate(-50%,-50%);filter:drop-shadow(0 0 9px #ffd1ff)}.puff i{position:absolute;inset:20%;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff9e5,#ffd6fa 60%,#e59aff);animation:puff .65s ease-out both;--x:0px;--y:0px}.spark{position:absolute;left:50%;top:50%;font-size:20px;color:#ffe56f;font-weight:bold;animation:spark .8s ease-out both;--x:40px;--y:-60px}.puff i:nth-child(2){--x:30px;--y:10px}.puff i:nth-child(3){--x:-30px;--y:10px}.puff i:nth-child(4){--x:15px;--y:-25px}.puff i:nth-child(5){--x:-20px;--y:-20px}#combo{position:absolute;top:40%;left:0;right:0;pointer-events:none;text-align:center;font-size:33px;font-weight:1000;color:#fff0a0;text-shadow:0 3px #9a128a,2px 0 #90116c,-2px 0 #90116c;z-index:9;transform:rotate(-9deg);opacity:0}#combo.show{animation:combo 1s ease-out both}dialog{width:min(360px,calc(100% - 36px));max-height:90dvh;overflow:auto;border:3px solid #e4a1ec;background:radial-gradient(at 50% 0,#a53ca2,#43105e 70%);border-radius:28px;padding:25px 22px;color:white;text-align:center;box-shadow:0 0 50px #df38ce88}dialog::backdrop{background:#170125cc;backdrop-filter:blur(4px)}dialog h2{font-size:28px;line-height:1.05;margin:10px 0 14px;color:#ffe292}dialog p{font-size:13px;line-height:1.5;margin-bottom:12px}.reward-star{font-size:55px;color:#ffe065;filter:drop-shadow(0 3px #b76421)}.cover{width:138px;min-height:180px;margin:16px auto 22px;position:relative;padding:17px 12px;border:3px solid #ecbf65;border-radius:5px 12px 12px 5px;background:radial-gradient(at 50% 30%,#b847df,#330c56);box-shadow:inset 8px 0 #25093588,4px 3px #fff1c6,8px 6px #672275;color:#ffe4a1;display:flex;flex-direction:column;justify-content:space-between;text-align:center;font-family:Georgia,serif}.cover strong{font-size:22px;line-height:1.1}.cover span{font-size:42px}.cover small{font-size:8px;letter-spacing:2px}.cover.locked{filter:grayscale(.8);opacity:.48}.cover-1{background:radial-gradient(at 50% 30%,#ed369d,#611638)}.cover-2{background:radial-gradient(at 50% 30%,#1ca8b0,#1b2668)}#shelf{display:grid;grid-template-columns:repeat(2,1fr);width:100%;gap:5px 12px;margin:6px 0 18px}#shelf .cover{width:100%;max-width:156px;min-height:190px;margin:5px auto 14px}#shelf .cover:nth-child(3){grid-column:1/3}#confirm .secondary{margin-top:14px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}#toast{position:absolute;bottom:85px;left:25px;right:25px;padding:12px;border:1px solid #ffcd83;background:#441051f5;border-radius:14px;text-align:center;font-size:12px;z-index:90;box-shadow:0 5px 25px #1b001e}.turning{animation:turn .45s ease both}@keyframes selected{to{transform:translateY(-3px) rotate(2deg)}}@keyframes birth{0%{transform:scale(.1)}65%{transform:scale(1.16)}100%{transform:scale(1)}}@keyframes wiggle{25%{transform:rotate(-9deg)}70%{transform:rotate(7deg)}}@keyframes puff{0%{opacity:0;transform:scale(.1)}25%{opacity:1}65%{opacity:1;transform:translate(var(--x),var(--y)) scale(1.3)}100%{opacity:0;transform:translate(calc(var(--x)*1.5),calc(var(--y)*1.5)) scale(1.4)}}@keyframes spark{from{transform:translate(0,0) scale(.3);opacity:1}to{transform:translate(var(--x),var(--y)) scale(1);opacity:0}}@keyframes combo{0%{opacity:0;scale:.4}25%,65%{opacity:1;scale:1.08}100%{opacity:0;scale:1;translate:0 -30px}}@keyframes openBook{from{transform:rotate(-2deg) rotateY(-70deg) scale(.85);opacity:0}to{transform:rotate(-2deg);opacity:1}}@keyframes turn{from{transform:perspective(700px) rotateY(55deg);opacity:.3}to{transform:none;opacity:1}}@media(max-height:760px){.hud{height:52px}.screen{padding-top:0}.ribbon{font-size:8px;margin:5px 0}.screen h1{font-size:28px}.chapter-hud{margin:0 0 6px}.chapter-hud h2{font-size:20px}.host-bubble{margin-bottom:7px}.host-bubble .host-art{height:51px;width:49px}.goal{margin-bottom:8px}.goal-icon{height:33px;width:33px}.merge-chain .sprite{width:29px;height:29px}.bottom-nav{min-height:54px}.hint{padding-top:9px;margin-bottom:4px}.tools button{padding:3px}.chapter-book{min-height:285px;margin-top:12px}.boyfriend-stage{min-height:185px}.prototype{font-size:6px;margin-top:10px}.host-title h2{font-size:32px}.host-options{margin-bottom:8px}.big-button{padding:11px;font-size:18px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.tile.selected{outline:3px solid #ffe87b}}
#play{overflow:hidden}#play>*{flex-shrink:0}@media(max-height:620px){.merge-chain{display:none}.host-bubble small{display:none}.host-bubble .host-art{width:38px;height:42px}.host-bubble p{font-size:12px}.chapter-hud h2{font-size:18px}.hud{height:45px}.brand b{font-size:17px}}

/* Book Crush: phone-first match-three edition. */
.hud{height:55px;padding:6px 14px}.hud>.round{width:36px;height:36px}.brand{font-size:12px;letter-spacing:4px;margin-left:40px}.brand b{font-size:23px;letter-spacing:2px;color:#fff0a6;text-shadow:0 2px #ac2c86,0 4px #320245}.audio-buttons{display:flex;gap:5px}.audio-toggle{width:35px;height:37px;font-size:18px;border-radius:12px;line-height:18px;padding:2px 0}.audio-toggle small{display:block;font-size:6px;letter-spacing:.5px;line-height:8px}.audio-toggle[aria-pressed=true]{color:#ffef97;border-color:#ffd873}.audio-toggle[aria-pressed=false]{color:#d1a5de;filter:saturate(.6)}.hero{border:0;width:100%;height:100%;border-radius:0;cursor:pointer;padding:0}.boyfriend-stage:after,.host-title,.heart{pointer-events:none}.host-title p{min-height:31px}.screen{padding-left:14px;padding-right:14px}.bottom-nav{min-height:55px;padding-top:3px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}.bottom-nav button{font-size:22px}.chapter-book{min-height:335px;margin:15px 0 17px}.page-right{flex:1.08;padding-left:10px;padding-right:8px}.page-left{flex:.92}.page-left h2{font-size:23px}.contents{margin-bottom:8px}.chapter-entry{padding:10px 0;font-size:10px;line-height:1.2}.chapter-entry span{font-size:8px}.page-controls{display:flex;justify-content:center;align-items:center;gap:22px;width:100%;margin-bottom:5px}.page-controls span{font-size:11px;color:#ffdc94;font-weight:bold}.page-controls .round{width:33px;height:30px;font-size:24px;border-radius:11px}.small-note{font-size:12px;margin:8px 0 14px}.chapter-hud{gap:9px;margin:0 0 7px}.chapter-hud>.round{width:33px;height:34px;border-radius:11px}.chapter-hud h2{font-size:19px;max-width:245px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chapter-hud small{font-size:8px}.moves{padding:4px 11px;border-radius:12px;min-width:56px}.moves b{font-size:25px}.host-bubble{padding:6px 8px 6px 6px;margin-bottom:7px;gap:8px;align-items:stretch}.host-bubble .host-art{width:57px;height:auto;min-height:61px;border-radius:13px;padding:0;cursor:pointer}.host-dialogue{flex:1;min-width:0}.speaker-row{display:flex;justify-content:space-between;align-items:center}.speaker-row b{font-size:9px}.speaker-row>span{font-size:7px;font-weight:900;color:#ffbfea;letter-spacing:1px}.host-bubble p{font-size:11px;line-height:1.2;min-height:26px;margin:3px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.host-bubble small{display:block;font-size:5px;letter-spacing:.45px;margin-top:3px}.desire-track{height:12px;border-radius:9px;background:#20052d;border:1px solid #c854ae;position:relative;overflow:hidden;box-shadow:inset 0 2px 3px #130121}.desire-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#f13ac0,#ff70ad,#ffed75);box-shadow:0 0 10px #f455ad;transition:width .35s}.desire-track>span{position:absolute;inset:0;text-align:center;font-size:8px;line-height:10px;font-weight:900;text-shadow:0 1px 2px #3d053b}.crush-mode .host-bubble{border-color:#ffdb72;box-shadow:0 0 15px #fa32a977,inset 0 0 10px #f5716322}.crush-mode #crush-label{color:#fff198}.crush-mode .desire-track i{width:100%!important;background:linear-gradient(90deg,#ff398e,#ffce6e,#ff4bbc);background-size:200%;animation:desireGlow 1.5s linear infinite}.crush-mode #board-shell{border-color:#ffe47b;box-shadow:inset 0 3px #fff8,0 6px #903365,0 0 25px #ff57b677}.goals{display:flex;align-items:stretch;gap:6px;width:100%;margin-bottom:3px}.goal-chip{display:flex;align-items:center;gap:5px;padding:4px 7px;background:linear-gradient(135deg,#4a145e,#2b0a46);border:1px solid #a555ca;border-radius:12px;flex:1;min-width:0}.goal-chip>div{min-width:0}.goal-chip small{font-size:8px;display:block;color:#e9c2ef;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.goal-chip b{font-size:13px;color:#ffe593;display:block}.goal-chip.achieved{border-color:#68ebc5}.goal-chip.achieved b{color:#77ffda}.goal-symbol{font-size:24px;line-height:31px;color:#ffbadf;width:25px;text-align:center}.goal-art{height:30px;width:30px;flex-shrink:0;border-radius:8px}.score-line{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:20px;margin-bottom:5px;color:#e1b9ee;font-size:9px;font-weight:bold}.score-line button{font-size:9px;color:#ffde84;border:0;background:none;padding:3px 0 3px 12px;font-weight:bold}#board-shell{border-radius:20px;padding:6px;border-width:3px;margin:0 auto}#board{grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr);gap:3px;overflow:hidden;border-radius:11px}.tile{border:1px solid #cb87e4;border-radius:10px;box-shadow:inset 0 2px #fff4,0 2px #38104f;transition:filter .15s;min-width:0;min-height:0}.tile .sprite{transform:scale(1.035)}.tile.empty{background:#36104f;border-color:#783992;box-shadow:inset 0 2px 4px #16032b}.tile.selected{outline:2px solid #ffe779;outline-offset:-1px;animation:selectedCrush .5s ease-in-out infinite alternate;z-index:6}.tile.hinted{outline:2px solid #8dffee;outline-offset:-1px;animation:selectedCrush .6s ease-in-out 5 alternate}.tile.crushing{animation:crushing .28s ease-in both}.tile.special{border-color:#ffe785;box-shadow:inset 0 0 0 1px #fff6,0 0 8px #f9b45a88}.tile.rainbow{border-color:#91ffff}.special-tag{position:absolute;right:1px;bottom:1px;background:#61126fd9;color:#fffaa9;min-width:16px;height:15px;border-radius:7px;font-size:13px;font-weight:900;text-shadow:0 1px #2a0632;z-index:4;line-height:15px;pointer-events:none;box-shadow:0 0 2px #fff}.ice-layer{position:absolute;inset:0;border:3px solid #b9fcffbb;background:linear-gradient(140deg,#9beeff66,transparent 40%,#99e9ff44 60%,#fff8 62%,transparent 68%);border-radius:8px;box-shadow:inset 0 0 9px #c9fbffd9;pointer-events:none;color:#edffff;font-size:20px;text-align:right;line-height:1.05;z-index:3;text-shadow:0 1px 3px #098faf}.ice-2 .ice-layer{border-width:4px;background-color:#b1f0ff29}.hint{padding-top:9px;min-height:24px;font-size:9px;line-height:1.25;margin:0 0 5px}.tools{gap:7px;margin-bottom:0}.tools button{padding:4px 2px 5px;font-size:9px;border-radius:13px;border-width:1px}.tools button span{font-size:18px;line-height:20px}.tools button b{font-size:9px;font-weight:700}.tools button.armed{background:linear-gradient(#e781d2,#a62397);border-color:#fff19c;box-shadow:0 0 12px #ffe38288}.puff{width:52px;height:52px;filter:drop-shadow(0 0 5px #ffd1ff)}.puff.big{width:80px;height:80px}.spark{font-size:13px}.puff.big .spark{font-size:19px}#combo{font-size:29px;top:41%}#shelf .cover:nth-child(3){grid-column:auto}.cover strong{font-size:20px}#result .secondary{margin-top:13px}.rules{text-align:left}.rules p{font-size:12px;line-height:1.5;margin-bottom:12px}.rules b{color:#ffe78d}.shuffling{animation:shuffle .25s ease-in-out both}#play{padding-bottom:7px}#choose .prototype{letter-spacing:.55px;line-height:1.4}.host-options button{min-height:35px}
@keyframes crushing{0%{transform:scale(1)}35%{transform:scale(1.2)}100%{transform:scale(.12);opacity:0}}@keyframes selectedCrush{to{filter:brightness(1.22);transform:scale(.92)}}@keyframes desireGlow{to{background-position:200%}}@keyframes shuffle{50%{transform:scale(.9) rotate(3deg);opacity:.35}}
@media(max-height:760px){.hud{height:47px}.brand b{font-size:20px}.brand{font-size:10px}.chapter-book{min-height:308px;margin-top:10px}.chapter-entry{padding:8px 0}.host-bubble .host-art{width:47px;min-height:55px}.host-bubble p{font-size:10px;min-height:24px}.host-bubble{padding:5px 7px 5px 5px}.host-bubble small{font-size:5px}.chapter-hud h2{font-size:18px}.goal-chip{padding:3px 6px}.goal-art{height:27px;width:27px}.goal-symbol{line-height:27px;font-size:21px}.bottom-nav{min-height:51px}.hint{min-height:22px;padding-top:8px}.tools button{padding:3px 2px}.tools button span{font-size:17px;line-height:18px}.tile{border-radius:8px}.special-tag{font-size:11px;height:13px;line-height:13px;min-width:14px}}
@media(max-height:660px){.hud{height:42px}.audio-toggle{height:33px}.chapter-hud{margin-bottom:5px}.chapter-hud h2{font-size:16px}.moves b{font-size:22px}.moves{padding:3px 9px}.host-bubble .host-art{width:39px;min-height:43px}.host-bubble p{min-height:12px;-webkit-line-clamp:1}.host-bubble small{display:none}.host-bubble{margin-bottom:5px}.goal-chip small{font-size:7px}.goal-chip b{font-size:11px}.goal-art{height:25px;width:25px}.score-line{min-height:17px;margin-bottom:3px}.bottom-nav{min-height:46px}.bottom-nav button{font-size:19px}.bottom-nav small{font-size:9px}.tools button span{font-size:15px;line-height:16px}.hint{font-size:8px;min-height:21px}.screen{padding-left:11px;padding-right:11px}.chapter-book{min-height:282px;margin-bottom:13px}.chapter-entry{padding:6px 0}.chapter-hud>.round{width:29px;height:29px}.tile{border-radius:7px}#board{gap:2px}#board-shell{padding:5px;border-radius:16px}.small-note{font-size:11px}.chapter-book .mini-art{width:54px;height:54px}.page-left h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
.addition-0,.addition-1,.addition-2,.addition-3,.addition-4,.addition-5{background-image:url('assets/additions-atlas.png');background-size:300% 200%}.addition-0{background-position:0% 0%}.addition-1{background-position:50% 0%}.addition-2{background-position:100% 0%}.addition-3{background-position:0% 100%}.addition-4{background-position:50% 100%}.addition-5{background-position:100% 100%}

/* The bookshelf edition: illustrated worlds, real trophies, and companion powers. */
#phone{background:#240832;--book-accent:#ff71cf}
#world-backdrop{position:absolute;inset:0;z-index:-3;background-image:url('assets/library-background.png');background-position:center;background-size:cover;opacity:.94;pointer-events:none}
#world-backdrop:after{content:'';position:absolute;inset:0;background:linear-gradient(#1c042b55,#23033322 35%,#1c032770)}
#world-backdrop.themed{opacity:.65}
#phone[data-screen=play] #world-backdrop{filter:blur(2px);transform:scale(1.025);opacity:.48}
#phone[data-screen=play]:after{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(#22032c55,#32093922);pointer-events:none}
.stars{z-index:-1;opacity:.35}.hud{height:66px;position:relative;background:linear-gradient(#1b052bc9,#26043644,transparent);padding:5px 14px}.brand-art{position:absolute;left:50%;top:0;transform:translateX(-50%);width:124px;height:70px;object-fit:contain;pointer-events:none}.audio-buttons{margin-left:auto}.hud>.round{font-size:19px;background:linear-gradient(#713396,#32103f);border-color:#cb92cb}
.screen>h1{font-family:Georgia,serif;font-size:32px;letter-spacing:-.7px;line-height:1.1;color:#fff4d6;text-shadow:0 2px 1px #290225,0 4px 9px #220320}
.screen>h1 em{color:#ffb8e3}
.ribbon{color:#ffe8a2;text-shadow:0 1px 4px #23012c;letter-spacing:1.8px}
.bottom-nav{background:linear-gradient(#623050f2,#270825);border-top:2px solid #b88052;box-shadow:0 -3px 14px #21032380}
.bottom-nav button{color:#edc8d6}.bottom-nav button.active{color:#ffe5a1;filter:drop-shadow(0 0 8px #ff65c088)}
.big-button{border-color:#ffd38b;background:linear-gradient(#ff8dcc,#ed38ad 43%,#ae1880);box-shadow:inset 0 3px #ffe9c477,0 4px #591449,0 7px 17px #14011999}
.secondary{border-color:#ae788c;background:linear-gradient(#62325e,#36112f);box-shadow:0 3px #240522}
.text-button{background:none;border:0;color:#ffe3a2;font-size:11px;padding:9px 12px;font-weight:bold}
#choose .boyfriend-stage{border-color:#edc08b;box-shadow:0 0 0 4px #643360,0 0 22px #ff69bf44;max-height:390px;min-height:200px;margin-top:6px}
.host-options{gap:4px;margin:1px 0 5px}.host-options button{font-size:10px;padding:6px 2px;min-height:40px;line-height:1.3;border-color:#ae679f;background:#361032d9}.host-options small{display:block;font-size:7px;font-weight:400;opacity:.85;margin-top:2px}.host-options button[aria-pressed=true]{background:linear-gradient(#a44f97,#6e285f);border-color:#ffe199}.locked-host{opacity:.64}.locked-host:after{content:'♧';font-size:9px;margin-left:3px}
.host-power{font-size:10px;text-align:center;line-height:1.4;min-height:30px;margin:3px 10px 8px;color:#fff1c7;text-shadow:0 1px 4px #20001d}
.companion-locked{filter:saturate(.65)}.host-title h2{font-family:Georgia,serif;color:#fff1cc}
#choose .prototype{font-size:6px;color:#f1d5ec;margin-top:10px}
.library-summary{display:flex;width:100%;align-items:center;justify-content:space-between;border:1px solid #af796a;border-radius:15px;background:#2c1034bd;color:#ffe4a1;padding:9px 11px;margin-top:7px;font-size:10px;font-weight:bold;box-shadow:0 3px #1c051f55}
.shelf-instruction{font-size:10px;color:#ecd5e5;margin:10px 0 7px;text-align:center;text-shadow:0 1px 3px #200020;line-height:1.4}
.library-welcome{font-size:10px;color:#ffd9ef;text-align:center;margin:8px 5px 0;font-style:italic;text-shadow:0 1px 4px #180021}
#shelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:21px 13px;padding:8px 5px 20px;margin-top:4px}
.shelf-book{position:relative;display:flex;flex-direction:column;align-items:center;background:none;border:0;padding:0 3px 11px;min-width:0;isolation:isolate}
.shelf-book:after{content:'';position:absolute;left:-9px;right:-9px;bottom:65px;height:11px;border-radius:2px;background:linear-gradient(#c39759,#6b3b36 45%,#32172c 55%,#1f0a26);box-shadow:0 5px 7px #10021fd9;z-index:-1}
.shelf-book:disabled{opacity:.7;filter:saturate(.75)}
.shelf-cover{width:100%;aspect-ratio:2/3;position:relative;border:1px solid #e7bb78;border-radius:3px 6px 6px 3px;box-shadow:inset 5px 0 #25082c55,4px 2px 0 #e3cda2,7px 4px 0 #553029,0 6px 14px #0e0226;overflow:hidden;transform:perspective(700px) rotateY(-6deg);background-repeat:no-repeat;background-color:#42234c}
.shelf-book.earned .shelf-cover{box-shadow:4px 2px 0 #e3cda2,7px 4px 0 #553029,0 0 16px #ffaf7866}
.shelf-book:not(:disabled):active .shelf-cover{transform:perspective(700px) rotateY(-2deg) translateY(-4px)}
.sealed-cover{padding:15px 10px;background:radial-gradient(ellipse at 50% 28%,var(--cover-accent,#a5439b),#341333 78%)!important;color:#ffe7b2;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.sealed-cover:before{content:'';position:absolute;inset:8px;border:1px solid #ebbe7cb3;border-radius:2px;box-shadow:inset 0 0 0 3px #51234355,0 0 0 3px #ebbe7c33;pointer-events:none}
.sealed-cover:after{content:'✧';position:absolute;bottom:15px;left:0;right:0;color:#e1a85d;font-size:22px}
.cover-seal{font-size:28px;line-height:1.1;color:#ffbfd8;filter:drop-shadow(0 2px 2px #340525);margin-bottom:12px}
.sealed-cover strong{font-family:Georgia,serif;font-size:18px;line-height:1.15;text-shadow:0 2px #42102c}
.sealed-cover small{font-size:5px;letter-spacing:1px;line-height:1.5;margin:12px 5px 15px;color:#edd6bd}
.book-number{position:absolute;top:-4px;left:0;border:1px solid #ffe3a4;border-radius:50%;width:27px;height:27px;display:grid;place-items:center;font-size:10px;font-weight:bold;background:linear-gradient(#975788,#3e143b);color:#fff0af;box-shadow:0 2px #220420;z-index:2}
.shelf-status{font-size:7px;letter-spacing:.6px;color:#ffe299;border:1px solid #99666b;border-radius:7px;background:#35132ee8;padding:5px 4px;max-width:100%;margin-top:11px;white-space:nowrap}
.shelf-title{font-family:Georgia,serif;font-size:12px;line-height:1.2;margin-top:6px;min-height:29px;color:#fff3d7;text-shadow:0 2px #210420;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.shelf-genre{font-size:8px;color:#e7b8d5;margin-top:3px}
#chapters>.text-button{align-self:flex-start;padding-left:0;margin-bottom:0}
#chapters>h1{font-size:26px;margin:2px 8px 5px}
#chapters>.ribbon{font-size:8px;margin:3px 0 6px}
.chapter-book{border-color:#d6957e;border-radius:9px;min-height:335px;margin:16px 0 19px;box-shadow:0 6px 0 #652449,0 10px 0 #c09b77,0 16px 20px #19011ddd;transform:rotate(-1deg)}
.page{padding-top:14px;padding-bottom:17px}
.mini-cover{width:85px;aspect-ratio:2/3;position:relative;box-shadow:3px 2px #6b3b39;border:1px solid #a96e55;border-radius:3px;background-repeat:no-repeat}
.mini-cover.sealed-cover{padding:10px 8px}.mini-cover .cover-seal{font-size:18px;margin-bottom:5px}.mini-cover.sealed-cover strong{font-size:10px}.mini-cover.sealed-cover small{display:none}.mini-cover.sealed-cover:after{font-size:12px;bottom:5px}
.page-left h2{font-size:16px;line-height:1.15;margin-top:12px;color:#763b57}
.page-left p{font-size:8px;margin-top:8px}.page-left #book-mechanic{font-size:9px;color:#914c69;line-height:1.35;max-width:100px;font-style:italic}
.chapter-entry{padding:9px 0;font-size:11px;border-bottom-color:#c4a18e;line-height:1.15}.chapter-entry b{display:block;font-size:10px}.chapter-entry>small{display:block;font-size:6px;letter-spacing:.7px;color:#a65d61;min-height:0;margin-top:3px}.chapter-entry>small:empty{display:none}
.chapter-entry span{font-size:7px;margin-bottom:4px}.chapter-entry.boss-entry{background:linear-gradient(90deg,#f7e0b700,#eebb8455);border-bottom:1px solid #a96569}.boss-entry b{color:#9a315b}.contents{font-size:7px;letter-spacing:1.3px}.page-controls{margin-bottom:1px}
#book-progress{font-size:10px;max-width:290px;margin:7px 0 12px;line-height:1.5}#book-reveal{font-size:12px;padding:10px}
#play .chapter-hud{background:#24092885;border:1px solid #b78b8444;border-radius:13px;padding:5px 6px;gap:8px;margin-bottom:6px}
.chapter-hud>div:nth-child(2){min-width:0;flex:1}.chapter-hud h2{font-size:17px}.chapter-hud small{font-size:7px;letter-spacing:1.1px}
.host-bubble{border-color:#c58aac;background:linear-gradient(120deg,#6d2a60ee,#32143ff2);gap:7px;align-items:center}
.host-bubble .host-art{height:63px;min-height:0;width:48px}.speaker-row>span{font-size:6px;letter-spacing:.5px}.host-bubble p{font-size:10px}
.power-button{width:43px;min-height:53px;padding:4px 1px;border:1px solid #f1bd86;border-radius:14px;background:linear-gradient(#b94598,#58144c);box-shadow:inset 0 2px #ffb9cb55,0 3px #250826;align-self:center;flex-shrink:0}
.power-button span{font-size:25px;line-height:26px;display:block;color:#ffe3a7}.power-button small{font-size:6px;letter-spacing:.3px;color:#fff1c1}
.power-button:disabled{opacity:.45;filter:saturate(.6)}.power-button:not(:disabled){animation:powerPulse 1s ease-in-out infinite alternate;box-shadow:0 0 12px #ffb7d599,0 3px #5e2042}.power-button.armed{outline:2px solid #fff9ab;background:linear-gradient(#ef9677,#ba236d)}
.crush-mode #board-shell{border-color:#f2d293;box-shadow:inset 0 3px #fff8,0 5px #6c2e4b,0 0 18px #ff96bb55}
.goals{flex-wrap:wrap;gap:4px}.goal-chip{min-width:calc(33% - 4px);padding:3px 5px;background:#2e123be8;border-color:#a76c9e;gap:4px}.goal-chip small{font-size:7px}.goal-chip b{font-size:12px}.goal-symbol{width:22px;font-size:20px;line-height:25px}.goal-art{width:26px;height:26px}
#board-shell{background:linear-gradient(145deg,#8c4cb8,#411d64);border-color:#d2a0d0;box-shadow:inset 0 3px #f9e7ed77,0 5px #2b113f,0 8px 19px #12021c99}
.tile.void-cell{visibility:hidden;pointer-events:none}.tile.flame-cell{background:linear-gradient(#c96646,#93324c);border-color:#ffd185;box-shadow:inset 0 0 11px #ffcf78,0 0 4px #ff7522}.flame-cell:before{content:'';position:absolute;inset:0;border:2px solid #ffb769bb;border-radius:7px;z-index:5;pointer-events:none}
.obstacle-layer{position:absolute;inset:0;pointer-events:none;border:2px solid #dab3f366;border-radius:7px;z-index:4;display:grid;place-items:center}
.obstacle-layer>b{position:absolute;top:0;left:1px;font-size:14px;line-height:15px;color:#fff4c5;text-shadow:0 1px 2px #14051c,0 0 3px #170520}
.obstacle-layer>small{position:absolute;bottom:0;right:0;background:#371535f2;border:1px solid #f5c292;color:#fff5bd;font-size:9px;font-weight:bold;line-height:12px;border-radius:5px;min-width:12px;padding:0 1px;text-align:center}
.obstacle-bat .obstacle-layer{background:radial-gradient(ellipse,#5b377788,#27133e22);border-color:#b999f788}
.obstacle-cage .obstacle-layer{background:repeating-linear-gradient(90deg,transparent 0 18%,#eadbb855 19% 23%,#403e4977 24% 27%,transparent 28% 37%);border-color:#dac6a9}
.obstacle-vine .obstacle-layer{border:3px dashed #93d489;background:linear-gradient(140deg,#418a5322,transparent 40%,#69ae4e33)}
.obstacle-glass .obstacle-layer{border-color:#fff0d3bb;background:linear-gradient(130deg,#fcead577,transparent 35%,#ffffff99 37%,transparent 44%,#efd9ab22)}
.obstacle-chain .obstacle-layer{background:linear-gradient(45deg,transparent 42%,#efc794bb 43% 48%,#5e3652dd 49% 52%,#eccfaaaa 53% 58%,transparent 59%);border-color:#d5b87a}
.obstacle-ink .obstacle-layer{background:radial-gradient(at 45% 65%,#33153ed9 13%,#70248dbb 33%,transparent 65%);border-color:#be77db}
.obstacle-alarm .obstacle-layer{border-color:#ff8a90;background:#df354e22;box-shadow:inset 0 0 8px #fc687066}.obstacle-alarm .obstacle-layer>b{background:#a5234edd;border-radius:50%;width:15px;color:#ffecaa}
.compass-art{display:grid;place-items:center;position:absolute;inset:0;color:#ffe4a4;font-size:32px;background:radial-gradient(#9b6146,#37234f 70%);text-shadow:0 1px #492b38,0 0 5px #ffe8aa}.tile:has(.compass-art){border-color:#ffdc90}
.seeker-art{filter:drop-shadow(0 0 3px #ffee93)}.tile.seeker .special-tag{background:#734188;color:#f5ffa8}
.mechanic-art{background-image:url('assets/mechanics-atlas.png');background-repeat:no-repeat;background-size:400% 300%;display:block}.mechanic-0{background-position:0 0}.mechanic-1{background-position:33.333333% 0}.mechanic-2{background-position:66.666667% 0}.mechanic-3{background-position:100% 0}.mechanic-4{background-position:0 50%}.mechanic-5{background-position:33.333333% 50%}.mechanic-6{background-position:66.666667% 50%}.mechanic-7{background-position:100% 50%}.mechanic-8{background-position:0 100%}.mechanic-9{background-position:33.333333% 100%}.mechanic-10{background-position:66.666667% 100%}.mechanic-11{background-position:100% 100%}.obstacle-layer>b.mechanic-art{width:20px;height:20px;left:-2px;top:-2px;filter:drop-shadow(0 1px 1px #201126)}.tile .mechanic-art{transform:scale(1.05)}.goal-art.mechanic-art{border-radius:0}
.compass-flight{position:absolute;z-index:9;pointer-events:none;filter:drop-shadow(0 0 6px #ffe5a3)}
/* Follow the playable silhouette, including inner holes, instead of boxing empty space. */
#phone #board-shell{background:transparent;border:3px solid transparent;box-shadow:none;isolation:isolate}
#board{z-index:1;background:transparent}
#board-frame{position:absolute;z-index:0;overflow:visible;pointer-events:none;filter:drop-shadow(0 4px 0 #210b37) drop-shadow(0 4px 7px #16021daa)}
.board-surface{fill:#66348ecc;stroke:none}
.board-edge-shadow,.board-edge-gold,.board-edge-light{fill:none;stroke-linecap:round;stroke-linejoin:round}
.board-edge-shadow{stroke:#552443;stroke-width:9}
.board-edge-gold{stroke:#e9ad68;stroke-width:5}
.board-edge-light{stroke:#fff0b0;stroke-width:1.3}
.crush-mode .board-edge-gold{stroke:#ffce78;filter:drop-shadow(0 0 4px #ff63bc)}
#board-frame.board-intro{animation:boardReveal 900ms ease-out}
@keyframes boardReveal{0%{opacity:.35;filter:drop-shadow(0 0 15px #ffe9b9)}50%{opacity:1;filter:drop-shadow(0 0 9px #ffd898)}100%{opacity:1}}
/* Clouds occupy the entire square. More opaque mist means a second layer remains. */
.obstacle-bat .obstacle-layer{border:0;background:radial-gradient(ellipse at 22% 60%,#e8ddfa60,transparent 72%),linear-gradient(135deg,#b2a0d14d,#eadffa55,#8d7bbd4d);box-shadow:inset 0 0 8px #e9dfff88;overflow:hidden;isolation:isolate}
.obstacle-bat .obstacle-layer[data-strength="2"]{background:radial-gradient(ellipse at 20% 60%,#f2e9ff99,transparent 80%),linear-gradient(135deg,#bba8dc88,#f5ebffa6,#a896d280);box-shadow:inset 0 0 12px #f4e9ffcc}
.obstacle-bat .obstacle-layer>b.mechanic-art{width:75%;height:75%;left:14%;top:10%;opacity:.48;filter:drop-shadow(0 0 2px #bfb0e2);z-index:2}
.mist-wisp{position:absolute;width:125%;height:68%;left:-25%;top:-3%;border-radius:50%;background:radial-gradient(ellipse,#faf4ff99,#e6dbff55 45%,transparent 72%);filter:blur(3px);animation:mistDrift 3.8s ease-in-out infinite alternate}
.mist-wisp:nth-of-type(2){left:-5%;top:38%;animation-delay:-1.9s;animation-direction:alternate-reverse;opacity:.85}
.mist-wisp:nth-of-type(3){left:-12%;top:18%;height:45%;animation-delay:-.9s;opacity:.6}
@keyframes mistDrift{from{transform:translate(-7%,-4%) scale(.95)}to{transform:translate(16%,7%) scale(1.1)}}
.moth-flight{position:absolute;z-index:12;pointer-events:none;filter:drop-shadow(0 0 6px #fff5b2) drop-shadow(0 0 12px #f7b8ff)}
.moth-flight:after{content:'✦';position:absolute;left:30%;top:80%;color:#fff2a8;font-size:15px;text-shadow:-10px 7px 4px #ffbdf4,8px 14px 5px #ffe5a6;animation:mothTrail 190ms ease-in-out infinite alternate}
.moth-wings{position:absolute;inset:0;animation:mothFlutter 140ms ease-in-out infinite alternate}
@keyframes mothFlutter{from{transform:scaleX(.62) rotate(-8deg)}to{transform:scaleX(1.1) rotate(7deg)}}
@keyframes mothTrail{to{opacity:.35;transform:translateY(8px) scale(.65)}}
.tile.moth-target{outline:2px solid #ffe7ac;outline-offset:0;box-shadow:inset 0 0 10px #fff2c399,0 0 12px #e6b3ff}
.tile.moth-impact{filter:brightness(1.75)}
.tools #hint-button .bookworm-icon{display:block;width:32px;height:30px;object-fit:contain;margin:-4px auto 0;filter:drop-shadow(0 1px 2px #240322)}
.tools #hint-button:active .bookworm-icon{transform:rotate(-12deg)}
@media(max-height:700px){.tools #hint-button .bookworm-icon{width:25px;height:23px;margin-top:-3px}}
.tools button{background:linear-gradient(#704485,#422449);border-color:#bc8ca8}
#hint{text-shadow:0 1px 4px #180124}.score-line{color:#f2d4eb;text-shadow:0 1px #260122}
dialog{background:radial-gradient(at 50% 0,#8c3e86,#381335 70%);border-color:#e2b88b;box-shadow:0 0 45px #230225,0 0 0 5px #4f29576b}
dialog h2{font-family:Georgia,serif;font-size:28px;color:#ffecc1}dialog .secondary{margin-top:12px}
#story{padding-top:16px}#story>.ribbon{font-size:8px}.story-cover{width:69px;aspect-ratio:2/3;border-radius:4px;border:1px solid #d1a169;position:relative;float:right;margin:2px 0 10px 12px;background-repeat:no-repeat;box-shadow:3px 2px #ac7c77}
.story-cover.sealed-cover{padding:7px}.story-cover .cover-seal{font-size:16px;margin-bottom:4px}.story-cover strong{font-size:8px}.story-cover small{display:none}.story-cover.sealed-cover:before{inset:4px}.story-cover.sealed-cover:after{font-size:10px;bottom:5px}
#story-title{font-size:24px;text-align:left;min-height:96px;display:flex;align-items:center}
#story-lines{clear:both;margin:12px 0 20px}.story-line{display:flex;text-align:left;gap:8px;align-items:center;margin:10px 0;padding:11px 10px;background:#23102977;border:1px solid #b86e9c66;border-radius:15px}.story-line:nth-child(even){margin-left:15px;background:#702c5855}
.story-portrait{display:block;width:48px;height:56px;flex-shrink:0;background-repeat:no-repeat;border:1px solid #d7af75;border-radius:10px}
.story-line b{font-size:11px;color:#ffdb9e}.story-line p{font-size:12px;line-height:1.45;margin:5px 0 0;color:#ffecf4}
.story-rule{border-top:1px solid #d4a76b66;padding-top:10px;margin:6px 0 18px;color:#ffe2ac;font-size:10px!important;line-height:1.45!important}
.chapter-badge{display:block;width:170px;height:165px;object-fit:contain;margin:-8px auto -3px}
#result{padding-top:18px}#result-title{font-size:27px;margin-top:6px}#result-progress{font-size:11px;color:#fce0a2;margin:15px 0 21px}
#reveal{overflow:hidden;padding:22px 21px;max-height:94dvh}
#reveal h2{font-size:25px;margin:8px 0}#reveal-stage{height:282px;width:100%;position:relative;margin:12px 0 9px;perspective:900px}
#reveal-open{position:absolute;top:11px;left:0;width:100%;height:254px;object-fit:contain;mix-blend-mode:screen}
#reveal-book{position:absolute;top:0;left:50%;width:174px;height:261px;margin-left:-87px;transform:rotateY(-85deg);opacity:0;border:1px solid #efc578;border-radius:3px 7px 7px 3px;box-shadow:4px 2px #fbe4b4,8px 4px #98516b,0 0 40px #e447ad55;overflow:hidden}
#reveal-cover{width:100%;height:100%;background-repeat:no-repeat}
.ink-veil{position:absolute;inset:0;background:radial-gradient(at 50% 35%,#96377c,#391139);color:#ffdf93;border:7px double #c48b60;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ink-veil span{font-size:52px;text-shadow:0 0 22px #ff82cf;margin-bottom:23px}.ink-veil small{font-size:9px;letter-spacing:1px;line-height:1.5}
.reveal-dust{position:absolute;left:0;right:0;top:0;font-size:26px;letter-spacing:7px;color:#ffe3ac;opacity:0;pointer-events:none;filter:drop-shadow(0 0 8px #ffd36e)}
.revealing #reveal-open{animation:closeEnchantedBook .9s ease-in forwards}
.revealing #reveal-book{animation:revealBookForm .65s .5s ease-out forwards}
.revealing .ink-veil{animation:inkEvaporates 1.4s 1.05s ease-in-out forwards}
.revealing .reveal-dust{animation:inkDust 1.5s 1s ease-out forwards}
#reveal-copy{font-size:11px;line-height:1.5;margin:5px 0 12px}
.unlock-notice{padding:9px;border:1px solid #eabe80;border-radius:12px;background:#5f305b;color:#ffeeb4;font-size:10px!important}
#settings .secondary{font-size:13px;margin:0 0 10px}.lab-explainer{font-size:10px!important;color:#e0c2d9;margin:5px 0 18px}
#lab label{display:block;text-align:left;margin:12px 0;color:#faddaa;font-size:11px;font-weight:bold}
#lab select{display:block;margin-top:6px;width:100%;padding:10px 8px;border:1px solid #b783a7;border-radius:10px;background:#341332;color:#fff1e4;font:inherit;font-size:12px}
#lab input[type=number]{display:block;width:100%;margin-top:6px;border:1px solid #b783a7;background:#341332;color:#fff1e4;border-radius:9px;padding:9px;font:inherit}#lab .lab-check{display:flex;align-items:center;gap:7px;font-size:10px}#lab input[type=checkbox]{accent-color:#ef65b8;width:17px;height:17px}
#lab>.big-button{margin-top:10px;font-size:17px}#lab .secondary{font-size:12px;margin-top:12px;padding:10px}
#lab-banner{font-size:6px;letter-spacing:.7px;background:#633545;color:#ffe7a6;text-align:center;border-top:1px solid #ad8070;border-bottom:1px solid #ad8070;padding:3px 5px;flex-shrink:0;min-height:20px}
#lab-banner button{font-size:8px;background:#392034;border:1px solid #b28878;border-radius:5px;padding:2px 7px;margin-left:8px;color:#ffedbd}
@keyframes powerPulse{to{filter:brightness(1.2);transform:scale(1.04)}}
@keyframes closeEnchantedBook{0%{opacity:1;transform:rotateY(0deg) scale(1)}70%{opacity:.7;transform:rotateY(75deg) scale(.86)}100%{opacity:0;transform:rotateY(90deg) scale(.75)}}
@keyframes revealBookForm{from{opacity:.2;transform:rotateY(-85deg) scale(.8)}to{opacity:1;transform:rotateY(-5deg) scale(1)}}
@keyframes inkEvaporates{0%{clip-path:inset(0 0 0 0);filter:brightness(1)}30%{filter:brightness(1.5)}100%{clip-path:inset(100% 0 0 0);filter:brightness(2)}}
@keyframes inkDust{0%{opacity:0;transform:translateY(5px) scale(.8)}30%{opacity:1}85%{opacity:.8}100%{opacity:0;transform:translateY(265px) scale(1.5)}}
@media(max-height:760px){.hud{height:54px}.brand-art{height:58px;width:110px}.screen>h1{font-size:28px}#choose .boyfriend-stage{min-height:170px;max-height:340px;margin-bottom:7px}.host-power{font-size:9px;min-height:26px;margin:3px 5px 7px}.host-options button{font-size:9px;min-height:36px}.host-title h2{font-size:33px}.host-title{bottom:12px}.host-title>span{font-size:8px}.host-title p{font-size:11px;min-height:26px}.host-options small{font-size:6px}.host-bubble .host-art{width:43px;height:57px}.power-button{width:36px;min-height:47px}.power-button span{font-size:22px}.host-bubble{padding:4px 6px}.goal-chip{padding:3px 4px}.goal-chip b{font-size:11px}.chapter-hud h2{font-size:16px}.chapter-book{min-height:306px;margin-top:9px;margin-bottom:16px}.chapter-entry{padding:8px 0}.mini-cover{width:75px}.page-left h2{font-size:14px}#chapters>h1{font-size:24px}.shelf-cover strong{font-size:16px}.chapter-badge{height:136px;width:150px}#reveal-stage{height:245px}#reveal-book{width:156px;height:234px;margin-left:-78px}#reveal-open{height:228px}#reveal{padding-top:17px}#reveal h2{font-size:22px}.story-portrait{height:48px;width:41px}}
@media(max-height:670px){.hud{height:44px}.brand-art{height:46px;width:91px}.hud>.round{width:31px;height:31px;border-radius:11px;font-size:17px}.screen>h1{font-size:24px}.host-power{font-size:8px;line-height:1.35;min-height:22px;margin-bottom:5px}#choose .boyfriend-stage{min-height:162px;margin-top:3px}.host-options{margin-bottom:2px}.host-options button{padding:4px 1px;min-height:32px}.host-title{bottom:10px}.host-title h2{font-size:30px}.host-title p{font-size:10px;min-height:23px;margin-top:4px}.host-title>span{font-size:7px}.host-bubble p{font-size:9px;min-height:12px;-webkit-line-clamp:1}.host-bubble .host-art{width:36px;height:42px}.power-button{width:33px;min-height:39px;padding:2px 0}.power-button span{font-size:19px;line-height:21px}.power-button small{font-size:5px}.host-bubble small#voice-label{display:none}.host-bubble{margin-bottom:4px}.goal-chip small{font-size:6px}.goal-chip b{font-size:10px}.goal-symbol{line-height:23px;font-size:18px;width:18px}.goal-art{width:23px;height:23px}#play .chapter-hud{padding:3px 5px;margin-bottom:4px}.chapter-hud h2{font-size:14px}.chapter-hud small{font-size:6px}.moves{min-width:46px}.moves b{font-size:22px}.obstacle-layer>b{font-size:11px}.obstacle-layer>small{font-size:7px;line-height:10px;min-width:10px}.chapter-book{min-height:283px;margin-top:8px;margin-bottom:14px}.chapter-entry{padding:6px 0}.chapter-entry b{font-size:9px}.chapter-entry>small{font-size:5px}.mini-cover{width:63px}.page-left h2{font-size:12px}.page-left #book-mechanic{font-size:8px}.contents{font-size:6px}.page-left p{font-size:7px}#chapters>h1{font-size:21px}#book-progress{font-size:9px;margin-top:5px}#reveal-stage{height:224px}#reveal-book{width:144px;height:216px;margin-left:-72px}#reveal-open{height:210px}#reveal-copy{font-size:10px}#reveal h2{font-size:21px}.story-line{padding:8px}.story-line p{font-size:11px}.chapter-badge{height:119px;width:131px}}
@media(prefers-reduced-motion:reduce){.revealing #reveal-open{opacity:0!important}.revealing #reveal-book{opacity:1!important;transform:none!important}.revealing .ink-veil{display:none!important}.revealing .reveal-dust{display:none!important}}
.chapter-entry b{font-size:12px;line-height:1.17}.chapter-entry{padding-top:7px;padding-bottom:7px}

/* V5: the chapter is the stage. Navigation and exposition belong between moves. */
#phone[data-screen=play]>.hud,#phone[data-screen=play]>.bottom-nav{display:none}
#phone[data-screen=play] #world-backdrop{filter:none;transform:none;opacity:1}
#phone[data-screen=play] #world-backdrop:after{background:linear-gradient(#180d2933,transparent 15%,transparent 85%,#180d2944)}
#phone[data-screen=play]:after{display:none}
#phone[data-screen=play]>.stars{opacity:.1}
#play.screen{padding:8px 9px calc(7px + env(safe-area-inset-bottom));gap:5px;overflow:hidden;align-items:stretch}
.play-topbar{display:flex;align-items:center;gap:8px;width:100%;height:46px;flex-shrink:0;padding:0 2px}
.play-topbar .round{width:36px;height:36px;font-size:21px;border-width:1px;border-radius:12px;background:linear-gradient(#652569ed,#34122ddd);border-color:#f1c088;box-shadow:inset 0 1px #fff4,0 2px 4px #170b1c99}
.play-topbar .play-score{flex:1;min-width:0;color:#fff8dd;text-shadow:0 2px 3px #260b25,0 0 9px #220c22}
#score{display:block;font-size:23px;line-height:1;font-weight:900;letter-spacing:.5px}
#best-score{display:block;font-size:7px;line-height:1.3;letter-spacing:.6px;color:#ffe6ac;margin-top:3px}
.play-topbar .moves{margin:0;min-width:48px;padding:4px 8px;border:1px solid #f9d394;border-radius:13px;background:linear-gradient(#d060bcdf,#552754ee);box-shadow:inset 0 2px #fff4,0 2px 4px #27052288}
.play-topbar .moves b{font-size:23px;line-height:1}.play-topbar .moves span{font-size:7px;letter-spacing:.7px}
#play .goals{width:auto;max-width:100%;align-self:center;flex-shrink:0;display:flex;align-items:stretch;justify-content:center;gap:5px;flex-wrap:nowrap;margin:0 34px 0 0;min-height:35px}
#play .goal-chip{border:1px solid #efc89988;border-radius:12px;background:linear-gradient(#381e3ddd,#241528cc);padding:2px 6px 2px 3px;flex:0 1 auto;min-width:0;gap:3px;box-shadow:0 2px 5px #190a2344}
#play .goal-chip small{font-size:6px;max-width:78px;text-transform:uppercase;letter-spacing:.25px;color:#f2d5e8}
#play .goal-chip b{font-size:12px;line-height:14px;color:#ffe5a9}
#play .goal-chip.achieved b{color:#94ffcf}
#play .goal-art{width:27px;height:27px;flex-shrink:0}
#play .goal-symbol{width:23px;font-size:22px;line-height:25px;flex-shrink:0}
#board-stage{display:flex;justify-content:center;align-items:flex-start;gap:7px;flex:1;min-height:0;width:100%;padding-top:5px;position:relative}
#phone #board-shell{margin:0;aspect-ratio:auto;padding:4px;border-width:2px;flex-shrink:0;border-radius:0}
#play #board{border-radius:5px;gap:3px;overflow:visible}
#play .tile{border-radius:7px;border-color:#d8b3df99;background:#4d1f7499;box-shadow:inset 0 1px #fffc,0 2px #27113788}
#play .tile.void-cell{background:none;border:none;box-shadow:none}
#play .tile.empty{background:#42234e66}
.board-surface{fill:#5732798c}.board-edge-shadow{stroke-width:7}.board-edge-gold{stroke-width:4}.board-edge-light{stroke-width:1.1}
#play .tile.flame-cell{background:linear-gradient(#e9825088,#b8485966);border-color:#ffe0aa}
.desire-rail{width:29px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;padding-top:3px;gap:5px;position:relative}
#crush-label{font-size:6px;letter-spacing:.6px;text-shadow:0 1px 3px #200a23;color:#ffe6a8;font-weight:900}
#play .desire-track{position:relative;flex:1;width:20px;min-height:30px;height:auto;max-height:none;margin:0;overflow:hidden;border:2px solid #efb372;border-radius:15px;background:linear-gradient(90deg,#270d1bcc,#48181edb,#1e0b1ad9);box-shadow:inset 0 0 6px #110519,0 2px 5px #190a2455;isolation:isolate}
#play .desire-track:before{content:'';position:absolute;inset:2px 0;border-radius:10px;z-index:3;box-shadow:inset 3px 0 #fff3,inset -2px 0 #4a001166;pointer-events:none}
#play #desire-fill{position:absolute;bottom:0;left:0;right:0;top:auto;width:100%;height:0;min-height:0;display:block;border-radius:8px 8px 0 0;background:linear-gradient(0deg,#bd1730 0%,#ff4322 40%,#ff9c22 78%,#fff6ac 100%);background-size:100% 100%;box-shadow:0 -1px 8px #ffbe73,inset 0 0 7px #fff1b477;transition:height .24s ease-out;animation:none;overflow:visible}
#play #desire-fill:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 25% 20%,#ffe761bb 0 6%,transparent 7%),radial-gradient(ellipse at 65% 65%,#ffdc5699 0 5%,transparent 7%);background-size:22px 55px;animation:lavaRise 3s linear infinite}
#play .lava-sparks{position:absolute;left:-1px;bottom:78%;width:18px;height:90px;display:block;line-height:24px;color:#fff9af;font-size:15px;text-align:center;background:none;opacity:calc(.3 + var(--heat,0));text-shadow:0 0 6px #ff8b22;animation:heatSparks 1.6s linear infinite}
#play #desire-value{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-90deg);font-size:8px;letter-spacing:.7px;white-space:nowrap;color:#fff8e0;text-shadow:0 1px 3px #300816;z-index:5;font-weight:900}
#play .power-button{width:30px;height:37px;min-height:37px;border-radius:12px;min-width:0;padding:1px 0;border-color:#ffd586;background:linear-gradient(#ee6b6b,#982234);box-shadow:inset 0 1px #fff7,0 2px #2c111e}
#play .power-button span{font-size:21px;line-height:23px}#play .power-button small{font-size:5px;line-height:6px}
#play .power-button:disabled{opacity:.63;filter:saturate(.6)}
#play .desire-track.hot{box-shadow:0 0 12px #ff732166,inset 0 0 6px #2f0310}
.crush-mode #play .desire-track{box-shadow:0 0 15px #ffad35aa,0 0 24px #ff5b3655}.crush-mode #play #desire-fill{height:100%!important;animation:lavaHeat .7s ease-in-out infinite alternate}
.play-footer{display:flex;gap:3px;min-height:104px;height:104px;flex-shrink:0;position:relative;margin-top:0;align-items:flex-end}
.host-cutout{background-image:url('assets/host-cutouts-v5.png');background-size:300% 200%;background-repeat:no-repeat;display:block;aspect-ratio:2/3;border:0;background-color:transparent}
#companion-react{position:relative;width:69px;height:104px;flex-shrink:0;align-self:flex-end;z-index:6}
#small-host{width:69px;height:104px;padding:0;filter:drop-shadow(0 3px 5px #1d0a2299);border:0;border-radius:0;min-height:0;transition:transform .2s;transform-origin:50% 95%}
#companion-react.reacting #small-host{animation:companionReact .55s ease-in-out;filter:drop-shadow(0 0 8px #ffd6a577)}
#reaction-bubble{position:absolute;bottom:82px;left:48px;width:210px;max-width:65vw;background:linear-gradient(#fff2dbea,#f2cbdfee);border:1px solid #ffdaab;border-radius:14px 14px 14px 3px;padding:9px 11px;box-shadow:0 4px 15px #21072399;color:#451a39;pointer-events:none;z-index:12}
#reaction-bubble b{font-size:10px;color:#872953}#reaction-bubble p{font-size:12px;line-height:1.25;margin-top:3px;font-weight:bold}
.footer-controls{flex:1;min-width:0;padding-bottom:4px;display:flex;flex-direction:column;justify-content:flex-end;gap:4px}
#play .hint{font-size:9px;line-height:1.25;color:#ffedb8;text-shadow:0 1px 3px #170b26,0 0 5px #200b25;padding:2px 2px 3px;min-height:25px;margin:0;text-align:center;max-height:37px;overflow:hidden}
#play .tools{display:flex;width:100%;gap:5px;margin:0;flex-shrink:0}
#play .tools button{flex:1;min-width:0;min-height:44px;padding:3px 1px;border:1px solid #dfb094;border-radius:12px;background:linear-gradient(#6e3769e8,#311b3fde);font-size:8px;box-shadow:inset 0 1px #fff3,0 3px #261026bb;display:flex;flex-direction:column;align-items:center;justify-content:center}
#play .tools button b{font-size:8px}#play .tools button span{font-size:21px;line-height:23px;color:#ffdea3}#play .tools #hint-button .bookworm-icon{width:29px;height:27px;margin:-3px 0 -1px}
#play .tools button:disabled{opacity:.45}
#phone[data-screen=play] #lab-banner{font-size:6px;min-height:18px;height:18px;padding:1px 4px;background:#402033bb;border-top:0}
#phone[data-screen=play] #lab-banner button{font-size:7px;padding:0 5px}
.themed-piece{background-image:url('assets/themed-pieces-atlas.png');background-size:600% 400%;background-repeat:no-repeat}
.host-options{gap:4px;flex-wrap:wrap}.host-options button{flex:1 1 28%;padding:5px 2px;min-height:35px}.host-options small{display:block;font-size:7px;margin-top:2px}
#story{position:fixed;inset:0;width:min(100%,460px);max-width:100%;height:100dvh;max-height:100dvh;margin:auto;padding:28px 22px calc(24px + env(safe-area-inset-bottom));border:0;border-radius:0;box-shadow:none;background:linear-gradient(#120a2399,#1d10299c 45%,#210921e8);overflow:hidden;color:#fff8da}
#story::backdrop{background:#100820a6;backdrop-filter:brightness(.53)}
#story .scene-copy{position:relative;z-index:3;margin:8vh 0 0;max-height:35vh;text-align:center}
#story-title{display:block;min-height:0;text-align:center;font-size:34px;line-height:1.12;color:#fff0c3;text-shadow:0 2px #321624,0 0 24px #e08ba366;margin:14px 0}
#story-objective{font-size:13px;line-height:1.4;color:#f4d4e9}
#story-goals{display:flex;flex-direction:column;gap:11px;margin:30px 0 0;color:#fff1c9;font-size:16px;font-weight:bold}
#story-character{position:absolute;left:0;bottom:110px;width:min(77%,320px);height:auto;filter:drop-shadow(0 3px 17px #f7bfa333);z-index:1;pointer-events:none}
#story-lines{position:absolute;left:28%;right:17px;bottom:145px;margin:0;z-index:4;clear:none}
#story-lines .story-line{display:block;text-align:left;background:linear-gradient(#fff6e3f5,#f8d8eaf2);border:1px solid #f6d4a7;border-radius:19px 19px 19px 3px;margin:10px 0;padding:13px;box-shadow:0 4px 20px #18082188;color:#512441}
#story-lines .story-line:nth-child(even){margin-left:18px;background:#4e274bf2;border-color:#d9a3ad;border-radius:17px 17px 3px 17px}
#story-lines .story-line b{font-size:12px;color:#a33168}#story-lines .story-line p{font-size:15px;color:#4b233f;margin-top:5px;line-height:1.4}
#story-lines .story-line:nth-child(even) b{color:#ffd7a6}#story-lines .story-line:nth-child(even) p{color:#fff1de}
#story .scene-actions{position:absolute;left:22px;right:22px;bottom:calc(20px + env(safe-area-inset-bottom));z-index:6;text-align:center}
#story .scene-actions .big-button{font-size:18px;padding:13px}#story .scene-actions .text-button{color:#e5bbda;font-size:11px;margin-top:9px;padding:4px}
#story[data-phase=title] #story-character,#story[data-phase=title] #story-lines,#story[data-phase=title] #story-palette,#story[data-phase=rules] #story-character,#story[data-phase=rules] #story-lines,#story[data-phase=dialogue] #story-palette{display:none}
#story[data-phase=dialogue] .scene-copy{margin-top:3vh}#story[data-phase=dialogue] #story-title{font-size:26px}
#story[data-phase=rules] .scene-copy{margin-top:3vh}#story[data-phase=rules] #story-title{font-size:30px}
#story .story-rule{margin:28px 4px 20px;padding:18px 10px;position:relative;border-top:1px solid #eeb97e66;border-bottom:1px solid #eeb97e66;font-size:18px!important;line-height:1.45!important;color:#ffefd2;text-align:center;max-height:30vh;overflow:auto}
#story-palette{display:flex;flex-wrap:wrap;gap:12px 7px;justify-content:center;max-width:310px;margin:0 auto;position:relative}
#story-palette>div{width:62px;text-align:center}#story-palette .sprite{display:block;width:50px;height:50px;border-radius:11px;margin:auto;border:1px solid #eabd9555;filter:drop-shadow(0 3px 4px #170827)}#story-palette small{display:block;font-size:8px;line-height:1.2;color:#efcee3;margin-top:5px}
.result-stars{font-size:36px;letter-spacing:4px;color:#ffe280;text-shadow:0 2px #8a4350,0 0 14px #ffca6255;margin:8px 0}
#result-best{font-size:10px;color:#ffdba2;margin:-8px 0 18px}#result-progress{margin:8px 0 17px}
.chapter-entry .chapter-rating{font-size:8px;letter-spacing:.3px;color:#a15d26;margin-top:3px}
#settings-audio{display:flex;justify-content:center;margin:0 0 14px}#settings-audio .audio-buttons{margin:0;display:flex;gap:14px}
.current-rule{border:1px solid #e6b38855;border-radius:12px;background:#1f112c55;padding:12px;margin:0 0 17px;color:#ffe8aa;font-size:13px!important;line-height:1.5!important}.current-rule:empty{display:none}
@keyframes lavaRise{to{background-position:0 -110px}}@keyframes heatSparks{0%{opacity:0;transform:translateY(20px) scale(.6)}30%{opacity:1}100%{opacity:0;transform:translateY(-32px) scale(.9)}}@keyframes lavaHeat{to{filter:brightness(1.35)}}@keyframes companionReact{30%{transform:translateY(-8px) rotate(-3deg)}65%{transform:translateY(0) rotate(2deg)}100%{transform:none}}
@media(max-height:700px){#play.screen{padding-top:4px;gap:3px}.play-topbar{height:40px}.play-topbar .round{height:33px;width:33px}.play-topbar .moves b{font-size:21px}#score{font-size:20px}#play .goals{min-height:31px}#play .goal-chip small{font-size:5px}#play .goal-chip b{font-size:11px}#play .goal-art{width:24px;height:24px}.play-footer{height:85px;min-height:85px}#companion-react,#small-host{width:57px;height:85px}#reaction-bubble{bottom:63px;left:42px}#play .hint{font-size:8px;min-height:21px;max-height:30px}#play .tools button{min-height:40px;font-size:7px}#play .tools button b{font-size:7px}#play .tools button span{font-size:18px;line-height:20px}#play #board{gap:2px}#story .scene-copy{margin-top:6vh}#story-title{font-size:29px}#story-goals{margin-top:23px;font-size:14px;gap:9px}#story-character{bottom:100px;width:65%}#story-lines{bottom:115px}#story-lines .story-line{padding:11px}#story-lines .story-line p{font-size:13px}#story .story-rule{margin:17px 0 15px;padding:12px 6px;font-size:15px!important}#story-palette .sprite{width:42px;height:42px}#story-palette{gap:8px 5px}#story-palette>div{width:53px}#story-palette small{font-size:7px}}
@media(max-height:590px){.play-footer{height:70px;min-height:70px}#companion-react,#small-host{width:47px;height:70px}#play .hint{font-size:7px;max-height:24px;min-height:17px}#play .tools button{min-height:36px}#play .tools #hint-button .bookworm-icon{width:24px;height:23px}#story-character{width:57%;bottom:97px}#story-title{font-size:25px}#story .scene-copy{margin-top:2vh}#story .story-rule{font-size:13px!important;margin:12px 0}#story-palette .sprite{width:35px;height:35px}#story-palette>div{width:46px}#story-palette small{font-size:6px}#story .scene-actions .big-button{font-size:16px;padding:10px}}
@media(prefers-reduced-motion:reduce){#play #desire-fill,#play #desire-fill:after,#play .lava-sparks,#companion-react.reacting #small-host{animation:none}#play #desire-fill{transition:none}}
.themed-0{background-position:0% 0.000000%}
.themed-1{background-position:20% 0.000000%}
.themed-2{background-position:40% 0.000000%}
.themed-3{background-position:60% 0.000000%}
.themed-4{background-position:80% 0.000000%}
.themed-5{background-position:100% 0.000000%}
.themed-6{background-position:0% 33.333333%}
.themed-7{background-position:20% 33.333333%}
.themed-8{background-position:40% 33.333333%}
.themed-9{background-position:60% 33.333333%}
.themed-10{background-position:80% 33.333333%}
.themed-11{background-position:100% 33.333333%}
.themed-12{background-position:0% 66.666667%}
.themed-13{background-position:20% 66.666667%}
.themed-14{background-position:40% 66.666667%}
.themed-15{background-position:60% 66.666667%}
.themed-16{background-position:80% 66.666667%}
.themed-17{background-position:100% 66.666667%}
.themed-18{background-position:0% 100.000000%}
.themed-19{background-position:20% 100.000000%}
.themed-20{background-position:40% 100.000000%}
.themed-21{background-position:60% 100.000000%}
.themed-22{background-position:80% 100.000000%}
.themed-23{background-position:100% 100.000000%}

/* The old completion badge contains three baked-in stars; score stars must be truthful. */
#result .chapter-badge{mix-blend-mode:screen;width:120px;height:110px;margin:-5px auto 0}

#story-rule,.current-rule{white-space:pre-line}

/* Recorded story scenes keep every speaker visible on compact phones. */
#story[data-phase=dialogue] #story-lines{top:130px;bottom:130px;overflow-y:auto;overscroll-behavior:contain;padding:0 4px 12px;}
#story-lines .story-line.speaking{outline:2px solid #ffd47c;outline-offset:1px;}
#story-lines .story-replay{display:block;margin:9px 0 0;padding:7px 11px;border:1px solid #b26893;border-radius:10px;background:#542046;color:#fff3e1;font-size:13px;cursor:pointer;}
@media(max-height:700px){#story[data-phase=dialogue] #story-lines{top:115px;bottom:105px;left:23%;right:12px;}}
