/* SKY REI · Flip P&L — design tokens.
   Chrome (nav, header band, cards, ink, rules) is the SKY REI house style:
   navy #0A1226 / #0E1830, gold #C9A45C, cream #EFEDE7, Source Serif 4 for
   headings and Libre Franklin for everything else.
   Chart series colours are a separate, validated categorical palette — six
   checks pass on a light surface; see PALETTE in sky.js. */
:root{
  --navy:#0A1226; --navy2:#0E1830; --ink:#16233A;
  --gold:#C9A45C; --gold-dk:#96742F;
  --cream:#EFEDE7; --card:#FFFFFF; --bord:#E5E3DC; --band:#F6F5F1; --rule:#E1E0D9;
  --mute:#5E6B82; --mute2:#8A96AD; --link:#1F3A6E;
  --bad:#A03E28; --bad-bd:#E5C9BE; --good:#1F6B4A;
  --s1:#2a78d6; --s2:#C9932E; --s3:#1baf7a; --s4:#A8452C; --s5:#4a3aa7; --s6:#e87ba4;
}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);font-family:"Libre Franklin",system-ui,-apple-system,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:var(--link);text-decoration:none}a:hover{color:var(--gold)}
h1,h2,h3,.serif{font-family:'Source Serif 4',Georgia,serif}

/* nav */
.nav{background:var(--navy);border-bottom:1px solid rgba(201,164,92,.25)}
.nav .in{max-width:1320px;margin:0 auto;padding:10px 40px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.brand{font-family:'Source Serif 4',Georgia,serif;font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--gold)}
.nav .sep{width:1px;height:14px;background:rgba(233,237,245,.2)}
.nav a.l{font-size:12px;font-weight:600;color:var(--mute2);white-space:nowrap}
.nav a.l:hover{color:var(--gold)}
.nav a.l.on{color:#E9EDF5;font-weight:700;border-bottom:2px solid var(--gold);padding-bottom:2px}
.tag{margin-left:auto;font-size:10px;letter-spacing:.28em;font-weight:700;color:var(--mute)}

/* header band */
.hd{background:var(--navy2);padding:26px 40px 22px}
.hd .in{max-width:1320px;margin:0 auto;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.hd .eyebrow{font-family:'Source Serif 4',Georgia,serif;font-size:15px;font-weight:700;letter-spacing:.06em;color:var(--gold)}
.hd h1{font-size:32px;font-weight:600;color:#E9EDF5;line-height:1.1;margin:6px 0 0}
.hd .sub{margin-top:7px;font-size:12.5px;color:var(--mute2);max-width:820px;line-height:1.6}
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tab{padding:10px 22px;border-radius:10px;font-size:13px;font-weight:700;letter-spacing:.04em;cursor:pointer;
  border:1px solid rgba(201,164,92,.35);background:transparent;color:var(--mute2);transition:border-color .12s,color .12s}
.tab:hover{border-color:var(--gold);color:#E9EDF5}
.tab.on{background:var(--gold);border-color:var(--gold);color:#16233A}

/* layout */
.wrap{max-width:1320px;margin:0 auto;padding:0 40px 64px}
.card{background:var(--card);border:1px solid var(--bord);border-radius:16px;padding:22px 24px;margin-top:20px}
.card>h2{font-size:19px;font-weight:600;margin:0 0 4px}
.card>.cs{font-size:12px;color:var(--mute);line-height:1.6;margin:0 0 16px}
.lbl{font-size:10px;letter-spacing:.28em;font-weight:700;color:var(--mute);margin-bottom:9px}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(auto-fit,minmax(420px,1fr))}

/* kpi */
.kpis{margin-top:20px;background:var(--card);border:1px solid var(--bord);border-radius:16px;padding:20px 24px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
.kpi{border-left:2px solid var(--rule);padding-left:13px}
.kpi .v{font-size:22px;font-weight:660;letter-spacing:-.015em;font-variant-numeric:tabular-nums;line-height:1.15}
.kpi .l{margin-top:3px;font-size:11.5px;color:var(--mute)}
.kpi.acc{border-left-color:var(--gold)}
.neg{color:var(--bad)}.pos{color:var(--good)}

/* tables */
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
th,td{text-align:right;padding:7px 10px;font-size:12.5px;border-bottom:1px solid var(--rule)}
th{background:var(--band);font-size:10.5px;font-weight:700;letter-spacing:.04em;color:var(--mute);
  text-transform:uppercase;position:sticky;top:0;z-index:1}
th:first-child,td:first-child{text-align:left}
th.l,td.l{text-align:left}th.c,td.c{text-align:center}
tr.sub td{color:var(--mute)}
tr.tot td{font-weight:700;background:var(--band)}
tr.big td{font-weight:700;font-size:13.5px}
tr.fin td{font-weight:700;background:var(--navy2);color:#fff;font-size:13.5px}
tr.fin td:first-child{color:var(--gold)}
tr.spacer td{padding:4px;border:0}
tr.hov:hover td{background:#FAFAF7}
td.ind{padding-left:26px}
.srt{cursor:pointer;user-select:none}.srt:hover{color:var(--ink)}
.srt.a::after{content:" ▲";color:var(--gold)}.srt.d::after{content:" ▼";color:var(--gold)}
.tw{overflow:auto;max-height:none;border:1px solid var(--bord);border-radius:12px;background:var(--card)}
.tw.sc{max-height:70vh}
table.tight th,table.tight td{padding:6px 7px;font-size:11.5px}
table.tight th{font-size:9.5px;letter-spacing:.02em}
@media(max-width:860px){.tw.sc{max-height:none}}

/* chips / pills */
.pill{display:inline-block;padding:2px 9px;border-radius:99px;font-size:10.5px;font-weight:700;letter-spacing:.03em}
.p-hi{background:#F7E8E3;color:var(--bad)}.p-md{background:#F6EEDC;color:var(--gold-dk)}
.p-lo{background:#EEF0F4;color:var(--mute)}
.p-a{background:#E7F0FB;color:#1D5FA8}.p-b{background:#EAF6F1;color:#12795A}.p-c{background:#F3EFF8;color:#4a3aa7}

/* controls */
.ctl{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:20px}
.ctl input,.ctl select{font-family:inherit;font-size:13px;padding:9px 12px;border:1px solid var(--bord);
  border-radius:10px;background:var(--card);color:var(--ink)}
.ctl input:focus,.ctl select:focus{outline:2px solid var(--gold);outline-offset:1px}
.ctl .n{font-size:12px;color:var(--mute);margin-left:auto}

/* legend */
.leg{display:flex;gap:16px;flex-wrap:wrap;margin:0 0 14px}
.leg span{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--mute)}
.leg i{width:11px;height:11px;border-radius:3px;display:block}

/* chart */
svg{display:block;max-width:100%;height:auto;overflow:visible}
.tip{position:fixed;pointer-events:none;background:#fff;border:1px solid var(--bord);border-radius:10px;
  padding:9px 12px;font-size:12px;box-shadow:0 6px 20px rgba(22,35,58,.14);z-index:99;opacity:0;transition:opacity .1s;
  font-variant-numeric:tabular-nums;max-width:280px;line-height:1.55}
.tip.on{opacity:1}
.tip b{font-size:12.5px}
.tip .r{display:flex;justify-content:space-between;gap:16px}
.tip .r i{width:9px;height:9px;border-radius:2px;display:inline-block;margin-right:6px}

/* note */
.note{margin-top:18px;font-size:11.5px;color:var(--mute);line-height:1.75}
.note b{color:var(--ink)}
.warn{background:var(--card);border:1px solid var(--bad-bd);border-radius:16px;padding:18px 22px;margin-top:20px}
.warn h3{margin:0 0 6px;font-size:17px;font-weight:600;color:var(--bad)}
.warn p{margin:0;font-size:12.5px;color:var(--mute);line-height:1.65}
footer{margin-top:26px;font-size:11px;color:#9AA3B5;line-height:1.7}
.tgl{font-size:11px;font-weight:700;color:var(--gold-dk);cursor:pointer;user-select:none;letter-spacing:.03em}
.tgl:hover{color:var(--gold)}

@media(max-width:860px){
  .wrap,.nav .in{padding-left:16px;padding-right:16px}
  .hd{padding:20px 16px 16px}.hd h1{font-size:26px}
  .g2{grid-template-columns:1fr}
  .tw{-webkit-overflow-scrolling:touch}
  table{min-width:760px}
  input,select{font-size:16px}
}
@media print{.nav,.tabs,.ctl{display:none}.card{break-inside:avoid}}