:root{
  color-scheme: light;
  --navy-900:#0A1426;--navy-800:#0F1E38;--navy-700:#172B4D;
  --silver-50:#F3F5F8;--silver-100:#E6EAF0;--silver-300:#C3CBD6;--silver-500:#8C97A8;
  --ink:#131C2C;--ink-soft:#4A5568;
  --orange:#F0922E;--orange-deep:#D97A16;
  --ok:#2E8B57;--warn:#B7791F;--err:#C53030;
  --radius:10px;
  --body:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:16px/1.55 var(--body);color:var(--ink);background:var(--silver-50);min-height:100vh;display:flex;flex-direction:column}
a{color:var(--navy-700)}
h1{font-size:clamp(26px,4vw,34px);margin:8px 0 18px;line-height:1.2}
h2{font-size:19px;margin:0 0 12px}
p{margin:0 0 12px}
.wrap{width:min(1120px,100% - 32px);margin-inline:auto}
.main{flex:1;padding-block:24px 48px}

.top{background:var(--navy-900);color:#fff}
.top-in{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-block:12px}
.brand img{display:block;height:30px;width:auto}
.nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}
.nav a{color:var(--silver-300);text-decoration:none;padding:7px 11px;border-radius:8px;font-size:15px}
.nav a:hover{color:#fff;background:rgba(255,255,255,.06)}
.nav a[aria-current=page]{color:#fff;background:rgba(255,255,255,.1)}
.pill{display:inline-block;min-width:20px;padding:0 6px;border-radius:10px;background:var(--orange);color:var(--navy-900);font-size:12px;font-weight:700;text-align:center}
.who{display:flex;align-items:center;gap:12px;color:var(--silver-300);font-size:14px;margin:0}
.who button{color:var(--silver-300)}

.card{background:#fff;border:1px solid var(--silver-100);border-radius:14px;padding:22px;margin-bottom:18px;min-width:0}
.card.narrow{max-width:480px;margin:40px auto}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.grid2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:18px}
@media (max-width:860px){.grid3,.grid2{grid-template-columns:1fr}}
.stat{display:grid;gap:8px;align-content:start}
.eyebrow{font:600 12px/1.2 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--silver-500)}
.big{font-size:34px;line-height:1.1}
.bar{width:100%;height:10px;appearance:none;border:0;border-radius:6px;background:var(--silver-100);overflow:hidden}
.bar::-webkit-progress-bar{background:var(--silver-100);border-radius:6px}
.bar::-webkit-progress-value{background:var(--orange);border-radius:6px}
.bar::-moz-progress-bar{background:var(--orange);border-radius:6px}
.muted{color:var(--ink-soft)}
.lede{color:var(--ink-soft);max-width:44em}
.err{color:var(--err)}
.meta{color:var(--silver-500);font-size:13.5px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 15px var(--body);padding:11px 18px;border-radius:8px;border:1px solid var(--orange);background:var(--orange);color:var(--navy-900);cursor:pointer;text-decoration:none}
.btn:hover{background:var(--orange-deep);border-color:var(--orange-deep)}
.btn.ghost{background:#fff;color:var(--navy-700);border-color:var(--silver-300)}
.btn.ghost:hover{border-color:var(--navy-700)}
.link{background:none;border:0;padding:0;font:inherit;text-decoration:underline;cursor:pointer;color:var(--navy-700)}
.link.danger{color:var(--err)}
:focus-visible{outline:3px solid var(--orange);outline-offset:2px}

.stack{display:grid;gap:8px}
label{font-weight:600;font-size:14.5px}
input:not([type=hidden]){font:inherit;font-size:16px;padding:11px 12px;border:1px solid var(--silver-300);border-radius:8px;width:100%;background:#fff;color:var(--ink)}

.flash{border-radius:10px;padding:12px 16px;margin-bottom:18px;border:1px solid}
.flash.ok{background:#EAF6EF;border-color:#9FD3B4}
.flash.warn{background:#FFF6E5;border-color:#F3C77A}
.flash.err{background:#FDECEC;border-color:#F2A9A9}
.flash.info{background:#EEF3FB;border-color:#B8C9E6}

.log{list-style:none;margin:0 0 12px;padding:0}
.log li{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;padding:11px 0;border-bottom:1px solid var(--silver-100)}
.log .meta{grid-column:2}
.log .what{min-width:0;overflow-wrap:anywhere}
.tag{display:inline-block;font:600 11.5px/1 var(--mono);text-transform:uppercase;letter-spacing:.04em;padding:5px 7px;border-radius:6px;background:var(--silver-100);color:var(--navy-700);align-self:start;white-space:nowrap}
.tag-email{background:#E6EEFA}.tag-call{background:#EAF6EF}.tag-invoice{background:#FFF1DE}.tag-job{background:#EFEAFB}
.tag-ok{background:#EAF6EF;color:var(--ok)}.tag-no{background:#FDECEC;color:var(--err)}

.kinds,.audit{width:100%;border-collapse:collapse;font-size:15px}
.kinds td,.audit td{padding:8px 0;border-bottom:1px solid var(--silver-100)}
.kinds td+td{text-align:right;color:var(--ink-soft)}
.audit td{padding-right:12px}

.approval header{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;margin-bottom:12px}
.approval h2{margin:0}
@media (max-width:600px){.approval header{grid-template-columns:auto 1fr}.approval header .meta{grid-column:1/-1}}
.body{white-space:pre-wrap;font:15px/1.55 var(--body);background:var(--silver-50);border-radius:8px;padding:14px;margin:0 0 14px;max-height:360px;overflow:auto}
.decide{display:grid;gap:8px}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}

.conn header{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.conn header form{margin:0}
.accts{list-style:none;margin:8px 0 0;padding:0}
.accts li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--silver-100)}
.accts li>span{display:grid}
.accts form{margin:0}

.steps{padding-left:20px;margin:0 0 14px}
.qr{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.qr svg{width:180px;height:180px;border:1px solid var(--silver-100);border-radius:8px;background:#fff}
.key{font:15px var(--mono);background:var(--silver-50);padding:8px 10px;border-radius:6px;word-break:break-all}

.foot{background:var(--navy-900);color:var(--silver-500);font-size:13.5px;padding-block:18px}
.foot a{color:var(--silver-300)}
