/* Edition 3: quiet editorial motion. Every teaching element is visible by default. */
:root{--motion-fast:160ms;--motion-normal:220ms;--motion-ease:cubic-bezier(.2,.75,.25,1)}
.in-view[data-reveal],.siren.signal-seen .symbol::after{animation:none}
.chapter-indicator span{display:inline-block}
.motion-controls{grid-column:1/-1;border-top:1px solid var(--line);padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.motion-toggle{border:1px solid var(--line);border-radius:12px;padding:10px 14px;min-height:44px;background:var(--surface);font-size:15px;font-weight:700;color:var(--text)}
.motion-toggle[aria-pressed=true]{background:var(--blue);border-color:var(--accent)}
.motion-toggle:disabled{cursor:default}
.motion-status{font-size:13px;color:var(--muted);margin:0}
@media(hover:hover) and (pointer:fine){
 .route-link,.start-shortcuts a,.theme-switch button,.menu-button,.hint summary,.service-grid a,.motion-toggle{transition:transform var(--motion-fast) var(--motion-ease),background-color var(--motion-fast) ease,border-color var(--motion-fast) ease}
 .route-link:hover,.service-grid a:hover{transform:translateY(-2px)}
 .button.primary:hover{transform:translateY(-2px)}
 .button.primary span{transition:transform var(--motion-fast) var(--motion-ease)}
 .button.primary:hover span{transform:translate(2px,-2px)}
 .hint summary:hover{transform:none}
}
.button:active,.menu-button:active,.motion-toggle:active{transform:scale(.985)}
.creative-frame{position:relative;border:1px solid var(--line);border-radius:22px;background:var(--raised);overflow:hidden}
.creative-frame img{display:block;width:100%;height:auto;object-fit:contain}
.creative-frame figcaption{font-size:16px;line-height:1.5;padding:14px 18px;color:var(--muted)}
.creative-trace{display:block;height:3px;background:var(--accent);transform-origin:left}
#knives .split{grid-template-columns:minmax(210px,.7fr) minmax(0,1.3fr)}
#knives .creative-frame{align-self:start}
.separation-creative{margin:0 0 22px}
.separation-creative .creative-picture{position:relative}
.zone-divider{position:absolute;left:50%;top:12%;height:76%;width:2px;background:var(--accent);transform-origin:center}
.zone-labels{display:grid;grid-template-columns:1fr 1fr;background:var(--surface);border-bottom:1px solid var(--line)}
.zone-labels span{padding:12px 18px;text-align:center;font-size:18px;font-weight:700;color:var(--text)}
.zone-labels span+span{border-left:1px solid var(--line)}
.separation-creative img{max-height:330px;width:100%;object-fit:contain}
@media(max-width:760px){
 #knives .split{grid-template-columns:1fr}
 #knives .creative-frame{width:min(100%,340px);margin-inline:auto}
 .creative-frame figcaption{font-size:15px;padding:10px 14px}
 .zone-labels span{font-size:16px;padding:10px}
 .motion-controls{align-items:flex-start;gap:8px}
}
html[data-motion=reduced]{scroll-behavior:auto}
html[data-motion=reduced] *,html[data-motion=reduced] *::before,html[data-motion=reduced] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html[data-motion=reduced] .button:hover,html[data-motion=reduced] .button:active,html[data-motion=reduced] .route-link:hover,html[data-motion=reduced] .service-grid a:hover,html[data-motion=reduced] .menu-button:active,html[data-motion=reduced] .motion-toggle:active,html[data-motion=reduced] .button.primary:hover span{transform:none}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .button:hover,.button:active,.route-link:hover,.service-grid a:hover,.menu-button:active,.motion-toggle:active,.button.primary:hover span{transform:none}
}
@media print{.creative-frame,.motion-controls{display:none!important}}