/* 원자료 슬라이드 뷰어 — 차례·챕터·썸네일 격자·슬라이드쇼 오버레이의 스타일.
   원자료 면이 source-deck.js 와 짝으로 싣는다. 면 고유 스타일은 각 면에 둔다. */
.doc{display:grid;gap:3rem;margin-block-start:3rem}
@media(min-width:64rem){
.doc{grid-template-columns:14rem minmax(0,1fr);gap:4rem;align-items:start}
.toc{position:sticky;top:2rem;max-height:calc(100vh - 4rem);overflow:auto}
}
.toc{border-block-start:1px solid var(--rule-strong);padding-block-start:1rem}
.toc h2{margin:0 0 .75rem;font-family:var(--font-mono);font-size:var(--micro);
  font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-muted)}
.toc ol{margin:0;padding:0;list-style:none;display:grid;gap:.1rem}
.toc a{display:block;padding:.28rem 0 .28rem .55rem;font-size:.8125rem;line-height:1.45;
  color:var(--ink);text-decoration:none;border-inline-start:2px solid transparent}
.toc a:hover{color:var(--accent-hover)}
.toc .lv2{padding-inline-start:1.4rem;color:var(--ink-muted);font-size:.78125rem}
.toc .part{margin-block-start:.9rem;padding-block-start:.7rem;
  border-block-start:1px solid var(--rule);font-family:var(--font-mono);
  font-size:var(--micro);letter-spacing:.08em;color:var(--ink-faint)}
.toc a[aria-current="true"]{color:var(--accent);border-inline-start-color:var(--accent)}
.doc .body{min-width:0;max-width:var(--measure)}
.doc .body h2{margin:3.5rem 0 1rem;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.45rem,2vw,1.85rem);line-height:1.3;letter-spacing:-.02em;
  display:flex;gap:.75rem;align-items:baseline;scroll-margin-top:2rem}
.doc .body h2:first-child{margin-block-start:0}
.doc .body h3{margin:2.5rem 0 .75rem;font-size:1.0625rem;font-weight:600;
  line-height:1.45;letter-spacing:-.01em;scroll-margin-top:2rem}
.doc .body p{margin:0 0 1.5rem;text-wrap:pretty}
.doc .body ul{margin:0 0 1.5rem;padding-inline-start:1.1rem}
.doc .body li{margin-block-end:.5rem}
.deck{margin-block-start:3rem}
.chap{margin-block-start:4.5rem;padding-block-start:2rem;
  border-block-start:1px solid var(--rule-strong);scroll-margin-top:4rem}
.chap:first-child{margin-block-start:3rem}
.chap__no{margin:0 0 .4rem;font-family:var(--font-mono);font-size:var(--micro);
  letter-spacing:.09em;color:var(--accent)}
.chap__t{margin:0 0 1rem;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.25;letter-spacing:-.02em}
.chap__p{margin:0;max-width:var(--measure);color:var(--ink-muted);
  font-size:.9375rem;line-height:1.75}
.chap__div{position:relative;margin:1.75rem 0 0}
.chap__divimg{display:block;width:100%;padding:0;border:1px solid var(--rule);
  background:#000;cursor:pointer}
.chap__divimg:hover{border-color:var(--accent)}
.chap__divimg img{display:block;width:100%}
.scene{margin-block-start:3rem}
.scene__h{display:flex;gap:.75rem;align-items:baseline;margin:0 0 .5rem}
.scene__r{flex:none;font-family:var(--font-mono);font-size:var(--micro);
  letter-spacing:.08em;color:var(--ink-faint);padding-block-start:.25rem}
.scene__t{margin:0;font-size:1.0625rem;font-weight:600;line-height:1.45;
  letter-spacing:-.01em}
.scene__n{margin:.5rem 0 0;padding-inline-start:1.1rem;max-width:var(--measure);
  color:var(--ink-muted);font-size:.9375rem;line-height:1.7}
.scene__n li{margin-block-end:.35rem}
.cover{position:relative}
.cover__go{position:absolute;right:1rem;bottom:1rem;padding:.5rem .9rem;
  border:1px solid rgba(23,24,26,.3);background:rgba(243,243,239,.92);
  font-family:var(--font-mono);font-size:var(--micro);font-weight:600;
  letter-spacing:.08em;color:var(--ink);cursor:pointer}
.cover__go:hover{border-color:var(--accent);color:var(--accent-hover)}
.tocfoot{margin:1rem 0 0;font-size:.75rem;line-height:1.9;color:var(--ink-faint)}
.tocfoot__go{margin:.35rem 0;padding:.3rem .6rem;border:1px solid var(--rule-strong);
  background:none;font-family:var(--font-mono);font-size:var(--micro);
  letter-spacing:.08em;color:var(--ink);cursor:pointer}
.tocfoot__go:hover{border-color:var(--accent);color:var(--accent-hover)}
.tgrid{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;gap:1rem .9rem;
  grid-template-columns:repeat(auto-fill,minmax(11rem,1fr))}
.tcell{margin:0;min-width:0}
.tframe{display:block;width:100%;padding:0;border:1px solid var(--rule);
  background:var(--ink);cursor:pointer}
.tframe:hover{border-color:var(--accent)}
.tframe img{display:block;width:100%}
.tno{margin:.3rem 0 0;display:flex;gap:.4rem;align-items:center;
  font-family:var(--font-mono);font-size:var(--micro);letter-spacing:.08em;
  color:var(--ink-faint)}
.tno .tag{border:1px solid var(--rule);padding:0 .3rem;color:var(--accent)}
.tcell{scroll-margin-top:1.5rem}
.chap__cta{position:absolute;left:0;right:0;bottom:3%;z-index:1;margin:0;
  padding:0 2.5%;pointer-events:none}
.chap__cta-h{display:inline-block;margin:0 0 .4rem;font-family:var(--font-mono);
  font-size:var(--micro);letter-spacing:.05em;color:rgba(247,247,242,.92);
  background:rgba(11,12,13,.55);padding:.14rem .45rem}
.chap__ctascroll{position:relative;pointer-events:auto;overflow-y:auto;
  scrollbar-width:none;-ms-overflow-style:none;--ft:0px;--fb:0px;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--ft),#000 calc(100% - var(--fb)),transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 var(--ft),#000 calc(100% - var(--fb)),transparent 100%)}
.chap__ctascroll::-webkit-scrollbar{display:none}
.chap__ctagrid{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(12,1fr);gap:3px}
.chap__ct{position:relative;display:block;border:1px solid rgba(150,150,150,.45);
  background:#000;text-decoration:none;pointer-events:auto}
.chap__ct:hover{border-color:var(--accent);outline:1px solid var(--accent)}
.chap__ct img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.chap__ctn{position:absolute;left:0;bottom:0;padding:0 .2rem;font-family:var(--font-mono);
  font-size:9px;line-height:1.55;letter-spacing:.02em;color:#F7F7F2;
  background:rgba(11,12,13,.72)}
.chap__ctn b{color:#8AB0FF;font-weight:400}
@media(max-width:47.99rem){
.chap__cta{position:static;margin:.6rem 0 0;padding:0;pointer-events:auto}
.chap__ctagrid{grid-template-columns:repeat(5,1fr)}
.chap__cta-h{color:var(--ink-muted);background:none;padding:0}
}
.pv[hidden]{display:none}
.pv{position:fixed;inset:0;z-index:60;background:#0B0C0D;color:#F7F7F2;
  display:grid;grid-template-rows:auto minmax(0,1fr) auto auto}
.pv__bar{display:flex;align-items:center;gap:.5rem;padding:.6rem .9rem;
  border-block-end:1px solid rgba(247,247,242,.18);
  font-family:var(--font-mono);font-size:var(--micro);letter-spacing:.09em}
.pv__sp{flex:1}
.pv__id{color:rgba(247,247,242,.55)}
.pv__ch{color:rgba(247,247,242,.8);overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;max-width:22rem}
.pv__no b{color:#F7F7F2;font-weight:600}
.pv__no{color:rgba(247,247,242,.55);margin-inline-end:.35rem}
.pv button{background:none;border:1px solid rgba(247,247,242,.35);color:#F7F7F2;
  font-family:var(--font-mono);font-size:var(--micro);letter-spacing:.08em;
  padding:.3rem .6rem;cursor:pointer}
.pv button:hover{border-color:#F7F7F2}
.pv button[aria-pressed="true"]{background:rgba(247,247,242,.14)}
.pv__body{display:flex;align-items:stretch;gap:.5rem;padding:.9rem;min-height:0}
.pv__arrow{flex:none;align-self:center;width:2.4rem;height:3.4rem;
  font-size:1.5rem;line-height:1;border-color:rgba(247,247,242,.22)!important}
.pv__arrow:disabled{opacity:.25;cursor:default}
.pv__fit{flex:1;min-width:0;min-height:0;display:flex;
  align-items:center;justify-content:center}
.pv__stage{position:relative;flex:none;background:#000;overflow:hidden;
  border:1px solid rgba(247,247,242,.18)}
.pv__stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.pv__v{position:absolute;padding:0;background:#000;overflow:hidden}
.pv__v iframe,.pv__v video{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:fill;background:#000}
.pv__notes{padding:.2rem .9rem .9rem;height:8.5rem;overflow:auto;
  scrollbar-width:thin;
  --ft:transparent 0,#000 0;
  --fb:#000 calc(100% - 1.6rem),transparent 100%;
  -webkit-mask-image:linear-gradient(to bottom,var(--ft)),linear-gradient(to bottom,var(--fb));
  mask-image:linear-gradient(to bottom,var(--ft)),linear-gradient(to bottom,var(--fb));
  -webkit-mask-composite:source-in;mask-composite:intersect}
.pv__notes[data-top="1"]{--ft:transparent 0,#000 1.6rem}
.pv__notes[data-bot="0"]{--fb:#000 100%,#000 100%}
.pv__notes ul{margin:0;padding-inline-start:1.1rem;max-width:60rem}
.pv__notes li{margin-block-end:.3rem;font-size:.8125rem;line-height:1.65;
  color:rgba(247,247,242,.8)}
.pv__notes .sc{margin:0 0 .4rem;font-family:var(--font-mono);font-size:var(--micro);
  letter-spacing:.08em;color:rgba(247,247,242,.5)}
.pv__notes .none{margin:0;font-size:.8125rem;color:rgba(247,247,242,.55)}
.pv__rail{display:flex;gap:1px;padding:0 .9rem .8rem}
.pv__rail span{flex:1;height:3px;background:rgba(247,247,242,.18)}
.pv__rail span.on{background:rgba(247,247,242,.85)}
.pv__rail span.cut{margin-inline-start:5px}
.pv__sorter[hidden]{display:none}
.pv__sorter{position:absolute;inset:0;z-index:3;background:#0B0C0D;
  display:grid;grid-template-rows:auto minmax(0,1fr)}
.pv__sortbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.6rem .9rem;border-block-end:1px solid rgba(247,247,242,.18);
  font-family:var(--font-mono);font-size:var(--micro);letter-spacing:.09em;
  color:rgba(247,247,242,.7)}
.pv__sortbar button{background:none;border:1px solid rgba(247,247,242,.35);
  color:#F7F7F2;font-family:var(--font-mono);font-size:var(--micro);
  letter-spacing:.08em;padding:.3rem .6rem;cursor:pointer}
.pv__sortbar button:hover{border-color:#F7F7F2}
.pv__sgrid{list-style:none;margin:0;padding:.9rem;overflow:auto;
  display:grid;gap:.7rem;grid-template-columns:repeat(auto-fill,minmax(9rem,1fr));
  align-content:start}
.pv__sc{display:block;width:100%;padding:0;border:1px solid rgba(247,247,242,.18);
  background:#000;cursor:pointer;position:relative}
.pv__sc:hover{border-color:rgba(247,247,242,.7)}
.pv__sc.now{border-color:#F7F7F2;outline:1px solid #F7F7F2}
.pv__sc img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.pv__scn{position:absolute;left:0;bottom:0;padding:.1rem .35rem;
  font-family:var(--font-mono);font-size:var(--micro);letter-spacing:.06em;
  color:#F7F7F2;background:rgba(11,12,13,.7)}
.pv__scn b{color:#8AB0FF;font-weight:400}
@media(max-width:47.99rem){
.pv__bar{flex-wrap:wrap;gap:.4rem}
.pv__ch{order:9;flex-basis:100%;max-width:none}
.pv__body{flex-wrap:wrap;justify-content:center;align-content:flex-start;
    padding:.75rem .5rem}
.pv__fit{flex:0 0 100%;order:1}
.pv__arrow{order:2;flex:1;width:auto;max-width:10rem;height:2.6rem;
    margin-block-start:.7rem;font-size:1.1rem}
}