/* ---------------------------------------------------------------------------
   GaforFinder — base stylesheet
   Token set and component idiom taken from the S2 / StueveCast tool so both
   apps look like one family: dark by default, amber accent, mono labels.
   --------------------------------------------------------------------------- */

:root{
  --bg: #0b1017;
  --panel: #121926;
  --panel-2: #0f1520;
  --line: #263143;
  --line-soft: #1b2432;
  --text: #cfd8e3;
  --text-dim: #7c8aa0;
  --text-strong: #f2f5f9;
  --amber: #f0a63d;
  --amber-dim: #8a6222;
  --temp: #ff5f56;
  --dew: #4fd0e7;
  --green: #3fbf7f;
  --violet: #b98fd1;

  /* GAFOR flight-condition colours (C/O/D/M/X) */
  --gafor-c: #3fbf7f;   /* Charlie  — open */
  --gafor-o: #9ac93f;   /* Oscar    — open, restricted */
  --gafor-d: #f0a63d;   /* Delta    — difficult */
  --gafor-m: #ff8b3d;   /* Mike     — marginal */
  --gafor-x: #ff5f56;   /* X-ray    — closed */
  --gafor-none: #55627a;

  --mono: 'IBM Plex Mono', 'JetBrains Mono', SFMono-Regular, Consolas, monospace;
  --sans: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --r: 10px;
  --safe-t: env(safe-area-inset-top, 0px);
  --safe-b: env(safe-area-inset-bottom, 0px);
}

:root[data-theme="light"]{
  --bg: #f4f5f7;
  --panel: #ffffff;
  --panel-2: #eef0f3;
  --line: #d7dce3;
  --line-soft: #e5e9ee;
  --text: #2a323e;
  --text-dim: #667080;
  --text-strong: #12161c;
  --amber: #b96f14;
  --amber-dim: #e2c493;
  --temp: #c9271f;
  --dew: #0f7fa0;
  --green: #1d8a56;
  --violet: #8a4fae;

  --gafor-c: #1d8a56;
  --gafor-o: #6d9418;
  --gafor-d: #b96f14;
  --gafor-m: #d1631a;
  --gafor-x: #c9271f;
  --gafor-none: #97a1b0;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);
  font-family:var(--sans);-webkit-text-size-adjust:100%;
  transition:background .2s,color .2s;}
body{overscroll-behavior-y:none;}

/* ---------- typography ---------- */
.eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;color:var(--amber);
  text-transform:uppercase;}
.section-title{font-family:var(--mono);font-size:11px;color:var(--text-dim);letter-spacing:.08em;
  text-transform:uppercase;font-weight:600;}
.dim{color:var(--text-dim);}
.mono{font-family:var(--mono);}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--panel-2);border:1px solid var(--line);color:var(--text);
  font-family:var(--mono);font-size:12px;padding:0 14px;height:38px;
  border-radius:8px;cursor:pointer;transition:border-color .15s,color .15s;
  -webkit-tap-highlight-color:transparent;}
.btn:hover{border-color:var(--amber);}
.btn:active{background:var(--panel);}
.btn.icon{width:38px;padding:0;font-size:15px;flex:0 0 auto;}
.btn.primary{background:var(--amber);border-color:var(--amber);color:#1a1200;font-weight:600;}
.btn.primary:hover{filter:brightness(1.08);}
.btn:disabled{opacity:.38;cursor:not-allowed;}

.chip{display:inline-flex;align-items:center;gap:6px;background:var(--panel-2);
  border:1px solid var(--line);color:var(--text-dim);font-family:var(--mono);font-size:11px;
  padding:5px 10px;border-radius:999px;cursor:pointer;white-space:nowrap;}
.chip[aria-pressed="true"],.chip.on{border-color:var(--amber);color:var(--amber);}

/* ---------- panels ---------- */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;margin-bottom:12px;}
.card-head{display:flex;align-items:baseline;gap:10px;padding:10px 14px;
  border-bottom:1px solid var(--line-soft);background:var(--panel-2);}
.card-head .section-title{flex:1;min-width:0;}
.card-body{padding:13px 14px;}
.card-body.tight{padding:0;}

.stat-strip{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);
  border-top:1px solid var(--line);}
@media (min-width:560px){ .stat-strip{grid-template-columns:repeat(4,1fr);} }
.stat{background:var(--panel);padding:9px 12px;min-width:0;}
.stat .k{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--text-dim);margin-bottom:3px;}
.stat .v{font-family:var(--mono);font-size:15px;color:var(--text-strong);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.stat .v small{font-size:10px;color:var(--text-dim);margin-left:3px;}

pre.report{font-family:var(--mono);font-size:12px;line-height:1.62;color:var(--text);
  white-space:pre-wrap;word-break:break-word;margin:0;}
pre.raw{font-family:var(--mono);font-size:12px;line-height:1.55;color:var(--text-strong);
  background:var(--panel-2);border:1px solid var(--line-soft);border-radius:8px;
  padding:10px 11px;margin:0;white-space:pre-wrap;word-break:break-word;}

.badge{display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.06em;
  padding:3px 8px;border-radius:6px;border:1px solid currentColor;}
.badge.c{color:var(--gafor-c);} .badge.o{color:var(--gafor-o);}
.badge.d{color:var(--gafor-d);} .badge.m{color:var(--gafor-m);}
.badge.x{color:var(--gafor-x);} .badge.none{color:var(--gafor-none);}

.note{font-size:12px;line-height:1.55;color:var(--text-dim);}
.note strong{color:var(--text);}
.err{color:var(--temp);font-family:var(--mono);font-size:12px;line-height:1.5;}

/* ---------- form controls ---------- */
.field{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:9px 0;border-bottom:1px solid var(--line-soft);}
.field span{font-size:13.5px;color:var(--text);}
.field select{height:34px;min-width:130px;background:var(--panel-2);border:1px solid var(--line);
  border-radius:7px;color:var(--text);font-family:var(--mono);font-size:12.5px;padding:0 8px;}
.field select:focus{border-color:var(--amber);outline:none;}

input[type="search"],input[type="text"]{
  width:100%;height:40px;background:var(--panel-2);border:1px solid var(--line);
  border-radius:8px;color:var(--text);font-family:var(--sans);font-size:15px;
  padding:0 12px;outline:none;-webkit-appearance:none;}
input[type="search"]:focus,input[type="text"]:focus{border-color:var(--amber);}
input::placeholder{color:var(--text-dim);}

/* ---------- misc ---------- */
.spin{display:inline-block;animation:spin 1s linear infinite;}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.hidden{display:none !important;}
a{color:var(--amber);}