/* Дизайн-система «Тут ответ».
   Значения заданы только в токенах :root, компоненты берут их из переменных.
   Шрифт Inter лежит на хостинге: assets/fonts/. */
@font-face{font-family:Inter;src:url(fonts/inter-cyrillic.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Inter;src:url(fonts/inter-latin.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  /* цвет */
  --ink:#16213a;--ink-2:#26345a;--soft:#55607a;--line:#d9dfe9;--mist:#f3f5f9;--paper:#fff;
  --sun:#ffcf33;--sun-soft:#fff1bf;--act:#2447e0;--act-d:#1a35ad;--sky:#cfe0ff;--ok:#0b7a55;--bad:#c62f2f;--bad-soft:#f7c1c1;--block:#e6eaf1;--mute:#8e98ad;
  /* шрифт */
  --font:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  /* размер / высота строки, сетка 4px */
  --t-xs:13px/18px var(--font);--t-sm:14px/20px var(--font);--t-md:16px/24px var(--font);--t-lg:18px/28px var(--font);--t-xl:21px/28px var(--font);
  --t-h3:600 19px/26px var(--font);--t-h2:700 26px/32px var(--font);--t-h1:700 38px/44px var(--font);--t-display:700 56px/62px var(--font);
  /* трекинг Inter: крупнее кегль, плотнее буквы */
  --tr-body:-.011em;--tr-h3:-.014em;--tr-h2:-.019em;--tr-h1:-.022em;--tr-display:-.03em;
  /* отступы, шаг 4px */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;--s12:48px;--s16:64px;
  /* форма */
  --r-sm:6px;--r:8px;--r-lg:12px;--stroke:1.5px;--h-ctl:44px;
  --wrap:1200px;--gutter:20px;--measure:68ch;--cell:44px;
}

/* основа */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:var(--t-md);letter-spacing:var(--tr-body);font-feature-settings:"calt","kern","liga";font-optical-sizing:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;display:flex;flex-direction:column;min-height:100vh}
main{flex:1;padding-bottom:var(--s16)}
a{color:var(--act);text-decoration:none}
a:hover{color:var(--act-d);text-decoration:underline;text-underline-offset:2px}
h1,h2,h3,p,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
h1{font:var(--t-h1);letter-spacing:var(--tr-h1);margin-bottom:var(--s3);text-wrap:balance}
h2{font:var(--t-h2);letter-spacing:var(--tr-h2);margin:var(--s10) 0 var(--s4);text-wrap:balance}
h3,.h3{font:var(--t-h3);letter-spacing:var(--tr-h3);margin:var(--s6) 0 var(--s2)}
p{margin-bottom:var(--s3);text-wrap:pretty}
b{font-weight:600}
button,input{font:inherit;letter-spacing:inherit;color:inherit}
:focus-visible{outline:2px solid var(--act);outline-offset:2px}
.wrap{max-width:calc(var(--wrap) + 2*var(--gutter));margin:0 auto;padding:0 var(--gutter)}
.narrow{max-width:calc(var(--measure) + 2*var(--gutter))}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:var(--s2) var(--s3);z-index:9}
.skip:focus{left:var(--s2);top:var(--s2)}
.lead{font:var(--t-lg);color:var(--soft);max-width:60ch;margin-bottom:var(--s4)}
.count,.t-sm{font:var(--t-sm);color:var(--soft)}
.count{margin:var(--s4) 0 var(--s1)}
.t-display{font:var(--t-display);letter-spacing:var(--tr-display)}
.t-h1{font:var(--t-h1);letter-spacing:var(--tr-h1)}
.t-h2{font:var(--t-h2);letter-spacing:var(--tr-h2)}
.t-h3{font:var(--t-h3);letter-spacing:var(--tr-h3)}

/* шапка */
.top{border-bottom:1px solid var(--line);background:var(--paper)}
.top-in{display:flex;align-items:center;gap:var(--s3) var(--s6);min-height:64px;flex-wrap:wrap;padding-top:var(--s2);padding-bottom:var(--s2)}
.logo{display:flex;align-items:center;gap:var(--s2);color:var(--ink);font:700 20px/24px var(--font);letter-spacing:-.02em}
.logo:hover{text-decoration:none;color:var(--ink)}
.logo-t{display:flex}
.logo-t i{font:800 14px/1 var(--font);width:24px;height:24px;display:grid;place-items:center;border:var(--stroke) solid var(--ink);margin-left:-1.5px;background:var(--paper)}
.logo-t i:first-child{margin-left:0}
.logo-t .on{background:var(--sun)}
.nav{display:flex;gap:var(--s1) var(--s5);font-weight:500;flex-wrap:wrap}
.nav a{color:var(--ink);padding:var(--s1) 0;border-bottom:2px solid transparent}
.nav a:hover{text-decoration:none;color:var(--ink);border-color:var(--line)}
.nav a[aria-current]{border-color:var(--sun)}
.top-s{margin-left:auto;display:flex;flex:0 1 320px;min-width:220px}
.top-s input{flex:1;min-width:0;height:40px;border:var(--stroke) solid var(--line);border-right:0;border-radius:var(--r) 0 0 var(--r);padding:0 var(--s3);font:var(--t-sm);background:var(--paper)}
.top-s input:focus{border-color:var(--ink);outline:none}
.top-s button{height:40px;border:0;background:var(--ink);color:var(--paper);border-radius:0 var(--r) var(--r) 0;padding:0 var(--s4);font:600 14px/20px var(--font);cursor:pointer}
.crumbs{margin-top:var(--s4);margin-bottom:var(--s3);font:var(--t-sm);color:var(--soft)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s2)}
.crumbs li+li::before{content:"/";margin-right:var(--s2);color:var(--line)}
.crumbs a{color:var(--soft)}
main>section:first-child{margin-top:var(--s6)}
main>.hero:first-child{margin-top:0}

/* кнопки и поля */
.btn,.btn2{height:var(--h-ctl);padding:0 var(--s5);border-radius:var(--r);font:600 15px/20px var(--font);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}
.btn{background:var(--ink);color:var(--paper);border:0}
.btn:hover{background:var(--ink-2)}
.btn2{background:var(--paper);color:var(--ink);border:var(--stroke) solid var(--line)}
.btn2:hover{border-color:var(--ink)}
.row-form{display:flex;gap:var(--s2);max-width:560px;margin:var(--s4) 0}
.row-form input{flex:1;min-width:0;height:var(--h-ctl);border:var(--stroke) solid var(--line);border-radius:var(--r);padding:0 var(--s3)}
.row-form input:focus{border-color:var(--ink);outline:none}

/* поиск: определение, длина и маска из клеток */
.hero{background:var(--mist);border-bottom:1px solid var(--line);padding:var(--s12) 0 var(--s12)}
.hero-in{display:flex;align-items:center;justify-content:space-between;gap:var(--s10)}
.hero-main{flex:1;min-width:0}
.hero-art{--c:64px;flex:none;display:grid;grid-template-columns:repeat(5,var(--c));grid-auto-rows:var(--c)}
.hero-art b{display:grid;place-items:center;background:var(--paper);outline:var(--stroke) solid var(--ink);outline-offset:-.75px;font:700 30px/1 var(--font)}
.hero-art b.on{background:var(--sun)}
.hero h1{font:var(--t-display);letter-spacing:var(--tr-display);max-width:13em;margin-bottom:var(--s3)}
.hero .lead{margin-bottom:var(--s5)}
.sf{display:grid;grid-template-columns:1fr 88px auto;gap:var(--s3);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s4);margin:var(--s4) 0 var(--s2);max-width:800px}
.sf label>span,.sf-m>span{display:block;font:500 13px/18px var(--font);color:var(--soft);margin-bottom:var(--s1)}
.sf input:not([type=hidden]){width:100%;height:48px;border:var(--stroke) solid var(--line);border-radius:var(--r);padding:0 var(--s3);font:var(--t-lg);background:var(--paper)}
.sf input:focus{border-color:var(--ink);outline:none}
.sf-go{align-self:end;height:48px}
.sf-m{grid-column:1/-1}
.mask{display:flex;flex-wrap:wrap;--c:48px}
.sf .mask input{width:var(--c);height:var(--c);border:var(--stroke) solid var(--ink);border-radius:0;margin-left:-1.5px;padding:0;text-align:center;font:700 22px/1 var(--font);text-transform:uppercase;background:var(--paper);caret-color:transparent}
.sf .mask input:first-child{margin-left:0}
.sf .mask input:focus{background:var(--sun);position:relative;z-index:1}
.sf .mask input.has{background:var(--sun-soft)}

/* клетки */
.cells{display:inline-flex;vertical-align:top}
.cell{width:var(--cell);height:var(--cell);display:grid;place-items:center;border:var(--stroke) solid var(--ink);margin-left:-1.5px;font:700 19px/1 var(--font);background:var(--paper);color:var(--ink)}
.cell:first-child{margin-left:0}
.cell-hit{background:var(--sun)}
.cells.big{--cell:52px}
.answers{margin-top:var(--s2)}
.ans{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:var(--s2) var(--s5);align-items:center;padding:var(--s3) 0;border-bottom:1px solid var(--line)}
.ans[hidden]{display:none}
.ans-word{display:block;max-width:100%;overflow:hidden}
.ans-word:hover{text-decoration:none}
.ans-word:hover .cell{background:var(--sun-soft)}
.ans-word:hover .cell-hit{background:var(--sun)}
.ans-def{margin:0;color:var(--soft);max-width:60ch}
.word-hero{margin-bottom:var(--s2)}
.word-hero p{margin-top:var(--s3);color:var(--soft)}
.defs{list-style:decimal;padding-left:var(--s6);max-width:var(--measure)}
.defs li{margin-bottom:var(--s2)}
.defs li::marker{color:var(--soft);font-variant-numeric:tabular-nums}
.wl{line-height:28px;max-width:var(--measure)}
.src{margin-top:var(--s6);font:var(--t-xs);color:var(--soft)}
.src a{color:var(--soft)}
.empty{margin-top:var(--s4);padding:var(--s4) var(--s5);background:var(--mist);border-radius:var(--r)}
.empty p{margin:0}

/* колонки */
.two{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:var(--s12);align-items:start}
.side{display:flex;flex-direction:column;gap:var(--s3)}
.side-card{display:block;border:1px solid var(--line);border-radius:var(--r);padding:var(--s3) var(--s4);color:var(--ink)}
.side-card:hover{border-color:var(--ink);text-decoration:none;color:var(--ink)}
.side-card b,.side-card span{display:block}
.side-card span{font:var(--t-sm);color:var(--soft)}
.side-dark{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.side-dark:hover{color:var(--paper)}
.side-dark span{color:#c6cede}
.ad{margin:var(--s6) 0;min-height:120px}

/* списки и фильтры */
.pills{display:flex;flex-wrap:wrap;gap:var(--s1);margin:var(--s3) 0}
.pills a{min-width:var(--h-ctl);height:var(--h-ctl);padding:0 var(--s3);display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--r);color:var(--ink);font-weight:500;font-variant-numeric:tabular-nums}
.pills a:hover{border-color:var(--ink);text-decoration:none;color:var(--ink)}
.pills a[aria-current]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.filter{display:flex;align-items:center;gap:var(--s3);margin:var(--s3) 0 var(--s1);flex-wrap:wrap}
.filter label{font:500 14px/20px var(--font);color:var(--soft)}
.filter input{height:var(--h-ctl);border:var(--stroke) solid var(--line);border-radius:var(--r);padding:0 var(--s3);letter-spacing:.1em;width:220px}
.filter input:focus{border-color:var(--ink);outline:none}
.az{display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin:var(--s2) 0}
.az span{font:500 13px/18px var(--font);color:var(--soft);width:100%}
.az a{width:32px;height:32px;display:grid;place-items:center;color:var(--ink);font:500 14px/1 var(--font);border-radius:var(--r-sm)}
.az a:hover{background:var(--mist);text-decoration:none;color:var(--ink)}
.az a[aria-current]{background:var(--sun);font-weight:700}
.tags{display:flex;flex-wrap:wrap;gap:var(--s2)}
.tags a{display:block;padding:var(--s2) var(--s3);border:1px solid var(--line);border-radius:var(--r);color:var(--ink);font-weight:500}
.tags a:hover{border-color:var(--ink);text-decoration:none;color:var(--ink)}
.tags a.more{border-color:transparent;color:var(--act)}
.links.cols{columns:4 200px;column-gap:var(--s6)}
.links li{padding:var(--s1) 0;break-inside:avoid}
.links span{font:var(--t-xs);color:var(--soft);font-variant-numeric:tabular-nums}
.lens{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));padding:.75px}
.lens a{display:block;border:var(--stroke) solid var(--ink);margin:-.75px;padding:var(--s3) var(--s2);color:var(--ink);text-align:center;background:var(--paper)}
.lens a:hover{background:var(--sun);text-decoration:none;color:var(--ink)}
.lens b{display:block;font:700 28px/32px var(--font);letter-spacing:var(--tr-h2)}
.lens span{font:var(--t-sm);color:var(--soft)}
.lens a:hover span{color:var(--ink)}
.today,.theme-grid,.pz{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--s3)}
.today a,.theme-grid a,.pz a{display:block;height:100%;border:1px solid var(--line);border-radius:var(--r);padding:var(--s3) var(--s4);color:var(--ink)}
.today a:hover,.theme-grid a:hover,.pz a:hover{border-color:var(--ink);text-decoration:none;color:var(--ink)}
.today b,.theme-grid b,.pz b,.today span,.theme-grid span,.pz span{display:block}
.today b,.theme-grid b{font:var(--t-h3);letter-spacing:var(--tr-h3)}
.today span,.theme-grid span,.pz span{font:var(--t-sm);color:var(--soft)}
.daily{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s1) var(--s4);background:var(--sun);color:var(--ink);padding:var(--s4) var(--s5);border-radius:var(--r);margin:var(--s4) 0}
.daily:hover{text-decoration:none;color:var(--ink)}
.daily b{font:var(--t-h3);letter-spacing:var(--tr-h3)}
.daily i{font-style:normal;margin-left:auto}

/* игровое поле */
.game-head{margin-bottom:var(--s4)}
.game-head h1{font:700 32px/38px var(--font);letter-spacing:var(--tr-h1);margin-bottom:var(--s1)}
.game-meta{color:var(--soft);margin:0}
.game-body{display:grid;grid-template-columns:minmax(0,auto) minmax(280px,1fr);gap:var(--s10);align-items:start}
.game-board{min-width:0}
.now{background:var(--ink);color:var(--paper);border-radius:var(--r);padding:var(--s3) var(--s4);min-height:48px;margin-bottom:var(--s3);max-width:640px}
.now:empty{visibility:hidden}
.pgrid{--c:42px;display:grid;grid-template-columns:repeat(var(--cols),var(--c));grid-auto-rows:var(--c);width:max-content;max-width:100%;touch-action:manipulation}
.pgrid.sc{--c:68px;overflow-x:auto}
.pc{position:relative;border:0;outline:1px solid var(--ink);outline-offset:-.5px;background:var(--paper);color:var(--ink);padding:0;font:700 calc(var(--c)*.5)/1 var(--font);cursor:pointer}
.pc small{position:absolute;left:3px;top:2px;font:500 10px/1 var(--font)}
.pc.w{background:var(--sky)}
.pc.a{background:var(--sun)}
.pc.bad{background:var(--bad-soft)}
.pq{outline:1px solid var(--ink);outline-offset:-.5px;background:var(--mist);font:500 11px/13px var(--font);letter-spacing:0;color:var(--ink);padding:var(--s1);display:flex;flex-direction:column;justify-content:center;overflow:hidden;overflow-wrap:anywhere;hyphens:auto;border:0;text-align:left;cursor:pointer}
.pq.a{background:var(--sun)}
.pq span{display:block}
.pq i{font-style:normal;font-weight:700}
.pb{background:var(--block);outline:1px solid var(--ink);outline-offset:-.5px}
.tools{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s3) 0}
.done{background:var(--sun-soft);border-radius:var(--r);padding:var(--s3) var(--s4);font-weight:600;margin:var(--s3) 0;max-width:640px}
.done[hidden]{display:none}
.kb{display:none;flex-direction:column;gap:var(--s1);margin-top:var(--s3);max-width:640px}
.kb div{display:flex;gap:var(--s1)}
.kb button{flex:1 1 0;min-width:0;height:var(--h-ctl);border:0;border-radius:var(--r-sm);background:var(--block);color:var(--ink);font:600 15px/1 var(--font);padding:0;cursor:pointer}
.kb button.wide{flex:1.6 1 0;font-size:13px}
.kb button.k-ok{background:var(--sun)}
.kb button.k-near{background:var(--sky)}
.kb button.k-no{background:var(--mute);color:var(--paper)}
.kb button:disabled{opacity:.35;cursor:default}
.show-kb .kb{display:flex}
@media (hover:none){.kb{display:flex}}
.clues h2{margin:0 0 var(--s2);font:var(--t-h3);letter-spacing:var(--tr-h3)}
.clues section+section{margin-top:var(--s6)}
.clues ol{list-style:decimal;padding-left:var(--s6)}
.clues li::marker{font-weight:600;font-variant-numeric:tabular-nums}
.clues button{display:block;width:100%;text-align:left;border:0;background:none;color:var(--ink);padding:var(--s1) var(--s2);border-radius:var(--r-sm);cursor:pointer}
.clues button:hover{background:var(--mist)}
.clues button.on{background:var(--sky)}
.clues button.ok{color:var(--soft);text-decoration:line-through}
.ans-box{margin:var(--s6) 0;border:1px solid var(--line);border-radius:var(--r);padding:var(--s3) var(--s4)}
.ans-box summary,.rules summary{cursor:pointer;font-weight:600}
.wl-list{margin-top:var(--s3);columns:2 280px;column-gap:var(--s6)}
.wl-list li{break-inside:avoid;padding:2px 0}
.rules{margin:var(--s4) 0;max-width:560px}
/* 5 букв */
.w5{display:flex;flex-direction:column;align-items:center}
.w5 .game-head{text-align:center}
.w5-board{display:grid;gap:var(--s1);margin-bottom:var(--s3)}
.w5-row{display:grid;grid-template-columns:repeat(5,60px);gap:var(--s1)}
.w5-c{height:60px;border:var(--stroke) solid var(--line);display:grid;place-items:center;font:700 26px/1 var(--font)}
.w5-c.f{border-color:var(--ink)}
.w5-c.ok{background:var(--sun);border-color:var(--sun)}
.w5-c.near{background:var(--sky);border-color:var(--sky)}
.w5-c.no{background:var(--mute);border-color:var(--mute);color:var(--paper)}
.w5 .now{width:100%;max-width:316px;text-align:center}
.w5 .kb{display:flex;width:100%;max-width:560px}
/* виселица */
.hang{display:flex;gap:var(--s8);align-items:center;flex-wrap:wrap;margin:var(--s3) 0}
.hang svg{width:150px;height:auto}
.hg,.hp{fill:none;stroke:var(--ink);stroke-width:4;stroke-linecap:round}
.hp{visibility:hidden}
.hp.on{visibility:visible}
[data-hang] .kb{display:flex}
[data-hang] .cells{flex-wrap:wrap}
.hint{color:var(--soft);max-width:52ch}
/* филворд */
.fgrid{--c:50px;display:grid;grid-template-columns:repeat(var(--cols),var(--c));grid-auto-rows:var(--c);width:max-content;max-width:100%;user-select:none;touch-action:none}
.fc{outline:1px solid var(--ink);outline-offset:-.5px;display:grid;place-items:center;font:700 22px/1 var(--font);background:var(--paper);cursor:pointer}
.fc.s{background:var(--sun)}
.fc.f{background:var(--sky)}
.fwords li{padding:2px 0}
.fwords li.ok{color:var(--soft);text-decoration:line-through}
/* слова из слова */
.score{font-weight:600}
.found{display:flex;flex-wrap:wrap;gap:var(--s1)}
.found li{background:var(--sun-soft);padding:2px var(--s2);border-radius:var(--r-sm)}
.helper{display:grid;gap:var(--s3);max-width:520px;margin:var(--s4) 0}
.helper label>span,.helper .sf-m>span,.maker-in label{display:block;font:500 13px/18px var(--font);color:var(--soft);margin-bottom:var(--s1)}
.helper input:not([type=hidden]){width:100%;height:var(--h-ctl);border:var(--stroke) solid var(--line);border-radius:var(--r);padding:0 var(--s3);text-transform:uppercase;letter-spacing:.06em}
.helper .mask input{width:var(--c);height:var(--c);border:var(--stroke) solid var(--ink);border-radius:0;margin-left:-1.5px;padding:0;text-align:center;font:700 22px/1 var(--font);background:var(--paper);caret-color:transparent}
.helper .mask input:first-child{margin-left:0}
.helper .mask input:focus{background:var(--sun);position:relative;z-index:1}
.helper .mask input.has{background:var(--sun-soft)}
.helper .btn{justify-self:start}
.maker-in textarea{width:100%;border:var(--stroke) solid var(--line);border-radius:var(--r);padding:var(--s3);font:var(--t-md);resize:vertical}
.maker-in textarea:focus{border-color:var(--ink);outline:none}
.maker-in .now{background:none;color:var(--soft);padding:0;min-height:0}
.maker-out .clues{margin-top:var(--s5)}
.maker-out .pgrid span.pc{display:block}
.pts{columns:3 220px;column-gap:var(--s6);margin-top:var(--s4)}
.pts li{padding:2px 0;break-inside:avoid}
.pts span{font:var(--t-sm);color:var(--soft)}
.pill{height:40px;padding:0 var(--s3);border:1px solid var(--line);border-radius:var(--r);background:var(--paper);font-weight:500;cursor:pointer}
.pill[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.sud{--c:52px;display:grid;grid-template-columns:repeat(9,var(--c));width:max-content;border:2px solid var(--ink);margin:var(--s3) 0}
.sdc{width:var(--c);height:var(--c);border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper);font:500 24px/1 var(--font);color:var(--act);padding:0;cursor:pointer}
.sdc.giv{color:var(--ink);font-weight:700}
.sdc:nth-child(3n){border-right:2px solid var(--ink)}
.sdc:nth-child(9n){border-right:0}
.sdc:nth-child(n+19):nth-child(-n+27),.sdc:nth-child(n+46):nth-child(-n+54){border-bottom:2px solid var(--ink)}
.sdc.w{background:var(--mist)}
.sdc.same{background:var(--sun-soft)}
.sdc.a{background:var(--sun)}
.sdc.bad{background:var(--bad-soft)}
.numpad{display:grid;grid-template-columns:repeat(10,minmax(0,44px));gap:var(--s1);margin:var(--s3) 0}
.numpad button{height:var(--h-ctl);border:0;border-radius:var(--r-sm);background:var(--block);font:600 18px/1 var(--font);padding:0;cursor:pointer}
.nono-wrap{overflow-x:auto;max-width:100%}
.nono{--c:28px;--n:15;display:grid;grid-template-columns:auto repeat(var(--n),var(--c));grid-template-rows:auto repeat(var(--n),var(--c));width:max-content;margin:var(--s3) 0;user-select:none;touch-action:none}
.nc{display:flex;gap:3px;font:600 12px/1 var(--font);color:var(--soft);font-variant-numeric:tabular-nums}
.nc-c{flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:var(--s1)}
.nc-r{justify-content:flex-end;align-items:center;padding-right:var(--s2)}
.nb{border:0;outline:1px solid var(--ink);outline-offset:-.5px;background:var(--paper);padding:0;cursor:pointer;font:600 14px/1 var(--font)}
.nb.l5{box-shadow:inset 2px 0 0 var(--ink)}
.nb.t5{box-shadow:inset 0 2px 0 var(--ink)}
.nb.l5.t5{box-shadow:inset 2px 2px 0 var(--ink)}
.nb.on{background:var(--ink)}
.nums{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:var(--s1)}
.nums a{display:grid;place-items:center;height:var(--h-ctl);border:1px solid var(--line);border-radius:var(--r);color:var(--ink);font-weight:500;font-variant-numeric:tabular-nums}
.nums a:hover{border-color:var(--ink);text-decoration:none;color:var(--ink)}
.nb.x{background:var(--mist)}
.nb.x::before{content:"×";color:var(--soft)}
.anag-l{display:flex;flex-wrap:wrap;gap:var(--s1);margin:var(--s3) 0}
.tile{width:var(--h-ctl);height:var(--h-ctl);border:var(--stroke) solid var(--ink);background:var(--sun-soft);font:700 20px/1 var(--font);border-radius:var(--r-sm);cursor:pointer}
.tile:disabled{opacity:.25;cursor:default}
.morf{display:flex;flex-wrap:wrap;gap:2px;margin:var(--s4) 0}
.morf span{padding:var(--s2) var(--s3);font:600 26px/32px var(--font);background:var(--mist);border-bottom:3px solid var(--line)}
.morf .m-к{background:var(--sun-soft);border-color:var(--sun)}
.morf .m-п{background:var(--sky);border-color:var(--act)}
.morf .m-с{background:#dff3ea;border-color:var(--ok)}
.morf .m-о{background:#fff;border:1.5px solid var(--ink);border-bottom-width:1.5px}
.morf-l{display:grid;grid-template-columns:auto 1fr;gap:var(--s1) var(--s4);max-width:420px}
.morf-l dt{color:var(--soft)}
.morf-l dd{margin:0;font-weight:600}
.reb{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);font:700 40px/1.1 var(--font);margin:var(--s4) 0}
.reb .pic{position:relative;font-size:84px;line-height:1}
.reb small{font:700 34px/1 var(--font);color:var(--ink);letter-spacing:.04em}
.reb-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--s3)}
.reb-list a{display:block;border:1px solid var(--line);border-radius:var(--r);padding:var(--s3);color:var(--ink);text-align:center;font-weight:600}
.reb-list a:hover{border-color:var(--ink);text-decoration:none;color:var(--ink)}
.reb-list i{display:block;font-style:normal;font-size:40px;line-height:48px}
.stress{font:700 44px/52px var(--font);letter-spacing:var(--tr-h1);margin:var(--s3) 0}
.stress b{color:var(--act);font-weight:800;box-shadow:inset 0 -6px 0 var(--sun)}
.tbl{overflow-x:auto;margin:var(--s3) 0}
.tbl table{border-collapse:collapse;width:100%;min-width:320px}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:var(--s2) var(--s3);text-align:left;font-weight:400}
.tbl thead th{font:600 14px/20px var(--font);color:var(--soft)}
.tbl tbody th{color:var(--soft);white-space:nowrap}
.chb{--c:min(60px,calc((100vw - 2*var(--gutter))/8));display:grid;grid-template-columns:repeat(8,var(--c));grid-auto-rows:var(--c);width:max-content;border:2px solid var(--ink);margin:var(--s3) 0;user-select:none}
.chc{border:0;padding:0;font:400 calc(var(--c)*.74)/1 "Segoe UI Symbol","Noto Sans Symbols2","DejaVu Sans",var(--font);color:var(--ink);cursor:pointer;display:grid;place-items:center}
.chc.lt{background:#f3f5f9}
.chc.dk{background:#b9c4d8}
.chc.wp{color:#fff;-webkit-text-stroke:1px #16213a}
.chc.bp{color:#16213a}
.chc.lm{box-shadow:inset 0 0 0 3px var(--sky)}
.chc.sel{background:var(--sun)}
.chc.mv{box-shadow:inset 0 0 0 4px var(--sun)}
.chc.chk{background:var(--bad-soft)}
.pc-sh{display:block;width:72%;height:72%;border-radius:50%;box-shadow:inset 0 0 0 3px rgba(0,0,0,.18)}
.pc-sh.wp{background:#fff;border:2px solid var(--ink)}
.pc-sh.bp{background:var(--ink)}
.pc-sh.kg{outline:3px solid var(--sun);outline-offset:-9px}
.cdb{--w:min(72px,calc((100vw - 2*var(--gutter) - 24px)/7));--h:calc(var(--w)*1.36);--o:calc(var(--w)*.34);max-width:calc(var(--w)*7 + 24px);user-select:none}
.cd{width:var(--w,64px);height:var(--h,88px);border:1px solid var(--ink);border-radius:6px;background:#fff;color:var(--ink);padding:3px 4px;display:flex;flex-direction:column;justify-content:space-between;font:600 15px/1 var(--font);cursor:pointer;text-align:left}
.cd i{font-style:normal;font-size:20px;align-self:flex-end}
.cd.rd{color:#c62f2f}
.cd.back{background:repeating-linear-gradient(45deg,#26345a 0 5px,#3a4a78 5px 10px)}
.cd.slot{background:var(--mist);border:1px dashed var(--mute);color:var(--mute);align-items:center;justify-content:center;font-size:20px}
.cd.on{box-shadow:0 0 0 3px var(--sun);position:relative;z-index:2}
.cd-top{display:flex;gap:4px;margin-bottom:var(--s3)}
.cd-sp{flex:0 0 var(--w)}
.cd-tab{display:grid;grid-template-columns:repeat(7,var(--w));gap:4px}
.cd-col{position:relative}
.cd-col .cd{position:absolute;left:0}
.dk-table{display:flex;flex-wrap:wrap;gap:var(--s3);min-height:112px;margin:var(--s3) 0;padding:var(--s3);background:var(--mist);border-radius:var(--r)}
.dk-pair{position:relative;width:88px;height:88px}
.dk-pair .cd{position:absolute;left:0;top:0;cursor:default}
.dk-pair .dk-d{left:20px;top:0;box-shadow:-2px 0 4px rgba(0,0,0,.2)}
.dk-hand{display:flex;flex-wrap:wrap;gap:4px;margin:var(--s3) 0}
.mj-wrap{overflow:auto;padding:12px 0}
.mjb{--t:42px;--u:54px;position:relative;width:calc(var(--t)*12 + 20px);height:calc(var(--u)*8 + 20px)}
.mj{position:absolute;left:calc(var(--x)*var(--t)/2 + var(--z)*-3px + 12px);top:calc(var(--y)*var(--u)/2 + var(--z)*-3px + 12px);width:var(--t);height:var(--u);padding:0;border:1px solid #8e98ad;border-radius:5px;background:#eef1f6;box-shadow:2px 2px 0 #b9c4d8;font-size:22px;line-height:1;cursor:pointer;background:#dfe4ec;filter:saturate(.35) brightness(.97)}
.mj.fr{background:#fff;filter:none}
.mj.on{background:var(--sun)}
.gl{display:flex;flex-wrap:wrap;gap:var(--s1);margin-top:var(--s3)}
.gl li{padding:2px var(--s2);background:var(--mist);border-radius:var(--r-sm)}
.gl li.me{background:var(--sun-soft)}
.blb{--c:min(64px,calc((100vw - 2*var(--gutter))/5));display:grid;grid-template-columns:repeat(5,var(--c));grid-auto-rows:var(--c);width:max-content;margin:var(--s3) 0}
.bl{border:0;outline:1.5px solid var(--ink);outline-offset:-.75px;background:#fff;font:700 26px/1 var(--font);color:var(--ink);padding:0;cursor:pointer}
.bl.ok{background:var(--mist)}
.bl.nw{background:var(--sun)}
.bl.pt{background:var(--sky)}
.bl-w{font:700 20px/28px var(--font);min-height:28px;margin:0}
.bl-kb{display:grid;grid-template-columns:repeat(auto-fill,minmax(38px,1fr));gap:var(--s1);max-width:560px;margin:var(--s2) 0}
.bl-kb button{height:var(--h-ctl);border:0;border-radius:var(--r-sm);background:var(--block);font:600 15px/1 var(--font);cursor:pointer;padding:0}
.ft{display:inline-flex;align-items:center;justify-content:center;position:relative;cursor:default}
.ft sub{position:absolute;right:3px;bottom:2px;font:600 10px/1 var(--font)}
.gk-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s4);background:var(--mist);border-radius:var(--r);padding:var(--s2) var(--s3);margin-bottom:var(--s3);max-width:760px}
.gk-st{display:flex;gap:var(--s4);flex-wrap:wrap}
.gk-st span{font:var(--t-xs);color:var(--soft)}
.gk-st b{display:block;font:700 18px/22px var(--font);color:var(--ink);font-variant-numeric:tabular-nums}
.gk-st.big{background:var(--ink);border-radius:var(--r-lg);padding:var(--s4) var(--s5);gap:var(--s8)}
.gk-st.big span{color:#c6cede}
.gk-st.big b{color:var(--paper);font-size:26px;line-height:32px}
.gk-lv{margin-left:auto;display:block;min-width:120px;color:var(--ink);font:var(--t-xs)}
.gk-lv:hover{color:var(--ink);text-decoration:none}
.gk-lv b{font-weight:600}
.gk-lv i{display:block;height:6px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:3px}
.gk-lv u{display:block;height:100%;background:var(--sun)}
.gk-snd{width:36px;height:36px;border:0;border-radius:var(--r-sm);background:var(--paper);cursor:pointer;font-size:16px;padding:0}
.gk-conf{position:fixed;inset:0;pointer-events:none;z-index:60}
.gk-ov{position:fixed;inset:0;background:rgba(22,33,58,.55);display:grid;place-items:center;z-index:50;padding:var(--s4);animation:gkf .2s}
.gk-m{background:var(--paper);border-radius:var(--r-lg);padding:var(--s6);max-width:420px;width:100%;text-align:center;animation:gkp .28s cubic-bezier(.2,1.3,.5,1)}
.gk-m h2{margin:0 0 var(--s2);font:var(--t-h1);letter-spacing:var(--tr-h1)}
.gk-xp{font-weight:700;color:var(--act)}
.gk-acts{display:flex;gap:var(--s2);justify-content:center;flex-wrap:wrap;margin-top:var(--s4)}
.gk-ach{text-align:left;margin:var(--s3) 0}
.gk-ach li{background:var(--sun-soft);border-radius:var(--r);padding:var(--s2) var(--s3);margin-top:var(--s1)}
.gk-ach b,.gk-ach span{display:block}
.gk-ach span{font:var(--t-sm);color:var(--soft)}
.gk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--s2)}
.gk-grid li{border:1px solid var(--line);border-radius:var(--r);padding:var(--s3);opacity:.55}
.gk-grid li.on{opacity:1;background:var(--sun-soft);border-color:var(--sun)}
.gk-grid b,.gk-grid span{display:block}
.gk-grid span{font:var(--t-sm);color:var(--soft)}
@keyframes gkf{from{opacity:0}}
@keyframes gkp{from{transform:scale(.85);opacity:0}}
.ndb{--c:min(54px,calc((100vw - 2*var(--gutter) - 28px)/12));background:#22304f;border:7px solid #16213a;border-radius:10px;padding:7px;width:max-content;max-width:100%;margin:var(--s3) 0}
.ndr{display:grid;grid-template-columns:repeat(6,var(--c)) 14px repeat(6,var(--c));grid-template-rows:calc(var(--c)*4.9);height:calc(var(--c)*4.9)}
.ndr .ndp:nth-child(6){margin-right:14px}
.ndr .ndp:nth-child(7){grid-column:8}
.nd-low{margin-top:10px}
.ndp{position:relative;border:0;background:none;padding:2px 0;display:flex;flex-direction:column;align-items:center;gap:0;cursor:pointer;color:#fff;font:700 13px/1 var(--font)}
.ndp::before{content:"";position:absolute;inset:0;clip-path:polygon(0 0,100% 0,50% 92%);background:#ffcf33;opacity:.9}
.ndp:nth-child(even)::before{background:#8fa6d8}
.nd-low .ndp{flex-direction:column-reverse}
.nd-low .ndp::before{clip-path:polygon(0 100%,100% 100%,50% 8%)}
.ndp.tg::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.45);border-radius:4px}
.ndp.on::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 3px #fff;border-radius:4px}
.ndp i{position:relative;z-index:1;width:calc(var(--c)*.84);height:calc(var(--c)*.84);max-width:46px;max-height:46px;border-radius:50%;margin-top:-5%;flex:none;box-shadow:0 2px 3px rgba(0,0,0,.45)}
.ndw{background:radial-gradient(circle at 35% 30%,#fff,#d9dfe9);border:1px solid #8e98ad}
.ndp i.ndk{background:radial-gradient(circle at 35% 30%,#55607a,#16213a);border:1px solid #000;padding:0;max-width:46px;width:calc(var(--c)*.84);margin-top:-5%}
.ndp b{position:relative;z-index:2;background:#16213a;border-radius:9px;padding:2px 6px;margin:2px}
.nd-top{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3)}
.nd-dice{display:flex;gap:6px;min-width:96px;min-height:46px}
.nd-d{width:44px;height:44px;border-radius:9px;background:#fff;border:1.5px solid var(--ink);display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:5px;box-shadow:0 2px 0 var(--ink);animation:ndr .35s}
.nd-d u{border-radius:50%;background:var(--ink);margin:1.5px;visibility:hidden}
.nd-d u.on{visibility:visible}
.nd-d.used{opacity:.3}
@keyframes ndr{from{transform:rotate(-200deg) scale(.5)}}
.er-main{display:flex;flex-wrap:wrap;gap:var(--s5);align-items:flex-start}
.erb{--c:min(38px,calc((100vw - 2*var(--gutter))/15));display:grid;grid-template-columns:repeat(15,var(--c));grid-auto-rows:var(--c);background:#16213a;gap:1px;padding:1px;border-radius:4px;touch-action:manipulation}
.erc{position:relative;border:0;padding:0;background:#eef1f6;font:700 calc(var(--c)*.5)/1 var(--font);color:var(--ink);cursor:pointer}
.erc sub{position:absolute;right:1px;bottom:1px;font:600 max(8px,calc(var(--c)*.22))/1 var(--font)}
.erc.qT,.er-leg .qT{background:#e5533d}
.erc.qD,.er-leg .qD{background:#f4b6ac}
.erc.qt,.er-leg .qt{background:#2f6fdb}
.erc.qd,.er-leg .qd{background:#b6d0fb}
.erc.ctr::before{content:"★";color:#16213a;position:absolute;inset:0;display:grid;place-items:center}
.erc.tl{background:#ffe9a8;box-shadow:inset 0 0 0 1px #e3bb2f}
.erc.tl.ctr::before{content:none}
.erc.nw{background:var(--sun)}
.erc.lastw{background:#ffd566}
.er-side{flex:1 1 280px;min-width:0}
.er-rack .tile{position:relative;background:#ffe9a8;height:48px;width:48px}
.er-rack .tile.on{background:var(--sun);transform:translateY(-4px);box-shadow:0 3px 0 var(--ink)}
.er-leg{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3);font:var(--t-sm);color:var(--soft)}
.er-leg i{display:inline-block;width:14px;height:14px;border-radius:3px;margin-right:4px;vertical-align:-2px}
/* доски шахмат и шашек */
.ch-main{display:flex;flex-wrap:wrap;gap:var(--s4);align-items:flex-start}
.ch-center{flex:none;max-width:100%}
.ch-w{position:relative;border-radius:8px;box-shadow:0 10px 28px rgba(22,33,58,.28)}
.chb{--c:min(64px,calc((100vw - 2*var(--gutter) - 8px)/8));border:4px solid #5d3e22;border-radius:8px;margin:0;overflow:hidden}
.ch-pl{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);min-height:34px;padding:var(--s1) 2px;font:var(--t-sm)}
.ch-pl span{color:var(--soft);font-size:17px}
.ch-pl span span{font-size:inherit;font-weight:700;color:var(--ink)}
.ch-ev{width:12px;align-self:stretch;margin:34px 0;background:#26345a;border-radius:6px;overflow:hidden;display:flex;align-items:flex-end;min-height:200px}
.ch-ev i{display:block;width:100%;background:#fff;transition:height .4s}
.ch-side{flex:1 1 260px;min-width:0}
.ch-log{max-height:300px;overflow:auto;font:var(--t-sm);margin:0 0 var(--s3);padding:0}
.ch-log li{display:grid;grid-template-columns:30px 1fr 1fr;padding:3px 6px;border-bottom:1px solid var(--line)}
.ch-log li:last-child{background:var(--sun-soft)}
.ch-log b{color:var(--soft);font-weight:500}
.chc{position:relative;overflow:visible}
.chc.lt{background:#f0dcb6}
.chc.dk{background:#b0793f}
.chc.lm::after,.chc.sel::after,.chc.hn::after,.chc.must::after{content:"";position:absolute;inset:0;pointer-events:none}
.chc.lm{box-shadow:none}
.chc.lm::after{background:rgba(255,207,51,.42)}
.chc.sel{background:#f3c744}
.chc.hn::after{background:rgba(47,111,219,.5);animation:chp 1.1s infinite}
.chc.must::after{box-shadow:inset 0 0 0 3px #ffcf33;animation:chp 1.1s infinite}
.chc.mv{box-shadow:none}
.chc.mv::before{content:"";position:absolute;left:50%;top:50%;width:30%;height:30%;margin:-15% 0 0 -15%;border-radius:50%;background:rgba(22,33,58,.32);z-index:1}
.chc.mv.cap::before{width:92%;height:92%;margin:-46% 0 0 -46%;background:none;box-shadow:inset 0 0 0 5px rgba(198,47,47,.65)}
.chc.chk{background:radial-gradient(circle,#ff5a4a 0,#d33 55%,transparent 80%),#b0793f;animation:chp .9s 2}
.co{position:absolute;font:600 10px/1 var(--font);opacity:.7;pointer-events:none}
.chc.lt .co{color:#7a5230}
.chc.dk .co{color:#f0dcb6}
.cr{left:3px;top:3px}
.cf{right:3px;bottom:3px}
.pz{position:relative;z-index:2;display:block;font:400 calc(var(--c)*.82)/1 "Segoe UI Symbol","Noto Sans Symbols2","DejaVu Sans",serif;filter:drop-shadow(0 3px 2px rgba(0,0,0,.4));transition:transform .12s}
.chc:hover .pz{transform:translateY(-2px) scale(1.05)}
.pz.wp{color:#fffdf6;-webkit-text-stroke:1.3px #3a2614}
.pz.bp{color:#26190f;-webkit-text-stroke:.6px #000}
.ch-pr{position:absolute;inset:0;z-index:9;display:flex;align-items:center;justify-content:center;gap:6px;background:rgba(22,33,58,.6);border-radius:8px}
.ch-pr button{--c:64px;width:70px;height:70px;border:0;border-radius:10px;background:#f0dcb6;cursor:pointer}
.now.win{background:var(--sun);color:var(--ink);font-weight:700}
@keyframes chp{50%{opacity:.45}}
.pc-sh{position:relative;z-index:2;width:78%;height:78%;box-shadow:0 4px 5px rgba(0,0,0,.45),inset 0 -3px 0 rgba(0,0,0,.28),inset 0 2px 0 rgba(255,255,255,.3)}
.pc-sh::after{content:"";position:absolute;inset:16%;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(0,0,0,.14)}
.pc-sh.wp{background:radial-gradient(circle at 38% 30%,#fffef8,#e4d3ab 70%);border:1px solid #8b6b3d}
.pc-sh.bp{background:radial-gradient(circle at 38% 30%,#63432a,#23140a 70%);border:1px solid #000}
.pc-sh.kg{outline:0}
.pc-sh.kg::before{content:"♛";position:absolute;inset:0;display:grid;place-items:center;font:400 calc(var(--c)*.42)/1 "Segoe UI Symbol",serif;color:#d9a300;z-index:2}
/* стол и карты */
.felt{background:radial-gradient(ellipse at 50% 30%,#23885f,#0f5c42 75%);border-radius:14px;padding:var(--s4);box-shadow:inset 0 0 40px rgba(0,0,0,.28);max-width:100%;width:max-content;box-sizing:border-box}
.cdb{--w:min(84px,calc((100vw - 2*var(--gutter) - 56px)/7));--h:calc(var(--w)*1.4);--o:calc(var(--w)*.36);width:calc(var(--w)*7 + 36px);max-width:none}
.cd{position:relative;width:var(--w,74px);height:var(--h,104px);border:1px solid #9aa3b5;border-radius:calc(var(--w,74px)*.09);background:linear-gradient(160deg,#fff,#f4f5f8);color:#16213a;padding:0;font-family:Georgia,"Times New Roman",serif;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,.28);overflow:hidden;display:block;user-select:none;touch-action:none;transition:box-shadow .12s}
.cd .ct{position:absolute;left:5%;top:3%;display:flex;flex-direction:column;align-items:center;line-height:1}
.cd .ct b{font-size:calc(var(--w,74px)*.27);font-weight:700}
.cd .ct i{font-style:normal;font-size:calc(var(--w,74px)*.22);margin-top:1px}
.cd em{position:absolute;right:8%;bottom:6%;font-style:normal;font-size:calc(var(--w,74px)*.54);line-height:1;opacity:.92}
.cd.rd{color:#c62f2f}
.cd.back{background:repeating-linear-gradient(45deg,#1d3a8a 0 4px,#2f55bd 4px 8px);border:3px solid #fff;outline:1px solid #6d7a96;outline-offset:-1px}
.cd.slot{background:rgba(255,255,255,.08);border:2px dashed rgba(255,255,255,.4);color:rgba(255,255,255,.55);box-shadow:none;display:grid;place-items:center;font:600 calc(var(--w,74px)*.34)/1 var(--font)}
.cd.on{box-shadow:0 0 0 3px var(--sun),0 6px 10px rgba(0,0,0,.4)}
.cd.hn{box-shadow:0 0 0 3px #7fd6ff;animation:chp .9s infinite}
.cd.flip{animation:cdf .3s}
@keyframes cdf{from{transform:rotateY(90deg)}}
.cd-top{display:flex;gap:6px;margin-bottom:var(--s3)}
.cd-w{position:relative;width:var(--w);height:var(--h);flex:0 0 var(--w)}
.cd-w .cd{position:absolute;top:0}
.cd-sp{flex:0 0 var(--w)}
.cd-tab{display:grid;grid-template-columns:repeat(7,var(--w));gap:6px}
.cd-col{position:relative;min-height:var(--h)}
.cd-col .cd{position:absolute;left:0}
.cd-col .cd:hover:not(.back){filter:brightness(1.03)}
.cd-ghost{position:fixed;z-index:45;pointer-events:none;filter:drop-shadow(0 12px 12px rgba(0,0,0,.4))}
.dk-f{--w:min(92px,calc((100vw - 2*var(--gutter) - 32px)/6.2));--h:calc(var(--w)*1.4);width:100%;max-width:980px;overflow:hidden}
.dk-ai{display:flex;justify-content:center;height:calc(var(--h)*.78);margin-top:calc(var(--h)*-.3)}
.dk-ai .cd{flex:none;cursor:default;transform-origin:50% -80%}
.dk-mid{display:flex;align-items:center;gap:var(--s3);margin:var(--s2) 0;min-height:calc(var(--h) + 30px)}
.dk-deck{position:relative;flex:0 0 calc(var(--w)*1.4);height:var(--h)}
.dk-deck .cd{position:absolute;left:0;top:0;cursor:default}
.dk-deck .dk-trump{left:calc(var(--w)*.5);top:calc(var(--h)*.14);transform:rotate(90deg)}
.dk-stack{box-shadow:calc(var(--t)*.5px) calc(var(--t)*.5px) 0 #1a2e6e,0 3px 6px rgba(0,0,0,.4)}
.dk-suit{display:grid;place-items:center;height:100%;font-size:calc(var(--w)*.8);color:#fff;opacity:.6}
.dk-suit.rd{color:#ffb3a8}
.dk-n{position:absolute;left:-4px;top:-6px;z-index:3;background:var(--sun);color:var(--ink);border-radius:10px;padding:1px 7px;font:700 13px/18px var(--font)}
.dk-table{flex:1;min-width:0;display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;justify-content:center;background:none;padding:0;margin:0;min-height:calc(var(--h) + 20px)}
.dk-pair{position:relative;width:calc(var(--w)*1.3);height:calc(var(--h) + 10px)}
.dk-pair .cd{position:absolute;left:0;top:0;cursor:default}
.dk-pair .dk-d{left:calc(var(--w)*.26);top:14px;box-shadow:-3px 3px 8px rgba(0,0,0,.4)}
.dk-bito{color:#fff;font:600 13px/18px var(--font);opacity:.85;flex:0 0 64px;text-align:right}
.dk-actb{display:flex;justify-content:center;height:46px}
.dk-actb .btn{background:var(--sun);color:var(--ink)}
.dk-hand{display:flex;justify-content:center;margin:var(--s2) 0 0;padding:var(--s2) 0 var(--s4);flex-wrap:nowrap;min-height:calc(var(--h) + 24px)}
.dk-hand .cd{flex:none;transform:rotate(var(--a,0deg)) translateY(var(--y,0px));transform-origin:50% 130%;transition:transform .2s cubic-bezier(.22,.9,.24,1),filter .2s}
.dk-hand .cd:hover:not(.dim){transform:rotate(var(--a,0deg)) translateY(calc(var(--y,0px) - 14px));z-index:5}
.dk-hand .cd.dim{filter:brightness(.72)}
.sdc.pop{animation:gkp .22s}
.sn{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:100%;height:100%;font:500 max(8px,calc(var(--c)*.2))/1 var(--font);color:var(--soft)}
.sn i{font-style:normal;display:grid;place-items:center}
.numpad button:disabled{opacity:.3}
.numpad button{position:relative}
.numpad button[data-left]::after{content:attr(data-left);position:absolute;right:3px;top:2px;font:500 10px/1 var(--font);color:var(--soft)}
.pill[aria-pressed=true]{transition:background .15s}
.mj{transition:transform .1s}
.mj.fr:hover{transform:translateY(-2px)}
.mj.hn{background:var(--sky);animation:chp .9s infinite}
.mj.fr{box-shadow:2px 3px 0 #9aa8c0,3px 4px 0 #6d7a96}
.w5-c.rv{animation:w5r .5s both}
@keyframes w5r{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}100%{transform:rotateX(0)}}
.an-bar{display:block;height:8px;border-radius:4px;background:var(--line);overflow:hidden;margin:var(--s2) 0;max-width:560px}
.an-bar i{display:block;height:100%;width:100%;background:var(--sun);transition:width 1s linear}
.an-bar i.hot{background:#e5533d}
.hp.on{stroke-dasharray:90;animation:hdr .4s}
@keyframes hdr{from{stroke-dashoffset:90}to{stroke-dashoffset:0}}
.bl{transition:background .12s}
.bl.pt{animation:gkp .15s}
.fc.f{animation:gkp .2s}
.found li{animation:gkp .2s}
.tile{transition:transform .1s,opacity .1s}
.tile:not(:disabled):not(.ft):hover{transform:translateY(-2px)}
/* подсказки выключены: подсветка возможных ходов скрыта */
.no-hints .chc.mv::before,.no-hints .chc.must::after,.no-hints .chc.hn::after{display:none}
.no-hints .ndp.tg::after{display:none}
.no-hints .dk-hand .cd.dim{filter:none}
.no-hints .mj{background:#fff;filter:none}
.no-hints .mj.fr{box-shadow:2px 2px 0 #b9c4d8}
.no-hints .mj{box-shadow:2px 2px 0 #b9c4d8}
.no-hints .sdc.same,.no-hints .sdc.w{background:var(--paper)}
.no-hints .numpad button[data-left]::after{display:none}
.no-hints .numpad button:disabled{opacity:1}
.no-hints [data-a=hint]{display:none}
.no-hints .bl.ok{background:#fff}
.no-hints .cd.hn{animation:none}
/* кнопки игрового слоя */
.gk-btns{display:flex;flex-wrap:wrap;gap:var(--s1);align-items:center}
.gk-b{height:36px;padding:0 var(--s3);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);font:500 14px/20px var(--font);color:var(--ink);cursor:pointer;white-space:nowrap}
.gk-b:hover{border-color:var(--ink)}
.gk-b[aria-pressed=true]{background:var(--sun);border-color:var(--sun)}
.gk-bar{max-width:980px}
/* весь экран */
html.gk-lock,html.gk-lock body{overflow:hidden}
.game.gk-fs{position:fixed;inset:0;z-index:40;max-width:none;margin:0;background:#fff;overflow:auto;padding:var(--s2) var(--s4);display:block}
.game:fullscreen{background:#fff}
.gk-fs .game-head,.gk-fs .rules,.gk-fs .ad,.gk-fs .ans-box,.gk-fs h2:not(.h3),.gk-fs .pz-more{display:none}
.gk-fs .gk-bar{margin-bottom:var(--s2);padding:var(--s1) var(--s2);max-width:none}
.gk-fs .gk-st b{font-size:15px;line-height:18px}
.gk-fs .now{min-height:0;padding:var(--s1) var(--s3);margin-bottom:var(--s2);max-width:none}
.gk-fs .pills{margin:var(--s1) 0}
.gk-fs .pill{height:34px}
.gk-fs .tools{margin:var(--s2) 0}
.gk-fs .chb{--c:min(calc((100vh - 250px)/8),calc((100vw - 60px)/8))}
.gk-fs .cdb{--w:min(calc((100vh - 260px)/4.6),calc((100vw - 110px)/7))}
.gk-fs .felt{margin:0 auto}
.gk-fs .dk-f{--w:min(calc((100vh - 240px)/4.5),120px);max-width:none}
.gk-fs .ndb{--c:min(calc((100vh - 250px)/10.2),calc((100vw - 90px)/12.6));margin:var(--s2) auto}
.gk-fs .erb{--c:min(calc((100vh - 150px)/15),calc((100vw - 50px)/15))}
.gk-fs .sud{--c:min(calc((100vh - 290px)/9),calc((100vw - 50px)/9))}
.gk-fs .numpad{grid-template-columns:repeat(10,minmax(0,64px))}
.gk-fs .pgrid{--c:min(calc((100vh - 220px)/var(--rows,15)),48px)}
.gk-fs .pgrid.sc{--c:min(calc((100vh - 200px)/14),80px)}
.gk-fs .fgrid{--c:min(calc((100vh - 220px)/var(--cols)),72px)}
.gk-fs .nono{--c:min(calc((100vh - 300px)/15),36px)}
.gk-fs .blb{--c:min(calc((100vh - 400px)/5),90px)}
.gk-fs .mjb{--t:min(calc((100vw - 80px)/12.5),calc((100vh - 210px)/10.4));--u:calc(var(--t)*1.28)}
.gk-fs .mj{font-size:calc(var(--t)*.56)}
.gk-fs .w5-row{grid-template-columns:repeat(5,calc((100vh - 400px)/6))}
.gk-fs .w5-c{height:calc((100vh - 400px)/6)}
/* появление букв компьютера в эрудите */
.erc.drop{animation:erd .36s both}
@keyframes erd{from{transform:scale(1.7);opacity:0}}
.about{max-width:calc(var(--measure) + 2*var(--gutter));margin:var(--s10) auto 0;padding:0 var(--gutter);margin-left:max(calc((100vw - var(--wrap))/2 - var(--gutter)),0px)}
.about h2{margin-top:var(--s6)}
.faq dt{font-weight:600;margin-top:var(--s3)}
.faq dd{margin:var(--s1) 0 0;color:var(--soft)}
/* место под поле резервируется до запуска скрипта */
.chb:empty{min-height:calc(var(--c)*8)}
.cdb:empty{min-height:calc(var(--h)*3.4)}
.ndb:empty{min-height:calc(var(--c)*10)}
.erb:empty{min-height:calc(var(--c)*15)}
.sud:empty{min-height:calc(var(--c)*9)}
.blb:empty{min-height:calc(var(--c)*5)}
.mjb:empty{min-height:calc(var(--u)*8)}
.nono:empty{min-height:calc(var(--c)*18)}
.w5-board:empty{min-height:380px}
/* витрина системы */
.ds-sw{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--s3)}
.ds-sw i{display:block;height:64px;border-radius:var(--r);border:1px solid var(--line)}
.ds-sw b,.ds-sw code{display:block;font:var(--t-sm)}
.ds-sw b{margin-top:var(--s2);font-weight:600}
.ds-sw code{color:var(--soft)}

/* подвал */
.foot{background:var(--ink);color:#c6cede;font:var(--t-sm)}
.foot-in{padding-top:var(--s8);padding-bottom:var(--s6)}
.foot-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--s5)}
.foot b{display:block;color:var(--paper);margin-bottom:var(--s2)}
.foot a{display:block;color:#c6cede;padding:2px 0}
.foot a:hover{color:var(--paper)}
.foot-note{margin:var(--s6) 0 0;font:var(--t-xs)}
.foot-note a{display:inline;color:#8e98ad}

.ck{position:fixed;left:50%;bottom:var(--s3);transform:translateX(-50%);z-index:45;width:min(520px,calc(100vw - 32px));display:flex;align-items:center;gap:var(--s3);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s3) var(--s4);font:var(--t-sm);box-shadow:0 4px 18px rgba(22,33,58,.12)}
.ck[hidden]{display:none}
.ck .btn2{height:36px;padding:0 var(--s3);flex:none;font-size:14px}
@media (max-width:960px){
  .hero-art{display:none}
  .two,.game-body{grid-template-columns:minmax(0,1fr);gap:var(--s6)}
  .top-s{order:3;flex:1 0 100%;margin-left:0}
}
@media (max-width:640px){
  :root{--cell:36px;--t-h1:700 30px/36px var(--font);--t-h2:700 22px/28px var(--font);--t-display:700 36px/42px var(--font);--t-lg:17px/26px var(--font)}
  .hero{padding:var(--s8) 0}
  .game-head h1{font:700 26px/32px var(--font)}
  .top-in{gap:var(--s2) var(--s4);min-height:0}
  .nav{order:2;width:calc(100% + 2*var(--gutter));margin:0 calc(-1*var(--gutter));padding:0 var(--gutter);font-size:14px;gap:var(--s3);flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .nav::-webkit-scrollbar{display:none}
  .nav a{white-space:nowrap;flex:none;padding:var(--s2) 0}
  .top-s{min-width:0}
  .az a{width:calc((100vw - 2*var(--gutter) - 28px)/10);height:36px}
  .two .side{order:2}
  .now{position:sticky;top:0;z-index:2;min-height:0}
  .clues button{min-height:var(--h-ctl)}
  .sc-scroll{margin:0 calc(-1*var(--gutter));padding:0 var(--gutter)}
  .ans-box{padding:var(--s3)}
  .wl-list{columns:1}
  .today,.theme-grid,.pz{grid-template-columns:minmax(0,1fr)}
  .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pc{font-size:calc(var(--c)*.56)}
  .tbl table{min-width:0}
  .tbl th,.tbl td{padding:var(--s2);font-size:15px}
  .tbl thead th{font-size:13px;line-height:18px}
  .tbl tbody th{white-space:normal;font-size:14px;line-height:18px}
  .sud{--c:calc((100vw - 2*var(--gutter) - 4px)/9)}
  .sdc{font-size:20px}
  .nono{--c:21px}
  .nc{font-size:10px;gap:2px}
  .numpad{grid-template-columns:repeat(5,minmax(0,1fr))}
  .sf{grid-template-columns:1fr 76px;padding:var(--s3)}
  .sf-go{grid-column:1/-1;grid-row:3;width:100%}
  .sf-m{grid-row:2}
  .mask{--c:44px}
  .ans{grid-template-columns:minmax(0,1fr)}
  .cell{font-size:16px}
  .pgrid{--c:min(calc((100vw - 2*var(--gutter))/var(--cols)),40px)}
  .pgrid.sc{--c:74px}
  .pc small{font-size:8px;left:2px;top:1px}
  .fgrid{--c:calc((100vw - 2*var(--gutter))/var(--cols))}
  .is-game .top-s,.is-game .crumbs{display:none}
  .is-game main>section:first-child{margin-top:var(--s3)}
  .w5-row{grid-template-columns:repeat(5,min(calc((100vw - 56px)/5),7.4vh))}
  .w5-c{height:min(calc((100vw - 56px)/5),7.4vh)}
  .tools .btn,.tools .btn2{height:40px;padding:0 var(--s3);font-size:14px}
  .links.cols{columns:2}
}
/* телефон: поле игры на первом экране, настройки в одну строку */
@media (max-width:640px){
.ch-ev{display:none}
.gk-bar{gap:var(--s1) var(--s2);padding:6px var(--s2)}
.gk-st{gap:var(--s3)}
.gk-st b{font-size:15px;line-height:18px}
.gk-lv{display:none}
.gk-btns{flex-wrap:nowrap;overflow-x:auto;width:100%;scrollbar-width:none}
.gk-btns::-webkit-scrollbar,.game .pills::-webkit-scrollbar{display:none}
.gk-b{flex:none;height:34px;padding:0 var(--s2)}
.game .pills{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:var(--s1) 0}
.game .pill{flex:none;height:36px}
.gk-fs .gk-st,.gk-fs .gk-lv{display:none}
.mjb{--t:calc((100vw - 48px)/12.5);--u:calc(var(--t)*1.28)}
.mj{font-size:calc(var(--t)*.56)}
.gk-fs .blb{--c:min(calc((100vh - 400px)/5),calc((100vw - 40px)/5))}
.gk-fs .nono{--c:min(calc((100vh - 300px)/15),calc((100vw - 40px)/20))}
}
/* новые разделы */
.sub-links{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s5) 0}
.sub-links a{padding:var(--s1) var(--s3);border:1px solid var(--line);border-radius:var(--r);font:var(--t-sm);color:var(--ink)}
.sub-links a:hover{border-color:var(--ink);text-decoration:none}
.tool .tx{display:block;width:100%;max-width:760px;padding:var(--s3);border:var(--stroke) solid var(--line);border-radius:var(--r);font:var(--t-md);color:var(--ink);background:var(--paper);resize:vertical}
.tool .tx:focus{outline:2px solid var(--act);outline-offset:1px}
.tl{display:block;font:600 14px/20px var(--font);margin:var(--s3) 0 var(--s1)}
.tl select{height:40px;border:var(--stroke) solid var(--line);border-radius:var(--r-sm);padding:0 var(--s2);font:var(--t-sm);background:var(--paper);margin-left:var(--s2)}
.row-o{display:flex;flex-wrap:wrap;gap:var(--s5);align-items:center}
.row-o input[type=range]{width:220px;vertical-align:middle;margin-left:var(--s2)}
.res-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:var(--s2);margin:var(--s4) 0;max-width:760px}
.res-grid div{background:var(--mist);border-radius:var(--r);padding:var(--s3)}
.res-grid b{display:block;font:700 22px/28px var(--font);font-variant-numeric:tabular-nums}
.res-grid span{font:var(--t-xs);color:var(--soft)}
.big-word{font:700 44px/52px var(--font);letter-spacing:var(--tr-h1);min-height:60px;margin:var(--s6) 0 var(--s3);overflow-wrap:anywhere}
.big-word.show{animation:wordin .32s ease-out}
@keyframes wordin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.two-t{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--s5);max-width:760px}
.all-sh{margin:var(--s3) 0;padding:0;list-style:none;font:var(--t-sm);max-width:760px}
.all-sh li{padding:2px 0;overflow-wrap:anywhere}
.all-sh b{display:inline-block;width:32px;color:var(--soft)}
.sp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--s5);margin:var(--s4) 0}
.sp-grid figure{margin:0}
.sp-grid figcaption{font:600 14px/20px var(--font);margin-bottom:var(--s1)}
.sp{border-collapse:collapse;border:2px solid var(--ink)}
.sp td{width:32px;height:32px;border:1px solid var(--mute);text-align:center;font:500 17px/1 var(--font)}
.sp tr:nth-child(3n) td{border-bottom:2px solid var(--ink)}
.sp td:nth-child(3n){border-right:2px solid var(--ink)}
.sp.small td{width:20px;height:20px;font-size:11px}
/* судоку других размеров */
.sdb{--n:6;--c:min(calc(min(100vw - 2*var(--gutter),640px)/var(--n)),60px);display:grid;grid-template-columns:repeat(var(--n),var(--c));width:max-content;border:2px solid var(--ink);margin:var(--s3) 0}
.sdn{width:var(--c);height:var(--c);border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper);font:500 clamp(13px,calc(var(--c)*.46),24px)/1 var(--font);color:var(--act);padding:0;cursor:pointer}
.sdn.giv{color:var(--ink);font-weight:700}
.sdn.br{border-right:2px solid var(--ink)}
.sdn.bb{border-bottom:2px solid var(--ink)}
.sdn.a{background:var(--sun)}
.sdn.same{background:var(--sun-soft)}
.sdn.bad{background:var(--bad-soft)}
.no-hints .sdn.same{background:var(--paper)}
.numpad.pn{--k:7;grid-template-columns:repeat(var(--k),minmax(0,44px))}
.gk-fs .sdb{--c:min(calc((100vh - 300px)/var(--n)),calc((100vw - 40px)/var(--n)))}
/* японские разных размеров */
.nono[data-s="5"]{--c:48px}
.nono[data-s="10"]{--c:34px}
.gk-fs .nono[data-s="5"]{--c:min(calc((100vh - 300px)/8),calc((100vw - 40px)/8))}
.gk-fs .nono[data-s="10"]{--c:min(calc((100vh - 300px)/13),calc((100vw - 40px)/14))}
/* морской бой */
.bt-main{display:flex;flex-wrap:wrap;gap:var(--s6);align-items:flex-start}
.bt-col .h3{margin:0 0 var(--s1)}
.btb{--c:36px;display:grid;grid-template-columns:repeat(10,var(--c));grid-auto-rows:var(--c);background:#eaf2fb;border:2px solid var(--ink-2);border-radius:var(--r-sm);overflow:hidden;width:max-content}
.btc{width:var(--c);height:var(--c);border:0;border-right:1px solid #cddcf0;border-bottom:1px solid #cddcf0;background:transparent;padding:0;position:relative}
button.btc{cursor:crosshair}
button.btc:hover{background:#d6e6f8}
.btc.sh{background:#5a6a8c}
.btc.near::after,.btc.miss::after{content:"";position:absolute;left:50%;top:50%;width:26%;height:26%;margin:-13% 0 0 -13%;border-radius:50%;background:#8aa2c4}
.btc.near::after{opacity:.5}
.btc.hit{background:#f4b9a7}
.btc.hit::before,.btc.dead::before{content:"";position:absolute;inset:18%;background:linear-gradient(45deg,transparent 42%,var(--bad) 42%,var(--bad) 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,var(--bad) 42%,var(--bad) 58%,transparent 58%)}
.btc.dead{background:#c9c9d2}
.btc.hn{box-shadow:inset 0 0 0 2px var(--sun)}
.btc.fresh{animation:btshot .42s ease-out}
.btc.fresh.hit{animation:bthit .5s ease-out}
@keyframes btshot{from{background:#fff;transform:scale(.7)}to{transform:none}}
@keyframes bthit{0%{background:var(--sun);transform:scale(1.35)}100%{transform:none}}
.bt-fl{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin-top:var(--s2);font:var(--t-xs);color:var(--soft);max-width:370px}
.bt-fl i{display:block;height:8px;width:calc(var(--n)*12px);background:var(--ink-2);border-radius:2px}
.bt-col.mine .btb{--c:30px}
.gk-fs .bt-main{flex-wrap:nowrap;justify-content:center}
.gk-fs .btb{--c:min(calc((100vh - 280px)/10),calc((100vw - 90px)/20))}
.gk-fs .bt-col.mine .btb{--c:min(calc((100vh - 280px)/10),calc((100vw - 90px)/20))}
/* 2048 */
.g2s{display:flex;gap:var(--s2);margin:var(--s2) 0}
.g2s span{background:var(--mist);border-radius:var(--r);padding:var(--s1) var(--s4);font:var(--t-xs);color:var(--soft);min-width:96px}
.g2s b{display:block;font:700 22px/28px var(--font);color:var(--ink);font-variant-numeric:tabular-nums}
.g2b{--n:4;--g:10px;--sz:min(calc(100vw - 2*var(--gutter)),480px);--c:calc((var(--sz) - var(--g)*(var(--n) + 1))/var(--n));--st:calc(var(--c) + var(--g));position:relative;width:var(--sz);height:var(--sz);padding:var(--g);display:grid;grid-template-columns:repeat(var(--n),var(--c));grid-auto-rows:var(--c);gap:var(--g);background:#c9d3e4;border-radius:var(--r-lg);touch-action:none;user-select:none;overflow:hidden}
.g2b>i{background:#dfe6f1;border-radius:var(--r-sm)}
.g2t{position:absolute;left:var(--g);top:var(--g);width:var(--c);height:var(--c);display:grid;place-items:center;border-radius:var(--r-sm);font:800 calc(var(--c)*.4)/1 var(--font);background:#fff;color:var(--ink);transition:transform var(--d,170ms) ease-in-out;will-change:transform}
.g2t.sm{font-size:calc(var(--c)*.3)}
.g2t.v4{background:#fff1bf}
.g2t.v8{background:#ffdf73}
.g2t.v16{background:#ffcf33}
.g2t.v32{background:#ffb347;color:#fff}
.g2t.v64{background:#ff8a3d;color:#fff}
.g2t.v128{background:#8fb1ff;color:#fff}
.g2t.v256{background:#5f8cff;color:#fff}
.g2t.v512{background:#2447e0;color:#fff}
.g2t.v1024{background:#1a35ad;color:#fff}
.g2t.v2048{background:#16213a;color:var(--sun)}
.g2t.v4096,.g2t.v8192{background:#0b7a55;color:#fff}
.g2t.spawn::after,.g2t.pop::after{content:none}
.g2t.spawn{animation:g2in 200ms ease-out}
.g2t.pop{animation:g2pop 200ms ease-out}
@keyframes g2in{from{opacity:0;scale:.3}to{opacity:1;scale:1}}
@keyframes g2pop{0%{scale:1}45%{scale:1.16}100%{scale:1}}
.gk-fs .g2b{--sz:min(calc(100vh - 250px),calc(100vw - 40px),640px)}
/* сапёр */
.mn-wrap{overflow:auto;max-width:100%}
.mnb{--w:9;--h:9;--c:min(calc((100vw - 2*var(--gutter))/var(--w)),36px);display:grid;grid-template-columns:repeat(var(--w),var(--c));grid-auto-rows:var(--c);width:max-content;border:2px solid var(--ink-2);border-radius:var(--r-sm);overflow:hidden;touch-action:manipulation;user-select:none}
.mnc{width:var(--c);height:var(--c);padding:0;border:0;border-right:1px solid #fff;border-bottom:1px solid #fff;background:#b6c3d9;font:800 calc(var(--c)*.56)/1 var(--font);cursor:pointer;position:relative}
.mnc:hover{background:#c6d2e4}
.mnc.op{background:#eef2f7;border-color:#dfe5ee;cursor:default;animation:mnop .24s ease-out backwards}
@keyframes mnop{from{transform:scale(.6);opacity:.3}to{transform:none;opacity:1}}
.mnc.n1{color:#2447e0}.mnc.n2{color:#0b7a55}.mnc.n3{color:#c62f2f}.mnc.n4{color:#1a2a7c}.mnc.n5{color:#7c1a1a}.mnc.n6{color:#0e7c86}.mnc.n7{color:#16213a}.mnc.n8{color:#55607a}
.mnc.fl::before{content:"";position:absolute;left:32%;top:18%;width:0;height:0;border-left:calc(var(--c)*.38) solid var(--bad);border-top:calc(var(--c)*.17) solid transparent;border-bottom:calc(var(--c)*.17) solid transparent}
.mnc.fl::after{content:"";position:absolute;left:30%;top:18%;width:2px;height:60%;background:var(--ink)}
.mnc.mine::before,.mnc.boom::before{content:"";position:absolute;inset:24%;border-radius:50%;background:var(--ink)}
.mnc.boom{background:var(--bad);animation:mnboom .4s ease-out}
@keyframes mnboom{0%{transform:scale(1.5)}100%{transform:none}}
.mnc.wrong{background:var(--bad-soft)}
.mnc.hn{box-shadow:inset 0 0 0 3px var(--sun)}
.gk-fs .mnb{--c:min(calc((100vh - 240px)/var(--h)),calc((100vw - 30px)/var(--w)))}
/* точки */
.dt-sc{display:flex;gap:var(--s2);margin:var(--s2) 0;flex-wrap:wrap}
.dt-sc span{background:var(--mist);border-radius:var(--r);padding:var(--s1) var(--s4);font:var(--t-xs);color:var(--soft);min-width:84px}
.dt-sc b{display:block;font:700 20px/26px var(--font);color:var(--ink);font-variant-numeric:tabular-nums}
.dt-s.dt-a b{color:#2447e0}
.dt-s.dt-b b{color:#c62f2f}
.dtb{display:block;width:min(100%,560px);height:auto;background:#fdfdfb;border:1px solid var(--line);border-radius:var(--r);touch-action:manipulation;cursor:pointer}
.dt-grid line{stroke:#d5deec;stroke-width:1}
.dt-d{transform-box:fill-box;transform-origin:center;animation:dtin .26s cubic-bezier(.2,1.4,.5,1)}
.dt-d.dt-a{fill:#2447e0}
.dt-d.dt-b{fill:#c62f2f}
.dt-d.fresh{stroke:var(--sun);stroke-width:3}
.dt-d.off{opacity:.3}
@keyframes dtin{from{transform:scale(.2)}to{transform:scale(1)}}
.dt-fill{animation:dtfill var(--d,380ms) ease-out both}
.dt-fill.dt-a{fill:#2447e0}
.dt-fill.dt-b{fill:#c62f2f}
@keyframes dtfill{from{opacity:0}to{opacity:.16}}
.dt-line{stroke-width:3;stroke-linecap:round}
.dt-line.dt-a{stroke:#2447e0}
.dt-line.dt-b{stroke:#c62f2f}
.dt-h{fill:none;stroke:var(--ok);stroke-width:2.5;stroke-dasharray:4 3}
.dt-h.bad{stroke:var(--bad)}
.gk-fs .dtb{width:min(calc(100vh - 240px),calc(100vw - 40px));margin:0 auto}
/* прогресс */
.gk-cal{display:grid;grid-template-columns:repeat(14,minmax(0,28px));gap:4px}
.gk-cal i{height:28px;border-radius:4px;background:var(--block)}
.gk-cal i.l1{background:var(--sun-soft)}
.gk-cal i.l2{background:var(--sun)}
.gk-cal i.l3{background:var(--ok)}
.gk-rate{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:var(--s2)}
.gk-rate li{border:1px solid var(--line);border-radius:var(--r);padding:var(--s2) var(--s3)}
.gk-rate li.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.gk-rate b{display:block}
.gk-rate span{font:var(--t-xs);opacity:.75}
@media (max-width:640px){
.big-word{font-size:34px;line-height:42px}
.btb{--c:calc((100vw - 2*var(--gutter) - 4px)/10)}
.bt-col.mine .btb{--c:calc((100vw - 2*var(--gutter) - 4px)/16)}
.bt-main{gap:var(--s3)}
.bt-col .h3{font-size:15px;line-height:20px}
.gk-fs .bt-main{flex-wrap:wrap;gap:var(--s1)}
.gk-fs .btb{--c:calc((100vw - 34px)/10)}
.gk-fs .bt-col.mine .btb{--c:min(calc((100vw - 34px)/18),calc((100vh - 500px)/10))}
.nono[data-s="5"]{--c:40px}
.nono[data-s="10"]{--c:27px}
.numpad.pn{grid-template-columns:repeat(var(--k),minmax(0,1fr))}
.g2s span{min-width:0;flex:1}
.sp td{width:30px;height:30px}
.g2s,.dt-sc{gap:var(--s1);margin:var(--s1) 0;flex-wrap:nowrap}
.g2s span,.dt-sc span{padding:2px var(--s2);display:flex;gap:var(--s1);align-items:baseline;flex:1;min-width:0;white-space:nowrap}
.g2s b,.dt-sc b{font-size:16px;line-height:22px}
.game .now{min-height:36px;padding:var(--s1) var(--s3)}
.game-meta{font:var(--t-sm)}
.bt-col .h3{margin-bottom:2px}
}
@media print{
  .sub-links,.pills{display:none!important}
  .sp-ans{page-break-before:always}
  .top,.foot,.crumbs,.tools,.kb,.now,.side,.ad,.done,.ck,.ans-box summary{display:none!important}
  .ans-box[open],.ans-box{display:block}
  .pgrid{--c:30px!important;overflow:visible!important}
  .pgrid.sc{--c:50px!important}
  .pq{font-size:7pt;line-height:1.1}
  body{font-size:12pt;line-height:1.35}
  .game-body{display:block}
  .clues button.on{background:none}
  .pc{background:#fff!important;color:transparent}
  .pc small{color:#000}
  .pq{background:#fff!important}
  .clues{margin-top:14pt}
  .ans-box{border:0;page-break-before:always}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
