/* CS2 teaching artwork and controls, driven by the existing Design Lab palette. */
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene { min-width:0;max-width:100%; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-scene-heading { display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px;color:var(--pv-muted);font-size:calc(11px * var(--wl-font-scale,1)); }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-scene-heading small { font-size:inherit;text-align:right; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-stage { display:block;width:100%;max-width:none;height:auto;aspect-ratio:720/420;border:var(--wl-frame-width,1px) solid var(--wl-frame-color,var(--pv-line));border-radius:var(--pv-radius-sm,9px);background:var(--pv-bg);overflow:hidden; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 svg.nw-lesson-stage { stroke:none;stroke-width:0;fill:none; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene[data-lesson-animation] svg.nw-lesson-stage { height:auto;max-height:none; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .pv-studio-next-lesson>.nw-learning-scene svg.nw-lesson-stage { aspect-ratio:720/420;max-height:none; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene.pv-studio-tactic-diagram .nw-lesson-stage { aspect-ratio:720/466; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene.is-compact .nw-lesson-stage { height:auto;aspect-ratio:720/420; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene.is-compact.pv-studio-tactic-diagram .nw-lesson-stage { aspect-ratio:720/466; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-stage text { fill:var(--pv-text);font-family:var(--wl-font-family,inherit);font-weight:600;font-size:16px;text-anchor:middle; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-stage text { stroke:none;text-shadow:none;letter-spacing:0; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-stage .nw-lesson-small { font-size:13px; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-stage .nw-lesson-meta { fill:var(--pv-muted);font-size:13px;text-anchor:middle; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-stage [data-scene-variant-note] { text-anchor:start; }
.nw-lesson-stage .nw-agent-shadow { fill:var(--pv-bg);opacity:.6; }
.nw-lesson-stage .nw-lesson-agent { --agent-tone:var(--pv-cyan); }
.nw-lesson-stage .nw-lesson-agent--ally { --agent-tone:color-mix(in srgb,var(--pv-cyan) 60%,var(--pv-text)); }
.nw-lesson-stage .nw-lesson-agent--opponent { --agent-tone:var(--pv-orange); }
.nw-lesson-stage .nw-agent-sprite { overflow:hidden; }
.nw-lesson-stage .nw-agent-team-ring { fill:none;stroke:var(--agent-tone,var(--pv-cyan));stroke-width:1.5;opacity:.65; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-stage.is-realistic :is(.nw-lesson-label,.nw-lesson-small) { paint-order:stroke fill;stroke:#181b1ed9;stroke-width:3px;stroke-linejoin:round;fill:var(--pv-text,#fff); }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-stage svg.nw-agent-sprite { width:auto;max-width:none;min-height:0;max-height:none;border:0;border-radius:0;box-shadow:none;aspect-ratio:auto; }
.nw-lesson-stage.is-realistic .nw-agent-shadow { fill:#34291b;opacity:.32; }
.nw-lesson-stage.is-realistic .nw-pov-wall-rim { stroke:#b6a383;stroke-width:4;opacity:1; }
.nw-lesson-stage .nw-agent-fabric { fill:color-mix(in srgb,var(--agent-tone,var(--pv-cyan)) 22%,var(--pv-surface));stroke:var(--pv-muted);stroke-width:1.5;stroke-linejoin:round; }
.nw-lesson-stage .nw-agent-vest { fill:color-mix(in srgb,var(--agent-tone,var(--pv-cyan)) 16%,var(--pv-bg));stroke:var(--agent-tone,var(--pv-cyan));stroke-width:1.8; }
.nw-lesson-stage .nw-agent-pad { fill:var(--pv-surface-2,var(--pv-surface));stroke:var(--pv-muted);stroke-width:1; }
.nw-lesson-stage .nw-agent-arm { fill:none;stroke:color-mix(in srgb,var(--agent-tone,var(--pv-cyan)) 45%,var(--pv-muted));stroke-width:11;stroke-linejoin:round; }
.nw-lesson-stage :is(.nw-agent-boot,.nw-agent-glove,.nw-agent-weapon) { fill:var(--pv-bg);stroke:var(--pv-muted);stroke-width:1.5;stroke-linejoin:round; }
.nw-lesson-stage .nw-agent-neck { fill:var(--pv-muted); }
.nw-lesson-stage .nw-agent-helmet { fill:color-mix(in srgb,var(--agent-tone,var(--pv-cyan)) 28%,var(--pv-surface));stroke:var(--agent-tone,var(--pv-cyan));stroke-width:2; }
.nw-lesson-stage .nw-agent-visor { fill:var(--pv-bg);stroke:var(--pv-muted);stroke-width:1; }
.nw-lesson-stage .nw-agent-rim { fill:none;stroke:color-mix(in srgb,var(--agent-tone,var(--pv-cyan)) 50%,var(--pv-text));stroke-width:2; }
.nw-lesson-stage .nw-agent-metal { fill:var(--pv-muted); }
.nw-lesson-stage .nw-lesson-arena-edge { fill:none;stroke:var(--pv-line);stroke-width:2; }
.nw-lesson-stage .nw-lesson-floor-seams { fill:none;stroke:var(--pv-muted);stroke-width:1;opacity:.08; }
.nw-lesson-stage .nw-cover-front { fill:color-mix(in srgb,var(--pv-muted) 17%,var(--pv-surface));stroke:var(--pv-muted);stroke-width:2; }
.nw-lesson-stage .nw-cover-top { fill:color-mix(in srgb,var(--pv-muted) 25%,var(--pv-surface));stroke:var(--pv-muted);stroke-width:1; }
.nw-lesson-stage .nw-cover-side { fill:var(--pv-bg);stroke:var(--pv-muted);stroke-width:1; }
.nw-lesson-stage .nw-cover-brace { fill:none;stroke:var(--pv-muted);stroke-width:2;opacity:.35; }
.nw-lesson-stage :is(.nw-pov-floor,.nw-pov-back) { fill:var(--pv-surface);stroke:var(--pv-line);stroke-width:2; }
.nw-lesson-stage .nw-pov-wall { fill:color-mix(in srgb,var(--pv-muted) 12%,var(--pv-surface));stroke:var(--pv-line);stroke-width:2; }
.nw-lesson-stage .nw-pov-near-wall { fill:color-mix(in srgb,var(--pv-muted) 20%,var(--pv-surface));stroke:var(--pv-muted);stroke-width:2; }
.nw-lesson-stage .nw-pov-wall-rim { fill:none;stroke:var(--pv-text);stroke-width:2;opacity:.35; }
.nw-lesson-stage :is(.nw-lesson-crosshair,.nw-lesson-lock) { fill:none;stroke:var(--pv-cyan);stroke-width:3; }
.nw-lesson-stage .nw-lesson-crosshair-dot { fill:var(--pv-cyan); }
.nw-lesson-stage .nw-lesson-head-guide { fill:none;stroke:var(--pv-text);stroke-width:1.5;stroke-dasharray:6 6;opacity:.5; }
.nw-lesson-stage :is(.nw-lesson-route,.nw-lesson-sight,.nw-lesson-team-link) { fill:none;stroke:var(--pv-cyan);stroke-width:2;stroke-dasharray:5 5;stroke-linecap:round; }
.nw-lesson-stage .nw-lesson-route { opacity:.6; }
.nw-lesson-stage .nw-lesson-team-line { fill:none;stroke:var(--pv-line);stroke-width:2; }
.nw-lesson-stage :is(.nw-lesson-correction,.nw-lesson-enemy-sight,.nw-lesson-blocked) { fill:none;stroke:var(--pv-orange);stroke-width:2;stroke-linecap:round; }
.nw-lesson-stage .nw-lesson-enemy-sight { stroke-dasharray:5 6; }
.nw-lesson-stage .nw-lesson-shot { stroke:var(--pv-cyan);stroke-width:3; }
.nw-lesson-stage .nw-lesson-muzzle { fill:var(--pv-orange); }
.nw-lesson-stage .nw-lesson-stop-mark { fill:none;stroke:var(--pv-green,var(--pv-cyan));stroke-width:3; }
.nw-lesson-stage .nw-lesson-grenade { fill:var(--pv-muted);stroke:var(--pv-text);stroke-width:1.5; }
.nw-lesson-stage .nw-lesson-pin { fill:none;stroke:var(--pv-text);stroke-width:2; }
.nw-lesson-stage .nw-lesson-smoke circle { fill:var(--pv-muted);opacity:.4; }
.nw-lesson-stage :is(.nw-lesson-wallet rect,.nw-lesson-callout rect,.nw-lesson-mouse-pad rect) { fill:var(--pv-bg);stroke:var(--pv-line);stroke-width:1.5; }
.nw-lesson-stage .nw-lesson-mouse { fill:var(--pv-surface);stroke:var(--pv-cyan);stroke-width:2; }
.nw-lesson-stage .nw-lesson-hand { fill:var(--pv-muted);stroke:var(--pv-text);stroke-width:1; }
.nw-lesson-stage .nw-lesson-observation { fill:none;stroke:var(--pv-orange);stroke-width:2;stroke-dasharray:4 5; }
.nw-lesson-stage .nw-tactic-floor { fill:var(--pv-surface-2,var(--pv-surface)); }
.nw-lesson-stage .nw-tactic-wall { fill:none;stroke:var(--pv-muted);stroke-width:5;stroke-linejoin:round; }
.nw-lesson-stage .nw-lesson-past-route { fill:none;stroke:var(--pv-orange);stroke-width:2;stroke-dasharray:4 7; }
.nw-lesson-stage .nw-lesson-unknown circle { fill:var(--pv-bg);stroke:var(--pv-muted);stroke-width:2;stroke-dasharray:4 4; }
.nw-lesson-stage .nw-lesson-flash { fill:var(--pv-text);stroke:var(--pv-text);stroke-width:3;opacity:.7; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene figcaption { margin-top:10px; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene figcaption ol { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;list-style:none;padding:0;margin:0 0 10px; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene figcaption li { display:flex;gap:6px;align-items:start;font-size:calc(12px * var(--wl-font-scale,1));line-height:1.4; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene figcaption li button { display:flex;gap:6px;width:100%;min-height:44px;align-items:center;padding:6px;border:1px solid var(--pv-line);border-radius:var(--pv-radius-sm);background:var(--pv-surface);color:var(--pv-muted);font:inherit;text-align:left;cursor:pointer; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene figcaption li button[aria-current="step"] { color:var(--pv-text);border-color:var(--pv-cyan);background:color-mix(in srgb,var(--pv-cyan) 8%,var(--pv-surface)); }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene figcaption li span { flex:none;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--pv-cyan);color:var(--pv-bg);font-weight:800; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene [data-scene-note] { min-height:3em;margin:0 0 8px;color:var(--pv-text);font-size:calc(13px * var(--wl-font-scale,1));line-height:1.55; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene figcaption>small { display:block;color:var(--pv-muted);font-size:calc(10px * var(--wl-font-scale,1));line-height:1.45; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-variants { display:flex;flex-wrap:wrap;gap:6px;margin:8px 0;padding:0;border:0;min-width:0; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-variants legend { width:100%;margin:0 0 5px;font-size:calc(11px * var(--wl-font-scale,1));color:var(--pv-muted); }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-variants button { flex:1;min-height:44px;min-width:0;padding:7px 10px;border:1px solid var(--pv-line);border-radius:var(--pv-radius-sm);background:var(--pv-surface);color:var(--pv-text);font:inherit;font-size:calc(12px * var(--wl-font-scale,1));cursor:pointer; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-variants button[aria-pressed="true"] { border-color:var(--pv-cyan); }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene button:focus-visible { outline:2px solid var(--pv-cyan);outline-offset:3px; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .pv-studio-home-lesson .nw-learning-scene { width:70px; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .pv-studio-account-lesson .nw-learning-scene { width:84px; margin:0; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .pv-studio-account-lesson .nw-learning-scene svg { height:auto;min-height:0; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .pv-studio-home-lesson .nw-learning-scene { margin:0; }
body[data-product-visual-system="studio-v1"] #roar-product-v1 .pv-studio-home-links .pv-studio-home-lesson { grid-template-columns:70px minmax(0,1fr) 16px; }
@media(max-width:600px) {
  body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-lesson-scene-heading { flex-wrap:wrap;gap:3px; }
  body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene figcaption ol { grid-template-columns:minmax(0,1fr);gap:4px; }
  body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene figcaption li button { padding:5px 8px;min-height:44px; }
  body[data-product-visual-system="studio-v1"] #roar-product-v1 .nw-learning-scene .nw-lesson-meta { display:none; }
}
