:root{
  --ink:#1f2937; --ink-2:#3b4756; --ink-3:#6b7280;
  --navy:#1f3a68; --navy-2:#28477a; --accent:#1f3a68; --accent-soft:#e8f0fb;
  --line:#d8e0e8; --bg:#ffffff; --red:#d83b3b;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;font-family:'Noto Sans CJK JP','Noto Sans JP',sans-serif;background:#11151b;font-feature-settings:"palt";-webkit-font-smoothing:antialiased}
.stage{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}
.deck{position:relative;width:1280px;height:720px;transform-origin:center center;background:var(--bg);box-shadow:0 24px 70px rgba(0,0,0,.5);overflow:hidden}
.slide{position:absolute;inset:0;padding:54px 64px;display:none;flex-direction:column}
.slide.active{display:flex}

/* corner accents */
.slide.content::before{content:"";position:absolute;top:0;left:0;border-top:64px solid var(--accent);border-right:64px solid transparent;opacity:.92}
.slide.content::after{content:"";position:absolute;bottom:0;right:0;border-bottom:56px solid var(--accent-soft);border-left:56px solid transparent}

/* titles */
.s-title{font-size:36px;font-weight:800;color:var(--ink);margin-bottom:14px;display:flex;align-items:center;gap:14px}
.s-step{font-size:22px;font-weight:700;color:var(--navy);margin-bottom:6px}
.bullet{font-size:21px;color:var(--ink-2);line-height:1.6;margin-bottom:4px}
.bullet .sub{display:block;font-size:18px;color:var(--ink-3);margin:4px 0 0 22px}
a{color:var(--navy);font-weight:700}

/* cover */
.cover{background:radial-gradient(120% 120% at 78% 0%,#28477a,#1f3a68 58%,#13294b);color:#fff;justify-content:center;align-items:flex-start;padding:0}
.cover .frame{position:absolute;inset:40px;border:2px solid rgba(255,255,255,.5)}
.cover .ctxt{padding:0 90px}
.cover .eyebrow{font-size:18px;letter-spacing:.16em;color:#a9c2da;font-weight:700;margin-bottom:18px}
.cover h1{font-size:60px;font-weight:900;line-height:1.18}
.cover .clead{font-size:22px;color:rgba(255,255,255,.84);margin-top:18px}

/* divider */
.divider{justify-content:center;align-items:center;text-align:center}
.divider::before{content:"";position:absolute;top:0;left:0;border-top:160px solid var(--accent-soft);border-right:160px solid transparent}
.divider::after{content:"";position:absolute;bottom:0;right:0;border-bottom:160px solid var(--accent-soft);border-left:160px solid transparent}
.divider .dnum{font-size:22px;color:var(--navy);font-weight:700;letter-spacing:.1em;margin-bottom:14px}
.divider h2{font-size:52px;font-weight:900;color:var(--ink);line-height:1.2}

/* screenshots + highlight */
.shotwrap{position:relative;display:inline-block;margin-top:10px;align-self:center}
.shot{display:block;max-height:430px;width:auto;max-width:1130px;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 22px rgba(15,39,65,.14)}
.hl{position:absolute;border:3px solid var(--red);border-radius:6px;box-shadow:0 0 0 2px rgba(216,59,59,.18)}
.hl-label{position:absolute;background:var(--red);color:#fff;font-size:14px;font-weight:700;padding:2px 9px;border-radius:5px;white-space:nowrap}
.cap{font-size:16px;color:var(--ink-3);margin-top:10px;align-self:center}

/* two column */
.cols{display:flex;gap:34px;margin-top:8px}
.cols .c{flex:1;min-width:0}

/* code */
.code{font-family:'Noto Sans Mono CJK JP','Noto Sans Mono',monospace;background:#13294b;color:#dce8ee;border-radius:10px;padding:20px 24px;font-size:20px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:12px}
.code .c{color:#8fb6c9}
code.inline{font-family:'Noto Sans Mono CJK JP',monospace;background:var(--accent-soft);color:var(--navy);padding:2px 8px;border-radius:5px;font-size:.92em}

/* cards / callout */
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 22px}
.card h3{font-size:21px;color:var(--navy);margin-bottom:8px}
.card p,.card li{font-size:18px;line-height:1.55;color:var(--ink-2)}
.note{background:var(--accent-soft);border-left:5px solid var(--navy);border-radius:0 10px 10px 0;padding:14px 20px;font-size:19px;color:var(--ink);margin-top:12px}
.warn{background:#fdf0ef;border-left:5px solid var(--red);border-radius:0 10px 10px 0;padding:14px 20px;font-size:19px;color:var(--ink);margin-top:12px}

/* table */
table{width:100%;border-collapse:collapse;margin-top:12px;font-size:19px}
th,td{border:1px solid var(--line);padding:10px 14px;text-align:left;vertical-align:top}
th{background:var(--accent-soft);color:var(--navy)}
td code,th code{font-family:'Noto Sans Mono CJK JP',monospace;background:#eef2f7;padding:1px 6px;border-radius:4px}

/* footers */
.copyright{position:absolute;left:20px;bottom:14px;font-size:11px;color:#9aa6b2}
.cover .copyright{color:rgba(255,255,255,.6)}
.pageno{position:absolute;right:22px;bottom:14px;font-size:14px;color:var(--ink-3)}

/* agenda */
.agitem{font-size:22px;color:var(--ink-2);margin:8px 0;display:flex;gap:14px;align-items:baseline}
.agitem .n{font-family:'Noto Sans Mono CJK JP',monospace;color:var(--navy);font-weight:700;min-width:28px}
.aghead{font-size:20px;font-weight:800;color:var(--navy);margin:16px 0 6px}