:root{
  --color-navy:#0E2240; --color-navy-deep:#081730; --color-navy-soft:#1B355C;
  --color-orange:#FF6E14; --color-orange-deep:#E55F0E; --color-orange-soft:#FFEAD9;
  --color-olive:#4F5B3C; --color-olive-soft:#7A8867; --color-olive-tint:#E9ECDF;
  --color-white:#FFFFFF; --color-bone:#F7F4EE; --color-ink:#0B1220; --color-slate:#4B5566;
  --color-mist:#8B95A6; --color-line:#E6E9EF; --color-line-soft:#F0F2F6;
  --font-display:'Space Grotesk','Helvetica Neue',Arial,sans-serif; --font-body:'Plus Jakarta Sans','Helvetica Neue',Arial,sans-serif;
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px; --radius-xl:24px; --radius-pill:999px;
  --shadow-sm:0 2px 8px rgba(14,34,64,.08); --shadow-md:0 10px 30px rgba(14,34,64,.13); --shadow-lg:0 24px 60px rgba(14,34,64,.22);
  --bg:var(--color-bone); --surface:#fff; --surface-2:#FBFAF7; --text:var(--color-ink); --muted:var(--color-slate); --line:var(--color-line);
  --topbar-h:72px; --sidebar-w:336px;
}
[data-theme="dark"]{
  --bg:#07111F; --surface:#0E2240; --surface-2:#081730; --text:#F8FAFC; --muted:#B8C2D3; --line:rgba(255,255,255,.14);
  --shadow-sm:0 2px 8px rgba(0,0,0,.18); --shadow-md:0 10px 30px rgba(0,0,0,.25); --shadow-lg:0 24px 60px rgba(0,0,0,.38);
}
*{box-sizing:border-box} html,body{height:100%} body{margin:0;font-family:var(--font-body);background:var(--bg);color:var(--text);line-height:1.55;-webkit-font-smoothing:antialiased} button,input,textarea{font:inherit} button{cursor:pointer} a{color:var(--color-orange);text-decoration:none}.muted{color:var(--muted)}
h1,h2,h3{font-family:var(--font-display);letter-spacing:-.02em;margin:0} h1{font-size:clamp(30px,3.6vw,56px);line-height:1.04} h2{font-size:20px;line-height:1.12} h3{font-size:16px}.eyebrow{font-family:var(--font-display);font-weight:600;letter-spacing:.17em;text-transform:uppercase;font-size:11px;color:var(--color-orange);margin:0 0 8px}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#081730,#0E2240 58%,#FF6E14 140%)}.login-card{width:min(540px,100%);background:var(--color-white);border-radius:28px;padding:40px;box-shadow:var(--shadow-lg)}.login-card h1{color:var(--color-navy)}.login-form{display:grid;gap:12px;margin-top:28px}.login-form input{height:52px;border:1px solid var(--color-line);border-radius:12px;padding:0 14px}.alert{padding:12px 14px;background:var(--color-orange-soft);border:1px solid var(--color-orange);border-radius:12px;margin:16px 0;color:#662600}
.app{min-height:100vh;display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;overflow:auto;padding:22px;background:var(--color-navy);color:#fff;border-right:1px solid rgba(255,255,255,.08)}.brand-block{display:flex;align-items:center;gap:12px;margin-bottom:22px}.monogram{width:42px;height:42px;border-radius:12px;background:var(--color-orange);display:grid;place-items:center;color:#fff;font-family:var(--font-display);font-weight:700}.brand-block span{display:block;color:rgba(255,255,255,.68);font-size:12px}.progress-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:14px;margin-bottom:14px}.progress-top{display:flex;justify-content:space-between;font-weight:700;font-family:var(--font-display);font-size:14px}.progressbar{height:8px;background:rgba(255,255,255,.14);border-radius:999px;overflow:hidden;margin-top:10px}.progressbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--color-orange),#ffb16d);border-radius:inherit;transition:width .35s ease}.search-wrap input{width:100%;height:44px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;border-radius:14px;padding:0 12px;outline:0}.search-wrap input::placeholder{color:rgba(255,255,255,.55)}.step-nav{margin-top:16px;display:grid;gap:10px}.part-group{border:1px solid rgba(255,255,255,.12);border-radius:16px;overflow:hidden;background:rgba(255,255,255,.045)}.part-head{width:100%;background:transparent;color:#fff;border:0;text-align:left;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;font-weight:700}.part-steps{display:grid;gap:4px;padding:0 8px 10px}.step-btn{width:100%;border:0;background:transparent;color:rgba(255,255,255,.78);text-align:left;border-radius:12px;padding:9px 8px;display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:start}.step-btn:hover{background:rgba(255,255,255,.08);color:#fff}.step-btn.active{background:var(--color-orange);color:#fff}.step-num{font-size:11px;font-weight:700;background:rgba(255,255,255,.12);border-radius:999px;text-align:center;padding:2px 0}.step-btn.done .step-num{background:var(--color-olive-soft)}.step-title{font-size:12px;line-height:1.28}.logout{display:block;margin-top:16px;color:rgba(255,255,255,.65)}
.main{min-width:0;padding:18px 22px 60px}.topbar{height:var(--topbar-h);position:sticky;top:0;z-index:20;background:linear-gradient(180deg,var(--bg) 70%,rgba(247,244,238,0));display:flex;gap:14px;align-items:center;justify-content:space-between}.mode-tabs{display:flex;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px;box-shadow:var(--shadow-sm)}.mode{border:0;background:transparent;padding:9px 14px;border-radius:999px;color:var(--muted);font-weight:700}.mode.active{background:var(--color-navy);color:#fff}.top-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.pill,.icon-btn,.text-btn{border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:999px;padding:9px 12px;font-weight:700;box-shadow:var(--shadow-sm)}.pill.accent{border-color:var(--color-orange);color:var(--color-orange)}.pill.strong{background:var(--color-orange);color:#fff;border-color:var(--color-orange)}.pill.active{background:var(--color-navy);color:#fff}.icon-btn{width:40px;height:40px;display:grid;place-items:center;padding:0}.text-btn{box-shadow:none;padding:7px 11px}.btn{border:0;border-radius:14px;padding:12px 16px;font-weight:800}.btn.primary{background:var(--color-orange);color:#fff}.btn.outline{background:var(--surface);border:1px solid var(--line);color:var(--text)}.hero-card{background:linear-gradient(135deg,var(--color-navy),var(--color-navy-soft));color:#fff;border-radius:28px;padding:34px;box-shadow:var(--shadow-lg);display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.hero-card h1{color:#fff}.hero-card .subtitle{max-width:880px;color:rgba(255,255,255,.78);font-size:17px}.hero-actions{display:flex;gap:10px;flex-shrink:0}.proof-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:18px}.card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:var(--shadow-sm);min-width:0}.card h2{color:var(--color-navy);margin-bottom:10px}[data-theme="dark"] .card h2{color:#fff}.card p{margin:0}.carry{grid-column:span 4}.bridge{grid-column:span 5;border-color:rgba(255,110,20,.35);box-shadow:0 12px 28px rgba(255,110,20,.08)}.question{grid-column:span 3}.inference{grid-column:span 7}.qed{grid-column:span 5;background:linear-gradient(135deg,var(--surface),rgba(255,234,217,.55))}.next{grid-column:span 12}.study-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.systems-inline{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.visual-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:var(--shadow-sm)}.visual-head,.panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.panel-title span{font-size:12px;color:var(--muted)}.mini-mount{height:230px;margin-top:12px}.scripture-item,.thinker-item{padding:12px;border:1px solid var(--line);border-radius:14px;margin-bottom:10px;background:var(--surface-2)}.scripture-item strong,.thinker-item strong{font-family:var(--font-display);color:var(--color-navy)}[data-theme="dark"] .scripture-item strong,[data-theme="dark"] .thinker-item strong{color:#fff}
.drawer,.modal{position:fixed;inset:0;z-index:100;display:none}.drawer.open,.modal.open{display:block}.drawer{left:auto;width:min(460px,100%);background:var(--surface);border-left:1px solid var(--line);box-shadow:var(--shadow-lg);padding:20px}.drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}.drawer textarea{width:100%;height:55vh;resize:vertical;border:1px solid var(--line);border-radius:16px;background:var(--surface-2);color:var(--text);padding:14px}.drawer-actions{display:flex;gap:10px;margin-top:12px}.modal{background:rgba(8,23,48,.72);backdrop-filter:blur(10px);padding:24px;overflow:auto}.modal-card{width:min(760px,100%);margin:8vh auto;background:var(--surface);border-radius:26px;border:1px solid var(--line);box-shadow:var(--shadow-lg);padding:22px}.modal-card.wide{width:min(1120px,100%)}.full-map{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}.map-step{padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}.map-step.current{border-color:var(--color-orange);box-shadow:0 0 0 3px rgba(255,110,20,.18)}.map-step.done{background:var(--color-olive-tint)}
.visual-modal .modal-card{margin:2vh auto}.visual-wide{width:min(1480px,calc(100vw - 28px));min-height:88vh}.visual-layout{display:grid;grid-template-columns:minmax(320px,1fr) minmax(320px,1fr) 340px;gap:16px;align-items:stretch}.diagram-panel{background:var(--surface-2);border:1px solid var(--line);border-radius:20px;padding:16px;min-height:520px;display:flex;flex-direction:column}.svg-mount{flex:1;min-height:430px;width:100%;position:relative}.svg-mount svg,.mini-mount svg{width:100%;height:100%;display:block;overflow:visible}.node circle,.node rect{filter:drop-shadow(0 8px 10px rgba(14,34,64,.18));transition:filter .2s, transform .2s}.node:hover circle,.node:hover rect,.node.selected circle,.node.selected rect{filter:drop-shadow(0 0 14px rgba(255,110,20,.45));stroke:var(--color-orange);stroke-width:3}.node text{font-family:var(--font-display);font-weight:700;font-size:12px;pointer-events:none;fill:#fff}.node .subtext{font-family:var(--font-body);font-size:9px;font-weight:600;fill:rgba(255,255,255,.82)}.edge{stroke:rgba(14,34,64,.28);stroke-width:2;fill:none;transition:stroke .2s,stroke-width .2s}.edge.highlight{stroke:var(--color-orange);stroke-width:3}.edge.animated{stroke-dasharray:8 7;animation:dash 1.2s linear infinite}@keyframes dash{to{stroke-dashoffset:-30}}[data-theme="dark"] .edge{stroke:rgba(255,255,255,.25)}.visual-note-panel{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:18px;display:flex;flex-direction:column;min-height:520px}.visual-note-panel textarea{flex:1;width:100%;min-height:280px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2);color:var(--text);padding:14px;resize:vertical;margin:12px 0}.visual-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.diagram-panel.hidden{display:none}.visual-layout.fractal-only{grid-template-columns:minmax(0,1fr) 360px}.visual-layout.semi-only{grid-template-columns:minmax(0,1fr) 360px}.visual-layout.fractal-only #semiPanel,.visual-layout.semi-only #fractalPanel{display:none}.mobile-only{display:none}
.simple .card,.simple .hero-card{font-size:18px}.simple .eyebrow::after{content:' · country-simple';letter-spacing:0;text-transform:none;color:var(--color-olive);margin-left:6px}.simple h1{font-size:clamp(32px,4vw,50px)}
@media(max-width:1180px){:root{--sidebar-w:300px}.visual-layout{grid-template-columns:1fr;}.diagram-panel,.visual-note-panel{min-height:auto}.svg-mount{min-height:420px}.visual-note-panel textarea{min-height:160px}.visual-wide{width:min(980px,calc(100vw - 20px))}.hero-card{align-items:flex-start;flex-direction:column}.proof-grid .card{grid-column:span 12}.study-grid,.systems-inline{grid-template-columns:1fr}}
@media(max-width:860px){.app{grid-template-columns:1fr}.sidebar{position:fixed;z-index:80;left:0;top:0;bottom:0;width:min(340px,88vw);transform:translateX(-102%);transition:transform .25s ease}.sidebar.open{transform:translateX(0)}.main{padding:10px 12px 42px}.mobile-only{display:grid}.topbar{height:auto;min-height:70px;align-items:flex-start;gap:8px;flex-wrap:wrap;padding-top:8px}.top-actions{width:100%;justify-content:flex-start;overflow:auto;flex-wrap:nowrap;padding-bottom:6px}.top-actions .pill{white-space:nowrap}.mode-tabs{order:2}.hero-card{border-radius:22px;padding:24px}.proof-grid{gap:12px}.card{border-radius:16px;padding:16px}.modal{padding:10px}.modal-card{border-radius:20px;padding:16px;margin:3vh auto}.visual-wide{width:100%}.visual-top{align-items:stretch;flex-direction:column}.visual-tools{justify-content:flex-start}.diagram-panel{padding:12px}.svg-mount{min-height:360px}.mini-mount{height:190px}}
@media(max-width:520px){.hero-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.btn{padding:11px 12px}.mode{padding:8px 10px}.pill{padding:8px 10px}.login-card{padding:28px;border-radius:22px}.proof-grid{margin-top:12px}.visual-note-panel textarea{min-height:140px}}

/* ===== v5 visual system upgrades ===== */
.visual-wide{width:min(1580px,calc(100vw - 24px));min-height:92vh;}
.visual-layout{grid-template-columns:minmax(360px,1.05fr) minmax(360px,1.05fr) minmax(320px,.62fr);gap:18px;align-items:stretch;}
.diagram-panel{min-height:640px;background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(247,244,238,.82));position:relative;overflow:hidden;}
[data-theme="dark"] .diagram-panel{background:linear-gradient(180deg,rgba(14,34,64,.96),rgba(8,23,48,.9));}
.diagram-panel:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 18% 18%,rgba(255,110,20,.10),transparent 28%),radial-gradient(circle at 78% 72%,rgba(79,91,60,.14),transparent 34%);pointer-events:none;}
.panel-title{position:relative;z-index:1;align-items:center;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:10px;}
.panel-title h3{font-size:18px;}
.panel-title span{font-size:12px;max-width:210px;text-align:right;}
.svg-mount{position:relative;z-index:1;min-height:540px;contain:size layout paint;}
.svg-mount svg{overflow:visible;touch-action:none;}
.node{cursor:grab;outline:none;transition:opacity .18s ease;}
.node:active{cursor:grabbing;}
.node circle{filter:drop-shadow(0 10px 16px rgba(14,34,64,.22));transition:r .22s var(--ease-standard),filter .22s var(--ease-standard),stroke-width .22s var(--ease-standard);}
.node:hover circle,.node.selected circle{filter:drop-shadow(0 0 18px rgba(255,110,20,.7));stroke:var(--color-orange);stroke-width:2.8;}
.node.selected circle{animation:nodeBreath 1.35s ease-in-out infinite;}
.node.pulse circle{animation:nodePop .55s ease-out 1;}
.node text{font-size:3.15px;letter-spacing:-.02em;paint-order:stroke;stroke:rgba(8,23,48,.72);stroke-width:.6px;stroke-linejoin:round;fill:#fff;filter:drop-shadow(0 1px 1px rgba(0,0,0,.32));}
[data-theme="light"] .node text{stroke:rgba(8,23,48,.45);}
.edge{stroke:rgba(14,34,64,.24);stroke-width:1.15;fill:none;transition:stroke .18s ease,stroke-width .18s ease,opacity .18s ease;}
.edge.scale-edge{stroke:rgba(79,91,60,.45);stroke-width:1.65;}
.edge.overlap-edge{stroke:rgba(14,34,64,.22);}
.edge.highlight{stroke:var(--color-orange);stroke-width:2.35;filter:drop-shadow(0 0 5px rgba(255,110,20,.55));}
.edge.animated{stroke-dasharray:3.4 3.4;animation:dashFlow 1.7s linear infinite;}
@keyframes dashFlow{to{stroke-dashoffset:-20}}
@keyframes nodeBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes nodePop{0%{transform:scale(.85)}55%{transform:scale(1.15)}100%{transform:scale(1)}}
.visual-note-panel{min-height:640px;background:linear-gradient(180deg,var(--surface),var(--surface-2));box-shadow:var(--shadow-md);}
.visual-note-panel .eyebrow{margin-bottom:6px;}
.visual-note-panel h3{font-size:26px;color:var(--color-navy);margin-bottom:6px;}
[data-theme="dark"] .visual-note-panel h3{color:#fff;}
.node-meta{margin:0 0 12px;color:var(--color-orange);font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase;}
#selectedNodeExplain{font-size:15px;line-height:1.65;border-left:3px solid var(--color-orange);padding-left:12px;margin:10px 0 14px;}
.visual-note-panel textarea{min-height:310px;background:var(--surface);font-size:15px;line-height:1.55;}
.visual-tools .pill{box-shadow:none;}
.visual-tools .pill.active{background:var(--color-orange);border-color:var(--color-orange);color:#fff;}
.mini-mount .node text{font-size:0;display:none;}
.mini-mount .edge{stroke-width:1.4;}
.visual-layout.fractal-only,.visual-layout.semi-only{grid-template-columns:minmax(0,1fr) minmax(320px,.36fr);}
.visual-layout.fractal-only .diagram-panel,.visual-layout.semi-only .diagram-panel{min-height:660px;}
.visual-layout.fractal-only .svg-mount,.visual-layout.semi-only .svg-mount{min-height:560px;}
@media(max-width:1280px){.visual-layout{grid-template-columns:1fr 1fr;}.visual-note-panel{grid-column:1/-1;min-height:auto}.visual-note-panel textarea{min-height:170px}.diagram-panel{min-height:560px}.svg-mount{min-height:460px}.visual-layout.fractal-only,.visual-layout.semi-only{grid-template-columns:1fr}.visual-layout.fractal-only .visual-note-panel,.visual-layout.semi-only .visual-note-panel{grid-column:auto}}
@media(max-width:820px){.visual-layout{grid-template-columns:1fr}.diagram-panel{min-height:470px}.svg-mount{min-height:385px}.visual-note-panel h3{font-size:22px}.visual-note-panel textarea{min-height:150px}.panel-title{align-items:flex-start}.panel-title span{text-align:left}}
@media(prefers-reduced-motion:reduce){.edge.animated,.node.selected circle{animation:none!important}}

/* ===== v6 futuristic responsive visual system ===== */
.visual-wide{width:min(1680px,calc(100vw - 24px));min-height:92vh;}
.visual-layout{grid-template-columns:minmax(440px,1fr) minmax(440px,1fr) minmax(360px,.58fr);gap:20px;}
.diagram-panel{min-height:660px;background:linear-gradient(180deg,rgba(14,34,64,.96),rgba(8,23,48,.98));border-color:rgba(255,255,255,.14);box-shadow:0 24px 80px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08);overflow:hidden;}
.diagram-panel .panel-title h3{color:#fff;}
.diagram-panel .panel-title span{color:rgba(255,255,255,.62);}
.svg-mount{min-height:560px;contain:layout paint;}
.svg-mount svg{width:100%;height:100%;display:block;overflow:hidden;touch-action:none;}
.visual-grid-bg{fill:rgba(7,18,36,.34);stroke:rgba(255,255,255,.08);stroke-width:1.5;}
.node-label rect{fill:rgba(255,255,255,.095);stroke:rgba(255,255,255,.16);stroke-width:1.25;backdrop-filter:blur(10px);}
.node-label text{font-family:var(--font-display);font-size:20px;font-weight:800;letter-spacing:-.02em;fill:#fff;paint-order:stroke;stroke:rgba(5,14,28,.65);stroke-width:3px;stroke-linejoin:round;}
.node-label.center-label rect{fill:rgba(255,110,20,.18);stroke:rgba(255,110,20,.42);}
.node-label.center-label text{font-size:22px;}
.modern-node{cursor:grab;outline:none;transition:opacity .16s ease;}
.modern-node:active{cursor:grabbing;}
.node-halo{stroke:rgba(255,255,255,.16);stroke-width:1.5;fill:rgba(255,255,255,.025);transition:fill .2s,stroke .2s,transform .2s;}
.node-core{filter:url(#softShadow);transition:r .2s var(--ease-standard),filter .2s var(--ease-standard),stroke-width .2s var(--ease-standard);}
.node-icon{font-family:var(--font-display);font-weight:900;font-size:24px;fill:#fff;pointer-events:none;paint-order:stroke;stroke:rgba(0,0,0,.35);stroke-width:2;stroke-linejoin:round;}
.modern-node:hover .node-halo,.modern-node.selected .node-halo{fill:rgba(255,110,20,.13);stroke:rgba(255,110,20,.55);}
.modern-node:hover .node-core,.modern-node.selected .node-core{filter:url(#glow);stroke-width:5;}
.modern-node.selected .node-core{animation:futuristicPulse 1.6s ease-in-out infinite;}
.node.pulse .node-core{animation:nodePop .55s ease-out 1;}
.edge{stroke:rgba(255,255,255,.22);stroke-width:3.25;fill:none;stroke-linecap:round;transition:stroke .2s,stroke-width .2s,opacity .2s;}
.edge.scale-edge{stroke:rgba(255,110,20,.42);}
.edge.overlap-edge{stroke:rgba(121,158,255,.35);}
.edge.highlight{stroke:#FF6E14;stroke-width:5;filter:drop-shadow(0 0 9px rgba(255,110,20,.65));}
.edge.animated{stroke-dasharray:14 18;animation:flowDash 1.9s linear infinite;}
@keyframes flowDash{to{stroke-dashoffset:-64}}
@keyframes futuristicPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.075)}}
.visual-note-panel{min-height:660px;border-color:rgba(255,110,20,.22);box-shadow:0 24px 70px rgba(14,34,64,.18);}
.visual-note-panel h3{font-size:clamp(22px,2vw,32px);}
.node-desc{font-size:16px;line-height:1.62;color:var(--fg-secondary);}
[data-theme="dark"] .node-desc{color:rgba(255,255,255,.74)}
.visual-note-panel textarea{min-height:260px;}
.mini-mount .node-label{display:none;}
.mini-mount .node-icon{display:none;}
.mini-mount .node-core{stroke-width:2;}
.visual-layout.fractal-only,.visual-layout.semi-only{grid-template-columns:minmax(0,1fr) minmax(360px,.34fr);}
.visual-layout.fractal-only .diagram-panel,.visual-layout.semi-only .diagram-panel{min-height:720px;}
.visual-layout.fractal-only .svg-mount,.visual-layout.semi-only .svg-mount{min-height:620px;}
@media(max-width:1400px){.visual-layout{grid-template-columns:1fr 1fr}.visual-note-panel{grid-column:1/-1;min-height:auto}.visual-note-panel textarea{min-height:160px}.diagram-panel{min-height:590px}.svg-mount{min-height:500px}}
@media(max-width:900px){.visual-layout{grid-template-columns:1fr}.diagram-panel{min-height:560px}.svg-mount{min-height:470px}.node-label text{font-size:22px}.node-label.center-label text{font-size:23px}.visual-note-panel{min-height:auto}}
@media(max-width:560px){.diagram-panel{min-height:480px}.svg-mount{min-height:400px}.node-label text{font-size:24px}.node-label rect{rx:22}.visual-wide{width:100%;}.visual-layout{gap:14px}.node-icon{font-size:26px}}


/* ===== v7 clarity-first futuristic diagrams ===== */
.diagram-panel{min-height:680px;background:radial-gradient(circle at 15% 10%, rgba(255,110,20,.12), transparent 28%), radial-gradient(circle at 86% 84%, rgba(37,99,235,.16), transparent 32%), linear-gradient(180deg,#071326 0%,#0A1930 100%) !important;}
.svg-mount{min-height:580px !important;}
.visual-wide{width:min(1720px,calc(100vw - 20px));}
.visual-layout{grid-template-columns:minmax(520px,1fr) minmax(520px,1fr) minmax(360px,.48fr) !important;gap:18px !important;}
.visual-grid-bg{fill:rgba(255,255,255,.025);stroke:rgba(255,255,255,.075);stroke-width:1.2;}
.node-label rect{fill:rgba(7,19,38,.84) !important;stroke:rgba(255,255,255,.18) !important;filter:drop-shadow(0 10px 22px rgba(0,0,0,.24));}
.node-label text{font-size:12.5px !important;font-weight:700 !important;letter-spacing:-.01em !important;stroke:none !important;fill:rgba(255,255,255,.94) !important;filter:none !important;}
.node-label.center-label rect{fill:linear-gradient(135deg, rgba(255,110,20,.18), rgba(255,255,255,.08)) !important;stroke:rgba(255,110,20,.58) !important;}
.node-label.center-label text{font-size:13.5px !important;fill:#fff !important;}
.node-halo{stroke:rgba(255,255,255,.13) !important;fill:rgba(255,255,255,.025) !important;}
.node-core{stroke:rgba(255,255,255,.94) !important;stroke-width:3.2 !important;filter:drop-shadow(0 12px 18px rgba(0,0,0,.34));}
.node-icon{font-size:12px !important;stroke:none !important;fill:#fff !important;font-weight:900 !important;}
.modern-node:hover .node-core,.modern-node.selected .node-core{stroke:#FF6E14 !important;stroke-width:4 !important;filter:drop-shadow(0 0 14px rgba(255,110,20,.78));}
.edge{stroke-width:2.1 !important;opacity:.72;}
.edge.scale-edge{stroke:rgba(255,110,20,.48) !important;}
.edge.overlap-edge{stroke:rgba(117,162,255,.34) !important;}
.edge.highlight{stroke:#FF6E14 !important;stroke-width:3.6 !important;opacity:1;filter:drop-shadow(0 0 8px rgba(255,110,20,.68));}
.edge.animated{stroke-dasharray:8 12 !important;animation:flowDash 2.35s linear infinite !important;}
.visual-note-panel{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,244,238,.95)) !important;}
[data-theme="dark"] .visual-note-panel{background:linear-gradient(180deg,rgba(14,34,64,.98),rgba(8,23,48,.97)) !important;}
#selectedNodeExplain{font-size:15px;line-height:1.65;background:rgba(255,110,20,.08);border-left:3px solid var(--color-orange);border-radius:0 12px 12px 0;padding:12px 14px;margin:12px 0 16px;color:var(--fg-primary);}
[data-theme="dark"] #selectedNodeExplain{color:rgba(255,255,255,.84);background:rgba(255,110,20,.12);}
.readmore-section{border:1px solid var(--line);border-radius:18px;padding:18px;margin:14px 0;background:var(--surface-2);}
.readmore-section h3{margin-bottom:10px}.readmore-section ul{margin:8px 0 0 20px;line-height:1.7}.loading-card,.alert-soft{border:1px solid var(--line);border-radius:16px;background:var(--surface-2);padding:16px;margin:12px 0}.alert-soft{border-color:rgba(255,110,20,.35);background:rgba(255,110,20,.08)}
@media(max-width:1480px){.visual-layout{grid-template-columns:1fr 1fr !important}.visual-note-panel{grid-column:1/-1}.diagram-panel{min-height:600px}.svg-mount{min-height:500px !important}}
@media(max-width:940px){.visual-layout{grid-template-columns:1fr !important}.diagram-panel{min-height:520px}.svg-mount{min-height:440px !important}.node-label text{font-size:13px !important}.node-icon{font-size:12px !important}}
@media(max-width:560px){.diagram-panel{min-height:460px}.svg-mount{min-height:380px !important}.node-label text{font-size:12.5px !important}.node-label rect{rx:12}.edge{stroke-width:1.8 !important}.node-core{stroke-width:2.6 !important}}

/* v9 — Step-local Read More + Notion refresh */
.readmore-step-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,110,20,.13), transparent 36%),
    linear-gradient(135deg, rgba(14,34,64,.98), rgba(27,53,92,.94));
  color: #fff;
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 18px 42px rgba(14,34,64,.20);
}
.readmore-step-card h2 { color: #fff; margin-bottom: 6px; }
.readmore-step-card p { color: rgba(255,255,255,.74); margin: 0; }
.readmore-step-card .btn.primary {
  background: var(--color-orange);
  color: #fff;
  border-color: transparent;
  white-space: nowrap;
}
.cache-pill {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  border-radius: 999px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 700;
  color: var(--color-navy);
  background: rgba(255,110,20,.14);
  border: 1px solid rgba(255,110,20,.24);
}
.readmore-body {
  max-width: 920px;
  margin: 0 auto;
  font-size: 15px;
  line-height: 1.72;
}
.readmore-body h2,
.readmore-body h3,
.readmore-body h4 { margin-top: 24px; }
.readmore-body ul,
.readmore-body ol { padding-left: 22px; }
.readmore-body blockquote {
  margin: 18px 0;
  padding: 14px 18px;
  border-left: 4px solid var(--color-orange);
  background: rgba(255,110,20,.08);
  border-radius: 10px;
}
@media (max-width: 720px) {
  .readmore-step-card { flex-direction: column; align-items: stretch; }
  .readmore-step-card .btn { width: 100%; justify-content: center; }
  .visual-tools { gap: 8px; }
  .cache-pill { width: 100%; justify-content: center; }
}

/* v10 — Move Read More into active step hero actions + mobile hardening */
.hero-actions{align-items:center;flex-wrap:wrap;justify-content:flex-end}.btn.readmore-hero{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);color:#fff;backdrop-filter:blur(10px);box-shadow:0 12px 28px rgba(0,0,0,.16)}.btn.readmore-hero:hover{background:rgba(255,110,20,.22);border-color:rgba(255,110,20,.65)}
.proof-grid .readmore-step-card{display:none!important}
@media(max-width:920px){.hero-card{align-items:stretch;flex-direction:column;padding:24px;border-radius:24px}.hero-actions{display:grid;grid-template-columns:1fr 1fr 1fr;width:100%;gap:8px}.hero-actions .btn{width:100%;padding:12px 10px}.topbar{height:auto;min-height:var(--topbar-h);align-items:flex-start;flex-wrap:wrap;padding-bottom:8px}.mode-tabs{order:1}.top-actions{order:2;width:100%;overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start;padding-bottom:4px;scrollbar-width:thin}.top-actions .pill{white-space:nowrap}.proof-grid{grid-template-columns:1fr}.carry,.bridge,.question,.inference,.qed,.next{grid-column:1/-1!important}.study-grid,.systems-inline{grid-template-columns:1fr}.main{padding:14px 14px 48px}}
@media(max-width:560px){.hero-actions{grid-template-columns:1fr}.hero-card h1{font-size:clamp(38px,13vw,54px)}.sidebar{width:min(88vw,320px)}.modal-card{width:calc(100vw - 18px);max-height:calc(100vh - 18px);border-radius:22px}.drawer{width:min(92vw,380px)}.mode-tabs{width:100%;display:grid;grid-template-columns:1fr 1fr 1fr}.mode{width:100%}}

/* ===== Visible fallback visuals ===== */
.vf-box {
  width: 100%;
  min-height: 100%;
  display: grid;
  gap: 14px;
  padding: 18px;
  border-radius: 22px;
  background:
    radial-gradient(circle at 20% 15%, rgba(255,110,20,.16), transparent 28%),
    radial-gradient(circle at 80% 20%, rgba(79,91,60,.14), transparent 30%),
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}

.vf-nodes {
  display: grid;
  gap: 12px;
}

.vf-fractal .vf-nodes {
  grid-template-columns: 1fr;
  align-content: center;
}

.vf-semi {
  grid-template-rows: auto 1fr;
}

.vf-semi .vf-nodes {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.vf-node {
  width: 100%;
  min-height: 72px;
  text-align: left;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(14,34,64,.96), rgba(27,53,92,.92));
  color: #fff;
  padding: 13px 14px;
  display: grid;
  grid-template-columns: 32px 1fr;
  column-gap: 10px;
  row-gap: 3px;
  align-items: center;
  cursor: pointer;
  box-shadow: 0 14px 26px rgba(0,0,0,.16);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.vf-node:hover,
.vf-node.active {
  transform: translateY(-1px);
  border-color: #FF6E14;
  box-shadow: 0 0 0 3px rgba(255,110,20,.20), 0 18px 34px rgba(0,0,0,.20);
}

.vf-node i {
  grid-row: span 2;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: linear-gradient(135deg, #FF6E14, #FFB27B);
  color: #fff;
  font-style: normal;
  font-weight: 900;
  font-size: 13px;
}

.vf-node strong {
  font-family: var(--font-display);
  font-size: 15px;
  line-height: 1.1;
}

.vf-node span {
  color: rgba(255,255,255,.74);
  font-size: 12px;
  line-height: 1.3;
}

.vf-center {
  background: linear-gradient(135deg, #FF6E14, #D95A0D);
  border-color: rgba(255,255,255,.26);
}

.vf-center i {
  background: rgba(255,255,255,.18);
}

[data-theme="light"] .vf-box {
  background:
    radial-gradient(circle at 20% 15%, rgba(255,110,20,.14), transparent 28%),
    radial-gradient(circle at 80% 20%, rgba(79,91,60,.12), transparent 30%),
    linear-gradient(135deg, rgba(247,244,238,.95), rgba(255,255,255,.92));
}

[data-theme="light"] .vf-node {
  background: linear-gradient(135deg, #0E2240, #1B355C);
}

@media(max-width: 760px) {
  .vf-semi .vf-nodes {
    grid-template-columns: 1fr;
  }

  .vf-node {
    min-height: 64px;
  }
}

/* =========================================================
   Diagram Shape Fix
   Turns fallback visuals from lists into actual diagrams.
   ========================================================= */

/* Shared visual container */
.vf-box {
  position: relative !important;
  min-height: 100% !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}

/* Make full modal diagrams breathe */
.svg-mount .vf-box {
  min-height: 500px !important;
}

/* Make mini diagrams compact but visible */
.mini-mount .vf-box,
.vf-mini-mount .vf-box {
  min-height: 230px !important;
  padding: 12px !important;
}

/* Reset fallback cards into diagram nodes */
.vf-node {
  position: relative !important;
  z-index: 2 !important;
  min-height: unset !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 20% 15%, rgba(255,255,255,.10), transparent 28%),
    linear-gradient(135deg, #0E2240, #1B355C) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
}

.vf-node strong {
  font-size: 14px !important;
}

.vf-node span {
  font-size: 11px !important;
}

/* =========================================
   FRACTAL: diagonal scale/recursion map
   ========================================= */

.vf-fractal {
  display: block !important;
}

.vf-fractal::before {
  content: "";
  position: absolute;
  left: 14%;
  top: 14%;
  width: 68%;
  height: 72%;
  border-left: 3px solid rgba(255,110,20,.50);
  border-bottom: 3px solid rgba(255,110,20,.32);
  transform: skewX(-14deg);
  border-radius: 0 0 0 28px;
  opacity: .9;
  z-index: 1;
}

.vf-fractal::after {
  content: "";
  position: absolute;
  left: 17%;
  top: 15%;
  width: 64%;
  height: 70%;
  background:
    radial-gradient(circle at 10% 10%, rgba(255,110,20,.24), transparent 8%),
    radial-gradient(circle at 30% 28%, rgba(255,110,20,.18), transparent 8%),
    radial-gradient(circle at 50% 45%, rgba(255,110,20,.16), transparent 8%),
    radial-gradient(circle at 70% 62%, rgba(255,110,20,.14), transparent 8%),
    radial-gradient(circle at 90% 80%, rgba(255,110,20,.12), transparent 8%);
  z-index: 0;
}

.vf-fractal .vf-nodes {
  position: relative !important;
  min-height: 465px !important;
  display: block !important;
}

.vf-fractal .vf-node {
  position: absolute !important;
  width: min(360px, 48%) !important;
  min-height: 74px !important;
  display: grid !important;
  grid-template-columns: 36px 1fr !important;
  align-items: center !important;
  padding: 13px 14px !important;
}

/* diagonal placement */
.vf-fractal .vf-node:nth-child(1) { left: 2%; top: 2%; }
.vf-fractal .vf-node:nth-child(2) { left: 14%; top: 23%; }
.vf-fractal .vf-node:nth-child(3) { left: 28%; top: 44%; }
.vf-fractal .vf-node:nth-child(4) { left: 42%; top: 65%; }
.vf-fractal .vf-node:nth-child(5) { left: 55%; top: 82%; }

/* Scale nodes visually shrink slightly as they descend */
.vf-fractal .vf-node:nth-child(1) { transform: scale(1.03); }
.vf-fractal .vf-node:nth-child(2) { transform: scale(.99); }
.vf-fractal .vf-node:nth-child(3) { transform: scale(.95); }
.vf-fractal .vf-node:nth-child(4) { transform: scale(.91); }
.vf-fractal .vf-node:nth-child(5) { transform: scale(.87); }

/* =========================================
   SEMI-LATTICE: center + orbiting overlap
   ========================================= */

.vf-semi {
  display: block !important;
}

.vf-semi::before {
  content: "";
  position: absolute;
  inset: 14%;
  border: 2px dashed rgba(255,110,20,.28);
  border-radius: 999px;
  z-index: 0;
}

.vf-semi::after {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  top: 50%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,110,20,.55), transparent);
  z-index: 0;
  box-shadow:
    0 -118px 0 rgba(255,110,20,.16),
    0 118px 0 rgba(255,110,20,.16);
}

.vf-semi .vf-center {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: min(300px, 42%) !important;
  min-height: 88px !important;
  transform: translate(-50%, -50%) !important;
  z-index: 4 !important;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.18), transparent 30%),
    linear-gradient(135deg, #FF6E14, #D95A0D) !important;
}

.vf-semi .vf-nodes {
  position: relative !important;
  min-height: 465px !important;
  display: block !important;
}

.vf-semi .vf-node:not(.vf-center) {
  position: absolute !important;
  width: min(240px, 30%) !important;
  min-height: 82px !important;
  display: grid !important;
  grid-template-columns: 30px 1fr !important;
  align-items: center !important;
  padding: 12px !important;
}

/* orbit placement */
.vf-semi .vf-nodes .vf-node:nth-child(1) { left: 35%; top: 2%; }
.vf-semi .vf-nodes .vf-node:nth-child(2) { right: 4%; top: 14%; }
.vf-semi .vf-nodes .vf-node:nth-child(3) { right: 2%; top: 42%; }
.vf-semi .vf-nodes .vf-node:nth-child(4) { right: 8%; bottom: 8%; }
.vf-semi .vf-nodes .vf-node:nth-child(5) { left: 35%; bottom: 2%; }
.vf-semi .vf-nodes .vf-node:nth-child(6) { left: 4%; bottom: 10%; }
.vf-semi .vf-nodes .vf-node:nth-child(7) { left: 2%; top: 42%; }
.vf-semi .vf-nodes .vf-node:nth-child(8) { left: 7%; top: 13%; }

/* =========================================
   MINI versions
   ========================================= */

.mini-mount .vf-fractal .vf-nodes,
.vf-mini-mount .vf-fractal .vf-nodes,
.mini-mount .vf-semi .vf-nodes,
.vf-mini-mount .vf-semi .vf-nodes {
  min-height: 205px !important;
}

.mini-mount .vf-node,
.vf-mini-mount .vf-node {
  border-radius: 13px !important;
  padding: 8px !important;
}

.mini-mount .vf-node strong,
.vf-mini-mount .vf-node strong {
  font-size: 10px !important;
}

.mini-mount .vf-node span,
.vf-mini-mount .vf-node span {
  display: none !important;
}

.mini-mount .vf-node i,
.vf-mini-mount .vf-node i {
  width: 22px !important;
  height: 22px !important;
  font-size: 10px !important;
  border-radius: 8px !important;
}

.mini-mount .vf-fractal .vf-node,
.vf-mini-mount .vf-fractal .vf-node {
  width: 54% !important;
  min-height: 40px !important;
  grid-template-columns: 26px 1fr !important;
}

.mini-mount .vf-semi .vf-center,
.vf-mini-mount .vf-semi .vf-center {
  width: 48% !important;
  min-height: 48px !important;
}

.mini-mount .vf-semi .vf-node:not(.vf-center),
.vf-mini-mount .vf-semi .vf-node:not(.vf-center) {
  width: 34% !important;
  min-height: 38px !important;
  grid-template-columns: 22px 1fr !important;
}

/* =========================================
   Mobile: stack into readable diagram cards
   ========================================= */

@media(max-width: 760px) {
  .vf-fractal .vf-nodes,
  .vf-semi .vf-nodes {
    min-height: auto !important;
    display: grid !important;
    gap: 10px !important;
  }

  .vf-fractal::before,
  .vf-fractal::after,
  .vf-semi::before,
  .vf-semi::after {
    display: none !important;
  }

  .vf-fractal .vf-node,
  .vf-semi .vf-node,
  .vf-semi .vf-center {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 100% !important;
    min-height: 64px !important;
  }

  .vf-semi .vf-center {
    margin-bottom: 10px !important;
  }
}