/* Reading layout for published/local-preview guides; no changes to the homepage. */
.article.reading-width{max-width:940px}.article>header{max-width:850px;margin-bottom:32px}.article h1{line-height:1.15}.article .local-publication-note{color:var(--muted);border-left:3px solid var(--lime);padding:8px 14px;line-height:1.6}.article .prose{padding-top:0;padding-bottom:20px;line-height:1.8}.article .prose>p,.article .prose>ul,.article .prose>ol{max-width:76ch}.article .prose>p:first-child{font-size:20px;color:var(--ink);background:var(--panel-raised);border:1px solid var(--line);border-left:4px solid var(--lime);border-radius:8px;padding:22px 26px}.article .prose h2{font-size:30px;line-height:1.3;margin:42px 0 18px}.article .prose h3{font-size:23px;line-height:1.4;margin:30px 0 15px}.article .prose p{color:#c3ccdc}.article .prose strong{color:var(--ink)}.article .prose nav{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:22px 26px;margin:28px 0}.article .prose nav p{margin-bottom:8px}.article .prose nav ul{margin:0;padding-left:22px}.article .prose li{margin:7px 0}.article .table-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;border:1px solid var(--line);border-radius:9px;margin:24px 0}.article .table-scroll:focus-visible{outline:3px solid var(--lime);outline-offset:4px}.article .prose table{display:table;min-width:650px;width:100%;font-size:15px;line-height:1.6;overflow:visible}.article .prose caption{text-align:left;padding:14px 16px;background:var(--panel);color:var(--muted);font-size:14px}.article .prose th,.article .prose td{padding:14px;text-align:left;vertical-align:top;border:0;border-bottom:1px solid var(--line)}.article .prose thead th{color:var(--lime);background:var(--panel-raised)}.article .prose tbody th{color:var(--ink)}.article .prose tbody tr:nth-child(even){background:var(--panel)}.article .prose tbody tr:last-child>*{border-bottom:0}.article .prose a[target="_blank"]::after{content:' ↗';font-size:.8em}.article .prose ol[aria-label*="24 episodes"]{padding-left:34px;max-width:620px}.article .prose ol[aria-label*="24 episodes"] li{padding:7px 10px;border-bottom:1px solid var(--line);margin:0}.article .prose ol[aria-label*="24 episodes"] li:nth-child(even){background:var(--panel)}.article .prose ol[aria-label*="24 episodes"] li::marker{color:var(--lime);font-weight:700}.article-footer{border-top:1px solid var(--line);padding:22px 0;font-size:15px;color:var(--violet)}
@media(max-width:720px){.article{padding-top:28px}.article .prose>p:first-child{font-size:18px;padding:17px 18px}.article .prose h2{font-size:26px}.article .prose h3{font-size:21px}.article .prose nav{padding:18px}.article .prose table{font-size:14px}.article .table-scroll:before{content:'Swipe table horizontally →';display:block;padding:8px 12px;color:var(--lime);font-size:12px}.article .prose th,.article .prose td{padding:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Keep three-column reference tables readable as labelled cards on small screens. */
.article .media-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:28px 0 10px}
.article .media-gallery--games{grid-template-columns:repeat(3,minmax(0,1fr))}
.article .media-gallery figure{margin:0;min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.article .media-gallery img{display:block;width:100%;height:auto;background:#141824}
.article .media-gallery figcaption{display:flex;gap:10px;padding:14px 12px;line-height:1.45;font-size:15px}
.article .media-gallery figcaption strong{display:block;font-size:15px}
.article .media-gallery figcaption small{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.article .media-order{color:var(--lime);font-size:12px;font-weight:700;letter-spacing:.04em;padding-top:2px}
.article .prose .media-credit{font-size:12px;line-height:1.6;color:var(--muted);margin:8px 0 26px;max-width:none}
.article .article-diagram{margin:26px 0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#121a2a}
.article .article-diagram picture,.article .article-diagram img{display:block;width:100%;height:auto}
.article .article-diagram figcaption{padding:16px 20px;font-size:14px;line-height:1.65;color:#c3ccdc;border-top:1px solid var(--line)}
.article .article-video{margin:32px 0;padding:24px;border:1px solid #40375b;border-radius:14px;background:linear-gradient(135deg,#1c2033,#211b32)}
.article .prose .article-video h3{margin:0 0 10px;font-size:23px}
.article .article-video>p{font-size:15px;line-height:1.7;margin:0 0 18px}
.article .video-player{margin:0}
.article .video-stage{position:relative;width:100%;max-width:100%;aspect-ratio:16/9;min-height:200px;overflow:hidden;border-radius:9px;background:#080d17}
.article .video-cover{height:100%;width:100%;position:absolute;inset:0}
.article .video-cover img{display:block;width:100%;height:100%;object-fit:contain;opacity:.75}
.article .video-play-mark{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);display:grid;place-items:center;width:60px;height:60px;padding-left:4px;border-radius:50%;background:#d6ff74;color:#10151f;box-shadow:0 8px 28px #0008;font-size:24px;line-height:1}
.article .video-load{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;color:#fff;cursor:pointer;display:flex;justify-content:center;align-items:flex-end;padding:18px;font:inherit;font-size:15px}
.article .video-load span{background:#101722ec;border:1px solid #869167;border-radius:7px;padding:9px 15px;min-height:44px;display:flex;align-items:center;text-align:center;line-height:1.4}
.article .video-stage iframe{position:absolute;inset:0;display:block;width:100%;height:100%;border:0}
.article .video-player figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding:14px 0 0;font-size:13px;line-height:1.6;color:#c3ccdc}
.article .video-player figcaption>span{flex:1 1 220px}
.article .video-player figcaption>a{display:inline-flex;align-items:center;min-height:44px}
.article .video-close{min-height:44px;border:1px solid var(--muted);border-radius:7px;background:#151c2c;color:var(--ink);padding:8px 14px;font:inherit;cursor:pointer}
.article .video-load:focus-visible{outline:3px solid var(--lime);outline-offset:-4px;border-radius:9px}
.article .video-close:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
.article .video-player [hidden]{display:none!important}
.article .arc-rhythm{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:24px 0;font-size:14px;line-height:1.5}
.article .arc-rhythm span{padding:9px 12px;border:1px solid var(--line);border-radius:7px;background:var(--panel)}
.article .arc-rhythm b{color:var(--muted)}
.article .arc-rhythm span:nth-of-type(2){color:#d0c7ff;border-color:#66558a}
.article .arc-rhythm span:last-child{color:var(--lime);border-color:#77934d}
@media(max-width:600px){
  .article .media-gallery,.article .media-gallery--games{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .article .media-gallery--games figure:first-child{grid-column:1/-1}
  .article .media-gallery figcaption{padding:12px 9px;gap:7px}
  .article .media-gallery figcaption strong{font-size:14px}
  .article .media-gallery figcaption small{font-size:12px}
  .article .media-order{font-size:11px}
  .article .article-diagram figcaption{padding:14px 16px}
  .article .article-video{padding:16px}
  .article .video-load{padding:10px;font-size:13px}
  .article .video-load span{padding:7px 10px}
  .article .video-play-mark{width:44px;height:44px;font-size:20px;top:32%}
}
.article .prose .reader-table{min-width:0;table-layout:auto}
.article .reader-table tbody th{width:27%}
.article .reader-route{padding-left:28px}
.article .reader-route li{padding:8px 0 8px 8px}
.article .reader-route li::marker{color:var(--lime);font-weight:700}
.article .reader-checklist{list-style:square;padding-left:24px}
.article .reader-checklist li::marker{color:var(--lime)}
.article .episode-tools{border:1px solid var(--line);border-radius:10px;padding:18px 20px;background:var(--panel);max-width:620px;margin:22px 0 14px}
.article .episode-tools p{margin:0 0 10px;font-size:15px;line-height:1.6}
.article .episode-tools .episode-status{color:var(--ink);font-weight:600}
.article .episode-tools button{padding:10px 16px;background:transparent;color:var(--ink);border:1px solid var(--muted);border-radius:7px;font:inherit;font-size:14px;cursor:pointer;min-height:44px}
.article .episode-tools button:disabled{opacity:.5;cursor:default}
.article .episode-tools button:focus-visible,.article .episode-checklist input:focus-visible{outline:3px solid var(--lime);outline-offset:4px}
.article .episode-checklist label{display:flex;gap:14px;align-items:center;cursor:pointer;min-height:44px;line-height:1.5}
.article .episode-checklist input{width:20px;height:20px;min-width:20px;margin:0;accent-color:var(--lime)}
.article .episode-checklist li[data-complete="true"]{background:#173335!important}
.article .episode-checklist li[data-complete="true"] label{color:#b0d0be}
@media(max-width:600px){
  .article .table-scroll:before{content:none}
  .article .prose .reader-table,.article .reader-table tbody{display:block;width:100%}
  .article .reader-table caption{display:block}
  .article .reader-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .article .reader-table tbody tr{display:block;padding:10px 14px;border-bottom:1px solid var(--line)}
  .article .reader-table tbody tr:last-child{border-bottom:0}
  .article .prose .reader-table tbody th{display:block;width:auto;padding:8px 0;border:0;font-size:16px}
  .article .prose .reader-table td{display:block;padding:6px 0 8px;border:0;overflow-wrap:anywhere}
  .article .reader-table td[data-label]:before{content:attr(data-label) ': ';color:var(--lime);font-weight:600}
  .article .episode-tools{padding:16px}
  .article .prose .episode-checklist{padding-left:29px}
  .article .prose .episode-checklist li{padding:6px 8px}
}
