:root{
  --bg:#07080c;--bg2:#0e1018;--bg3:#161822;--bg4:#1e2030;
  --gold:#c9a84c;--gold-d:#8b7535;--gold-g:rgba(201,168,76,.10);
  --red:#d4443b;--red-g:rgba(212,68,59,.12);
  --blue:#5b8fd9;--blue-g:rgba(91,143,217,.10);
  --green:#4caf50;--green-g:rgba(76,175,80,.10);
  --orange:#e68a3b;--orange-g:rgba(230,138,59,.10);
  --purple:#9b6fd9;--purple-g:rgba(155,111,217,.10);
  --cyan:#4dd0e1;--cyan-g:rgba(77,208,225,.10);
  --txt:#e4e0d8;--txt2:#9a968e;--txt3:#5e5b55;
  --bdr:rgba(201,168,76,.10);
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:var(--txt);font-family:'Source Serif 4',Georgia,serif;line-height:1.75;overflow-x:hidden}
::selection{background:var(--gold);color:var(--bg)}
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--gold-d);border-radius:3px}

/* HERO */
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2rem;position:relative}
.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 700px 500px at 30% 30%,rgba(212,68,59,.06) 0%,transparent 70%),radial-gradient(ellipse 700px 500px at 70% 60%,rgba(201,168,76,.05) 0%,transparent 70%),radial-gradient(ellipse 500px 500px at 50% 90%,rgba(91,143,217,.04) 0%,transparent 70%);pointer-events:none}
.hero-tag{font-family:'JetBrains Mono',monospace;font-size:.65rem;letter-spacing:6px;text-transform:uppercase;color:var(--red);margin-bottom:1.5rem;opacity:0;animation:fu .8s .2s forwards}
.hero h1{font-family:'Playfair Display',serif;font-size:clamp(1.8rem,4.5vw,3.8rem);font-weight:800;line-height:1.15;max-width:820px;margin-bottom:1.5rem;opacity:0;animation:fu .8s .5s forwards}
.hero h1 em{font-style:normal;color:var(--red)}
.hero-desc{font-size:1rem;color:var(--txt2);max-width:600px;margin-bottom:2.5rem;opacity:0;animation:fu .8s .8s forwards}
.hero-thesis{max-width:700px;background:var(--red-g);border-left:3px solid var(--red);padding:1.3rem 1.6rem;font-size:.9rem;color:var(--txt);text-align:left;border-radius:0 4px 4px 0;opacity:0;animation:fu .8s 1.1s forwards}
.hero-thesis strong{color:var(--gold)}
.scroll-cue{position:relative;margin-top:3.5rem;color:var(--gold-d);font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:4px;text-transform:uppercase;opacity:0;animation:fu .8s 1.4s forwards,pulse 2s 2.5s infinite}
@keyframes fu{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}

/* NAV */
.nav{position:sticky;top:0;z-index:100;background:rgba(7,8,12,.92);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--bdr)}
.nav-inner{max-width:1200px;margin:0 auto;display:flex;overflow-x:auto;scrollbar-width:none}
.nav-inner::before,.nav-inner::after{content:'';margin:auto}
.nav-inner::-webkit-scrollbar{display:none}
.nb{background:none;border:none;color:var(--txt3);font-family:'JetBrains Mono',monospace;font-size:.55rem;letter-spacing:2px;text-transform:uppercase;padding:.85rem 1rem;cursor:pointer;white-space:nowrap;transition:all .3s;border-bottom:2px solid transparent}
.nb:hover{color:var(--txt2)}.nb.active{color:var(--gold);border-bottom-color:var(--gold)}

/* CONTENT */
.content{max-width:1100px;margin:0 auto;padding:0 1.5rem}
.sec{padding:3.5rem 0;border-bottom:1px solid var(--bdr);opacity:0;transform:translateY(35px);transition:all .7s cubic-bezier(.16,1,.3,1)}
.sec.vis{opacity:1;transform:translateY(0)}
.stag{font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:4px;text-transform:uppercase;padding:.3rem .7rem;border-radius:2px;display:inline-block;margin-bottom:.8rem}
.t-red{color:var(--red);background:var(--red-g)}.t-gold{color:var(--gold);background:var(--gold-g)}.t-blue{color:var(--blue);background:var(--blue-g)}.t-green{color:var(--green);background:var(--green-g)}.t-orange{color:var(--orange);background:var(--orange-g)}.t-purple{color:var(--purple);background:var(--purple-g)}.t-cyan{color:var(--cyan);background:var(--cyan-g)}
.sec h2{font-family:'Playfair Display',serif;font-size:clamp(1.3rem,2.5vw,1.9rem);font-weight:700;margin-bottom:.4rem}
.sec-sub{color:var(--txt2);font-style:italic;font-size:.92rem;margin-bottom:1.8rem}
.prose{color:var(--txt2);font-size:.92rem;margin-bottom:1.5rem}
.prose p{margin-bottom:1rem}
.prose strong{color:var(--txt);font-weight:600}

/* FISHBONE SVG */
.fishbone-wrap{overflow-x:auto;margin:2rem 0;padding:1rem 0;-webkit-overflow-scrolling:touch}
.fishbone-wrap svg{display:block;margin:0 auto}
.fishbone-wrap text{font-family:'Source Serif 4',Georgia,serif}
.fishbone-wrap svg a text.bone-link{fill:#9a968e;cursor:pointer;transition:fill .2s}
.fishbone-wrap svg a:hover text.bone-link{fill:var(--txt) !important}
.fishbone-inst{font-family:'JetBrains Mono',monospace;font-size:.58rem;letter-spacing:2px;color:var(--gold);text-transform:uppercase;margin-bottom:1rem}

/* CARDS */
.cg{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1rem;margin:2rem 0}
.card{background:var(--bg3);border:1px solid var(--bdr);border-radius:4px;padding:1.4rem;transition:all .3s;position:relative;overflow:hidden}
.card::before{content:'';position:absolute;top:0;left:0;width:3px;height:100%}
.card.c-red::before{background:var(--red)}.card.c-gold::before{background:var(--gold)}.card.c-blue::before{background:var(--blue)}.card.c-green::before{background:var(--green)}.card.c-orange::before{background:var(--orange)}.card.c-purple::before{background:var(--purple)}.card.c-cyan::before{background:var(--cyan)}
.card:hover{border-color:var(--gold-d);transform:translateY(-2px);box-shadow:0 8px 30px rgba(0,0,0,.3)}
.card-label{font-family:'JetBrains Mono',monospace;font-size:.55rem;letter-spacing:2px;color:var(--txt3);margin-bottom:.4rem;text-transform:uppercase}
.card h3{font-family:'Playfair Display',serif;font-size:.95rem;font-weight:700;margin-bottom:.4rem}
.card p{font-size:.8rem;color:var(--txt2);line-height:1.6}

/* QUOTE */
.qb{border-left:2px solid var(--gold);padding:1rem 1.5rem;margin:1.5rem 0;background:var(--gold-g);border-radius:0 4px 4px 0}
.qb-t{font-style:italic;color:var(--txt);font-size:.92rem}
.qb-a{font-family:'JetBrains Mono',monospace;font-size:.58rem;letter-spacing:2px;color:var(--gold-d);margin-top:.5rem}

/* STAKEHOLDER TABLE */
.stk-table{width:100%;border-collapse:collapse;margin:2rem 0;font-size:.82rem}
.stk-table th{font-family:'JetBrains Mono',monospace;font-size:.58rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold);text-align:left;padding:.8rem 1rem;border-bottom:2px solid var(--gold-d);background:var(--bg2)}
.stk-table td{padding:.7rem 1rem;border-bottom:1px solid var(--bdr);color:var(--txt2);vertical-align:top}
.stk-table tr:hover td{background:var(--bg3)}
.gain{color:var(--green)}.loss{color:var(--red)}.neutral{color:var(--orange)}

/* DOMINO CHAIN */
.dom{display:flex;align-items:stretch;min-height:55px}
.dom-line{width:36px;display:flex;flex-direction:column;align-items:center;flex-shrink:0}
.dom-dot{width:11px;height:11px;border-radius:50%;flex-shrink:0;box-shadow:0 0 8px rgba(255,255,255,.15)}
.dom-conn{width:2px;flex:1;background:linear-gradient(to bottom,var(--gold),var(--gold-d))}
.dom-body{flex:1;padding:.2rem 0 1.2rem 1rem}
.dom-body h4{font-family:'Playfair Display',serif;font-size:.92rem;font-weight:700;margin-bottom:.3rem;color:var(--txt)}
.dom-body p{font-size:.82rem;color:var(--txt2);line-height:1.65}

/* BAR CHART — Fixed for visibility */
.bar-row{display:flex;align-items:center;gap:1rem;margin-bottom:.6rem}
.bar-label{font-family:'JetBrains Mono',monospace;font-size:.7rem;letter-spacing:1px;color:var(--txt);width:130px;text-align:right;flex-shrink:0;font-weight:500}
.bar-track{flex:1;height:34px;background:var(--bg4);border-radius:3px;position:relative}
.bar-fill{height:100%;border-radius:3px;transition:width 1.5s cubic-bezier(.16,1,.3,1);display:flex;align-items:center;padding-left:.7rem;font-family:'JetBrains Mono',monospace;font-size:.68rem;color:#ffffff;font-weight:600;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.6);min-width:max-content}

/* DETAIL EVIDENCE SECTIONS (from fishbone links) */
.detail-sec{padding:2.5rem 0;border-bottom:1px solid var(--bdr);opacity:0;transform:translateY(25px);transition:all .7s cubic-bezier(.16,1,.3,1)}
.detail-sec.vis{opacity:1;transform:translateY(0)}
.detail-sec h2{font-family:'Playfair Display',serif;font-size:clamp(1.1rem,2vw,1.5rem);font-weight:700;margin-bottom:.3rem;color:var(--txt)}
.dsub{color:var(--txt);font-style:italic;font-size:.88rem;margin-bottom:1.2rem;opacity:.85}
.detail-sec .prose{font-size:.88rem}
.cite{font-family:'JetBrains Mono',monospace;font-size:.58rem;color:var(--txt3);margin-top:.8rem;padding-top:.6rem;border-top:1px solid rgba(255,255,255,.05);line-height:1.8}
.vol-link{font-family:'JetBrains Mono',monospace;font-size:.58rem;letter-spacing:2px;text-transform:uppercase;color:var(--blue);background:var(--blue-g);padding:.3rem .7rem;border-radius:2px;display:inline-block;margin-top:.5rem;text-decoration:none;border-bottom:none;transition:background .3s}
.vol-link:hover{background:rgba(91,143,217,.2)}
.back-map{font-family:'JetBrains Mono',monospace;font-size:.58rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold);background:var(--gold-g);padding:.3rem .7rem;border-radius:2px;display:inline-block;margin-top:.5rem;margin-left:.5rem;cursor:pointer;text-decoration:none;border-bottom:none;transition:background .3s}
.back-map:hover{background:rgba(201,168,76,.2)}

/* BRANCH HEADER (groups detail sections) */
.branch-header{padding:2rem 0 .5rem;margin-top:1rem}
.branch-header h3{font-family:'Playfair Display',serif;font-size:1.2rem;font-weight:700}
.branch-header .branch-desc{font-size:.8rem;color:var(--txt3);margin-top:.3rem}

/* Flash highlight on fishbone link click */
.detail-sec.flash{border-left:3px solid var(--gold);padding-left:1rem;transition:border-left .3s,padding-left .3s}

/* AUTHOR NOTE */
.author-note{background:var(--bg2);border:1px solid var(--bdr);border-radius:4px;padding:2rem 2.5rem;margin:2rem 0;position:relative}
.author-note::before{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:var(--gold);border-radius:2px 0 0 2px}
.author-note p{font-size:.88rem;color:var(--txt2);margin-bottom:.8rem;line-height:1.75}
.author-note strong{color:var(--txt)}
.author-sig{font-family:'Playfair Display',serif;font-size:.9rem;color:var(--gold);margin-top:1rem;font-style:italic}

/* TABS */
.tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.5rem}
.tab{background:var(--bg3);border:1px solid var(--bdr);color:var(--txt3);font-family:'JetBrains Mono',monospace;font-size:.55rem;letter-spacing:1.5px;text-transform:uppercase;padding:.5rem .9rem;border-radius:2px;cursor:pointer;transition:all .3s}
.tab:hover{border-color:var(--gold-d);color:var(--txt2)}
.tab.active{background:var(--gold-g);border-color:var(--gold);color:var(--gold)}
.tab-pane{display:none}.tab-pane.active{display:block}

/* FOOTER */
.footer{padding:3.5rem 1.5rem;text-align:center;border-top:1px solid var(--bdr);margin-top:3rem}
.footer-t{font-family:'JetBrains Mono',monospace;font-size:.58rem;letter-spacing:3px;color:var(--txt3);text-transform:uppercase}
.footer-b{font-family:'Playfair Display',serif;font-size:1.1rem;color:var(--gold);margin-top:.5rem}

/* COPYRIGHT BANNER */
.copyright-banner{font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold-d);text-align:center;padding:.8rem 1.5rem;border-bottom:1px solid var(--bdr);background:var(--bg2)}

/* PRINT PROTECTION */
@media print{
  .copyright-banner{position:fixed;top:0;left:0;right:0;font-size:9pt;color:#333;background:#fff;border-bottom:1px solid #ccc}
  body::after{content:"\00a9  2026 Shrey Kant Chaurasia / Shades of Shrey. All rights reserved. Unauthorized reproduction prohibited.";position:fixed;bottom:0;left:0;right:0;text-align:center;font-size:8pt;color:#666;padding:6px;font-family:monospace}
}

/* REDUCED MOTION */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* RESPONSIVE */
@media(max-width:1024px){.nav-inner::before,.nav-inner::after{display:none} .nav-inner{padding:0 1rem}}
@media(max-width:768px){
  .cg{grid-template-columns:1fr}
  .bar-label{width:80px;font-size:.6rem}
  .bar-track{height:30px}
  .bar-fill{font-size:.58rem}
  .stk-table{font-size:.72rem}
  .stk-table th,.stk-table td{padding:.5rem .6rem}
  .author-note{padding:1.2rem 1.5rem}
  .dom-body h4{font-size:.82rem}
  .dom-body p{font-size:.75rem}
}