/* 덱 스킨 — 생성물(발표자료)의 디자인 언어. 앱 UI(하이라이터 노트)와 의도적으로 다른 세계다:
   슬라이드는 하진이 고른 템플릿(사파리)의 팔레트·에이투지체를 입는다. 스킨이 늘어나는 자리. */
/* ── 웹 덱(M27) — 사파리 스킨: LLM은 내용만, 조판은 이 CSS가 결정한다 ── */
@font-face{font-family:A2Z; src:url(/fonts/a2z-400.woff2) format("woff2"); font-weight:400; font-display:swap}
@font-face{font-family:A2Z; src:url(/fonts/a2z-600.woff2) format("woff2"); font-weight:600; font-display:swap}
@font-face{font-family:A2Z; src:url(/fonts/a2z-700.woff2) format("woff2"); font-weight:700; font-display:swap}
@font-face{font-family:A2Z; src:url(/fonts/a2z-900.woff2) format("woff2"); font-weight:900; font-display:swap}
.deck-wrap{max-width:880px; margin:0 auto}
.slide{container-type:inline-size; aspect-ratio:16/9; background:#fff; border-radius:12px;
  overflow:hidden; box-shadow:0 1px 4px rgba(0,0,0,.10); margin:18px 0; position:relative;
  color:#23232A; font-family:Pretendard,"Apple SD Gothic Neo",sans-serif}
.sk-chrome{height:7.4cqw; background:#1F1F26; display:flex; align-items:center; padding:0 3cqw; gap:1.2cqw}
.sk-chrome i{width:1.7cqw; height:1.7cqw; border-radius:50%}
.sk-chrome i:nth-child(1){background:#FF5F57}.sk-chrome i:nth-child(2){background:#FEBC2E}.sk-chrome i:nth-child(3){background:#28C840}
.sk-chrome span{margin:0 auto; background:#3A3A42; color:#B9B9C0; border-radius:2cqw;
  font-size:1.9cqw; padding:.5cqw 4cqw; letter-spacing:.04em}
.sk-body{position:absolute; inset:7.4cqw 0 0 0; padding:4.5cqw 6cqw; display:flex; flex-direction:column}
.sk-accent{position:absolute; top:0; left:0; width:14cqw; height:2.2cqw; background:#FF4D14}
.sk-title{font-family:A2Z; font-weight:900; letter-spacing:-.02em}
.sl-cover .sk-body{align-items:center; justify-content:center; text-align:center}
.sl-cover .sub{font-size:2.9cqw; color:#6E6E78; margin-bottom:1.6cqw; font-weight:600}
.sl-cover .sk-title{font-size:8.4cqw}
.sl-cover .line{width:9cqw; height:.55cqw; background:#FF4D14; margin-top:3.4cqw}
.sl-toc .idx{font-family:A2Z; font-weight:700; color:#C9C9CE; font-size:2.6cqw; letter-spacing:.22em}
.sl-toc .sk-title{font-size:6.6cqw; margin:.4cqw 0 3.4cqw}
.sl-toc .row{display:flex; gap:2.6cqw; padding:1.55cqw 0; border-bottom:1px solid #ECECEA; font-size:2.7cqw; align-items:baseline}
.sl-toc .no{font-family:A2Z; font-weight:700; color:#FF4D14; font-size:2.4cqw; min-width:4.4cqw}
.sl-section .no{font-family:A2Z; font-weight:700; color:#FF4D14; font-size:3.4cqw}
.sl-section .sk-title{font-size:8cqw; margin-top:.8cqw; line-height:1.14}
.sl-section .desc{margin-top:auto; color:#8A8A92; font-size:2.55cqw; max-width:62cqw; line-height:1.55}
.sl-h{font-family:A2Z; font-weight:700; font-size:4.3cqw; text-align:center; margin-bottom:3.6cqw}
.sl-cards .grid{display:grid; gap:2.2cqw; flex:1; align-content:center}
.sl-cards .card{background:#F5F5F3; border-radius:1.6cqw; padding:2.6cqw 2.8cqw}
.sl-cards .card b{display:block; font-family:A2Z; font-weight:700; font-size:2.9cqw; margin-bottom:1cqw}
.sl-cards .card p{font-size:2.25cqw; color:#55555E; line-height:1.5; margin:0}
.sl-compare .cols{display:grid; grid-template-columns:1fr 1fr; gap:2.6cqw; flex:1; align-content:center}
.sl-compare .col{border-radius:1.8cqw; padding:3.2cqw}
.sl-compare .col:first-child{background:#2A2A32; color:#fff}
.sl-compare .col:last-child{background:#F5F5F3}
.sl-compare .col b{display:block; font-family:A2Z; font-weight:700; font-size:3.1cqw; margin-bottom:1.4cqw}
.sl-compare .col:first-child b{color:#FF8A5C}.sl-compare .col:last-child b{color:#FF4D14}
.sl-compare .col p{font-size:2.35cqw; line-height:1.55; margin:0; opacity:.92}
.sl-bignum .sk-body{align-items:center; justify-content:center; text-align:center}
.sl-bignum .num{font-family:A2Z; font-weight:900; font-size:15cqw; color:#FF4D14; line-height:1}
.sl-bignum .cap{font-size:2.9cqw; color:#55555E; margin-top:2.2cqw; max-width:64cqw}
.sl-timeline .steps{display:flex; gap:1.6cqw; flex:1; align-items:center}
.sl-timeline .st{flex:1; position:relative; padding-top:6.2cqw}
.sl-timeline .st::before{content:""; position:absolute; top:2.5cqw; left:calc(50% + 3.4cqw); right:calc(-50% + 3.4cqw); height:.3cqw; background:#E4E4E0}
.sl-timeline .st:last-child::before{display:none}
.sl-timeline .dot{position:absolute; top:0; left:50%; transform:translateX(-50%); width:5.2cqw; height:5.2cqw;
  border-radius:50%; color:#fff; font-family:A2Z; font-weight:700; font-size:2.4cqw; display:flex; align-items:center; justify-content:center}
.sl-timeline .st:nth-child(4n+1) .dot{background:#FF4D14}.sl-timeline .st:nth-child(4n+2) .dot{background:#FEBC2E}
.sl-timeline .st:nth-child(4n+3) .dot{background:#28C840}.sl-timeline .st:nth-child(4n+4) .dot{background:#2A2A32}
.sl-timeline .st b{display:block; text-align:center; font-family:A2Z; font-weight:700; font-size:2.6cqw; margin-bottom:.9cqw}
.sl-timeline .st p{text-align:center; font-size:2cqw; color:#6E6E78; line-height:1.45; margin:0}
.sl-quote .sk-body{align-items:center; justify-content:center; text-align:center}
.sl-quote .qm{font-family:A2Z; font-weight:900; color:#FF4D14; font-size:9cqw; line-height:.6; margin-bottom:2.4cqw}
.sl-quote .qt{font-family:A2Z; font-weight:700; font-size:4.6cqw; line-height:1.4; max-width:70cqw}
.sl-quote .by{margin-top:2.6cqw; color:#8A8A92; font-size:2.5cqw}
.sl-text .lead{text-align:center; font-weight:700; font-size:2.9cqw; margin-bottom:2.8cqw}
.sl-text .para{background:#F5F5F3; border-radius:1.8cqw; padding:3.2cqw 3.6cqw; font-size:2.4cqw;
  line-height:1.75; color:#44444C; flex:1; overflow:hidden}
.deck-note{background:var(--card); border:1px solid var(--line); border-radius:10px;
  padding:10px 14px; margin:-8px 0 18px; font-size:13px; color:var(--mut); line-height:1.6}
/* 발표 모드 */
.present{position:fixed; inset:0; background:#0E0E12; z-index:99; display:flex; align-items:center; justify-content:center}
.present .slide{width:min(100vw, 177.7vh); margin:0; border-radius:0; box-shadow:none}
.present .pnav{position:fixed; bottom:14px; right:18px; color:#777; font-size:13px; font-family:A2Z}
@media print{
  nav,.fab,.sheet,.sheet-back,.deck-tools,.deck-note{display:none !important}
  body{background:#fff} .deck-wrap{max-width:none}
  .slide{width:270mm; break-after:page; margin:0 auto; box-shadow:none; border:none}
  @page{size:A4 landscape; margin:6mm}
}

/* ── 하루완성 스킨 — 줄노트 문서 느낌: 노란 탭·파란 액센트·잉크 테두리 ── */
.skin-oneday .slide{background:
  repeating-linear-gradient(0deg, #F1EFE8 0 1px, transparent 1px 3.2cqw), #FDFCF8;
  border:0.34cqw solid #23232A; box-shadow:none; border-radius:1cqw}
.skin-oneday .sk-chrome{display:none}
.skin-oneday .slide::before{content:""; position:absolute; top:0; left:50%;
  transform:translateX(-50%); width:13cqw; height:2.5cqw; background:#FFD935;
  border:0.3cqw solid #23232A; border-top:0; border-radius:0 0 .8cqw .8cqw; z-index:2}
.skin-oneday .sk-body{inset:0; padding:6.5cqw 6.5cqw 5cqw}
.skin-oneday .sk-accent{display:none}
.skin-oneday .sl-cover .sk-body::after{content:""; position:absolute; left:0; right:0;
  bottom:0; height:4.5cqw; background:#2B4EA2}
.skin-oneday .sl-cover .line{background:#2B4EA2}
.skin-oneday .sl-cover .sub{color:#55555E}
.skin-oneday .sl-toc .no,.skin-oneday .sl-section .no{color:#fff; background:#2B4EA2;
  padding:.3cqw 1.6cqw; border-radius:.5cqw}
.skin-oneday .sl-toc .idx{color:#B9B4A4}
.skin-oneday .sl-toc .row{border-bottom-color:#E3E0D4}
.skin-oneday .sl-section .desc{color:#6E6E78}
.skin-oneday .sl-cards .card{background:#fff; border:0.26cqw solid #23232A; border-radius:.9cqw}
.skin-oneday .sl-cards .card b{color:#2B4EA2}
.skin-oneday .sl-compare .col:first-child{background:#2B4EA2}
.skin-oneday .sl-compare .col:first-child b{color:#FFD935}
.skin-oneday .sl-compare .col:last-child{background:#fff; border:0.26cqw solid #23232A}
.skin-oneday .sl-compare .col:last-child b{color:#2B4EA2}
.skin-oneday .sl-bignum .num{color:#2B4EA2}
.skin-oneday .sl-timeline .st:nth-child(4n+1) .dot{background:#2B4EA2}
.skin-oneday .sl-timeline .st:nth-child(4n+2) .dot{background:#FFD935; color:#23232A}
.skin-oneday .sl-timeline .st:nth-child(4n+3) .dot{background:#23232A}
.skin-oneday .sl-timeline .st:nth-child(4n+4) .dot{background:#7A93D8}
.skin-oneday .sl-timeline .st::before{background:#E3E0D4}
.skin-oneday .sl-quote .qm{color:#2B4EA2}
.skin-oneday .sl-text .para{background:#fff; border:0.26cqw solid #E3E0D4}
