/* ============================================================
   The KJM Model — visual layer (light, calm, phase-coded)
   Four phases share the lab palette: oxblood · ochre · slate · moss
   ============================================================ */
:root{--ph1:#7B2D2A;--ph2:#94651d;--ph3:#2e4a5e;--ph4:#4b6a33;--ph0:#3b3a38}
[data-ph="1"]{--c:var(--ph1)}[data-ph="2"]{--c:var(--ph2)}[data-ph="3"]{--c:var(--ph3)}[data-ph="4"]{--c:var(--ph4)}[data-ph="0"]{--c:var(--ph0)}

/* hero tweaks */
.model-hero{border-bottom:0;padding-bottom:10px}
.model-hero h1{font-size:clamp(2.3rem,4.6vw,3.9rem)}
.kfacts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:26px 0 0;border-top:1.5px solid var(--ink);border-bottom:1px solid var(--line-strong)}
.kfacts div{padding:14px 14px 12px;border-left:1px solid var(--line)}
.kfacts div:first-child{border-left:0;padding-left:0}
.kfacts dt{font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ox);margin:0 0 4px}
.kfacts dd{margin:0;font-family:var(--sans);font-size:.88rem;line-height:1.35;color:var(--ink)}
@media (max-width:760px){.kfacts{grid-template-columns:1fr 1fr}.kfacts div:nth-child(3){border-left:0;padding-left:0}.kfacts div:nth-child(n+3){border-top:1px solid var(--line)}}

/* chips (shared by every figure) */
.kc{display:inline-flex;align-items:center;gap:8px;padding:8px 12px 8px 10px;background:color-mix(in srgb,var(--c) 7%,var(--white));border:1px solid color-mix(in srgb,var(--c) 30%,transparent);border-left:3px solid var(--c);font-family:var(--sans);font-size:.88rem;font-weight:500;line-height:1.25;color:var(--ink)}
.kc b{font-family:var(--mono);font-weight:500;font-size:.62rem;letter-spacing:.04em;color:var(--c)}
.kc[data-ph="0"]{background:var(--white);border-color:var(--line-strong);border-left-color:var(--ink-2)}
.kc-sym{font-family:var(--serif);font-style:italic;font-weight:600;font-size:1.02rem;min-width:40px;justify-content:center;padding:7px 10px}
.kc-gate{font-family:var(--mono);font-style:normal;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;background:var(--white);border:1.5px dashed var(--ink-2);border-left:1.5px dashed var(--ink-2)}

/* figures: base */
.doc figure{margin:1.7em 0}
.doc figure p{margin:0}
.kf-row{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;row-gap:12px}
.kf-row>li{display:flex;align-items:center;margin:0;padding:0}
.kf-row>li:not(:last-child)::after{content:"";width:22px;height:10px;margin:0 3px;flex:none;background:no-repeat center/22px 10px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 10'%3E%3Cpath d='M0 5h19M15 1.5 19 5l-4 3.5' fill='none' stroke='%238a877e' stroke-width='1.3'/%3E%3C/svg%3E")}
.kf-loop span{display:inline-flex;align-items:center;padding:7px 12px;border:1px dashed var(--ink-2);border-radius:999px;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.kf{position:relative}
.kf--key{padding:20px 20px 18px;background:var(--white);border:1px solid var(--line-strong);border-top:3px solid var(--ox)}
.kf--key::before{content:"Core formula";display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ox);margin:0 0 14px}
.kf--muted .kc{opacity:.6}
.kf-tag,.kcmp-k,.kmod-k{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ox);margin:0 0 10px!important}
.doc figcaption{margin-top:10px;font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
@media (max-width:640px){
  .kf-row{flex-direction:column;align-items:flex-start;row-gap:0}
  .kf-row>li{flex-direction:column;align-items:flex-start}
  .kf-row>li:not(:last-child)::after{width:10px;height:16px;margin:3px 0 3px 14px;background-size:10px 16px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 16'%3E%3Cpath d='M5 0v13M1.5 9.5 5 13l3.5-3.5' fill='none' stroke='%238a877e' stroke-width='1.3'/%3E%3C/svg%3E")}
}

/* equations */
.keq{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.keq-l{font-family:var(--serif);font-weight:600;font-size:1.2rem;color:var(--ink)}
.keq-op{font-family:var(--serif);font-size:1.15rem;color:var(--ink-2);padding:0 2px}
.keq-eq{font-size:1.4rem;color:var(--ox)}
.keq sub{font-size:.65em}
.keq--key{padding:20px;background:var(--white);border:1px solid var(--line-strong);border-top:3px solid var(--ox)}

/* convergence (inputs + … → flow) */
.kconv-in{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.kconv-arrow{width:1.5px;height:26px;margin:10px 0 10px 22px;background:var(--ink-2);position:relative}
.kconv-arrow::after{content:"";position:absolute;left:-4px;bottom:-1px;border:5px solid transparent;border-top:6px solid var(--ink-2);border-bottom:0}

/* moderators */
.kmod{padding:14px 0;border-top:1px solid var(--line)}
.kmod-r{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.kmod-a{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;color:var(--ox)}
.kmod-a::before,.kmod-a::after{content:"";width:22px;height:1.5px;background:var(--ox)}
.kmod-a i{font-style:normal}

/* verification gate */
.kgate{display:grid;gap:12px}
.kgate-in{display:flex}
.kgate-box{border:1.5px solid var(--ink);background:var(--white);padding:16px 18px 6px;position:relative}
.kgate-box::before{content:"";position:absolute;top:-13px;left:26px;width:1.5px;height:12px;background:var(--ink-2)}
.kgate-t{font-family:var(--sans);font-weight:700;font-size:1rem;display:flex;align-items:center;gap:10px;margin:0 0 10px!important}
.kgate-ic{width:16px;height:16px;border:1.5px solid var(--ox);border-radius:50%;position:relative}
.kgate-ic::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid var(--ox);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.kgate-box ol{margin:0 0 10px!important;padding-left:1.4em!important;font-size:16px}
.kgate-out{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kgate-o{padding:14px 16px;border:1px solid var(--line-strong);border-top:3px solid var(--ph4);background:color-mix(in srgb,var(--ph4) 6%,var(--white))}
.kgate-o.hold{border-top-color:var(--ph2);background:color-mix(in srgb,var(--ph2) 6%,var(--white))}
.kgate-ot{font-family:var(--sans);font-weight:700;font-size:.95rem;margin-bottom:4px!important}
.kgate-o p:last-child{font-size:15.5px;color:var(--ink-2)}
@media (max-width:640px){.kgate-out{grid-template-columns:1fr}}

/* inverted-U */
.kcurve svg{width:100%;height:auto;display:block;background:var(--white);border:1px solid var(--line-strong)}
.kcv-zone{fill:color-mix(in srgb,var(--ph4) 10%,transparent)}
.kcv-zt{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;fill:var(--ph4);text-anchor:middle}
.kcv-ax{stroke:var(--ink);stroke-width:1.2}
.kcv-line{fill:none;stroke:var(--ox);stroke-width:2.5}
.kcv-pk{fill:var(--ox)}
.kcv-y,.kcv-x{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;fill:var(--ink-2)}
.kcv-y{writing-mode:initial}
.kcv-l{font-family:var(--serif);font-style:italic;font-size:13px;fill:var(--ink-2)}

/* memory record */
.krec{border:1px solid var(--line-strong);background:var(--white)}
.krec-t{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ph2);padding:12px 16px!important;border-bottom:1px solid var(--line)}
.krec dl{margin:0}
.krec dl div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;padding:11px 16px;border-bottom:1px solid var(--line)}
.krec dl div:last-child{border-bottom:0}
.krec dt{font-family:var(--mono);font-size:.78rem;color:var(--ox)}
.krec dd{margin:0;font-size:16px;color:var(--ink)}
.krec-s{display:inline-block;margin:2px 6px 2px 0;padding:3px 9px;font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;border:1px solid}
.krec-s.ok{color:var(--ph4)}.krec-s.due{color:var(--ph2)}.krec-s.exp{color:var(--ox)}
@media (max-width:560px){.krec dl div{grid-template-columns:1fr;gap:2px}}

/* meta-loop */
.kml{border:1.5px dashed var(--ox);padding:16px 18px 18px;background:color-mix(in srgb,var(--ox) 3%,transparent)}
.kml-t{font-family:var(--serif);font-style:italic;font-size:1.05rem;color:var(--ink);margin:0 0 14px!important}
.kml-t span{font-family:var(--mono);font-style:normal;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--paper);background:var(--ox);padding:3px 8px;margin-right:10px;vertical-align:2px}
.kml-base{border:1px solid var(--line-strong);background:var(--white);padding:14px}
.kml-leg{margin-top:10px!important;font-family:var(--sans);font-size:.82rem;color:var(--ink-2)}
.kf-row--sym>li:not(:last-child)::after{width:14px;background-size:14px 10px;margin:0 2px}
@media (max-width:640px){.kf-row--sym{flex-direction:row;flex-wrap:wrap;row-gap:8px}.kf-row--sym>li{flex-direction:row}.kf-row--sym>li:not(:last-child)::after{width:14px;height:10px;margin:0 2px;background-size:14px 10px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 10'%3E%3Cpath d='M0 5h19M15 1.5 19 5l-4 3.5' fill='none' stroke='%238a877e' stroke-width='1.3'/%3E%3C/svg%3E")}}

/* comparison, timeline, lineage */
.kcmp{display:grid;gap:16px}
.kcmp-r{padding-top:12px;border-top:1px solid var(--line)}
.ktl ol,.klin ol{list-style:none;margin:0!important;padding:0!important}
.ktl ol{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1.5px solid var(--ink)}
.ktl li{margin:0!important;padding:14px 14px 4px 0;position:relative;border-top:3px solid var(--c);margin-top:-2px!important}
.ktl-k{display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--c)}
.ktl-v{display:block;font-family:var(--sans);font-weight:600;font-size:.95rem;line-height:1.3;margin-top:4px}
@media (max-width:640px){.ktl ol{grid-template-columns:1fr 1fr;row-gap:12px}}
.klin li{display:flex;gap:16px;align-items:baseline;padding:9px 0 9px 22px!important;margin:0!important;position:relative;font-family:var(--sans);font-size:.98rem}
.klin li::before{content:"";position:absolute;left:4px;top:0;bottom:0;width:1.5px;background:var(--line-strong)}
.klin li::after{content:"";position:absolute;left:0;top:50%;width:9px;height:9px;margin-top:-4px;border-radius:50%;background:var(--paper);border:1.5px solid var(--ink-2)}
.klin li:first-child::before{top:50%}.klin li:last-child::before{bottom:50%}
.klin-n{font-family:var(--mono);font-size:.62rem;color:var(--faint);min-width:20px}
.klin li.kjm{font-weight:700;color:var(--ox)}
.klin li.kjm::after{background:var(--ox);border-color:var(--ox);width:11px;height:11px;margin-top:-5px;left:-1px}

/* tables & quotes: light, no black bands */
.doc table{border-top:1.5px solid var(--ink)}
.doc thead th{background:var(--paper-2);color:var(--ink);font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--line-strong)}
.doc tbody tr:nth-child(even){background:transparent}
.doc tbody tr:last-child{background:color-mix(in srgb,var(--ox) 7%,transparent)}
.doc tbody tr:last-child td{color:var(--ox)}
.doc blockquote{background:var(--white);border:1px solid var(--line);border-left:3px solid var(--ox);padding:14px 18px;font-size:19px}
.doc h4::before{background:currentColor;opacity:.6}

/* ---------- stage explorer ---------- */
.kx{max-width:var(--measure);margin:clamp(26px,4vh,44px) auto 0;padding:22px 0 0;border-top:1.5px solid var(--ink)}
.kx-eyebrow,.kblock-h p:first-child{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ox);margin:0 0 6px}
.kx-title{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(1.9rem,3.6vw,2.8rem);line-height:.95;margin:0 0 8px;border:0;padding:0}
.kx-sub{font-family:var(--serif);font-style:italic;color:var(--ink-2);font-size:1.05rem;margin:0 0 14px;max-width:52ch}
.kx-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(18px,3vw,36px);align-items:start}
.kr{width:100%;height:auto;display:block;overflow:visible}
.kr-track{fill:none;stroke:var(--line);stroke-width:1}
.kr-arc{fill:none;stroke:color-mix(in srgb,var(--c) 28%,transparent);stroke-width:4;stroke-linecap:round;transition:stroke .3s}
.kr-arc.done{stroke:var(--c)}
.kr-ret{stroke-dasharray:3 6;stroke-width:2.5}
.kr-node{cursor:pointer;outline:none}
.kr-hit{fill:transparent}
.kr-dot{fill:var(--white);stroke:var(--c);stroke-width:1.8;transition:fill .2s,stroke-width .2s}
.kr-sym{font-family:var(--serif);font-style:italic;font-weight:600;font-size:16px;text-anchor:middle;fill:var(--c);pointer-events:none;transition:fill .2s}
.kr-lab{font-family:var(--sans);font-size:12px;font-weight:500;fill:var(--ink-2);pointer-events:none}
.kr-node:hover .kr-dot,.kr-node:focus-visible .kr-dot{stroke-width:3}
.kr-node.done .kr-dot{fill:color-mix(in srgb,var(--c) 14%,var(--white))}
.kr-node.on .kr-dot{fill:var(--c);stroke-width:3}
.kr-node.on .kr-sym{fill:var(--white)}
.kr-node.on .kr-lab{fill:var(--ink);font-weight:700}
.kr-c1{font-family:var(--display);font-size:46px;text-anchor:middle;fill:var(--ink)}
.kr-c2{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;text-anchor:middle;fill:var(--ink-2)}
.kr-c3{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-anchor:middle;fill:var(--ox)}
.kx-panel{border:1px solid var(--line-strong);background:var(--white)}
.kx-list{list-style:none;margin:0;padding:0}
.kx-st{padding:20px 22px 18px;border-top:4px solid var(--c);border-bottom:1px solid var(--line)}
.kx-st:last-child{border-bottom:0}
.kx.js .kx-st{display:none;border-bottom:0}
.kx.js .kx-st.on{display:block;animation:kxIn .25s ease}
@keyframes kxIn{from{opacity:0}to{opacity:1}}
.kx-k{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 10px;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);margin:0 0 10px}
.kx-p{color:var(--c)}
.kx-h{display:flex;align-items:center;gap:12px;font-family:var(--sans)!important;font-weight:700!important;font-size:1.5rem!important;letter-spacing:-.015em;margin:0 0 8px!important;line-height:1.15!important}
.kx-sym{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--c);color:var(--white);font-family:var(--serif);font-style:italic;font-weight:600;font-size:1.05rem;flex:none}
.kx-lead{font-size:17.5px;line-height:1.55;color:var(--ink);margin:0 0 6px!important}
.kx-l{font-size:15.5px;color:var(--ink-2);margin:0 0 6px!important}
.kx-q{margin:10px 0 0!important;padding:10px 14px!important;font-size:16.5px!important;border-left-color:var(--c)!important}
.kx-chips{list-style:none;margin:12px 0 0!important;padding:0!important;display:flex;flex-wrap:wrap;gap:6px}
.kx-chips li{margin:0!important;padding:4px 10px!important;font-family:var(--sans);font-size:.8rem;color:var(--ink);background:color-mix(in srgb,var(--c) 8%,var(--white));border:1px solid color-mix(in srgb,var(--c) 25%,transparent)}
.kx-chips li::marker{content:none}
.kx-nav{display:flex;align-items:center;gap:10px;padding:12px 14px;border-top:1px solid var(--line)}
.kx-nav button.kx-prev,.kx-nav button.kx-next{width:36px;height:36px;border-radius:50%;border:1.5px solid var(--ink);background:none;font-size:15px;cursor:pointer;color:var(--ink);flex:none}
.kx-nav button.kx-prev:hover,.kx-nav button.kx-next:hover{background:var(--ink);color:var(--paper)}
.kx-bars{flex:1;display:grid;grid-template-columns:repeat(10,1fr);gap:4px}
.kx-bar{height:6px;border:0;padding:0;cursor:pointer;background:color-mix(in srgb,var(--c) 22%,transparent)}
.kx-bar.done,.kx-bar.on{background:var(--c)}
.kx-bar.on{height:10px}
@media (max-width:1100px){.kx-grid{grid-template-columns:1fr}.kx-ring{max-width:440px;margin:0 auto;width:100%}}

/* phases + safeguards */
.kps,.ksg{max-width:var(--measure);margin:clamp(30px,5vh,50px) auto 0}
.kblock-h{display:flex;justify-content:space-between;align-items:end;gap:16px;padding-bottom:10px;border-bottom:1.5px solid var(--ink);margin-bottom:0}
.kblock-h h2{font-family:var(--display)!important;font-weight:400!important;text-transform:uppercase;font-size:clamp(1.7rem,3vw,2.3rem)!important;line-height:.95!important;margin:0!important;padding:0!important;border:0!important}
.kblock-h p{font-family:var(--serif);font-style:italic;color:var(--ink-2);font-size:.98rem;margin:0;text-align:right;max-width:30ch}
.kps-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.kp{padding:18px 18px 18px 0;border-bottom:1px solid var(--line)}
.kp:nth-child(even){padding-left:18px;border-left:1px solid var(--line)}
.kp-n{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c);margin:0 0 4px}
.kp h3{font-family:var(--sans)!important;font-weight:700!important;font-size:1.2rem!important;margin:0 0 6px!important;color:var(--ink)}
.kp h3::before{content:"";display:inline-block;width:10px;height:10px;background:var(--c);margin-right:8px;vertical-align:1px}
.kp-d{font-size:15.5px;line-height:1.5;color:var(--ink-2);margin:0 0 12px}
.kp-d b{color:var(--ink);font-weight:600}
.kp-st{display:flex;flex-wrap:wrap;gap:6px}
.kp-st .kc{font-size:.8rem;padding:5px 9px 5px 8px}
.ksg-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.ksg-c{display:flex;flex-direction:column;gap:8px;padding:18px 18px 20px 0;border:0;border-bottom:1px solid var(--line);color:var(--ink)}
.ksg-c+.ksg-c{padding-left:18px;border-left:1px solid var(--line)}
.ksg-n{font-family:var(--display);font-size:2rem;line-height:1;color:var(--ox)}
.ksg-c h3{font-family:var(--sans)!important;font-weight:700!important;font-size:1.05rem!important;margin:0!important}
.ksg-c p{font-size:15px;line-height:1.5;color:var(--ink-2);margin:0}
.ksg-a{margin-top:auto;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ox)}
.ksg-c:hover h3{color:var(--ox)}
@media (max-width:760px){.kps-grid,.ksg-grid{grid-template-columns:1fr}.kp:nth-child(even),.ksg-c+.ksg-c{padding-left:0;border-left:0}.kblock-h{flex-direction:column;align-items:flex-start}.kblock-h p{text-align:left}}
.doc{margin-top:clamp(40px,7vh,70px)}

.kx-k span{white-space:nowrap}
