*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
:root {
  --bg:#07090F; --bg2:#0C0F1A; --bg3:#111520; --bg4:#161B28;
  --border:rgba(255,255,255,0.06); --border2:rgba(255,255,255,0.1);
  --gold:#C9A84C; --gold2:#F5C842;
  --red:#E84040; --orange:#E07A30;
  --cyan:#2EC4D6; --green:#3DDC84; --purple:#A78BFA;
  --blue:#4A9EFF;
  --text:#E8E4D9; --dim:rgba(232,228,217,0.48); --dim2:rgba(232,228,217,0.22);
  --bg: #04080f;
  --surface: #080f1e;
  --surface2: #0d1829;
  --surface3: #112038;
  --accent: #00d4ff;
  --accent2: #00ff88;
  --accent3: #ff6b35;
  --gold: #f0c040;
  --purple: #a855f7;
  --red: #ff4444;
  --text: #e8f4ff;
  --muted: #6b8aaa;
  --border: rgba(0,212,255,0.12);
  --border2: rgba(0,212,255,0.22);
  --void: #030508;
  --deep: #070d14;
  --surface: #0c1520;
  --lift: #111e2e;
  --edge: #1a2d42;
  --wire: rgba(255,255,255,0.06);
  --wire2: rgba(255,255,255,0.12);
  --fire: #e83a1e;
  --ember: #f06030;
  --gold: #c8952a;
  --ice: #4ab8d4;
  --pale: #a0bcd0;
  --ghost: rgba(160,188,208,0.4);
  --text: #d8e8f0;
  --dim: #607080;
  --mono: 'Share Tech Mono', monospace;
  --display: 'Rajdhani', sans-serif;
  --serif: 'Libre Baskerville', serif;
  --accent: #00d4ff;
  --accent2: #00ff88;
  --bg: #050b14;
  --surface: #080f1c;
  --surface2: #0c1628;
  --accent: #00d4ff;
  --accent2: #00ff88;
  --gold: #C9A84C;
  --gold-light: #F0CC7A;
  --red: #FF3B5C;
  --text: #d8eaf8;
  --muted: #5a7490;
  --border: rgba(0,212,255,0.12);
  --border-gold: rgba(201,168,76,0.2);
  --glow: 0 0 40px rgba(0,212,255,0.18);
  --glow-gold: 0 0 40px rgba(201,168,76,0.2);
}
html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--text); font-family:'Syne',sans-serif; overflow-x:hidden; line-height:1.6; }
body::before {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:0;
  background-image:linear-gradient(rgba(201,168,76,0.022) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(201,168,76,0.022) 1px,transparent 1px);
  background-size:50px 50px;
}

/* ─── HERO ─── */
.hero { position:relative; z-index:1; margin:0 auto; margin-top:60px;padding:64px 44px 44px; }
.eyebrow { font-family:'DM Mono',monospace; font-size:11px; letter-spacing:.26em; color:var(--gold); text-transform:uppercase; margin-bottom:14px; display:flex; align-items:center; gap:10px; }
.eyebrow::before { content:''; width:28px; height:1px; background:var(--gold); opacity:.5; }
.hero h1 { font-family:'Bebas Neue',sans-serif; font-size:clamp(50px,6vw,80px); line-height:.9; letter-spacing:.02em; margin-bottom:18px; }
.hero h1 .g { color:var(--gold2); }
.hero h1 .s { color:transparent; -webkit-text-stroke:2px rgba(245,200,66,.55); }
.hero-desc { font-size:14.5px; color:var(--dim); max-width:680px; line-height:1.8; margin-bottom:28px; }
.pills { display:flex; flex-wrap:wrap; gap:10px; }
.pill { font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.13em; color:var(--dim2); text-transform:uppercase; padding:6px 14px; border:1px solid var(--border); background:var(--bg2); }
.pill b { color:var(--gold2); font-weight:500; }

/* ─── PAIR TABS ─── */
.wrap { position:relative; z-index:1; margin:0 auto; padding:0 44px 60px; }
.tab-row { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; margin-bottom:2px; }
.tbtn {
  padding:16px 20px; background:var(--bg2); border:1px solid var(--border); border-bottom:none;
  cursor:pointer; font-family:'Bebas Neue',sans-serif; font-size:21px; letter-spacing:.07em; color:var(--dim);
  display:flex; align-items:center; justify-content:space-between; transition:all .22s; position:relative;
}
.tbtn::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; transform:scaleX(0); transition:transform .22s; }
.tbtn.eur.on { color:var(--red); background:rgba(232,64,64,.04); border-color:rgba(232,64,64,.18); }
.tbtn.eur.on::after { background:var(--red); transform:scaleX(1); }
.tbtn.gbp.on { color:var(--cyan); background:rgba(46,196,214,.04); border-color:rgba(46,196,214,.18); }
.tbtn.gbp.on::after { background:var(--cyan); transform:scaleX(1); }
.tbtn.xau.on { color:var(--gold2); background:rgba(245,200,66,.04); border-color:rgba(245,200,66,.18); }
.tbtn.xau.on::after { background:var(--gold2); transform:scaleX(1); }
.tsig { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:.12em; padding:3px 9px; }
.sr { background:rgba(232,64,64,.13); color:var(--red); border:1px solid rgba(232,64,64,.28); }
.sc { background:rgba(46,196,214,.13); color:var(--cyan); border:1px solid rgba(46,196,214,.28); }
.sg { background:rgba(245,200,66,.1); color:var(--gold2); border:1px solid rgba(245,200,66,.25); }

/* ─── PANELS ─── */
.panel { display:none; background:var(--bg2); border:1px solid var(--border); animation:fin .3s ease; }
.panel.on { display:block; }
@keyframes fin { from{opacity:0;transform:translateY(6px);} to{opacity:1;transform:translateY(0);} }

/* Panel header strip */
.phead { padding:28px 36px 24px; border-bottom:1px solid var(--border); display:flex; align-items:flex-start; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.ptitle { font-family:'Bebas Neue',sans-serif; font-size:44px; line-height:1; letter-spacing:.04em; }
.psub { font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.16em; color:var(--dim2); text-transform:uppercase; margin-top:5px; }
.pbox { background:var(--bg3); border:1px solid var(--border); padding:14px 20px; text-align:right; min-width:200px; }
.pbox-lbl { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:.18em; color:var(--dim2); text-transform:uppercase; margin-bottom:5px; }
.pbox-val { font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:.05em; }
.pbox-sub { font-family:'DM Mono',monospace; font-size:10px; color:var(--dim2); margin-top:3px; }

/* Panel body */
.pbody { padding:32px 36px; }

/* Section heading */
.sh { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:.24em; color:var(--dim2); text-transform:uppercase;
  display:flex; align-items:center; gap:10px; margin-bottom:16px; margin-top:28px; }
.sh:first-child { margin-top:0; }
.sh::after { content:''; flex:1; height:1px; background:var(--border); }

/* ─── FACTOR CARDS ─── */
.fgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:4px; }
.fgrid2 { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-bottom:4px; }

.fc {
  background:var(--bg3); border:1px solid var(--border); padding:18px 18px 16px;
  position:relative; overflow:hidden; transition:border-color .2s,transform .2s;
}
.fc:hover { transform:translateY(-2px); border-color:var(--border2); }
.fc::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; }
.fc.h1::before { background:var(--red); }
.fc.h2::before { background:var(--orange); }
.fc.h3::before { background:var(--gold2); }
.fc.h4::before { background:var(--cyan); }
.fc.h5::before { background:var(--green); }
.fc.h6::before { background:var(--purple); }

.fc-top { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:10px; gap:8px; }
.fc-name { font-family:'Syne',sans-serif; font-size:12px; font-weight:700; line-height:1.3; color:var(--text); }
.fc-w { font-family:'Bebas Neue',sans-serif; font-size:22px; flex-shrink:0; }
.fc.h1 .fc-w { color:var(--red); }
.fc.h2 .fc-w { color:var(--orange); }
.fc.h3 .fc-w { color:var(--gold2); }
.fc.h4 .fc-w { color:var(--cyan); }
.fc.h5 .fc-w { color:var(--green); }
.fc.h6 .fc-w { color:var(--purple); }

/* Weight bar */
.wbar-bg { width:100%; height:3px; background:rgba(255,255,255,.05); border-radius:2px; margin-bottom:12px; overflow:hidden; }
.wbar { height:100%; border-radius:2px; width:0; transition:width 1s cubic-bezier(.4,0,.2,1); }
.fc.h1 .wbar { background:linear-gradient(90deg,var(--red),#FF7070); }
.fc.h2 .wbar { background:linear-gradient(90deg,var(--orange),#FFAA60); }
.fc.h3 .wbar { background:linear-gradient(90deg,var(--gold),var(--gold2)); }
.fc.h4 .wbar { background:linear-gradient(90deg,var(--cyan),#7EEDFF); }
.fc.h5 .wbar { background:linear-gradient(90deg,var(--green),#90FFB8); }
.fc.h6 .wbar { background:linear-gradient(90deg,var(--purple),#C4B0FF); }

/* Points */
.pts { display:flex; flex-direction:column; gap:6px; }
.pt { display:flex; gap:8px; font-size:11.5px; color:var(--dim); line-height:1.5; }
.arr { font-family:'DM Mono',monospace; font-size:10px; color:var(--gold); flex-shrink:0; margin-top:2px; }
.pt strong { color:var(--text); }
.up { color:var(--green)!important; font-weight:600; }
.dn { color:var(--red)!important; font-weight:600; }
.nt { color:var(--orange)!important; font-weight:600; }
.cy { color:var(--cyan)!important; font-weight:600; }
.gd { color:var(--gold2)!important; font-weight:600; }
.pp { color:var(--purple)!important; font-weight:600; }

/* ─── IMPACT MATRIX ─── */
.matrix { width:100%; border-collapse:collapse; font-family:'DM Mono',monospace; font-size:11px; }
.matrix th { background:var(--bg4); border:1px solid var(--border); padding:10px 14px; text-align:left; font-size:9px; letter-spacing:.16em; color:var(--dim2); text-transform:uppercase; }
.matrix td { border:1px solid var(--border); padding:11px 14px; vertical-align:middle; color:var(--dim); line-height:1.45; }
.matrix tr:hover td { background:rgba(255,255,255,.012); }
.factor-cell { font-weight:600; color:var(--text); font-size:11.5px; }
.imp { display:inline-flex; align-items:center; gap:4px; }
.dot { width:7px; height:7px; border-radius:50%; display:inline-block; }
.d-r { background:var(--red); } .d-o { background:var(--orange); } .d-y { background:var(--gold2); } .d-c { background:var(--cyan); } .d-g { background:var(--green); }
.tag { font-size:9px; padding:2px 8px; border-radius:2px; font-weight:600; letter-spacing:.08em; }
.tag.bull { background:rgba(61,220,132,.15); color:var(--green); border:1px solid rgba(61,220,132,.28); }
.tag.bear { background:rgba(232,64,64,.15); color:var(--red); border:1px solid rgba(232,64,64,.28); }
.tag.mix  { background:rgba(245,200,66,.1); color:var(--gold2); border:1px solid rgba(245,200,66,.25); }

/* ─── CHEAT SHEET / QUICK RULES ─── */
.rules-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.rule-card { background:var(--bg3); border:1px solid var(--border); padding:16px 18px; }
.rc-title { font-family:'Syne',sans-serif; font-size:11px; font-weight:700; color:var(--text); margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.rc-icon { font-size:14px; }
.rc-list { display:flex; flex-direction:column; gap:5px; }
.rc-item { font-family:'DM Mono',monospace; font-size:10.5px; color:var(--dim); display:flex; gap:7px; line-height:1.5; }
.rc-item::before { content:'→'; color:var(--gold); flex-shrink:0; }
.rc-item b { color:var(--text); }

/* ─── MASTER DRIVER TABLE ─── */
.master-wrap { position:relative; z-index:1; margin:0 auto; padding:0 44px 70px; }
.sec-title { font-family:'Bebas Neue',sans-serif; font-size:32px; letter-spacing:.06em; color:var(--text); margin-bottom:18px; display:flex; align-items:center; gap:14px; }
.sec-title::after { content:''; flex:1; height:1px; background:var(--border); }

.big-table { width:100%; border-collapse:collapse; font-family:'DM Mono',monospace; font-size:11px; }
.big-table th { background:var(--bg3); border:1px solid var(--border); padding:11px 16px; text-align:left; font-size:9px; letter-spacing:.18em; color:var(--dim2); text-transform:uppercase; white-space:nowrap; }
.big-table td { border:1px solid var(--border); padding:13px 16px; vertical-align:top; line-height:1.55; color:var(--dim); }
.big-table tr:hover td { background:rgba(255,255,255,.012); }
.pair-name { font-family:'Bebas Neue',sans-serif; font-size:20px; letter-spacing:.04em; }
.stars { color:var(--gold2); font-size:12px; letter-spacing:2px; }
.arrow-cell { font-weight:700; font-size:12px; }
.arrow-cell.up { color:var(--green); }
.arrow-cell.dn { color:var(--red); }
.arrow-cell.mix { color:var(--gold2); }

/* ─── LEGEND / KEY BOX ─── */
.keybox { margin-top:28px; background:var(--bg2); border:1px solid rgba(201,168,76,.2); padding:24px 30px; position:relative; overflow:hidden; }
.keybox::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,transparent,var(--gold),var(--gold2),var(--gold),transparent); }
.keybox-title { font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.22em; color:var(--gold); text-transform:uppercase; margin-bottom:14px; }
.key-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.key-item { display:flex; flex-direction:column; gap:5px; }
.key-label { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:.14em; color:var(--dim2); text-transform:uppercase; }
.key-val { font-family:'Syne',sans-serif; font-size:12px; font-weight:600; color:var(--text); }
.key-val.r { color:var(--red); } .key-val.g { color:var(--green); } .key-val.y { color:var(--gold2); } .key-val.c { color:var(--cyan); }


@media(max-width:900px){
  .fgrid,.fgrid2,.rules-grid { grid-template-columns:1fr 1fr; }
  .key-grid { grid-template-columns:repeat(2,1fr); }
  .topbar,.wrap,.hero,.master-wrap,footer { padding-left:20px; padding-right:20px; }
  .pbody,.phead { padding:20px; }
  .tab-row { grid-template-columns:1fr; }
  .tbtn { border-bottom:1px solid var(--border); }
}
@media(max-width:600px){
  .fgrid,.fgrid2,.rules-grid,.key-grid { grid-template-columns:1fr; }
}