/* Layout: sticky ciemny pasek z przełącznikiem widoków i zakładkami, pod nim treść do 940px; widok gracza zaczyna się od jego dywizji (zadanie, strefa, mecze z terminami, tabela, aktualności). */
:root{--bg:#14100c;--surf:#1d1711;--surf2:#271f17;--line:#3b3025;--tx:#f3ebdc;--mu:#a99b85;--acc:#c9a468;--acc-d:#8c6c3f;--hot:#ffb547;--ok:#7bc47f;--warn:#e7b04a;--bad:#ef7b6c;--on-acc:#1a130b;--on-st:#14110d;--pat:rgba(201,164,104,.07);--zup:rgba(123,196,127,.07);--zdown:rgba(239,123,108,.07);--me:rgba(201,164,104,.14);--glow0:rgba(255,181,71,0);--glow1:rgba(255,181,71,.16);--ban1:rgba(255,181,71,.16);--ban2:rgba(255,181,71,.03);--zup2:rgba(123,196,127,.16);--zdown2:rgba(239,123,108,.16);--scrim:rgba(10,7,4,.78);--shadow:0 6px 20px rgba(0,0,0,.45);--r:14px;--fd:'Barlow Condensed','Arial Narrow',Arial,sans-serif;--fb:'Quicksand',system-ui,-apple-system,'Segoe UI',sans-serif;color-scheme:dark}
:root[data-theme="dark"]{--bg:#14100c;--surf:#1d1711;--surf2:#271f17;--line:#3b3025;--tx:#f3ebdc;--mu:#a99b85;--acc:#c9a468;--acc-d:#8c6c3f;--hot:#ffb547;--ok:#7bc47f;--warn:#e7b04a;--bad:#ef7b6c;--on-acc:#1a130b;--on-st:#14110d;--pat:rgba(201,164,104,.07);--zup:rgba(123,196,127,.07);--zdown:rgba(239,123,108,.07);--me:rgba(201,164,104,.14);--glow0:rgba(255,181,71,0);--glow1:rgba(255,181,71,.16);--ban1:rgba(255,181,71,.16);--ban2:rgba(255,181,71,.03);--zup2:rgba(123,196,127,.16);--zdown2:rgba(239,123,108,.16);--scrim:rgba(10,7,4,.78);--shadow:0 6px 20px rgba(0,0,0,.45);color-scheme:dark}
:root[data-theme="light"]{--bg:#f7f3ec;--surf:#ffffff;--surf2:#efe8da;--line:#ddd1bd;--tx:#2a2118;--mu:#76674f;--acc:#8c6c3f;--acc-d:#b39a72;--hot:#c26f00;--ok:#2f7d33;--warn:#9a6208;--bad:#c0392b;--on-acc:#ffffff;--on-st:#ffffff;--pat:rgba(140,108,63,.09);--zup:rgba(47,125,51,.08);--zdown:rgba(192,57,43,.08);--me:rgba(140,108,63,.14);--glow0:rgba(194,111,0,0);--glow1:rgba(194,111,0,.18);--ban1:rgba(194,111,0,.14);--ban2:rgba(194,111,0,.03);--zup2:rgba(47,125,51,.14);--zdown2:rgba(192,57,43,.14);--scrim:rgba(40,30,20,.55);--shadow:0 6px 20px rgba(60,40,20,.18);color-scheme:light}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--tx);font:500 15px/1.5 var(--fb);padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:0 56px}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--surf)}
.wrap{max-width:940px;margin:0 auto}
button,input,select,textarea{font:inherit;color:inherit}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;margin:0 calc(-1*max(16px,env(safe-area-inset-left,0px))) 0 calc(-1*max(16px,env(safe-area-inset-left,0px)));padding:12px max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px));background-color:var(--surf);background-image:repeating-linear-gradient(45deg,var(--pat) 0 1px,transparent 1px 26px),repeating-linear-gradient(-45deg,var(--pat) 0 1px,transparent 1px 26px);border-bottom:1px solid var(--line)}
.bar1{display:flex;gap:12px 20px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.brand{display:flex;gap:12px;align-items:center;min-width:0}
.brand b{display:block;font:700 26px/1 var(--fd);letter-spacing:.06em}
.brand small{display:block;color:var(--acc);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.logo{width:44px;height:44px;border-radius:10px;background:#8c6c3f;display:grid;place-items:center;flex:none;transition:transform .4s}
.brand:hover .logo{transform:rotate(-12deg) scale(1.06)}
.swrap{display:flex;align-items:center;gap:8px}
.swrap>span{color:var(--mu);font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.seg{display:flex;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px;gap:2px}
.seg button{border:0;background:none;padding:7px 14px;border-radius:999px;cursor:pointer;color:var(--mu);font-weight:700;font-size:13px;transition:background .2s,color .2s}
.seg button[aria-pressed=true]{background:var(--acc);color:var(--on-acc)}
.asrow{display:flex;gap:10px;align-items:center;margin-top:10px;flex-wrap:wrap}
.asrow label{color:var(--mu);font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.tabs{display:flex;gap:2px;margin-top:10px;overflow-x:auto;scrollbar-width:none}
.tabs button{border:0;background:none;padding:10px 14px;cursor:pointer;color:var(--mu);font:700 17px/1 var(--fd);letter-spacing:.07em;text-transform:uppercase;border-bottom:3px solid transparent;white-space:nowrap;transition:color .2s}
.tabs button:hover{color:var(--tx)}
.tabs button[aria-selected=true]{color:var(--tx);border-bottom-color:var(--hot)}
.demo{margin:14px 0 0;padding:8px 14px;border:1px dashed var(--acc-d);border-radius:10px;color:var(--mu);font-size:13px}
.view{padding-top:14px;display:grid;gap:14px}
.view>*{animation:rise .42s both}
.view>*:nth-child(2){animation-delay:.06s}.view>*:nth-child(3){animation-delay:.12s}.view>*:nth-child(4){animation-delay:.18s}.view>*:nth-child(n+5){animation-delay:.24s}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes grow{from{width:0}}
@keyframes ringin{from{stroke-dashoffset:327}}
@keyframes glow{0%,100%{box-shadow:0 0 0 0 var(--glow0)}50%{box-shadow:0 0 0 7px var(--glow1)}}
.card{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:18px;min-width:0}
.card.flat{background:transparent}
.card.lift{transition:transform .2s,border-color .2s}.card.lift:hover{transform:translateY(-2px);border-color:var(--acc-d)}
h2{margin:0 0 12px;font:700 22px/1.1 var(--fd);letter-spacing:.06em;text-transform:uppercase}
h3{margin:0 0 6px;font:700 18px/1.2 var(--fb)}
.mu{color:var(--mu)}.sm{font-size:13px}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.tiles{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}
.tile{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px 14px;transition:transform .2s}
.tile:hover{transform:translateY(-2px)}
.tile b{display:block;font:700 40px/1 var(--fd);font-variant-numeric:tabular-nums}
.tile span{color:var(--mu);font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.btn{border:0;border-radius:10px;padding:8px 14px;background:var(--acc);color:var(--on-acc);font-weight:700;cursor:pointer;text-decoration:none;display:inline-block;font-size:14px;transition:transform .12s,background .12s}
.btn:hover{background:var(--hot);transform:translateY(-1px)}
.btn.g{background:transparent;color:var(--tx);border:1px solid var(--line)}
.btn.g:hover{border-color:var(--acc);background:transparent}
.btn.bad{background:var(--bad)}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.btn.sm{padding:5px 10px;font-size:13px}
:focus-visible{outline:2px solid var(--hot);outline-offset:2px}
input,select,textarea{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;min-width:0;max-width:100%}
textarea{width:100%;resize:vertical}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sp{justify-content:space-between}
.fx{padding:12px 0;border-bottom:1px solid var(--line)}.fx:last-child{border-bottom:0}
.who{display:flex;gap:12px;align-items:center;min-width:0}
.who>div{min-width:0}
.link{background:none;border:0;padding:0;color:var(--tx);font-weight:700;cursor:pointer;text-align:left}
.link:hover{color:var(--hot)}
.av{border-radius:50%;object-fit:cover;display:grid;place-items:center;font:700 16px/1 var(--fd);flex:none;letter-spacing:.04em}
.crown{width:16px;height:16px;color:var(--hot);vertical-align:-2px;margin-left:4px;animation:glint 2.8s ease-in-out infinite}
@keyframes glint{0%,100%{filter:drop-shadow(0 0 0 transparent)}50%{filter:drop-shadow(0 0 7px var(--hot))}}
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid var(--line);color:var(--mu);white-space:nowrap}
.pill.ok{color:var(--ok);border-color:var(--ok)}.pill.warn{color:var(--warn);border-color:var(--warn)}.pill.bad{color:var(--bad);border-color:var(--bad)}.pill.hot{color:var(--on-acc);background:var(--hot);border-color:var(--hot)}
.ok{color:var(--ok)}.warn{color:var(--warn)}.bad{color:var(--bad)}
.scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th,td{padding:10px 8px;text-align:center;border-bottom:1px solid var(--line);white-space:nowrap;font-variant-numeric:tabular-nums}
th{color:var(--mu);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
th:nth-child(2),td:nth-child(2){text-align:left}
tbody tr{animation:rise .45s both;animation-delay:calc(var(--i,0)*45ms)}
td.pos{font:700 22px/1 var(--fd);color:var(--mu)}
tr.first td.pos{color:var(--hot)}
tr.zup{background:var(--zup)}tr.zdown{background:var(--zdown)}
tr.me{background:var(--me)}
td.pts{font:700 22px/1 var(--fd)}
.bar{height:8px;background:var(--bg);border-radius:99px;overflow:hidden;border:1px solid var(--line)}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc-d),var(--hot));border-radius:99px;animation:grow 1s cubic-bezier(.2,.8,.2,1) both}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:none;border-radius:999px;padding:5px 12px;cursor:pointer;color:var(--mu);font-weight:700;font-size:13px;transition:background .15s,color .15s}
.chip:hover{color:var(--tx)}
.chip[aria-pressed=true]{background:var(--acc);color:var(--on-acc);border-color:var(--acc)}
.form{display:grid;gap:6px;margin-top:10px;padding:14px;background:var(--bg);border:1px solid var(--line);border-radius:12px;animation:rise .25s both}
.sets{display:grid;grid-template-columns:auto 70px auto 70px;gap:8px;align-items:center}
.sets input{text-align:center;width:70px}
.err{color:var(--bad);font-size:13px;min-height:1em}
.form2{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.field{display:grid;gap:4px}
.field label{color:var(--mu);font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
.lv{display:grid;gap:8px}
.lv button{text-align:left;border:1px solid var(--line);background:var(--bg);border-radius:10px;padding:9px 12px;cursor:pointer;transition:border-color .15s}
.lv button:hover{border-color:var(--acc-d)}
.lv button[aria-pressed=true]{border-color:var(--hot);background:var(--surf2)}
.lv b{font-family:var(--fd);font-size:18px;letter-spacing:.05em}
.modal{position:fixed;inset:0;z-index:50;background:var(--scrim);display:grid;place-items:center;padding:16px;overflow:auto}
.modal .card{width:min(620px,100%);max-height:92vh;overflow:auto;animation:rise .25s both}
.form-chip{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:6px;font:700 14px/1 var(--fd)}
.form-chip.W{background:var(--ok);color:var(--on-st)}.form-chip.L{background:var(--bad);color:var(--on-st)}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--acc);color:var(--on-acc);padding:9px 18px;border-radius:999px;font-weight:700;z-index:60;animation:rise .25s both}
textarea.csv{height:200px;font:12px/1.4 ui-monospace,Menlo,Consolas,monospace;white-space:pre}
.qr{background:#fff;padding:10px;border-radius:12px;width:min(190px,100%);flex:none}
.qr svg{display:block;width:100%;height:auto}
.perm td:not(:first-child),.perm th:not(:first-child){text-align:center}
.perm td:first-child,.perm th:first-child{text-align:left;white-space:normal}
.perm th:nth-child(2),.perm td:nth-child(2){text-align:center}
.big{font:700 54px/1 var(--fd);color:var(--hot);font-variant-numeric:tabular-nums}
.banner{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:16px 18px;border-radius:var(--r);border:1px solid var(--hot);background:linear-gradient(100deg,var(--ban1),var(--ban2));animation:rise .42s both,glow 2.6s ease-in-out infinite .6s}
.banner.calm{border-color:var(--line);background:var(--surf);animation:rise .42s both}
.banner b{font:700 22px/1.15 var(--fd);letter-spacing:.04em;text-transform:uppercase;display:block}
.slogan{font:700 26px/1.15 var(--fd);letter-spacing:.03em;margin:14px 0 0;color:var(--acc)}
.steps{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));margin:10px 0}
.steps div{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px}
.steps b{font:700 26px/1 var(--fd);color:var(--hot);display:block}
.ringbox{display:flex;gap:16px;align-items:center}
.ring{width:112px;height:112px;flex:none}
.ring circle{fill:none;stroke-width:10}
.ring .bg{stroke:var(--line)}
.ring .fg{stroke:var(--hot);stroke-linecap:round;stroke-dasharray:327;transform:rotate(-90deg);transform-origin:60px 60px;animation:ringin 1.2s cubic-bezier(.2,.8,.2,1) both}
.ring text{fill:var(--tx);font:700 30px var(--fd);text-anchor:middle;dominant-baseline:central}
.zone{display:inline-block;padding:3px 10px;border-radius:999px;font-weight:700;font-size:13px}
.zone.up{background:var(--zup2);color:var(--ok)}.zone.down{background:var(--zdown2);color:var(--bad)}.zone.mid{background:var(--bg);color:var(--mu);border:1px solid var(--line)}
.award{display:flex;gap:12px;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px}
.award small{display:block;color:var(--acc);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700}
.award b{font:700 28px/1 var(--fd);margin-left:auto;color:var(--hot);font-variant-numeric:tabular-nums}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:70;overflow:hidden}
.confetti i{position:absolute;top:-16px;left:calc(var(--x)*1%);width:8px;height:14px;background:var(--c);transform:rotate(var(--r));animation:fall 1.6s ease-in forwards;animation-delay:var(--d)}
@keyframes fall{to{transform:translateY(112vh) rotate(560deg)}}
.chat{margin-top:10px;border:1px solid var(--line);border-radius:12px;background:var(--bg);overflow:hidden;animation:rise .25s both}
.chathead{padding:10px 12px;border-bottom:1px solid var(--line)}
.chatlog{max-height:300px;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}
.cmsg{max-width:84%;padding:8px 12px;border-radius:14px;font-size:14px;line-height:1.4;animation:rise .25s both;overflow-wrap:anywhere}
.cmsg small{display:block;font-size:11px;opacity:.75;margin-top:2px}
.cmsg.me{align-self:flex-end;background:var(--acc);color:var(--on-acc);border-bottom-right-radius:4px}
.cmsg.them{align-self:flex-start;background:var(--surf2);border-bottom-left-radius:4px}
.cmsg.staff{align-self:center;background:var(--surf);border:1px dashed var(--acc-d)}
.cmsg.sys{align-self:center;max-width:100%;background:none;color:var(--mu);font-size:12px;text-align:center}
.cmsg.prop{background:var(--surf);border:1px solid var(--hot);max-width:92%;border-radius:12px;color:var(--tx)}
.cmsg.prop.me2{align-self:flex-end}.cmsg.prop.them2{align-self:flex-start}
.quick{padding:10px 12px;border-top:1px solid var(--line);display:grid;gap:6px}
.quick.row{display:flex}
.chat .chip{text-align:left;white-space:normal}
.chatin{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line)}.chatin input{flex:1}
.badge{display:inline-block;background:var(--hot);color:var(--on-acc);border-radius:999px;font:700 12px/1 var(--fb);padding:3px 7px;margin-left:6px}
.lnk{background:none;border:0;padding:0;color:inherit;font:inherit;text-decoration:underline;cursor:pointer;opacity:.85}.lnk:hover{opacity:1}
.ch{width:100%;max-width:560px;height:auto;display:block;margin:6px auto 0}
.lg{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--mu);margin:4px 0 6px}.lg i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.cb{margin:10px 0}.cl{font-size:13px;color:var(--mu);margin-bottom:3px}.ct{display:flex;align-items:center;gap:8px;margin:3px 0;height:18px}
.ct i{display:block;height:12px;border-radius:0 6px 6px 0;min-width:2px}.ct b{font-size:13px;font-variant-numeric:tabular-nums}
.seg{display:flex;gap:2px;height:30px}.seg i{display:grid;place-items:center;min-width:26px;border-radius:6px}.seg b{font-size:13px;color:var(--on-st)}
.heat{display:grid;grid-template-columns:44px repeat(4,1fr);gap:3px;max-width:420px;align-items:center}.heat small{color:var(--mu);font-size:11px;text-align:center}
.heat div{height:30px;border:1px solid var(--line);border-radius:6px;display:grid;place-items:center;font-size:13px;font-weight:700}
table.tb{width:100%;border-collapse:collapse;font-size:14px}.tb th{text-align:left;color:var(--mu);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:6px 8px;border-bottom:1px solid var(--line)}
.tb td{padding:8px;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
.mb{display:flex;align-items:center;gap:8px;min-width:110px}.mb i{display:block;height:10px;border-radius:0 5px 5px 0;background:var(--hot)}.mb b{font-variant-numeric:tabular-nums}
.rb{display:flex;gap:10px;align-items:flex-end;margin-top:6px}.rb>div{flex:1;text-align:center;max-width:70px}.rb b{display:block;font-size:12px}.rb small{color:var(--mu)}
.rbar{height:90px;background:var(--line);border-radius:6px;display:flex;align-items:flex-end;overflow:hidden}.rbar i{display:block;width:100%;background:var(--hot);border-radius:6px 6px 0 0}
.pst .card{background:var(--bg);margin-top:12px}
.fns{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.fn{display:flex;flex-direction:column;gap:3px;text-align:left;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px;color:var(--tx);cursor:pointer;text-decoration:none;transition:border-color .15s,transform .15s}
.fn:hover{border-color:var(--acc-d);transform:translateY(-2px)}
.fn b{font:700 17px/1.2 var(--fd);letter-spacing:.05em;text-transform:uppercase}.fn span{color:var(--mu);font-size:13px}
.step{display:flex;gap:14px;align-items:flex-start}
.step>b{flex:none;width:38px;height:38px;border-radius:50%;background:var(--hot);color:var(--on-acc);display:grid;place-items:center;font:700 20px/1 var(--fd)}
.q{width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:14px 4px;font-weight:700;cursor:pointer;display:flex;justify-content:space-between;gap:10px;color:var(--tx)}
.qa{padding:10px 4px 14px;color:var(--mu)}
.court{width:100%;max-width:300px;height:auto;display:block;margin:8px auto;color:var(--tx)}
ul.rl{margin:6px 0 0;padding-left:20px}ul.rl li{margin:5px 0}
.pipe{display:flex;gap:4px;margin-top:10px;flex-wrap:wrap}
.pipe i{font-style:normal;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;border:1px solid var(--line);color:var(--mu)}
.pipe i.d{color:var(--ok);border-color:var(--ok)}.pipe i.c{background:var(--hot);color:var(--on-acc);border-color:var(--hot)}.pipe i.w{background:var(--bad);color:var(--on-st);border-color:var(--bad)}
.pnext{margin-top:6px;color:var(--tx)}
.tip{position:fixed;z-index:80;max-width:260px;background:var(--surf2);border:1px solid var(--acc-d);color:var(--tx);padding:7px 10px;border-radius:8px;font-size:13px;line-height:1.35;pointer-events:none;box-shadow:var(--shadow);display:none;animation:rise .15s both}
.iconbtn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--tx);display:grid;place-items:center;cursor:pointer;flex:none;transition:transform .3s,border-color .2s}
.iconbtn:hover{border-color:var(--acc);transform:rotate(25deg)}
@media (max-width:520px){.brand b{font-size:22px}.seg button{padding:6px 10px}.tile b{font-size:34px}.swrap>span{display:none}}
.ti{display:none}
.usr{display:flex;flex-direction:column;line-height:1.15;min-width:0;max-width:170px}
.usr b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.usr small{color:var(--acc);font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.loginc{max-width:480px;width:100%;margin-inline:auto}
html{-webkit-text-size-adjust:100%}
button,.btn,.chip,.link,.tabs button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
@media (max-width:720px){
 body{padding-block:0 calc(84px + env(safe-area-inset-bottom,0px))}
 .top{padding-top:8px;position:relative}
 .bar1{gap:8px}
 .brand small{display:none}.brand b{font-size:20px}.logo{width:36px;height:36px}
 .swrap{gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:100%}
 .usr{max-width:120px}
 .seg button{padding:7px 10px;font-size:12px}
 .tabs{position:fixed;left:0;right:0;bottom:0;z-index:40;margin:0;padding:4px 4px calc(4px + env(safe-area-inset-bottom,0px));background:var(--surf);border-top:1px solid var(--line);gap:0;box-shadow:0 -6px 20px rgba(0,0,0,.22)}
 .tabs button{flex:1 0 68px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 4px 5px;font:700 11px/1.1 var(--fb);letter-spacing:.02em;text-transform:none;border-bottom:0;border-radius:10px;position:relative}
 .tabs button[aria-selected=true]{background:var(--surf2);color:var(--hot)}
 .ti{display:block}
 .tabs .badge{position:absolute;top:2px;right:calc(50% - 26px);margin:0}
 .view{padding-top:10px;gap:12px}
 .card{padding:14px}
 h2{font-size:20px}
 .btn{min-height:44px;padding:10px 16px;display:inline-flex;align-items:center;justify-content:center}
 .btn.sm{min-height:40px;padding:8px 12px}
 .iconbtn{width:40px;height:40px}
 .chip{min-height:38px;padding:7px 13px}
 input,select,textarea{font-size:16px;padding:11px 12px;min-height:44px}
 input[type=checkbox]{min-height:0;width:22px;height:22px;flex:none}
 .sets{grid-template-columns:auto 1fr auto 1fr}.sets input{width:100%}
 .banner{padding:14px}.banner .btn{width:100%}
 .banner b{font-size:20px}
 .big{font-size:44px}
 .slogan{font-size:22px}
 .tile b{font-size:32px}
 .demo{font-size:12px;padding:6px 10px}
 th,td{padding:9px 6px}
 .modal{align-items:end;padding:0}
 .modal .card{width:100%;max-height:88vh;border-radius:18px 18px 0 0;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
 .chatlog{max-height:46vh}
 .cmsg{max-width:90%}
 .quick .chips{display:grid}.chat .chip{width:100%;border-radius:12px;white-space:normal;text-align:left}
 .toast{bottom:calc(92px + env(safe-area-inset-bottom,0px));max-width:calc(100vw - 24px);text-align:center}
 .row>.btn:not(.sm){flex:1 1 auto}
 .ringbox{flex-wrap:wrap}
}
@media (hover:none){.btn:hover,.card.lift:hover,.tile:hover,.brand:hover .logo{transform:none}.btn:hover{background:var(--acc)}.btn.g:hover{background:transparent;border-color:var(--line)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
