/* ============================================================
   White-label premium demo — «Триатлон.Клуб» (scoped .wlt)
   Auth · Кураторская · Дашборд — native 390×844, dark premium.
   ============================================================ */
.wlt{
  position:absolute; top:0; left:0; width:390px; height:844px; transform-origin:top left;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --bg:#0A0E1A; --surface:#141B2E; --elevated:#1E2839;
  --primary:#FF6B35; --secondary:#00D4FF;
  --h:#F8FAFC; --t:#CBD5E1; --t2:#64748B;
  --green:#10B981; --gold:#F59E0B; --red:#EF4444;
  --line:rgba(255,255,255,0.08); --line-2:rgba(255,255,255,0.14);
  --hero:linear-gradient(135deg,#FF6B35 0%,#F59E0B 100%);
  --surface-grad:linear-gradient(180deg,#141B2E 0%,#0A0E1A 100%);
  color:var(--t); background:var(--bg); overflow:hidden;
}
.wlt .sb{ position:absolute; top:0; left:0; right:0; height:54px; z-index:40; display:flex; align-items:flex-end; justify-content:space-between; padding:0 30px 8px; pointer-events:none; color:var(--h); }
.wlt .sb-time{ font:700 16px/1 'Inter',sans-serif; }
.wlt .sb-right{ display:flex; align-items:center; gap:7px; }
.wlt .scroll{ position:absolute; inset:0; z-index:20; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; }
.wlt .scroll::-webkit-scrollbar{ display:none; } .wlt .scroll{ scrollbar-width:none; }
.wlt .body{ padding:16px; }

/* ===== AUTH ===== */
.wlt .authbg{ position:absolute; inset:0; z-index:0; }
.wlt .authbg img{ width:100%; height:100%; object-fit:cover; object-position:center 42%; display:block; }
.wlt .authbg .sc{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,14,26,0.55) 0%,rgba(10,14,26,0.32) 26%,rgba(10,14,26,0.74) 64%,#0A0E1A 94%); }
.wlt .auth{ position:absolute; inset:0; z-index:20; display:flex; flex-direction:column; padding:54px 28px 30px; }
.wlt .auth-top{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.wlt .logo{ width:92px; height:92px; border-radius:28px; display:flex; align-items:center; justify-content:center; background:var(--hero); box-shadow:0 0 50px rgba(255,107,53,0.5),inset 0 2px 0 rgba(255,255,255,0.25); color:#fff; }
.wlt .brand{ margin-top:22px; font:800 30px/1 'Inter',sans-serif; letter-spacing:.12em; color:var(--h); text-transform:uppercase; }
.wlt .brand .sec{ color:var(--secondary); }
.wlt .tagline{ margin-top:11px; font:500 13.5px/1.45 'Inter',sans-serif; color:rgba(248,250,252,0.86); text-align:center; max-width:260px; letter-spacing:.02em; text-shadow:0 1px 12px rgba(0,0,0,0.5); }
.wlt .premium{ display:inline-flex; align-items:center; gap:6px; margin-top:16px; padding:6px 13px; border-radius:9999px; background:rgba(245,158,11,0.14); border:1px solid rgba(245,158,11,0.35); color:var(--gold); font:700 10.5px/1 'Inter',sans-serif; letter-spacing:.1em; text-transform:uppercase; }
.wlt .card{ border-radius:24px; padding:22px 20px; background:linear-gradient(180deg,rgba(255,255,255,0.06),rgba(255,255,255,0.02)); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid var(--line-2); box-shadow:0 20px 50px rgba(0,0,0,0.4); }
.wlt .card h2{ font:700 19px/1.2 'Inter',sans-serif; color:var(--h); }
.wlt .field{ position:relative; margin-top:15px; }
.wlt .field label{ display:block; font:600 11px/1 'Inter',sans-serif; letter-spacing:.04em; text-transform:uppercase; color:var(--t2); margin-bottom:8px; }
.wlt .field .inp{ display:flex; align-items:center; gap:10px; height:52px; border-radius:14px; padding:0 14px; background:var(--bg); border:1px solid var(--line-2); }
.wlt .field .inp svg{ color:var(--t2); flex:none; }
.wlt .field .val{ flex:1; font:500 15px/1 'Inter',sans-serif; color:var(--h); }
.wlt .field .eye{ color:var(--t2); }
.wlt .btn-primary{ margin-top:20px; width:100%; height:54px; border:0; cursor:pointer; border-radius:15px; background:var(--hero); color:#fff; font:700 16px/1 'Inter',sans-serif; box-shadow:0 10px 26px rgba(255,107,53,0.4); }
.wlt .forgot{ display:block; text-align:center; margin-top:16px; font:600 13.5px/1 'Inter',sans-serif; color:var(--secondary); }
.wlt .auth-foot{ margin-top:18px; text-align:center; font:500 13px/1.4 'Inter',sans-serif; color:var(--t2); }
.wlt .auth-foot a{ color:var(--primary); font-weight:600; }

/* ===== shared header ===== */
.wlt .head{ position:absolute; top:0; left:0; right:0; z-index:30; padding:58px 18px 16px; overflow:hidden; background:var(--surface-grad); border-bottom:1px solid var(--line); }
.wlt .head-row{ display:flex; align-items:center; gap:12px; }
.wlt .iconbtn{ width:42px; height:42px; border-radius:13px; flex:none; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.05); border:1px solid var(--line); color:var(--t); }
.wlt .head-tt{ flex:1; min-width:0; }
.wlt .head-tt .l{ font:600 10.5px/1 'Inter',sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--t2); }
.wlt .head-tt .t{ font:800 20px/1.15 'Inter',sans-serif; color:var(--h); margin-top:5px; letter-spacing:-0.01em; }

/* chips + toolbar */
.wlt .chips{ display:flex; gap:8px; margin-top:15px; overflow-x:auto; }
.wlt .chips::-webkit-scrollbar{ display:none; } .wlt .chips{ scrollbar-width:none; }
.wlt .chip{ flex:none; display:flex; align-items:center; gap:7px; padding:9px 13px; border-radius:11px; cursor:pointer; font:600 12.5px/1 'Inter',sans-serif; color:var(--t); background:rgba(255,255,255,0.05); border:1px solid var(--line); white-space:nowrap; }
.wlt .chip .c{ font:700 10px/1; padding:2px 6px; border-radius:9999px; background:rgba(255,255,255,0.1); color:var(--t); }
.wlt .chip.on{ background:rgba(255,107,53,0.16); border-color:rgba(255,107,53,0.4); color:var(--primary); }
.wlt .chip.on .c{ background:rgba(255,107,53,0.25); color:var(--primary); }
.wlt .chip.filterbtn{ color:var(--secondary); border-color:rgba(0,212,255,0.3); background:rgba(0,212,255,0.08); }
.wlt .toolbar{ display:flex; align-items:center; justify-content:space-between; margin-top:12px; }
.wlt .toolbar .count{ font:500 12px/1.3 'Inter',sans-serif; color:var(--t2); }
.wlt .sortbtn{ display:inline-flex; align-items:center; gap:6px; font:600 12px/1 'Inter',sans-serif; color:var(--t); }

/* work cards (кураторская) */
.wlt .wcard{ position:relative; border-radius:18px; padding:15px 15px 15px 18px; margin-bottom:12px; overflow:hidden; cursor:pointer; background:var(--surface); border:1px solid var(--line); transition:transform .2s,border-color .2s; }
.wlt .wcard:hover{ transform:translateY(-2px); border-color:var(--line-2); }
.wlt .wcard .stripe{ position:absolute; left:0; top:0; bottom:0; width:4px; }
.wlt .st-new .stripe{ background:var(--secondary); } .wlt .st-rev .stripe{ background:var(--gold); } .wlt .st-ok .stripe{ background:var(--green); }
.wlt .wtop{ display:flex; align-items:center; gap:11px; }
.wlt .wav{ width:42px; height:42px; border-radius:12px; flex:none; display:flex; align-items:center; justify-content:center; color:#fff; font:700 14px/1 'Inter',sans-serif; background:linear-gradient(140deg,#FF8255,#E55A2B); }
.wlt .wav.b{ background:linear-gradient(140deg,#22C9F2,#0E8FB8); } .wlt .wav.p{ background:linear-gradient(140deg,#A06BFF,#6E3FD0); } .wlt .wav.g{ background:linear-gradient(140deg,#2BD49A,#0E8E66); }
.wlt .wh{ flex:1; min-width:0; }
.wlt .wname{ font:700 14.5px/1.2 'Inter',sans-serif; color:var(--h); }
.wlt .wsub{ font:500 12px/1 'Inter',sans-serif; color:var(--t2); margin-top:4px; }
.wlt .stbadge{ flex:none; font:700 10px/1 'Inter',sans-serif; letter-spacing:.04em; text-transform:uppercase; padding:5px 9px; border-radius:7px; }
.wlt .stbadge.new{ background:rgba(0,212,255,0.15); color:var(--secondary); }
.wlt .stbadge.rev{ background:rgba(245,158,11,0.15); color:var(--gold); }
.wlt .stbadge.ok{ background:rgba(16,185,129,0.15); color:var(--green); }
.wlt .wtask{ font:600 14px/1.35 'Inter',sans-serif; color:var(--t); margin-top:13px; }
.wlt .wmeta{ display:flex; align-items:center; gap:9px; margin-top:10px; }
.wlt .mtag{ display:inline-flex; align-items:center; gap:5px; font:500 11.5px/1 'Inter',sans-serif; color:var(--t2); }
.wlt .wmeta .sep{ width:3px; height:3px; border-radius:50%; background:var(--t2); }

/* ===== dashboard ===== */
.wlt .sales{ border-radius:22px; padding:20px; overflow:hidden; position:relative; background:var(--hero); box-shadow:0 16px 40px rgba(255,107,53,0.32); }
.wlt .sales::after{ content:""; position:absolute; right:-30px; top:-40px; width:150px; height:150px; border-radius:50%; background:rgba(255,255,255,0.18); }
.wlt .sales .lbl{ font:600 11px/1 'Inter',sans-serif; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,0.85); position:relative; z-index:1; }
.wlt .sales .big{ font:800 36px/1 'Inter',sans-serif; color:#fff; margin-top:12px; letter-spacing:-0.01em; position:relative; z-index:1; }
.wlt .sales .delta{ display:inline-flex; align-items:center; gap:6px; margin-top:12px; padding:6px 11px; border-radius:9999px; background:rgba(255,255,255,0.2); color:#fff; font:700 12px/1 'Inter',sans-serif; position:relative; z-index:1; }
.wlt .sales .sub{ font:500 12px/1 'Inter',sans-serif; color:rgba(255,255,255,0.8); margin-left:8px; }
.wlt .stats3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; margin-top:14px; }
.wlt .stat{ border-radius:16px; padding:14px 12px; background:var(--surface); border:1px solid var(--line); }
.wlt .stat .sv{ font:800 18px/1 'Inter',sans-serif; color:var(--h); }
.wlt .stat .sl{ font:500 10.5px/1.2 'Inter',sans-serif; color:var(--t2); margin-top:6px; }
.wlt .chartcard{ border-radius:18px; padding:16px; margin-top:14px; background:var(--surface); border:1px solid var(--line); }
.wlt .chartcard .ct{ display:flex; align-items:center; justify-content:space-between; }
.wlt .chartcard .ctt{ font:700 14px/1 'Inter',sans-serif; color:var(--h); }
.wlt .chartcard .cmeta{ font:500 11.5px/1 'Inter',sans-serif; color:var(--t2); }
.wlt .bars{ display:flex; align-items:flex-end; gap:9px; height:84px; margin-top:16px; }
.wlt .bars .bar{ flex:1; border-radius:6px 6px 3px 3px; background:linear-gradient(180deg,rgba(0,212,255,0.7),rgba(0,212,255,0.18)); }
.wlt .bars .bar.hi{ background:var(--hero); box-shadow:0 0 16px rgba(255,107,53,0.5); }
.wlt .bars-x{ display:flex; gap:9px; margin-top:9px; }
.wlt .bars-x span{ flex:1; text-align:center; font:600 9.5px/1 'Inter',sans-serif; color:var(--t2); }
.wlt .sec-h{ display:flex; align-items:center; justify-content:space-between; margin:20px 2px 12px; }
.wlt .sec-h .st{ font:700 15px/1 'Inter',sans-serif; color:var(--h); }
.wlt .sec-h .all{ font:600 12.5px/1 'Inter',sans-serif; color:var(--secondary); }
.wlt .inv{ display:flex; align-items:center; gap:12px; padding:13px; border-radius:15px; margin-bottom:10px; background:var(--surface); border:1px solid var(--line); }
.wlt .inv .iav{ width:40px; height:40px; border-radius:11px; flex:none; display:flex; align-items:center; justify-content:center; color:#fff; font:700 13px/1 'Inter',sans-serif; }
.wlt .inv .ibd{ flex:1; min-width:0; }
.wlt .inv .inm{ font:700 13.5px/1.2 'Inter',sans-serif; color:var(--h); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wlt .inv .ics{ font:500 11.5px/1 'Inter',sans-serif; color:var(--t2); margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wlt .inv .iright{ flex:none; text-align:right; }
.wlt .inv .iamt{ font:800 14px/1 'Inter',sans-serif; color:var(--h); font-variant-numeric:tabular-nums; }
.wlt .inv .ist{ font:700 9.5px/1 'Inter',sans-serif; letter-spacing:.04em; text-transform:uppercase; margin-top:6px; display:inline-block; padding:4px 7px; border-radius:6px; }
.wlt .ist.paid{ background:rgba(16,185,129,0.15); color:var(--green); }
.wlt .ist.part{ background:rgba(245,158,11,0.15); color:var(--gold); }
.wlt .ist.wait{ background:rgba(100,116,139,0.2); color:var(--t2); }

/* bottom tab bar — меню обычного приложения + Кураторская/Дашборд (6 пунктов) */
.wlt .tabbar{ position:absolute; bottom:16px; left:10px; right:10px; z-index:35; height:62px; display:flex; align-items:center; justify-content:space-between; padding:0 3px; border-radius:22px; background:rgba(20,27,46,0.85); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid var(--line-2); box-shadow:0 -2px 30px rgba(0,0,0,0.4); }
.wlt .tab{ position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; flex:1; min-width:0; height:50px; border-radius:12px; color:var(--t2); }
.wlt .tab svg{ flex:none; }
.wlt .tab .lab{ font:600 8px/1 'Inter',sans-serif; white-space:nowrap; letter-spacing:.01em; }
.wlt .tab.on{ color:var(--primary); background:rgba(255,107,53,0.12); }