:root{--ink:#17272e;--navy:#173b4b;--teal:#187b7d;--amber:#b65a13;--paper:#f3f0e7;--card:#fbfaf5;--line:#d8d6cd;--muted:#68767b;--red:#b83b32;--shadow:0 18px 55px rgba(27,40,44,.08)}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.topbar{height:76px;padding:0 clamp(24px,4vw,64px);display:flex;align-items:center;gap:15px;border-bottom:1px solid rgba(23,39,46,.16);background:#f9f7f0}.topbar h1{font:650 19px/1.15 Georgia,serif;margin:2px 0}.subtitle{margin-left:auto;color:var(--muted);font-size:13px}.brand-mark{width:42px;height:42px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;gap:3px}.brand-mark span{display:block;width:3px;background:#fff;border-radius:2px;transform:rotate(-22deg)}.brand-mark span:nth-child(1){height:13px}.brand-mark span:nth-child(2){height:23px}.brand-mark span:nth-child(3){height:17px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.18em;margin:0;color:#a8d1d2}.eyebrow.amber{color:var(--amber)}main{max-width:1540px;margin:auto;padding:28px clamp(20px,3.2vw,48px) 42px}.intro{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:25px}.intro h2{font:600 clamp(29px,3vw,46px)/1.06 Georgia,serif;letter-spacing:-.025em;max-width:750px;margin:8px 0 0}.steps{display:flex;gap:8px;flex-wrap:wrap}.steps span{font-size:11px;font-weight:700;border:1px solid rgba(23,39,46,.17);border-radius:20px;padding:9px 14px;color:var(--muted)}.steps .active{background:var(--navy);color:#fff;border-color:var(--navy)}.controls{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:12px;background:var(--card);border:1px solid rgba(23,39,46,.15);border-radius:15px;padding:15px;box-shadow:var(--shadow);margin-bottom:18px}.controls label>span{display:block;font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin:0 0 7px 2px}.controls select{width:100%;height:44px;border-radius:9px;border:1px solid rgba(23,39,46,.16);background:#fff;padding:0 12px;color:var(--ink);font-weight:650}.controls button,.detail-card button{border:0;border-radius:9px;background:var(--amber);color:#fff;font-weight:750;padding:0 21px;cursor:pointer}.controls button{height:44px;align-self:end}.controls button:hover,.detail-card button:not(:disabled):hover{background:#91400b}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:18px}.chart-card,.detail-card,.note-card{background:var(--card);border:1px solid rgba(23,39,46,.15);border-radius:15px}.chart-card{overflow:hidden}.card-head{min-height:70px;border-bottom:1px solid rgba(23,39,46,.1);padding:15px 20px;display:flex;justify-content:space-between;align-items:center;gap:18px}.card-head h3,.detail-card h3{margin:0;font:650 18px/1.2 Georgia,serif}.card-head p{margin:5px 0 0;color:var(--muted);font-size:11px}.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:10px;font-weight:700;color:var(--muted)}.legend span{display:flex;align-items:center;gap:6px}.legend i{display:inline-block;width:17px;height:3px;border-radius:2px}.legend .front{background:var(--red)}.legend .tail{background:var(--teal)}.legend .onset{height:8px;width:8px;background:var(--amber);border-radius:50%}.canvas-wrap{position:relative;height:min(58vh,620px);min-height:430px;padding:8px}canvas{display:block;width:100%;height:100%;cursor:crosshair}#tooltip{position:absolute;display:none;pointer-events:none;background:#17272e;color:#fff;border-radius:7px;padding:7px 9px;font-size:10px;box-shadow:0 8px 25px rgba(0,0,0,.2)}.chart-foot{display:flex;justify-content:space-between;padding:11px 20px;border-top:1px solid rgba(23,39,46,.1);font-size:10px;color:var(--muted)}.side-panel{display:flex;flex-direction:column;gap:13px}.metric-card{border-radius:15px;padding:19px}.metric-card.dark{background:var(--navy);color:#fff}.metric-card strong{display:block;font:600 49px/1 Georgia,serif;margin:12px 0 7px}.metric-card>span{font-size:11px;line-height:1.5;color:#d4e3e5}.detail-card{padding:19px}.detail-card h3{margin-top:8px}.detail-card>p:not(.eyebrow){font-size:11px;line-height:1.5;color:var(--muted);min-height:34px}.detail-card dl{margin:14px 0}.detail-card dl div{display:flex;justify-content:space-between;gap:10px;border-top:1px solid rgba(23,39,46,.1);padding:8px 0;font-size:11px}.detail-card dt{color:var(--muted)}.detail-card dd{margin:0;font-weight:750}.detail-card button{width:100%;min-height:40px}.detail-card button:disabled{background:#d8d6cd;color:#858d8f;cursor:not-allowed}.note-card{padding:17px}.note-card .eyebrow{color:var(--muted)}.note-card>p:last-child{font-size:11px;line-height:1.55;margin:9px 0 0;color:var(--muted)}.method-strip{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:15px;align-items:center;margin-top:18px;padding:17px 19px;border-top:1px solid rgba(23,39,46,.17);border-bottom:1px solid rgba(23,39,46,.17)}.method-strip div{display:flex;gap:11px;align-items:flex-start}.method-strip div>span{font:700 18px Georgia,serif;color:var(--amber)}.method-strip p{margin:0;font-size:10px;color:var(--muted);line-height:1.4}.method-strip strong{display:block;color:var(--ink);font-size:11px}.method-strip>b{font-weight:400;color:#9da4a4}.method-strip .future{opacity:.55}
.parameter-panel{display:grid;grid-template-columns:minmax(330px,.8fr) 1.2fr;gap:20px;background:#e8e4d9;border:1px solid rgba(23,39,46,.13);border-radius:15px;padding:17px 19px;margin:-6px 0 18px}.parameter-title{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.parameter-title h3{font:650 17px Georgia,serif;margin:5px 0}.parameter-title output{font-size:12px;color:var(--muted);white-space:nowrap}.parameter-title output strong{font:650 27px Georgia,serif;color:var(--ink)}.parameter-title output span{display:block;text-align:right;font-size:10px}.slider-block input{width:100%;accent-color:var(--amber);cursor:pointer}.range-labels{display:flex;justify-content:space-between;font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}#speed-message{font-size:10px;color:var(--muted);margin:8px 0 0}.diagnostics{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.diagnostics div{background:var(--card);border:1px solid rgba(23,39,46,.1);border-radius:10px;padding:11px}.diagnostics span,.diagnostics small{display:block;font-size:9px;color:var(--muted)}.diagnostics span{text-transform:uppercase;letter-spacing:.08em;font-weight:750}.diagnostics strong{display:block;font:650 22px Georgia,serif;margin:8px 0 3px}
.advanced-settings{grid-column:1/-1;border-top:1px solid rgba(23,39,46,.12);padding-top:11px}.advanced-settings summary{cursor:pointer;font-size:11px;font-weight:750;color:var(--ink)}.advanced-settings>div{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:11px}.advanced-settings label{font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.advanced-settings input{box-sizing:border-box;width:100%;margin-top:5px;border:1px solid rgba(23,39,46,.12);border-radius:7px;padding:7px;background:#f7f4ed;color:var(--ink)}.advanced-settings p{font-size:10px;color:var(--muted);margin:8px 0 0}
@media(max-width:950px){.subtitle{display:none}.intro{align-items:flex-start;flex-direction:column}.controls{grid-template-columns:1fr 1fr}.parameter-panel{grid-template-columns:1fr}.advanced-settings>div{grid-template-columns:1fr 1fr}.workspace{grid-template-columns:1fr}.side-panel{display:grid;grid-template-columns:1fr 1.5fr 1fr}.canvas-wrap{height:500px}.method-strip{grid-template-columns:1fr 1fr}.method-strip>b{display:none}}
@media(max-width:620px){.topbar{padding:0 18px}.topbar h1{font-size:16px}main{padding:22px 14px}.controls{grid-template-columns:1fr}.diagnostics{grid-template-columns:1fr 1fr}.steps span{font-size:10px;padding:7px 10px}.card-head{align-items:flex-start;flex-direction:column}.canvas-wrap{height:430px}.side-panel{display:flex}.method-strip{grid-template-columns:1fr}.chart-foot{gap:8px;flex-direction:column}}

html{scroll-behavior:smooth}.steps a{font-size:11px;font-weight:700;border:1px solid rgba(23,39,46,.17);border-radius:20px;padding:9px 14px;color:var(--muted);text-decoration:none}.steps .ready{background:#fff;color:var(--amber);border-color:rgba(182,90,19,.35)}.steps .inactive{opacity:.45}
.onset-section{margin-top:48px;padding-top:30px;border-top:2px solid var(--navy)}.section-heading{display:flex;justify-content:space-between;gap:25px;align-items:flex-end;margin-bottom:18px}.section-heading h2{font:600 30px/1.1 Georgia,serif;margin:7px 0}.section-heading>div>p:last-child{max-width:740px;color:var(--muted);font-size:12px;line-height:1.5;margin:0}.onset-status{min-width:245px;background:var(--navy);color:#fff;border-radius:12px;padding:14px 17px}.onset-status span,.onset-status strong{display:block}.onset-status span{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:#acd4d5}.onset-status strong{font:600 14px Georgia,serif;margin-top:5px}.onset-grid{display:grid;grid-template-columns:310px minmax(0,1fr);gap:18px}.window-controls,.trajectory-card{background:var(--card);border:1px solid rgba(23,39,46,.15);border-radius:15px}.window-controls{padding:18px}.window-presets{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:18px}.window-presets button{border:1px solid rgba(23,39,46,.16);background:#fff;border-radius:7px;padding:7px;color:var(--muted);cursor:pointer;font-weight:650}.window-presets button.selected{background:var(--navy);color:#fff}.window-controls>label{display:block;margin:15px 0}.window-controls label span{display:flex;justify-content:space-between;font-size:11px;font-weight:700}.window-controls output{color:var(--amber)}.window-controls input{width:100%;margin-top:9px;accent-color:var(--amber)}.window-summary{border-top:1px solid rgba(23,39,46,.12);padding-top:14px;margin-top:18px}.window-summary span,.window-summary small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.09em}.window-summary strong{display:block;font:650 19px Georgia,serif;margin:6px 0}.window-summary small{line-height:1.5;text-transform:none;letter-spacing:0}.window-controls>button{width:100%;border:0;border-radius:9px;background:var(--amber);color:#fff;font-weight:750;padding:12px;margin-top:16px;cursor:pointer}.window-controls>button:disabled{background:#d8d6cd;color:#858d8f;cursor:not-allowed}.trajectory-card{overflow:hidden}.data-badge{font-size:9px;text-transform:uppercase;letter-spacing:.08em;border-radius:20px;padding:7px 10px}.data-badge.waiting{color:#8c5b17;background:#f5e8c8}.trajectory-wrap{position:relative;height:390px;padding:8px;background:#fffdf8}.empty-trajectory{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;color:var(--muted);pointer-events:none}.empty-trajectory strong{font:650 18px Georgia,serif;color:var(--ink);margin-bottom:8px}.empty-trajectory span{font-size:11px;max-width:440px;line-height:1.5}.trajectory-foot{display:flex;justify-content:space-between;gap:15px;padding:11px 18px;border-top:1px solid rgba(23,39,46,.1);font-size:10px;color:var(--muted)}.method-note{font-size:11px;color:var(--muted);line-height:1.55;margin:13px 3px 0}.method-note strong{color:var(--ink)}
@media(max-width:950px){.onset-grid{grid-template-columns:1fr}.window-controls{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.window-presets,.window-summary,.window-controls>button{grid-column:1/-1}}
@media(max-width:620px){.steps a{font-size:10px;padding:7px 10px}.section-heading{align-items:stretch;flex-direction:column}.onset-status{min-width:0}.window-controls{display:block}.trajectory-foot{flex-direction:column}.trajectory-wrap{height:330px}}
.trajectory-toolbar{display:grid;grid-template-columns:220px 175px minmax(330px,1fr);gap:12px;align-items:end;padding:12px 18px;border-bottom:1px solid rgba(23,39,46,.1);background:#f4f1e9}.trajectory-toolbar label>span{display:block;margin:0 0 5px 2px;font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}.trajectory-toolbar select{width:100%;height:36px;border:1px solid rgba(23,39,46,.16);border-radius:8px;background:#fff;padding:0 9px;color:var(--ink);font-weight:650}.view-tabs{display:flex;justify-content:flex-end;gap:5px;flex-wrap:wrap}.view-tabs button{height:36px;border:1px solid rgba(23,39,46,.16);border-radius:8px;background:#fff;padding:0 11px;color:var(--muted);font-weight:700;cursor:pointer}.view-tabs button.active{background:var(--navy);border-color:var(--navy);color:#fff}
@media(max-width:1100px){.trajectory-toolbar{grid-template-columns:1fr 1fr}.view-tabs{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:620px){.trajectory-toolbar{grid-template-columns:1fr}.view-tabs{grid-column:auto}.view-tabs button{flex:1 1 auto}.trajectory-wrap{height:380px}}
.trajectory-toolbar{grid-template-columns:minmax(290px,.8fr) minmax(430px,1.2fr);align-items:end;padding:14px 18px}.direction-control>span,.variable-control>span{display:block;margin-bottom:7px;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}.direction-control>small{display:block;margin-top:7px;color:var(--muted);font-size:11px}.direction-buttons{display:flex;gap:6px;flex-wrap:wrap}.direction-buttons button{min-height:38px;border:1px solid rgba(23,39,46,.16);background:#fff;color:var(--muted);border-radius:8px;padding:7px 12px;font-weight:750;cursor:pointer}.direction-buttons button.active{background:var(--navy);border-color:var(--navy);color:#fff}.direction-buttons small{display:block;font-size:9px;font-weight:600;opacity:.72}.variable-control .view-tabs{justify-content:flex-start}.variable-control .view-tabs button{min-width:76px}.view-tabs button.active{box-shadow:0 0 0 2px rgba(182,90,19,.18)}@media(max-width:950px){.trajectory-toolbar{grid-template-columns:1fr}}
.view-legend{display:flex;align-items:center;gap:16px;min-height:42px;padding:8px 18px;border-top:1px solid rgba(23,39,46,.08);border-bottom:1px solid rgba(23,39,46,.1);background:#fbfaf5;color:var(--muted);font-size:12px;flex-wrap:wrap}.view-legend strong{color:var(--ink);font-size:12px}.view-legend span{display:flex;align-items:center;gap:7px}.view-legend i{display:inline-block;flex:none}.legend-line{width:24px;height:3px;border-radius:2px}.legend-area{width:18px;height:12px;border:1px dashed var(--amber)}.neutral{background:#536d77;opacity:.55}.amber-area{background:rgba(255,176,0,.16)}.lost{background:#b83b32}.overlap{background:#cf7220}.unflagged{background:#7f9298}.context{background:#c2cbd0}.inside{background:#173b4b}.gap-symbol{width:24px;height:3px;background:repeating-linear-gradient(90deg,#9ca8ad 0 4px,transparent 4px 8px)}
.window-controls .view-legend{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:18px;padding:16px 0 0;border-top:1px solid rgba(23,39,46,.12);border-bottom:0;background:transparent}.window-controls .view-legend strong{font-size:11px;text-transform:uppercase;letter-spacing:.1em}.window-controls .view-legend span{line-height:1.35}
.direction-fixed{display:flex;align-items:center;gap:10px;min-height:40px;padding:8px 12px;border:1px solid rgba(23,59,75,.18);border-radius:8px;background:#e7eff0;color:var(--navy);font-size:12px}.direction-fixed b{font:700 18px Georgia,serif}.direction-fixed strong{padding-left:10px;border-left:1px solid rgba(23,59,75,.2)}.direction-fixed small{margin-left:auto;color:var(--muted);font-size:10px}

/* Part 01 legend: component colours identify waves, not topology clusters. */
.legend .component{background:linear-gradient(90deg,#1f5f76 0 25%,#cf7220 25% 50%,#6379ba 50% 75%,#9b4b67 75%)}
.component-key{display:flex;flex-direction:column;gap:10px}
.component-key .key-row{display:grid;grid-template-columns:24px 1fr;gap:9px;align-items:start;color:var(--muted);font-size:11px;line-height:1.4}
.component-key .key-row strong{color:var(--ink)}
.component-key i{display:inline-block;margin-top:6px}
.tail-line{width:24px;height:3px;border-radius:2px;background:var(--teal)}
.selected-line{width:24px;height:4px;border-radius:2px;background:#0b1720}
.onset-dot{width:9px;height:9px;border-radius:50%;background:var(--amber);margin-left:7px!important;margin-top:3px!important}