:root{--ink:#26324a;--cream:#fff8ed;--white:#fff;--coral:#ff6f61;--teal:#21a69a;--yellow:#ffd75e;--blue:#73b9ff;--shadow:0 12px 30px #4d3d2530}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--cream);color:var(--ink);font-family:ui-rounded,"Nunito","Avenir Next",system-ui,sans-serif}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent;touch-action:manipulation;cursor:pointer}button:focus-visible,input:focus-visible{outline:4px solid #194dff;outline-offset:3px}.app{height:100dvh;display:grid;grid-template-rows:auto auto 1fr auto;gap:6px;padding:max(8px,env(safe-area-inset-top)) max(9px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(9px,env(safe-area-inset-left));background:linear-gradient(165deg,#fff8e8,#e6f8ff)}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:7px;min-height:54px}.brand{display:flex;align-items:center;gap:7px;font-weight:1000;white-space:nowrap}.brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:14px 14px 14px 5px;background:var(--coral);color:#fff}.controls{display:flex;align-items:center;gap:5px}.icon,.lang{min-width:46px;min-height:46px;border:2px solid #fff;background:#ffffffdf;border-radius:15px;box-shadow:0 5px 12px #40506b1f;color:var(--ink);font-size:21px;font-weight:1000}.lang{font-size:13px;padding:0 8px}.instruction{justify-self:center;max-width:650px;margin:0;padding:8px 16px;border-radius:999px;background:#ffffffde;box-shadow:0 5px 16px #40506b16;text-align:center;font-size:clamp(17px,4.8vw,23px);font-weight:1000;line-height:1.1}.stage{min-height:0;position:relative;display:grid;place-items:center;overflow:hidden;border:5px solid #fff;border-radius:clamp(24px,6vw,42px);background:linear-gradient(180deg,#bfeeff 0 62%,#cceba7 62%);box-shadow:var(--shadow)}.footer{min-height:32px;display:flex;justify-content:center;align-items:center;gap:8px;font-size:11px;font-weight:850;color:#536077}.footer b{color:#a64238}.screen,.modal{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:14px;background:linear-gradient(145deg,#fff7dc,#dff6ff)}.modal{background:#1b294bca}.screen[hidden],.modal[hidden]{display:none}.welcome,.dialog{width:min(680px,96vw);text-align:center}.welcome-art{font-size:clamp(88px,27vw,170px);line-height:1;filter:drop-shadow(0 13px 6px #34445a22);animation:float 2.8s ease-in-out infinite}.welcome h1{margin:5px 0 8px;font-size:clamp(36px,10vw,68px);line-height:.95;letter-spacing:-.05em}.welcome p{margin:0 auto 20px;max-width:520px;font-size:clamp(17px,4.5vw,22px);font-weight:800}.start,.secondary{min-height:64px;border:0;border-radius:21px;padding:9px 25px;background:var(--coral);color:#fff;box-shadow:0 9px 0 #c95046,0 15px 28px #a9463440;font-size:clamp(21px,5.8vw,30px);font-weight:1000}.secondary{min-height:50px;background:#edf2f6;color:var(--ink);box-shadow:none;border:2px solid #d7e0e8;font-size:16px}.chips{margin-top:21px;display:flex;justify-content:center;flex-wrap:wrap;gap:7px}.chips span{padding:6px 10px;border-radius:99px;background:#fff;color:#596476;font-size:12px;font-weight:900}.dialog{max-height:92dvh;overflow:auto;border-radius:28px;background:#fff;padding:clamp(19px,5vw,34px);box-shadow:0 25px 80px #0006;text-align:left}.dialog.center{text-align:center}.dialog h2{margin:0 0 8px;font-size:clamp(27px,7vw,42px);line-height:1}.dialog p{line-height:1.5}.actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:18px}.gate{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.gate button{min-height:66px;border:2px solid #d5deea;border-radius:16px;background:#f6f8fb;font-size:25px;font-weight:1000}.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:15px 0}.fact{padding:11px;border-radius:14px;background:#f2f7fa}.fact b,.fact span{display:block}.fact b{font-size:11px;color:#6a7485}.fact span{margin-top:4px;font-weight:900}.settings{display:flex;gap:12px;flex-wrap:wrap;padding:12px 0;border-block:1px solid #e1e7ec}.settings label{display:flex;align-items:center;gap:7px;min-height:44px;font-weight:850}.settings input{width:23px;height:23px}.small{font-size:13px;color:#5c6676}.wrong{animation:shake .25s}.pop{animation:pop .4s cubic-bezier(.2,1.5,.4,1)}@keyframes pop{0%{transform:scale(.4)}70%{transform:scale(1.12)}100%{transform:scale(1)}}@keyframes float{50%{transform:translateY(-9px)}}@keyframes shake{25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}@media(max-width:620px){.brand span:last-child{display:none}.icon,.lang{min-width:43px;min-height:43px;border-radius:14px}.controls{gap:3px}.footer{font-size:10px}}@media(max-width:390px){.app{padding-inline:6px}.icon:nth-of-type(4){display:none}.facts{grid-template-columns:1fr}.brand-mark{width:39px;height:39px}}@media(max-height:610px) and (orientation:landscape){.app{grid-template-rows:auto auto 1fr}.footer{display:none}.toolbar{min-height:44px}.instruction{font-size:16px;padding:5px 12px}.welcome{display:grid;grid-template-columns:.7fr 1.3fr;align-items:center;gap:10px}.welcome-art{grid-row:1/5;font-size:105px}.welcome h1{font-size:42px}.welcome p{font-size:15px}.chips{margin-top:9px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:.01ms!important}}html.reduce-motion *,html.reduce-motion *::before,html.reduce-motion *::after{animation:none!important;transition-duration:.01ms!important}
