/* Motion vocabulary + simulator panels for the p-hermes deck (loaded after deck.css). */
:root{--mo-mint:#82dec6;--mo-amber:#ffcf86;--mo-coral:#ff9f8f;--mo-blue:#9bc2ff;--mo-line:#879cb3;--mo-panel:#132130;--mo-edge:#304357}

/* ----- scene figure (authored SVG) ----- */
#deck .dk-scene{margin:0;padding:18px 22px;height:100%;max-height:590px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;min-height:0;background:radial-gradient(120% 90% at 30% 20%,#17283b 0,#132130 55%,#101c29 100%);border:1px solid var(--mo-edge);border-radius:12px;position:relative;overflow:hidden}
#deck .dk-scene svg{display:block;width:100%;height:100%;max-height:540px;flex:1 1 auto;overflow:visible}
#deck .dk-scene .dk-caption{margin:10px 0 0}
#deck .dk-scene svg text{font-family:system-ui,-apple-system,"Segoe UI","Noto Sans KR",sans-serif;fill:#edf2fa;font-size:25px;font-weight:650;text-anchor:middle;dominant-baseline:middle}
#deck .dk-scene svg text.sub{font-size:19px;font-weight:450;fill:#b9c7d8}
#deck .dk-scene svg text.lbl{font-size:19px;font-weight:600;fill:#c3d0e0;paint-order:stroke;stroke:#132130;stroke-width:6px}
#deck .dk-scene svg text.warn{fill:var(--mo-coral)}
#deck .dk-scene svg text.ok{fill:var(--mo-mint)}
#deck .dk-scene svg text.left{text-anchor:start}
#deck .dk-scene svg .box{fill:#1b2b3d;stroke:#6c839d;stroke-width:2}
#deck .dk-scene svg .box.hot{fill:#173a39;stroke:var(--mo-mint);stroke-width:2.5}
#deck .dk-scene svg .box.amber{fill:#3a2f1c;stroke:var(--mo-amber)}
#deck .dk-scene svg .box.coral{fill:#3a2224;stroke:var(--mo-coral)}
#deck .dk-scene svg .box.ghost{fill:none;stroke:#4a5f77;stroke-dasharray:6 6}
#deck .dk-scene svg .wire{fill:none;stroke:var(--mo-line);stroke-width:3;marker-end:url(#mo-arrow)}
#deck .dk-scene svg .wire.mint{stroke:var(--mo-mint);marker-end:url(#mo-arrow-mint)}
#deck .dk-scene svg .wire.coral{stroke:var(--mo-coral);marker-end:url(#mo-arrow-coral)}
#deck .dk-scene svg .wire.bare{marker-end:none}

/* draw-in: give paths pathLength="1" and class mo-draw */
#deck .dk-slide.mo-play .mo-draw{stroke-dasharray:1;stroke-dashoffset:1;animation:mo-draw 1s cubic-bezier(.3,.7,.3,1) forwards;animation-delay:calc(var(--d,0) * 140ms + 200ms)}
@keyframes mo-draw{to{stroke-dashoffset:0}}
/* marching dashes for continuous flows */
#deck .mo-flow{stroke-dasharray:10 8;animation:mo-march 1.2s linear infinite}
#deck .mo-flow.slow{animation-duration:2.4s}
@keyframes mo-march{to{stroke-dashoffset:-36}}
/* pop-in for nodes, staggered with --d */
#deck .dk-slide.mo-play .mo-pop{opacity:0;transform-box:fill-box;transform-origin:center;animation:mo-pop .55s cubic-bezier(.2,.9,.3,1.25) forwards;animation-delay:calc(var(--d,0) * 140ms)}
@keyframes mo-pop{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:none}}
#deck .dk-slide.mo-play .mo-rise{opacity:0;animation:mo-rise .6s ease-out forwards;animation-delay:calc(var(--d,0) * 120ms)}
@keyframes mo-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* pulsing halo behind the focused node */
#deck .mo-pulse{fill:none;stroke:var(--mo-mint);stroke-width:3;transform-box:fill-box;transform-origin:center;animation:mo-pulse 2.2s ease-out infinite}
#deck .mo-pulse.coral{stroke:var(--mo-coral)}
#deck .mo-pulse.amber{stroke:var(--mo-amber)}
@keyframes mo-pulse{0%{opacity:.85;transform:scale(1)}100%{opacity:0;transform:scale(1.28)}}
/* packets travelling along a path (positioned by motion.js) */
#deck .mo-pkt{fill:var(--mo-mint);filter:drop-shadow(0 0 6px rgba(130,222,198,.9))}
#deck .mo-pkt.amber{fill:var(--mo-amber);filter:drop-shadow(0 0 6px rgba(255,207,134,.9))}
#deck .mo-pkt.coral{fill:var(--mo-coral);filter:drop-shadow(0 0 6px rgba(255,159,143,.9))}
#deck .mo-pkt.blue{fill:var(--mo-blue);filter:drop-shadow(0 0 6px rgba(155,194,255,.9))}
/* stamp / shake for blocked states */
#deck .dk-slide.mo-play .mo-shake{animation:mo-shake .5s ease-in-out 1.2s 2}
@keyframes mo-shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
#deck .mo-blink{animation:mo-blink 1.6s ease-in-out infinite}
@keyframes mo-blink{50%{opacity:.35}}
/* step builds: [data-build=n] hidden until the n-th press */
#deck [data-build]{opacity:0;transition:opacity .45s ease,transform .45s ease;transform:translateY(8px)}
#deck svg [data-build]{transform:none}
#deck [data-build].built{opacity:1;transform:none}
#deck .dk-count{min-width:100px;text-align:right}
#deck .dk-p.mo-hint{font-size:19px!important;color:#93a6bb!important}

/* ----- cover hero ----- */
#deck .dk-cover .dk-title{font-size:64px;line-height:1.3}
#deck .dk-cover .dk-title em{font-style:normal;color:#82dec6}


/* ----- slide entrance: every slide arrives with motion ----- */
#deck .dk-slide.is-active .dk-eyebrow{animation:mo-in-left .5s ease-out both}
#deck .dk-slide.is-active .dk-title{animation:mo-in-left .6s cubic-bezier(.2,.8,.2,1) .05s both}
#deck .dk-slide.is-active .dk-body{animation:mo-in-up .7s cubic-bezier(.2,.8,.2,1) .15s both}
#deck .dk-slide.is-active .dk-copy .dk-p{animation:mo-in-up .6s ease-out both}
#deck .dk-slide.is-active .dk-copy .dk-p:nth-child(2){animation-delay:.45s}
#deck .dk-slide.is-active .dk-copy .dk-p:nth-child(3){animation-delay:.7s}
#deck .dk-slide.is-active .dk-foot{animation:mo-fade .8s ease-out .5s both}
@keyframes mo-in-left{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:none}}
@keyframes mo-in-up{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes mo-fade{from{opacity:0}to{opacity:1}}

#deck .dk-slide{z-index:1}


/* ----- interlude: one big statement to switch the mood ----- */
#deck .dk-interlude{display:none;place-items:center;text-align:center;padding:120px 160px}
#deck .dk-interlude.is-active{display:grid!important;grid-template-rows:1fr}
#deck .dk-interlude .dk-head,#deck .dk-interlude .dk-foot{display:none}
#deck .dk-interlude .dk-inner{position:relative;z-index:1}
#deck .dk-interlude .dk-kicker{font:700 22px system-ui,sans-serif;letter-spacing:.3em;color:#82dec6;margin:0 0 30px}
#deck .dk-interlude .dk-big{margin:0;font-size:84px;line-height:1.32;font-weight:800;letter-spacing:-.03em;color:#f4f7fb;text-wrap:balance}
#deck .dk-interlude .dk-big .w{display:inline-block;opacity:0;transform:translateY(40px) scale(.96);animation:mo-word .7s cubic-bezier(.2,.9,.3,1.2) forwards;animation-delay:calc(var(--i) * 110ms + 300ms)}
#deck .dk-interlude .dk-big em{font-style:normal;color:#82dec6}
#deck .dk-interlude .dk-sub{margin:34px auto 0;max-width:1000px;font-size:30px;line-height:1.55;color:#bdcbdc;opacity:0;animation:mo-fade 1s ease-out 1.6s forwards}
@keyframes mo-word{to{opacity:1;transform:none}}

/* ----- self-playing demo panel ----- */
#deck .dk-sim .dk-body{grid-template-columns:minmax(0,1fr) 380px;gap:34px}
#deck .sim{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;height:100%;max-height:600px;min-height:0;background:#0f1a27;border:1px solid var(--mo-edge);border-radius:14px;overflow:hidden;font-size:18px}
#deck .sim p{max-width:none}
#deck .sim-head{display:flex;align-items:center;gap:14px;padding:12px 18px;border-bottom:1px solid #26384b;background:#132130}
#deck .sim-tag{font:700 13px ui-monospace,monospace;letter-spacing:.18em;color:#b7a6ff;border:1px solid #7d6bd6;border-radius:999px;padding:3px 11px}
#deck .sim-head b{font-size:21px;color:#f4f7fb}
#deck .sim-live{margin-left:auto;font-size:14px;color:#ff9f8f;display:flex;align-items:center;gap:7px}
#deck .sim-live::before{content:"";width:9px;height:9px;border-radius:50%;background:#ff6b5a;animation:mo-blink 1.2s ease-in-out infinite}
#deck .sim-view{padding:16px 20px;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:12px;justify-content:center}
#deck .sim-metrics{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #26384b}
#deck .sim-metric{padding:10px 16px;border-right:1px solid #26384b;min-width:0;transition:background .3s}
#deck .sim-metric:last-child{border-right:0}
#deck .sim-metric span{display:block;font-size:14px;color:#9fb0c4}
#deck .sim-metric strong{display:block;font:700 20px system-ui,sans-serif;color:#f4f7fb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#deck .sim-metric[data-kind=manager]{background:#173a39}
#deck .sim-metric[data-kind=worker]{background:#2c2a5a}
#deck .sim-metric[data-kind=stop]{background:#4a2326}
#deck .sim-say{margin:0;padding:11px 20px;font-size:21px;line-height:1.4;color:#f4f7fb;background:#152234;border-top:1px solid #26384b;min-height:54px;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#deck .sim-flash{animation:mo-flashbg .8s ease-out}
@keyframes mo-flashbg{0%{background-color:rgba(130,222,198,.35)}100%{background-color:transparent}}
#deck .sim-case{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 16px;border-radius:12px;background:#2a2550;border:1px solid #7d6bd6}
#deck .sim-case b{font-size:22px;color:#fff;margin-right:6px}
#deck .sim-case i{font-style:normal;font-size:15px;padding:4px 10px;border-radius:999px;background:#3a3470;color:#dcd6ff}
#deck .sim-case-n{font-size:14px;color:#b7a6ff;margin-right:4px}
#deck .sim-flow{display:flex;flex-direction:column;gap:7px}
#deck .sim-q{display:grid;grid-template-columns:1fr auto;gap:0 12px;padding:6px 14px;border:1px solid #2f4258;border-radius:10px;background:#152234;opacity:.5;transition:all .35s}
#deck .sim-q b{font-size:19px}
#deck .sim-q span{grid-column:1;font-size:14px;color:#9fb0c4}
#deck .sim-q em{grid-row:1/3;grid-column:2;align-self:center;font-style:normal;font-weight:800;font-size:20px;color:#c3d0e0}
#deck .sim-q.pass{opacity:.9}
#deck .sim-q.hit{opacity:1;border-color:var(--mo-amber);box-shadow:0 0 0 3px rgba(255,207,134,.18)}
#deck .sim-q.hit em{color:var(--mo-amber)}
#deck .sim-tabs{display:flex;flex-wrap:wrap;gap:6px}
#deck .sim-tabs span{font-size:15px;padding:5px 11px;border-radius:999px;background:#16243a;color:#9fb0c4;transition:all .3s}
#deck .sim-tabs span.on{background:#e9eef7;color:#3b2fb0;font-weight:700}
#deck .sim-card{padding:18px 22px;border-radius:12px;border:1px solid #3c516a;background:#152234;display:flex;flex-direction:column;gap:10px;flex:1;justify-content:center}
#deck .sim-card[data-kind=ok]{border-color:var(--mo-mint)}
#deck .sim-card[data-kind=warn]{border-color:var(--mo-amber)}
#deck .sim-card[data-kind=stop]{border-color:var(--mo-coral)}
#deck .sim-card p{margin:0;font-size:24px;opacity:0;animation:mo-rise .45s ease-out forwards;animation-delay:calc(var(--d,0) * 260ms)}
#deck .sim-svg{width:100%;height:auto;max-height:300px;flex:0 0 auto}
#deck .sim-svg text{font:650 19px system-ui,sans-serif;fill:#edf2fa;text-anchor:middle}
#deck .sim-rail{stroke:#3a4f66;stroke-width:6;stroke-linecap:round;fill:none}
#deck .sim-node circle{fill:#1b2b3d;stroke:#6c839d;stroke-width:3;transition:fill .4s,stroke .4s}
#deck .sim-node.done circle{fill:#173a39;stroke:var(--mo-mint)}
#deck .sim-node text.f{font:500 15px ui-monospace,monospace;fill:#b9c7d8}
#deck .sim-token{fill:var(--mo-amber);filter:drop-shadow(0 0 8px rgba(255,207,134,.9));transition:transform .8s cubic-bezier(.3,.8,.3,1),cx .6s,cy .6s}
#deck .sim-barrier{opacity:0;transition:opacity .3s}
#deck .sim-barrier.on{opacity:1}
#deck .sim-barrier.on rect{animation:mo-shake .4s 2}
#deck .sim-barrier rect{fill:var(--mo-coral)}
#deck .sim-barrier text{fill:var(--mo-coral)!important;font-size:17px!important}
#deck .sim-files{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
#deck .sim-files span{font:600 16px ui-monospace,monospace;padding:6px 12px;border-radius:8px;border:1px solid #3c516a;background:#152234;transition:all .4s}
#deck .sim-files span.ok{border-color:#3e7d70;color:#cdeee6}
#deck .sim-files span.missing{border-color:var(--mo-coral);color:var(--mo-coral);border-style:dashed;animation:mo-blink 1.2s ease-in-out infinite}
#deck .sim-files span.added{background:#173a39;border-color:var(--mo-mint);animation:mo-pop .5s}
#deck .sim-chipstage{height:64px;display:flex;justify-content:center;align-items:center;flex:0 0 auto}
#deck .sim-chip{font-size:14px;line-height:1.35;padding:5px 8px;border-radius:7px;background:#1e3048;border:1px solid #3c516a}
#deck .sim-chip.ok{border-color:var(--mo-mint);animation:mo-pop .45s}
#deck .sim-chipstage .sim-chip{font-size:22px;padding:12px 20px;background:#2a2550;border-color:#7d6bd6;animation:mo-pop .5s cubic-bezier(.2,.9,.3,1.25);transition:transform .7s ease-in,opacity .7s}
#deck .sim-chipstage .sim-chip.gone{transform:translateY(80px) scale(.5);opacity:0}
#deck .sim-shelves{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;flex:1;min-height:0}
#deck .sim-bin{border:1px solid #2f4258;border-radius:10px;background:#152234;padding:8px;display:flex;flex-direction:column;gap:4px;min-height:0;overflow:hidden}
#deck .sim-bin b{font-size:17px;color:var(--mo-mint)}
#deck .sim-bin>span{font-size:13px;color:#9fb0c4}
#deck .sim-bin-items{display:flex;flex-direction:column;gap:4px}
#deck .sim-svg.life{max-height:270px}
#deck .sim-svg.gate{max-height:240px}
#deck .sim-svg .lane{stroke:#26384b;stroke-width:2;stroke-dasharray:4 6}
#deck .sim-svg .lane-l{text-anchor:start;font-size:17px;fill:#c3d0e0;dominant-baseline:middle}
#deck .sim-trail{fill:none;stroke:var(--mo-mint);stroke-width:3;stroke-linejoin:round}
#deck .sim-mark{fill:var(--mo-mint);animation:mo-pop .4s}
#deck .sim-mark.bad{fill:var(--mo-coral)}

/* ----- concept slides: plain-language definitions ----- */
#deck .dk-concept .dk-eyebrow::before{content:"개념 · ";color:#ffcf86}

@media(prefers-reduced-motion:reduce){#deck [data-build]{transition:none}#deck .mo-draw{stroke-dashoffset:0!important}#deck .mo-pop,#deck .mo-rise,#deck .dk-interlude .w,#deck .dk-interlude .dk-sub{opacity:1!important;transform:none!important}#deck::before{animation:none}}
#deck .dk-cover .dk-scene svg{max-height:430px}

/* ===== typography & reading flow (2026-10-07) =====
   Eye path: eyebrow → title → key sentence (left) → animated diagram (right) → next question. */
@font-face{font-family:"Pretendard";src:url("fonts/pretendard-subset.woff2") format("woff2-variations"),url("fonts/pretendard-subset.woff2") format("woff2");font-weight:100 900;font-display:swap}
body.dk,body.dk *{font-family:"Pretendard",system-ui,-apple-system,"Segoe UI","Noto Sans KR",sans-serif!important}
#deck .dk-scene svg text,#deck .sim-svg text{font-family:"Pretendard",system-ui,sans-serif!important}
#deck code,#deck .sim-files span,#deck .sim-node text.f{font-family:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace!important}
#deck .dk-slide{padding:78px 72px 36px;row-gap:18px}
#deck .dk-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:17px;font-weight:700;letter-spacing:.06em;color:#0f1a27;background:#82dec6;border-radius:999px;padding:5px 14px}
#deck .dk-concept .dk-eyebrow{background:#ffcf86}
#deck .dk-concept .dk-eyebrow::before{content:"개념";color:#0f1a27;opacity:.7}
#deck .dk-count{font-size:17px;color:#7f93a9;letter-spacing:.08em}
#deck .dk-title{font-size:54px;font-weight:800;line-height:1.3;letter-spacing:-.035em;color:#f6f8fc;max-width:1456px}
#deck .dk-cover .dk-title{font-size:66px;line-height:1.24}
#deck .dk-body{grid-template-columns:430px minmax(0,1fr);gap:48px;align-items:center}
#deck .dk-cover .dk-body,body:not(.dk-course-00) #deck .dk-cover .dk-body{grid-template-columns:430px minmax(0,1fr)}
#deck .dk-sim .dk-body{grid-template-columns:380px minmax(0,1fr);gap:40px}
#deck .dk-text .dk-body{grid-template-columns:minmax(0,900px)}
#deck .dk-copy{border-left:0;padding:0;gap:22px;align-self:center}
#deck .dk-p{font-size:22px;line-height:1.62;color:#b9c7d8;font-weight:400;letter-spacing:-.01em}
#deck .dk-copy .dk-p:first-child{font-size:29px;line-height:1.5;color:#f4f7fb;font-weight:600;letter-spacing:-.02em;position:relative;padding-top:22px}
#deck .dk-copy .dk-p:first-child::before{content:"";position:absolute;left:0;top:0;width:44px;height:5px;border-radius:3px;background:linear-gradient(90deg,#82dec6,#9bc2ff)}
#deck .dk-concept .dk-copy .dk-p:first-child::before{background:linear-gradient(90deg,#ffcf86,#ff9f8f)}
#deck .dk-p+.dk-p{font-size:22px;color:#b9c7d8}
#deck .dk-sim .dk-copy .dk-p:first-child{font-size:25px}
#deck .dk-sim .dk-p+.dk-p{font-size:20px}
#deck .dk-p b{color:#ffffff;font-weight:700}
#deck .dk-p code{font-size:.86em;color:#ffcf86;background:rgba(255,207,134,.08);padding:1px 6px;border-radius:5px}
#deck .dk-scene{border-radius:18px;border-color:#2b4058;box-shadow:0 18px 50px rgba(0,0,0,.28)}
#deck .dk-foot{grid-template-columns:1fr 1.2fr;min-height:58px;padding-top:14px;border-top:1px solid #2a3c52}
#deck .dk-prev{font-size:18px;color:#8296ac}
#deck .dk-prev b,#deck .dk-next b{font-size:14px;letter-spacing:.08em}
#deck .dk-next{font-size:23px;color:#eef3fa;font-weight:600;justify-self:end;text-align:right}
#deck .dk-next::after{content:" →";display:inline-block;color:#82dec6;margin-left:6px}
#deck .dk-slide.is-active .dk-next::after{animation:mo-nudge 1.4s ease-in-out 3s infinite}
@keyframes mo-nudge{0%,100%{transform:none}50%{transform:translateX(8px)}}
/* reading order: text first, then the diagram, the next question last */
#deck .dk-slide.is-active .dk-copy .dk-p:first-child{animation:mo-in-up .6s ease-out .2s both}
#deck .dk-slide.is-active .dk-copy .dk-p:nth-child(2){animation-delay:.55s}
#deck .dk-slide.is-active .dk-copy .dk-p:nth-child(3){animation-delay:.8s}
#deck .dk-slide.is-active .dk-body>figure,#deck .dk-slide.is-active .dk-body>.sim{animation:mo-in-up .7s cubic-bezier(.2,.8,.2,1) .45s both}
#deck .dk-slide.is-active .dk-body{animation:none}
#deck .dk-slide.mo-play .mo-draw{animation-delay:calc(var(--d,0) * 140ms + 700ms)}
#deck .dk-slide.mo-play .mo-pop{animation-delay:calc(var(--d,0) * 120ms + 500ms)}
#deck .dk-slide.is-active .dk-prev{animation:mo-fade .6s ease-out .3s both}
#deck .dk-slide.is-active .dk-next{animation:mo-in-left .6s ease-out 2.2s both}
#deck .dk-slide.is-active .dk-foot{animation:none}
#deck .dk-interlude .dk-big{font-size:88px;font-weight:800;letter-spacing:-.04em}
#deck .dk-interlude .dk-sub{font-size:30px;font-weight:500;color:#c6d3e3}
#deck .dk-interlude .dk-kicker{font-size:20px;font-weight:700;letter-spacing:.34em}
#deck .sim-head b{font-weight:700}
#deck .sim-say{font-weight:500}
#deck .dk-next{padding-right:16px}
/* wide strip diagrams: copy runs across the top, the scene takes the full width below */
#deck .dk-wide .dk-body{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:22px;align-items:stretch}
#deck .dk-wide .dk-copy{flex-direction:row;align-items:flex-start;gap:48px;padding:2px 0 2px 28px}
#deck .dk-wide .dk-p{flex:1.25 1 0;font-size:27px}
#deck .dk-wide .dk-p+.dk-p{flex:1 1 0;font-size:22px}
#deck .dk-wide .dk-scene{max-height:none;padding:14px 28px}
#deck .dk-wide .dk-scene svg{max-height:none}
@media(max-width:760px){#deck .dk-wide .dk-copy{flex-direction:column;gap:16px}}

/* New evidence pages use the original two-column lecture frame. */
#deck .mobile-relationship,#deck .sim-static{display:none}
#deck .example-scene{justify-content:center;gap:18px}
#deck .example-pair{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:stretch}
#deck .example-doc{padding:24px 26px;border:1px solid #40566e;background:#17283b;border-radius:14px;min-width:0}
#deck .example-doc h3,#deck .rule-document h3{font-size:24px;line-height:1.35;color:#82dec6;margin:0 0 20px}
#deck .example-doc p{font-size:27px;line-height:1.55;color:#edf2fa;margin:12px 0;word-break:keep-all}
#deck .example-doc.result{border-color:#82dec6;background:#173633}
#deck .example-doc.warning{border-color:#ffcf86;background:#302b25}
#deck .example-note{font-size:18px;line-height:1.45;color:#a9bdd1;margin:0}
#deck .request-document{border:1px solid #3f566e;border-radius:14px;overflow:hidden;background:#152638}
#deck .request-document>div{display:grid;grid-template-columns:145px 1fr;gap:24px;padding:22px 26px;border-bottom:1px solid #30465c;font-size:25px;line-height:1.5}
#deck .request-document>div:last-child{border:0}
#deck .request-document b{color:#82dec6}
#deck .state-change{display:flex;align-items:center;justify-content:center;gap:30px}
#deck .state-change>div{border:2px solid #82dec6;border-radius:14px;padding:34px;display:grid;gap:16px;min-width:200px;text-align:center;background:#173633;font-size:32px}
#deck .state-change small{display:block;font-size:20px;color:#adc1d4}
#deck .relation-arrow{font-size:46px;text-align:center;color:#82dec6}
#deck .transition-condition{border-top:1px solid #40566e;padding:25px;text-align:center;font-size:25px;color:#ffcf86}
#deck .transition-condition p{margin:10px 0 0;color:#edf2fa}
#deck .rule-document{padding:26px;border:1px solid #82dec6;border-radius:14px;background:#173633}
#deck .rule-document p{font-size:29px;line-height:1.5;margin:0}
#deck .rule-application{display:flex;align-items:center;justify-content:space-around;gap:16px;font-size:27px;padding:20px;border:1px solid #40566e;border-radius:12px}
#deck .rule-application strong{color:#82dec6}
#deck .lesson-chain{display:grid;grid-template-columns:1fr 1fr;gap:16px}
#deck .lesson-chain .example-doc{padding:18px 22px}
#deck .lesson-chain .example-doc h3{margin-bottom:8px;font-size:22px}
#deck .lesson-chain .example-doc p{font-size:25px;margin:0}
#deck .transfer-exercise{display:grid;gap:20px}
#deck [data-quiz-reveal]{justify-self:start;padding:10px 22px;border:1px solid #82dec6;color:#edf2fa;background:#173633;border-radius:8px;font:600 21px inherit;cursor:pointer}
#deck [hidden]{display:none!important}
#deck.mo-paused *,#deck.mo-paused::before,#deck.mo-paused::after,#deck.mo-paused *::before,#deck.mo-paused *::after{animation-play-state:paused!important}
#deck .sim-head{flex-wrap:wrap}
#deck .sim-scenarios{display:flex;gap:7px;margin-left:auto}
#deck .sim-scenarios button{font:600 14px inherit;padding:5px 10px;color:#edf2fa;background:#1b2b3d;border:1px solid #52677e;border-radius:6px;cursor:pointer}
#deck .sim-scenarios button[aria-pressed=true]{border-color:#82dec6;background:#173633}
#deck .sim-say{white-space:normal;text-overflow:clip;overflow:visible;min-height:64px}
#deck .sim-metric strong{white-space:normal;overflow:visible;text-overflow:clip;font-size:19px;line-height:1.3}
.dk-controls [data-motion-pause],.dk-controls [data-motion-restart]{font-size:15px;padding:5px 12px;min-width:0}
@media(max-width:760px){
 .dk-viewport{inset:0 0 56px;overflow:hidden}
 .dk-stage{width:100%!important;height:100%!important;left:0!important;top:0!important;transform:none!important;position:relative!important}
 .dk-brand{display:none}
 #deck .dk-slide{padding:16px 18px 12px;gap:12px;grid-template-rows:auto auto minmax(0,1fr) auto}
 #deck .dk-eyebrow{font-size:12px;padding:4px 9px;letter-spacing:0}
 #deck .dk-count{font-size:12px;min-width:0}
 #deck .dk-title,#deck .dk-cover .dk-title{font-size:25px;line-height:1.3;max-width:none}
 #deck .dk-body,#deck .dk-cover .dk-body,#deck .dk-sim .dk-body,#deck .dk-wide .dk-body{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:12px;align-items:stretch}
 #deck .dk-copy,#deck .dk-wide .dk-copy{padding:0;gap:8px;flex-direction:column;align-self:start}
 #deck .dk-copy .dk-p,#deck .dk-copy .dk-p:first-child,#deck .dk-copy .dk-p+.dk-p,#deck .dk-wide .dk-p{font-size:15px;line-height:1.45;padding:0;color:#c3d1df}
 #deck .dk-copy .dk-p:first-child{font-size:17px;color:#f4f7fb}
 #deck .dk-copy .dk-p:first-child::before{display:none}
 #deck .dk-scene{height:100%;max-height:none;padding:12px;justify-content:center;gap:10px;border-radius:12px}
 #deck .dk-scene>.mobile-relationship{display:flex;flex-direction:column;gap:12px;justify-content:center;min-height:0}
 #deck .dk-scene:has(>.mobile-relationship)>svg{display:none}
 #deck .relation-node{position:relative;padding:12px 14px;border:1px solid #526a80;border-radius:10px;background:#1b2e40;text-align:center;font-size:17px;line-height:1.35;color:#edf2fa}
 #deck .relation-node+.relation-node::before{content:'↓';position:absolute;left:calc(50% - 7px);top:-17px;color:#82dec6;font-size:16px;animation:mo-blink 2.4s infinite}
 #deck .dk-foot{grid-template-columns:1fr;gap:0;min-height:0;padding-top:8px}
 #deck .dk-prev{display:none}
 #deck .dk-next{font-size:14px;line-height:1.4;justify-self:start;text-align:left}
 #deck .dk-next b{font-size:10px;margin-bottom:2px}
 #deck .dk-next::after{display:none}
 #deck .dk-progress{left:18px;right:18px}
 #deck .dk-interlude.is-active{padding:30px;grid-template-rows:1fr;place-items:center}
 #deck .dk-interlude .dk-big{font-size:34px;line-height:1.4}
 #deck .dk-interlude .dk-sub{font-size:20px;margin-top:24px;line-height:1.55}
 #deck .dk-interlude .dk-kicker{font-size:13px;letter-spacing:.1em;margin-bottom:18px}
 #deck .example-pair{grid-template-columns:1fr;gap:10px}
 #deck .example-doc{padding:12px 15px;border-radius:10px}
 #deck .example-doc h3,#deck .rule-document h3{font-size:16px;margin:0 0 7px}
 #deck .example-doc p{font-size:17px;line-height:1.4;margin:4px 0}
 #deck .example-note{font-size:12px;line-height:1.4}
 #deck .request-document>div{grid-template-columns:65px 1fr;gap:10px;padding:12px 10px;font-size:15px;line-height:1.45}
 #deck .state-change{gap:12px}
 #deck .state-change>div{min-width:0;padding:18px 14px;font-size:24px;gap:10px}
 #deck .state-change small{font-size:13px}
 #deck .relation-arrow{font-size:30px}
 #deck .transition-condition{padding:12px 0;font-size:17px}
 #deck .rule-document{padding:18px}
 #deck .rule-document p{font-size:18px;line-height:1.5}
 #deck .rule-application{font-size:16px;padding:12px;gap:8px}
 #deck .lesson-chain{grid-template-columns:1fr 1fr;gap:8px}
 #deck .lesson-chain .example-doc{padding:11px}
 #deck .lesson-chain .example-doc h3{font-size:14px;margin-bottom:6px}
 #deck .lesson-chain .example-doc p{font-size:16px}
 #deck .transfer-exercise{gap:12px}
 #deck [data-quiz-reveal]{font-size:16px;padding:8px 14px}
 #deck .sim{height:100%;max-height:none;min-height:0;grid-template-rows:auto minmax(0,1fr) auto auto}
 #deck .sim-head{padding:8px 10px;gap:6px}
 #deck .sim-head b{font-size:15px}
 #deck .sim-tag{font-size:10px;padding:2px 6px}
 #deck .sim-live{font-size:11px}
 #deck .sim-scenarios{width:100%;margin:0;justify-content:center}
 #deck .sim-scenarios button{font-size:12px}
 #deck .sim-view{padding:10px;gap:10px}
 #deck .sim-case{padding:8px;gap:5px}
 #deck .sim-case b{font-size:17px}
 #deck .sim-case i{font-size:11px;padding:3px 6px}
 #deck .sim-q{padding:7px;gap:0 5px}
 #deck .sim-q b{font-size:13px}
 #deck .sim-q span{font-size:11px}
 #deck .sim-q em{font-size:16px}
 #deck .sim-metric{padding:7px}
 #deck .sim-metric span{font-size:11px}
 #deck .sim-metric strong{font-size:13px}
 #deck .sim-say{font-size:15px;padding:10px;min-height:58px;line-height:1.35}
 #deck .sim-card{padding:10px;gap:8px}
 #deck .sim-card p{font-size:16px}
 #deck .sim-tabs{gap:4px}
 #deck .sim-tabs span{font-size:11px;padding:4px 6px}
 #deck .sim-bin{display:none}
 #deck .sim-bin.is-target{display:flex;grid-column:1/-1;min-height:60px;padding:10px;font-size:16px}
 #deck .sim-shelves{grid-template-columns:1fr;min-height:60px}
 #deck .sim-chipstage{min-height:65px}
 #deck .sim-chip{font-size:15px}
 #deck .sim-bin b{font-size:17px}
 #deck .sim-bin span{font-size:13px}
 #deck .sim-static{font-size:17px;line-height:1.5}
 .dk-controls{height:56px;padding:0 8px;gap:6px}
 .dk-controls .dk-lecs,.dk-controls .dk-lec,.dk-controls [data-fs]{display:none}
 .dk-controls .dk-home{font-size:12px;margin-right:0}
 .dk-controls .dk-live-count{font-size:12px;min-width:38px}
 .dk-controls button{height:34px;min-width:30px;padding:0 7px;font-size:16px}
 .dk-controls [data-motion-pause],.dk-controls [data-motion-restart]{font-size:11px;padding:0 6px}
}
@media(prefers-reduced-motion:reduce){
 #deck [data-sim]{display:none}
 #deck .sim-static{display:flex;align-items:center;justify-content:center;padding:24px;border:1px solid #40566e;border-radius:12px;background:#172638;font-size:24px;line-height:1.6}
 #deck .relation-node::before,#deck .mo-flow,#deck .mo-pulse,#deck .mo-blink{animation:none}
}

/* Final screen-review corrections: semantic relationships and compact hero width. */
#deck .mobile-info,#deck .sim-mobile-actors{display:none}
#deck .dk-scene svg text.lbl{fill:#bdcddd}
#deck .dk-scene svg text.lbl.warn{fill:#ff9f8f}
@media(max-width:760px){
 body.dk #deck .dk-slide .dk-body{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(0,1fr)!important}
 #deck .relation-parts .relation-node::before{display:none}
 #deck .relation-parts{gap:8px!important}
 #deck .relation-alternatives{display:grid!important;grid-template-columns:1fr 1fr}
 #deck .desktop-info{display:none}
 #deck .mobile-info{display:block;font-size:13px;line-height:1.45;color:#b9cddd;margin:0}
 #deck .sim-mobile-actors{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:8px}
 #deck .life-actor{font-size:17px;line-height:1.35;padding:12px 6px;border:1px solid #526a80;border-radius:9px;text-align:center;position:relative;color:#b5c6d5;background:#172638}
 #deck .life-actor.is-current{color:#edf2fa;border-color:#82dec6;background:#173633;font-weight:700}
 #deck .life-actor.is-current::after{content:'';position:absolute;inset:-3px;border:2px solid #82dec6;border-radius:11px;animation:mo-focus-glow 2s ease-in-out infinite;pointer-events:none}
 #deck .sim-svg.life{display:none}
}
@keyframes mo-focus-glow{0%,100%{opacity:.2}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){#deck .life-actor::after{animation:none}}
#deck .sim-mobile-gates{display:none}
@media(max-width:760px){
 #deck .sim-flow .sim-q{display:none}
 #deck .sim-flow .sim-q.is-active{display:grid}
 #deck .sim-tabs span:not(.on){display:none}
 #deck .sim-tabs span.on{font-size:14px;padding:5px 8px}
 #deck .sim-chipstage{min-height:0}
 #deck .sim-chipstage:has(.gone){display:none}
 #deck .sim-bin.is-target{min-height:0;padding:8px}
 #deck .sim-svg.gate{display:none}
 #deck .sim-mobile-gates{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 #deck .gate-state{font-size:17px;line-height:1.25;padding:12px;border:1px solid #526a80;border-radius:9px;text-align:center;background:#172638}
 #deck .gate-state.is-current{color:#edf2fa;border-color:#82dec6;background:#173633;font-weight:700}
 #deck .sim-files{gap:4px}
 #deck .sim-files span{font-size:11px;padding:3px 5px}
 #deck .sim-mobile-actors{gap:8px;padding:6px}
 #deck .life-actor{font-size:15px;padding:7px 4px}
}
@media(max-width:760px) and (max-height:750px){
 #deck .dk-slide{padding:12px 16px 10px;gap:8px}
 #deck .dk-body,#deck .dk-sim .dk-body,#deck .dk-wide .dk-body{gap:8px}
 #deck .dk-title,#deck .dk-cover .dk-title{font-size:23px}
 #deck .dk-scene{padding:10px}
 #deck .relation-node{padding:9px 12px;font-size:16px}
}
@media(max-width:760px){
 #deck .dk-sim .dk-copy .dk-p:first-child{font-size:17px;line-height:1.45;padding:0}
}
@media(max-width:760px){
 #deck [data-sim=verdict] .sim-view{padding:8px;gap:8px}
 #deck [data-sim=verdict] .sim-card{flex:0 1 auto;min-height:0;padding:7px;gap:5px;justify-content:flex-start}
 #deck [data-sim=verdict] .sim-card p{font-size:15px;line-height:1.35}
 #deck [data-sim=verdict] .sim-tabs span.on{line-height:1.35}
 #deck .gate-state{padding:10px}
}

/* ----- map reveal and two-way scenes (lecture rework) ----- */
/* unveil: a veil rect over part of a map fades out, layer by layer (--d orders them) */
#deck .mo-unveil{fill:#132130}
#deck .dk-slide.mo-play .mo-unveil{animation:mo-unveil .9s ease-out forwards;animation-delay:calc(var(--d,0) * 900ms + 400ms)}
@keyframes mo-unveil{to{opacity:0}}
/* alternate: two scenarios on the same skeleton crossfade in a 14 s loop */
#deck .mo-alt-b{opacity:0}
#deck .dk-slide.mo-play .mo-alt-a{animation:mo-alt-a 14s ease-in-out infinite}
#deck .dk-slide.mo-play .mo-alt-b{animation:mo-alt-b 14s ease-in-out infinite}
@keyframes mo-alt-a{0%,45%{opacity:1}50%,95%{opacity:0}100%{opacity:1}}
@keyframes mo-alt-b{0%,45%{opacity:0}50%,95%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){#deck .mo-unveil{display:none}#deck .dk-slide .mo-alt-a,#deck .dk-slide .mo-alt-b{animation:none}}
/* grow: a bar fills from the left */
#deck .mo-grow{transform-box:fill-box;transform-origin:left center}
#deck .dk-slide.mo-play .mo-grow{animation:mo-grow 1.8s cubic-bezier(.3,.7,.3,1) .4s both}
@keyframes mo-grow{from{transform:scaleX(0)}to{transform:none}}