:root{
  --gold:#B08D57; --gold-2:#C9A86A; --gold-soft:#F6EFE2; --gold-ink:#8A6A38;
  --ink:#1C1C1C; --ink-2:#3D3D3D; --muted:#7A7A7A; --faint:#A3A3A3;
  --line:#E6E1D8; --line-2:#EFEBE4; --bg:#F6F5F2; --card:#FFFFFF; --panel:#FAFAF8;
  --danger:#B3261E; --danger-bg:#FCEDEB; --ok:#2E7D4F; --ok-bg:#E8F4EC; --warn:#A15C00; --warn-bg:#FFF4E0;
  --info:#2B5C8A; --info-bg:#EAF1F8;
  --serif:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans:Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --r:10px; --shell:56px; --rail:220px;
  --shadow:0 1px 2px rgba(0,0,0,.05),0 2px 8px rgba(0,0,0,.04);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--sans);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;font-size:14px}
button,input,select,textarea{font:inherit;color:inherit}
[hidden]{display:none!important}
a{color:var(--gold-ink)}

/* =================== LOGIN =================== */
.login{min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1.45fr) 1px minmax(380px,1fr);background:#fff}
.divider{background:linear-gradient(180deg,transparent 0%,var(--gold-2) 18%,var(--gold) 50%,var(--gold-2) 82%,transparent 100%);position:relative}
.divider::after{content:"";position:absolute;top:50%;left:50%;width:9px;height:9px;transform:translate(-50%,-50%) rotate(45deg);background:#fff;border:1px solid var(--gold)}
.brand{position:relative;overflow:hidden;background:var(--panel);display:flex;align-items:center;justify-content:center;padding:48px 40px}
.waves{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.55}
.brand-inner{position:relative;width:100%;max-width:980px;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-areas:"vision logo mission" "head head head" "p1 p2 p3";column-gap:28px;row-gap:22px;align-items:start}
.logo-wrap{grid-area:logo;display:flex;flex-direction:column;align-items:center;text-align:center}
.vision{grid-area:vision}.mission{grid-area:mission}.p1{grid-area:p1}.p2{grid-area:p2}.p3{grid-area:p3}
.pillars-head{grid-area:head;text-align:center;font-family:var(--serif);font-size:clamp(22px,2vw,28px);color:var(--gold);font-weight:600;display:flex;align-items:center;gap:14px;justify-content:center;padding-top:10px}
.pillars-head::before,.pillars-head::after{content:"";height:1px;width:60px;background:linear-gradient(90deg,transparent,var(--gold))}
.pillars-head::after{transform:scaleX(-1)}
.item{text-align:center;display:flex;flex-direction:column;align-items:center}
.item svg.ic{width:76px;height:76px;margin-bottom:10px}
.item h3{font-family:var(--serif);font-weight:600;line-height:1.2;margin-bottom:10px}
.vision h3,.mission h3{font-size:30px;color:var(--gold)}
.pillar h3{font-size:21px;min-height:2.4em;display:flex;align-items:center;justify-content:center}
.item p{font-size:14px;line-height:1.65;color:#2F2F2F;max-width:310px;text-shadow:0 0 6px #fff,0 0 12px #fff}
.logo{width:190px;height:165px}
.logo-name{font-family:var(--serif);font-weight:600;font-size:17px;letter-spacing:2.6px;margin-top:12px;white-space:nowrap}
.logo-tag{font-family:var(--serif);font-weight:600;font-size:17px;color:var(--gold);margin-top:4px}
.auth{display:flex;align-items:center;justify-content:center;padding:40px 28px;background:#fff}
.auth .card{width:100%;max-width:400px}
.m-logo{display:none;align-items:center;gap:12px;margin-bottom:22px}
.m-logo svg{width:56px;height:48px}
.m-logo b{font-family:var(--serif);font-weight:600;font-size:15px;letter-spacing:2.4px;display:block}
.m-logo span{font-family:var(--serif);color:var(--gold);font-size:14px;font-weight:600}
.title{font-family:var(--serif);font-weight:600;font-size:34px;line-height:1.1}
.subtitle{color:var(--muted);font-size:14px;margin:6px 0 24px}
.seg{position:relative;display:grid;grid-template-columns:1fr 1fr;background:#F3F1EC;border-radius:999px;padding:4px;margin-bottom:24px}
.seg button{position:relative;z-index:1;border:0;background:none;padding:10px 0;font-size:14px;font-weight:500;color:var(--ink-2);cursor:pointer;border-radius:999px}
.seg .pill{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);background:#fff;border-radius:999px;box-shadow:0 1px 3px rgba(0,0,0,.08);transition:transform .25s}
.seg[data-mode="register"] .pill{transform:translateX(100%)}
.auth form{display:none}.auth form.active{display:block}
.foot{text-align:center;margin-top:28px;font-size:11.5px;color:var(--faint)}
.switch{text-align:center;margin-top:18px;font-size:13px;color:var(--muted)}

/* =================== FORMS (shared) =================== */
.field{margin-bottom:12px;min-width:0}
.field>label,.lbl{display:block;font-size:12px;font-weight:600;margin-bottom:5px;color:var(--ink-2);letter-spacing:.1px}
.req::after{content:" *";color:var(--danger)}
.ctrl{position:relative}
.in,.ctrl input,.ctrl select,.ctrl textarea{width:100%;height:42px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:15px;outline:none;transition:border-color .15s,box-shadow .15s;min-width:0}
.ctrl textarea{height:auto;min-height:70px;padding:10px 12px;resize:vertical}
.ctrl select{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237A7A7A' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;padding-right:34px}
.ctrl input::placeholder,.ctrl textarea::placeholder{color:#B5B5B5}
.ctrl input:focus,.ctrl select:focus,.ctrl textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(176,141,87,.16)}
.ctrl input[readonly]{background:var(--panel);color:var(--ink-2)}
.auth .ctrl input{height:48px;font-size:16px;border-radius:12px}
.field.err input,.field.err select{border-color:var(--danger)}
.msg{font-size:12px;color:var(--danger);margin-top:4px;display:none}
.field.err .msg{display:block}
.hint{font-size:12px;color:var(--muted);margin-top:4px}
.eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;background:none;cursor:pointer;color:var(--muted);display:grid;place-items:center;border-radius:8px}
.eye svg{width:20px;height:20px}
.has-eye input{padding-right:48px}
.meter{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:8px}
.meter i{height:4px;border-radius:2px;background:#ECE8E1;transition:background .2s}
.meter-label{font-size:12px;color:var(--muted);margin-top:4px}
.check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;color:var(--ink-2);font-size:13px;user-select:none}
.check input{width:16px;height:16px;accent-color:var(--gold)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 14px}
.tagin{display:grid;grid-template-columns:92px 1fr;gap:8px}

.btn{height:42px;padding:0 16px;border:1px solid transparent;border-radius:8px;background:var(--ink);color:#fff;font-size:14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;transition:background .15s,border-color .15s,transform .05s}
.btn:hover{background:#000}.btn:active{transform:scale(.985)}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.btn.block{width:100%;height:50px;border-radius:12px;font-size:15px}
.btn.gold{background:var(--gold);}.btn.gold:hover{background:var(--gold-ink)}
.btn.ghost{background:#fff;color:var(--ink);border-color:var(--line)}.btn.ghost:hover{background:#F7F5F1;border-color:#D9D2C6}
.btn.danger{background:#fff;color:var(--danger);border-color:#EBC9C5}.btn.danger:hover{background:var(--danger-bg)}
.btn.sm{height:34px;padding:0 12px;font-size:13px}
.btn svg{width:16px;height:16px}
.btn .spin{width:16px;height:16px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:sp .7s linear infinite;display:none}
.btn.busy .spin{display:block}
@keyframes sp{to{transform:rotate(360deg)}}
.link{background:none;border:0;color:var(--gold-ink);font-weight:600;cursor:pointer;font-size:13px;padding:4px 0}
.link:hover{text-decoration:underline}
.alert{display:none;padding:10px 14px;border-radius:8px;font-size:13px;margin-bottom:14px;line-height:1.45}
.alert.show{display:block}
.alert.error{background:var(--danger-bg);color:#7E1F18}
.alert.success{background:var(--ok-bg);color:#1E5A37}
.alert.info{background:var(--info-bg);color:#1F4466}
.alert.warn{background:var(--warn-bg);color:#6B4100}

/* =================== APP SHELL =================== */
.app{display:none;min-height:100vh;min-height:100dvh}
body.signed-in .login{display:none}
body.signed-in .app{display:block}
.shell{position:sticky;top:0;z-index:30;height:var(--shell);background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 16px}
.shell .mark{display:flex;align-items:center;gap:10px;min-width:0}
.shell .mark svg{width:42px;height:42px;flex:none}
.shell .mark b{font-weight:700;letter-spacing:.2px}
.shell .mark b{font-family:var(--serif);font-weight:600;font-size:19px;white-space:nowrap}
.shell .mark small{display:block;font-size:11px;color:var(--muted);letter-spacing:.3px;margin-top:-2px}
.shell .grow{flex:1}
.gsearch{position:relative;flex:1;max-width:520px}
.gsearch input{width:100%;height:38px;border:1px solid var(--line);border-radius:999px;padding:0 14px 0 38px;background:var(--panel);outline:none;font-size:14px}
.gsearch input:focus{border-color:var(--gold);background:#fff}
.gsearch svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted)}
.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;font-size:12px;font-weight:600;background:var(--gold-soft);color:var(--gold-ink);white-space:nowrap}
.chip.grey{background:#F0EEEA;color:var(--ink-2)}
.chip.ok{background:var(--ok-bg);color:var(--ok)}
.chip.bad{background:var(--danger-bg);color:var(--danger)}
.chip.warn{background:var(--warn-bg);color:var(--warn)}
.chip.info{background:var(--info-bg);color:var(--info)}
.userbtn{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:3px 10px 3px 3px;cursor:pointer}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--gold-soft);color:var(--gold-ink);display:grid;place-items:center;font-weight:700;font-size:12px;border:1px solid var(--gold-2)}
.menu{position:absolute;right:12px;top:calc(var(--shell) - 4px);background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.12);min-width:230px;padding:6px;z-index:40}
.menu .who{padding:10px 12px;border-bottom:1px solid var(--line-2);margin-bottom:4px}
.menu .who b{display:block}.menu .who span{font-size:12px;color:var(--muted)}
.menu button{display:flex;width:100%;text-align:left;border:0;background:none;padding:10px 12px;border-radius:6px;cursor:pointer;font-size:14px;gap:10px;align-items:center}
.menu button:hover{background:var(--panel)}
.sync{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px;white-space:nowrap}
.sync i{width:8px;height:8px;border-radius:50%;background:var(--ok);display:inline-block}
.sync.off i{background:var(--danger)}

.layout{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);min-height:calc(100vh - var(--shell))}
.rail{background:#fff;border-right:1px solid var(--line);padding:14px 10px;position:sticky;top:var(--shell);height:calc(100vh - var(--shell));overflow:auto}
.rail button{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;padding:11px 12px;border-radius:8px;cursor:pointer;color:var(--ink-2);font-weight:500;font-size:14px;text-align:left}
.rail button svg{width:19px;height:19px;flex:none}
.rail button:hover{background:var(--panel)}
.rail button.on{background:var(--gold-soft);color:var(--gold-ink);font-weight:600}
.rail .sep{height:1px;background:var(--line-2);margin:10px 6px}
.rail .facility{padding:6px 6px 12px}
main.view{padding:20px 22px 40px;min-width:0}
.page{display:none}.page.on{display:block;animation:fade .2s ease}
@keyframes fade{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
.ph{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.ph h1{font-family:var(--serif);font-weight:600;font-size:30px;line-height:1}
.ph p{color:var(--muted);font-size:13px;margin-top:6px}
.ph .actions{display:flex;gap:8px;flex-wrap:wrap}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
.card>.hd{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;border-bottom:1px solid var(--line-2);flex-wrap:wrap}
.card>.hd h2{font-size:15px;font-weight:700}
.card>.bd{padding:16px}
.card>.ft{display:flex;gap:8px;justify-content:flex-end;padding:12px 16px;border-top:1px solid var(--line-2);flex-wrap:wrap;background:var(--panel);border-radius:0 0 12px 12px}
.card>.ft .left{margin-right:auto;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.loc-wrap{max-width:920px}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:16px;align-items:start}
.grid-asset{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 260px;gap:0 16px}
.sec{font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--gold-ink);margin:6px 0 10px;grid-column:1/-1;display:flex;align-items:center;gap:10px}
.sec::after{content:"";flex:1;height:1px;background:var(--line-2)}
.kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:2px 0 12px;grid-column:1/-1}
.kv div{background:var(--panel);border:1px solid var(--line-2);border-radius:8px;padding:7px 10px;min-width:0}
.kv span{display:block;font-size:11px;color:var(--muted)}
.kv b{display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.status-line{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:12px;min-height:24px;flex-wrap:wrap}
.pathbox{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13.5px;font-weight:600;background:#FBF6EE;color:#7E5A26;border:1px solid #E8DCC6;padding:10px 12px;border-radius:10px;word-break:break-all}
.lpath{background:#FFFCF6;border:1px solid #E8DCC6;border-radius:12px;padding:12px 14px}
.ltrail{list-style:none;margin:0;padding:0;position:relative}
.ltrail li{position:relative;display:flex;gap:11px;align-items:flex-start;padding:0 0 11px}
.ltrail li:last-child{padding-bottom:0}
.ltrail li:not(:last-child)::before{content:"";position:absolute;left:11px;top:24px;bottom:-1px;width:2px;background:#E8DCC6}
.ltrail .lv{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;background:#F3E9D6;color:#8A6A38;border:1px solid #E3D2B0;position:relative;z-index:1}
.ltrail li.last .lv{background:linear-gradient(135deg,#C9A86A,#9C7A44);color:#fff;border-color:#9C7A44}
.ltrail .lt{min-width:0;padding-top:2px;line-height:1.3}
.ltrail .lt b{font-size:13.5px;color:#211F1C;font-weight:700}
.ltrail .lt span{font-size:13px;color:#5A534D}
.ltrail .lt small{display:block;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;color:#9A9087;margin-top:2px;word-break:break-all}
.ltrail li.last .lt b{color:#7E443F}
.ltrail-fac{margin-top:10px;padding-top:9px;border-top:1px dashed #E8DCC6;font-size:12px;color:#746C64}.ltrail-fac b{color:#211F1C}
.ltrail-empty{font-size:12.5px;color:#9A9087}
.mode-bar{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--info-bg);color:var(--info);font-size:13px;font-weight:600;border-bottom:1px solid #D6E3F0}
.mode-bar.edit{background:var(--warn-bg);color:var(--warn);border-bottom-color:#F3DFBF}
.mode-bar .grow{flex:1}

/* image box */
.imgbox{border:1.5px dashed #D9D2C6;border-radius:10px;background:var(--panel);aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden;position:relative;cursor:pointer}
.imgbox img{width:100%;height:100%;object-fit:contain;background:#fff}
.imgbox .ph-txt{text-align:center;color:var(--muted);font-size:12px;padding:10px}
.imgbox .ph-txt svg{width:34px;height:34px;color:var(--faint);display:block;margin:0 auto 6px}
.imgbar{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}

/* combo */
.combo{position:relative}
.combo .list{position:absolute;left:0;right:0;top:calc(100% + 4px);background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,.12);max-height:300px;overflow:auto;z-index:50;display:none}
.combo.open .list{display:block}
.combo .opt{padding:8px 12px;cursor:pointer;border-bottom:1px solid var(--line-2);font-size:13.5px;line-height:1.3}
.combo .opt:last-child{border-bottom:0}
.combo .opt small{display:block;color:var(--muted);font-size:11.5px;margin-top:1px;font-family:ui-monospace,Consolas,monospace}
.combo .opt.act,.combo .opt:hover{background:var(--gold-soft)}
.combo .opt.cur{font-weight:600;box-shadow:inset 3px 0 0 var(--gold)}
.combo .empty{padding:10px 12px;color:var(--muted);font-size:13px}
.combo .more{padding:8px 12px;color:var(--muted);font-size:12px;background:var(--panel)}

/* tree */
.tree{max-height:calc(100vh - 260px);min-height:300px;overflow:auto;padding:6px 0}
.tree ul{list-style:none}
.tree li>.node{display:flex;align-items:center;gap:6px;padding:6px 10px 6px 0;cursor:pointer;border-radius:6px;min-width:0}
.tree li>.node:hover{background:var(--panel)}
.tree li>.node.sel{background:var(--gold-soft)}
.tree .tw{width:22px;height:22px;flex:none;display:grid;place-items:center;border:0;background:none;cursor:pointer;color:var(--muted);border-radius:4px}
.tree .tw svg{width:14px;height:14px;transition:transform .15s}
.tree li.open>.node .tw svg{transform:rotate(90deg)}
.tree .tw.none{visibility:hidden}
.tree .nm{min-width:0;flex:1}
.tree .nm b{font-weight:600;font-size:13.5px}
.tree .nm span{color:var(--ink-2);font-size:13px}
.tree .nm small{display:block;color:var(--muted);font-size:11px;font-family:ui-monospace,Consolas,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tree .cnt{font-size:11px;color:var(--muted);flex:none;padding-right:4px}
.tree .cnt-btn{flex:none;border:1px solid #E9DCC3;background:var(--gold-soft);color:var(--gold-ink);font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 10px;cursor:pointer;white-space:nowrap}
.tree .cnt-btn:hover{background:#EEDDBF}
.tree .opn{flex:none;border:1px solid var(--line);background:#fff;color:var(--ink-2);font-size:11.5px;font-weight:600;border-radius:6px;padding:3px 9px;cursor:pointer;opacity:0;transition:opacity .15s}
.tree .node:hover .opn,.tree .node.sel .opn{opacity:1}
@media (hover:none){.tree .opn{opacity:1}}
.tree li.grp>.node{background:#FBF7EF}
.tree .node.asset{padding-left:6px;cursor:pointer}
.tree .node.asset .dot{width:8px;height:8px;border-radius:2px;background:var(--gold-2);flex:none;margin:0 7px 0 7px}
.tree .node.asset .nm b{font-size:12.5px;color:var(--gold-ink)}
.tree .node.asset .nm span{font-size:12.5px}
.tree .node.asset.disposed{opacity:.6}
.tree .node.asset .opn{opacity:1}
.tree li.grp>ul{display:none}.tree li.grp.open>ul{display:block}
.tree li.grp.open>.node .tw svg{transform:rotate(90deg)}
.tree li>ul{display:none;margin-left:14px;border-left:1px dashed var(--line);padding-left:4px}
.tree li.open>ul{display:block}

/* tables */
.tbl-wrap{overflow:auto;max-height:calc(100vh - 300px);min-height:200px}
table.tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
.tbl th{position:sticky;top:0;background:#FBFAF7;text-align:left;font-size:11.5px;font-weight:700;color:var(--ink-2);padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap;z-index:1}
.tbl td{padding:8px 10px;border-bottom:1px solid var(--line-2);vertical-align:top;max-width:280px;overflow:hidden;text-overflow:ellipsis}
.tbl tr.click{cursor:pointer}
.tbl tr.click:hover td{background:#FCFAF5}
.tbl td.mono,.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12.5px}
.tbl input.cell{width:100%;min-width:90px;border:1px solid transparent;background:transparent;padding:5px 6px;border-radius:5px;font-size:13px}
.tbl input.cell:focus{border-color:var(--gold);background:#fff;outline:none}
.tbl tr.dirty td{background:#FFFBEF}
.filters{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:0 12px}
.more-row{text-align:center;padding:12px}
.empty-state{padding:40px 16px;text-align:center;color:var(--muted)}
.empty-state svg{width:40px;height:40px;color:var(--faint);margin-bottom:8px}

/* drawer */
.overlay{position:fixed;inset:0;background:rgba(20,18,14,.35);z-index:60;display:none}
.overlay.on{display:block}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);background:#fff;z-index:61;transform:translateX(100%);transition:transform .22s ease;display:flex;flex-direction:column;box-shadow:-10px 0 40px rgba(0,0,0,.15)}
.drawer.on{transform:none}
.drawer .hd{display:flex;align-items:flex-start;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.drawer .hd h2{font-size:18px;font-weight:700}
.drawer .hd p{font-size:13px;color:var(--muted);margin-top:2px}
.drawer .bd{flex:1;overflow:auto;padding:16px 18px}
.drawer .ft{display:flex;gap:8px;padding:12px 18px;border-top:1px solid var(--line);flex-wrap:wrap;background:var(--panel)}
.x{border:0;background:none;width:36px;height:36px;border-radius:8px;cursor:pointer;display:grid;place-items:center;color:var(--muted);flex:none;margin-left:auto}
.x:hover{background:var(--panel);color:var(--ink)}
.x svg{width:20px;height:20px}
dl.facts{display:grid;grid-template-columns:140px 1fr;gap:0;font-size:13px;border:1px solid var(--line-2);border-radius:8px;overflow:hidden}
dl.facts dt,dl.facts dd{padding:7px 10px;border-bottom:1px solid var(--line-2)}
dl.facts dt{background:var(--panel);color:var(--muted);font-weight:600;font-size:12px}
dl.facts dd{word-break:break-word}
dl.facts dt:last-of-type,dl.facts dd:last-of-type{border-bottom:0}
.timeline{list-style:none;font-size:13px}
.timeline li{padding:8px 0 8px 18px;border-left:2px solid var(--line);position:relative}
.timeline li::before{content:"";position:absolute;left:-5px;top:13px;width:8px;height:8px;border-radius:50%;background:var(--gold)}
.timeline small{color:var(--muted)}

/* modal */
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-48%);opacity:0;pointer-events:none;width:min(480px,calc(100% - 24px));max-height:calc(100% - 24px);overflow:auto;background:#fff;border-radius:14px;z-index:62;box-shadow:0 20px 60px rgba(0,0,0,.25);transition:opacity .15s,transform .15s}
.modal.on{opacity:1;pointer-events:auto;transform:translate(-50%,-50%)}
.modal .hd{padding:16px 18px 6px;font-size:17px;font-weight:700}
.modal .bd{padding:8px 18px 4px;font-size:14px;color:var(--ink-2)}
.modal .ft{display:flex;gap:8px;justify-content:flex-end;padding:14px 18px}

.toast-wrap{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:80;display:flex;flex-direction:column;gap:8px;align-items:center;width:calc(100% - 24px);max-width:460px;pointer-events:none}
.toast{background:#1C1C1C;color:#fff;padding:11px 16px;border-radius:10px;font-size:13.5px;box-shadow:0 8px 24px rgba(0,0,0,.25);animation:fade .2s ease;pointer-events:auto;line-height:1.4}
.toast.err{background:#7E1F18}.toast.ok{background:#1E5A37}

.tabs-line{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:14px;overflow:auto}
.tabs-line button{border:0;background:none;padding:10px 14px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap;font-size:13.5px}
.tabs-line button.on{color:var(--ink);border-bottom-color:var(--gold)}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.tile .bd p{color:var(--ink-2);font-size:13px;line-height:1.55;margin-bottom:12px}
.stat{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.stat .card{padding:14px 16px}
.stat b{display:block;font-size:24px;font-weight:700}
.stat span{font-size:12px;color:var(--muted)}

.bnav{display:none}
.mobile-only{display:none}

/* =================== RESPONSIVE =================== */
@media (max-width:1280px){ .grid-asset{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .grid-asset .imgcol{grid-column:1/-1;display:grid;grid-template-columns:200px 1fr;gap:14px;align-items:start} }
@media (max-width:1180px){ .brand{padding:40px 26px} .brand-inner{column-gap:18px} .item p{font-size:13.5px} .split{grid-template-columns:1fr} .tree{max-height:420px} }
@media (max-width:960px){
  .login{grid-template-columns:1fr}
  .auth{order:1;padding:28px 20px 36px;align-items:flex-start}
  .login .divider{order:2;height:1px;width:auto;margin:0 24px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
  .brand{order:3;padding:36px 20px 44px}
  .m-logo{display:flex}
  .brand-inner{grid-template-columns:1fr 1fr;grid-template-areas:"logo logo" "vision mission" "head head" "p1 p2" "p3 p3";row-gap:28px}
  :root{--rail:0px}
  .layout{grid-template-columns:1fr}
  .rail{display:none}
  main.view{padding:14px 12px calc(84px + env(safe-area-inset-bottom))}
  .bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:35;background:#fff;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
  .bnav button{border:0;background:none;padding:8px 0 7px;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;font-weight:600;color:var(--muted);cursor:pointer}
  .bnav button svg{width:21px;height:21px}
  .bnav button.on{color:var(--gold-ink)}
  .gsearch{display:none}
  .shell .mark small{display:none}
  .mobile-only{display:block}
  .desk-only{display:none!important}
  .ph h1{font-size:26px}
  .grid-asset{grid-template-columns:1fr}
  .grid-asset .imgcol{grid-template-columns:1fr}
  .tbl-wrap{max-height:none}
  .card>.ft{gap:8px}
  .card>.ft .left{width:100%}
  .card>.ft .btn{flex:1 1 auto}
}
@media (max-width:560px){
  .brand-inner{grid-template-columns:1fr;grid-template-areas:"logo" "vision" "mission" "head" "p1" "p2" "p3"}
  .logo{width:150px;height:130px}.logo-name{white-space:normal}.pillar h3{min-height:0}
  .title{font-size:30px}
  .row2,.row3{grid-template-columns:1fr}
  .shell{padding:0 10px;gap:8px}
  .shell .mark b{font-size:17px}
  .sync span{display:none}
  dl.facts{grid-template-columns:110px 1fr}
  .card>.bd{padding:14px 12px}
}
@media print{
  .shell,.rail,.bnav,.drawer .ft,.ph .actions,.toast-wrap{display:none!important}
  .drawer{position:static;transform:none;box-shadow:none;width:100%}
  body *{visibility:hidden} .drawer,.drawer *{visibility:visible} .drawer{position:absolute;left:0;top:0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* =================== DASHBOARD THEME (Asset Data Dashboard) =================== */
.dsh{--d-card:#FFFCF6;--d-card2:#FBF6EE;--d-line:#E3D7C6;--d-line2:#EAE2D8;--d-ink:#211F1C;--d-muted:#746C64;--d-soft:#E8E0D5;
  --d-maroon:#9F4C47;--d-olive:#737A52;--d-gold:#B48738;--d-slate:#35434D;--d-shadow:0 10px 28px rgba(70,52,35,.07)}
.dsh .ph h1{font-family:var(--sans);font-weight:800;font-size:26px;letter-spacing:-.3px;color:var(--d-ink)}
.dsh .ph p{color:var(--d-muted)}
.dsh .btn.dsh-dark{background:#2B2825}.dsh .btn.dsh-dark:hover{background:#000}
.dsh .btn.dsh-maroon{background:var(--d-maroon)}.dsh .btn.dsh-maroon:hover{background:#84403C}
.dsh .btn.dsh-slate{background:var(--d-slate)}.dsh .btn.dsh-slate:hover{background:#26323a}
.dsh .btn.dsh-olive{background:var(--d-olive)}.dsh .btn.dsh-olive:hover{background:#5f6644}
.dsh .btn.ghost{background:var(--d-card);border-color:var(--d-line)}
.dsh-live{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--d-card2);border:1px solid var(--d-line);border-radius:16px;padding:12px 14px;margin-bottom:18px}
.dsh-file{display:flex;align-items:center;gap:10px;margin-left:6px;min-width:0}
.dsh-file b{display:block;font-size:13px;color:var(--d-ink)}.dsh-file small{display:block;font-size:11px;color:var(--d-muted)}
.dsh-dot{width:9px;height:9px;border-radius:50%;background:var(--d-olive);box-shadow:0 0 0 4px #EBEDDF;flex:none}
.dsh-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:22px}
.dsh-kpi{background:var(--d-card);border:1px solid var(--d-line);border-radius:16px;padding:18px 18px 16px 22px;position:relative;overflow:hidden;cursor:pointer;box-shadow:var(--d-shadow);transition:transform .12s}
.dsh-kpi:hover{transform:translateY(-1px)}
.dsh-kpi:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--d-maroon)}
.dsh-kpi.olive:before{background:var(--d-olive)}.dsh-kpi.gold:before{background:var(--d-gold)}.dsh-kpi.slate:before{background:var(--d-slate)}
.dsh-kpi span{display:block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#5A534D}
.dsh-kpi b{display:block;margin-top:10px;font-size:30px;line-height:1.05;font-weight:800;color:var(--d-ink);letter-spacing:-.5px}
.dsh-kpi small{display:block;margin-top:8px;font-size:11.5px;color:#8A8176}
.dsh-sec{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 0 12px}
.dsh-sec h3{font-size:18px;font-weight:800;color:var(--d-ink)}.dsh-sec p{font-size:12px;color:var(--d-muted);margin-top:4px}
.dsh-pill{font-size:11px;color:var(--d-muted);background:#EEE7DD;border:1px solid var(--d-line);border-radius:999px;padding:5px 10px;white-space:nowrap}
.dsh-pivots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:22px}
.dsh-pc,.dsh-panel{background:var(--d-card);border:1px solid var(--d-line);border-radius:16px;padding:17px;min-width:0;box-shadow:var(--d-shadow)}
.dsh-pch{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px}.dsh-pch h4{font-size:14.5px;font-weight:800;color:var(--d-ink)}.dsh-pch span{font-size:11px;color:var(--d-muted)}
.dsh-total{font-size:27px;font-weight:800;letter-spacing:-.4px;color:var(--d-ink);margin:2px 0 14px;cursor:pointer}
.dsh-total small{font-size:11px;font-weight:600;color:var(--d-muted);margin-left:4px}
.dsh-hbar{display:grid;gap:7px;margin-bottom:14px;cursor:pointer}
.dsh-hmeta{display:flex;justify-content:space-between;font-size:12.5px;color:#514B46}.dsh-hmeta b{font-size:13px;color:var(--d-ink)}
.dsh-htrack{height:12px;background:var(--d-soft);border-radius:999px;overflow:hidden}
.dsh-htrack i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#9F4C47,#BD6B5E)}
.dsh-htrack i.olive{background:linear-gradient(90deg,#737A52,#97A06E)}.dsh-htrack i.gold{background:linear-gradient(90deg,#B48738,#D2A85A)}
.dsh-pfoot{display:flex;justify-content:space-between;border-top:1px solid var(--d-line2);padding-top:11px;margin-top:4px;font-size:11.5px;color:var(--d-muted)}.dsh-pfoot b{color:#3A3531}
.dsh-cols{display:flex;align-items:flex-end;justify-content:center;gap:34px;height:150px;border-bottom:1px solid var(--d-line2);padding:0 10px}
.dsh-col{height:100%;flex:0 1 80px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px;cursor:pointer}
.dsh-col b{font-size:12.5px;color:var(--d-ink)}
.dsh-col i{display:block;width:min(72px,100%);border-radius:8px 8px 2px 2px;background:linear-gradient(180deg,#9F4C47,#B48738);min-height:3px}
.dsh-col span{font-size:11px;color:var(--d-muted);margin-bottom:-22px}
.dsh-note{margin-top:28px;font-size:10.5px;color:#9A9087}
.dsh-two{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.dsh-wide{grid-column:1/-1}.dsh-mb{margin-bottom:14px}
.dsh-ph{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding-bottom:10px;margin-bottom:12px;border-bottom:1px solid #E8DDCF}
.dsh-ph h3{font-size:15px;font-weight:800;color:var(--d-ink)}.dsh-ph span{font-size:11px;color:#8A8176;text-align:right}
.dsh-bars{display:grid;gap:10px}
.dsh-row{display:grid;grid-template-columns:minmax(120px,190px) 1fr 58px;gap:10px;align-items:center;cursor:pointer;border-radius:6px;padding:2px 0}
.dsh-row:hover .dsh-lbl,.dsh-row:hover b{color:var(--d-maroon)}
.dsh-lbl{font-size:12px;color:#514B46;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dsh-track{height:11px;border-radius:999px;background:var(--d-soft);overflow:hidden}
.dsh-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#9F4C47,#B48738)}
.dsh-track i.olive{background:linear-gradient(90deg,#737A52,#97A06E)}.dsh-track i.gold{background:linear-gradient(90deg,#B48738,#D2A85A)}
.dsh-track i.maroon{background:linear-gradient(90deg,#9F4C47,#BD6B5E)}.dsh-track i.slate{background:linear-gradient(90deg,#35434D,#5B6C78)}
.dsh-row b{text-align:right;font-size:12px;font-weight:800;color:var(--d-ink)}
.dsh-legend{display:flex;gap:16px;font-size:11px;color:var(--d-muted);margin:-4px 0 12px}
.dsh-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;background:var(--d-maroon);margin-right:6px;vertical-align:-1px}.dsh-legend i.gold{background:var(--d-gold)}
.dsh-months{display:grid;gap:9px}
.dsh-mrow{display:grid;grid-template-columns:42px 1fr minmax(170px,240px);gap:10px;align-items:center;cursor:pointer}
.dsh-mname{font-size:11.5px;font-weight:700;color:#514B46}
.dsh-mtrack{height:18px;background:var(--d-soft);border-radius:6px;overflow:hidden}
.dsh-mtrack>span{display:flex;height:100%;min-width:3px}
.dsh-mtrack i{display:block;height:100%;background:var(--d-maroon)}.dsh-mtrack i.gold{background:var(--d-gold)}
.dsh-mval{font-size:11px;color:var(--d-muted);text-align:right;white-space:nowrap}.dsh-mval b{color:var(--d-ink)}
.dsh .timeline li::before{background:var(--d-gold)}
@media (max-width:1100px){.dsh-kpis{grid-template-columns:repeat(2,1fr)}.dsh-pivots{grid-template-columns:1fr 1fr}.dsh-pivots .dsh-pc:last-child{grid-column:1/-1}}
@media (max-width:760px){
  .dsh-kpis{grid-template-columns:1fr 1fr;gap:9px}.dsh-kpi{padding:13px 13px 13px 17px}.dsh-kpi b{font-size:23px}
  .dsh-pivots,.dsh-two{grid-template-columns:1fr;gap:9px}.dsh-pivots .dsh-pc:last-child{grid-column:auto}
  .dsh-pc,.dsh-panel{padding:13px;border-radius:13px}.dsh-wide{grid-column:auto}
  .dsh-row{grid-template-columns:110px 1fr 46px;gap:7px}.dsh-mrow{grid-template-columns:34px 1fr}.dsh-mval{grid-column:2;text-align:left;white-space:normal;margin-top:-4px}
  .dsh-sec{flex-direction:column;align-items:flex-start}.dsh-file{margin-left:0}
}
@media (max-width:390px){.dsh-kpis{grid-template-columns:1fr}}

/* =================== APP-WIDE THEME (same palette as the Dashboard) =================== */
.app{--bg:#F4EFE6;--card:#FFFCF6;--panel:#FBF6EE;--line:#E3D7C6;--line-2:#EAE2D8;--ink:#211F1C;--ink-2:#4A443F;--muted:#746C64;--faint:#A39A90;
  --gold:#B48738;--gold-2:#C9A86A;--gold-soft:#F3E9D6;--gold-ink:#84603A;--maroon:#9F4C47;--maroon-2:#84403C;--olive:#737A52;--slate:#35434D;--dark:#2B2825;
  --shadow:0 10px 28px rgba(70,52,35,.06)}
body.signed-in{background:#F4EFE6}
.app .layout{background:var(--bg)}
/* top bar */
.app .shell{background:#FBF7F0;border-bottom-color:var(--line)}
.app .gsearch input{background:#fff;border-color:var(--line)}
.app .userbtn{background:#fff;border-color:var(--line)}
/* dark sidebar */
.app .rail{background:var(--dark);border-right:0;padding-top:16px}
.app .rail button{color:#D9D0C4;font-weight:500}
.app .rail button svg{color:#B7AC9E}
.app .rail button:hover{background:rgba(255,255,255,.06);color:#fff}
.app .rail button.on{background:rgba(255,255,255,.11);color:#fff;font-weight:700;box-shadow:inset 3px 0 0 var(--gold)}
.app .rail button.on svg{color:var(--gold-2)}
.app .rail .sep{background:rgba(255,255,255,.1)}
/* page headings like the dashboard */
.app .ph h1{font-family:var(--sans);font-weight:800;font-size:26px;letter-spacing:-.3px;color:var(--ink)}
.app .ph p{color:var(--muted)}
/* cards / panels */
.app .card{background:var(--card);border-color:var(--line);border-radius:16px;box-shadow:var(--shadow)}
.app .card>.hd{border-bottom-color:#E8DDCF}
.app .card>.hd h2{font-weight:800}
.app .card>.ft{background:var(--panel);border-top-color:var(--line-2);border-radius:0 0 16px 16px}
.app .mode-bar{background:#EEF1F2;color:var(--slate);border-bottom-color:#DCE2E5}
.app .mode-bar.edit{background:#F6EBD6;color:#7A5A22;border-bottom-color:#EAD9B6}
/* buttons: primary = maroon, dark = ink */
.app .btn{background:var(--dark)}
.app .btn:hover{background:#000}
.app .btn.gold{background:var(--maroon)}
.app .btn.gold:hover{background:var(--maroon-2)}
.app .btn.ghost{background:#fff;color:var(--ink);border-color:var(--line)}
.app .btn.ghost:hover{background:var(--panel);border-color:#D6C8B2}
.app .btn.danger{background:#fff;color:var(--maroon);border-color:#E8C9C4}
.app .btn.danger:hover{background:#F8ECEA}
.app .link{color:var(--maroon)}
/* inputs */
.app .in,.app .ctrl input,.app .ctrl select,.app .ctrl textarea{border-color:var(--line);background-color:#fff}
.app .ctrl input:focus,.app .ctrl select:focus,.app .ctrl textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(180,135,56,.16)}
.app .ctrl input[readonly]{background:var(--panel)}
.app .sec{color:var(--maroon)}
.app .sec::after{background:#E8DDCF}
.app .kv div{background:var(--panel);border-color:var(--line-2)}
.app .chip{background:var(--gold-soft);color:var(--gold-ink)}
.app .chip.grey{background:#EEE7DD;color:#5A534D}
.app .chip.ok{background:#EBEDDF;color:#5B6240}
.app .chip.bad{background:#F3E5E2;color:var(--maroon)}
.app .chip.info{background:#E7EAEB;color:var(--slate)}
.app .chip.warn{background:#F6EBD6;color:#8A6A2A}
.app .tabs-line{border-bottom-color:var(--line)}
.app .tabs-line button.on{border-bottom-color:var(--maroon);color:var(--ink)}
/* tables */
.app .tbl th{background:#F3ECE1;color:#4A443F;border-bottom-color:var(--line)}
.app .tbl td{border-bottom-color:#EFE7DB}
.app .tbl tr.click:hover td{background:#FBF4E8}
.app .tbl tr.dirty td{background:#FFF7E6}
/* tree */
.app .tree li>.node:hover{background:#FBF4E8}
.app .tree li>.node.sel{background:var(--gold-soft)}
.app .tree li>ul{border-left-color:#E3D7C6}
.app .tree .cnt-btn{background:#F3E5E2;border-color:#E8C9C4;color:var(--maroon)}
.app .tree .cnt-btn:hover{background:#EED7D2}
/* combo */
.app .combo .list{border-color:var(--line)}
.app .combo .opt{border-bottom-color:#F1EADF}
.app .combo .opt.act,.app .combo .opt:hover{background:#FBF1E2}
/* drawer / modal */
.drawer .hd{border-bottom-color:#E8DDCF}
.drawer .ft{background:#FBF6EE;border-top-color:#EAE2D8}
dl.facts{border-color:#EAE2D8}
dl.facts dt{background:#FBF6EE;color:#746C64}
dl.facts dt,dl.facts dd{border-bottom-color:#EFE7DB}
/* mobile bottom bar */
.app .bnav{background:var(--dark);border-top:0}
.app .bnav button{color:#B7AC9E}
.app .bnav button.on{color:#fff}
.app .bnav button.on svg{color:var(--gold-2)}
.toast{background:var(--dark,#2B2825)}

/* Search: Excel-style grid */
.s-crit{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 10px}
.s-crit .chip button{border:0;background:none;color:inherit;font-weight:800;cursor:pointer;padding:0 0 0 4px;font-size:14px;line-height:1}
.xl-wrap{max-height:calc(100vh - 330px)}
table.tbl.xl{font-size:12.5px;width:max-content;min-width:100%}
.tbl.xl th,.tbl.xl td{white-space:nowrap;max-width:320px;padding:7px 10px;border-right:1px solid #EFE7DB}
.tbl.xl thead tr.xl-let th{background:#EAE1D3;color:#8A8176;font-size:10.5px;text-align:center;padding:3px 10px;font-weight:700;top:0}
.tbl.xl thead tr:nth-child(2) th{top:22px}
.tbl.xl .xl-rn{position:sticky;left:0;background:#F3ECE1;color:#8A8176;text-align:right;font-size:11px;z-index:2;min-width:42px}
.tbl.xl thead .xl-rn{z-index:3}
.tbl.xl td.xl-key{font-weight:700;color:var(--maroon,#9F4C47)}
.colpick{display:grid;grid-template-columns:1fr;gap:6px}
.colpick .check{padding:5px 8px;border:1px solid #EAE2D8;border-radius:8px;background:#fff}
.colpick .check .mono{display:inline-block;min-width:24px;color:#8A8176}
.s-btns{align-self:end}
@media (max-width:960px){.xl-wrap{max-height:none}}
.modal .btn.gold,.drawer .btn.gold{background:#9F4C47}.modal .btn.gold:hover,.drawer .btn.gold:hover{background:#84403C}
.modal .btn:not(.ghost):not(.gold):not(.danger),.drawer .btn:not(.ghost):not(.gold):not(.danger){background:#2B2825}
.modal .btn.ghost,.drawer .btn.ghost{border-color:#E3D7C6}

/* =================== FORM POLISH (all pages) =================== */
.app .card{overflow:visible}
.app .card>.mode-bar:first-child,.app .card>.hd:first-child{border-radius:16px 16px 0 0}
.app .mode-bar{padding:12px 20px;font-size:13px;letter-spacing:.1px}
.app .card>.bd,.app form.bd{padding:20px 20px 6px}
.app .card>.ft{padding:14px 20px}
/* consistent vertical rhythm: every field block is the same height step */
.app .field{margin-bottom:18px}
.app .field>label,.app .lbl{font-size:12.5px;font-weight:600;color:#4A443F;margin-bottom:7px;letter-spacing:.1px}
.app .row2,.app .row3{gap:0 18px}
.app .in,.app .ctrl input,.app .ctrl select{height:44px;border-radius:10px;padding:0 14px;font-size:14.5px}
.app .ctrl select{padding-right:36px}
.app .ctrl textarea{border-radius:10px;padding:11px 14px}
.app .tagin{gap:10px}
/* helper lines take no space until they have something to say */
.app .status-line{min-height:0;margin-top:6px}
.app .status-line:empty{display:none}
.app .hint{margin-top:6px;font-size:12px;color:#8A8176;line-height:1.4}
.app .hint:empty{display:none}
.app .field .check{margin-top:8px}
.app .sec{margin:8px 0 14px;font-size:11px;letter-spacing:.9px}
.app .kv{gap:10px;margin:0 0 18px}
.app .kv div{border-radius:10px;padding:8px 12px}
.app .pathbox{border-radius:10px;padding:11px 14px;min-height:44px;display:flex;align-items:center}
.app .lpath{border-radius:12px}
.app .filters{gap:0 16px}
.app .filters .field{margin-bottom:14px}
.app .imgbox{border-radius:12px}
@media (max-width:560px){.app .card>.bd,.app form.bd{padding:16px 14px 4px}.app .field{margin-bottom:16px}.app .row2,.app .row3{gap:0}}

/* mobile: 6-item bottom bar, full-width facility picker on Hierarchy */
@media (max-width:960px){
  .app .bnav{grid-template-columns:repeat(6,1fr)}
  .app .bnav button{font-size:10px;padding:8px 0 7px}
  #p-hierarchy .ph{flex-direction:column;align-items:stretch}
  #p-hierarchy .ph .actions,#p-hierarchy #hFac{width:100%;min-width:0!important}
  #p-hierarchy .card>.hd{flex-direction:column;align-items:stretch;gap:10px}
  #p-hierarchy .card>.hd>div{justify-content:stretch!important}
  #p-hierarchy .card>.hd .ctrl{max-width:none!important}
}
@media (max-width:960px){
  .app .s-quick{grid-column:1/-1}
  .app .s-quick input{height:48px;font-size:16px}
  .app .s-btns{grid-column:1/-1}
}

/* =================== BARCODE SCANNER =================== */
.scan-btn{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border:1px solid #E3D7C6;background:#fff;border-radius:999px;color:#9F4C47;font-weight:700;font-size:13px;cursor:pointer}
.scan-btn svg{width:18px;height:18px}
.scan-btn:hover{background:#FBF1E2}
.s-qrow{display:flex;gap:8px}.s-qrow .ctrl{flex:1}.s-qrow .btn{height:48px;flex:none}
.scanner{position:fixed;inset:0;z-index:90;background:#141210;color:#fff;display:flex;flex-direction:column}
.scanner[hidden]{display:none}
body.scanning{overflow:hidden}
.sc-top{display:flex;align-items:center;justify-content:space-between;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;font-size:16px}
.sc-top .x{color:#fff}.sc-top .x:hover{background:rgba(255,255,255,.1);color:#fff}
.sc-view{position:relative;flex:1;overflow:hidden;background:#000}
.sc-view video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sc-frame{position:absolute;left:50%;top:50%;width:min(78vw,420px);height:min(42vw,220px);transform:translate(-50%,-50%);border-radius:16px;box-shadow:0 0 0 9999px rgba(0,0,0,.45);border:2px solid #D2A85A}
.sc-frame i{position:absolute;left:8%;right:8%;top:50%;height:2px;background:#E25C4E;box-shadow:0 0 12px #E25C4E;animation:scl 1.6s ease-in-out infinite}
@keyframes scl{0%,100%{transform:translateY(-38px)}50%{transform:translateY(38px)}}
.sc-msg{padding:12px 16px;text-align:center;font-size:14px;color:#E9E2D8;min-height:44px}
.sc-msg.ok{color:#B9D49A}.sc-msg.bad{color:#F2B1A8}
.sc-manual{display:flex;gap:8px;padding:0 14px calc(14px + env(safe-area-inset-bottom))}
.sc-manual input{flex:1;height:46px;border-radius:10px;border:1px solid #4A443F;background:#211F1C;color:#fff;padding:0 14px;font-size:16px;outline:none;text-transform:uppercase}
.sc-manual input:focus{border-color:#D2A85A}
.sc-manual .btn{height:46px;background:#9F4C47}
@media (max-width:560px){.scan-btn span{display:none}.scan-btn{width:38px;padding:0;justify-content:center}}
.sc-view{min-height:0}
.scanner .sc-manual{display:flex}
.sc-manual input::placeholder{text-transform:none;color:#8A8176}

/* ---- photo slots (3 boxes, delete inside) ---- */
.imgs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.imgs .imgbox{aspect-ratio:1/1}
.imgs .imgbox .ph-txt{font-size:10.5px;padding:4px 6px;line-height:1.25}
.imgs .imgbox .ph-txt svg{width:22px;height:22px;margin-bottom:3px}
.imgbox.has{border-style:solid;border-color:#E8DDCF}
.img-del{position:absolute;top:6px;right:6px;width:30px;height:30px;border-radius:50%;border:0;background:rgba(159,76,71,.92);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.25);padding:0}
.img-del svg{width:16px;height:16px}
.img-del:hover{background:#7E3A36}
.dw-imgs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:14px}
.dw-imgs.n1{grid-template-columns:1fr}.dw-imgs.n2{grid-template-columns:1fr 1fr}
.dw-imgs .imgbox{aspect-ratio:4/3;border-style:solid}

/* ---- recent entries under forms ---- */
.recent-card{margin-top:14px}
.recent-card .hd .grow{flex:1}
.rc-list{display:flex;flex-direction:column}
.rc-row{display:grid;grid-template-columns:110px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line-2);cursor:pointer}
.rc-row:last-child{border-bottom:0}
.rc-row:hover{background:#FBF5EC}
.rc-row.on{background:#F6EADF;box-shadow:inset 3px 0 0 #9F4C47}
.rc-tag{font-weight:700;color:#9F4C47;font-size:13px}
.rc-main{min-width:0}
.rc-main b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-main small,.rc-when small{display:block;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-when{text-align:right;font-size:12px;color:var(--muted)}
.rc-when span{color:#5A524A;white-space:nowrap}
.rc-empty{padding:18px 16px;color:var(--muted);font-size:13px}
@media (max-width:640px){
  .rc-row{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:10px 12px}
  .rc-tag{grid-column:1}.rc-main{grid-column:1}.rc-when{grid-column:1;text-align:left}
  .rc-edit{grid-column:2;grid-row:1/4;align-self:center}
  .rc-when small{display:inline;margin-left:6px}
}

/* =================== LOGIN — refined card =================== */
.auth{background:radial-gradient(120% 80% at 100% 0%,#F6ECE0 0%,rgba(246,236,224,0) 60%),radial-gradient(90% 70% at 0% 100%,#F3E6E2 0%,rgba(243,230,226,0) 55%),#FBF8F3}
.auth .card{position:relative;max-width:420px;padding:34px 34px 26px;background:#fff;border:1px solid #EEE4D6;border-radius:22px;box-shadow:0 1px 2px rgba(60,40,20,.04),0 24px 60px -24px rgba(90,55,30,.28);overflow:hidden}
.auth .card::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,#9F4C47,#C9A46A 55%,#9F4C47)}
.auth .m-logo{display:flex;gap:12px;margin-bottom:26px;padding-bottom:18px;border-bottom:1px solid #F1E9DE}
.auth .m-logo svg{width:44px;height:40px;flex:none}
.auth .m-logo b{font-family:var(--serif);font-size:13px;letter-spacing:2.2px;color:#2B2825}
.auth .m-logo span{font-size:12.5px;color:#A88452;font-style:italic}
.auth .title{font-size:32px;color:#2B2825;letter-spacing:-.2px}
.auth .subtitle{font-size:14px;color:#7D746A;margin:6px 0 22px}
.auth .seg{background:#F5EFE7;border:1px solid #EDE3D5;margin-bottom:22px}
.auth .seg button{font-weight:600;color:#8A8076;transition:color .2s}
.auth .seg button[aria-selected="true"]{color:#9F4C47}
.auth .seg .pill{box-shadow:0 2px 6px rgba(90,55,30,.12)}
.auth .field{margin-bottom:14px}
.auth .field>label{font-size:12.5px;color:#4A433C;margin-bottom:6px}
.auth .ctrl input{height:48px;border:1.5px solid #E6DDD0;border-radius:12px;background:#FFFDFA;padding:0 14px;font-size:15.5px}
.auth .ctrl input:hover{border-color:#D8CBB9}
.auth .ctrl input:focus{border-color:#9F4C47;background:#fff;box-shadow:0 0 0 4px rgba(159,76,71,.12)}
.auth .ctrl input::placeholder{color:#B8AFA4}
.auth .link{color:#9F4C47;font-weight:600}
.auth .link:hover{color:#7E3A36;text-decoration:underline}
.auth .btn.block{height:50px;border-radius:12px;background:linear-gradient(180deg,#A9554F,#8E413C);border:0;color:#fff;font-size:15.5px;font-weight:600;letter-spacing:.3px;box-shadow:0 10px 22px -10px rgba(142,65,60,.65),inset 0 1px 0 rgba(255,255,255,.15);transition:transform .12s,box-shadow .2s,filter .2s}
.auth .btn.block:hover{filter:brightness(1.05);box-shadow:0 14px 26px -12px rgba(142,65,60,.7)}
.auth .btn.block:active{transform:translateY(1px)}
.auth .switch{margin-top:18px;color:#7D746A}
.auth .foot{margin-top:24px;padding-top:16px;border-top:1px solid #F1E9DE;color:#A69C90}
.auth .meter i{border-radius:3px}
@media (max-width:520px){
  .auth{padding:20px 14px 30px}
  .auth .card{padding:26px 20px 20px;border-radius:18px}
  .auth .title{font-size:28px}
}
.sc-manual .sc-photo{background:#2F2B27;border:1px solid #4A443F;color:#F1E7D8;gap:6px;padding:0 12px;flex:none}
.sc-manual .sc-photo svg{width:18px;height:18px}
.sc-manual input{min-width:0}
/* official PEO mark sizes (square-ish 713×697) */
.logo{width:180px;height:176px}
.shell .mark svg{width:46px;height:46px}
.auth .m-logo svg{width:54px;height:53px}
@media (max-width:640px){ .logo{width:140px;height:137px} .shell .mark svg{width:40px;height:40px} }
/* picture column: three large boxes stacked (PC), side by side when the column spans the page */
.imgs{grid-template-columns:1fr;gap:14px}
.imgs .imgbox{aspect-ratio:1/1;border-radius:18px;border-width:1.5px}
.imgs .imgbox .ph-txt{font-size:13px;padding:10px}
.imgs .imgbox .ph-txt svg{width:34px;height:34px;margin-bottom:6px}
.imgs .img-del{top:10px;right:10px;width:36px;height:36px}
.imgs .img-del svg{width:18px;height:18px}
@media (max-width:1280px){
  .grid-asset .imgcol{grid-template-columns:1fr}
  .imgs{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .imgs{gap:8px}
  .imgs .imgbox{border-radius:12px}
  .imgs .imgbox .ph-txt{font-size:10.5px;padding:4px 6px}
  .imgs .imgbox .ph-txt svg{width:22px;height:22px}
  .imgs .img-del{top:6px;right:6px;width:30px;height:30px}
}
/* view-only logins: Dashboard, Hierarchy, Search only */
body.viewer [data-page="locations"],body.viewer [data-page="assets"],body.viewer [data-page="masters"],body.viewer [data-page="data"],body.viewer [data-page="users"],body.viewer .bnav [data-page="more"]{display:none!important}
body.viewer .rail hr,body.viewer .rail .sep{display:none}
body.viewer .bnav{grid-template-columns:repeat(3,1fr)!important}
/* Excel auto-save banner */
.fs-banner{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#FBEFD9;border-bottom:1px solid #EBD3A8;color:#5A4320;font-size:13.5px}
.fs-banner[hidden]{display:none}
.fs-banner>svg{width:20px;height:20px;flex:none;color:#A8792F}
.fs-banner .fs-txt{flex:1;min-width:0}
.fs-banner .btn{flex:none}
.fs-banner .x{color:#8A6A38}
@media (max-width:900px){.fs-banner{display:none!important}}
.rc-row{cursor:pointer}
/* recent asset rows: F-Tag / Make / Model / Serial */
#asRecentList .rc-row{grid-template-columns:110px minmax(180px,1.1fr) minmax(0,2fr) auto auto}
.rc-kv{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px 14px;min-width:0}
.rc-kv span{display:flex;flex-direction:column;min-width:0;font-size:12.5px;color:#3B342E;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-kv i{font-style:normal;font-size:10.5px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;color:#A0958A}
.rc-kv span:first-child{font-family:var(--mono,ui-monospace,monospace);color:#5A524A}
@media (max-width:1100px){ #asRecentList .rc-row{grid-template-columns:110px minmax(0,1fr) auto auto} #asRecentList .rc-kv{grid-column:2/4;grid-row:2} }
@media (max-width:640px){
  #asRecentList .rc-row{grid-template-columns:minmax(0,1fr) auto}
  #asRecentList .rc-kv{grid-column:1;grid-row:auto;grid-template-columns:repeat(2,minmax(0,1fr))}
}
.rc-kv span:first-child i{font-family:var(--sans,inherit)}
/* login left panel: official wall design image */
.brand-wall{position:relative;z-index:1;display:block;width:100%;max-width:1000px}
.brand-wall img{display:block;width:100%;height:auto}
@media (max-width:900px){ .brand-wall{max-width:640px;margin:0 auto} }
@media (max-width:900px){ .login{align-content:start} .login .brand{padding:22px 10px 30px;min-height:0} .brand-wall{max-width:none} }
/* login card header text — clearer */
.auth .m-logo b{font-family:var(--serif);font-size:15px;font-weight:700;letter-spacing:.9px;white-space:nowrap;color:#1F1B18;line-height:1.25}
.auth .m-logo span{font-size:14px;font-weight:600;color:#9A7440;margin-top:2px;display:block}
@media (max-width:520px){ .auth .m-logo b{font-size:13px;letter-spacing:.5px} }
/* combo ▾ arrow */
.combo .ctrl{position:relative}
.combo.has-arrow .ctrl input{padding-right:40px}
.cb-arrow{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:#8A8076;display:grid;place-items:center;cursor:pointer;padding:0}
.cb-arrow svg{width:18px;height:18px;transition:transform .15s}
.cb-arrow:hover{background:#F3ECE2;color:#9F4C47}
.combo.open .cb-arrow svg{transform:rotate(180deg)}
/* column chooser: reorder */
.colsort{display:flex;flex-direction:column;gap:6px}
.colrow{display:flex;align-items:center;gap:8px;border:1px solid var(--line-2,#EEE4D6);border-radius:10px;background:#fff;padding:4px 6px 4px 4px;transition:background .2s,box-shadow .2s}
.colrow .check{flex:1;min-width:0;margin:0;padding:6px 4px}
.colrow .grip{cursor:grab;color:#B3A89B;font-size:14px;letter-spacing:-3px;padding:6px 6px;user-select:none}
.colrow.dragging{opacity:.5;box-shadow:0 6px 18px rgba(0,0,0,.12)}
.colrow.moved{background:#FBEFD9}
.colrow .mv{display:flex;gap:4px}
.colrow .mv button{width:30px;height:28px;border:1px solid #E6DDD0;border-radius:7px;background:#FFFCF6;color:#8A6A38;font-size:11px;cursor:pointer;padding:0}
.colrow .mv button:hover{background:#F3ECE2;color:#9F4C47}
.colrow .check{border:0;background:none}