/* Танковый двор — modern board game UI */
:root{
  --panel:rgba(16,22,31,.80);
  --panel-strong:rgba(14,19,27,.92);
  --panel-soft:rgba(30,40,55,.62);
  --panel2:#243142;
  --line:rgba(230,196,117,.18);
  --line-strong:rgba(230,196,117,.42);
  --gold:#D9B56A;
  --gold2:#F0CC7E;
  --gold3:#FFE6A9;
  --cream:#F5ECDC;
  --muted:#B7B2A8;
  --red:#C84A39;
  --shadow:0 22px 60px rgba(0,0,0,.44);
  --inset:inset 0 1px 0 rgba(255,255,255,.08), inset 0 -1px 0 rgba(255,255,255,.03);
  --pos:#7DB356;--neg:#C9614A;--pvp:#5B93C6;--zag:#D9A93A;--none:#BDB08C;--wot:#8F6DBA;--tar:#3AA39A;--shop:#C9A227;
  --common:#9AA3AB;--rare:#5B93C6;--epic:#B07CE0;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:radial-gradient(circle at 18% 16%,#dce7ef 0,#c0d0dc 30%,#9bafbf 100%);
  color:var(--cream);
  font:500 14px/1.4 Rubik,system-ui,sans-serif;
  overflow:hidden;
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(circle at 20% 10%,rgba(255,255,255,.28),transparent 28%),
    radial-gradient(circle at 82% 18%,rgba(255,222,160,.15),transparent 22%),
    linear-gradient(to bottom,rgba(255,255,255,.08),rgba(0,0,0,.04));
}
button,input,select,textarea{font:inherit;color:inherit}
#c{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
#c.drag{cursor:grabbing}
[hidden]{display:none!important}
.muted{color:var(--muted)}
.small{font-size:12px}
.num{text-align:right;font-variant-numeric:tabular-nums}
.warn{color:#FF9A7A}

/* шапка */
.top{
  position:fixed;left:max(16px,env(safe-area-inset-left,0px));top:calc(14px + env(safe-area-inset-top,0px));
  display:flex;gap:14px;align-items:flex-start;z-index:7;pointer-events:none
}
.top>*{pointer-events:auto}
.logo{
  font-family:'Russo One',Rubik,sans-serif;font-size:clamp(22px,3vw,34px);line-height:1;letter-spacing:.05em;
  color:var(--cream);
  text-shadow:0 2px 0 rgba(0,0,0,.4),0 14px 30px rgba(0,0,0,.22),0 0 18px rgba(255,214,130,.08)
}
.logo.big{font-size:32px;text-align:center}
.sub{
  margin-top:8px;display:inline-block;padding:5px 10px;border-radius:999px;
  background:linear-gradient(180deg,rgba(18,24,34,.86),rgba(24,33,46,.74));
  border:1px solid var(--line-strong);color:var(--gold3);font-weight:800;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;
  box-shadow:var(--inset),0 10px 26px rgba(0,0,0,.18)
}
.topbtns{display:flex;gap:8px;flex-wrap:wrap}

/* панель */
.panel{
  position:fixed;right:max(14px,env(safe-area-inset-right,0px));top:calc(14px + env(safe-area-inset-top,0px));bottom:calc(14px + env(safe-area-inset-bottom,0px));
  width:min(410px,calc(100% - 28px));display:flex;flex-direction:column;overflow:hidden;z-index:8;
  background:linear-gradient(180deg,rgba(19,26,36,.92),rgba(15,20,29,.88));
  border:1px solid rgba(240,204,126,.34);border-radius:18px;box-shadow:var(--shadow),var(--inset);
  backdrop-filter:blur(14px) saturate(1.15)
}
.panel:before{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 22%,transparent 80%,rgba(255,255,255,.03));
}
.grip{display:none}
.me{
  padding:12px 16px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(42,57,77,.88),rgba(21,29,40,.84));display:flex;gap:12px;align-items:center
}
.me .who{flex:1;min-width:0}
.me .nm{font-family:'Russo One',sans-serif;color:var(--gold2);font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 2px 10px rgba(0,0,0,.25)}
.me .st{font-size:12px;color:var(--muted)}
.tabs{display:flex;gap:2px;padding:8px 10px 0;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none;background:linear-gradient(180deg,rgba(255,255,255,.025),transparent)}
.tabs button{
  background:none;border:0;border-bottom:2px solid transparent;padding:10px 10px 9px;font-weight:800;font-size:13px;color:var(--muted);cursor:pointer;white-space:nowrap;position:relative;transition:.16s ease
}
.tabs button:hover{color:var(--cream)}
.tabs button[aria-selected="true"]{color:var(--gold2);border-bottom-color:var(--gold2);text-shadow:0 0 14px rgba(242,195,106,.22)}
.tabs .badge{position:absolute;top:1px;right:-2px;background:var(--red);color:#fff;border-radius:999px;font-size:10px;padding:0 5px;line-height:16px;box-shadow:0 6px 14px rgba(0,0,0,.28)}
.tabbody{flex:1;overflow-y:auto;padding:14px 15px 20px;display:grid;gap:12px;align-content:start;overscroll-behavior:contain}
.tabbody::-webkit-scrollbar{width:10px}
.tabbody::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:999px;border:2px solid transparent;background-clip:padding-box}

h2{margin:0;font-family:'Russo One',sans-serif;font-weight:400;font-size:17px;color:var(--gold2)}
h3{margin:4px 0 0;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.card{
  position:relative;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.025));
  border:1px solid var(--line);border-radius:14px;padding:11px 12px;display:grid;gap:7px;box-shadow:var(--inset)
}
.card:before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 36%)}
.card>b{color:var(--cream)}
.card.pos{border-left:4px solid var(--pos)}.card.neg{border-left:4px solid var(--neg)}.card.pvp{border-left:4px solid var(--pvp)}.card.wot{border-left:4px solid var(--wot)}.card.tar{border-left:4px solid var(--tar)}.card.zag{border-left:4px solid var(--zag)}.card.none{border-left:4px solid var(--none)}.card.shop{border-left:4px solid var(--shop)}
.card.hot{border-color:rgba(240,204,126,.5);box-shadow:0 0 0 1px rgba(240,204,126,.1),var(--inset)}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.stat{
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.03));
  border:1px solid rgba(240,204,126,.12);border-radius:12px;padding:7px 8px;display:grid;gap:2px;box-shadow:var(--inset)
}
.stat b{font-family:'Russo One',sans-serif;font-weight:400;font-size:17px;color:var(--cream)}
.stat span{font-size:10.5px;color:var(--muted);line-height:1.2}
.stat.hot b{color:var(--gold2)}

.btn{
  appearance:none;font-weight:800;font-size:15px;min-height:44px;padding:10px 14px;cursor:pointer;border-radius:12px;
  border:1px solid #F2D48D;color:#221b10;
  background:linear-gradient(180deg,#F5D48A,#C99D4B 60%,#B98838);
  box-shadow:0 2px 0 #7D5A1F,0 10px 24px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.42);
  transition:transform .12s ease,filter .15s ease,box-shadow .15s ease
}
.btn:hover{filter:brightness(1.05)}
.btn:active{transform:translateY(1px);box-shadow:0 1px 0 #7D5A1F,0 8px 18px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.3)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.ghost{
  color:var(--cream);border:1px solid rgba(230,196,117,.35);
  background:linear-gradient(180deg,rgba(36,48,66,.78),rgba(19,26,36,.78));
  box-shadow:var(--inset),0 8px 18px rgba(0,0,0,.14)
}
.btn.sm{font-size:13px;min-height:34px;padding:6px 10px;border-radius:10px}
.btn.danger{background:linear-gradient(180deg,#E48671,#B94732);border-color:#F0AB97;box-shadow:0 2px 0 #6E2216,0 10px 24px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.3);color:#fff}
.btn.wide{width:100%}
.btn:focus-visible,.tabs button:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}

.pill{display:inline-block;border-radius:999px;font-size:10.5px;font-weight:800;padding:3px 8px;text-transform:uppercase;letter-spacing:.06em;color:#14202C;background:var(--none);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.pill.pos{background:var(--pos)}.pill.neg{background:var(--neg)}.pill.pvp{background:var(--pvp)}.pill.zag{background:var(--zag)}.pill.wot{background:var(--wot)}.pill.tar{background:var(--tar)}.pill.shop{background:var(--shop)}
.pill.common{background:var(--common)}.pill.rare{background:var(--rare)}.pill.epic{background:var(--epic)}.pill.qty{background:var(--gold2)}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:700;background:rgba(255,255,255,.025)}
.chip.live{border-color:#7DE08A;color:#9AF0A6;box-shadow:0 0 0 1px rgba(125,224,138,.08)}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block;flex:none;box-shadow:0 0 0 1.5px rgba(0,0,0,.4),0 0 12px rgba(255,255,255,.1)}
.plink{background:none;border:0;padding:0;display:inline-flex;align-items:center;gap:5px;font-weight:700;color:var(--cream);cursor:pointer;text-decoration:underline dotted rgba(214,178,94,.6);text-underline-offset:3px}
.items{display:grid;gap:6px}
.item{display:grid;grid-template-columns:1fr auto;gap:3px 8px;align-items:center;background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:10px;padding:8px 10px;box-shadow:var(--inset)}
.item .nm{font-weight:800}.item .ds{grid-column:1/-1;font-size:12px;color:var(--muted)}
.slot-empty{font-size:12.5px;color:var(--muted)}
.dests{display:flex;flex-wrap:wrap;gap:6px}
.die2d{width:44px;height:44px;border-radius:12px;background:linear-gradient(180deg,#f5f0e1,#d8ccb0);color:#B23A2A;display:grid;place-items:center;font:400 24px 'Russo One',sans-serif;flex:none;box-shadow:0 8px 18px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.45)}
.feed{display:grid;gap:6px}
.feed .f{font-size:13px;padding:7px 8px;border-radius:9px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.03)}
.feed .f.radio{border-left:3px solid var(--gold)}
.feed time{color:var(--muted);font-size:11px;margin-right:6px;font-variant-numeric:tabular-nums}

table{width:100%;border-collapse:collapse}
td,th{padding:6px 5px;border-bottom:1px solid rgba(214,178,94,.12);font-size:13px;text-align:left;vertical-align:middle}
th{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.field{display:grid;gap:4px;font-size:12px;color:var(--muted);font-weight:600}
.field input,.field select,.field textarea,input.inp,select.inp{
  background:linear-gradient(180deg,rgba(0,0,0,.26),rgba(0,0,0,.18));border:1px solid rgba(214,178,94,.28);border-radius:10px;padding:9px 10px;color:var(--cream);font-size:14px;min-width:0;width:100%;box-shadow:var(--inset)
}
.field input:focus,.field select:focus,.field textarea:focus,input.inp:focus,select.inp:focus{outline:none;border-color:rgba(240,204,126,.46);box-shadow:0 0 0 3px rgba(240,204,126,.09),var(--inset)}
input.inp.n{width:84px;text-align:right}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.check{display:flex;gap:8px;align-items:center;font-weight:600}
.check input{width:18px;height:18px;accent-color:var(--gold)}
.upload{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.upload label.btn{display:inline-flex;align-items:center}
.upload input[type=file]{position:absolute;width:1px;height:1px;opacity:0}
.thumbs{display:flex;gap:6px;flex-wrap:wrap}
.shotbox{position:relative;display:grid;gap:2px}
.thumb{width:84px;height:56px;object-fit:cover;border-radius:8px;border:1px solid var(--line);cursor:zoom-in;background:#111;box-shadow:0 10px 18px rgba(0,0,0,.18)}
.thumbcap{font-size:10px;color:var(--muted);max-width:84px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shotbox .rm{position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:50%;border:0;background:var(--red);color:#fff;font-weight:800;cursor:pointer;line-height:22px;padding:0;box-shadow:0 8px 18px rgba(0,0,0,.3)}
.calc{font-size:12.5px;display:grid;gap:2px}
.calc .ln{display:flex;justify-content:space-between;gap:10px}
.calc .tot{font-weight:800;color:var(--gold2);border-top:1px solid var(--line);padding-top:4px;margin-top:2px}

/* всплывашки */
.pop{
  position:fixed;z-index:20;width:min(300px,calc(100% - 24px));background:linear-gradient(180deg,rgba(18,24,34,.94),rgba(15,20,28,.9));
  border:1px solid rgba(240,204,126,.34);border-radius:14px;box-shadow:var(--shadow),var(--inset);padding:13px 14px;display:grid;gap:7px;backdrop-filter:blur(14px)
}
.pop h4,.pcard h4{margin:0;font-family:'Russo One',sans-serif;font-weight:400;font-size:17px;color:var(--gold2);padding-right:24px}
.x{position:absolute;right:6px;top:4px;background:none;border:0;font:700 22px Rubik,sans-serif;color:var(--cream);cursor:pointer;padding:2px 8px}
.modal{position:fixed;inset:0;z-index:30;background:rgba(10,14,20,.66);display:grid;place-items:center;padding:16px;backdrop-filter:blur(4px)}
.pcard{position:relative;width:min(500px,100%);max-height:calc(100vh - 32px);overflow-y:auto;background:linear-gradient(180deg,rgba(18,24,34,.96),rgba(15,20,28,.92));border:1px solid rgba(240,204,126,.34);border-radius:18px;box-shadow:var(--shadow),var(--inset)}
.pcard .head{display:flex;gap:14px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(42,57,77,.92),rgba(20,27,38,.88))}
.pcard .ava{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;font:400 26px 'Russo One',sans-serif;color:#14202C;flex:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 24px rgba(0,0,0,.18)}
.pcard .body{padding:14px 18px 18px;display:grid;gap:12px}
.pcard .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700;margin-bottom:4px}
.tagrow{display:flex;flex-wrap:wrap;gap:5px}
.light img{max-width:min(1100px,96vw);max-height:86vh;border-radius:10px;border:1px solid rgba(240,204,126,.35);display:block;box-shadow:var(--shadow)}
.light .cap{text-align:center;margin-top:8px;color:var(--muted)}
.err{position:fixed;left:50%;top:calc(14px + env(safe-area-inset-top,0px));transform:translateX(-50%);z-index:40;background:rgba(200,50,30,.92);color:#fff;border:1px solid rgba(255,255,255,.45);border-radius:12px;padding:11px 40px 11px 14px;font-weight:600;font-size:14px;width:min(560px,calc(100% - 24px));box-shadow:var(--shadow);display:grid;gap:2px}
.err button{position:absolute;right:6px;top:4px;background:none;border:0;color:#fff;font:700 22px Rubik,sans-serif;cursor:pointer}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:35;background:linear-gradient(180deg,rgba(18,24,34,.94),rgba(15,20,28,.9));border:1px solid rgba(240,204,126,.34);border-radius:12px;padding:10px 14px;font-weight:600;max-width:calc(100% - 24px);box-shadow:var(--shadow),var(--inset)}
.gate{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,rgba(53,69,92,.92),rgba(10,14,20,.97));padding:16px}
.gatecard{width:min(370px,100%);background:linear-gradient(180deg,rgba(18,24,34,.94),rgba(15,20,28,.9));border:1px solid rgba(240,204,126,.34);border-radius:18px;padding:24px;display:grid;gap:12px;box-shadow:var(--shadow),var(--inset)}
.gatecard p{margin:0;text-align:center;font-size:13px}
.loading{position:fixed;inset:0;display:grid;place-items:center;background:#1B2430;color:var(--gold2);z-index:60;font-family:'Russo One',sans-serif;font-size:20px;letter-spacing:.05em;text-align:center;padding:20px}

@media (max-width:760px){
  .panel{top:auto;left:8px;right:8px;width:auto;height:60vh;bottom:calc(8px + env(safe-area-inset-bottom,0px));border-radius:18px}
  .panel.min{height:118px}
  .grip{display:block;background:none;border:0;padding:7px 0 0;cursor:pointer}
  .grip span{display:block;width:46px;height:5px;border-radius:999px;background:linear-gradient(180deg,var(--gold3),var(--gold));margin:0 auto;box-shadow:0 8px 18px rgba(0,0,0,.18)}
  .top{gap:8px}
  .logo{font-size:20px}
  .topbtns .btn{min-height:34px;padding:5px 9px;font-size:12px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (prefers-reduced-motion:reduce){
  .btn,.tabs button{transition:none}
  .btn:active{transform:none}
}

/* ======================================================================
   Раскладка экрана: рейтинг слева вверху, «Ход» внизу, панель справа
   ====================================================================== */
:root{--pw:410px;--gap:14px;--tbh:min(44vh,330px);
  --card-face:#F1E6CF;--card-face2:#E2D0AB;--card-ink:#1E2630;--card-ink2:#4B4A44;--card-art:#1C2633;--card-art2:#2B394B}
.panel{bottom:calc(var(--tbh) + var(--gap) * 2 + env(safe-area-inset-bottom,0px))}
.panel.min{bottom:auto;height:auto}
.panel.min .tabs,.panel.min .tabbody{display:none}
.panel.min .me{border-bottom:0}
.fold{flex:none;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;cursor:pointer;color:var(--gold2);
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(0,0,0,.12));border:1px solid var(--line-strong);box-shadow:var(--inset);padding:0;transition:transform .2s ease,background .2s ease}
.fold svg{width:18px;height:18px;transition:transform .2s ease}
.fold:hover{background:rgba(240,204,126,.14)}
.fold:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.min>.me .fold svg,.rankbox.min .fold svg{transform:rotate(180deg)}

/* рейтинг */
.rankbox{position:fixed;z-index:7;left:max(16px,env(safe-area-inset-left,0px));top:calc(104px + env(safe-area-inset-top,0px));
  width:min(300px,calc(100% - 32px));max-height:calc(100vh - var(--tbh) - 150px);display:flex;flex-direction:column;overflow:hidden;
  background:linear-gradient(180deg,rgba(19,26,36,.9),rgba(15,20,29,.86));border:1px solid rgba(240,204,126,.34);border-radius:16px;box-shadow:var(--shadow),var(--inset);backdrop-filter:blur(12px)}
.rk-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px 9px 14px}
.rk-head h2{font-size:15px}
.rk-body{min-height:0;padding:0 12px 12px;overflow-y:auto;display:grid;gap:8px;border-top:1px solid var(--line);padding-top:8px}
.rankbox.min .rk-body{display:none}
.rk{font-size:13px}
.rk td,.rk th{padding:4px 4px}
.rk .me-row td{background:rgba(240,204,126,.08)}
.rk-bat{line-height:1.4}

/* нижняя панель «Ход» */
.turnbar{position:fixed;z-index:8;left:max(16px,env(safe-area-inset-left,0px));bottom:calc(var(--gap) + env(safe-area-inset-bottom,0px));
  right:max(16px,env(safe-area-inset-right,0px));height:var(--tbh);
  display:grid;grid-template-columns:minmax(270px,330px) minmax(0,1fr);gap:14px;padding:12px 14px;
  background:linear-gradient(180deg,rgba(19,26,36,.92),rgba(15,20,29,.9));border:1px solid rgba(240,204,126,.34);border-radius:18px;box-shadow:var(--shadow),var(--inset);backdrop-filter:blur(14px) saturate(1.15)}
body.tb-tall{--tbh:min(64vh,620px)}
body.tb-tall .turnbar{grid-template-columns:minmax(320px,520px) minmax(0,1fr)}
.rankbox{min-height:52px}
.tb-main{min-width:0;overflow-y:auto;display:grid;gap:10px;align-content:start;padding-right:4px;scrollbar-width:thin}
.tb-side{min-width:0;overflow-y:auto;display:grid;gap:12px;align-content:start;border-left:1px solid var(--line);padding-left:14px;scrollbar-width:thin}
.side-sec{display:grid;gap:8px;min-width:0}
.side-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.side-h h3{margin:0}
.side-sec.shop .side-h h3{color:var(--shop)}

/* карточки предметов как в настольной игре */
.deck{display:grid;grid-template-columns:repeat(var(--per,5),minmax(0,150px));gap:10px;padding:4px 2px 6px;container-type:inline-size}
.pager{margin-left:auto;display:flex;align-items:center;gap:6px}
.pg{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;padding:0;cursor:pointer;font:700 20px/1 Rubik,sans-serif;color:var(--gold2);
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(0,0,0,.12));border:1px solid var(--line-strong);box-shadow:var(--inset)}
.pg:hover:not(:disabled){background:rgba(240,204,126,.16)}
.pg:disabled{opacity:.35;cursor:default}
.pg:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.pg-n{min-width:38px;text-align:center;font-weight:800;font-size:13px;color:var(--cream);font-variant-numeric:tabular-nums}
.gcard{--rc:var(--common);min-width:0;container-type:inline-size;display:flex;flex-direction:column;gap:5px;padding:7px;border-radius:12px;position:relative;
  background:linear-gradient(160deg,var(--card-face),var(--card-face2));color:var(--card-ink);
  border:3px solid var(--rc);box-shadow:0 0 0 1px rgba(0,0,0,.45),0 10px 22px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.5);transition:transform .18s ease,box-shadow .18s ease}
.gcard.rare{--rc:var(--rare)}.gcard.epic{--rc:var(--epic)}
.gcard:hover{transform:translateY(-4px) rotate(-.6deg);box-shadow:0 0 0 1px rgba(0,0,0,.45),0 16px 28px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.5)}
.gc-top{display:flex;align-items:center;gap:6px;justify-content:space-between;min-height:30px}
.gc-nm{font-family:'Russo One',Rubik,sans-serif;font-size:12px;line-height:1.15;color:var(--card-ink);text-wrap:balance}
.gc-q{flex:none;font:800 11px Rubik,sans-serif;background:var(--card-ink);color:var(--gold3);border-radius:999px;padding:2px 7px}
.gc-art{border-radius:7px;aspect-ratio:100/72;max-width:100%;background:radial-gradient(circle at 50% 40%,var(--card-art2),var(--card-art));border:2px solid var(--rc);overflow:hidden;box-shadow:inset 0 0 18px rgba(0,0,0,.5)}
.gc-art svg{display:block;width:100%;height:100%}
.gc-rar{align-self:center;margin-top:-13px;background:var(--rc);color:#fff;font:800 9.5px Rubik,sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:2px 9px;border-radius:999px;box-shadow:0 3px 8px rgba(0,0,0,.3);text-shadow:0 1px 1px rgba(0,0,0,.35)}
.gc-ds{margin:0;font-size:11px;line-height:1.3;color:var(--card-ink2);flex:1;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.gc-foot{display:grid}
.gc-foot .btn{width:100%;min-height:30px;font-size:12px;padding:5px 8px}
.gc-auto{text-align:center;font-size:11px;font-weight:700;color:var(--card-ink2);padding:6px 0;border-top:1px dashed rgba(0,0,0,.25)}
.toast{bottom:auto;top:calc(70px + env(safe-area-inset-top,0px))}

@media (max-width:1100px){
  .turnbar{grid-template-columns:1fr;overflow-y:auto}
  .tb-main,.tb-side{overflow:visible}
  .tb-side{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:10px}
}
@media (max-width:760px){
  :root{--tbh:40vh;--gap:8px}
  .top{flex-wrap:wrap;right:8px}
  .topbtns{flex-wrap:nowrap}
  .panel{top:calc(116px + env(safe-area-inset-top,0px));bottom:auto;left:8px;right:8px;width:auto;height:calc(100vh - var(--tbh) - 140px)}
  .panel.min{height:auto}
  .rankbox{left:8px;top:calc(180px + env(safe-area-inset-top,0px));width:min(300px,calc(100% - 16px));max-height:calc(100vh - var(--tbh) - 204px)}
  .turnbar .stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
  .turnbar .stat{padding:5px 6px}
  .turnbar .stat span{font-size:9.5px}
  body:not(.panel-min) .rankbox{display:none}
  .turnbar,body.panel-min .turnbar{left:8px;right:8px;padding:10px}
}
@media (prefers-reduced-motion:reduce){.gcard,.fold,.fold svg{transition:none}.gcard:hover{transform:none}}

/* узкие карточки: прячем описание (оно во всплывающей подсказке), мельче шрифт */
@container (max-width:118px){
  .gc-ds{display:none}
  .gc-nm{font-size:10.5px}
  .gc-foot .btn{font-size:11px;padding:4px 4px;min-height:26px}
  .gc-auto{font-size:10px}
}

/* миникарточки */
.minis{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:8px}
.mcard{--rc:var(--common);position:relative;display:grid;gap:4px;padding:4px;border-radius:8px;cursor:help;background:linear-gradient(160deg,var(--card-face),var(--card-face2));border:2px solid var(--rc);box-shadow:0 4px 10px rgba(0,0,0,.3);transition:transform .15s ease}
.mcard.rare{--rc:var(--rare)}.mcard.epic{--rc:var(--epic)}
.mcard:hover,.mcard:focus-visible{transform:translateY(-2px);outline:none;box-shadow:0 0 0 2px var(--gold2),0 6px 14px rgba(0,0,0,.35)}
.mc-art{border-radius:5px;aspect-ratio:100/72;background:radial-gradient(circle at 50% 40%,var(--card-art2),var(--card-art));overflow:hidden}
.mc-art svg{display:block;width:100%;height:100%}
.mc-nm{font:700 10px/1.15 Rubik,sans-serif;color:var(--card-ink);text-align:center;min-height:23px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mc-q{position:absolute;top:-6px;right:-6px;font:800 10px Rubik,sans-serif;background:var(--card-ink);color:var(--gold3);border-radius:999px;padding:2px 6px;border:1px solid var(--gold)}

/* подсказка у мыши — светлая карточка, как в справке KUKON */
.tip{position:fixed;z-index:70;pointer-events:none;width:min(300px,calc(100vw - 16px));background:#F4F3EF;color:#1A1D22;border-radius:4px;padding:12px 14px 13px;
  box-shadow:0 14px 34px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.25);display:grid;gap:7px;transform:skewX(-2deg)}
.tp-nm{font-family:'Russo One',Rubik,sans-serif;font-style:italic;font-size:19px;line-height:1.05;text-transform:uppercase;letter-spacing:.01em;text-wrap:balance}
.tp-pills{display:flex;gap:6px;flex-wrap:wrap}
.tp-pill{font:800 10px Rubik,sans-serif;text-transform:uppercase;letter-spacing:.06em;padding:3px 8px;background:#BDB08C;color:#14202C}
.tp-pill.pos{background:#7BC043}.tp-pill.neg{background:#E0634A;color:#fff}.tp-pill.pvp{background:#5B93C6;color:#fff}
.tp-pill.r-common{background:#C9CED3}.tp-pill.r-rare{background:#9CC3E8}.tp-pill.r-epic{background:#CDB0EC}
.tp-ds{font-size:13.5px;line-height:1.4;color:#2A2E35}

/* окно стартового имущества */
.invm{position:relative;width:min(980px,100%);max-height:calc(100vh - 32px);display:flex;flex-direction:column;overflow:hidden;
  background:linear-gradient(180deg,rgba(18,24,34,.98),rgba(15,20,28,.97));border:1px solid rgba(240,204,126,.34);border-radius:18px;box-shadow:var(--shadow),var(--inset)}
.invm-h{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:16px 18px 12px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(42,57,77,.92),rgba(20,27,38,.88))}
.invm-h h4{margin:0 0 4px;font-family:'Russo One',sans-serif;font-weight:400;font-size:18px;color:var(--gold2)}
.invm-h .x{position:static}
.invm-b{overflow-y:auto;padding:14px 18px 18px;display:grid;gap:18px;min-height:0}
.invm-b section{display:grid;gap:8px;min-width:0}
.invm-b h3{font-size:12.5px;color:var(--gold2)}
.curgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.curv{font-family:'Russo One',sans-serif;font-weight:400;font-size:17px;color:var(--cream)}
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.invt{width:100%;border-collapse:collapse;font-size:13px}
.invt th,.invt td{padding:6px 10px;border-bottom:1px solid rgba(230,196,117,.1);vertical-align:middle}
.invt thead th{position:sticky;top:0;background:#1B2533;z-index:1}
.invt tr.grp td{background:rgba(240,204,126,.08);color:var(--gold3);font-weight:800;font-size:11.5px;text-transform:uppercase;letter-spacing:.07em}
.invt tr[hidden]{display:none}
.invt td.num,.invt th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.iname{display:flex;align-items:center;gap:8px}
.iname .inp{flex:1;min-width:140px}
.ico{flex:none;width:26px;height:26px;padding:2px;border-radius:6px;background:linear-gradient(180deg,#26313F,#161D27);border:1px solid rgba(240,204,126,.22)}
.step{display:inline-flex;align-items:center;gap:4px}
.step button{width:28px;height:28px;border-radius:7px;border:1px solid var(--line-strong);background:rgba(255,255,255,.05);color:var(--gold2);font:800 16px/1 Rubik,sans-serif;cursor:pointer;padding:0}
.step button:hover{background:rgba(240,204,126,.16)}
.step button:focus-visible{outline:2px solid var(--gold2);outline-offset:1px}
.step input.inp.n{width:64px;text-align:center}
.rmrow{width:26px;height:26px;border-radius:50%;border:0;background:rgba(200,74,57,.85);color:#fff;font-weight:800;cursor:pointer}
.invtools{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.invtools .inp{flex:1;min-width:200px}
.drop{position:relative;display:grid;gap:4px;place-items:center;text-align:center;padding:22px 16px;border-radius:14px;cursor:pointer;
  border:2px dashed rgba(240,204,126,.45);background:rgba(240,204,126,.05);transition:background .15s ease,border-color .15s ease}
.drop:hover,.drop.over{background:rgba(240,204,126,.12);border-color:var(--gold2)}
.drop b{font-family:'Russo One',sans-serif;font-weight:400;font-size:16px;color:var(--gold2)}
.drop span{font-size:12.5px;color:var(--muted)}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer}
.drop:focus-within{outline:2px solid var(--gold2);outline-offset:2px}
.invm-f{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:12px 18px;border-top:1px solid var(--line);background:rgba(10,14,20,.5)}
.tot{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12.5px;color:var(--muted)}
.tot b{color:var(--cream);font-variant-numeric:tabular-nums}
.tot .big{color:var(--gold2)}.tot .big b{color:var(--gold3);font-size:15px}
@media (max-width:760px){.curgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.invm-b{padding:12px}.invt th,.invt td{padding:5px 6px}}
@media (prefers-reduced-motion:reduce){.mcard,.drop{transition:none}}
.invt input.inp{padding:5px 8px;font-size:13px}
.invt input.inp.n{width:112px}
.invt .step input.inp.n{width:58px}
.step button{width:26px;height:26px}
.invt td{padding-top:4px;padding-bottom:4px}
.tot{flex:1;min-width:0}
.invconfirm{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:8px 10px;border-radius:12px;border:1px solid rgba(255,154,122,.5);background:rgba(200,74,57,.14)}
.invconfirm span{font-weight:700;color:#FFD2C4}

/* ===================================================================
   TANKOVYI DVOR — PREMIUM / READABILITY + COLLECTIBLE CARD EDITION
   Pure presentation changes: no positional/layout geometry overrides.
   =================================================================== */
:root{
  --panel:rgba(29,40,54,.95);
  --panel-strong:rgba(23,33,46,.97);
  --panel-soft:rgba(48,64,80,.91);
  --panel2:#36495c;
  --line:rgba(224,197,145,.28);
  --line-strong:rgba(248,206,131,.64);
  --gold:#E4B96E;
  --gold2:#FFD28D;
  --gold3:#FFEAC0;
  --cream:#FFF8EB;
  --muted:#CFD6DE;
  --red:#DE6550;
  --card-face:#F8EFDC;
  --card-face2:#E2CDA5;
  --card-ink:#202C39;
  --card-ink2:#49515C;
  --card-art:#172739;
  --card-art2:#42566D;
  --shadow:0 23px 58px rgba(5,13,24,.46),0 4px 16px rgba(6,15,24,.28);
  --inset:inset 0 1px 0 rgba(255,255,255,.16);
}
body{color:var(--cream);background:radial-gradient(circle at 38% 14%,#B3C6CD,#6E8B97 58%,#425965 100%);text-shadow:none}
body:before{background:linear-gradient(180deg,rgba(231,242,247,.07),transparent 42%,rgba(8,16,24,.08));}
.logo{color:#FFF9ED;text-shadow:0 3px 1px rgba(8,18,26,.8),0 8px 25px rgba(0,0,0,.38),0 0 28px rgba(255,205,109,.12)}
.sub{color:var(--gold3);background:linear-gradient(145deg,rgba(34,48,60,.96),rgba(25,35,45,.94));border-color:var(--line-strong)}
.panel,.rankbox,.turnbar,.pop,.pcard,.gatecard,.invm{
  background:linear-gradient(155deg,rgba(49,66,82,.97),rgba(31,43,57,.97) 38%,rgba(20,31,44,.985));
  border-color:rgba(235,201,139,.60);
  box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.22),inset 0 0 0 1px rgba(255,255,255,.045);
  backdrop-filter:blur(12px) saturate(1.12);
}
/* Keep fixed positioning intact; all ornaments are paint-only */
.panel:after,.rankbox:after,.turnbar:after,.pcard:after,.gatecard:after,.invm:after{
  content:"";pointer-events:none;position:absolute;inset:5px;
  border:1px solid rgba(255,255,255,.09);border-radius:inherit;
  box-shadow:inset 0 0 32px rgba(12,23,35,.08);
}
.panel:before{background:linear-gradient(180deg,rgba(255,255,255,.095),transparent 28%);pointer-events:none}
.me,.pcard .head,.invm-h{background:linear-gradient(180deg,rgba(77,100,118,.98),rgba(39,54,70,.96));border-color:var(--line)}
.me .nm{color:var(--gold3);text-shadow:0 1px 12px rgba(255,202,110,.18)}
.me .st,.stat span,.small.muted,.muted{color:var(--muted)}
.tabs{background:rgba(10,20,31,.12)}
.tabs button{color:#D0D9E4;text-shadow:0 1px 1px rgba(0,0,0,.23)}
.tabs button:hover{color:#FFF4DA;background:rgba(255,255,255,.07)}
.tabs button[aria-selected="true"]{color:#FFE3AF;border-bottom-color:#FFD18A;background:linear-gradient(0deg,rgba(255,211,141,.13),transparent)}
h2{color:#FFE3AE;text-shadow:0 1px 3px rgba(0,0,0,.28)}
h3,.side-h h3,.invm-b h3{color:#E6D5BD}
.card,.stat,.item{
  background:linear-gradient(160deg,rgba(90,111,129,.36),rgba(24,36,50,.5));
  border-color:rgba(255,224,169,.25);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 4px 12px rgba(2,10,18,.12);
}
.card{color:#F9F4E9}
.card.hot{background:linear-gradient(145deg,rgba(255,205,119,.18),rgba(51,63,76,.6));border-color:#EEC57C}
.stat b{color:#FFF9EC;text-shadow:0 1px 8px rgba(0,0,0,.28)}
.stat.hot b{color:#FFE19C}
.btn{
  color:#302112;border-color:#FFE0A8;
  background:linear-gradient(180deg,#FFE3A5 0%,#F1C572 44%,#D69E4C 100%);
  box-shadow:0 3px 0 #89602D,0 9px 18px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.64);
  text-shadow:0 1px 0 rgba(255,255,255,.14);
}
.btn:hover:not(:disabled){filter:brightness(1.10);box-shadow:0 3px 0 #89602D,0 11px 24px rgba(0,0,0,.26),0 0 17px rgba(255,211,137,.2)}
.btn.ghost,.pg,.fold{
  color:#FFDEA6;background:linear-gradient(160deg,#546B7D,#2D4155);
  border-color:rgba(255,223,160,.46);text-shadow:none;
}
.btn.ghost:hover:not(:disabled),.fold:hover,.pg:hover:not(:disabled){background:linear-gradient(160deg,#647D90,#3D5369)}
.btn.danger{color:#fff;background:linear-gradient(#F08B70,#C64F41);border-color:#FFB39B}
.btn:disabled{filter:saturate(.55);opacity:.57}
:focus-visible{outline:2px solid #FFDB9B;outline-offset:2px}
.field input,.field select,.field textarea,input.inp,select.inp{
  background:rgba(12,24,38,.72);border-color:rgba(224,197,145,.34);
  color:#FFF9EF;box-shadow:inset 0 1px 5px rgba(0,0,0,.18);
}
.field input::placeholder,input.inp::placeholder,.field textarea::placeholder{color:#B9C6D4}
.chip{background:rgba(140,168,178,.13);color:#F4F7F8;border-color:rgba(224,197,145,.36)}
.pill{box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 2px 9px rgba(0,0,0,.13)}
.feed .f{background:rgba(108,134,151,.16);border-color:rgba(255,255,255,.08)}
.rk th,.invt th{color:#E7D3AC}
.rk .me-row td{background:rgba(255,218,151,.14)}
.rankbox .rk-bat{color:#E9F0F4}
.invt thead th{background:#324456}
.invt tr.grp td{color:#FFE3AE;background:rgba(253,206,132,.14)}
.ico{background:linear-gradient(140deg,#42566B,#1C2E42);border-color:rgba(250,216,147,.55)}
.tip{background:linear-gradient(160deg,#FFF8EB,#EFE3CE);color:#192838;border-color:#B79A6A;transform:none;box-shadow:0 16px 38px rgba(0,0,0,.37),inset 0 0 0 1px #fff}
.tp-nm{color:#172332;font-style:normal;line-height:1.12}
.tp-ds{color:#344356}
.drop{border-color:rgba(255,218,145,.64);background:rgba(255,216,151,.08)}
.drop:hover,.drop.over{background:rgba(255,216,151,.17)}
.invm-f{background:rgba(10,22,35,.45)}
.err{background:rgba(185,65,53,.98);color:#fff}
.toast{background:#344A5F;color:#FFF5E5;border-color:#F3C882;box-shadow:var(--shadow)}

#c.over-cell:not(.drag){cursor:pointer}

/* --- COLLECTIBLE / THREE RARITIES --- */
.gcard,.mcard{
  --foilA:#D6D1C5;--foilB:#9A9690;--glow:rgba(252,228,184,.20);
  isolation:isolate;position:relative;
  background:linear-gradient(143deg,#FFF8E9 0%,#F0E1C3 48%,#DEC7A1 100%);
  border-color:var(--rc);
  box-shadow:0 0 0 1px rgba(255,255,255,.55) inset,0 0 0 1px rgba(12,25,37,.50),0 10px 22px rgba(2,10,21,.38);
}
.gcard{border-radius:11px;overflow:hidden;gap:6px;transform:translateZ(0);}
.gcard.rare,.mcard.rare{
  --foilA:#DAEFFF;--foilB:#609BD5;--glow:rgba(112,198,255,.48);
  --rc:#4B9EDE;
  background:linear-gradient(150deg,#ECF7FF 0%,#D6E7F5 40%,#A7C7E5 100%);
}
.gcard.epic,.mcard.epic{
  --foilA:#FFDDFF;--foilB:#9862CC;--glow:rgba(197,122,255,.53);
  --rc:#A56DDA;
  background:linear-gradient(147deg,#F5E9FF 0%,#DDC8F4 45%,#C4A1E8 100%);
}
.gcard:before,.mcard:before{
  content:"";position:absolute;inset:4px;z-index:-1;pointer-events:none;border-radius:7px;
  background:linear-gradient(133deg,rgba(255,255,255,.66) 0,transparent 27%,transparent 70%,rgba(35,39,62,.09) 100%);
  border:1px solid rgba(255,255,255,.52);
}
.gcard:after,.mcard:after{
  content:"";position:absolute;pointer-events:none;z-index:3;inset:-110% -170%;
  background:linear-gradient(107deg,transparent 40%,rgba(255,255,255,.02) 44%,rgba(255,255,255,.64) 48%,rgba(255,255,255,.12) 52%,transparent 57%);
  transform:translateX(-30%) rotate(4deg);opacity:0;
}
.gcard.epic:after,.mcard.epic:after{
  background:linear-gradient(107deg,transparent 41%,rgba(164,230,255,.30) 44%,rgba(255,235,255,.72) 48%,rgba(235,194,255,.35) 51%,transparent 57%);
  animation:foil-wash 8s ease-in-out infinite;
}
.gcard:hover,.gcard:focus-within{
  transform:translateY(-5px);box-shadow:0 0 0 1px #fff inset,0 0 0 1px var(--rc),0 15px 26px rgba(3,11,21,.40),0 0 27px var(--glow);
}
.gcard:hover:after,.gcard:focus-within:after,.mcard:hover:after,.mcard:focus-visible:after{animation:foil-wash 1.15s ease-out forwards;opacity:1}
@keyframes foil-wash{0%{transform:translateX(-57%) rotate(5deg);opacity:0}16%{opacity:.85}55%{opacity:.7}100%{transform:translateX(59%) rotate(5deg);opacity:0}}
.gc-top{border-bottom:1px solid rgba(52,62,72,.19);padding:2px 3px 4px;position:relative;z-index:1}
.gc-nm{font-family:'Russo One',Rubik,sans-serif;color:#243346;font-size:12.3px;line-height:1.2;font-weight:400;overflow-wrap:anywhere}
.gc-q,.mc-q{background:linear-gradient(145deg,#26374D,#111F30);color:#FFE0A3;border:1px solid #B18C52;box-shadow:0 2px 7px rgba(0,0,0,.2)}
.gc-art,.mc-art{
  position:relative;isolation:isolate;
  background:radial-gradient(ellipse at 49% 34%,#576A7D,#22364B 70%,#102132);
  border-color:var(--rc);
  box-shadow:inset 0 0 20px rgba(2,9,19,.54),0 1px 0 rgba(255,255,255,.62),0 3px 8px rgba(5,13,22,.25);
}
.gc-art:before,.mc-art:before{content:"";pointer-events:none;position:absolute;inset:0;z-index:2;background:linear-gradient(155deg,rgba(255,255,255,.13),transparent 35%,rgba(0,0,0,.15));border-radius:inherit}
.gc-art svg,.mc-art svg{filter:drop-shadow(0 3px 3px rgba(0,0,0,.25))}
.gc-rar{position:relative;z-index:2;color:#172235;background:linear-gradient(90deg,var(--foilB),var(--foilA),var(--foilB));border:1px solid rgba(255,255,255,.7);border-radius:4px;box-shadow:0 2px 5px rgba(2,15,30,.25);text-shadow:none;letter-spacing:.09em}
.gcard.epic .gc-rar{color:#2D1747}
.gc-ds{color:#364453;font-size:11.2px;line-height:1.38;text-shadow:none;padding:0 2px}
.gc-foot{margin-top:auto;position:relative;z-index:4}
.gc-foot .btn{font-size:12px;font-weight:800;box-shadow:0 2px 0 #805A28,0 4px 8px rgba(0,0,0,.15)}
.gc-auto{color:#42566A}
.mcard{border-radius:8px;overflow:visible;box-shadow:0 0 0 1px rgba(255,255,255,.60) inset,0 5px 12px rgba(0,0,0,.28)}
.mcard:hover,.mcard:focus-visible{transform:translateY(-3px);box-shadow:0 0 0 1px #fff inset,0 0 0 2px var(--rc),0 8px 17px rgba(0,0,0,.30),0 0 16px var(--glow)}
.mc-nm{color:#203040;font-weight:800;text-shadow:none}
.mc-q{z-index:5}
@container (max-width:118px){.gc-nm{font-size:10.5px}.gc-ds{display:none}.gc-foot .btn{font-size:11px;padding:4px 4px;min-height:26px}}
@media (prefers-reduced-motion:reduce){
 .gcard,.mcard,.btn{transition:none}
 .gcard.epic:after,.mcard.epic:after,.gcard:hover:after,.mcard:hover:after{animation:none;opacity:0}
 .gcard:hover{transform:none}
}

/* слияние: карточки стали выше — даём нижней панели чуть больше места и режем описание до 4 строк */
:root{--tbh:min(46vh,350px)}
.turnbar .gc-ds{-webkit-line-clamp:4}
@media (max-width:760px){:root{--tbh:40vh}}


/* ===================================================================
   V4.1.2 — CARD VISUAL OVERHAUL / AAA COLLECTIBLE PASS
   Presentation only. No layout window positions changed.
   =================================================================== */
.gcard,.mcard{position:relative;overflow:hidden;transform-style:preserve-3d}
.gcard{
  border-width:3px;
  border-radius:14px;
  gap:7px;
  padding:8px;
  background:
    radial-gradient(120% 90% at 14% 0%,rgba(255,255,255,.45),rgba(255,255,255,0) 35%),
    radial-gradient(130% 100% at 100% 100%,rgba(0,0,0,.16),rgba(0,0,0,0) 35%),
    linear-gradient(148deg,#FFF8EA 0%,#F3E2BE 45%,#D7BC90 100%);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.58) inset,
    0 0 0 1px rgba(14,24,36,.52),
    0 14px 28px rgba(2,10,21,.42),
    0 3px 9px rgba(3,12,23,.18);
}
.gcard::before,.mcard::before{border-radius:10px}
.gcard::after,.mcard::after{mix-blend-mode:screen}
.gcard.rare{
  background:
    radial-gradient(120% 90% at 14% 0%,rgba(255,255,255,.62),rgba(255,255,255,0) 37%),
    radial-gradient(130% 100% at 100% 100%,rgba(40,86,134,.15),rgba(0,0,0,0) 38%),
    linear-gradient(147deg,#EEF8FF 0%,#D7E9F9 42%,#ACCBE6 100%);
}
.gcard.epic{
  background:
    radial-gradient(120% 90% at 14% 0%,rgba(255,255,255,.62),rgba(255,255,255,0) 37%),
    radial-gradient(130% 100% at 100% 100%,rgba(112,69,164,.18),rgba(0,0,0,0) 38%),
    linear-gradient(147deg,#F8EEFF 0%,#E5D3F7 44%,#C3A0E8 100%);
}
.gcard:hover,.gcard:focus-within{transform:translateY(-6px) rotate(-.4deg) scale(1.01)}
.gcard .gc-top{padding:3px 4px 5px;border-bottom:1px solid rgba(57,72,89,.18)}
.gc-nm{font-size:12.8px;line-height:1.18;letter-spacing:.01em;text-shadow:0 1px 0 rgba(255,255,255,.24)}
.gc-art,.mc-art{
  border-radius:9px;
  border:1px solid rgba(255,255,255,.38);
  background:
    radial-gradient(ellipse at 30% 18%,rgba(255,229,173,.19),rgba(255,229,173,0) 35%),
    radial-gradient(ellipse at 75% 80%,rgba(5,11,19,.18),rgba(5,11,19,0) 35%),
    linear-gradient(180deg,#1E3041 0%,#172534 100%);
  box-shadow:
    inset 0 0 20px rgba(2,9,19,.54),
    inset 0 1px 0 rgba(255,255,255,.12),
    0 2px 8px rgba(5,13,22,.25);
}
.gc-art::after,.mc-art::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:3;
  background:radial-gradient(circle at 22% 18%,rgba(255,255,255,.15),rgba(255,255,255,0) 30%);
  border-radius:inherit;
}
.gc-art svg,.mc-art svg{filter:drop-shadow(0 3px 4px rgba(0,0,0,.3)) saturate(1.03)}
.gc-rar{
  margin-top:-14px;
  padding:3px 11px;
  letter-spacing:.11em;
  border-radius:999px;
  background:linear-gradient(90deg,var(--foilB),var(--foilA),var(--foilB));
  box-shadow:0 3px 8px rgba(2,15,30,.22), inset 0 1px 0 rgba(255,255,255,.55);
}
.gc-ds{font-size:11.35px;line-height:1.4;color:#334253;padding:0 3px;text-wrap:pretty}
.gc-foot .btn{min-height:32px;border-radius:9px;font-size:12.2px}
.gc-auto{font-size:11px;color:#42566A;border-top:1px dashed rgba(68,83,97,.28)}
.mcard{
  border-radius:10px;
  padding:5px;
  background:
    radial-gradient(120% 90% at 14% 0%,rgba(255,255,255,.4),rgba(255,255,255,0) 35%),
    linear-gradient(150deg,#FFF8EA 0%,#F2DFC0 48%,#D8BE92 100%);
}
.mcard:hover,.mcard:focus-visible{transform:translateY(-4px) scale(1.02)}
.mc-art{border-radius:7px}
.mc-nm{font-size:10.2px;line-height:1.16;text-shadow:0 1px 0 rgba(255,255,255,.22)}
.tp-nm{letter-spacing:.015em}
.tip{box-shadow:0 18px 40px rgba(0,0,0,.4), inset 0 0 0 1px rgba(255,255,255,.65)}
@media (prefers-reduced-motion:reduce){.gcard:hover,.mcard:hover,.mcard:focus-visible{transform:none}}

.gcard.ultra{background:radial-gradient(120% 90% at 14% 0%,rgba(255,255,255,.68),rgba(255,255,255,0) 37%),radial-gradient(130% 100% at 100% 100%,rgba(173,78,18,.18),rgba(0,0,0,0) 38%),linear-gradient(147deg,#FFF2DE 0%,#FFD8A0 42%,#F39B44 100%);box-shadow:0 0 0 1px rgba(255,255,255,.6) inset,0 0 0 1px rgba(68,30,5,.45),0 0 18px rgba(255,149,38,.24),0 14px 28px rgba(2,10,21,.42),0 3px 9px rgba(3,12,23,.18)}
.tp-pill.r-ultra{background:linear-gradient(90deg,#FFCC7A,#F18A1F);color:#4D2500;border-color:rgba(115,56,4,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}

/* V4.1.3 all-in-one — ultra rarity & orange holographic foil */
.gcard.ultra,.mcard.ultra{
  --rc:#F98A19;--foilA:#FFDE89;--foilB:#D65A0A;--glow:rgba(255,129,26,.56);
  border-color:var(--rc);
  background:linear-gradient(138deg,#FFF4DF 0%,#FFDEB2 44%,#F7A148 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.65) inset,0 0 0 1px rgba(117,51,4,.5),0 8px 19px rgba(180,71,0,.2),0 13px 25px rgba(0,0,0,.3);
}
.gcard.ultra::after,.mcard.ultra::after{
  opacity:1;
  background:linear-gradient(110deg,transparent 36%,rgba(255,205,82,.15) 40%,rgba(255,255,225,.62) 46%,rgba(255,157,37,.18) 52%,transparent 60%);
  animation:foil-wash 5.8s ease-in-out infinite;
}
.gcard.ultra .gc-rar{background:linear-gradient(100deg,#FF991E,#FFF0A8,#D95D0B);color:#522500;text-shadow:none;}
.tp-pill.r-ultra{background:linear-gradient(90deg,#FFCB63,#F18412);color:#432000;}
@media (prefers-reduced-motion:reduce){.gcard.ultra::after,.mcard.ultra::after{animation:none;opacity:0;}}


/* ============================================================================
   TD V4.2 — GRAPHICS ONLY. Programmers: see README for required DOM contracts.
   Uses existing design tokens; DOES NOT change application rules / JS rendering.
   ============================================================================ */
:root{
  --td42-rail:300px;
  --td42-edge:14px;
  --td42-bottom:170px;
  --td42-top:106px;
  --td42-space:10px;
  --pw:300px;
  --tbh:var(--td42-bottom);
}
/* Screen: symmetric left rail and right profile; large playable middle. */
.panel.panel-right,.panel{
  top:calc(var(--td42-top) + env(safe-area-inset-top,0px));
  right:max(var(--td42-edge),env(safe-area-inset-right,0px));
  left:auto;
  bottom:calc(var(--td42-bottom) + var(--td42-edge)*2 + env(safe-area-inset-bottom,0px));
  width:min(var(--td42-rail),calc(100vw - 2*var(--td42-edge)));
  max-height:calc(100dvh - var(--td42-top) - var(--td42-bottom) - 3*var(--td42-edge));
}
.rankbox{
  top:calc(var(--td42-top) + env(safe-area-inset-top,0px));
  left:max(var(--td42-edge),env(safe-area-inset-left,0px));
  width:min(var(--td42-rail),calc(100vw - 2*var(--td42-edge)));
  max-height:min(48%,calc((100dvh - var(--td42-top) - var(--td42-bottom) - 4*var(--td42-edge))*0.5));
}
/* Preferred DOM: <div class="left-rail"> <section id="rankbox"> ...</section>
   <section id="side-turn" class="side-turn"> ...#tb-main... </section></div> */
.left-rail{
  position:fixed;z-index:9;
  top:calc(var(--td42-top) + env(safe-area-inset-top,0px));
  bottom:calc(var(--td42-bottom) + var(--td42-edge)*2 + env(safe-area-inset-bottom,0px));
  left:max(var(--td42-edge),env(safe-area-inset-left,0px));
  width:min(var(--td42-rail),calc(100vw - 2*var(--td42-edge)));
  display:flex;flex-direction:column;gap:var(--td42-space);min-height:0;pointer-events:none;
}
.left-rail>.rankbox,.left-rail>.side-turn{position:relative;inset:auto;left:auto;right:auto;top:auto;bottom:auto;width:100%;max-height:none;pointer-events:auto}
.left-rail>.rankbox{flex:0 1 auto;max-height:48%;min-height:48px}
.left-rail>.rankbox.min{flex:0 0 auto;max-height:none}
.side-turn{
  position:fixed;z-index:8;
  top:calc(var(--td42-top) + 240px + env(safe-area-inset-top,0px));
  bottom:calc(var(--td42-bottom) + var(--td42-edge)*2 + env(safe-area-inset-bottom,0px));
  left:max(var(--td42-edge),env(safe-area-inset-left,0px));
  width:min(var(--td42-rail),calc(100vw - 2*var(--td42-edge)));
  min-height:45px;overflow:hidden;display:flex;flex-direction:column;
  border-radius:16px;border:1px solid rgba(235,201,139,.6);
  background:linear-gradient(155deg,rgba(49,66,82,.97),rgba(28,40,54,.97) 46%,rgba(20,31,44,.985));
  box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.22);
  backdrop-filter:blur(12px);
}
.left-rail>.side-turn{flex:1 1 0;min-height:56px}
.side-turn.min,.left-rail>.side-turn.min{flex:0 0 auto;height:auto;min-height:0}
.side-turn.min .side-turn-body{display:none}
.side-turn-header,.side-turn>.rk-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 10px 9px 14px;min-height:45px;border-bottom:1px solid var(--line);
}
.side-turn-header h2{margin:0;font:400 15px 'Russo One',Rubik,sans-serif;color:var(--gold3)}
.side-turn-body{overflow-y:auto;overscroll-behavior:contain;min-height:0;padding:9px 10px 12px;scrollbar-width:thin;display:grid;align-content:start;gap:8px}
.side-turn-body .tb-main,.side-turn-body #tb-main{min-width:0;max-height:none;overflow:visible;padding:0}
.side-turn .btn.wide{min-height:42px;border-radius:10px;font-size:14px}
.side-turn .card,.side-turn .row{min-width:0}
.side-turn .side-turn-shop{width:100%;min-height:36px}
.side-turn .die2d{flex:none}
.side-turn.min .fold svg{transform:rotate(180deg)}
/* Inventory dock is only 170px. The programmer moves stats + mini inventory here. */
.turnbar{
  left:max(var(--td42-edge),env(safe-area-inset-left,0px));
  right:max(var(--td42-edge),env(safe-area-inset-right,0px));
  bottom:calc(var(--td42-edge) + env(safe-area-inset-bottom,0px));
  height:var(--td42-bottom);min-height:0;
  display:flex;flex-direction:column;gap:7px;
  padding:9px 12px 10px;border-radius:14px;overflow:hidden;
}
body.tb-tall{--tbh:var(--td42-bottom)}
body.tb-tall .turnbar{display:flex;grid-template-columns:none}
.turnbar .tb-side,.turnbar #tb-side{
  display:flex;flex-direction:row;gap:9px;min-height:0;overflow:hidden;
  flex:1 1 auto;width:100%;padding:0;border:0;
}
.turnbar .stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:7px;margin:0;flex:0 0 230px;height:100%;min-height:0}
.turnbar .stat{min-height:42px;padding:5px 8px;border-radius:9px}
.turnbar .stat b{font-size:17px;line-height:1.15}
.turnbar .stat span{font-size:10px}
.turnbar .row{gap:6px}
.turnbar .chip{padding:2px 7px;font-size:10px}
.turnbar .side-h{gap:6px;align-items:center;margin:0}
.turnbar .side-h h3{font-size:12px;letter-spacing:.04em}
.turnbar .side-sec{gap:5px;min-height:0;min-width:0;flex:1 1 0}
.turnbar .tb-main{display:none} /* do NOT leave #tb-main inside the dock */
/* Dense collectible inventory; full description on hover/focus via the existing tip. */
.card-sm,.turnbar .gcard{
  flex:0 0 90px;width:90px;height:140px;min-height:140px;max-height:140px;
  gap:3px;padding:4px;border-width:2px;border-radius:9px;box-sizing:border-box;
  box-shadow:0 4px 11px rgba(3,10,20,.38),inset 0 0 0 1px rgba(255,255,255,.6);
}
.turnbar .deck,.inventory-strip{
  display:flex;flex-wrap:nowrap;align-items:stretch;gap:7px;
  width:100%;overflow-x:auto;overflow-y:hidden;padding:2px 1px 5px;
  scroll-snap-type:x proximity;overscroll-behavior-inline:contain;scrollbar-width:thin;
}
.turnbar .deck>.gcard,.inventory-strip>.card-sm{scroll-snap-align:start}
.turnbar .gc-top,.card-sm .gc-top{padding:1px 1px 3px;min-height:0;flex:none}
.turnbar .gc-nm,.card-sm .gc-nm{font-size:9.2px;line-height:1.12;letter-spacing:0;font-family:Rubik,sans-serif;font-weight:800;overflow-wrap:anywhere}
.turnbar .gc-art,.card-sm .gc-art{flex:0 0 auto;aspect-ratio:100/72;max-height:52px;border-radius:6px}
.turnbar .gc-ds,.card-sm .gc-ds{display:none!important}
.turnbar .gc-rar,.card-sm .gc-rar{font-size:8px;margin-top:-8px;padding:1px 5px;letter-spacing:.05em}
.turnbar .gc-foot,.card-sm .gc-foot{margin-top:auto}
.turnbar .gc-foot .btn,.card-sm .gc-foot .btn{min-height:24px;font-size:9px;padding:4px 3px;border-radius:6px}
.turnbar .gc-auto,.card-sm .gc-auto{font-size:9px;padding:3px 0;line-height:1.1}
.turnbar .gc-q,.card-sm .gc-q{font-size:9px;padding:1px 3px}
.turnbar .pager{display:none}
/* V4.2 Barter Shop: separate modal overlay, full collection grid without pager. */
.shop-overlay,.season-overlay{
  position:fixed;z-index:40;inset:0;display:grid;place-items:center;
  padding:20px;background:rgba(6,12,22,.72);backdrop-filter:blur(8px) saturate(.9);
}
.shop-modal,.shop-dialog,.season-modal{
  position:relative;width:min(1020px,100%);max-height:min(760px,calc(100dvh - 40px));
  min-height:0;display:flex;flex-direction:column;overflow:hidden;
  background:linear-gradient(153deg,#35475C 0%,#1F2E41 47%,#111B2A 100%);
  border:1px solid rgba(245,209,147,.7);border-radius:19px;
  box-shadow:0 26px 85px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.25);
}
.shop-modal-header,.season-modal-header{
  display:flex;gap:12px;align-items:center;justify-content:space-between;
  padding:15px 18px;border-bottom:1px solid rgba(244,205,137,.31);
  background:linear-gradient(180deg,rgba(103,122,141,.32),rgba(37,51,68,.12));
}
.shop-modal-title,.season-modal-title{margin:0;font:400 clamp(18px,2.5vw,26px)/1.12 'Russo One',Rubik,sans-serif;color:#FFE5AC}
.shop-balance{display:inline-flex;align-items:center;gap:6px;background:rgba(255,215,137,.1);border:1px solid rgba(255,215,137,.35);padding:5px 10px;border-radius:999px;color:#FFE6B7;font-weight:800;white-space:nowrap}
.shop-close,.season-close{flex:none;width:35px;height:35px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line-strong);background:rgba(24,36,51,.9);color:#FFE2B0;cursor:pointer;font-size:22px}
.shop-close:hover,.season-close:hover{background:#425875}
.shop-scroll,.season-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:17px;scrollbar-width:thin}
.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:13px;align-content:start}
.shop-grid .gcard,.shop-card{width:100%;min-width:0;min-height:260px;height:auto;display:flex;flex-direction:column}
.shop-grid .gc-ds,.shop-card .gc-ds{display:-webkit-box!important;-webkit-line-clamp:6;line-clamp:6}
.shop-grid .gc-art,.shop-card .gc-art{max-height:none;aspect-ratio:100/72}
.shop-grid .pager{display:none!important}
.shop-price,.price-badge{display:inline-flex;align-items:center;justify-content:center;gap:4px;border-radius:8px;padding:3px 8px;font:800 11px Rubik,sans-serif;white-space:nowrap;box-shadow:inset 0 1px 0 rgba(255,255,255,.34)}
.shop-price.common,.price-badge.common{background:linear-gradient(130deg,#FFDF9B,#CFA259);color:#4B3111}
.shop-price.rare,.price-badge.rare{background:linear-gradient(130deg,#D0EAFF,#73A8E7);color:#163F67}
.shop-price.epic,.price-badge.epic{background:linear-gradient(130deg,#F1D5FF,#B88AE7);color:#41236B}
.shop-grid .btn:disabled,.shop-card .btn:disabled{opacity:.46;filter:grayscale(.6);cursor:not-allowed;box-shadow:none}
/* Award summary button at center-top, separated from brand/navigation. */
.season-toggle{
  position:fixed;z-index:11;top:calc(16px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);
  display:inline-flex;align-items:center;gap:8px;justify-content:center;min-height:40px;
  padding:8px 18px;border-radius:999px;
  font:400 13px/1.2 'Russo One',Rubik,sans-serif;letter-spacing:.03em;color:#FFE9C4;
  background:linear-gradient(150deg,#6B542F,#34445A 45%,#1D3047);
  border:1px solid #E9BB74;box-shadow:0 5px 25px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.24);
  cursor:pointer;white-space:nowrap;
}
.season-toggle:hover,.season-toggle:focus-visible{border-color:#FFE5A3;box-shadow:0 0 20px rgba(255,205,114,.28),0 7px 30px rgba(0,0,0,.4)}
.season-modal{width:min(790px,100%)}
.season-podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;align-items:end;gap:12px;margin:12px auto 24px;max-width:635px;min-height:282px}
.season-place{min-width:0;display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;color:#FFF2D7}
.season-place .season-player{min-height:26px;display:flex;align-items:center;justify-content:center;gap:6px;font-weight:800;font-size:13px}
.season-player .dot{flex:none;width:10px;height:10px;border-radius:50%;border:1px solid #fff8}
.season-place .season-award{height:50px;display:flex;align-items:center;justify-content:center;gap:5px;font-size:14px;font-weight:800}
.season-award svg{width:46px;height:46px;filter:drop-shadow(0 5px 7px rgba(0,0,0,.35))}
.season-place .season-empty{color:#BCC8D3;font-weight:700}
.season-pedestal{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px solid rgba(255,255,255,.34);border-bottom:4px solid rgba(0,0,0,.3);border-radius:12px 12px 5px 5px;box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 12px 24px rgba(0,0,0,.26)}
.season-place.place-1{order:2}.season-place.place-2{order:1}.season-place.place-3{order:3}
.place-1 .season-pedestal{height:138px;background:linear-gradient(155deg,#FBE4A0,#B98134);color:#463017}
.place-2 .season-pedestal{height:99px;background:linear-gradient(155deg,#ECF1F5,#879BAB);color:#283B4B}
.place-3 .season-pedestal{height:73px;background:linear-gradient(155deg,#E6B07C,#97613F);color:#442717}
.season-pedestal .season-rank{font:400 34px 'Russo One',Rubik,sans-serif;text-shadow:0 1px 0 #fff8}
.season-rewards-list{display:grid;gap:7px;max-width:635px;margin:auto}
.season-reward-row{display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:10px;border-radius:10px;border:1px solid rgba(245,203,139,.23);background:rgba(10,18,30,.36);padding:8px 11px}
.season-reward-row .season-place-num{font-weight:800;color:var(--gold2)}
.season-reward-row .season-award-name{font-size:13px}
.season-reward-admin{display:grid;grid-template-columns:90px minmax(160px,1fr) 85px minmax(100px,1fr) auto;align-items:end;gap:9px;padding:12px;border-radius:13px;background:rgba(14,24,38,.4);border:1px solid rgba(245,204,139,.28)}
.season-reward-admin>.field{min-width:0}
.season-reward-admin .btn{min-height:36px}
/* Mobile: left rail above bottom dock, profile can fold, no overlap with prize button. */
@media (max-width:1000px){
  :root{--td42-rail:276px}
  .shop-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
}
@media (max-width:700px){
  :root{--td42-rail:min(calc(100vw - 16px),330px);--td42-edge:8px;--td42-bottom:172px;--td42-top:122px}
  .top{max-width:calc(100vw - 16px)}
  .season-toggle{top:calc(76px + env(safe-area-inset-top,0px));min-height:32px;font-size:11px;padding:6px 12px}
  .left-rail{top:calc(var(--td42-top) + env(safe-area-inset-top,0px));bottom:calc(var(--td42-bottom) + var(--td42-edge)*2 + env(safe-area-inset-bottom,0px));left:8px;width:calc(100vw - 16px);gap:7px}
  .left-rail>.rankbox{max-height:40%}
  .left-rail>.side-turn{min-height:0}
  .rankbox{top:calc(var(--td42-top) + env(safe-area-inset-top,0px));max-height:26vh;left:8px;width:calc(100vw - 16px)}
  .side-turn{top:calc(var(--td42-top) + 120px + env(safe-area-inset-top,0px));left:8px;width:calc(100vw - 16px);bottom:calc(var(--td42-bottom) + var(--td42-edge)*2 + env(safe-area-inset-bottom,0px))}
  .panel,.panel.panel-right{top:calc(var(--td42-top) + env(safe-area-inset-top,0px));bottom:calc(var(--td42-bottom) + var(--td42-edge)*2 + env(safe-area-inset-bottom,0px));right:8px;left:8px;width:auto;max-height:none}
  .panel.min{height:auto;min-height:0;bottom:auto;left:auto;right:8px;top:calc(var(--td42-top) + env(safe-area-inset-top,0px));width:min(240px,calc(100vw - 16px))}
  .turnbar{left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));padding:7px 8px}
  .turnbar .stats{gap:4px;flex-basis:144px}
  .turnbar .stat{padding:4px;min-height:42px}
  .turnbar .stat b{font-size:13px}
  .turnbar .stat span{font-size:9px}
  .turnbar .gcard,.card-sm{flex-basis:86px;width:86px;height:136px;min-height:136px;max-height:136px}
  .shop-overlay,.season-overlay{padding:8px}
  .shop-modal,.season-modal{max-height:calc(100dvh - 16px);border-radius:14px}
  .shop-modal-header,.season-modal-header{padding:12px}
  .shop-scroll,.season-scroll{padding:10px}
  .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .shop-grid .gcard{min-height:238px}
  .season-podium{gap:5px;min-height:230px;margin:8px auto 20px}
  .season-place .season-award{height:40px}
  .season-award svg{width:36px;height:36px}
  .season-place .season-player{font-size:10px;min-height:22px}
  .place-1 .season-pedestal{height:112px}.place-2 .season-pedestal{height:85px}.place-3 .season-pedestal{height:65px}
  .season-reward-admin{grid-template-columns:repeat(2,minmax(0,1fr))}
  .season-reward-admin .btn{grid-column:1/-1}
}
@media (prefers-reduced-motion:reduce){
 .season-toggle,.shop-card,.side-turn,.season-place{transition:none!important}
}

/* V4.2 final compact-fit corrections */
.panel.min,.panel.panel-right.min{bottom:auto;height:auto;max-height:none;min-height:0}
.turnbar .side-h{display:none} /* avoid clipping 140px cards in 170px dock */
.turnbar .side-sec{gap:0}
.mobile-profile-open{display:none}
@media (max-width:700px){
  .left-rail>.rankbox,.rankbox,body:not(.panel-min) .rankbox{display:flex}
  .season-toggle{top:calc(16px + env(safe-area-inset-top,0px));left:auto;right:8px;transform:none}
  .mobile-profile-open{display:inline-flex}
  .panel.min,.panel.panel-right.min{display:none} /* separate mobile open button is required */
  .panel:not(.min){z-index:13;box-shadow:0 0 0 100vmax rgba(4,9,18,.5),var(--shadow)}
  body:has(.panel:not(.min)) .left-rail{visibility:hidden}
}
.pill.ultra{background:#E8892B}
.shop-overlay[hidden],.season-overlay[hidden]{display:none!important}
.season-toggle .ico{width:20px;height:20px}
.shop-grid .gc-foot{display:flex;align-items:center;justify-content:space-between;gap:6px}
/* V4.2 программист: кнопки хода всегда видны внизу блока «Ход по полю» */
.side-turn .turn-actions{position:sticky;bottom:-12px;z-index:2;display:grid;gap:6px;margin:0 -10px -12px;padding:10px 10px 12px;background:linear-gradient(to top,rgba(21,32,45,.99) 72%,rgba(21,32,45,0))}
.side-turn .turn-actions .side-turn-shop{min-height:34px}
.season-toggle{left:max(50%,700px)}
@media (max-width:700px){.season-toggle{left:auto}}
/* Сессия / проверка заявки: форма с достижениями — левая колонка шире, рейтинг ниже */
body.tb-tall .left-rail{width:min(520px,calc(100vw - 2*var(--td42-edge)))}
body.tb-tall .left-rail>.rankbox{max-height:30%}