:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #0a0d12;
  color: #e9edf3;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top, #151c28 0, #0a0d12 52rem); }
.shell { width: min(980px, calc(100% - 28px)); margin: 0 auto; padding: 24px 0 48px; }
header { margin-bottom: 16px; }
h1 { margin: 4px 0 6px; font-size: clamp(2rem, 5vw, 3.5rem); letter-spacing: -.05em; }
h2 { margin: 0; font-size: 1rem; text-transform: uppercase; letter-spacing: .08em; }
.eyebrow, .mono { font: 600 .72rem/1.4 ui-monospace, SFMono-Regular, Consolas, monospace; color: #9aa8ba; letter-spacing: .08em; }
.lede { max-width: 700px; color: #aab5c4; }
.panel { background: rgba(15, 20, 29, .92); border: 1px solid #283242; border-radius: 14px; padding: 16px; margin-top: 12px; box-shadow: 0 18px 60px rgba(0,0,0,.22); }
.panel-title { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:10px; }
.evidence { grid-template-columns: repeat(3,minmax(0,1fr)); }
label { display:flex; flex-direction:column; gap:5px; color:#aeb9c8; font-size:.82rem; min-width:0; }
.field { display:flex; flex-direction:column; gap:5px; min-width:0; }
.field > label { display:block; }
input, select, button { font: inherit; }
input, select { width:100%; background:#0b1018; color:#eef3f9; border:1px solid #344156; border-radius:8px; padding:8px 10px; min-height:38px; }
.combo { position:relative; display:block; min-width:0; }
.combo input { padding-right:70px; }
.combo-clear { position:absolute; top:0; right:34px; width:34px; height:38px; padding:0; border:1px solid #344156; border-right:0; border-radius:0; background:#202a39; color:#eef3f9; cursor:pointer; }
.combo-clear[hidden] { display:none; }
.combo-toggle { position:absolute; top:0; right:0; width:34px; height:38px; padding:0; border:1px solid #344156; border-radius:0 8px 8px 0; background:#202a39; color:#eef3f9; cursor:pointer; }
.combo-options { position:absolute; z-index:5; top:calc(100% + 3px); left:0; right:0; max-height:230px; overflow-y:auto; margin:0; padding:4px; list-style:none; background:#111a27; border:1px solid #50627d; border-radius:8px; box-shadow:0 12px 28px rgba(0,0,0,.45); }
.combo-options[hidden] { display:none; }
.combo-options li { padding:7px 9px; border-radius:5px; color:#eef3f9; cursor:pointer; }
.combo-options li:hover, .combo-options li.active { background:#29405d; }
.combo-validation { color:#ff9b9b; font-size:.74rem; }
.combo-validation:empty { display:none; }
input[aria-invalid="true"] { border-color:#ff9b9b; }
.conditioning { margin:14px 0 0; padding:10px 0 0; border:0; border-top:1px solid #283242; min-width:0; }
.conditioning legend { padding:0 8px 0 0; color:#c9d4e4; font-weight:600; }
.small, .message { color:#93a1b4; font-size:.82rem; }
.conditioning .small { margin:10px 0 0; }
.actions { display:flex; gap:9px; flex-wrap:wrap; margin-top:14px; }
button { border:0; border-radius:9px; padding:10px 15px; font-weight:700; background:#e9edf3; color:#0b1018; cursor:pointer; }
button.secondary { background:#202a39; color:#e9edf3; }
button.combo-toggle { background:#202a39; color:#e9edf3; padding:0; }
button.combo-clear { background:#202a39; color:#e9edf3; padding:0; }
button:disabled { opacity:.42; cursor:not-allowed; }
.status { color:#90d3a8; font-size:.8rem; }
.results { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px 22px; margin:0; padding-left:1.8rem; }
.results li { padding:8px 4px; font-size:1.08rem; border-bottom:1px solid #222c3a; }
.error { color:#ff9b9b; }
@media (max-width:760px) {
  .basics, .evidence, .results { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:480px) {
  .shell { width:min(100% - 18px, 980px); padding-top:20px; }
  .panel { padding:14px; }
  .basics, .evidence { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .controls label { font-size:.76rem; }
  .controls input, .controls select { padding:7px 8px; }
  .results { grid-template-columns:1fr 1fr; }
  .panel-title { align-items:flex-start; flex-direction:column; }
}
