@font-face{font-family:Andika;src:url(../fonts/Andika-Regular.woff2) format("woff2");font-weight:400;font-display:block}@font-face{font-family:Andika;src:url(../fonts/Andika-Bold.woff2) format("woff2");font-weight:700;font-display:block}@font-face{font-family:Fredoka;src:url(../fonts/Fredoka.woff2) format("woff2");font-weight:300 700;font-display:block}html,body{margin:0;height:100%;background:#efe6d4;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;font-family:Andika,system-ui,sans-serif;color:#2b1e16}canvas{display:block;width:100vw;height:100vh}#touch{position:fixed;inset:auto 0 0 0;display:none;justify-content:space-between;padding:18px 28px;pointer-events:none}body.touch #touch{display:flex}#touch .l,#touch .r{display:flex;gap:16px;pointer-events:auto}#touch button{width:84px;height:84px;border-radius:50%;border:3px dashed #b9a98c;background:#faf4e88c;font-size:30px;color:#6d6252;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#read{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#3c281e26,#281c148c);-webkit-backdrop-filter:blur(7px) saturate(.8);backdrop-filter:blur(7px) saturate(.8);animation:fin .35s ease}@keyframes fin{0%{opacity:0}to{opacity:1}}@keyframes pop{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}#read.hide,.hide{display:none!important}.card{background:url(../art/card.png) center/100% 100% no-repeat;padding:54px 90px 60px;text-align:center;filter:drop-shadow(0 18px 30px rgba(50,30,20,.35));max-width:82vw;min-width:560px;animation:pop .4s cubic-bezier(.2,1.4,.4,1)}#rPrompt{color:#7d7262;font-size:22px}#rWord{font:700 128px Trebuchet MS,Avenir Next,sans-serif;letter-spacing:.06em;color:#c98f93;text-shadow:0 0 6px #fff4d6,0 0 30px #ffd98a,0 0 60px rgba(255,210,130,.8),0 3px 0 #a8737a;margin:4px 0;animation:gl 2.4s ease-in-out infinite}@keyframes gl{50%{text-shadow:0 0 10px #fff4d6,0 0 44px #ffd98a,0 0 90px rgba(255,210,130,.9),0 3px 0 #a8737a}}#rWord span{cursor:pointer;padding:0 4px;border-radius:12px}#rWord span.on{background:#fff0bf}#rStatus{min-height:30px;font-size:22px;color:#8a6a6a}.btns{display:flex;gap:14px;justify-content:center;margin-top:14px;flex-wrap:wrap}.btns button{font:inherit;font-size:20px;padding:12px 22px;border-radius:999px;border:2px dashed rgba(255,250,235,.8);background:#a9b894;color:#fffaf0;box-shadow:inset 0 -3px #0000001f,0 4px 10px #3c281433;outline:3px solid #a9b894}.btns button:active{transform:scale(.95)}.btns .parent{background:#d4a5a5;outline-color:#d4a5a5;font-size:15px}#rotate{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#efe6d4;color:#6d6252;font-size:28px;align-items:center;justify-content:center}@media (orientation:portrait) and (max-width:1100px){#rotate{display:flex}}#touch{padding:max(20px,env(safe-area-inset-bottom)) max(28px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(28px,env(safe-area-inset-left))}#touch button{width:96px;height:96px;border:3px solid #C98F93;background:#fbf4e6f0;color:#2b1e16;font:700 34px Andika,system-ui,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}#touch button small{font-size:16px;margin-top:4px}.card{padding:6vh 7vw 7vh;min-width:min(820px,86vw);background:#fbf4e6;border-radius:40px;box-shadow:0 0 0 10px #fbf4e6,0 20px 50px #1e120a73;outline:3px dashed #C98F93;outline-offset:-14px;filter:none}#rPrompt{font:700 clamp(20px,3.6vh,30px) Andika,system-ui,sans-serif;color:#2b1e16}#rWord{display:flex;justify-content:center;gap:2.2vh;margin:3vh 0 2.4vh;font:700 15vh/1 Andika,system-ui,sans-serif;color:#2b1e16;text-shadow:none;animation:none;letter-spacing:0}#rWord span{display:flex;align-items:center;justify-content:center;min-width:16vh;height:20vh;padding:0 1.6vh;border-radius:24px;background:#fffcf5;border:4px solid #E0B85A;box-shadow:0 0 28px #ffcd6ebf,inset 0 -6px #2b1e1614;cursor:pointer;animation:gl2 2.4s ease-in-out infinite}#rWord span.on{background:#fff0bf;transform:scale(1.06)}@keyframes gl2{50%{box-shadow:0 0 46px #ffcd6ef2,inset 0 -6px #2b1e1614}}#rStatus{font:400 clamp(20px,3.4vh,28px) Andika,system-ui,sans-serif;color:#2b1e16;min-height:4.2vh}.btns{gap:18px;margin-top:2.6vh}.btns button{display:flex;align-items:center;gap:10px;min-height:64px;padding:0 28px;font:700 clamp(20px,3.2vh,26px) Andika,system-ui,sans-serif;background:#3e5236;color:#fff8ec;border:2px dashed rgba(255,248,236,.7);outline:none;border-radius:999px}.btns button span{font-size:1.15em}.btns .parent{background:#7a2f3b;outline:none;font-size:clamp(17px,2.6vh,22px)}#rotate{font:700 32px Andika,system-ui,sans-serif;color:#2b1e16}#rChoices{display:flex;gap:3vh;justify-content:center;margin:3vh 0 2vh}.spoolw{display:flex;flex-direction:column;align-items:center;gap:1vh;background:#fffcf5;border:4px solid #D9C6A4;border-radius:28px;padding:2vh 3vh 2.4vh;min-width:20vh;cursor:pointer;box-shadow:0 8px 18px #2b1e162e;transition:transform .15s}.spoolw i{width:6vh;height:8vh;background:url(../art/spool.png) center/contain no-repeat}.spoolw span{font:700 10vh/1 Andika,system-ui,sans-serif;color:#2b1e16;letter-spacing:.06em}.spoolw.sel{border-color:#e0b85a;box-shadow:0 0 34px #ffcd6ee6;transform:translateY(-6px) scale(1.04)}.spoolw.shake{animation:sh .4s}@keyframes sh{20%{transform:translate(-10px)}40%{transform:translate(10px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}#p2chip{position:fixed;top:max(24px,env(safe-area-inset-top));left:50%;transform:translate(-50%);background:#f3dada;color:#7a2f3b;font:700 22px Andika,system-ui,sans-serif;padding:12px 26px;border-radius:999px;border:2px dashed #7A2F3B;box-shadow:0 6px 16px #28190f40}
