@import url('https://fonts.googleapis.com/css2?family=Zilla+Slab:wght@400;500;600;700&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --paper:#EEEFE8;
  --paper-raised:#FBFBF7;
  --ink:#1C201C;
  --ink-soft:#565B52;
  --line:#D4D6CB;
  --accent:#1B4B43;
  --accent-soft:#3D6B5C;
  --accent-wash:#DFE7E1;
  --ok:#2F7D52;
  --ok-wash:#E1EEE4;
  --warn:#9C6510;
  --warn-wash:#F3E7CD;
  --crit:#A93A31;
  --crit-wash:#F4DFDB;
  --info:#3D6B5C;
  --info-wash:#E4EBE6;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
  font-size:16px;
  line-height:1.55;
}
h1,h2,h3{font-family:'Zilla Slab', ui-serif, Georgia, serif; font-weight:600; color:var(--ink); margin:0 0 8px;}
.num, code, .mono{font-family:'IBM Plex Mono', ui-monospace, monospace; font-variant-numeric:tabular-nums;}
a{color:var(--accent);}

.topbar{background:var(--paper-raised); border-bottom:2px solid var(--accent);}
.topbar-inner{max-width:1100px; margin:0 auto; padding:14px 24px; display:flex; align-items:center; gap:32px;}
.brand{font-family:'Zilla Slab', serif; font-weight:600; font-size:1.2rem; color:var(--accent); text-decoration:none;}
.topbar-inner nav{display:flex; gap:20px; flex:1;}
.topbar-inner nav a{color:var(--ink-soft); text-decoration:none; font-size:0.92rem;}
.topbar-inner nav a:hover{color:var(--accent);}
.topbar-user{display:flex; align-items:center; gap:14px; font-size:0.88rem; color:var(--ink-soft);}
.topbar-user a{color:var(--ink-soft);}

.page{max-width:1100px; margin:0 auto; padding:32px 24px 80px;}
.page-narrow{max-width:480px; margin:64px auto; padding:0 24px;}

.card{background:var(--paper-raised); border:1px solid var(--line); padding:24px; margin-bottom:20px;}

form label{display:block; font-size:0.85rem; color:var(--ink-soft); margin:14px 0 4px;}
.reuse-note{color:var(--accent-soft); font-style:italic;}
form input[type=text], form input[type=email], form input[type=password], form input[type=date], form select{
  width:100%; padding:9px 12px; border:1px solid var(--line); background:var(--paper); color:var(--ink);
  font-family:inherit; font-size:0.95rem;
}
form input[type=file]{width:100%; padding:8px 0; font-size:0.9rem;}
button, .btn{
  display:inline-block; margin-top:18px; padding:10px 20px; background:var(--accent); color:#fff;
  border:none; font-family:inherit; font-size:0.92rem; font-weight:600; cursor:pointer; text-decoration:none;
}
button:hover, .btn:hover{background:var(--accent-soft);}
.btn-secondary{background:transparent; color:var(--accent); border:1px solid var(--accent);}

.flash{padding:12px 16px; margin-bottom:18px; font-size:0.9rem; border-left:4px solid var(--line);}
.flash-error{background:var(--crit-wash); color:var(--crit); border-left-color:var(--crit);}
.flash-success{background:var(--ok-wash); color:var(--ok); border-left-color:var(--ok);}
.flash-info{background:var(--info-wash); color:var(--info); border-left-color:var(--info);}

table{border-collapse:collapse; width:100%; font-size:0.9rem;}
th,td{padding:9px 14px; text-align:left; border-bottom:1px solid var(--line);}
thead th{background:var(--accent-wash); color:var(--accent); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.06em;}
td.num{text-align:right; font-family:'IBM Plex Mono', monospace;}

.stats{display:grid; grid-template-columns:repeat(auto-fit, minmax(190px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin-bottom:28px;}
.stat{background:var(--paper-raised); padding:18px 20px;}
.stat .label{font-size:0.7rem; text-transform:uppercase; letter-spacing:0.07em; color:var(--ink-soft); margin-bottom:6px;}
.stat .value{font-family:'IBM Plex Mono', monospace; font-size:1.35rem; font-weight:600;}

.finding{background:var(--paper-raised); border:1px solid var(--line); border-left:4px solid var(--line); padding:16px 20px; margin-bottom:12px;}
.finding.confirm{border-left-color:var(--crit);}
.finding.review{border-left-color:var(--warn);}
.finding.info{border-left-color:var(--info);}
.finding.clean{border-left-color:var(--ok);}
.finding.dismissed{opacity:0.6;}
.finding.dismissed h3, .finding.dismissed p{text-decoration:line-through; text-decoration-color:var(--line);}
.pill{display:inline-block; font-size:0.65rem; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; padding:3px 9px; border-radius:3px; margin-bottom:6px;}
.pill.confirm{background:var(--crit-wash); color:var(--crit);}
.pill.review{background:var(--warn-wash); color:var(--warn);}
.pill.info{background:var(--info-wash); color:var(--info);}
.pill.clean{background:var(--ok-wash); color:var(--ok);}
.pill.dismissed-pill{background:var(--ok-wash); color:var(--ok); margin-left:6px;}

.finding-dismiss-form{margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); display:flex; align-items:center; gap:10px;}
.btn-small{margin:0 !important; padding:5px 12px !important; font-size:0.8rem !important;}

.finding-action{margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); font-size:0.9rem;}
.finding-action-label{font-weight:600; color:var(--accent);}

.finding-orders{margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); font-size:0.88rem;}
.finding-orders summary{cursor:pointer; color:var(--accent); font-weight:600;}
.finding-orders table{margin-top:10px;}
.finding-orders th, .finding-orders td{padding:6px 10px; font-size:0.85rem;}
.finding-num{font-family:'IBM Plex Mono', monospace; color:var(--ink-soft); text-decoration:none; font-weight:600;}
.finding-num:hover{color:var(--accent);}

.row-actions{display:flex; align-items:center; gap:12px; white-space:nowrap;}
.icon-form{display:inline-flex; margin:0;}
.icon-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; padding:0; margin:0; border:1px solid var(--line); border-radius:4px;
  background:var(--paper-raised); color:var(--ink-soft); cursor:pointer; text-decoration:none;
}
.icon-btn:hover{color:var(--accent); border-color:var(--accent);}
.icon-btn-danger:hover{color:var(--crit); border-color:var(--crit);}
.icon-btn-danger-text{color:var(--crit); border-color:var(--crit);}
.icon-btn-danger-text:hover{background:var(--crit-wash);}

.qr-box{background:#fff; padding:16px; display:inline-block; border:1px solid var(--line);}
.helptext{font-size:0.85rem; color:var(--ink-soft);}

.health-badge{
  display:inline-flex; flex-direction:column; align-items:flex-start; line-height:1.25;
  padding:6px 14px; border-radius:4px; font-family:'IBM Plex Mono', monospace; font-weight:600; font-size:1.05rem;
}
.health-badge .health-sub{font-family:'IBM Plex Sans', sans-serif; font-weight:500; font-size:0.72rem; text-transform:none; letter-spacing:0; opacity:0.85;}
.health-good{background:var(--ok-wash); color:var(--ok);}
.health-warn{background:var(--warn-wash); color:var(--warn);}
.health-bad{background:var(--crit-wash); color:var(--crit);}
