.path-scroll{overflow-x:auto;border-radius:16px}.path-diagram{position:relative;min-width:760px}.path-diagram .result-topology{display:block;width:100%;margin:0}.path-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.path-caption{margin-top:16px;padding:20px;border:1px solid #b45309;border-radius:14px;background:var(--panel,#0d1b2a)}.path-caption h3{margin:0 0 10px}.path-caption p{line-height:1.8;margin:0 0 12px}#fdb-timeline table,#verification-map table{width:100%;min-width:650px;border-collapse:collapse}#fdb-timeline th,#fdb-timeline td,#verification-map th,#verification-map td{padding:16px;text-align:left;border-bottom:1px solid var(--line,#223a54);line-height:1.8}#path-controls button:focus-visible{outline:3px solid #b45309;outline-offset:3px}#capture-meaning p{line-height:1.9}
.path-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.path-facts article{background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--mint);border-radius:12px;padding:18px}.path-facts span{color:var(--mint);font-size:.85rem}.path-facts h3{font-size:1.05rem;overflow-wrap:anywhere;margin:10px 0}.path-facts p,.path-observer p{color:var(--muted);margin:8px 0;line-height:1.7}.path-observer{padding:16px;border-left:3px solid var(--amber);margin-top:12px}.path-caption a{display:inline-block;margin:8px 16px 0 0}#path-controls button{border-radius:12px;text-align:left;line-height:1.6}#path-controls small{color:var(--muted)}#learning-steps[hidden]{display:none}.path-facts+[class=path-scroll]{border:1px solid var(--line)}@media(max-width:700px){.path-facts{grid-template-columns:1fr;gap:8px}.path-facts article{padding:12px 16px}.path-facts h3{margin:5px 0}#path-controls{display:grid;grid-template-columns:1fr;width:100%}#path-controls button{width:100%}.path-diagram{min-width:680px}}


/* Learning-first additions */
.frame-anatomy{margin:20px 0;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.frame-anatomy-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:16px}
.frame-anatomy-head h3{margin:6px 0 0}
.frame-anatomy-head p{max-width:560px;margin:0;color:var(--muted);line-height:1.7}
.frame-fields{display:grid;grid-template-columns:1.2fr 1.2fr .9fr 1.1fr;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.frame-field{min-width:0;padding:16px;border-right:1px solid var(--line);background:rgba(255,255,255,.02)}
.frame-field:last-child{border-right:0}
.frame-field small,.frame-field span{display:block;color:var(--muted)}
.frame-field small{font-size:.78rem;letter-spacing:.04em;text-transform:uppercase}
.frame-field strong{display:block;margin:7px 0;font-size:1rem;overflow-wrap:anywhere}
.frame-field span{font-size:.85rem;line-height:1.55}
.frame-dst{box-shadow:inset 0 3px 0 var(--amber)}
.frame-src{box-shadow:inset 0 3px 0 var(--mint)}
.practice-note{margin-top:16px}

.lab-scope{margin:14px 0 18px;padding:14px 16px;border:1px dashed var(--line);border-radius:12px;color:var(--muted);line-height:1.75}
.lab-scope b{color:inherit}

.prediction-card{margin:20px 0;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.prediction-card h3{margin:8px 0 10px}
.prediction-card>p{color:var(--muted);line-height:1.8}
.prediction-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.prediction-actions button{padding:11px 18px;border:1px solid var(--line);border-radius:10px;background:transparent;color:inherit;cursor:pointer;font:inherit;font-weight:700}
.prediction-actions button[aria-pressed="true"]{border-color:var(--mint);box-shadow:0 0 0 2px rgba(107,224,192,.15)}
.prediction-actions button:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.prediction-result{margin-top:14px;padding:14px 16px;border-radius:10px;line-height:1.75}
.prediction-result[data-state="correct"]{border-left:3px solid var(--mint);background:rgba(107,224,192,.08)}
.prediction-result[data-state="review"]{border-left:3px solid var(--amber);background:rgba(180,83,9,.08)}
.prediction-result a{display:inline-block;margin-left:6px}

.mobile-path-flow{display:none}
.mobile-flow-node{padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.mobile-flow-node small{display:block;color:var(--muted);font-size:.75rem;letter-spacing:.05em}
.mobile-flow-node strong{display:block;margin-top:5px}
.mobile-flow-arrow{text-align:center;color:var(--mint);font-size:1.35rem;font-weight:800}
.mobile-flow-branches{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mobile-path-flow>p{margin:4px 0 0;color:var(--muted);font-size:.88rem;line-height:1.6}
.mobile-flow-node.switch{border-color:var(--mint)}

@media(max-width:700px){
 .frame-anatomy{padding:14px}
 .frame-anatomy-head{display:block}
 .frame-anatomy-head p{margin-top:10px}
 .frame-fields{grid-template-columns:1fr 1fr}
 .frame-field{border-right:0;border-bottom:1px solid var(--line)}
 .frame-field:nth-child(odd){border-right:1px solid var(--line)}
 .frame-field:nth-last-child(-n+2){border-bottom:0}
 .prediction-card{padding:16px}
 .prediction-actions{display:grid;grid-template-columns:1fr 1fr}
 .prediction-actions button{width:100%}
 .mobile-path-flow{display:grid;gap:8px;margin:14px 0 12px}
 .path-scroll{margin-top:10px}
 .path-diagram{min-width:620px}
}

@media(max-width:420px){
 .frame-fields{grid-template-columns:1fr}
 .frame-field,.frame-field:nth-child(odd){border-right:0;border-bottom:1px solid var(--line)}
 .frame-field:last-child{border-bottom:0}
 .mobile-flow-branches{grid-template-columns:1fr}
}


/* First ping timeline + practical extension */
.first-ping-lab{margin:22px 0 28px;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.first-ping-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-end}
.first-ping-head h3{margin:6px 0 0}
.timeline-actions{display:flex;gap:8px;flex-wrap:wrap}
.timeline-actions button,.timeline-steps button{border:1px solid var(--line);background:transparent;color:inherit;border-radius:10px;cursor:pointer;font:inherit}
.timeline-actions button{padding:10px 14px;font-weight:700}
.timeline-actions button:hover,.timeline-steps button:hover{border-color:var(--mint)}
.timeline-actions button:focus-visible,.timeline-steps button:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.timeline-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:18px 0 10px}
.timeline-steps button{display:flex;align-items:center;gap:8px;padding:10px 12px;text-align:left}
.timeline-steps button span{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border-radius:50%;border:1px solid var(--line);font-weight:800}
.timeline-steps button[aria-pressed="true"]{border-color:var(--mint);background:rgba(107,224,192,.06)}
.timeline-steps button[aria-pressed="true"] span{border-color:var(--mint)}
.timeline-progress{height:4px;background:rgba(255,255,255,.08);border-radius:999px;overflow:hidden;margin:0 2px 18px}
.timeline-progress span{display:block;width:0;height:100%;background:var(--mint);transition:width .35s ease}
.timeline-scene{display:grid;gap:12px}
.timeline-event{padding:18px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}
.timeline-event small{color:var(--mint);font-weight:800;letter-spacing:.04em}
.timeline-event h4{margin:7px 0 8px;font-size:1.08rem}
.timeline-event p{margin:0;color:var(--muted);line-height:1.75}
.timeline-frame{margin-top:14px;padding:12px 14px;border:1px dashed var(--line);border-radius:10px;font-family:Consolas,monospace;overflow-wrap:anywhere}
.timeline-state-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.timeline-state-grid article{padding:16px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.018)}
.timeline-state-grid small{display:block;color:var(--muted);font-size:.75rem;letter-spacing:.05em}
.timeline-state-grid strong{display:block;margin:7px 0;overflow-wrap:anywhere}
.timeline-state-grid p{margin:0;color:var(--muted);line-height:1.65;font-size:.9rem}

.practical-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}
.practical-card{padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.practical-card h3{margin:10px 0}
.practical-card>p{color:var(--muted);line-height:1.78}
.practical-fdb{display:grid;gap:8px;margin:14px 0;padding:14px;border:1px dashed var(--line);border-radius:10px}
.practical-fdb code{overflow-wrap:anywhere}
.practical-fdb span{font-size:.82rem;color:var(--muted)}
.flap-flow{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:14px 0;padding:16px;border:1px dashed var(--line);border-radius:10px}
.flap-flow b{color:var(--amber);font-size:1.15rem}
.trunk-visual{display:grid;gap:10px;margin:14px 0;padding:14px;border:1px dashed var(--line);border-radius:10px;text-align:center}
.trunk-visual>div{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.trunk-visual span{padding:5px 8px;border:1px solid var(--line);border-radius:8px;font-size:.82rem}
.trunk-visual b{color:var(--muted);font-size:.9rem}
.practical-table table{width:100%;min-width:700px;border-collapse:collapse}
.practical-table th,.practical-table td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line);line-height:1.7}

@media(max-width:900px){
 .timeline-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
 .timeline-state-grid{grid-template-columns:1fr}
 .practical-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
 .first-ping-lab{padding:15px}
 .first-ping-head{display:block}
 .timeline-actions{margin-top:12px}
 .timeline-actions button{flex:1}
 .timeline-steps{grid-template-columns:1fr 1fr}
 .timeline-steps button:last-child{grid-column:1/-1}
}
@media(max-width:420px){
 .timeline-steps{grid-template-columns:1fr}
 .timeline-steps button:last-child{grid-column:auto}
}


/* Operator troubleshooting drills */
.drill-summary{display:grid;grid-template-columns:auto auto 1fr;gap:10px;align-items:stretch;margin:18px 0}
.drill-summary>div,.drill-summary>button{padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.drill-summary small{display:block;color:var(--muted);font-size:.76rem;letter-spacing:.05em}
.drill-summary strong{display:block;margin-top:4px;font-size:1.05rem}
.drill-summary>button{justify-self:end;color:inherit;cursor:pointer;font:inherit;font-weight:700}
.drill-summary>button:hover{border-color:var(--mint)}
.drill-summary>button:focus-visible{outline:3px solid var(--amber);outline-offset:3px}

.operator-drills{display:grid;gap:14px}
.drill-card{padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--panel);transition:border-color .2s ease,box-shadow .2s ease}
.drill-card[data-result="correct"]{border-color:rgba(107,224,192,.55)}
.drill-card[data-result="review"]{border-color:rgba(180,83,9,.55)}
.drill-head{display:flex;gap:12px;align-items:flex-start}
.drill-number{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;font-weight:800}
.drill-head small{color:var(--mint);font-size:.76rem;letter-spacing:.06em;font-weight:800}
.drill-head h3{margin:5px 0 0}
.drill-console{display:grid;gap:5px;margin:15px 0;padding:14px 16px;border:1px dashed var(--line);border-radius:10px;background:rgba(0,0,0,.08)}
.drill-console code{white-space:normal;overflow-wrap:anywhere}
.drill-question{margin:14px 0 10px;font-weight:700}
.drill-options{display:grid;gap:8px}
.drill-options button{padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:transparent;color:inherit;text-align:left;line-height:1.6;cursor:pointer;font:inherit}
.drill-options button:hover:not(:disabled){border-color:var(--mint)}
.drill-options button:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.drill-options button:disabled{cursor:default;opacity:.78}
.drill-options button.answer-correct{border-color:rgba(107,224,192,.65)}
.drill-options button.selected-correct{background:rgba(107,224,192,.09);opacity:1}
.drill-options button.selected-wrong{border-color:rgba(180,83,9,.72);background:rgba(180,83,9,.08);opacity:1}
.drill-feedback{margin-top:14px;padding:15px 16px;border-left:3px solid var(--line);border-radius:0 10px 10px 0;background:rgba(255,255,255,.025)}
.drill-feedback p{margin:8px 0 0;line-height:1.75}
.drill-feedback .drill-check{color:var(--muted)}
.drill-result{display:block}
.drill-result[data-state="correct"]{color:var(--mint)}
.drill-result[data-state="review"]{color:var(--amber)}
.drill-finish{margin:18px 0;padding:18px;border:1px solid var(--mint);border-radius:14px;background:rgba(107,224,192,.05)}
.drill-finish h3{margin:7px 0}
.drill-finish p{margin:0;color:var(--muted);line-height:1.75}

@media(max-width:700px){
 .drill-summary{grid-template-columns:1fr 1fr}
 .drill-summary>button{grid-column:1/-1;justify-self:stretch}
 .drill-card{padding:15px}
 .drill-head{gap:10px}
 .drill-number{flex-basis:36px;width:36px;height:36px;font-size:.9rem}
}


/* CLI troubleshooting workflow */
.cli-scenario{margin:18px 0;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.cli-scenario h3{margin:10px 0 8px}
.cli-scenario p{margin:0;color:var(--muted);line-height:1.75}

.cli-workflow-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:14px;align-items:start}
.cli-stepper{display:grid;gap:8px;position:sticky;top:82px}
.cli-stepper button{display:grid;grid-template-columns:34px 1fr;column-gap:10px;row-gap:2px;align-items:center;padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:inherit;text-align:left;cursor:pointer;font:inherit}
.cli-stepper button>span{grid-row:1/3;display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--line);border-radius:50%;font-weight:800}
.cli-stepper button>b{font-size:.94rem}
.cli-stepper button>small{color:var(--muted);font-size:.76rem}
.cli-stepper button:hover{border-color:var(--mint)}
.cli-stepper button[aria-pressed="true"]{border-color:var(--mint);background:rgba(107,224,192,.06)}
.cli-stepper button[aria-pressed="true"]>span{border-color:var(--mint)}
.cli-stepper button:focus-visible{outline:3px solid var(--amber);outline-offset:3px}

.cli-panel{padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.cli-panel-head{display:grid;gap:12px}
.cli-panel-head small{color:var(--mint);font-weight:800;letter-spacing:.05em}
.cli-panel-head h3{margin:6px 0 0}
.cli-progress{height:4px;background:rgba(255,255,255,.08);border-radius:999px;overflow:hidden}
.cli-progress span{display:block;width:14.28%;height:100%;background:var(--mint);transition:width .25s ease}

.cli-evidence-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
.cli-evidence-grid article{padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02)}
.cli-evidence-grid small,.cli-judgement small{display:block;color:var(--muted);font-size:.74rem;letter-spacing:.05em}
.cli-evidence-grid strong{display:block;margin:6px 0;overflow-wrap:anywhere}
.cli-evidence-grid p{margin:0;color:var(--muted);line-height:1.65;font-size:.9rem}

.cli-command-area{margin:14px 0}
.cli-command-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.cli-command-tabs button{padding:8px 12px;border:1px solid var(--line);border-radius:9px;background:transparent;color:inherit;cursor:pointer;font:inherit;font-weight:700}
.cli-command-tabs button[aria-pressed="true"]{border-color:var(--mint);background:rgba(107,224,192,.06)}
.cli-command-tabs button:focus-visible,#cli-copy-command:focus-visible,.cli-navigation button:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.cli-command-card{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:rgba(0,0,0,.09)}
.cli-command-card small{display:block;color:var(--muted);font-size:.72rem;letter-spacing:.05em;margin-bottom:5px}
.cli-command-card code{display:block;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65}
#cli-copy-command{flex:0 0 auto;padding:8px 11px;border:1px solid var(--line);border-radius:8px;background:transparent;color:inherit;cursor:pointer;font:inherit}
.cli-command-note{margin:8px 2px 0;color:var(--muted);font-size:.88rem;line-height:1.6}

.cli-sim-output{margin:14px 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#08131e}
.cli-terminal-head{display:flex;align-items:center;gap:6px;padding:9px 12px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.035)}
.cli-terminal-head span{width:8px;height:8px;border-radius:50%;border:1px solid var(--line)}
.cli-terminal-head b{margin-left:6px;font-size:.76rem;color:var(--muted);letter-spacing:.04em}
.cli-sim-output pre{margin:0;padding:16px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;font-family:Consolas,monospace;color:inherit;background:transparent}

.cli-judgement{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:14px 0}
.cli-judgement article{padding:14px;border:1px solid var(--line);border-radius:11px}
.cli-judgement article:nth-child(1){border-top:3px solid var(--mint)}
.cli-judgement article:nth-child(2){border-top:3px solid var(--amber)}
.cli-judgement article:nth-child(3){border-top:3px solid var(--line)}
.cli-judgement p{margin:6px 0 0;line-height:1.65;font-size:.9rem}

.cli-navigation{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin-top:16px}
.cli-navigation button{padding:10px 14px;border:1px solid var(--line);border-radius:9px;background:transparent;color:inherit;cursor:pointer;font:inherit;font-weight:700}
.cli-navigation button:last-child{justify-self:end}
.cli-navigation button:disabled{opacity:.4;cursor:default}
.cli-navigation span{text-align:center;color:var(--muted)}

.cli-decision-map{display:grid;grid-template-columns:repeat(13,auto);gap:7px;align-items:center;justify-content:center;margin:20px 0;overflow-x:auto;padding:4px 0 10px}
.cli-decision-map div{min-width:108px;padding:10px;border:1px solid var(--line);border-radius:10px;text-align:center;background:var(--panel)}
.cli-decision-map b,.cli-decision-map span{display:block}
.cli-decision-map span{margin-top:4px;color:var(--muted);font-size:.72rem}
.cli-decision-map i{font-style:normal;color:var(--mint);font-weight:800}
.cli-reference{margin:14px 0}

@media(max-width:900px){
 .cli-workflow-layout{grid-template-columns:1fr}
 .cli-stepper{position:static;grid-template-columns:repeat(4,minmax(0,1fr))}
 .cli-stepper button{grid-template-columns:28px 1fr;padding:9px}
 .cli-stepper button>span{width:26px;height:26px}
 .cli-judgement{grid-template-columns:1fr}
 .cli-decision-map{justify-content:start}
}
@media(max-width:700px){
 .cli-panel{padding:15px}
 .cli-stepper{grid-template-columns:1fr 1fr}
 .cli-evidence-grid{grid-template-columns:1fr}
 .cli-command-card{display:block}
 #cli-copy-command{margin-top:10px;width:100%}
 .cli-command-tabs{display:grid;grid-template-columns:1fr 1fr}
 .cli-command-tabs button{width:100%}
 .cli-navigation{grid-template-columns:1fr auto 1fr}
 .cli-navigation button{padding:9px}
}
@media(max-width:420px){
 .cli-stepper{grid-template-columns:1fr}
 .cli-command-tabs{grid-template-columns:1fr}
}


/* Beginner-first mode switch */
.learning-mode-bar{padding:18px 0 0}
.learning-mode-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 24px;align-items:center;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.learning-mode-card h2{margin:6px 0 8px;font-size:1.25rem}
.learning-mode-card>div>p{margin:0;color:var(--muted);line-height:1.7}
.learning-mode-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;min-width:330px}
.learning-mode-actions button{padding:11px 14px;border:1px solid var(--line);border-radius:11px;background:transparent;color:inherit;text-align:left;cursor:pointer;font:inherit;font-weight:800;line-height:1.35}
.learning-mode-actions button small{display:block;margin-top:4px;color:var(--muted);font-weight:500}
.learning-mode-actions button[aria-pressed="true"]{border-color:var(--mint);background:rgba(107,224,192,.07)}
.learning-mode-actions button:focus-visible,#enable-advanced:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.learning-mode-note{grid-column:1/-1;margin:0;padding-top:14px;border-top:1px solid var(--line);color:var(--muted);line-height:1.7}
.scope-details{margin:-4px 0 18px}
.advanced-entry{padding-top:8px}
.advanced-entry-card{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px;border:1px dashed var(--mint);border-radius:16px;background:rgba(107,224,192,.04)}
.advanced-entry-card h2{margin:6px 0 8px;font-size:1.2rem}
.advanced-entry-card p{margin:0;color:var(--muted);line-height:1.7}
#enable-advanced{flex:0 0 auto;padding:12px 16px;border:1px solid var(--mint);border-radius:11px;background:transparent;color:inherit;cursor:pointer;font:inherit;font-weight:800}
[data-learning-level="advanced"][hidden],[data-mode-link="advanced"][hidden],[data-basic-only][hidden]{display:none!important}

@media(max-width:800px){
 .learning-mode-card{grid-template-columns:1fr}
 .learning-mode-actions{min-width:0}
 .advanced-entry-card{display:block}
 #enable-advanced{width:100%;margin-top:14px}
}
@media(max-width:460px){
 .learning-mode-actions{grid-template-columns:1fr}
}
