:root{color-scheme:light;--ink:#1d2033;--muted:#65667a;--paper:#fffaf0;--surface:#fff;--accent:#ec405f;--accent2:#ffb52e;--accent-ink:#fff;--tile:#fff4cf;--tile-ink:#342714;--board:#302a4d;--line:rgba(29,32,51,.14);--shadow:0 22px 60px rgba(54,38,21,.16);--radius:28px;--display:Georgia,"Times New Roman",serif;--body:Inter,ui-rounded,"Segoe UI",sans-serif;--pattern:radial-gradient(circle at 7% 8%,rgba(255,181,46,.22) 0 7%,transparent 7.2%),radial-gradient(circle at 94% 26%,rgba(236,64,95,.16) 0 9%,transparent 9.2%)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background-color:var(--paper);background-image:var(--pattern);font-family:var(--body);transition:background-color .25s,color .25s}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,.board:focus-visible{outline:4px solid color-mix(in srgb,var(--accent2) 78%,white);outline-offset:3px}.page-shell{width:min(1180px,calc(100% - 40px));margin:auto}.site-header{position:relative;min-height:112px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px}.brand img{display:block;width:176px;height:auto;object-fit:contain}.belarus-flag{display:none;border-radius:4px;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.clock-button{grid-column:1;justify-self:start;min-width:0;min-height:44px;padding:0;border:0;color:var(--ink);background:transparent}.header-clock{display:flex;flex-wrap:wrap;align-content:center;align-items:baseline;width:max-content;color:var(--ink);font-family:var(--display);font-size:clamp(.95rem,2.2vw,1.28rem);font-weight:800;font-variant-numeric:tabular-nums;line-height:1;white-space:nowrap}.clock-colon{display:inline-block;width:.5ch;text-align:center;animation:clock-blink 1s steps(1,end) infinite}.clock-separator{display:none}#clockDate{flex:0 0 100%;margin-top:2px;text-align:left}@keyframes clock-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.logo-action{grid-column:2;justify-self:center;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;background:transparent}.header-logo{display:block;width:44px;height:44px;object-fit:contain;transform:scale(1.3);transform-origin:center top}.header-popover{position:absolute;z-index:20;top:calc(100% - 2px);left:50%;width:min(360px,calc(100vw - 18px));padding:15px 42px 15px 16px;border:2px solid #7a1e2c;border-radius:16px;color:#172033;background:#fffaf0;box-shadow:0 16px 44px rgba(0,0,0,.36),0 4px 12px rgba(0,0,0,.24);transform:translateX(-50%);font-size:.9rem;line-height:1.4}.header-popover[hidden]{display:none}.header-popover a{color:#7a1e2c;font-weight:900;text-underline-offset:3px}.popover-close{position:absolute;top:7px;right:7px;display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:50%;color:#172033;background:#f1d5a4;font-size:1.25rem;line-height:1}.header-popover .popover-close:focus-visible{outline:3px solid #172033;outline-offset:2px}
.hero{min-height:calc(100vh - 130px);display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,.78fr);gap:clamp(40px,7vw,94px);align-items:center;padding:36px 0 72px}.eyebrow,.mini-label{margin:0 0 12px;color:var(--accent);font-size:.77rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}h1,h2,p{margin-top:0}h1{max-width:720px;margin-bottom:24px;font-family:var(--display);font-size:clamp(3.5rem,7vw,7.4rem);font-weight:800;line-height:.88;letter-spacing:-.065em}h1 em{color:var(--accent);font-weight:inherit}.lede{max-width:600px;margin-bottom:30px;color:var(--muted);font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.55}.hero-notes{display:flex;flex-wrap:wrap;gap:10px}.hero-notes span{padding:9px 12px;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--surface) 75%,transparent);font-size:.83rem;font-weight:700}
.game-card{position:relative;padding:clamp(20px,3vw,34px);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.game-card:before{content:"";position:absolute;inset:13px -13px -13px 13px;z-index:-1;border-radius:var(--radius);background:var(--accent2);transform:rotate(1.5deg)}.game-topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.game-topline h2{margin:0;font-family:var(--display);font-size:1.55rem}.mini-label{margin-bottom:4px;font-size:.65rem}.icon-button{width:46px;height:46px;border:1px solid var(--line);border-radius:50%;color:var(--ink);background:var(--paper);font-size:1.6rem;transition:transform .18s}.icon-button:hover{transform:rotate(-18deg) scale(1.05)}.scoreboard{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.scoreboard div{display:flex;align-items:baseline;justify-content:space-between;padding:11px 14px;border-radius:14px;background:color-mix(in srgb,var(--paper) 85%,var(--accent) 15%)}.scoreboard span{color:var(--muted);font-size:.75rem;font-weight:800;text-transform:uppercase}.scoreboard strong{font-size:1.25rem}
.board{aspect-ratio:1;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(7px,1vw,11px);padding:clamp(9px,1.4vw,14px);border-radius:22px;background:var(--board);box-shadow:inset 0 3px 12px rgba(0,0,0,.24);touch-action:manipulation}.tile,.blank{min-width:0;border-radius:clamp(12px,1.6vw,19px)}.tile{border:0;color:var(--tile-ink);background:var(--tile);box-shadow:inset 0 -5px 0 rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.17);font-family:var(--display);font-size:clamp(1.4rem,3.4vw,2.8rem);font-weight:900;transition:transform .12s,filter .12s}.tile:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.04)}.tile:active:not(:disabled){transform:translateY(2px)}.tile:disabled{cursor:wait;opacity:.68}.blank{background:rgba(255,255,255,.07);box-shadow:inset 0 2px 7px rgba(0,0,0,.18)}
.game-actions{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:end;margin-top:18px}.layout-form label{display:block;margin-bottom:5px;color:var(--muted);font-size:.72rem;font-weight:800}.layout-form>div{display:flex}.layout-form input{width:150px;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:11px 0 0 11px;color:var(--ink);background:var(--paper)}.layout-form button{border:0;border-radius:0 11px 11px 0;padding:0 16px;color:var(--accent-ink);background:var(--accent);font-weight:900}.keyboard-hint{max-width:140px;margin:0;color:var(--muted);font-size:.72rem;line-height:1.35;text-align:right}.game-message{margin-top:16px;padding:15px;border-radius:15px;background:color-mix(in srgb,var(--accent2) 24%,var(--surface))}.game-message strong,.game-message span{display:block}.game-message span{margin-top:5px;color:var(--muted);font-size:.82rem}.text-button{margin-top:8px;padding:0;border:0;color:var(--accent);background:none;font-weight:900;text-decoration:underline}
.records-section,.howto{margin-top:34px;padding:clamp(26px,5vw,54px);border:1px solid var(--line);border-radius:var(--radius);background:color-mix(in srgb,var(--surface) 88%,transparent)}.records-section{display:grid;grid-template-columns:.65fr 1fr;gap:42px;align-items:center}.records-section h2,.howto h2{margin:0;font-family:var(--display);font-size:clamp(2rem,4vw,3.5rem);letter-spacing:-.035em}.record-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.record-card{display:flex;gap:14px;padding:20px;border-radius:20px;color:var(--accent-ink);background:var(--accent)}.record-card:nth-child(2){color:var(--tile-ink);background:var(--accent2)}.record-icon{font-size:2rem}.record-card p{margin-bottom:7px;font-size:.76rem;font-weight:800}.record-card strong,.record-card small{display:block}.record-card strong{font-size:1.45rem}.record-card small{margin-top:4px;opacity:.78}.records-status{grid-column:2;margin:-28px 0 0;color:var(--muted);font-size:.76rem}.howto{display:grid;grid-template-columns:.7fr 1fr;gap:40px;margin-bottom:40px}.howto-title{display:flex;align-items:center;gap:18px}.howto-title>span{font-size:3rem}.howto ol{display:grid;gap:18px;margin:0;padding:0;list-style:none;counter-reset:steps}.howto li{position:relative;padding-left:46px;counter-increment:steps}.howto li:before{content:counter(steps);position:absolute;left:0;top:-3px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:var(--accent-ink);background:var(--accent);font-weight:900}.howto li strong,.howto li span{display:block}.howto li span{margin-top:3px;color:var(--muted);font-size:.9rem}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:28px 0 42px;color:var(--muted);font-size:.78rem}footer img{width:104px;height:auto}footer p{margin:0;text-align:right}
body[data-theme=belarus]{--paper:#fffaf8;--surface:#fff;--ink:#251d1e;--muted:#715f62;--accent:#c5243a;--accent2:#2e7d45;--tile:#fff;--tile-ink:#a7192d;--board:#a7192d;--pattern:repeating-linear-gradient(135deg,transparent 0 34px,rgba(197,36,58,.055) 34px 43px,transparent 43px 58px),linear-gradient(90deg,rgba(197,36,58,.04),transparent 35%,rgba(46,125,69,.05))}body[data-theme=belarus] .belarus-flag{display:block}
body[data-theme=english]{--paper:#f7f1e5;--surface:#fffdf7;--ink:#102647;--muted:#5b6574;--accent:#c52c3e;--accent2:#e4b950;--tile:#fff3d5;--tile-ink:#102647;--board:#102647;--pattern:linear-gradient(120deg,rgba(16,38,71,.08),transparent 35%),repeating-linear-gradient(90deg,transparent 0 64px,rgba(197,44,62,.04) 64px 66px)}
body[data-theme=pirate]{color-scheme:dark;--paper:#071e26;--surface:#0f3038;--ink:#f4dfad;--muted:#b6ac92;--accent:#e19e27;--accent2:#c84f34;--accent-ink:#17282d;--tile:#e5c77f;--tile-ink:#332514;--board:#041419;--line:rgba(244,223,173,.18);--shadow:0 22px 60px rgba(0,0,0,.4);--pattern:radial-gradient(circle at 10% 10%,rgba(225,158,39,.11) 0 10%,transparent 10.3%),repeating-radial-gradient(circle at 90% 40%,transparent 0 30px,rgba(63,148,157,.05) 31px 34px)}
body[data-theme=anime]{--paper:#eefcff;--surface:#fff;--ink:#30205c;--muted:#6c6490;--accent:#ff3d99;--accent2:#36d9ef;--tile:#f8eaff;--tile-ink:#5a2ca0;--board:#6238b7;--radius:24px;--display:"Trebuchet MS","Segoe UI",sans-serif;--pattern:linear-gradient(135deg,transparent 46%,rgba(54,217,239,.13) 46% 49%,transparent 49%),radial-gradient(circle at 80% 13%,rgba(255,61,153,.16) 0 8%,transparent 8.2%)}
body[data-theme=cats]{--paper:#fff5ee;--surface:#fffdfb;--ink:#4c3b47;--muted:#816f79;--accent:#d55f82;--accent2:#f2ae65;--tile:#fce0d8;--tile-ink:#72465a;--board:#835e73;--radius:36px;--display:ui-rounded,"Trebuchet MS",sans-serif;--pattern:radial-gradient(ellipse at 10% 20%,rgba(213,95,130,.12) 0 4%,transparent 4.2%),radial-gradient(ellipse at 85% 12%,rgba(242,174,101,.14) 0 5%,transparent 5.2%)}body[data-theme=cats] .tile{border-radius:42% 42% 34% 34%}
.hero-copy>.eyebrow{text-transform:none}
.theme-reload{grid-column:3;justify-self:end;display:flex;align-items:center;justify-content:flex-end;min-width:66px;min-height:44px;padding:0;border:0;background:transparent}
.theme-flag{display:block;width:66px;height:44px;object-fit:contain}
.theme-flag[hidden]{display:none}
body[data-theme="anime"] #gameTitle>[data-i18n="layoutLabel"]{display:inline-block;font-size:.75em;line-height:1}
body[data-theme="anime"] .mini-label,body[data-theme="anime"] .scoreboard span,body[data-theme="anime"] .layout-form label{line-height:19px}
body[data-theme="anime"] .game-topline>div{min-width:0}
body[data-theme="anime"] #gameTitle{line-height:28px;white-space:nowrap}
body[data-theme="anime"] #gameTitle>[data-i18n="layoutPrefix"],body[data-theme="anime"] #layoutNumber{display:inline-block}
body[data-theme="anime"] .scoreboard strong{line-height:27px}
body[data-theme="anime"] .layout-form input,body[data-theme="anime"] .layout-form button{line-height:21px}body[data-theme="anime"] .layout-form button{font-size:.875rem}
@media(max-width:860px){.page-shell{width:min(100% - 26px,620px)}.site-header{min-height:63px}.header-logo{width:36px;height:36px}.theme-reload{min-width:54px;min-height:44px}.theme-flag{width:54px;height:36px}.brand img{width:142px}.belarus-flag{width:46px;height:auto}.hero{min-height:0;grid-template-columns:1fr;gap:38px;padding:8px 0 46px}.game-card{grid-row:1;padding:18px}.hero-copy{grid-row:2}h1{font-size:clamp(3.2rem,16vw,5.3rem)}.records-section,.howto{grid-template-columns:1fr;gap:26px}.records-status{grid-column:1;margin:-12px 0 0}}
@media(max-width:375px){.header-clock{font-size:.8rem;line-height:1.05}}
@media(max-width:520px){.page-shell{width:min(100% - 18px,440px)}.site-header{min-height:57px;gap:10px}.brand img{width:124px}.hero{padding-top:4px}.game-card:before{inset:8px -5px -8px 5px}.board{gap:7px;padding:8px;border-radius:17px}.tile,.blank{border-radius:11px}.game-actions{grid-template-columns:1fr}.layout-form input{width:100%}.keyboard-hint{display:none}.record-grid{grid-template-columns:1fr}.records-section,.howto{padding:24px 19px}footer{flex-direction:column;align-items:flex-start}footer p{text-align:left}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
:root{--accent2-ink:#342714}
.record-card:nth-child(2){color:var(--accent2-ink)}
.mini-label,.scoreboard span,.layout-form label{font-size:.875rem}
.eyebrow,.record-card p,.records-status,footer{font-size:.8rem}
.keyboard-hint{font-size:.75rem}
body[data-theme=belarus]{--accent2-ink:#fff}
body[data-theme=english]{--accent2-ink:#102647}
body[data-theme=pirate]{--accent2-ink:#17282d}
body[data-theme=anime]{--accent-ink:#30205c;--accent2-ink:#30205c}
body[data-theme=cats]{--accent-ink:#4c3b47;--accent2-ink:#4c3b47}
.footer-copy>span{display:block}
.footer-copy{text-align:left}