
:root{
  --canvas:#F8FAFC; --surface:#FFFFFF; --sunk:#F1F5F9; --raised:#FFFFFF; --line:#E2E8F0; --line-2:#CBD5E1;
  --ink:#0F172A; --ink-2:#334155; --muted:#64748B; --faint:#94A3B8;
  --brand:#4F46E5; --brand-hover:#4338CA; --brand-2:#2563EB; --brand-text:#4F46E5; --brand-soft:#EEF2FF; --brand-ink:#3730A3; --brand-line:#C7D2FE;
  --amber-bg:#FEF3C7; --amber:#B45309; --amber-dot:#F59E0B;
  --indigo-bg:#E0E7FF; --indigo:#4338CA; --indigo-dot:#6366F1;
  --green-bg:#D1FAE5; --green:#047857; --green-dot:#10B981;
  --rose-bg:#FFE4E6; --rose:#BE123C; --rose-dot:#F43F5E;
  --sky-bg:#E0F2FE; --sky:#0369A1; --sky-dot:#0EA5E9;
  --slate-bg:#E2E8F0; --slate:#334155; --slate-dot:#64748B;
  --violet-bg:#EDE9FE; --violet:#6D28D9; --violet-dot:#8B5CF6;
  --coral-bg:#FFEDE5; --coral:#C2410C; --coral-dot:#F97316;
  --wa-bg:#ECFDF3; --wa-line:#BBF7D0; --wa-ink:#14532D; --wa-text:#15803D;
  --gold:#D4A017; --gold-soft:#FFFBEB;
  --youcef:#059669; --ichaa:#7C3AED;
  --night:#0F172A; --night-2:#1E293B; --on-night:#F8FAFC; --night-muted:#94A3B8;
  --topbar:rgba(255,255,255,.9); --scrim:rgba(15,23,42,.42);
  --ty-post-bg:#EFF6FF; --ty-post-line:#BFDBFE; --ty-post:#1D4ED8;
  --ty-car-bg:#F5F3FF; --ty-car-line:#DDD6FE; --ty-car:#6D28D9;
  --ty-reel-bg:#FFF1EC; --ty-reel-line:#FED7C7; --ty-reel:#C2410C;
  --ty-story-bg:#FFFBEB; --ty-story-line:#FDE68A; --ty-story:#B45309;
  --ty-ad-bg:#ECFDF5; --ty-ad:#047857;
  --script-bg:#FFF7F2; --script-line:#FCD9C6; --script-rule:#FBE3D6; --script-bullet:#F97316;
  --r0:#F1F5F9; --r1:#E0E7FF; --r2:#C7D2FE; --r3:#A5B4FC; --r4:#818CF8; --r5:#6366F1; --r6:#4338CA; --r-on-hi:#FFFFFF; --r-on-lo:#334155;
  --hex-ground:#EEF2F7; --hex-ground-line:#E2E8F0;
  --sh-1:0 1px 2px rgba(15,23,42,.05),0 1px 1px rgba(15,23,42,.03);
  --sh-2:0 1px 2px rgba(15,23,42,.04),0 4px 12px -2px rgba(15,23,42,.06),0 12px 24px -8px rgba(15,23,42,.06);
  --sh-3:0 2px 4px rgba(15,23,42,.04),0 24px 48px -12px rgba(15,23,42,.22);
  --f-sans:"Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --f-ar:"Noto Kufi Arabic", "Plus Jakarta Sans", Tahoma, sans-serif;
  --rail:248px; --eyes:#24B08B;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --canvas:#0B1120; --surface:#111827; --sunk:#182133; --raised:#1A2335; --line:#243044; --line-2:#334155;
  --ink:#E8ECF3; --ink-2:#CBD5E1; --muted:#94A3B8; --faint:#64748B;
  --brand:#5B54E8; --brand-hover:#6D67F0; --brand-2:#3B82F6; --brand-text:#A5B4FC; --brand-soft:#1E1B4B; --brand-ink:#C7D2FE; --brand-line:#3730A3;
  --amber-bg:#3A2A0A; --amber:#FCD34D; --indigo-bg:#25215A; --indigo:#C7D2FE; --green-bg:#06301F; --green:#6EE7B7;
  --rose-bg:#3F0F1B; --rose:#FDA4AF; --sky-bg:#0C2A3D; --sky:#7DD3FC; --slate-bg:#1E293B; --slate:#CBD5E1;
  --violet-bg:#2A1B4A; --violet:#C4B5FD; --coral-bg:#3A1A0C; --coral:#FDBA74;
  --wa-bg:#0B2A1A; --wa-line:#14532D; --wa-ink:#DCFCE7; --wa-text:#86EFAC;
  --gold:#E3B341; --gold-soft:#2A2108;
  --night:#060B18; --night-2:#141C2E; --on-night:#F8FAFC; --night-muted:#94A3B8;
  --topbar:rgba(17,24,39,.88); --scrim:rgba(2,6,23,.66);
  --ty-post-bg:#0F1E3A; --ty-post-line:#1E3A8A; --ty-post:#93C5FD;
  --ty-car-bg:#1E1538; --ty-car-line:#4C1D95; --ty-car:#C4B5FD;
  --ty-reel-bg:#2D160B; --ty-reel-line:#7C2D12; --ty-reel:#FDBA74;
  --ty-story-bg:#2A1F06; --ty-story-line:#78350F; --ty-story:#FCD34D;
  --ty-ad-bg:#062A1E; --ty-ad:#6EE7B7;
  --script-bg:#1F140E; --script-line:#5B2A12; --script-rule:#2E1D13; --script-bullet:#FB923C;
  --r0:#1A2335; --r1:#1E1B4B; --r2:#312E81; --r3:#4338CA; --r4:#6366F1; --r5:#818CF8; --r6:#C7D2FE; --r-on-hi:#0B1120; --r-on-lo:#E2E8F0;
  --hex-ground:#162033; --hex-ground-line:#1E2A40; --eyes:#FFFFFF;
  --sh-1:0 1px 2px rgba(0,0,0,.4); --sh-2:0 6px 18px -4px rgba(0,0,0,.55); --sh-3:0 24px 48px -12px rgba(0,0,0,.7);
  color-scheme:dark }}
:root[data-theme="dark"]{
  --canvas:#0B1120; --surface:#111827; --sunk:#182133; --raised:#1A2335; --line:#243044; --line-2:#334155;
  --ink:#E8ECF3; --ink-2:#CBD5E1; --muted:#94A3B8; --faint:#64748B;
  --brand:#5B54E8; --brand-hover:#6D67F0; --brand-2:#3B82F6; --brand-text:#A5B4FC; --brand-soft:#1E1B4B; --brand-ink:#C7D2FE; --brand-line:#3730A3;
  --amber-bg:#3A2A0A; --amber:#FCD34D; --indigo-bg:#25215A; --indigo:#C7D2FE; --green-bg:#06301F; --green:#6EE7B7;
  --rose-bg:#3F0F1B; --rose:#FDA4AF; --sky-bg:#0C2A3D; --sky:#7DD3FC; --slate-bg:#1E293B; --slate:#CBD5E1;
  --violet-bg:#2A1B4A; --violet:#C4B5FD; --coral-bg:#3A1A0C; --coral:#FDBA74;
  --wa-bg:#0B2A1A; --wa-line:#14532D; --wa-ink:#DCFCE7; --wa-text:#86EFAC;
  --gold:#E3B341; --gold-soft:#2A2108;
  --night:#060B18; --night-2:#141C2E; --on-night:#F8FAFC; --night-muted:#94A3B8;
  --topbar:rgba(17,24,39,.88); --scrim:rgba(2,6,23,.66);
  --ty-post-bg:#0F1E3A; --ty-post-line:#1E3A8A; --ty-post:#93C5FD;
  --ty-car-bg:#1E1538; --ty-car-line:#4C1D95; --ty-car:#C4B5FD;
  --ty-reel-bg:#2D160B; --ty-reel-line:#7C2D12; --ty-reel:#FDBA74;
  --ty-story-bg:#2A1F06; --ty-story-line:#78350F; --ty-story:#FCD34D;
  --ty-ad-bg:#062A1E; --ty-ad:#6EE7B7;
  --script-bg:#1F140E; --script-line:#5B2A12; --script-rule:#2E1D13; --script-bullet:#FB923C;
  --r0:#1A2335; --r1:#1E1B4B; --r2:#312E81; --r3:#4338CA; --r4:#6366F1; --r5:#818CF8; --r6:#C7D2FE; --r-on-hi:#0B1120; --r-on-lo:#E2E8F0;
  --hex-ground:#162033; --hex-ground-line:#1E2A40; --eyes:#FFFFFF;
  --sh-1:0 1px 2px rgba(0,0,0,.4); --sh-2:0 6px 18px -4px rgba(0,0,0,.55); --sh-3:0 24px 48px -12px rgba(0,0,0,.7);
  color-scheme:dark }
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--canvas);color:var(--ink);font:14px/1.5 var(--f-sans);-webkit-font-smoothing:antialiased}
[dir=rtl] body,[dir=rtl]{font-family:var(--f-ar)}
button,input,select,textarea{font:inherit;color:inherit}
input,select,textarea{background-color:var(--surface)}
button{cursor:pointer}
.num{font-variant-numeric:tabular-nums}
.mono{font-family:var(--f-mono);font-size:12.5px;letter-spacing:-.01em}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
svg.i{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
svg.i.sm{width:14px;height:14px} svg.i.lg{width:18px;height:18px} svg.i.xl{width:22px;height:22px}
[dir=rtl] .flip{transform:scaleX(-1)}
.muted{color:var(--muted)} .faint{color:var(--faint)} .spacer{flex:1}
.ltr{direction:ltr;unicode-bidi:isolate}


.login{min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--canvas)}
.login-art{background:var(--night);color:var(--on-night);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:40px}
.login-art svg.pat{position:absolute;inset-block-start:0;inset-inline-end:0;width:72%;height:auto;opacity:.95}
.login-art .lg-name{font-size:clamp(48px,7vw,96px);font-weight:800;letter-spacing:-.045em;line-height:.9;margin:0;position:relative}
.login-art p{color:var(--night-muted);max-width:420px;margin:14px 0 0;position:relative}
.login-form{display:flex;align-items:center;justify-content:center;padding-block:32px;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.login-card{width:100%;max-width:400px;display:flex;flex-direction:column;gap:16px}
.login-card h1{margin:0;font-size:26px;letter-spacing:-.02em}
.login-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.demo{border:1px dashed var(--line-2);border-radius:12px;padding:12px;font-size:12.5px;display:flex;flex-direction:column;gap:8px;background:var(--surface)}
.demo button{display:flex;justify-content:space-between;gap:10px;border:1px solid var(--line);background:var(--sunk);border-radius:9px;padding:8px 10px;text-align:start;align-items:center}
.demo button:hover{border-color:var(--brand-line)}
@media (max-width:860px){.login{grid-template-columns:1fr}.login-art{min-height:220px;padding:24px max(20px,env(safe-area-inset-left,0px))}.login-art svg.pat{width:60%}}


.app{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);min-height:100%}
.app.collapsed{--rail:76px}
.rail{position:sticky;top:0;height:100vh;height:100dvh;background:var(--surface);border-inline-end:1px solid var(--line);display:flex;flex-direction:column;padding:14px 10px 12px;gap:2px;z-index:30;min-width:0}
.rail-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:2px;margin-inline:-2px;padding-inline:2px;scrollbar-width:thin}
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:4px 10px 14px;border-bottom:1px solid var(--line);margin-bottom:6px;min-width:0}
.brand small{display:block;color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.brand .mark{display:none}
.rail-label{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);padding:12px 12px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-btn{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;column-gap:12px;width:100%;min-height:40px;border:0;background:none;padding:8px 10px 8px 12px;border-radius:10px;color:var(--ink-2);font-weight:600;font-size:13.5px;text-align:start;position:relative}
.nav-btn svg.i{justify-self:center}
.nav-btn .t{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-btn:hover{background:var(--sunk);color:var(--ink)}
.nav-btn.on{background:var(--brand-soft);color:var(--brand-ink)}
.nav-btn.on::before{content:"";position:absolute;inset-inline-start:0;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--brand)}
[dir=rtl] .nav-btn.on::before{border-radius:3px 0 0 3px}
.nav-btn .count{justify-self:end;flex:none;min-width:26px;max-width:64px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:700;color:var(--muted);background:var(--sunk);border:1px solid var(--line);border-radius:99px;padding:0 7px;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1}
.nav-btn.on .count{background:var(--surface);color:var(--brand-ink);border-color:var(--brand-line)}
.nav-btn .kb{font:600 10.5px var(--f-mono);color:var(--faint);border:1px solid var(--line);border-radius:6px;padding:2px 5px;justify-self:end}
.collapsed .brand .full,.collapsed .brand small,.collapsed .rail-label,.collapsed .nav-btn .t,.collapsed .nav-btn .count,.collapsed .nav-btn .kb,.collapsed .rail-foot .who-t{display:none}
.collapsed .brand{align-items:center;padding-inline:0}
.collapsed .brand .mark{display:block}
.collapsed .nav-btn{grid-template-columns:1fr;justify-items:center;padding:10px 0}
.collapsed .nav-btn .dotc{display:block}
.nav-btn .dotc{display:none;position:absolute;top:2px;inset-inline-start:calc(50% + 6px);min-width:16px;height:16px;border-radius:99px;background:var(--brand);color:#fff;font-size:9.5px;font-weight:800;padding:0 4px;line-height:16px;text-align:center}
.rail-foot{border-top:1px solid var(--line);padding-top:10px;margin-top:6px;display:flex;flex-direction:column;gap:2px}
.collapsed .who{justify-content:center;padding-inline:0}
.rail-resize{position:absolute;top:0;bottom:0;inset-inline-end:-4px;width:8px;cursor:col-resize;z-index:31}
.rail-resize::after{content:"";position:absolute;top:0;bottom:0;inset-inline-start:3px;width:2px;background:transparent;transition:background .15s}
.rail-resize:hover::after,.rail-resize.drag::after{background:var(--brand)}
body.resizing{cursor:col-resize;user-select:none}
.lg-l{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lg-l{display:none!important}:root:not([data-theme="light"]) .lg-d{display:block!important}}
:root[data-theme="dark"] .lg-l{display:none!important} :root[data-theme="dark"] .lg-d{display:block!important}
.who{display:flex;gap:10px;align-items:center;padding:8px 10px;font-size:12.5px;color:var(--muted)}
.main{min-width:0;display:flex;flex-direction:column}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--surface)}
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--topbar);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding-block:10px;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px));min-height:62px}
.tb-title{display:flex;align-items:center;gap:10px;min-width:0}
.tb-title h1{font-size:18px;margin:0;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--green);background:var(--green-bg);padding:2px 9px;border-radius:99px;white-space:nowrap}
.live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green-dot)}
.kbar{flex:1;min-width:160px;max-width:420px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--sunk);border-radius:10px;padding:7px 10px;color:var(--muted);font-size:13px;text-align:start}
.kbar:hover{border-color:var(--line-2)}
.kbd{margin-inline-start:auto;font:600 11px var(--f-mono);border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:1px 6px;background:var(--surface);color:var(--muted)}
.tb-right{margin-inline-start:auto;display:flex;align-items:center;gap:8px}
.av{width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;font-size:11px;font-weight:700;flex:none;font-family:var(--f-sans)}
.av.lg{width:40px;height:40px;font-size:15px}
.av.y{background:var(--youcef)} .av.i{background:var(--ichaa)} .av.o{background:var(--slate-dot)}
.pop-wrap{position:relative}
.pop{position:absolute;inset-inline-end:0;top:calc(100% + 8px);min-width:220px;background:var(--raised);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-3);padding:6px;z-index:50;animation:rise .14s ease}
.pop-item{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;border-radius:9px;padding:9px 10px;text-align:start;font-weight:600;font-size:13px}
.pop-item:hover{background:var(--sunk)}
.pop-item .chk{margin-inline-start:auto;color:var(--brand-text)}
.pop-sep{height:1px;background:var(--line);margin:5px 4px}
.pop-head{padding:8px 10px;display:flex;gap:10px;align-items:center}
.pop-head small{display:block;color:var(--muted);font-size:12px}
.lang-btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:6px 10px;font-weight:700;font-size:12.5px;box-shadow:var(--sh-1)}
.lang-btn .code{letter-spacing:.04em}
.lang-btn:hover{border-color:var(--line-2)}
.flag-big{font:700 11px var(--f-mono);border-radius:5px;padding:1px 5px;background:var(--sunk);color:var(--muted)}
.user-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:4px 10px 4px 4px;font-weight:600;font-size:13px;box-shadow:var(--sh-1)}
[dir=rtl] .user-btn{padding:4px 4px 4px 10px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:10px;padding:8px 13px;font-weight:600;font-size:13px;white-space:nowrap;box-shadow:var(--sh-1);transition:background .15s,border-color .15s,transform .1s;min-height:36px}
.btn:hover{background:var(--sunk);border-color:var(--line-2)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{background:var(--brand-hover)}
.btn.dark{background:var(--ink);border-color:var(--ink);color:var(--canvas)}
.btn.ghost{border-color:transparent;background:none;box-shadow:none}
.btn.ghost:hover{background:var(--sunk)}
.btn.danger{background:var(--rose-dot);border-color:var(--rose-dot);color:#fff}
.btn.sm{padding:5px 9px;font-size:12px;border-radius:8px;min-height:30px}
.btn.block{width:100%;min-height:44px;font-size:14px}
.icon-btn{border:0;background:none;width:34px;height:34px;display:inline-grid;place-items:center;border-radius:9px;color:var(--muted);flex:none}
.icon-btn:hover{background:var(--sunk);color:var(--ink)}
.icon-btn:disabled{opacity:.35;cursor:default}
.icon-btn.boxed{border:1px solid var(--line);background:var(--surface);box-shadow:var(--sh-1)}
.link{border:0;background:none;color:var(--brand-text);font-weight:600;font-size:12px;padding:0;display:inline-flex;align-items:center;gap:4px}
.link:hover{text-decoration:underline}

.ws{padding-block:18px 48px;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px));display:flex;flex-direction:column;gap:16px;min-width:0}
.subnav{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.seg{display:inline-flex;gap:2px;background:var(--sunk);border:1px solid var(--line);border-radius:12px;padding:3px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg button{display:flex;align-items:center;gap:7px;border:0;background:none;padding:7px 12px;border-radius:9px;font-weight:600;font-size:13px;color:var(--muted);white-space:nowrap;flex:none}
.seg button:hover{color:var(--ink)}
.seg button.on{background:var(--ink);color:var(--canvas);box-shadow:var(--sh-1)}
.seg.light button.on{background:var(--surface);color:var(--brand-text)}
.seg .pill-n{font-size:11px;background:rgba(127,127,127,.22);padding:0 7px;border-radius:99px}

.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:10px;box-shadow:var(--sh-1)}
button.pay-tag{border:0;cursor:pointer;font:inherit;font-size:11.5px;font-weight:700;transition:filter .15s,box-shadow .15s}button.pay-tag:hover{filter:brightness(.95);box-shadow:0 0 0 2px currentColor inset}
.sx{display:none;place-items:center;flex:none;width:22px;height:22px;border:0;border-radius:6px;background:none;color:var(--muted);cursor:pointer;padding:0}
.sx:hover{background:var(--line);color:var(--ink)}
.search input:not(:placeholder-shown)~.sx,.combo input:not(:placeholder-shown)~.sx{display:grid}
.combo>.sx{position:absolute;inset-inline-end:8px;top:9px}
.combo>input{padding-inline-end:34px}
.search{flex:1 1 240px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:0 10px;background:var(--sunk);min-width:0;color:var(--muted)}
.search input{border:0;background:none;outline:none;padding:9px 0;width:100%;min-width:0;color:var(--ink)}
.search:focus-within{border-color:var(--brand);background:var(--surface);box-shadow:0 0 0 3px rgba(99,102,241,.16)}
.sel{appearance:none;-webkit-appearance:none;border:1px solid var(--line);background-color:var(--surface);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%2394A3B8' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;border-radius:10px;padding:8px 30px 8px 11px;font-size:13px;font-weight:500;max-width:100%;min-width:0;color:var(--ink)}
[dir=rtl] .sel{background-position:left 10px center;padding:8px 11px 8px 30px}
.dd{position:fixed;z-index:200;display:flex;flex-direction:column;background:var(--raised);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-3);overflow:hidden;animation:ddIn .12s ease-out}
@keyframes ddIn{from{opacity:0;transform:translateY(-4px)}}
.dd-q{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line);color:var(--muted);flex:none}
.dd-q input{border:0;background:none;outline:none;width:100%;min-width:0;color:var(--ink);font:inherit;font-size:13.5px;padding:2px 0}
.dd-q input::placeholder{color:var(--faint)}
.dd-l{overflow:auto;padding:4px;outline:none;min-height:0}
.dd-o{display:flex;align-items:center;gap:8px;width:100%;border:0;background:none;padding:7px 10px;border-radius:8px;text-align:start;color:var(--ink);font:inherit;font-size:13.5px;cursor:pointer}
.dd-o span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dd-o.act{background:var(--brand-soft)}.dd-o.on{font-weight:600;color:var(--brand-ink)}.dd-o.ph{color:var(--muted)}
.dd-o:disabled{opacity:.5;cursor:default}.dd-o .i{color:var(--brand)}
.dd-none{padding:12px;color:var(--muted);font-size:13px;text-align:center}
.sel.dd-open{border-color:var(--brand);box-shadow:0 0 0 3px rgba(99,102,241,.16)}
.sel.active{border-color:var(--brand);background-color:var(--brand-soft);color:var(--brand-ink)}
.sel:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(99,102,241,.16)}
.sel:disabled{opacity:.55;background-color:var(--sunk);cursor:not-allowed}
.f-toggle{display:none}
.f-more{display:contents}


.b{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;border-radius:99px;padding:2px 9px;white-space:nowrap;line-height:1.6;border:1px solid transparent}
.b .d{width:7px;height:7px;border-radius:50%;flex:none}
.t-amber{background:var(--amber-bg);color:var(--amber)} .t-amber .d{background:var(--amber-dot)}
.t-indigo{background:var(--indigo-bg);color:var(--indigo)} .t-indigo .d{background:var(--indigo-dot)}
.t-green{background:var(--green-bg);color:var(--green)} .t-green .d{background:var(--green-dot)}
.t-rose{background:var(--rose-bg);color:var(--rose)} .t-rose .d{background:var(--rose-dot)}
.t-sky{background:var(--sky-bg);color:var(--sky)} .t-sky .d{background:var(--sky-dot)}
.t-slate{background:var(--slate-bg);color:var(--slate)} .t-slate .d{background:var(--slate-dot)}
.t-violet{background:var(--violet-bg);color:var(--violet)} .t-violet .d{background:var(--violet-dot)}
.t-coral{background:var(--coral-bg);color:var(--coral)} .t-coral .d{background:var(--coral-dot)}
.tag{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:500;border-radius:6px;padding:2px 8px;background:var(--sunk);color:var(--ink-2);border:1px solid var(--line);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.tag.sector{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-ink)}
.tag.svc{background:var(--surface);border-color:var(--brand-line);color:var(--brand-text)}
.plat{display:inline-flex;align-items:center;font-size:11.5px;font-weight:700;border-radius:6px;padding:2px 8px;color:#fff;background:#2563EB;white-space:nowrap}
.plat.tiktok{background:#111827;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)} .plat.snap{background:#A16207} .plat.google{background:#0F766E}
.rep{display:inline-flex;align-items:center;gap:6px;border-radius:99px;padding:2px 10px 2px 3px;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid var(--line);background:var(--surface);color:var(--ink-2)}
[dir=rtl] .rep{padding:2px 3px 2px 10px}
.rep .av{width:18px;height:18px;font-size:9.5px}
.wa{display:inline-flex;align-items:center;gap:7px;border-radius:8px;padding:4px 9px;background:var(--wa-bg);color:var(--wa-text);font:500 12.5px var(--f-mono);text-decoration:none;border:1px solid var(--wa-line);white-space:nowrap;direction:ltr;unicode-bidi:isolate}
.wa:hover{filter:brightness(.97)}
.loc{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-2);background:var(--sunk);border-radius:6px;padding:2px 8px;white-space:nowrap}
.flag{width:18px;height:12px;border-radius:2px;flex:none;display:block;box-shadow:0 0 0 1px rgba(127,127,127,.35)}
.co-av{border-radius:8px;display:grid;place-items:center;font-weight:800;color:#fff;flex:none;letter-spacing:-.02em;font-family:var(--f-sans)}


.board-wrap{overflow-x:auto;padding-bottom:8px;margin-inline:-4px;padding-inline:4px;scroll-snap-type:x proximity}
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(290px,1fr);gap:14px;align-items:start;min-width:min-content}
.col{border-radius:16px;border:1px solid var(--line);background:var(--sunk);display:flex;flex-direction:column;min-height:240px;scroll-snap-align:start}
.col-h{padding:12px 12px 10px;display:flex;flex-direction:column;gap:6px;border-bottom:1px solid var(--line);border-radius:16px 16px 0 0;background:var(--surface)}
.col-h .row1{display:flex;align-items:center;gap:8px}
.col-h .row1 b{font-size:12.5px;letter-spacing:.05em;text-transform:uppercase}
.col-h .cnt{font-size:12px;font-weight:700;background:var(--sunk);border:1px solid var(--line);border-radius:99px;padding:0 8px}
.col-h .vol{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
.col-h .vol b{color:var(--ink);font-size:13px}
.col-h{box-shadow:inset 0 3px 0 var(--tone)}
.col-tools{margin-inline-start:auto;display:flex;gap:0}
.col-tools .icon-btn{width:26px;height:26px}
.col-body{padding:10px;display:flex;flex-direction:column;gap:10px}
.col.drop{outline:2px dashed var(--brand);outline-offset:-4px}
.col-empty{border:1.5px dashed var(--line-2);border-radius:12px;padding:28px 12px;text-align:center;color:var(--muted);font-size:13px;display:flex;flex-direction:column;gap:6px;align-items:center}
.col-add{align-items:center;justify-content:center;border-style:dashed;background:none;color:var(--muted);font-weight:600;gap:8px;min-height:120px}
.dot{width:9px;height:9px;border-radius:50%;flex:none}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:9px;box-shadow:var(--sh-1);cursor:pointer;transition:box-shadow .15s,border-color .15s;text-align:start;width:100%;min-width:0;color:var(--ink)}
.card:hover{box-shadow:var(--sh-2);border-color:var(--brand-line)}
.card-h{display:flex;align-items:center;gap:9px}
.card-h h4{margin:0;font-size:14.5px;letter-spacing:-.01em;line-height:1.3;flex:1;min-width:0}
.card .acts{display:flex;opacity:.6}
.card:hover .acts{opacity:1}
.card .acts .icon-btn{width:28px;height:28px}
.contact-box{background:var(--sunk);border:1px solid var(--line);border-radius:10px;padding:8px 9px;display:flex;flex-direction:column;gap:6px}
.contact-box .nm{display:flex;align-items:center;justify-content:space-between;gap:6px;font-weight:600;font-size:13px}
.role{font-size:11px;font-weight:600;border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:6px;padding:0 6px;white-space:nowrap}
.row{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.card-f{display:flex;align-items:center;justify-content:space-between;gap:6px;border-top:1px solid var(--line);padding-top:9px}
.card-f .sel{padding-block:4px;font-size:12px;border-radius:8px}
.more-row{text-align:center;font-size:12.5px;color:var(--muted);padding:6px}
.money{display:flex;justify-content:space-between;align-items:flex-end;background:var(--sunk);border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.money small{display:block;font-size:11px;color:var(--muted)}
.money b{font-size:15px;font-variant-numeric:tabular-nums}
.consume{display:flex;flex-direction:column;gap:5px;border-radius:9px;padding:7px 9px;font-size:12px;font-weight:600}
.consume .bar{height:5px;border-radius:99px;background:rgba(127,127,127,.2);overflow:hidden}
.consume .bar i{display:block;height:100%;border-radius:99px}
.consume .top{display:flex;justify-content:space-between;align-items:center;gap:6px}


.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh-1);min-width:0}
.panel-h{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.panel-h h3{margin:0;font-size:15px;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.panel-h p{margin:0;color:var(--muted);font-size:12.5px;flex-basis:100%}
.panel-b{padding:16px}
.tbl-wrap{overflow-x:auto}
table.tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
.tbl th{position:sticky;top:0;background:var(--sunk);text-align:start;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl th button{border:0;background:none;padding:0;font:inherit;color:inherit;text-transform:inherit;letter-spacing:inherit;display:inline-flex;gap:4px;align-items:center}
.tbl th button.on{color:var(--brand-text)}
.tbl td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tbody tr{cursor:pointer;transition:background .12s}
.tbl tbody tr:hover{background:var(--sunk)}
.tbl td.strong{font-weight:700}
.tbl .sel{padding-block:4px;font-size:12px;border-radius:8px}
.tbl tfoot td{padding:12px;font-weight:700;border-top:1px solid var(--line)}
.pager{display:flex;align-items:center;gap:10px;padding:12px 16px;justify-content:space-between;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}


.grid{display:grid;gap:14px}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr))}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--sh-1);display:flex;flex-direction:column;gap:4px;position:relative;min-width:0}
.kpi .lbl{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.kpi .val{font-size:28px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1.2}
.kpi .val small{font-size:14px;font-weight:600;color:var(--muted);letter-spacing:0}
.kpi .sub{font-size:12.5px;color:var(--muted)}
.kpi .ic{position:absolute;inset-inline-end:14px;top:14px;width:34px;height:34px;border-radius:10px;display:grid;place-items:center}
.hbar{display:flex;flex-direction:column;gap:12px}
.hbar-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center;border:0;background:none;padding:0;text-align:start;width:100%;color:var(--ink)}
.hbar-row .nm{display:flex;align-items:center;gap:8px;font-weight:600;font-size:13px;min-width:0}
.hbar-row .nm span.t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar-row .v{font-weight:700;font-variant-numeric:tabular-nums;font-size:13px}
.hbar-row .track{grid-column:1/-1;height:8px;border-radius:99px;background:var(--sunk);overflow:hidden}
.hbar-row .track i{display:block;height:100%;border-radius:99px;transition:width .4s ease}
button.hbar-row:hover .nm{color:var(--brand-text)}
.legend{display:flex;flex-direction:column;gap:6px}
.lg-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;align-items:center;font-size:13px;border:1px solid transparent;background:none;padding:6px 8px;border-radius:9px;text-align:start;width:100%;color:var(--ink)}
.lg-row:hover{background:var(--sunk)}
.lg-row.hl{background:var(--brand-soft);border-color:var(--brand-line)}
.donut-wrap{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:20px;align-items:center}
@media (max-width:640px){.donut-wrap{grid-template-columns:1fr}}
.donut-c .seg-arc{cursor:pointer;transition:stroke-width .15s,opacity .15s}
.donut-c.has-sel .seg-arc:not(.on){opacity:.35}
.dn-top,.dn-big,.dn-sub{pointer-events:none}
.dn-top{fill:var(--muted);font-size:10.5px;font-weight:700;letter-spacing:.08em} .dn-big{fill:var(--ink);font-size:28px;font-weight:800} .dn-sub{fill:var(--muted);font-size:11px}
.rep-card{border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px}
.rep-card .top{display:flex;gap:12px;align-items:center}
.progress{height:8px;border-radius:99px;background:var(--sunk);overflow:hidden}
.progress i{display:block;height:100%;border-radius:99px;background:var(--green-dot)}
.drill{border:1px solid var(--brand-line);background:var(--brand-soft);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:12px;animation:rise .18s ease}
.drill .mini{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px}
.drill .mini div{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.drill .mini small{display:block;font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.drill .mini b{font-size:18px;font-variant-numeric:tabular-nums}


.map-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:16px}
@media (max-width:1100px){.map-layout{grid-template-columns:1fr}}
.map-frame{border:1px solid var(--line);border-radius:14px;background:var(--surface);overflow:hidden;position:relative}
.map-svg{width:100%;height:auto;display:block}
.hx-bg{fill:var(--hex-ground);stroke:var(--canvas);stroke-width:1.5}
.hx{cursor:pointer}
.hx polygon{stroke:var(--surface);stroke-width:1.6;transition:opacity .15s}
.hx polygon.r0{fill:var(--surface);stroke:var(--line-2);stroke-width:1.2}
.hx:hover polygon,.hx.hl polygon{stroke:var(--ink);stroke-width:2.4}
.hx.new polygon{stroke:var(--gold);stroke-width:2}
.hx text{pointer-events:none;font-family:var(--f-sans);font-weight:700}
.map-svg.dim .hx:not(.hl) polygon{opacity:.35}
.r0{fill:var(--r0)}.r1{fill:var(--r1)}.r2{fill:var(--r2)}.r3{fill:var(--r3)}.r4{fill:var(--r4)}.r5{fill:var(--r5)}.r6{fill:var(--r6)}
.on-hi{fill:var(--r-on-hi)} .on-lo{fill:var(--r-on-lo)}
.map-note{fill:var(--faint);font-size:11px;font-family:var(--f-sans)}
.map-tip{position:fixed;z-index:90;pointer-events:none;background:var(--night);color:var(--on-night);border-radius:10px;padding:10px 12px;font-size:12px;box-shadow:var(--sh-3);min-width:190px}
.map-tip b{display:block;font-size:13px;margin-bottom:4px}
.map-tip .r{display:flex;justify-content:space-between;gap:16px;color:var(--night-muted)}
.map-tip .r span:last-child{color:var(--on-night);font-weight:600;font-variant-numeric:tabular-nums}
.scale{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);flex-wrap:wrap}
.scale svg{width:16px;height:16px}
.wl-list{max-height:520px;overflow:auto}


.overlay{position:fixed;inset:0;background:var(--scrim);backdrop-filter:blur(3px);z-index:60;display:flex;align-items:flex-start;justify-content:center;padding:max(24px,env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) 24px max(12px,env(safe-area-inset-left,0px));overflow-y:auto;animation:fade .15s ease}
@keyframes fade{from{opacity:0}}
@keyframes rise{from{transform:translateY(8px);opacity:0}}
.dialog{background:var(--surface);border-radius:20px;box-shadow:var(--sh-3);width:100%;max-width:640px;border:1px solid var(--line);animation:rise .18s ease;display:flex;flex-direction:column;min-width:0;margin-block:auto}
.no-anim,.no-anim .dialog{animation:none!important}
.dialog.wide{max-width:1180px} .dialog.mid{max-width:860px}
.dlg-h{display:flex;align-items:center;gap:14px;padding:18px 22px;border-bottom:1px solid var(--line);border-radius:20px 20px 0 0;flex-wrap:wrap}
.dlg-h .ico{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand-text);flex:none}
.dlg-h .ico.solid{background:var(--brand);color:#fff}
.dlg-h h2{margin:0;font-size:19px;letter-spacing:-.02em;line-height:1.25;overflow-wrap:anywhere}
.dlg-h p{margin:2px 0 0;color:var(--muted);font-size:12.5px}
.dlg-h .h-acts{display:flex;align-items:center;gap:6px;margin-inline-start:auto}
.dlg-b{padding:20px 22px;display:flex;flex-direction:column;gap:16px}
.dlg-f{display:flex;align-items:center;gap:10px;justify-content:flex-end;padding:14px 22px;border-top:1px solid var(--line);background:var(--sunk);border-radius:0 0 20px 20px;flex-wrap:wrap}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.split>div{padding:20px 22px;display:flex;flex-direction:column;gap:14px;min-width:0}
.split>div+div{border-inline-start:1px solid var(--line);background:var(--canvas)}
@media (max-width:860px){.split{grid-template-columns:1fr}.split>div+div{border-inline-start:0;border-top:1px solid var(--line)}}

.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label,.field .lab{font-size:12.5px;font-weight:700;color:var(--ink-2);display:flex;align-items:center;gap:8px}
.field .lab .link{margin-inline-start:auto}
.req{color:var(--rose)}
.inp{border:1px solid var(--line);border-radius:10px;padding:9px 11px;background:var(--surface);color:var(--ink);width:100%;min-width:0;outline:none;transition:border-color .15s,box-shadow .15s}
.inp::placeholder,.search input::placeholder{color:var(--faint)}
.inp:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(99,102,241,.16)}
.inp:disabled{background:var(--sunk);color:var(--faint)}
textarea.inp{resize:vertical;min-height:70px}
.f2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:14px}
.help{font-size:11.5px;color:var(--muted)}
.err{font-size:12px;color:var(--rose);font-weight:600}

.ig{display:flex;border:1px solid var(--line);border-radius:10px;background:var(--surface);overflow:hidden;direction:ltr}
.ig:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px rgba(99,102,241,.16)}
.ig .cc{display:flex;align-items:center;gap:7px;padding:0 11px;background:var(--sunk);color:var(--ink-2);font-weight:700;font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
.ig .cc.start{border-right:1px solid var(--line)} .ig .cc.end{border-left:1px solid var(--line)}
.ig input{border:0;outline:none;padding:10px 11px;flex:1;min-width:0;background:var(--surface);color:var(--ink);font-variant-numeric:tabular-nums;font-size:14px;font-weight:600}
.ig input.phone-in{font-family:var(--f-mono);font-size:13.5px;letter-spacing:.02em;font-weight:500}
.ig.wa-ig{border-color:var(--wa-line);background:var(--surface)}
.ig.wa-ig .cc{background:var(--wa-bg);color:var(--wa-ink);border-color:var(--wa-line)}
.box{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--sunk);display:flex;flex-direction:column;gap:12px}
.box-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.box-h b{font-size:14px}
.box.wa-box{background:var(--wa-bg);border-color:var(--wa-line);color:var(--wa-ink)}
.box.wa-box .help{color:var(--wa-ink);opacity:.85}
.box.wa-box .box-h svg{color:var(--wa-text)}
.box.svc-box{background:var(--surface);border-color:var(--brand-line)}
.box.svc-box .box-h{padding-bottom:10px;border-bottom:1px solid var(--line)}
.contact-card{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:12px;display:flex;flex-direction:column;gap:10px}
.contact-card.main{border-color:var(--brand-line);box-shadow:0 0 0 3px rgba(99,102,241,.1)}
.contact-card .ch{display:flex;align-items:center;gap:8px}
.radio{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer}
.radio input{accent-color:var(--brand)}
.switch{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;cursor:pointer}
.switch input{appearance:none;-webkit-appearance:none;width:34px;height:20px;border-radius:99px;background:var(--line-2);position:relative;transition:background .15s;cursor:pointer;margin:0;flex:none}
.switch input::after{content:"";position:absolute;inset-inline-start:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:var(--sh-1);transition:transform .15s}
.switch input:checked{background:var(--brand)}
.switch input:checked::after{transform:translateX(14px)}
[dir=rtl] .switch input:checked::after{transform:translateX(-14px)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:6px 12px;font-size:12.5px;font-weight:600;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px;min-height:32px}
.chip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.chip:hover:not(.on){border-color:var(--brand-line)}
.inline-add{display:flex;gap:6px}
.inline-add .inp{padding:6px 9px;font-size:12.5px}
.paytog{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.paytog button{border:1.5px solid var(--line);background:var(--surface);border-radius:12px;padding:11px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px;color:var(--ink-2)}
.paytog button .d{width:10px;height:10px;border-radius:50%}
.paytog button.on.paid{border-color:var(--green-dot);background:var(--green-bg);color:var(--green)}
.paytog button.on.unpaid{border-color:var(--rose-dot);background:var(--rose-bg);color:var(--rose)}
.combo{position:relative}
.combo-list{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--raised);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-3);max-height:260px;overflow:auto;z-index:5;padding:4px}
.combo-list button{display:flex;width:100%;border:0;background:none;padding:8px 10px;border-radius:8px;text-align:start;gap:10px;align-items:center;color:var(--ink)}
.combo-list button:hover,.combo-list button.act{background:var(--brand-soft)}
.combo-list small{color:var(--muted);margin-inline-start:auto;font-size:11.5px}
.preview-card{border:1px solid var(--brand-line);background:var(--brand-soft);border-radius:12px;padding:12px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center}
.quota{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:10px}
.q-cell{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:10px;display:flex;flex-direction:column;gap:8px}
.q-cell .qh{display:flex;align-items:center;gap:7px;font-weight:700;font-size:12.5px}
.stepper-n{display:grid;grid-template-columns:40px minmax(0,1fr) 40px;border:1px solid var(--line);border-radius:10px;overflow:hidden;direction:ltr}
.stepper-n button{border:0;background:var(--sunk);font-size:18px;font-weight:700;color:var(--ink-2);min-height:40px}
.stepper-n button:hover{background:var(--line)}
.stepper-n input{border:0;text-align:center;font-weight:800;font-size:16px;min-width:0;font-variant-numeric:tabular-nums;background:var(--surface);color:var(--ink);outline:none}
.q-total{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px dashed var(--line-2);padding-top:10px;font-weight:700}
.qmeter{display:flex;flex-direction:column;gap:5px;min-width:0}
.qmeter .t{display:flex;justify-content:space-between;font-size:12px;font-weight:600;gap:6px}
.qmeter .progress{height:6px}

.script{border:1px solid var(--script-line);background:var(--script-bg);border-radius:14px;overflow:hidden}
.script-h{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--script-line);font-weight:700;color:var(--ty-reel);font-size:13px;flex-wrap:wrap}
.script-h .help{color:var(--ink-2);opacity:.8;font-weight:500}
.script-ed{margin:0;padding:12px 16px 14px 34px;min-height:200px;outline:none;color:var(--ink);font-size:14px;line-height:1.75;list-style:none;counter-reset:sl;
  background-image:repeating-linear-gradient(to bottom,transparent 0,transparent calc(1.75em - 1px),var(--script-rule) calc(1.75em - 1px),var(--script-rule) 1.75em);background-position:0 12px;background-attachment:local}
[dir=rtl] .script-ed{padding:12px 34px 14px 16px}
.script-ed li{position:relative;padding-inline-start:4px;min-height:1.75em;unicode-bidi:plaintext}
.script-ed li::before{content:"";position:absolute;inset-inline-start:-16px;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--script-bullet);box-shadow:0 0 0 3px color-mix(in srgb,var(--script-bullet) 22%,transparent)}
.script-ed:focus{box-shadow:inset 0 0 0 2px var(--script-bullet)}
.script-ed:empty::after{content:attr(data-ph);color:var(--faint)}
.script-ro{margin:0;padding:10px 16px 12px 34px;list-style:none;line-height:1.75}
[dir=rtl] .script-ro{padding:10px 34px 12px 16px}
.script-ro li{position:relative;unicode-bidi:plaintext}
.script-ro li::before{content:"";position:absolute;inset-inline-start:-16px;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--script-bullet)}


.stepper{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px;overflow-x:auto}
.step{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:7px 4px;display:flex;flex-direction:column;align-items:center;gap:1px;font-size:12px;font-weight:600;color:var(--ink-2);min-width:64px}
.step span:first-child{font:500 10.5px var(--f-mono);color:var(--faint)}
.step span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding-inline:3px}
.step.done{background:var(--green-bg);border-color:transparent;color:var(--green)}
.step.cur{background:var(--brand);border-color:var(--brand);color:#fff}
.step.cur span:first-child{color:rgba(255,255,255,.7)}
.step.bad{background:var(--rose-bg);border-color:transparent;color:var(--rose)}
.kv{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface)}
.kv>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;font-size:13px;flex-wrap:wrap}
.kv>div+div{border-top:1px solid var(--line)}
.kv .k{color:var(--muted);font-weight:500}
.kv .v{font-weight:600;text-align:end;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;min-width:0}
.sec-t{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:8px}
.sec-t .link{margin-inline-start:auto;text-transform:none;letter-spacing:0}
.night{background:radial-gradient(120% 140% at 100% 0%,var(--night-2) 0%,var(--night) 60%);color:var(--on-night);border-radius:16px;padding:18px 20px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--line)}
.night .lbl{font-size:11.5px;font-weight:700;letter-spacing:.1em;color:var(--night-muted);text-transform:uppercase}
.night .big{font-size:40px;font-weight:800;letter-spacing:-.04em;font-variant-numeric:tabular-nums;line-height:1}
.night .bar{height:6px;border-radius:99px;background:rgba(255,255,255,.12);overflow:hidden}
.night .bar i{display:block;height:100%;background:linear-gradient(90deg,#818CF8,#34D399);border-radius:99px}
.night hr{border:0;border-top:1px solid rgba(255,255,255,.1);margin:4px 0}
.night .muted{color:var(--night-muted)}


.composer{border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:12px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--sh-1)}
.ltabs{display:flex;gap:6px;flex-wrap:wrap}
.ltabs button{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--sunk);border-radius:9px;padding:6px 11px;font-size:12.5px;font-weight:600;color:var(--ink-2)}
.ltabs button.on{background:var(--brand);border-color:var(--brand);color:#fff}
.sig{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);flex-wrap:wrap}
.sig b{color:var(--ink)}
.log{display:flex;flex-direction:column}
.log-item{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:10px 0;position:relative}
.log-item::before{content:"";position:absolute;inset-inline-start:13.5px;top:38px;bottom:-4px;width:1px;background:var(--line)}
.log-item:last-child::before{display:none}
.log-item .av{width:28px;height:28px;font-size:11px}
.log-item .lh{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}
.log-item .lh time{margin-inline-start:auto;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.log-item p{margin:4px 0 0;font-size:13px;color:var(--ink-2);unicode-bidi:plaintext}
.kind{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:1px 7px;border-radius:6px;background:var(--sunk);color:var(--muted)}


.hub{display:grid;grid-template-columns:260px minmax(0,1fr);gap:16px;align-items:start}
.roster{display:flex;flex-direction:column;gap:6px;position:sticky;top:80px}
.roster-item{display:flex;gap:10px;align-items:center;border:1px solid transparent;background:none;border-radius:12px;padding:8px;text-align:start;width:100%;color:var(--ink)}
.roster-item:hover{background:var(--surface);border-color:var(--line)}
.roster-item.on{background:var(--surface);border-color:var(--brand-line);box-shadow:var(--sh-1)}
.roster-item .meta{min-width:0;flex:1}
.roster-item b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.roster-item small{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-prog{height:4px;border-radius:99px;background:var(--line);margin-top:5px;overflow:hidden}
.mini-prog i{display:block;height:100%;background:var(--green-dot)}
.cal-wrap{overflow-x:auto}
.cal{display:grid;grid-template-columns:repeat(7,minmax(118px,1fr));border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--line);gap:1px;min-width:840px}
.cal .dow{background:var(--sunk);padding:9px 10px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.cal .day{background:var(--surface);min-height:132px;padding:8px;display:flex;flex-direction:column;gap:5px;min-width:0}
.cal .day.out{background:var(--canvas)}
.cal .day.out .dn{color:var(--faint)}
.cal .day.today{box-shadow:inset 0 0 0 2px var(--brand-line)}
.cal .dn{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.cal .day.today .dn span{background:var(--brand);color:#fff;border-radius:7px;padding:0 6px}
.cal .add{opacity:0;width:24px;height:24px}
.cal .day:hover .add,.cal .add:focus{opacity:1}
.agenda{display:none;flex-direction:column;gap:10px}
.ag-day{display:grid;grid-template-columns:52px minmax(0,1fr);gap:10px;align-items:start}
.ag-date{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:6px 0;text-align:center;line-height:1.1}
.ag-date b{display:block;font-size:20px;font-variant-numeric:tabular-nums}
.ag-date small{font-size:10.5px;color:var(--muted);font-weight:700;text-transform:uppercase}
.ag-day.today .ag-date{background:var(--brand);border-color:var(--brand);color:#fff}
.ag-day.today .ag-date small{color:rgba(255,255,255,.8)}
.ag-items{display:flex;flex-direction:column;gap:6px}
.cpill{display:flex;flex-direction:column;gap:3px;border-radius:9px;padding:6px 7px;border:1px solid;text-align:start;width:100%;font-size:12px;min-width:0}
.cpill .ct{display:flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase}
.cpill .ct .sd{margin-inline-start:auto;width:8px;height:8px;border-radius:50%;flex:none}
.cpill .ttl{font-weight:600;color:var(--ink);line-height:1.35;overflow-wrap:anywhere;unicode-bidi:plaintext}
.cpill.canceled .ttl{text-decoration:line-through;color:var(--muted)}
.cpill .ad-l{font-weight:600;color:var(--ty-ad);font-variant-numeric:tabular-nums}
.ty-post{background:var(--ty-post-bg);border-color:var(--ty-post-line)}.ty-post .ct{color:var(--ty-post)}
.ty-carousel{background:var(--ty-car-bg);border-color:var(--ty-car-line)}.ty-carousel .ct{color:var(--ty-car)}
.ty-reel{background:var(--ty-reel-bg);border-color:var(--ty-reel-line)}.ty-reel .ct{color:var(--ty-reel)}
.ty-story{background:var(--ty-story-bg);border-color:var(--ty-story-line)}.ty-story .ct{color:var(--ty-story)}
.ty-ad{background:linear-gradient(135deg,var(--ty-ad-bg),var(--gold-soft));border-color:var(--gold)}.ty-ad .ct{color:var(--ty-ad)}
.ad-banner{border:1.5px solid var(--gold);border-radius:14px;background:linear-gradient(135deg,var(--ty-ad-bg) 0%,var(--gold-soft) 100%);padding:14px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,130px),1fr));gap:12px}
.ad-banner .h{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-weight:700;color:var(--ty-ad)}
.ad-banner small{display:block;font-size:11px;color:var(--ty-ad);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.ad-banner b{font-size:16px;font-variant-numeric:tabular-nums}
.typ-legend{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.hub-head{display:flex;align-items:center;gap:12px;padding:14px 16px;flex-wrap:wrap}


.portal{position:fixed;inset:0;z-index:55;background:var(--canvas);overflow-y:auto;animation:fade .2s ease}
.portal-bar{position:sticky;top:0;z-index:2;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-block:12px;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.preview-ribbon{background:var(--night);color:var(--on-night);font-size:12.5px;display:flex;align-items:center;gap:10px;justify-content:center;padding:8px 16px;flex-wrap:wrap}
.preview-ribbon .btn{padding:4px 10px;font-size:12px;min-height:28px}
.portal-body{padding-block:20px 48px;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px));display:flex;flex-direction:column;gap:16px;max-width:1400px;margin:0 auto}
.lang{display:inline-flex;border:1px solid var(--line);border-radius:10px;padding:3px;gap:2px;background:var(--sunk)}
.lang button{border:0;background:none;border-radius:7px;padding:5px 11px;font-weight:700;font-size:12px;color:var(--muted)}
.lang button.on{background:var(--surface);color:var(--ink);box-shadow:var(--sh-1)}
.ro-badge{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--muted);background:var(--sunk);border-radius:99px;padding:3px 10px}


.imp-cts{display:flex;flex-direction:column;gap:6px;min-width:600px;align-items:flex-start}
.imp-ct{display:grid;grid-template-columns:26px minmax(150px,1fr) 160px 210px 28px;gap:6px;align-items:center;width:100%;padding:4px;border-radius:10px;border:1px solid transparent}
.imp-ct.main{background:var(--brand-soft);border-color:var(--brand-line)}
.imp-ct .ig{border-radius:8px}.imp-ct .ig .cc{padding:0 8px;font-size:12px;gap:5px}.imp-ct .ig input{padding:5px 8px;font-size:12.5px}
.imp-ct .ig.bad{border-color:var(--amber-dot);box-shadow:0 0 0 2px color-mix(in srgb,var(--amber-dot) 20%,transparent)}
.imp-ct .icon-btn{width:28px;height:28px}
.imp-star{border:0;background:none;font-size:17px;line-height:1;color:var(--faint);width:26px;height:28px;border-radius:7px}
.imp-ct.main .imp-star{color:var(--amber-dot)}.imp-star:hover{background:var(--sunk);color:var(--amber-dot)}
.imp-cts .link{margin:2px 0 2px 34px}
.imp-ms{position:relative;min-width:190px}
.imp-ms summary{list-style:none;display:flex;flex-wrap:wrap;gap:4px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:4px 26px 4px 6px;background:var(--surface);cursor:pointer;min-height:32px;position:relative}
.imp-ms summary::-webkit-details-marker{display:none}
.imp-ms summary>svg{position:absolute;inset-inline-end:7px;top:9px;color:var(--faint)}
.imp-ms[open] summary{border-color:var(--brand);box-shadow:0 0 0 3px rgba(99,102,241,.16)}
.imp-ms .tag{font-size:11.5px;padding:1px 7px}
.imp-ms-pop{position:absolute;z-index:6;top:calc(100% + 4px);inset-inline-start:0;min-width:220px;max-height:260px;overflow:auto;background:var(--raised);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-3);padding:4px}
.imp-ms-opt{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:8px;font-size:13px;cursor:pointer}
.imp-ms-opt:hover{background:var(--brand-soft)}.imp-ms-opt input{accent-color:var(--brand)}
.bulk{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--brand-soft);border:1px solid var(--brand-line);border-radius:14px;padding:8px 12px;margin-bottom:10px;position:sticky;top:70px;z-index:6;box-shadow:var(--sh-2)}
.bulk-n{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--brand-ink)}
.bulk .sel{padding-block:6px;font-size:12.5px}
th.selc,td.selc{width:40px;padding-inline:8px 0!important}
.selhit{display:grid;place-items:center;width:28px;height:28px;border-radius:7px;cursor:pointer}
.selhit:hover{background:var(--brand-soft)}.selbox{accent-color:var(--brand);width:16px;height:16px;cursor:pointer}
.tbl tbody tr.picked{background:var(--brand-soft)}
.dropzone{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;border:1.5px dashed var(--line-2);border-radius:14px;padding:28px 16px;background:var(--surface);cursor:pointer;color:var(--ink-2);transition:border-color .15s,background .15s}
.dropzone:hover,.dropzone.drop{border-color:var(--brand);background:var(--brand-soft)}
.imp-sum{display:flex;align-items:center;gap:10px;flex-wrap:wrap;position:sticky;top:64px;z-index:5;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;box-shadow:var(--sh-1)}
.imp-wrap{border:1px solid var(--line);border-radius:12px;max-height:70vh}
.imp-tbl td{vertical-align:top;padding:6px 8px}.imp-tbl tbody tr{cursor:default}
.imp-tbl .inp,.imp-tbl .sel{padding:5px 8px;font-size:12.5px;border-radius:8px}
.imp-tbl textarea.inp.imp-in{min-height:0;height:auto;resize:vertical;line-height:1.45}
.imp-tbl tr.off td{opacity:.5}.imp-tbl tr.off td:first-child,.imp-tbl tr.off td.imp-iss{opacity:1}
.imp-iss>div{min-width:250px;display:flex;flex-wrap:wrap;gap:4px}.imp-iss .b{white-space:normal;line-height:1.35;padding-block:3px}
.set-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:16px;align-items:start}
.set-nav{display:flex;flex-direction:column;gap:4px;position:sticky;top:80px}
.set-nav button{display:flex;align-items:center;gap:10px;border:1px solid transparent;background:none;border-radius:10px;padding:10px 12px;text-align:start;font-weight:600;color:var(--ink-2)}
.set-nav button:hover{background:var(--surface)}
.set-nav button.on{background:var(--surface);border-color:var(--brand-line);color:var(--brand-text);box-shadow:var(--sh-1)}
.set-nav button .soon{margin-inline-start:auto;font-size:10.5px;font-weight:700;color:var(--faint);text-transform:uppercase;letter-spacing:.05em}
.list-tabs{display:flex;gap:6px;flex-wrap:wrap}
.opt-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden;max-height:420px;overflow-y:auto;background:var(--surface)}
.opt{display:flex;align-items:center;gap:8px;padding:7px 10px;font-size:13px;background:var(--surface);color:var(--ink);min-height:44px}
.opt+.opt{border-top:1px solid var(--line)}
.opt .n{font:500 11px var(--f-mono);color:var(--faint);width:22px}
.opt input.inp{padding:5px 8px;font-size:13px}
.tbl-team th,.tbl-team td{padding-inline:7px}.tbl-team th:first-child,.tbl-team td:first-child{padding-inline-start:14px}.tbl-team .switch{gap:6px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pwc{display:inline-flex;align-items:center;gap:2px;white-space:nowrap}.pwc .mono{font-size:13px;min-width:86px;margin-inline-end:2px}
.pw{font:600 14px var(--f-mono);background:var(--sunk);border:1px dashed var(--line-2);border-radius:10px;padding:10px 12px;display:flex;align-items:center;gap:10px;justify-content:space-between;direction:ltr}
.theme-pick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.theme-pick button{border:1.5px solid var(--line);background:var(--surface);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px;align-items:center;font-weight:600;color:var(--ink-2)}
.theme-pick button.on{border-color:var(--brand);color:var(--brand-text);box-shadow:0 0 0 3px rgba(99,102,241,.14)}
.theme-pick .sw{width:100%;height:46px;border-radius:8px;border:1px solid var(--line)}


.palette{max-width:640px;margin-top:8vh}
.pal-in{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);color:var(--muted)}
.pal-in input{border:0;outline:none;flex:1;font-size:16px;min-width:0;background:none;color:var(--ink)}
.pal-res{max-height:420px;overflow-y:auto;padding:6px}
.pal-grp{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);padding:10px 12px 4px}
.pal-item{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;border-radius:10px;padding:9px 12px;text-align:start;color:var(--ink)}
.pal-item.act,.pal-item:hover{background:var(--brand-soft)}
.pal-item small{margin-inline-start:auto;color:var(--muted);font-size:12px}

.toast{position:fixed;left:50%;bottom:max(24px,calc(env(safe-area-inset-bottom,0px) + 16px));transform:translateX(-50%);background:var(--night);color:var(--on-night);border:1px solid var(--line);border-radius:12px;padding:10px 16px;font-size:13px;font-weight:600;z-index:95;box-shadow:var(--sh-3);display:flex;align-items:center;gap:8px;animation:rise .2s ease;max-width:calc(100% - 32px)}
.empty{padding:40px 16px;text-align:center;color:var(--muted)}
.tabbar,.fab{display:none}


.dash-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dash{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.dash>.w{min-width:0;position:relative}
.dash>.w.full{grid-column:1/-1}
@media (max-width:1000px){.dash{grid-template-columns:minmax(0,1fr)}}
.dash.editing>.w{outline:2px dashed var(--brand-line);outline-offset:3px;border-radius:16px;cursor:grab}
.dash.editing>.w.dragging{opacity:.4}
.dash.editing>.w.drop-before{box-shadow:0 -4px 0 var(--brand)}
.w-tools{display:flex;gap:2px;margin-inline-start:auto;align-items:center}
.w-tools .icon-btn{width:30px;height:30px}
.w-kpi-bar{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.add-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:160px;border:1.5px dashed var(--line-2);border-radius:16px;background:none;color:var(--muted);font-weight:600}
.add-tile:hover{border-color:var(--brand);color:var(--brand-text)}
.lib-item{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--surface);width:100%;text-align:start;color:var(--ink)}
.lib-item:hover{border-color:var(--brand-line)}
.lib-item small{display:block;color:var(--muted);font-size:12px}


.assignee-bar{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.assignee-bar::-webkit-scrollbar{display:none}
.a-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:4px 12px 4px 4px;font-weight:600;font-size:13px;white-space:nowrap;color:var(--ink-2);min-height:36px;flex:none}
[dir=rtl] .a-chip{padding:4px 4px 4px 12px}
.a-chip .n{font-size:11.5px;font-weight:700;color:var(--muted);background:var(--sunk);border-radius:99px;padding:0 7px;min-width:22px;text-align:center}
.a-chip.on{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-ink)}
.a-chip.on .n{background:var(--surface);color:var(--brand-ink)}
.a-chip .all{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--sunk);color:var(--muted)}
.task-card .ttl{font-weight:700;font-size:14px;line-height:1.35;overflow-wrap:anywhere;unicode-bidi:plaintext}
.prio{width:8px;height:8px;border-radius:50%;flex:none;margin-top:6px}
.prio.low{background:var(--slate-dot)} .prio.normal{background:var(--sky-dot)} .prio.high{background:var(--amber-dot)} .prio.urgent{background:var(--rose-dot);box-shadow:0 0 0 3px var(--rose-bg)}
.client-line{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--ink-2);min-width:0}
.client-line span.t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.internal{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--slate);background:var(--slate-bg);border-radius:6px;padding:2px 8px}
.rel{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:9px;padding:6px 8px;font-size:12px;background:var(--sunk);min-width:0;color:var(--ink-2)}
.rel .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;unicode-bidi:plaintext}
.rel.content{border-color:var(--ty-reel-line)} .rel.deal{border-color:var(--gold)}
.due{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;border-radius:7px;padding:2px 8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.due.ok{background:var(--sunk);color:var(--ink-2)} .due.soon{background:var(--amber-bg);color:var(--amber)} .due.late{background:var(--rose-bg);color:var(--rose)} .due.done{background:var(--green-bg);color:var(--green)}
.col.paid-col .col-h{box-shadow:inset 0 3px 0 var(--gold)}
.fee{font-weight:700;font-variant-numeric:tabular-nums;font-size:12.5px}
.seg-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.seg-pick button{border:1.5px solid var(--line);background:var(--surface);border-radius:12px;padding:10px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px;color:var(--ink-2);min-height:44px}
.seg-pick button.on{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-ink)}
.pick-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;max-height:240px;overflow-y:auto;background:var(--surface)}
.pick-list button{display:flex;align-items:center;gap:10px;border:0;border-bottom:1px solid var(--line);background:none;padding:9px 12px;text-align:start;color:var(--ink);min-height:44px}
.pick-list button:last-child{border-bottom:0}
.pick-list button:hover{background:var(--sunk)}
.pick-list button.on{background:var(--brand-soft)}
.pick-list .meta{flex:1;min-width:0}
.pick-list .meta b{display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;unicode-bidi:plaintext}
.pick-list .meta small{color:var(--muted);font-size:11.5px}


.perm-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:1100px){.perm-layout{grid-template-columns:1fr}}
.who-list{display:flex;flex-direction:column;gap:4px}
.who-item{display:flex;align-items:center;gap:10px;border:1px solid transparent;background:none;border-radius:12px;padding:9px 10px;text-align:start;width:100%;color:var(--ink)}
.who-item:hover{background:var(--sunk)}
.who-item.on{background:var(--brand-soft);border-color:var(--brand-line)}
.who-item .meta{flex:1;min-width:0}
.who-item b{display:block;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who-item small{display:block;color:var(--muted);font-size:11.5px}
.role-dot{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;flex:none}
.pm{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
.pm th{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:8px 10px;text-align:center;white-space:nowrap;background:var(--sunk);border-bottom:1px solid var(--line)}
.pm th:first-child{text-align:start}
.pm td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:center}
.pm td:first-child{text-align:start}
.pm tr.mod-row td{background:var(--canvas);font-weight:700;padding-block:11px}
.pm tr.mod-row td:first-child{display:flex;align-items:center;gap:8px}
.pm .comp{padding-inline-start:30px;color:var(--ink-2)}
.pm .comp small{display:block;color:var(--muted);font-size:11.5px;font-weight:400}
.pc{appearance:none;-webkit-appearance:none;width:22px;height:22px;border-radius:7px;border:1.5px solid var(--line-2);background:var(--surface);display:inline-grid;place-items:center;cursor:pointer;margin:0;vertical-align:middle;position:relative}
.pc:checked{background:var(--brand);border-color:var(--brand)}
.pc:checked::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translate(-1px,-1px)}
.pc:indeterminate{background:var(--brand-soft);border-color:var(--brand)}
.pc:indeterminate::after{content:"";width:10px;height:2.5px;background:var(--brand-text);border-radius:2px}
.pc:disabled{opacity:.55;cursor:not-allowed}
.pc.ovr{box-shadow:0 0 0 3px rgba(245,158,11,.35)}
.pm th.grp{border-inline-start:1px solid var(--line)}
.pm tr.sub th{font-size:10px;padding:4px 6px;background:var(--canvas);letter-spacing:.08em}
.pm tr.sub th:nth-child(odd){border-inline-start:1px solid var(--line)}
.pm td.own{border-inline-start:1px solid var(--line);background:color-mix(in srgb,var(--sunk) 55%,transparent)}
.pm td.add{border-inline-start:1px solid var(--line)}
.pc.own{border-style:dashed}
.pc.own:checked{border-style:solid;background:var(--sky-dot);border-color:var(--sky-dot)}
.pm-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);align-items:center}
.locked-note{display:flex;gap:10px;align-items:center;border:1px solid var(--brand-line);background:var(--brand-soft);color:var(--brand-ink);border-radius:12px;padding:10px 12px;font-size:13px;font-weight:600}


@media (max-width:1200px) and (min-width:901px){
  .app{--rail:76px!important}
  .app:not(.pinned) .brand .full,.app:not(.pinned) .brand small,.app:not(.pinned) .rail-label,.app:not(.pinned) .nav-btn .t,.app:not(.pinned) .nav-btn .count,.app:not(.pinned) .nav-btn .kb,.app:not(.pinned) .rail-foot .who-t,.app .collapse-btn,.app .rail-resize{display:none}
  .app:not(.pinned) .brand{align-items:center;padding-inline:0} .app:not(.pinned) .brand .mark{display:block}
  .app:not(.pinned) .nav-btn{grid-template-columns:1fr;justify-items:center;padding:10px 0} .app:not(.pinned) .nav-btn .dotc{display:block}
  .kbar .kbd{display:none}
}
@media (max-width:1000px){
  .hub{grid-template-columns:1fr}
  .roster{position:static;flex-direction:row;overflow-x:auto;gap:8px;padding-bottom:4px;scroll-snap-type:x proximity}
  .roster-item{flex:none;width:220px;background:var(--surface);border-color:var(--line);scroll-snap-align:start}
  .roster .roster-head,.roster .help{display:none}
  .roster .add-ret{flex:none;margin:0!important}
  .set-layout{grid-template-columns:1fr}
  .set-nav{position:static;flex-direction:row;overflow-x:auto}
  .set-nav button{flex:none}
}

@media (max-width:900px){
  .app{grid-template-columns:minmax(0,1fr)}
  .rail{display:none}
  .topbar{gap:8px;min-height:56px;padding-block:8px}
  .kbar{flex:0 0 auto;min-width:0;width:38px;height:38px;padding:0;justify-content:center;border-radius:10px}
  .kbar span{display:none}
  .tb-title{flex:1}
  .tb-title .live{display:none}
  .tb-right .btn.cta,.user-btn .nm{display:none}
  .user-btn{padding:3px;border-radius:99px}
  .lang-btn .lname{display:none}
  .ws{padding-block:14px calc(96px + env(safe-area-inset-bottom,0px))}
  .tabbar{display:grid;grid-template-columns:repeat(var(--tabs,5),1fr);position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--topbar);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:6px max(8px,env(safe-area-inset-left,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-right,0px))}
  .tabbar button{border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;font-weight:600;color:var(--muted);padding:6px 2px;border-radius:10px;min-height:48px}
  .tabbar button.on{color:var(--brand-text)}
  .tabbar button.on svg{background:var(--brand-soft);border-radius:99px;padding:3px 10px;width:42px;height:26px}
  .fab{display:grid;place-items:center;position:fixed;inset-inline-end:max(16px,env(safe-area-inset-right,0px));bottom:calc(76px + env(safe-area-inset-bottom,0px));width:54px;height:54px;border-radius:16px;border:0;background:var(--brand);color:#fff;box-shadow:0 10px 24px -6px rgba(79,70,229,.55);z-index:44}
  .fab svg{width:24px;height:24px}
  .f-toggle{display:inline-flex}
  .filters .f-more{display:none}
  .filters.open .f-more{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
  .filters.open .f-more .sel{width:100%}
  .filters .search{flex:1 1 0}
  .subnav .spacer{display:none}
  .board{grid-auto-columns:minmax(84vw,1fr)}
  .overlay{padding:0;align-items:stretch}
  .dialog,.dialog.wide,.dialog.mid{max-width:none;border-radius:0;min-height:100%;border:0;margin:0}
  .dlg-h{border-radius:0;position:sticky;top:0;z-index:3;background:var(--surface);padding-top:max(14px,env(safe-area-inset-top,0px))}
  .dlg-f{border-radius:0;position:sticky;bottom:0;z-index:3;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
  .dlg-f .btn{flex:1}
  .dlg-b,.split>div{padding:16px}
  .palette{margin-top:0}
  .toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .kpi .val{font-size:24px}
  .g4{grid-template-columns:1fr 1fr}
  .map-layout{gap:12px}
}
@media (max-width:760px){
  .cal-wrap{display:none}
  .agenda{display:flex}
  .theme-pick{grid-template-columns:1fr 1fr 1fr}
}
@media (max-width:420px){.login-art .lg-name{font-size:52px}}


.bill-box{padding:0;gap:0}
.bill-h{appearance:none;border:0;background:none;font:inherit;color:inherit;text-align:start;display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:100%;min-height:48px;padding:12px 14px;cursor:pointer;border-radius:14px}
.bill-h:hover{background:color-mix(in srgb,var(--line) 40%,transparent)}
.bill-h:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.bill-h b{font-size:14px}
.bill-h>.i:first-child{color:var(--brand-text)}
.bill-sum{flex:1 1 160px;min-width:0}
.bill-chev{margin-inline-start:auto;transition:transform .2s ease}
.bill-box.open .bill-chev{transform:rotate(180deg)}
.bill-b .kv .v{align-items:center}
.bill-b{display:flex;flex-direction:column;gap:12px;padding:14px;border-top:1px solid var(--line)}
@media (prefers-reduced-motion:reduce){.bill-chev{transition:none}}


.ag-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,300px);gap:24px;align-items:start}
.ag-prev{position:sticky;top:84px;display:grid;gap:8px;min-width:0}
.ag-grid .field>label,.bill-b .field>label{display:block;line-height:1.45}
.kv .v.addr{flex-direction:column;align-items:flex-end;gap:0}
.ag-card{border:1px solid var(--line);border-radius:14px;background:var(--canvas);padding:16px;display:grid;gap:3px;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.ag-card .ag-name{font-size:16px;letter-spacing:-.01em}
.ag-ids{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line-2);display:grid;gap:3px}
.ag-add{align-self:flex-start;min-height:40px}
.ag-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--line)}
@media (max-width:1000px){.ag-grid{grid-template-columns:1fr}.ag-prev{position:static}}


.pf-dialog{max-width:1360px}
.pf-split{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:start}
.pf-form{padding:18px 22px;display:flex;flex-direction:column;gap:16px;min-width:0}
.pf-side{position:sticky;top:0;padding:18px 22px;background:var(--canvas);border-inline-start:1px solid var(--line);align-self:start;min-width:0;max-height:100vh;overflow:auto}
.pf-stage{background:var(--sunk);border:1px solid var(--line);border-radius:14px;padding:12px;overflow:hidden}
.pf-stage .pfd{box-shadow:0 6px 24px rgba(15,23,42,.14);margin-inline:auto}
.pf-box{border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:12px;background:var(--surface);min-width:0}
.pf-g3{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px}
.pf-prefix{width:64px;flex:none!important;text-transform:uppercase;font-weight:700}
.pf-sec{border:1px solid var(--line);border-radius:12px;background:var(--sunk);display:flex;flex-direction:column;min-width:0}
.pf-sec-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px;border-bottom:1px solid var(--line)}
.pf-sec-t{flex:1 1 200px;font-weight:700}
.pf-sec-acts,.pf-item-acts{display:inline-flex;gap:2px;flex:none}
.pf-items{display:flex;flex-direction:column;gap:6px;padding:10px}
.pf-item{display:grid;grid-template-columns:22px minmax(0,1fr) 128px auto;gap:6px;align-items:center}
.pf-item.priced{grid-template-columns:22px minmax(0,1fr) 150px auto}
.pf-n{color:var(--muted);font-size:12px;text-align:center}
.pf-det{display:flex;gap:4px;align-items:center}
.pf-det .inp{min-width:0}
.pf-det .icon-btn.on{background:var(--brand-soft);color:var(--brand-text)}
.pf-amt{min-width:0}.pf-amt input{text-align:end}
.pf-sec-f{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:0 10px 10px}
.pf-sec-f .pf-amt{width:170px}
.pf-total{font-size:13px;color:var(--muted)}.pf-total b{color:var(--ink);font-size:15px;margin-inline-start:6px}
.pf-note{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:6px;align-items:start}
.pf-note .pf-n{padding-top:10px}
.pf-ids summary{cursor:pointer;font-weight:600;font-size:13px;min-height:32px;display:flex;align-items:center;gap:6px}
.pf-mob{display:none;margin:12px 22px 0;flex:none}
.pf-view-bar{gap:8px}
.pf-tbl td{vertical-align:middle}
.ag-bank{border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px;background:var(--sunk)}
@media (max-width:1080px){
  .pf-split{grid-template-columns:1fr}
  .pf-mob{display:inline-flex;align-self:flex-start}
  .pf-split.mob-edit .pf-side{display:none}
  .pf-split.mob-prev .pf-form{display:none}
  .pf-side{position:static;border-inline-start:0}
}
@media (max-width:640px){
  .pf-g3{grid-template-columns:1fr 1fr}.pf-g3>.field:first-child{grid-column:1/-1}
  .pf-item,.pf-item.priced{grid-template-columns:20px minmax(0,1fr) auto;row-gap:6px}
  .pf-item>.pf-det,.pf-item>.pf-amt{grid-column:2/3;grid-row:2}
  .pf-item>.pf-item-acts{grid-column:3;grid-row:1/3;flex-direction:column}
  .pf-form,.pf-side{padding:14px}
  .pf-mob{margin-inline:14px}
}
.pf-link{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}
.pf-link-acts{display:flex;gap:6px;flex-wrap:wrap}
.pf-diff{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;padding:8px 10px;border-radius:10px;background:var(--amber-bg);color:var(--amber)}
.pf-diff span{flex:1 1 180px}


.pf-stage .ivd{box-shadow:0 6px 24px rgba(15,23,42,.14);margin-inline:auto}
.iv-lines{display:flex;flex-direction:column;gap:6px}
.iv-line,.iv-head{display:grid;grid-template-columns:22px minmax(0,1fr) 150px 64px auto;gap:6px;align-items:center}
.iv-head{font-size:11.5px;font-weight:700;margin-bottom:-6px}.iv-head span:nth-child(3){text-align:end}
.iv-qty{text-align:center}
@media (max-width:640px){
  .iv-head{display:none}
  .iv-line{grid-template-columns:20px minmax(0,1fr) 64px auto;row-gap:6px}
  .iv-line>.pf-amt{grid-column:2/3;grid-row:2}
  .iv-line>.iv-qty{grid-column:3;grid-row:2}
  .iv-line>.inp:not(.iv-qty){grid-column:2/4}
  .iv-line>.pf-item-acts{grid-column:4;grid-row:1/3;flex-direction:column}
}

.xr{display:flex;flex-direction:column;gap:6px}
.xr-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) auto;gap:6px;align-items:center}


.arch{border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;font-size:13px;background:var(--sunk)}
.arch.ok{border-color:var(--green-dot);background:var(--green-bg)}
.arch.changed{border-color:var(--amber-dot);background:var(--amber-bg)}
.arch>.row>span:not(.spacer){flex:1 1 220px}
.arch-list{display:flex;flex-direction:column;gap:4px}
.arch-item{width:100%;font:inherit;text-align:start;cursor:pointer;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:7px 10px;border-radius:8px;background:var(--surface);border:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:12.5px;min-height:36px}
.arch-item:hover{border-color:var(--brand)}
.arch-dot{display:inline-flex;vertical-align:middle;color:var(--green)}.arch-dot.changed{color:var(--amber)}
.pf-stage .rcd{box-shadow:0 6px 24px rgba(15,23,42,.14);margin-inline:auto}


:root{--muted:#5B6B82;
  --glass:rgba(255,255,255,.62);--glass-2:rgba(255,255,255,.84);--glass-line:rgba(255,255,255,.72);--glass-edge:rgba(30,41,90,.09);
  --card-grad:linear-gradient(155deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.76) 52%,rgba(238,242,255,.68) 100%);--glow:rgba(79,70,229,.13);
  --bg-grad:radial-gradient(1200px 700px at 6% -12%,rgba(79,70,229,.26),transparent 60%),radial-gradient(900px 600px at 102% -4%,rgba(36,176,139,.22),transparent 55%),radial-gradient(1100px 800px at 88% 104%,rgba(14,165,233,.20),transparent 60%),radial-gradient(900px 700px at -4% 100%,rgba(232,123,164,.16),transparent 60%),linear-gradient(180deg,#EFF1FA,#EAEEF8);
  --topbar:rgba(255,255,255,.58)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--muted:#94A3B8;
  --glass:rgba(20,26,48,.58);--glass-2:rgba(20,26,48,.88);--glass-line:rgba(255,255,255,.07);--glass-edge:rgba(255,255,255,.08);
  --card-grad:linear-gradient(155deg,rgba(38,44,78,.80) 0%,rgba(22,28,52,.70) 55%,rgba(18,24,44,.66) 100%);--glow:rgba(129,140,248,.16);
  --bg-grad:radial-gradient(1200px 700px at 6% -12%,rgba(79,70,229,.34),transparent 60%),radial-gradient(900px 600px at 102% -4%,rgba(36,176,139,.14),transparent 55%),radial-gradient(1100px 800px at 88% 104%,rgba(14,165,233,.20),transparent 60%),radial-gradient(900px 700px at -4% 100%,rgba(213,81,129,.12),transparent 60%),linear-gradient(180deg,#080C1A,#0A0F20);
  --topbar:rgba(17,22,42,.58)}}
:root[data-theme="dark"]{--muted:#94A3B8;
  --glass:rgba(20,26,48,.58);--glass-2:rgba(20,26,48,.88);--glass-line:rgba(255,255,255,.07);--glass-edge:rgba(255,255,255,.08);
  --card-grad:linear-gradient(155deg,rgba(38,44,78,.80) 0%,rgba(22,28,52,.70) 55%,rgba(18,24,44,.66) 100%);--glow:rgba(129,140,248,.16);
  --bg-grad:radial-gradient(1200px 700px at 6% -12%,rgba(79,70,229,.34),transparent 60%),radial-gradient(900px 600px at 102% -4%,rgba(36,176,139,.14),transparent 55%),radial-gradient(1100px 800px at 88% 104%,rgba(14,165,233,.20),transparent 60%),radial-gradient(900px 700px at -4% 100%,rgba(213,81,129,.12),transparent 60%),linear-gradient(180deg,#080C1A,#0A0F20);
  --topbar:rgba(17,22,42,.58)}
html{background:var(--canvas)}
body{background:transparent}

body::after{content:"";position:fixed;inset:0;z-index:-1;background:var(--bg-grad);pointer-events:none}


.panel,.kpi,.filters,.col{background:radial-gradient(520px 220px at 100% -20%,var(--glow),transparent 70%),var(--card-grad);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);border:1px solid var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-line),var(--sh-1)}
.kpi:nth-child(4n+2){--glow:rgba(14,165,233,.14)}.kpi:nth-child(4n+3){--glow:rgba(139,92,246,.14)}.kpi:nth-child(4n+4){--glow:rgba(36,176,139,.15)}
.filters{position:relative;z-index:3}
.rail{background:var(--glass);-webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6);border-inline-end:1px solid var(--glass-edge)}
.topbar{-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border-bottom:1px solid var(--glass-edge)}
body::before{background:var(--topbar)}
.dialog{background:var(--glass-2);-webkit-backdrop-filter:blur(26px) saturate(1.6);backdrop-filter:blur(26px) saturate(1.6);border:1px solid var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-line),var(--sh-3)}
.overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.dlg-f{background:color-mix(in srgb,var(--sunk) 60%,transparent)}
.split>div+div{background:color-mix(in srgb,var(--canvas) 45%,transparent)}
.tabbar{background:var(--glass-2);border-top-color:var(--glass-edge)}


.card,.rep-card,.contact-card,.kv,.q-cell,.chip:not(.on){background:var(--card-grad);border-color:var(--glass-edge)}
.card{box-shadow:inset 0 1px 0 var(--glass-line),var(--sh-1)}
.card:hover{box-shadow:inset 0 1px 0 var(--glass-line),var(--sh-2)}
.box:not(.wa-box):not(.svc-box){background:color-mix(in srgb,var(--sunk) 55%,transparent);border-color:var(--glass-edge)}
.contact-box,.money{background:color-mix(in srgb,var(--sunk) 60%,transparent);border-color:var(--glass-edge)}
.col-h{background:color-mix(in srgb,var(--surface) 55%,transparent);border-bottom-color:var(--glass-edge)}
.panel-h{border-bottom-color:var(--glass-edge)}
.seg{background:color-mix(in srgb,var(--sunk) 65%,transparent);border-color:var(--glass-edge)}
.tbl th{background:color-mix(in srgb,var(--sunk) 90%,transparent);border-bottom-color:var(--glass-edge)}
.tbl td{border-bottom-color:var(--glass-edge)}
.tbl tbody tr:hover{background:color-mix(in srgb,var(--brand) 7%,transparent)}
.search{background:color-mix(in srgb,var(--sunk) 60%,transparent);border-color:var(--glass-edge)}
.kbar{background:var(--card-grad);border-color:var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-line)}
.nav-btn:hover{background:color-mix(in srgb,var(--brand) 8%,transparent)}
.nav-btn.on{background:linear-gradient(90deg,color-mix(in srgb,var(--brand) 18%,transparent),color-mix(in srgb,var(--brand) 6%,transparent))}
[dir=rtl] .nav-btn.on{background:linear-gradient(270deg,color-mix(in srgb,var(--brand) 18%,transparent),color-mix(in srgb,var(--brand) 6%,transparent))}
.btn:not(.primary):not(.dark):not(.ghost):not(.danger),.lang-btn,.user-btn,.icon-btn.boxed{background:var(--card-grad);border-color:var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-line),var(--sh-1)}
.btn:not(.primary):not(.dark):not(.ghost):not(.danger):hover{background:color-mix(in srgb,var(--brand) 8%,var(--surface))}
.btn.primary{background:linear-gradient(180deg,color-mix(in srgb,var(--brand) 86%,#fff),var(--brand));box-shadow:0 6px 16px -8px color-mix(in srgb,var(--brand) 75%,transparent),inset 0 1px 0 rgba(255,255,255,.25)}
.btn.primary:hover{background:linear-gradient(180deg,var(--brand),var(--brand-hover))}
.login{background:transparent}
@media (max-width:860px){.panel,.kpi,.filters,.col,.rail,.topbar,.tabbar{-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4)}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.panel,.kpi,.filters,.col,.rail,.dialog{background:var(--surface)}}
@media (prefers-reduced-transparency:reduce){.panel,.kpi,.filters,.col,.rail,.topbar,.dialog,.overlay{background-image:none;background-color:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none}.overlay{background-color:var(--scrim)}}
@media print{body::after{display:none}}


:root{--s1:#2a78d6;--s2:#eb6834;--s3:#1baf7a;--s4:#eda100;--s5:#e87ba4;--s6:#008300;--s7:#6250d6;--s8:#e34948}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--s1:#3987e5;--s2:#d95926;--s3:#199e70;--s4:#c98500;--s5:#d55181;--s6:#008300;--s7:#9085e9;--s8:#e66767}}
:root[data-theme="dark"]{--s1:#3987e5;--s2:#d95926;--s3:#199e70;--s4:#c98500;--s5:#d55181;--s6:#008300;--s7:#9085e9;--s8:#e66767}
.chart{position:relative}.chart svg{width:100%;height:auto;display:block;overflow:visible;direction:ltr}
.chart text{fill:var(--muted);font-size:11px;font-weight:600;font-family:var(--f-sans)}
.chart .gl{stroke:var(--line);stroke-width:1;stroke-dasharray:2 4;shape-rendering:crispEdges}.chart .zero{stroke:var(--line-2);stroke-width:1.2}
.chart .hit{fill:transparent}.chart .hit:hover{fill:color-mix(in srgb,var(--ink) 5%,transparent)}
.chart .ln{fill:none;stroke-width:2.6;stroke-linejoin:round;stroke-linecap:round;pointer-events:none}.chart .area{pointer-events:none}
.chart .dot{width:auto;height:auto;border-radius:0}.chart .dot.end{stroke:var(--surface);stroke-width:2.5}
.chart .avg line{stroke:var(--muted);stroke-width:1.2;stroke-dasharray:5 4;opacity:.7}.chart .avg text{font-size:10.5px;font-weight:700;fill:var(--muted)}
.chart .endlbl{font-size:12px;font-weight:800;fill:var(--ink)}
.chart .guide{stroke:var(--ink);stroke-width:1;opacity:0;stroke-dasharray:3 3;pointer-events:none;transition:opacity .12s}
.chart .hov{opacity:0;stroke:var(--surface);stroke-width:2.5;pointer-events:none;transition:opacity .12s}
.chart .hcol:hover .guide{opacity:.35}.chart .hcol:hover .hov{opacity:1}
.insights{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.ins{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--ink-2);background:var(--sunk);border:1px solid var(--line);padding:4px 10px;border-radius:99px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ins b{font-size:11px;color:var(--muted)}.ins.good{background:var(--green-bg);color:var(--green);border-color:transparent}.ins.good b{color:var(--green)}.ins.bad{background:var(--rose-bg);color:var(--rose);border-color:transparent}.ins.bad b{color:var(--rose)}
.hbars{display:flex;flex-direction:column;gap:11px}
.hb{display:block;width:100%;border:0;background:none;padding:0;text-align:start;color:inherit;font:inherit}button.hb{cursor:pointer}button.hb:hover .hb-n{color:var(--brand-text)}
.hb-l{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:12.5px;font-weight:700;margin-bottom:5px}
.hb-l .av,.hb-l .co-av,.hb-l .rep{align-self:center}
.hb-r{font-family:var(--f-mono);font-size:10.5px;color:var(--faint);width:16px;flex:none}.hb-n{flex:1;min-width:0;color:var(--ink-2)}.hb-v{white-space:nowrap;font-variant-numeric:tabular-nums}
.hb-p{font-family:var(--f-mono);font-size:11px;color:var(--muted);width:34px;text-align:end;flex:none}
.hb-t{display:block;height:8px;border-radius:99px;background:var(--sunk);overflow:hidden}.hb-f{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,color-mix(in srgb,var(--c) 70%,transparent),var(--c));transition:width .4s ease}
.hbar{gap:11px}.hbar-row .nm{font-size:12.5px;font-weight:700;color:var(--ink-2)}.hbar-row .v{font-size:12.5px}.hbar-row .track i{background-image:linear-gradient(90deg,rgba(255,255,255,.28),transparent)}
.progress i{background:linear-gradient(90deg,color-mix(in srgb,var(--green-dot) 70%,transparent),var(--green-dot))}
.donut-c .d-v{font-weight:800;fill:var(--ink);font-family:var(--f-sans);pointer-events:none}.donut-c .d-l{font-size:10.5px;font-weight:700;fill:var(--muted);text-transform:uppercase;letter-spacing:.05em;pointer-events:none}.donut-c .d-s{font-size:9.5px;font-weight:600;fill:var(--muted);pointer-events:none}
.donut-c .seg{transition:transform .15s,opacity .15s;transform-origin:90px 90px}.donut-c .seg:hover{transform:scale(1.04)}
.legend{gap:7px}.lg-row{grid-template-columns:auto minmax(0,1fr) auto auto;gap:8px;font-size:12.5px;font-weight:600;padding:3px 6px}.lg-row .dot{width:10px;height:10px;border-radius:3px}.lg-row span:first-of-type{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lg-row b{font-size:12px;font-weight:600;color:var(--ink-2)}
.tip{position:fixed;left:0;top:0;z-index:300;pointer-events:none;background:var(--night);color:var(--on-night);padding:8px 11px;border-radius:9px;font-size:12px;font-weight:600;box-shadow:var(--sh-3);opacity:0;transition:opacity .12s;max-width:280px;font-variant-numeric:tabular-nums}
.tip.on{opacity:1}.tip b{display:block;font-weight:800;margin-bottom:2px;color:#fff}


:root{--pcard:linear-gradient(160deg,rgba(255,255,255,.94) 0%,rgba(250,251,253,.84) 55%,rgba(241,245,249,.76) 100%);--pcard-edge:rgba(255,255,255,.85);--pcard-line:rgba(30,41,90,.10);--pcard-in:rgba(241,245,249,.72)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--pcard:linear-gradient(160deg,rgba(62,70,104,.62) 0%,rgba(48,55,86,.54) 55%,rgba(38,45,74,.50) 100%);--pcard-edge:rgba(255,255,255,.13);--pcard-line:rgba(255,255,255,.10);--pcard-in:rgba(10,15,32,.34)}}
:root[data-theme="dark"]{--pcard:linear-gradient(160deg,rgba(62,70,104,.62) 0%,rgba(48,55,86,.54) 55%,rgba(38,45,74,.50) 100%);--pcard-edge:rgba(255,255,255,.13);--pcard-line:rgba(255,255,255,.10);--pcard-in:rgba(10,15,32,.34)}
.col{background:linear-gradient(180deg,color-mix(in srgb,var(--tone) 15%,transparent) 0,color-mix(in srgb,var(--tone) 7%,transparent) 320px,color-mix(in srgb,var(--tone) 5%,transparent) 100%),var(--card-grad)}
.col.col-add{--tone:var(--slate-dot);background:none}
.col-h{background:color-mix(in srgb,var(--tone) 9%,var(--surface))}
.col .card{background:var(--pcard);border-color:var(--pcard-line);box-shadow:inset 0 1px 0 var(--pcard-edge),0 1px 2px rgba(15,23,42,.06),0 8px 18px -12px rgba(15,23,42,.30)}
.col .card:hover{border-color:color-mix(in srgb,var(--tone) 55%,transparent);box-shadow:inset 0 1px 0 var(--pcard-edge),0 2px 4px rgba(15,23,42,.07),0 14px 26px -12px rgba(15,23,42,.38)}
.col .card .contact-box,.col .card .money{background:var(--pcard-in);border-color:var(--pcard-line)}
.col .card .card-f{border-top-color:var(--pcard-line)}

html,body{min-height:100%}.spacer{flex:1}
.pt-bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px max(20px,env(safe-area-inset-left,0px));background:var(--topbar);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border-bottom:1px solid var(--glass-edge)}
.pt-logo{height:26px;width:auto;display:block}.pt-sep{width:1px;height:28px;background:var(--line-2)}.pt-name{font-size:17px;letter-spacing:-.01em}
.ro-badge{white-space:nowrap}
.portal-body{max-width:1500px;margin-inline:auto}
.pt-msg{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;text-align:center}
.pt-msg img{height:34px;margin-bottom:14px}.pt-msg h1{margin:0;font-size:20px;letter-spacing:-.01em}.pt-msg p{margin:0;color:var(--muted)}
.cal .day{background:color-mix(in srgb,var(--surface) 72%,transparent)}.cal .day.out{background:color-mix(in srgb,var(--canvas) 45%,transparent)}
@media (max-width:640px){.pt-sep,.ro-badge{display:none}}
