/* SportBank platform extensions (layout helpers, forms, tables, admin) – built on app.css tokens */
.sbwrap{position:relative;z-index:10;flex:1;width:100%;max-width:1200px;margin:0 auto;padding:16px 16px 110px;display:flex;flex-direction:column;gap:20px}
.sbwrap.admin{max-width:1320px}
@media(min-width:640px){.sbwrap{padding-left:24px;padding-right:24px}}@media(min-width:768px){.sbwrap{padding-bottom:48px}}
.muted{color:var(--mut)}.sm{font-size:13px}.xs{font-size:12px}.b{font-weight:800}.center{text-align:center}.right{text-align:right}.nowrap{white-space:nowrap}
.h2{font-size:22px;font-weight:800;letter-spacing:-.01em}.h3{font-size:17px;font-weight:800}.lead{font-size:14px;color:var(--mut)}
.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.col{display:flex;flex-direction:column;gap:14px}.sp{flex:1}.mt{margin-top:14px}.mt2{margin-top:22px}.mb{margin-bottom:14px}
.g2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.g3{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.g12{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:1024px){.g12{grid-template-columns:5fr 7fr}.g12.eq{grid-template-columns:1fr 1fr}}
.narrow{max-width:760px;margin:0 auto;width:100%}.narrow.s{max-width:460px}
.alert{padding:12px 16px;border-radius:14px;font-size:14px;font-weight:700}.alert.ok{background:rgba(11,122,75,.16);color:var(--green)}.alert.err{background:rgba(217,54,42,.14);color:var(--red)}
.hbtn{padding:9px 16px;border-radius:999px;font-weight:800;font-size:13px;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.12)}.hbtn.lime{background:#C5F82A;color:#062e1c;border-color:#C5F82A}
.navpills a{display:inline-block}.sbwrap.admin .navpills{flex-wrap:wrap;border-radius:22px;max-width:760px;justify-content:flex-end}
.admscroll{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}.admscroll a{white-space:nowrap;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.12);color:#fff;font-weight:700;font-size:13px}.admscroll a.on{background:#C5F82A;color:#062e1c}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:12px 20px;border-radius:16px;background:#0b7a4b;color:#fff;font-weight:800;font-size:14px;border:0;cursor:pointer;text-decoration:none;transition:.15s}.btn:hover{background:#09643d}.btn.sm{padding:8px 14px;font-size:12.5px;border-radius:12px}.btn.block{width:100%}.btn.lime{background:#C5F82A;color:#062e1c}.btn.ghost{background:var(--soft);color:var(--ink)}.btn.danger{background:rgba(217,54,42,.14);color:var(--red)}.btn.ok{background:rgba(11,122,75,.16);color:var(--green)}.btn[disabled]{opacity:.55;cursor:not-allowed}
.field{display:block}.field>label,.lbl{display:block;font-size:12px;font-weight:800;color:var(--mut);margin-bottom:5px}.field input,.field select,.field textarea{width:100%}textarea.sb-input{height:auto;padding:12px 14px;min-height:96px}select.sb-input{appearance:auto}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:560px){.two{grid-template-columns:1fr}}
.check{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700}.check input{width:auto}
.hint{font-size:12.5px;color:var(--mut)}
.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 11px;border-radius:999px;font-size:11.5px;font-weight:800;background:var(--soft);color:var(--mut)}.pill.good{background:rgba(11,122,75,.16);color:var(--green)}.pill.warn{background:rgba(245,166,35,.18);color:#c98a0c}.pill.bad{background:rgba(217,54,42,.14);color:var(--red)}
.tabs{display:inline-flex;flex-wrap:wrap;gap:4px;background:var(--soft);padding:5px;border-radius:18px;border:1px solid var(--line)}.tabs a{padding:8px 14px;border-radius:13px;font-size:13px;font-weight:800;color:var(--mut)}.tabs a.on{background:var(--card);color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.12)}
.tblwrap{overflow-x:auto;border-radius:18px}.tbl{width:100%;border-collapse:collapse;font-size:13.5px;background:var(--card)}.tbl th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);padding:11px 14px;border-bottom:1px solid var(--line);white-space:nowrap}.tbl td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:middle}.tbl tr:last-child td{border-bottom:0}.tbl .num{text-align:right;font-variant-numeric:tabular-nums}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.kpi{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px}.kpi .l{font-size:12px;font-weight:800;color:var(--mut)}.kpi .v{font-size:24px;font-weight:800;margin-top:4px}
.chartbox{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px}.chartbox svg{width:100%;height:auto}.chartbox text{font-size:11px;fill:var(--mut);font-family:inherit}.chartbox .bar{fill:var(--green)}.chartbox .gl{stroke:var(--line)}
.divide>*+*{border-top:1px solid var(--line)}.li{display:flex;align-items:center;gap:12px;padding:12px 0}
.cardx{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:20px;box-shadow:var(--sh)}
.hero{border-radius:26px;padding:24px;color:#fff;background:linear-gradient(135deg,#0E1B12,#173B25)}.hero h2{font-size:24px;font-weight:800}.hero p{color:#d6eee2;font-size:13.5px;margin-top:6px}
.qrbox{background:#fff;border-radius:18px;padding:6px;line-height:0}
.passcode{font-size:28px;font-weight:800;letter-spacing:.18em;color:var(--green)}
.steps .dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;background:var(--line)}.steps .dot.ok{background:var(--lime);color:#0B1405}
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px;background:radial-gradient(700px 420px at 15% 10%,rgba(197,248,42,.14),transparent 60%),var(--bg)}.auth .box{width:100%;max-width:440px}
.notif{border-left:4px solid var(--line)}.notif.un{border-left-color:var(--lime)}
.tg{display:inline-block}
img.thumb{width:56px;height:56px;border-radius:12px;object-fit:cover;background:var(--soft)}
footer.sbfoot{text-align:center;color:var(--mut);font-size:12.5px;padding:10px 0 0}footer.sbfoot a{text-decoration:underline}
.sep{height:1px;background:var(--line);margin:6px 0}
.likebtn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--soft);font-weight:800;font-size:13px;color:var(--mut)}.likebtn.on{color:var(--red)}.likebtn.on svg{fill:currentColor}
/* header, nav, dock, balance, toast */
.hdr{display:flex;align-items:center;justify-content:space-between;gap:12px}.logo{display:flex;align-items:center;gap:10px}.logo-wm{font-size:24px;line-height:1;color:#fff}.logo-wm.dk{color:#07382a}
.hicon{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.1);color:#fff;display:inline-flex;align-items:center;justify-content:center;position:relative;cursor:pointer;transition:.15s}.hicon:hover{background:rgba(255,255,255,.2)}.hicon:active{transform:scale(.95)}
.ndot{position:absolute;top:2px;right:3px;width:12px;height:12px;border-radius:50%;background:#ff4b4b;box-shadow:0 0 0 2px #07382a}
.rolebadge{display:none;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:4px 11px;border-radius:999px;background:rgba(255,255,255,.15);color:#C5F82A;border:1px solid rgba(255,255,255,.15)}@media(min-width:640px){.rolebadge{display:inline-block}}
.navpills{display:none;align-items:center;gap:4px;background:rgba(255,255,255,.09);backdrop-filter:blur(10px);padding:6px;border-radius:999px;border:1px solid rgba(255,255,255,.12)}@media(min-width:768px){.navpills{display:flex}}
.desktop-nav-pill{padding:6px 16px;font-size:13px;font-weight:600}
.balrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px}.bal-l{font-size:13.5px;font-weight:600;color:#dcf2e6;margin-bottom:2px}.bal-n{font-size:32px;font-weight:800;color:#fff;line-height:1;letter-spacing:-.02em}.bal-btn{display:inline-flex;align-items:center;gap:8px;background:#C5F82A;color:#062e1c;font-weight:800;font-size:14px;padding:10px 16px;border-radius:999px;white-space:nowrap}
.dock{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:4px 12px 12px;pointer-events:none}@media(min-width:768px){.dock{display:none}}.dock .mobile-bottom-dock{max-width:460px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;pointer-events:auto}.dk{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.dk span{font-size:11px;font-weight:600;line-height:1}.dk.active span{font-weight:800}
#toastBanner{position:fixed;top:78px;left:50%;transform:translate(-50%,8px);z-index:60;width:92%;max-width:440px;background:rgba(6,43,26,.96);color:#fff;font-size:13.5px;font-weight:700;padding:12px 16px;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:.2s}#toastBanner.show{opacity:1;transform:translate(-50%,0)}
.p-4{padding:16px}.p-5{padding:20px}.p-6{padding:24px}.p-10{padding:40px}.uppercase{text-transform:uppercase}.text-center{text-align:center}.top-header-bg.compact{height:210px}