*,*::before,*::after{box-sizing:border-box}body{margin:0}[hidden]{display:none!important}
:root{
  --bg:#F5F5F5;--surface:#FFFFFF;--surface-2:#FAFBFC;--hover:#F9FBFF;--line:#EEF0F4;--line-2:#E2E5EB;
  --text:#2B3038;--text-h:#1E242E;--text-2:#6C7688;--text-3:#8A93A0;--accent:#1FA8DD;--accent-2:#1B93C2;--accent-soft:#EEF9FC;--accent-line:#C5E9F5;
  --lime:#8DC63F;--lime-2:#6BA00E;--lime-soft:#EEF6DC;--dark:#383838;--sel:#1FA8DD;
  --chip-text:#2B3038;--shadow:0 8px 28px rgba(30,40,60,.14);--card-shadow:0 1px 3px rgba(30,40,60,.05);--scrim:rgba(30,36,46,.4);
  --ok:#1E874F;--warn:#B7791F;--bad:#E2551F;--bad-soft:#FDF1EC;--bad-line:#F3C9BC;
  --mono:Consolas,"JetBrains Mono",ui-monospace,Menlo,monospace;
  --sans:"Segoe UI",Tahoma,Arial,system-ui,sans-serif;
}
html,body{height:100%}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:13px;overflow:hidden}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font:inherit;color:var(--text)}
.app{display:grid;grid-template-columns:248px 1fr;height:100%}
.side{background:var(--surface);border-right:1px solid #EAEDF2;display:flex;flex-direction:column;min-height:0}
.ws{display:flex;align-items:center;gap:10px;padding:14px 16px;background:var(--dark)}
.logo{font-size:20px;font-weight:800;color:#FFFFFF;letter-spacing:-.5px;white-space:nowrap}
.logo .sky{color:var(--accent)}
.logo .diamond{display:inline-block;width:9px;height:9px;background:var(--lime);border-radius:2px;transform:rotate(45deg);margin-left:5px;vertical-align:middle}
.pim-badge{display:inline-block;padding:3px 9px;border-radius:7px;background:linear-gradient(135deg,#1FA8DD 0%,#8DC63F 100%);color:#FFFFFF;font-size:12px;font-weight:800;letter-spacing:.08em;box-shadow:0 1px 4px rgba(31,168,221,.4)}


.side-scroll{overflow:auto;padding:10px 8px 16px;flex:1}
.side-h{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);padding:10px 8px 6px;display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none}
.side-h .plus{margin-left:auto;color:var(--accent);font-size:15px;line-height:1;padding:0 4px}
.tbl{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px;color:var(--text-2);width:100%;text-align:left}
.tbl:hover{background:var(--surface-2)}
.tbl.on{color:var(--accent-2);font-weight:700;background:var(--accent-soft)}
.tbl .cnt{margin-left:auto;font-size:11px;color:var(--text-3);font-variant-numeric:tabular-nums}
.views{margin:2px 0 6px 18px;border-left:1px solid var(--line);padding-left:6px}
.view{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:6px;width:100%;text-align:left;color:var(--text-2)}
.view:hover{background:var(--surface-2)}
.view.on{background:var(--lime-soft);color:var(--lime-2);font-weight:700}
.side-foot{padding:10px 14px;border-top:1px solid var(--line);font-size:12px;color:var(--text-2);display:flex;align-items:center;gap:8px}
.side-foot button{color:var(--accent);margin-left:auto}
.main{display:flex;flex-direction:column;min-width:0;min-height:0}
.top{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surface);border-bottom:1px solid var(--line);min-height:50px}
.crumbs{display:flex;align-items:center;gap:6px;color:var(--text-2);min-width:0;white-space:nowrap;overflow:hidden}
.crumbs b{color:var(--text-h);font-weight:800;font-size:15px}
.bar{display:flex;align-items:center;gap:4px;padding:7px 12px;background:var(--surface);border-bottom:1px solid var(--line);flex-wrap:wrap;position:relative}
.tb{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:6px;color:var(--text-2);white-space:nowrap}
.tb:hover{background:var(--surface-2);color:var(--text)}
.tb.active{background:var(--accent-soft);color:var(--accent-2)}
.tb .n{font-size:11px;background:var(--accent);color:#fff;border-radius:999px;padding:0 6px;line-height:16px}
.search{margin-left:auto;display:flex;align-items:center;gap:6px;border:1px solid var(--line-2);border-radius:9px;padding:6px 10px;background:var(--surface);color:var(--text-3)}
.search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(31,168,221,.12)}
.search input{border:0;outline:0;background:none;width:200px;min-width:0}
.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:9px;background:var(--accent);color:#fff;font-weight:700;white-space:nowrap}
.btn:hover{background:var(--accent-2)}
.btn:disabled{opacity:.5;cursor:default}
.btn.ghost{background:var(--surface);color:var(--text-2);border:1px solid var(--line-2)}
.btn.ghost:hover{background:#F7F9FB}
.btn.danger{background:var(--bad-soft);color:var(--bad);border:1px solid var(--bad-line)}
.hint{padding:7px 16px;background:var(--accent-soft);border-bottom:1px solid var(--accent-line);color:var(--text-2);font-size:12px}
.gridwrap{flex:1;min-height:0;background:var(--surface);position:relative}
.foot{display:flex;gap:18px;align-items:center;padding:7px 16px;border-top:1px solid var(--line);background:var(--surface);font-size:12px;color:var(--text-2);flex-wrap:wrap}
.foot b{color:var(--text)}
.foot .red{color:var(--bad);font-weight:700}
.chip{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;font-size:12px;line-height:22px;color:var(--chip-text);background:var(--c,#e4e7ec);margin-right:4px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lk{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:5px;border:1px solid var(--line-2);background:var(--surface);font-size:12px;margin-right:4px;white-space:nowrap}
.lk.miss{border-color:var(--bad);color:var(--bad)}
.lu{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:5px;background:var(--surface-2);font-size:12px;margin-right:4px}
.mono{font-family:var(--mono);font-size:12px;color:var(--text-2)}
.cb{width:16px;height:16px;border-radius:4px;display:inline-grid;place-items:center;vertical-align:middle}
.cb.on{background:var(--ok);color:#fff}
.cb.off{border:1.5px solid var(--line-2)}
.sw{width:30px;height:16px;border-radius:8px;background:var(--line-2);display:inline-block;position:relative;vertical-align:middle;transition:background .15s}
.sw i{position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;transition:left .15s}
.sw.on{background:var(--ok)}
.sw.on i{left:16px}
.url{color:var(--accent)}
.muted{color:var(--text-3)}
.num{font-variant-numeric:tabular-nums}
.hc{display:flex;align-items:center;gap:6px;min-width:0}
.hc .l{overflow:hidden;text-overflow:ellipsis}
.hc svg{flex:none;color:var(--text-3)}
.hc .auto{font-size:10px;color:var(--text-3);border:1px solid var(--line-2);border-radius:4px;padding:0 3px;line-height:14px}
.tabulator{border:0;background:var(--surface);font-size:13px}
.tabulator .tabulator-header{background:var(--surface-2);border-bottom:1px solid var(--line);color:#9099A6}
.tabulator .tabulator-header .tabulator-col{background:var(--surface-2);border-right:1px solid var(--line)}
.tabulator .tabulator-header .tabulator-col .tabulator-col-content{padding:7px 10px}
.tabulator .tabulator-col-title{font-weight:700;font-size:12px}
.tabulator-row{min-height:36px;border-bottom:1px solid var(--line)}
.tabulator-row.tabulator-row-even{background:var(--surface)}
.tabulator-row .tabulator-cell{padding:7px 10px;border-right:1px solid var(--line);height:36px}
.tabulator-row .tabulator-cell.tabulator-frozen{background:inherit}
.tabulator-row.tabulator-selectable:hover{background:var(--hover)}
.tabulator-row .tabulator-cell.tabulator-range-selected:not(.tabulator-range-only-cell-selected){background:var(--accent-soft)}
.tabulator-row .tabulator-cell.tabulator-range-only-cell-selected{box-shadow:inset 0 0 0 2px var(--sel)}
.tabulator .tabulator-cell.ro{color:var(--text-2)}
.tabulator-row .tabulator-cell .rn{color:var(--text-3);font-size:12px;display:flex;align-items:center;gap:6px}
.tabulator-row .tabulator-cell .rn button{color:var(--accent);opacity:0;padding:0 2px}
.tabulator-row:hover .tabulator-cell .rn button{opacity:1}
.tabulator-row.archived{opacity:.55}
.tabulator-row.off .tabulator-cell{color:#98a2b3;background:#f2f4f7}
.tabulator-row.off .chip,.tabulator-row.off .lk{opacity:.6}
.tabulator-cell.saving{opacity:.5}
.tabulator-cell.err{box-shadow:inset 0 0 0 2px var(--bad)}
.pop{position:absolute;z-index:30;background:var(--surface);border:1px solid var(--line-2);border-radius:10px;box-shadow:var(--shadow);width:340px;max-height:min(70vh,560px);display:flex;flex-direction:column}
.pop-h{padding:10px 12px;border-bottom:1px solid var(--line);display:flex;gap:8px;align-items:center;font-weight:600}
.pop-b{overflow:auto;padding:8px}
.pop-f{display:flex;gap:8px;justify-content:flex-end;padding:8px 12px;border-top:1px solid var(--line)}
.fr{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:6px;cursor:pointer}
.fr:hover{background:var(--surface-2)}
.tog{margin-left:auto;width:26px;height:15px;border-radius:999px;background:var(--line-2);position:relative;flex:none}
.tog::after{content:"";position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:50%;background:#fff;transition:left .15s}
.fr.on .tog{background:var(--accent)}
.fr.on .tog::after{left:13px}
.cond{display:grid;grid-template-columns:1fr 110px 1fr 24px;gap:6px;margin-bottom:6px}
.cond select,.cond input,.inp{border:1px solid var(--line-2);border-radius:9px;padding:5px 7px;background:var(--surface);min-width:0;width:100%}
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:50;display:grid;place-items:center;padding:24px 16px}
.modal{background:var(--surface);border-radius:14px;box-shadow:var(--shadow);width:min(560px,100%);max-height:88vh;display:flex;flex-direction:column;overflow:hidden}
.modal.wide{width:min(1080px,100%);height:min(88vh,860px)}
.mh{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);font-weight:700;font-size:15px}
.mh .x{margin-left:auto;padding:4px 8px;border-radius:6px;font-size:18px;line-height:1}
.mbody{padding:14px 16px;overflow:auto;flex:1}
.mfoot{display:flex;gap:8px;justify-content:flex-end;padding:10px 16px;border-top:1px solid var(--line)}
.frow{display:grid;grid-template-columns:170px 1fr;gap:10px;align-items:center;margin-bottom:10px}
.frow label{color:var(--text-2)}
.picklist{max-height:340px;overflow:auto;border:1px solid var(--line);border-radius:8px;margin-top:8px}
.pick{display:flex;align-items:center;gap:8px;padding:7px 10px;border-bottom:1px solid var(--line);cursor:pointer}
.pick:hover{background:var(--hover)}
.pick.on{background:var(--accent-soft)}
.pick .s{margin-left:auto;color:var(--text-3);font-family:var(--mono);font-size:11px}
.toast{position:fixed;right:16px;bottom:16px;z-index:90;display:flex;flex-direction:column;gap:8px;max-width:440px}
.toast div{background:var(--dark);color:#fff;padding:10px 14px;border-radius:8px;box-shadow:var(--shadow);line-height:1.4}
.toast div.bad{background:var(--bad)}
.toast div.ok{background:var(--lime-2)}
.page{flex:1;overflow:auto;padding:18px 20px;background:var(--bg)}
.card{background:var(--surface);border:1px solid #EAEDF2;border-radius:14px;box-shadow:var(--card-shadow);padding:16px 18px;margin-bottom:14px}
.card h3{margin:0 0 10px;font-size:16px;font-weight:700;color:var(--text-h)}
table.t{border-collapse:collapse;width:100%;font-size:12px}
table.t th,table.t td{border-bottom:1px solid var(--line);padding:6px 8px;text-align:left;vertical-align:top}
table.t th{color:#9099A6;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.04em;background:var(--surface-2)}
textarea.json{width:100%;min-height:220px;font-family:var(--mono);font-size:12px;border:1px solid var(--line-2);border-radius:8px;padding:8px}
.blk{font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.06em;padding:16px 0 6px;border-bottom:1px solid var(--line);margin-bottom:6px}
.fl{display:grid;grid-template-columns:200px 1fr;gap:12px;padding:5px 0}
.fl .k{color:var(--text-2)}
.cardgrid{display:grid;grid-template-columns:1fr 340px;min-height:0;flex:1}
.cardgrid .left{overflow:auto;padding:4px 20px 24px}
.cardgrid .right{border-left:1px solid var(--line);background:var(--surface-2);overflow:auto;padding:10px}
.it{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin-bottom:8px;font-size:12px}
.it .meta{color:var(--text-3);font-size:11px}
.login{display:grid;place-items:center;min-height:100%;padding:16px 0}
.login form{background:var(--surface);border:1px solid #EAEDF2;border-radius:14px;padding:0 0 26px;width:min(380px,92vw);box-shadow:var(--shadow);overflow:hidden}
.login .ws{margin-bottom:22px}
.login form > :not(.ws){margin-left:26px;margin-right:26px}
.login form input{width:calc(100% - 52px)}
.login form button{width:calc(100% - 52px)}
.login h1{font-size:20px;font-weight:800;color:var(--text-h);margin:0 0 4px}
.login p{color:var(--text-3);margin:0 0 18px}
.login input{border:1px solid var(--line-2);border-radius:9px;padding:9px 12px;margin-bottom:10px;outline:none}
.login input:focus,.inp:focus,.cond select:focus,.cond input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(31,168,221,.12);outline:none}
.login button{justify-content:center;padding:10px}
.login .err{color:var(--bad);min-height:18px;margin-bottom:8px}
@media (max-width:900px){
  .app{grid-template-columns:1fr}
  .side{position:fixed;inset:0 auto 0 0;width:260px;z-index:40;transform:translateX(-100%);transition:transform .2s;box-shadow:var(--shadow)}
  .side.open{transform:none}
  .search input{width:120px}
  .cardgrid{grid-template-columns:1fr}
  .fl,.frow{grid-template-columns:1fr}
}
.foot b{color:var(--text-h)}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{border-bottom-color:var(--accent)}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=descending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{border-top-color:var(--accent)}
.side-foot button{font-weight:700}
.tb .n{background:var(--accent)}
.fr.on .tog{background:var(--lime)}
.tabulator-menu{border:1px solid var(--line-2);border-radius:10px;box-shadow:var(--shadow);background:var(--surface);padding:4px;font-size:13px}
.tabulator-menu .tabulator-menu-item{padding:7px 12px;border-radius:6px}
.tabulator-menu .tabulator-menu-item:not(.tabulator-menu-item-disabled):hover{background:var(--accent-soft);color:var(--accent-2)}
.tabulator-menu .tabulator-menu-item-disabled{color:var(--text-3);font-family:var(--mono);font-size:11px}
.fl .inp{width:100%}
.fl textarea.inp{resize:vertical}
.fl .ro-val{padding:6px 0}
.cardgrid .left .fl{align-items:center}
.login .qr{display:flex;justify-content:center;margin:0 0 10px}
.login .qr svg{width:200px;height:200px}
.login .backup{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;font-size:15px;color:var(--text-h);margin-bottom:18px}