/* PVS CONNECT design system: red / white / black, hard borders, offset shadows */
:root{
  --red:#D3201B; --red-dark:#A81511; --ink:#000; --paper:#fff; --bg:#F0EFEC; --mute:#5b5b5b;
  --yellow:#FFD21F; --ok:#14793A; --line:2px solid var(--ink); --shadow:4px 4px 0 var(--ink);
  --sp1:4px; --sp2:8px; --sp3:12px; --sp4:16px; --sp5:24px; --sp6:32px;
  --font:"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-display:"Arial Black","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.5 var(--font);color:var(--ink);background:var(--bg)}
h1,h2,h3{font-family:var(--font-display);line-height:1.15;margin:0 0 var(--sp3);letter-spacing:-.01em}
h1{font-size:1.6rem} h2{font-size:1.15rem} p{margin:0 0 var(--sp3)}
a{color:var(--red-dark);text-underline-offset:2px}
:focus-visible{outline:3px solid var(--yellow);outline-offset:2px;box-shadow:0 0 0 5px var(--ink)}
.skip{position:absolute;left:-999px;top:0;background:var(--yellow);padding:var(--sp2) var(--sp3);border:var(--line);z-index:100}
.skip:focus{left:var(--sp2);top:var(--sp2)}
.logo{font-family:var(--font-display);letter-spacing:.02em;font-size:1.05rem}
.ic{flex:none}

/* shell */
.topbar{display:none}
.shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.side{background:var(--ink);color:#fff;display:flex;flex-direction:column;padding:var(--sp5) 0;border-right:var(--line)}
.side-brand{padding:0 var(--sp5) var(--sp5);border-bottom:2px solid var(--red);margin-bottom:var(--sp4)}
.side-brand .logo{display:block;font-size:1.25rem;color:#fff}
.side-sub{font-size:.8rem;color:#d0d0d0}
.side ul{list-style:none;margin:0;padding:0;flex:1}
.side a{display:flex;align-items:center;gap:var(--sp3);padding:var(--sp3) var(--sp5);color:#fff;text-decoration:none;border-left:6px solid transparent}
.side a:hover{background:#1d1d1d}
.side a.is-active{background:var(--red);border-left-color:var(--yellow);font-weight:700}
.side-logout{padding:var(--sp4) var(--sp5) 0}
main{padding:var(--sp6);max-width:1100px;width:100%}
.crumbs{font-size:.85rem;margin-bottom:var(--sp3);color:var(--mute)}
.crumbs .sep{margin:0 var(--sp2)}

/* controls */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp2);font:700 .95rem var(--font);padding:10px 18px;min-height:44px;border:var(--line);background:var(--red);color:#fff;cursor:pointer;box-shadow:var(--shadow);text-decoration:none;transition:transform .08s,box-shadow .08s}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.btn:active{transform:translate(4px,4px);box-shadow:none}
.btn[disabled],.btn.is-loading{opacity:.6;cursor:progress;pointer-events:none}
.btn-ghost{background:var(--paper);color:var(--ink)}
.side .btn-ghost{box-shadow:none;border-color:#fff;background:transparent;color:#fff}
.btn-danger{background:var(--ink)}
.btn-sm{min-height:36px;padding:6px 12px;font-size:.85rem}
.btn-block{width:100%}
.icon-btn{background:var(--paper);border:var(--line);min-width:44px;min-height:44px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.field{margin-bottom:var(--sp4)}
.field label,.label{display:block;font-weight:700;margin-bottom:var(--sp1)}
input,select,textarea{width:100%;font:inherit;padding:10px 12px;min-height:44px;border:var(--line);background:var(--paper);color:var(--ink);border-radius:0}
.field .hint{display:block;font-size:.85rem;color:var(--mute);margin-top:var(--sp1)}
.field .err{display:block;font-size:.9rem;color:var(--red-dark);font-weight:700;margin-top:var(--sp1)}
.has-error input,.has-error select{border-color:var(--red);box-shadow:3px 3px 0 var(--red)}
.check{display:flex;gap:var(--sp3);align-items:flex-start;font-size:.95rem}
.check input{width:22px;min-height:22px;margin-top:2px}
.choice{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp3)}
.choice label{border:var(--line);background:var(--paper);padding:var(--sp3);cursor:pointer;display:flex;gap:var(--sp2);align-items:center;font-weight:700}
.choice input{width:20px;min-height:20px}
.choice label:has(input:checked){background:var(--yellow);box-shadow:var(--shadow)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp4)}

/* surfaces */
.panel{background:var(--paper);border:var(--line);box-shadow:var(--shadow);padding:var(--sp5);margin-bottom:var(--sp5)}
.panel h2{margin-bottom:var(--sp3)}
.notice{border:var(--line);padding:var(--sp3) var(--sp4);margin-bottom:var(--sp4);background:var(--paper);border-left-width:10px}
.notice-error{border-left-color:var(--red)} .notice-success{border-left-color:var(--ok)} .notice-info{border-left-color:var(--yellow)}
.badge{display:inline-block;font-weight:700;font-size:.8rem;padding:2px 8px;border:2px solid var(--ink);background:var(--paper)}
.badge-ok{background:#c9efd6} .badge-warn{background:var(--yellow)} .badge-bad{background:#f6b9b6}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--sp4);margin-bottom:var(--sp5)}
.stat{background:var(--paper);border:var(--line);padding:var(--sp4)}
.stat b{display:block;font:900 1.9rem var(--font-display)}
.stat span{font-size:.9rem;color:var(--mute)}
.kv{display:grid;grid-template-columns:140px 1fr;gap:var(--sp2) var(--sp4);margin:0}
.kv dt{font-weight:700} .kv dd{margin:0}
.lock-list{list-style:none;margin:0;padding:0}
.lock-list li{display:flex;gap:var(--sp3);align-items:center;padding:var(--sp2) 0;border-bottom:1px solid #ddd}

/* tables */
.filters{display:flex;flex-wrap:wrap;gap:var(--sp3);margin-bottom:var(--sp4);align-items:end}
.filters .field{margin:0;min-width:160px;flex:1}
.table-wrap{border:var(--line);background:var(--paper);overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:.92rem}
.tbl th{background:var(--ink);color:#fff;text-align:left;padding:10px 12px;white-space:nowrap}
.tbl td{padding:10px 12px;border-top:1px solid #ccc;vertical-align:top}
.tbl tr:nth-child(even) td{background:#fafafa}
.empty{padding:var(--sp6);text-align:center}
.pager{display:flex;gap:var(--sp3);align-items:center;margin-top:var(--sp4)}
.pg{border:var(--line);padding:6px 14px;background:var(--paper);text-decoration:none;color:var(--ink);font-weight:700}
.pg.is-disabled{opacity:.4}
.dialog{border:var(--line);box-shadow:var(--shadow);padding:var(--sp5);max-width:420px;width:calc(100% - 32px)}
.dialog::backdrop{background:rgba(0,0,0,.6)}
.dialog-actions{display:flex;gap:var(--sp3);justify-content:flex-end}

/* auth */
.auth-wrap{display:grid;grid-template-columns:minmax(280px,5fr) 6fr;min-height:100vh}
.auth-brand{background:var(--red);color:#fff;padding:var(--sp6);border-right:var(--line);display:flex;flex-direction:column;justify-content:space-between}
.auth-brand .logo-lg{font-size:2.2rem;line-height:1.05}
.auth-by{margin:var(--sp2) 0 0;font-weight:700}
.auth-copy{font-size:1.1rem;max-width:30ch;border-top:3px solid #fff;padding-top:var(--sp4)}
.auth-main{padding:var(--sp6);max-width:520px;width:100%;align-self:center}
.lead{color:var(--mute)}
.alt{margin-top:var(--sp5)}

@media (max-width:860px){
  .topbar{display:flex;align-items:center;gap:var(--sp3);padding:var(--sp2) var(--sp3);background:var(--ink);color:#fff;position:sticky;top:0;z-index:20}
  .topbar .logo{flex:1} .topbar-user{font-size:.85rem;max-width:40vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .shell{display:block}
  .side{position:fixed;inset:0 25% 0 0;max-width:300px;z-index:30;transform:translateX(-105%);transition:transform .18s}
  .side.is-open{transform:none}
  main{padding:var(--sp4)}
  .auth-wrap{display:block}
  .auth-brand{padding:var(--sp4) var(--sp5);border-right:0;border-bottom:var(--line)}
  .auth-brand .auth-copy{display:none}
  .auth-main{padding:var(--sp5) var(--sp4)}
  .row{grid-template-columns:1fr}
  .kv{grid-template-columns:1fr} .kv dt{margin-top:var(--sp2)}
  /* tables become labelled rows on phones */
  .tbl thead{position:absolute;left:-9999px}
  .tbl tr{display:block;border-bottom:var(--line)}
  .tbl td{display:flex;gap:var(--sp3);justify-content:space-between;border:0;padding:6px 12px}
  .tbl td::before{content:attr(data-label);font-weight:700;flex:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* installer */
body.install{background:var(--bg)}
.inst{max-width:760px;margin:0 auto;padding:var(--sp5) var(--sp4)}
.inst-head{background:var(--red);color:#fff;border:var(--line);box-shadow:var(--shadow);padding:var(--sp4) var(--sp5);margin-bottom:var(--sp5)}
.inst-head .logo{font-size:1.5rem;display:block}
.steps{display:flex;flex-wrap:wrap;gap:var(--sp2);list-style:none;margin:0 0 var(--sp5);padding:0}
.steps li{border:var(--line);background:var(--paper);padding:4px 10px;font-size:.85rem;font-weight:700}
.steps li.is-current{background:var(--yellow)} .steps li.is-done{background:var(--ink);color:#fff}
.req td:last-child{font-weight:700}
.req .ok{color:var(--ok)} .req .no{color:var(--red-dark)} .req .warn{color:#8a6500}
.actions{display:flex;gap:var(--sp3);flex-wrap:wrap}

/* long admin menus scroll inside the sidebar */
.side ul{overflow-y:auto}
.side a .badge{margin-left:auto}
textarea{width:100%;font:inherit;padding:10px 12px;border:var(--line);background:var(--paper);color:var(--ink);border-radius:0;resize:vertical}