.learning-visual-layer,
.learning-visual-layer * { box-sizing: border-box; }
.learning-visual-layer {
  margin: 0 clamp(34px,5vw,78px) 26px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.72);
  color: var(--ink);
  box-shadow: 0 16px 40px rgba(13,27,31,.08);
  overflow: hidden;
}
.lv-intro { display:flex;align-items:end;justify-content:space-between;gap:28px;padding:24px 26px 20px;background:#0d1b1f;color:#eef4f1; }
.lv-intro span,.lv-section-head span { color:var(--orange);font-size:8px;font-weight:800;letter-spacing:1.6px; }
.lv-intro h2 { margin:7px 0 0;font-size:24px; }
.lv-intro p { max-width:520px;margin:0;color:#aebdb8;font-size:11px;line-height:1.7;text-align:right; }
.lv-featured-teardown { width:100%;min-height:108px;border:0;border-top:1px solid rgba(255,255,255,.16);border-bottom:1px solid #d84f1b;background:linear-gradient(110deg,#ff6b35 0%,#ff6b35 64%,#e95520 100%);color:#21120c;padding:18px 26px;display:grid;grid-template-columns:auto minmax(260px,1fr) auto;gap:22px;align-items:center;text-align:left;cursor:pointer;touch-action:manipulation;position:relative;overflow:hidden; }
.lv-featured-teardown:after { content:"";position:absolute;right:15%;top:-90px;width:190px;height:190px;border:1px solid rgba(255,255,255,.22);border-radius:50%;box-shadow:0 0 0 28px rgba(255,255,255,.05),0 0 0 58px rgba(255,255,255,.035);pointer-events:none; }
.lv-featured-teardown:hover { background:linear-gradient(110deg,#ff7a44 0%,#ff6b35 60%,#e95520 100%); }
.lv-featured-mark { align-self:stretch;min-width:120px;border-right:1px solid rgba(48,22,12,.26);display:flex;flex-direction:column;justify-content:center;gap:8px; }
.lv-featured-mark i { width:max-content;border:1px solid rgba(44,20,11,.5);padding:3px 7px;font-size:7px;font-weight:900;letter-spacing:1.4px;font-style:normal; }
.lv-featured-mark b { font-size:8px;letter-spacing:1.6px; }
.lv-featured-copy { display:block;position:relative;z-index:1; }
.lv-featured-copy small,.lv-featured-copy strong { display:block; }
.lv-featured-copy small { margin-bottom:7px;font-size:9px;letter-spacing:.2px;opacity:.72; }
.lv-featured-copy strong { font-size:clamp(22px,2.8vw,38px);line-height:1;font-weight:900;letter-spacing:-1px; }
.lv-featured-action { min-height:48px;border:1px solid rgba(39,18,10,.5);padding:0 15px;display:flex;align-items:center;gap:18px;position:relative;z-index:1;font-size:10px;font-weight:800;white-space:nowrap; }
.lv-featured-action i { font-size:22px;font-style:normal;transition:transform .2s ease; }.lv-featured-teardown:hover .lv-featured-action i { transform:translateX(4px); }
.lv-tabs { display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px;background:#17272b; }
.lv-tabs>button { min-height:68px;border:1px solid #3b4c50;background:#1c2e33;color:#aebdb8;padding:10px 13px;display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;text-align:left;cursor:pointer;touch-action:manipulation; }
.lv-tabs>button>i { width:36px;height:36px;display:grid;place-items:center;border:1px solid #4b5d60;border-radius:10px;color:#82948f;font:11px Georgia;font-style:normal; }
.lv-tabs span,.lv-tabs b,.lv-tabs small { display:block; }
.lv-tabs b { color:#eef4f1;font-size:13px; }
.lv-tabs small { margin-top:4px;color:#899a95;font-size:9px; }
.lv-tabs>button[aria-selected="true"] { border-color:var(--orange);background:#2b302c;box-shadow:inset 3px 0 var(--orange); }
.lv-tabs>button[aria-selected="true"]>i { border-color:var(--orange);background:var(--orange);color:#1a1511; }
.lv-panel { padding:24px; }
.lv-panel[hidden] { display:none; }
.lv-section-head { display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:16px; }
.lv-section-head h3 { margin:6px 0 0;font-size:21px; }
.lv-section-head p { max-width:460px;margin:0;color:var(--muted);font-size:10px;line-height:1.65;text-align:right; }
.lv-atlas-switch { display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:7px;margin-bottom:14px; }
.lv-atlas-switch button { min-height:46px;border:1px solid var(--line);background:var(--surface);color:var(--muted);padding:8px;font-size:10px;font-weight:700;cursor:pointer;touch-action:manipulation; }
.lv-atlas-switch button.active { border-color:var(--orange);background:#fff4e9;color:#9d431d; }
.lv-atlas-layout { display:grid;grid-template-columns:minmax(0,1.3fr) minmax(270px,.7fr);gap:16px;align-items:start; }
.lv-atlas-figure { min-width:0;margin:0;border:1px solid var(--line);background:#0d1b1f; }
.lv-image-stage { position:relative;aspect-ratio:16/9;overflow:hidden;background:#102126; }
.lv-image-stage img { display:block;width:100%;height:100%;object-fit:cover; }
.lv-hotspot { position:absolute;left:var(--x);top:var(--y);width:44px;height:44px;transform:translate(-50%,-50%);border:2px solid #fff;border-radius:50%;background:#10292f;color:#fff;box-shadow:0 4px 16px rgba(0,0,0,.42);font-size:10px;font-weight:800;cursor:pointer;touch-action:manipulation; }
.lv-hotspot:after { content:"";position:absolute;inset:-7px;border:1px solid rgba(255,255,255,.45);border-radius:50%;pointer-events:none; }
.lv-hotspot.active { border-color:#fff;background:var(--orange);color:#1c130f;box-shadow:0 0 0 6px rgba(255,107,53,.25),0 4px 18px rgba(0,0,0,.45); }
.lv-atlas-figure figcaption { padding:10px 12px;color:#aebdb8;font-size:9px;line-height:1.65; }
.lv-atlas-side { display:grid;gap:12px; }
.lv-term-list { display:grid;gap:6px; }
.lv-term-list>button { width:100%;min-height:60px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:8px;display:grid;grid-template-columns:34px 1fr;gap:9px;align-items:center;text-align:left;cursor:pointer;touch-action:manipulation; }
.lv-term-list>button>i { width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--line);font:9px Georgia;color:var(--orange-deep);font-style:normal; }
.lv-term-list span,.lv-term-list b,.lv-term-list small { display:block; }
.lv-term-list b { font-size:11px; }
.lv-term-list small { margin-top:4px;color:var(--muted);font-size:8px;line-height:1.45; }
.lv-term-list>button.active { border-color:var(--orange);background:#fff7ef;box-shadow:inset 3px 0 var(--orange); }
.lv-atlas-detail { border-left:3px solid var(--orange);background:#102126;color:#edf4f1;padding:16px; }
.lv-atlas-detail>span { color:var(--orange);font-size:8px;letter-spacing:1px; }
.lv-atlas-detail h4 { margin:6px 0 12px;font-size:18px; }
.lv-atlas-detail dl { display:grid;gap:9px;margin:0; }
.lv-atlas-detail dl>div { border-top:1px solid #34474b;padding-top:9px; }
.lv-atlas-detail dt { color:#8ea29c;font-size:8px; }
.lv-atlas-detail dd { margin:4px 0 0;font-size:10px;line-height:1.65; }
.lv-atlas-detail .boundary { border-left:2px solid var(--orange);padding-left:9px; }
.lv-teardown-hero { margin-bottom:14px;border:1px solid #2c4147;background:radial-gradient(circle at 84% 20%,rgba(53,117,142,.25),transparent 34%),#0b171b;color:#eef4f1;padding:clamp(20px,3vw,34px);display:grid;grid-template-columns:1fr auto;gap:30px;align-items:end;overflow:hidden; }
.lv-teardown-hero>div>span { color:var(--orange);font-size:8px;font-weight:800;letter-spacing:1.6px; }
.lv-teardown-hero h4 { margin:10px 0 9px;font-size:clamp(25px,3vw,40px);line-height:1.05; }
.lv-teardown-hero h4 em { color:var(--orange);font-style:normal; }
.lv-teardown-hero p { max-width:560px;margin:0;color:#9cafaa;font-size:10px;line-height:1.75; }
.lv-teardown-hero>dl { display:grid;grid-template-columns:repeat(3,94px);gap:7px;margin:0; }
.lv-teardown-hero>dl>div { border:1px solid #344a50;background:rgba(13,29,34,.72);padding:12px; }
.lv-teardown-hero dt { color:#fff;font:24px Georgia; }.lv-teardown-hero dd { margin:5px 0 0;color:#82958f;font-size:8px;line-height:1.4; }
.lv-teardown-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px; }
.lv-device-card { min-width:0;border:1px solid #2d4147;background:#0d1b1f;color:#eef4f1;overflow:hidden;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }
.lv-device-card:hover { transform:translateY(-4px);border-color:var(--orange);box-shadow:0 16px 28px rgba(11,24,28,.2); }
.lv-device-card figure { position:relative;aspect-ratio:16/10;margin:0;background:#030708;overflow:hidden; }
.lv-device-card figure:after { content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(transparent,#0d1b1f);pointer-events:none; }
.lv-device-card img { width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s ease; }.lv-device-card:hover img { transform:scale(1.035); }
.lv-device-card figure>span { position:absolute;z-index:2;left:11px;top:11px;width:31px;height:31px;border:1px solid rgba(255,255,255,.52);border-radius:50%;background:rgba(5,14,17,.7);display:grid;place-items:center;color:var(--orange);font:9px Georgia; }
.lv-device-card>div { padding:14px; }
.lv-device-card small { color:#71858a;font-size:7px;letter-spacing:1px; }
.lv-device-card h4 { margin:6px 0 8px;font-size:17px; }.lv-device-card p { min-height:48px;margin:0;color:#a9b9b4;font-size:9px;line-height:1.7; }
.lv-device-card dl { margin:12px 0 0;padding-top:10px;border-top:1px solid #2d4045; }.lv-device-card dt { color:#667b80;font-size:7px;letter-spacing:1px; }.lv-device-card dd { margin:4px 0 0;color:#c1ceca;font-size:8px;line-height:1.5; }
.lv-device-card button { width:100%;min-height:46px;margin-top:12px;border:1px solid var(--orange);background:var(--orange);color:#20110b;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;font-weight:800;cursor:pointer;touch-action:manipulation; }
.lv-device-card button i { font-size:17px;font-style:normal; }
.lv-teardown-note { margin:13px 0 0;border-left:2px solid var(--orange);background:#fff2e9;color:#714d3d;padding:11px 13px;font-size:9px;line-height:1.65; }
.lv-assumption { display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;margin-bottom:18px;padding:13px 15px;border-left:3px solid var(--orange);background:#fff0e7; }
.lv-assumption b { color:#93421f;font-size:10px; }
.lv-assumption span { color:#704c3d;font-size:10px;line-height:1.65; }
.lv-loop-controls { display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px; }
.lv-loop-controls label { border:1px solid var(--line);background:var(--surface);padding:13px; }
.lv-loop-controls label>span { display:flex;justify-content:space-between;gap:12px;font-size:11px; }
.lv-loop-controls b { color:var(--orange-deep);font:16px Georgia; }
.lv-loop-controls input { width:100%;height:38px;margin-top:8px;accent-color:var(--orange);cursor:pointer;touch-action:manipulation; }
.lv-loop-path { display:flex;align-items:stretch;gap:6px;min-width:0; }
.lv-loop-path>button { min-width:0;min-height:76px;flex:1;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:9px 6px;cursor:pointer;touch-action:manipulation; }
.lv-loop-path>button b,.lv-loop-path>button small { display:block; }
.lv-loop-path>button b { font-size:13px; }
.lv-loop-path>button small { margin-top:6px;color:var(--muted);font-size:8px;line-height:1.35; }
.lv-loop-path>button.active { border-color:var(--orange);background:#fff6ed;box-shadow:inset 0 -3px var(--orange); }
.lv-loop-path>i { align-self:center;color:var(--orange-deep);font-size:12px;font-style:normal; }
.lv-feedback { width:100%;min-height:54px;margin-top:10px;border:1px dashed #8da099;background:#edf4ef;color:#263b35;padding:10px 14px;display:flex;align-items:center;justify-content:center;gap:14px;cursor:pointer;touch-action:manipulation; }
.lv-feedback b { font-size:11px; }.lv-feedback span { font-size:9px;line-height:1.5; }
.lv-feedback.active { border-style:solid;border-color:var(--orange);background:#fff6ed; }
.lv-loop-explain { min-height:86px;margin-top:12px;border-left:3px solid #4f9b72;background:#102126;color:#edf4f1;padding:16px; }
.lv-loop-explain b { font-size:13px; }.lv-loop-explain p { margin:7px 0 0;color:#b9c7c2;font-size:10px;line-height:1.7; }
.lv-glossary-tools { display:grid;grid-template-columns:minmax(240px,1fr) auto;gap:10px;align-items:center; }
.lv-glossary-tools>label { height:48px;border:1px solid var(--line);background:var(--surface);display:flex;align-items:center; }
.lv-glossary-tools>label>span { padding-left:13px;color:var(--muted); }
.lv-glossary-tools input { width:100%;height:100%;border:0;background:transparent;color:var(--ink);padding:0 11px;font-size:12px;outline:0; }
.lv-category-filter { display:grid;grid-template-columns:repeat(5,auto);gap:5px; }
.lv-category-filter button { min-height:44px;border:1px solid var(--line);background:var(--surface);color:var(--muted);padding:0 12px;font-size:10px;cursor:pointer;touch-action:manipulation; }
.lv-category-filter button.active { border-color:var(--orange);background:var(--orange);color:#22140e;font-weight:800; }
.lv-glossary-status { display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0; }
.lv-glossary-status span { color:var(--muted);font-size:9px; }
.lv-glossary-status button { min-height:38px;border:0;background:transparent;color:var(--orange-deep);font-size:9px;font-weight:700;cursor:pointer; }
.lv-term-grid { display:grid;grid-template-columns:1fr 1fr;gap:9px; }
.lv-term-card { min-width:0;border:1px solid var(--line);background:var(--surface);padding:15px;scroll-margin:100px; }
.lv-term-card header { display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center; }
.lv-term-card header>span { min-width:42px;min-height:30px;display:grid;place-items:center;background:#102126;color:var(--orange);padding:4px 7px;font:9px ui-monospace,SFMono-Regular,monospace; }
.lv-term-card h4 { margin:0;font-size:14px; }.lv-term-card header>i { color:var(--muted);font-size:8px;font-style:normal; }
.lv-term-card>p { margin:12px 0;font-size:10px;line-height:1.65; }
.lv-term-card dl { display:grid;gap:8px;margin:0; }
.lv-term-card dl>div { border-top:1px solid var(--line);padding-top:8px; }
.lv-term-card dt { color:var(--orange-deep);font-size:8px;font-weight:800; }.lv-term-card dd { margin:4px 0 0;color:var(--muted);font-size:9px;line-height:1.6; }
.lv-term-card>button { width:100%;min-height:42px;margin-top:12px;border:1px solid var(--line);background:transparent;color:var(--orange-deep);font-size:9px;font-weight:700;cursor:pointer;touch-action:manipulation; }
.lv-term-card:focus { outline:3px solid rgba(78,142,255,.42);outline-offset:3px; }
.lv-term-empty { grid-column:1/-1;border:1px dashed var(--line);padding:24px;text-align:center;color:var(--muted);font-size:10px; }
.lv-inline-term { border:0;border-bottom:1px dashed var(--orange-deep);background:transparent;color:var(--orange-deep);padding:0 1px;font:inherit;font-weight:700;cursor:pointer;touch-action:manipulation; }
.learning-visual-layer button:focus-visible,.learning-visual-layer input:focus-visible { outline:3px solid rgba(78,142,255,.45);outline-offset:3px; }
.light-off .learning-visual-layer { background:#142327; }
.light-off .lv-atlas-switch button,.light-off .lv-term-list>button,.light-off .lv-loop-controls label,.light-off .lv-loop-path>button,.light-off .lv-glossary-tools>label,.light-off .lv-category-filter button,.light-off .lv-term-card { background:#192a2f;color:#edf4f1;border-color:#35484d; }
.light-off .lv-atlas-switch button.active,.light-off .lv-term-list>button.active,.light-off .lv-loop-path>button.active { background:#35271f; }
.light-off .lv-assumption { background:#38261f; }.light-off .lv-assumption span { color:#d0b5a9; }
.light-off .lv-feedback { background:#1b3228;color:#e5efea;border-color:#4d6a5e; }

@media(max-width:900px) {
  .lv-atlas-layout { grid-template-columns:1fr; }
  .lv-atlas-side { grid-template-columns:1fr 1fr;align-items:start; }
  .lv-teardown-grid { grid-template-columns:1fr 1fr; }
  .lv-teardown-hero { grid-template-columns:1fr; }.lv-teardown-hero>dl { grid-template-columns:repeat(3,1fr); }
  .lv-loop-path { display:grid;grid-template-columns:repeat(4,1fr); }
  .lv-loop-path>i { display:none; }
}
@media(max-width:700px) {
  .learning-visual-layer { margin:0 12px 20px; }
  .lv-intro { display:block;padding:20px 16px; }
  .lv-intro h2 { font-size:21px; }.lv-intro p { margin-top:9px;font-size:11px;text-align:left; }
  .lv-featured-teardown { min-height:132px;padding:17px 16px;grid-template-columns:1fr auto;gap:9px 12px; }
  .lv-featured-mark { min-width:0;align-self:auto;border:0;display:flex;flex-direction:row;justify-content:flex-start;align-items:center;grid-column:1/-1; }
  .lv-featured-copy small { font-size:9px;line-height:1.45; }.lv-featured-copy strong { font-size:24px;line-height:1.05; }
  .lv-featured-action { width:48px;min-height:48px;padding:0;display:grid;place-items:center;border-radius:50%;font-size:0; }.lv-featured-action i { font-size:23px; }
  .lv-tabs { gap:5px;padding:8px; }
  .lv-tabs>button { min-width:0;min-height:64px;padding:8px 5px;grid-template-columns:1fr;justify-items:center;text-align:center; }
  .lv-tabs>button>i { width:28px;height:28px;border-radius:8px; }.lv-tabs b { font-size:12px; }.lv-tabs small { display:none; }
  .lv-panel { padding:16px 12px 18px;overflow-x:hidden; }
  .lv-section-head { display:block; }.lv-section-head h3 { font-size:19px; }.lv-section-head p { margin-top:7px;font-size:11px;text-align:left; }
  .lv-atlas-switch { grid-template-columns:1fr 1fr; }.lv-atlas-switch button { min-height:50px;font-size:11px; }
  .lv-teardown-grid { grid-template-columns:1fr; }.lv-device-card p { min-height:0; }
  .lv-teardown-hero>dl { gap:5px; }.lv-teardown-hero>dl>div { padding:9px; }.lv-teardown-hero dt { font-size:20px; }
  .lv-atlas-layout,.lv-atlas-side { display:grid;grid-template-columns:1fr; }
  .lv-image-stage { width:100%; }.lv-hotspot { display:none; }
  .lv-term-list>button { min-height:66px; }.lv-term-list b { font-size:12px; }.lv-term-list small { font-size:10px; }
  .lv-atlas-detail dd { font-size:11px; }
  .lv-loop-controls { grid-template-columns:1fr; }.lv-loop-controls label { min-height:78px; }
  .lv-loop-path { display:grid;grid-template-columns:1fr;gap:7px; }
  .lv-loop-path>button { width:100%;min-height:60px; }.lv-loop-path>i { display:block;transform:rotate(90deg);justify-self:center; }
  .lv-feedback { align-items:flex-start;flex-direction:column;gap:5px;text-align:left; }
  .lv-glossary-tools { grid-template-columns:1fr; }
  .lv-category-filter { grid-template-columns:repeat(3,1fr); }.lv-category-filter button { padding:0 6px;font-size:11px; }
  .lv-glossary-status { align-items:flex-start;flex-direction:column; }
  .lv-glossary-status button { min-height:44px; }
  .lv-term-grid { grid-template-columns:1fr; }.lv-term-card { padding:14px; }.lv-term-card>p { font-size:11px; }.lv-term-card dd { font-size:10px; }
  .lv-inline-term { min-height:44px;margin:2px 3px;padding:0 7px;display:inline-flex;align-items:center;border:1px dashed var(--orange-deep);border-radius:7px;background:rgba(255,107,53,.08);line-height:1.25; }
}
@media(max-width:360px) {
  .lv-atlas-switch { grid-template-columns:1fr; }
  .lv-category-filter { grid-template-columns:1fr 1fr; }
}
@media(prefers-reduced-motion:reduce) {
  .learning-visual-layer * { scroll-behavior:auto!important;transition:none!important; }
}
