:root{--brand: #2f62e8;--brand-ink: #ffffff;--brand-soft: #e8eefc;--bg: #f5f6f4;--surface: #ffffff;--surface-2: #f0f2ef;--fg: #181b1f;--muted: #5d6670;--faint: #8a939c;--line: #e1e4e0;--line-strong: #cdd2cc;--ok: #157f3c;--ok-bg: #e4f4e9;--warn: #9a5b00;--warn-bg: #fdf1dc;--bad: #c0322b;--bad-bg: #fce8e6;--info: #3c5ba8;--info-bg: #e9eefa;--shadow: 0 1px 2px rgba(20, 24, 28, .06), 0 4px 16px rgba(20, 24, 28, .06);--radius: 10px;--f-ui: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--f-display: "Space Grotesk", "Inter", ui-sans-serif, system-ui, sans-serif;--f-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;color-scheme:light}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--brand: #6d93ff;--brand-ink: #0b1020;--brand-soft: #1b2440;--bg: #0f1113;--surface: #171a1d;--surface-2: #1d2124;--fg: #e6e9ec;--muted: #9aa3ac;--faint: #6f7881;--line: #262b30;--line-strong: #353b41;--ok: #5fd08a;--ok-bg: #14301f;--warn: #f0b75a;--warn-bg: #352610;--bad: #ff877e;--bad-bg: #3a1917;--info: #8fa9ff;--info-bg: #1b2440;--shadow: 0 1px 2px rgba(0,0,0,.4), 0 6px 20px rgba(0,0,0,.35);color-scheme:dark}}:root[data-theme=dark]{--brand: #6d93ff;--brand-ink: #0b1020;--brand-soft: #1b2440;--bg: #0f1113;--surface: #171a1d;--surface-2: #1d2124;--fg: #e6e9ec;--muted: #9aa3ac;--faint: #6f7881;--line: #262b30;--line-strong: #353b41;--ok: #5fd08a;--ok-bg: #14301f;--warn: #f0b75a;--warn-bg: #352610;--bad: #ff877e;--bad-bg: #3a1917;--info: #8fa9ff;--info-bg: #1b2440;--shadow: 0 1px 2px rgba(0,0,0,.4), 0 6px 20px rgba(0,0,0,.35);color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.5 var(--f-ui);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}h1,h2,h3{font-family:var(--f-display);letter-spacing:-.01em;text-wrap:balance;margin:0}.num,td.num,.tabular{font-variant-numeric:tabular-nums}.mono{font-family:var(--f-mono);font-size:12.5px}.muted{color:var(--muted)}.faint{color:var(--faint)}.shell{display:grid;grid-template-columns:236px minmax(0,1fr);min-height:100%}.sidebar{background:var(--surface);border-right:1px solid var(--line);padding:18px 12px;position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column;gap:4px}.brand{display:flex;align-items:center;gap:10px;padding:4px 10px 16px}.brand-mark{width:30px;height:30px;border-radius:8px;background:var(--brand);color:var(--brand-ink);display:grid;place-items:center;font:700 15px var(--f-display)}.brand b{font:600 15px var(--f-display);display:block;line-height:1.1}.brand small{color:var(--muted);font-size:11.5px}.nav-group{font:600 10.5px var(--f-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);padding:14px 10px 4px}.nav-link{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:7px;color:var(--muted);font-weight:500}.nav-link:hover{background:var(--surface-2);color:var(--fg);text-decoration:none}.nav-link.active{background:var(--brand-soft);color:var(--brand)}.nav-link svg{width:17px;height:17px;flex:none}.nav-count{margin-left:auto;font:600 11px var(--f-ui);background:var(--bad-bg);color:var(--bad);padding:1px 7px;border-radius:999px;font-variant-numeric:tabular-nums}.sidebar-foot{margin-top:auto;padding:12px 10px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.main{min-width:0;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:10px 28px;min-height:56px}.topbar .spacer{flex:1}.menu-btn{display:none}.content{padding:24px 28px 64px;display:flex;flex-direction:column;gap:20px;max-width:1400px;width:100%}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}.page-head h1{font-size:24px;font-weight:600}.page-head p{margin:4px 0 0;color:var(--muted);max-width:70ch}.page-head .actions{display:flex;gap:8px;flex-wrap:wrap}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}.card-pad{padding:16px 18px}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}.card-head h2{font-size:15px;font-weight:600}.grid{display:grid;gap:16px}.grid-kpi{grid-template-columns:repeat(6,minmax(0,1fr))}@media(max-width:1280px){.grid-kpi{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:640px){.grid-kpi{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi .value{font-size:21px}.hide-sm{display:none}}.grid-2{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}.kpi{padding:14px 16px;display:flex;flex-direction:column;gap:2px}.kpi .label{color:var(--muted);font-size:12.5px;font-weight:500}.kpi .value{font:600 26px/1.15 var(--f-display);font-variant-numeric:tabular-nums}.kpi .sub{font-size:12px;color:var(--faint)}.kpi.attention{border-color:color-mix(in srgb,var(--warn) 45%,var(--line))}.kpi.attention .value{color:var(--warn)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:34px;padding:0 13px;border-radius:8px;border:1px solid var(--line-strong);background:var(--surface);font-weight:500;cursor:pointer;white-space:nowrap}.btn:hover{background:var(--surface-2)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn svg{width:16px;height:16px}.btn-primary{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}.btn-primary:hover{background:color-mix(in srgb,var(--brand) 88%,#000)}.btn-danger{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 40%,var(--line))}.btn-danger:hover{background:var(--bad-bg)}.btn-danger-solid{background:var(--bad);border-color:var(--bad);color:#fff}.btn-ghost{border-color:transparent;background:transparent}.btn-sm{height:28px;padding:0 9px;font-size:13px;border-radius:7px}.icon-btn{width:32px;padding:0}.field{display:flex;flex-direction:column;gap:5px;min-width:0}.field>label,.field-label{font-weight:500;font-size:13px}.field .hint{font-size:12px;color:var(--muted)}.input,.select,.textarea{width:100%;border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:7px 10px;min-height:34px}.textarea{min-height:90px;resize:vertical;line-height:1.45}.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 16px}.form-grid .span-all{grid-column:1 / -1}.switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.switch input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:36px;height:20px;border-radius:999px;background:var(--line-strong);position:relative;cursor:pointer;transition:background .15s;flex:none;margin:0}.switch input:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 2px #0003}.switch input:checked{background:var(--brand)}.switch input:checked:after{transform:translate(16px)}.file-drop{display:flex;align-items:center;gap:12px;border:1px dashed var(--line-strong);border-radius:8px;padding:10px}.file-drop img{width:52px;height:52px;object-fit:cover;border-radius:8px;background:var(--surface-2)}.error-text{color:var(--bad);font-size:13px}.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 14px;border-bottom:1px solid var(--line)}.toolbar .search{position:relative;flex:1 1 220px;max-width:340px}.toolbar .search input{padding-left:32px}.toolbar .search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--faint)}.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:8px;overflow:hidden}.seg button{border:0;background:var(--surface);padding:0 11px;height:32px;cursor:pointer;color:var(--muted);font-weight:500;border-right:1px solid var(--line)}.seg button:last-child{border-right:0}.seg button[aria-pressed=true]{background:var(--brand-soft);color:var(--brand)}.table-wrap{overflow-x:auto}table.data{width:100%;border-collapse:collapse;font-size:13.5px}table.data th{text-align:left;font-weight:600;font-size:12px;color:var(--muted);padding:9px 14px;border-bottom:1px solid var(--line);background:var(--surface-2);white-space:nowrap}table.data th button{all:unset;cursor:pointer;display:inline-flex;gap:4px;align-items:center}table.data th button:focus-visible{outline:2px solid var(--brand)}table.data td{padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:middle}table.data tr:last-child td{border-bottom:0}table.data tbody tr:hover{background:color-mix(in srgb,var(--surface-2) 60%,transparent)}table.data td.actions{text-align:right;white-space:nowrap}table.data td.actions .btn+.btn{margin-left:6px}.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-top:1px solid var(--line);color:var(--muted);font-size:13px;flex-wrap:wrap}.pager .btns{display:flex;gap:6px}.empty{padding:44px 16px;text-align:center;color:var(--muted)}.empty b{display:block;color:var(--fg);font-size:15px;margin-bottom:4px}.pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:2px 8px;border-radius:999px;white-space:nowrap;background:var(--surface-2);color:var(--muted)}.pill.ok{background:var(--ok-bg);color:var(--ok)}.pill.warn{background:var(--warn-bg);color:var(--warn)}.pill.bad{background:var(--bad-bg);color:var(--bad)}.pill.info{background:var(--info-bg);color:var(--info)}.pill.brand{background:var(--brand-soft);color:var(--brand)}.who{display:flex;align-items:center;gap:10px;min-width:0}.who img,.avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:none;background:var(--surface-2)}.who .names{min-width:0;display:flex;flex-direction:column;line-height:1.25}.who .names b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;gap:4px;align-items:center}.who .names span{color:var(--muted);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.verified{color:var(--brand);width:14px;height:14px;flex:none}.thumb{width:40px;height:56px;border-radius:6px;object-fit:cover;background:var(--surface-2);flex:none}.thumb-sq{width:40px;height:40px;border-radius:8px;object-fit:cover;background:var(--surface-2);flex:none}.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:46ch}.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);overflow-x:auto}.tabs button{border:0;background:none;padding:10px 14px;cursor:pointer;color:var(--muted);font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}.tabs button[aria-selected=true]{color:var(--fg);border-bottom-color:var(--brand)}.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;font-size:13.5px}.kv dt{color:var(--muted)}.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}.banner{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border-radius:8px;background:var(--info-bg);color:var(--info);font-size:13px}.banner.warn{background:var(--warn-bg);color:var(--warn)}dialog.modal{border:1px solid var(--line);border-radius:14px;padding:0;width:min(560px,calc(100vw - 32px));background:var(--surface);color:var(--fg);box-shadow:var(--shadow);max-height:calc(100vh - 48px)}dialog.modal.wide{width:min(820px,calc(100vw - 32px))}dialog.modal::backdrop{background:#0a0c0f73}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line)}.modal-head h2{font-size:17px;font-weight:600}.modal-body{padding:18px 20px;display:flex;flex-direction:column;gap:14px;overflow-y:auto;max-height:calc(100vh - 200px)}.modal-foot{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid var(--line);background:var(--surface-2);border-radius:0 0 14px 14px}.toasts{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:8px;z-index:100}.toast{background:var(--fg);color:var(--bg);padding:10px 14px;border-radius:9px;box-shadow:var(--shadow);max-width:380px;font-size:13.5px;display:flex;gap:8px;align-items:flex-start}.toast.error{background:var(--bad);color:#fff}.login{min-height:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.login-art{background:var(--brand);color:var(--brand-ink);padding:48px;display:flex;flex-direction:column;justify-content:space-between;gap:32px;position:relative;overflow:hidden}.login-art h1{font-size:clamp(28px,3.4vw,44px);line-height:1.05;max-width:14ch}.login-art p{max-width:42ch;opacity:.85}.login-art .reel-stack{display:flex;gap:12px;align-items:flex-end}.login-art .reel{width:74px;border-radius:12px;background:color-mix(in srgb,var(--brand-ink) 18%,transparent);border:1px solid color-mix(in srgb,var(--brand-ink) 30%,transparent)}.login-form{display:flex;align-items:center;justify-content:center;padding:32px max(16px,env(safe-area-inset-right,0px)) 32px max(16px,env(safe-area-inset-left,0px))}.login-form form{width:min(380px,100%);display:flex;flex-direction:column;gap:14px}.demo-accounts{display:flex;flex-wrap:wrap;gap:6px}.skeleton{background:linear-gradient(90deg,var(--surface-2),var(--line),var(--surface-2));background-size:200% 100%;animation:shimmer 1.2s infinite;border-radius:6px;height:14px}@keyframes shimmer{to{background-position:-200% 0}}@media(max-width:1100px){.grid-2{grid-template-columns:minmax(0,1fr)}}@media(max-width:860px){.shell{grid-template-columns:minmax(0,1fr)}.sidebar{position:fixed;z-index:50;left:0;top:0;width:260px;transform:translate(-100%);transition:transform .2s;box-shadow:var(--shadow);padding-top:calc(18px + env(safe-area-inset-top,0px))}.sidebar.open{transform:none}.menu-btn{display:inline-flex}.topbar{padding:10px max(16px,env(safe-area-inset-right,0px)) 10px max(16px,env(safe-area-inset-left,0px))}.content{padding:18px max(16px,env(safe-area-inset-right,0px)) 48px max(16px,env(safe-area-inset-left,0px))}.login{grid-template-columns:minmax(0,1fr)}.login-art{padding:28px 20px}.login-art .reel-stack{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
