.v3-studio .animation-picker{grid-template-columns:1.2fr 1fr auto;gap:18px;align-items:end}.v3-studio .animation-picker .btn{margin-bottom:0}.v3-stage{border:1px solid #50624e;border-radius:16px;background:#17251f;overflow:hidden;padding:22px}.v3-stage-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.v3-stage-head h2{font-size:25px;margin:9px 0 0;line-height:1.3}.v3-stage-head .eyebrow{color:#bdceae}.v3-stage .stage-chapters{margin:0 0 20px;gap:8px}.v3-stage .stage-chapters button{display:flex;align-items:center;gap:9px;padding:12px;font-size:12px;line-height:1.5;text-align:start;min-height:65px}.v3-stage .stage-chapters button span{font-family:Consolas,monospace;font-size:18px;opacity:.65}.scene-caption{display:flex;gap:16px;align-items:start;background:#26392a;border:1px solid #4c6545;border-radius:10px;padding:18px 20px;margin-bottom:18px;min-height:120px}.scene-step{background:#c9eb90;color:#263b20;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;flex:none;font-weight:700;font-size:17px}.scene-caption h3{font-size:17px;margin:2px 0 8px;color:#d7efb8}.scene-caption p{margin:0;color:#e1e9db;font-size:15px;line-height:1.65}.visual-legend{display:flex;flex-wrap:wrap;gap:10px 24px;padding:0 4px 14px;font-size:11px;color:#c4d0c7}.visual-legend span{display:flex;align-items:center;gap:7px}.visual-legend i{display:inline-block;width:11px;height:11px;border-radius:3px;border:1px solid #899a8e}.mechanism-canvases{display:grid;gap:16px}.mechanism-canvases.comparison{grid-template-columns:1fr 1fr}.mechanism-panel{border-radius:11px;overflow:hidden;background:#f0eee3;color:#263e43;min-width:0}.view-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 17px;border-bottom:1px solid #c7cfbf;background:#e4e7da;font-size:14px;font-weight:600}.view-heading small{color:#586c63;font-size:10px;font-weight:400}.mechanism-views{display:grid;grid-template-columns:1.8fr 1fr;gap:0;align-items:center;direction:ltr}.mechanism-views>div{min-width:0}.view-label{font-size:10px;letter-spacing:1.3px;font-weight:700;padding:16px 15px 0;color:#607464;text-align:center}.mechanism-views svg{width:100%;height:auto;max-height:none;min-width:0}.mechanism-closeup{border-inline-start:1px solid #cbd2c5}.mechanism-views.compare-view{grid-template-columns:1fr}.compare-view .mechanism-closeup{border-inline-start:0;border-top:1px solid #cbd2c5}.compare-view .mechanism-closeup svg{max-height:225px}.mechanism-signals{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;background:#e4e7da;border-top:1px solid #c7cfbf;padding:14px}.mechanism-signal{min-width:0;display:grid;gap:7px}.mechanism-signal small{color:#5c6f63;font-size:11px}.mechanism-signal b{color:#38594b;font-size:13px;line-height:1.5;font-weight:600}.mechanism-signal .signal-line{height:4px;border-radius:4px;background:#83a38c;width:40%}.mechanism-signal.changed b{color:#a43e30}.mechanism-signal.changed .signal-line{background:#cd6b49;width:90%}.v3-stage .animation-controls{gap:10px}.v3-stage .animation-controls .btn{padding:11px 13px}.v3-stage .animation-controls .speed-label{font-size:11px}.player-options{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;padding:15px 2px;border-bottom:1px solid #3a4a3d;font-size:12px;color:#b8c9b6}.player-options label{display:flex;align-items:center;gap:8px}.player-options input{accent-color:#c9eb90}.player-options button{background:none;color:#c9eb90;text-decoration:underline;padding:4px}.player-options select{background:#213425;border:1px solid #57664c;padding:7px;border-radius:5px}.mechanism-cues{list-style:none;counter-reset:cue;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:0;margin:20px 0 0}.mechanism-cues li{counter-increment:cue;display:flex;align-items:start;gap:9px;font-size:12px;line-height:1.7;color:#c2d0c0}.mechanism-cues li:before{content:counter(cue);border:1px solid #738a62;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;flex:none;color:#d5ecb5;line-height:1}.comparison-explanation{font-size:12px;margin:17px 0 0;color:#d4c895}.comparison-explanation:empty{display:none}.animation-explain h3{margin:12px 0}.animation-explain p{font-size:13px}.animation-references{padding:0 5px 24px;font-size:11px;line-height:1.9}.video-library{margin-bottom:22px}.video-library h2{margin:12px 0}.video-library>p{font-size:12px;max-width:850px}.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.video-grid>a{display:flex;align-items:center;gap:15px;border:1px solid #43563c;border-radius:9px;padding:17px;color:#e0ebd5;background:#203025}.video-grid>a:hover{border-color:#9aad7f;text-decoration:none}.video-grid b{display:block;font-weight:500;font-size:13px}.video-grid small{display:block;font-size:10px;margin-top:7px}.video-play{width:37px;height:28px;display:grid;place-items:center;color:#f3dfcf;background:#8e422e;border-radius:7px;flex:none}.v3-studio .animation-collection button{text-align:start}.v3-studio .animation-model-note{font-size:11px}.v3-stage .timeline-wrap{direction:ltr}.v3-studio .animation-collection{grid-template-columns:repeat(3,1fr)}
html[lang=ar] .view-label{letter-spacing:0;font-size:12px}html[lang=ar] .mechanism-signals{direction:rtl}html[lang=ar] .scene-caption p{line-height:1.9;font-size:16px}html[lang=ar] .v3-stage .stage-chapters button{font-size:13px}
@media(max-width:1200px){.v3-studio .animation-picker{grid-template-columns:1fr 1fr}.v3-studio .animation-picker>.btn{justify-self:start;grid-column:1/-1}.mechanism-views{grid-template-columns:1.5fr 1fr}.v3-stage .animation-controls{flex-wrap:wrap}.v3-stage .timeline-wrap{flex-basis:100%;order:5}.v3-stage .animation-controls output{margin-inline-start:auto}.v3-stage .stage-chapters button{font-size:11px;padding:9px}.mechanism-cues{gap:12px}.mechanism-canvases.comparison{grid-template-columns:1fr}.comparison .mechanism-views{grid-template-columns:1.8fr 1fr}.comparison .mechanism-closeup{border-top:0;border-inline-start:1px solid #cbd2c5}}
@media(max-width:1100px){.mechanism-views,.comparison .mechanism-views{grid-template-columns:1fr}.mechanism-closeup,.comparison .mechanism-closeup{border-inline-start:0;border-top:1px solid #cbd2c5}.mechanism-closeup svg,.compare-view .mechanism-closeup svg{max-height:250px}}
@media(max-width:700px){.v3-stage{padding:14px 11px}.v3-stage-head h2{font-size:21px}.v3-stage-head .pill{font-size:8px}.v3-studio .animation-picker{grid-template-columns:1fr;gap:15px}.v3-stage .stage-chapters{grid-template-columns:1fr 1fr;gap:6px}.v3-stage .stage-chapters button{font-size:12px;min-height:64px}.scene-caption{padding:14px 12px;gap:10px;min-height:150px}.scene-caption h3{font-size:16px}.scene-caption p{font-size:14px}.scene-step{width:27px;height:27px;font-size:14px}.mechanism-views,.comparison .mechanism-views{grid-template-columns:1fr}.mechanism-closeup,.comparison .mechanism-closeup{border-inline-start:0;border-top:1px solid #cbd2c5}.mechanism-closeup svg,.compare-view .mechanism-closeup svg{max-height:250px}.view-heading{display:block;padding:12px}.view-heading small{display:block;margin-top:5px}.view-label{padding-top:12px}.mechanism-signals{gap:8px;padding:12px 9px}.mechanism-signal b{font-size:11px}.mechanism-signal small{font-size:10px}.v3-stage .animation-controls .btn{padding:10px;font-size:11px}.visual-legend{font-size:10px;gap:9px 15px}.mechanism-cues{grid-template-columns:1fr;gap:10px}.video-grid,.v3-studio .animation-collection{grid-template-columns:1fr}.animation-explain{grid-template-columns:1fr}.player-options{font-size:11px}.animation-explain .btn{white-space:normal}html[lang=ar] .scene-caption p{font-size:15px}.v3-studio .heading h1{font-size:29px}}