:root {
  --slate-950: #0b0f14;
  --slate-900: #12181f;
  --slate-800: #1c252e;
  --slate-700: #2a3541;
  --slate-600: #3c4a58;
  --slate-500: #5b6b7a;
  --slate-400: #8494a1;
  --slate-300: #aab8c2;
  --slate-200: #cdd8df;
  --slate-100: #e6ecf0;
  --slate-050: #f4f7f9;

  --accent-crit: #b3402c;
  --accent-crit-bg: #fbe9e5;
  --accent-warn: #a3762c;
  --accent-warn-bg: #f8efdf;
  --accent-info: #3a5a72;
  --accent-info-bg: #e6eef2;

  --mono: "IBM Plex Mono", "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--slate-050);
  color: var(--slate-900);
  font-family: var(--sans);
  line-height: 1.5;
}

.site-header {
  padding: 2.5rem 1.5rem 1.5rem;
  max-width: 900px;
  margin: 0 auto;
}

.site-header h1 {
  font-size: 1.5rem;
  letter-spacing: -0.01em;
  margin: 0 0 0.35rem;
  color: var(--slate-900);
}

.tagline {
  color: var(--slate-500);
  margin: 0;
  font-size: 0.95rem;
}

main {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 1.5rem 4rem;
}

.input-section {
  background: #fff;
  border: 1px solid var(--slate-200);
  border-radius: 10px;
  padding: 1.25rem;
}

.dropzone {
  border: 1.5px dashed var(--slate-300);
  border-radius: 8px;
  padding: 1.75rem 1rem;
  text-align: center;
  color: var(--slate-500);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}

.dropzone:hover, .dropzone.drag-over {
  border-color: var(--slate-500);
  background: var(--slate-050);
}

.dropzone p { margin: 0.15rem 0; }
.dropzone-hint { font-size: 0.8rem; color: var(--slate-400); }

#paste-area {
  width: 100%;
  margin-top: 0.9rem;
  font-family: var(--mono);
  font-size: 0.85rem;
  border: 1px solid var(--slate-200);
  border-radius: 8px;
  padding: 0.75rem;
  resize: vertical;
  background: var(--slate-050);
  color: var(--slate-800);
}

.input-actions {
  margin-top: 0.9rem;
  display: flex;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.btn {
  font-family: var(--sans);
  font-size: 0.85rem;
  padding: 0.55rem 1rem;
  border-radius: 6px;
  border: 1px solid var(--slate-300);
  background: #fff;
  color: var(--slate-800);
  cursor: pointer;
}

.btn:hover { background: var(--slate-050); }

.btn-primary {
  background: var(--slate-900);
  border-color: var(--slate-900);
  color: #fff;
}

.btn-primary:hover { background: var(--slate-800); }

.btn-ghost {
  background: transparent;
}

.empty-state {
  margin-top: 1.5rem;
  padding: 2rem;
  text-align: center;
  color: var(--slate-400);
  border: 1px dashed var(--slate-200);
  border-radius: 10px;
}

.export-bar {
  display: flex;
  gap: 0.6rem;
  margin: 1rem 0;
  flex-wrap: wrap;
}

/* Verdict banner */

.verdict-banner {
  margin-top: 1.5rem;
  padding: 1.25rem 1.5rem;
  border-radius: 10px;
  border: 1px solid var(--slate-200);
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.verdict-tier {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.2rem 0.55rem;
  border-radius: 4px;
  background: var(--slate-800);
  color: #fff;
}

.verdict-title {
  font-size: 1.1rem;
  font-weight: 600;
}

.tier-confirmed { border-color: var(--accent-crit); background: var(--accent-crit-bg); }
.tier-confirmed .verdict-tier { background: var(--accent-crit); }
.tier-attempted { border-color: var(--accent-warn); background: var(--accent-warn-bg); }
.tier-attempted .verdict-tier { background: var(--accent-warn); }
.tier-noise { border-color: var(--slate-300); background: var(--slate-100); }
.tier-noise .verdict-tier { background: var(--slate-600); }
.tier-clear { border-color: var(--slate-200); background: #fff; }
.tier-clear .verdict-tier { background: var(--slate-500); }

/* Report */

.report { margin-top: 1.5rem; }

.report-header h2 {
  font-size: 1.2rem;
  margin: 0 0 0.25rem;
}

.report-summary {
  color: var(--slate-500);
  font-size: 0.85rem;
  margin: 0 0 1rem;
}

.verdict-section {
  border: 1px solid var(--slate-200);
  border-radius: 10px;
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.5rem;
}

.verdict-section h3 { margin: 0 0 0.5rem; font-size: 1.05rem; }
.verdict-section p { margin: 0 0 0.75rem; }

.actions-list {
  margin: 0.5rem 0 0;
  padding-left: 1.2rem;
}

.actions-list li { margin-bottom: 0.35rem; }

.actors-section h3, .limitations-section h3 {
  font-size: 1.05rem;
  margin: 1.5rem 0 0.75rem;
}

.actor-card {
  border: 1px solid var(--slate-200);
  border-radius: 10px;
  padding: 1.1rem 1.4rem;
  margin-bottom: 1rem;
  background: #fff;
}

.actor-critical {
  border-color: var(--accent-crit);
  border-width: 1.5px;
}

.actor-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.actor-header h3 {
  font-family: var(--mono);
  font-size: 1rem;
  margin: 0;
}

.actor-meta {
  font-size: 0.8rem;
  color: var(--slate-500);
}

.actor-purpose { margin: 0.6rem 0; }

.flag-block {
  margin: 0.5rem 0;
  font-size: 0.85rem;
}

.flag-detail { color: var(--slate-500); }

.signature-block {
  margin-top: 0.9rem;
  border-top: 1px solid var(--slate-100);
  padding-top: 0.75rem;
}

.signature-head {
  font-size: 0.9rem;
  margin-bottom: 0.35rem;
}

.technical {
  font-size: 0.85rem;
  color: var(--slate-600);
  margin: 0 0 0.5rem;
}

.distress-block {
  margin-top: 0.9rem;
  border-top: 1px solid var(--slate-100);
  padding-top: 0.75rem;
}

/* Badges: ordered colour scale + text, never colour alone */

.badge {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.15rem 0.5rem;
  border-radius: 4px;
}

.badge-crit { background: var(--accent-crit-bg); color: var(--accent-crit); border: 1px solid var(--accent-crit); }
.badge-warn { background: var(--accent-warn-bg); color: var(--accent-warn); border: 1px solid var(--accent-warn); }
.badge-info { background: var(--accent-info-bg); color: var(--accent-info); border: 1px solid var(--accent-info); }

/* Evidence blocks: must wrap, never force horizontal scroll */

.evidence {
  margin: 0.5rem 0;
}

.evidence-line, .raw-line {
  font-family: var(--mono);
  font-size: 0.78rem;
  background: var(--slate-050);
  border: 1px solid var(--slate-100);
  border-radius: 6px;
  padding: 0.6rem 0.75rem;
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.decoded {
  margin-top: 0.3rem;
}

.decoded-label {
  font-size: 0.7rem;
  color: var(--slate-500);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  display: block;
  margin-bottom: 0.2rem;
}

.decoded .evidence-line, .decoded-inline {
  background: var(--accent-warn-bg);
  border-color: var(--accent-warn);
}

/* Table */

.table-section { margin-top: 2rem; }

.line-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 0.82rem;
  background: #fff;
  border: 1px solid var(--slate-200);
  border-radius: 8px;
  overflow: hidden;
}

.line-table th, .line-table td {
  padding: 0.55rem 0.7rem;
  border-bottom: 1px solid var(--slate-100);
  vertical-align: top;
  text-align: left;
}

.line-table thead th {
  background: var(--slate-050);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--slate-500);
}

.col-severity { width: 90px; }
.col-ip { width: 130px; font-family: var(--mono); }
.col-label { width: 180px; }
.col-raw { width: auto; }

.col-raw .evidence-line {
  margin-bottom: 0.3rem;
}

.no-actors, .no-rows { color: var(--slate-500); font-style: italic; }

.site-footer {
  max-width: 900px;
  margin: 0 auto;
  padding: 1rem 1.5rem 2rem;
  color: var(--slate-400);
  font-size: 0.78rem;
}

/* Print: report only, no app chrome */

@media print {
  .site-header, .input-section, .empty-state, .export-bar, .site-footer, #dropzone, .table-section {
    display: none !important;
  }

  body {
    background: #fff !important;
  }

  .verdict-banner, .verdict-section, .actor-card {
    border: 1px solid #999 !important;
    break-inside: avoid;
  }

  .evidence-line, .raw-line, .decoded-inline {
    white-space: pre-wrap !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    break-inside: avoid;
  }

  .actor-card, .signature-block, .evidence {
    break-inside: avoid;
  }
}