/* Shared reader: existing brand tokens, explicit page metrics. */
.reader-page{--reader-side:14rem;--reader-toc:11rem;--reader-gap:var(--s10);--reader-header:5rem;--reader-header-height:var(--reader-header);--reader-header-layer:40;--reader-body-width:46rem;--reader-dialog-width:72rem}
.reader-header{position:sticky;top:0;z-index:var(--reader-header-layer);min-height:var(--reader-header);padding:var(--s4) var(--inset);border-bottom:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;background:var(--paper)}.reader-header .brand{font-size:var(--text-lg)}.reader-head-actions{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap}.reader-head-actions select{max-width:10rem;min-height:var(--control);background:var(--paper);color:var(--ink);border:1px solid var(--rule);padding:var(--s2);border-radius:var(--radius-small)}
.reader-layout{display:grid;grid-template-columns:var(--reader-side) minmax(0,var(--reader-body-width)) var(--reader-toc);gap:var(--reader-gap);max-width:var(--canvas);margin:auto;padding:var(--s10) var(--inset) var(--s20)}.reader-main{min-width:0}.reader-categories,.reader-toc{position:sticky;top:calc(var(--reader-header-height) + var(--s6));align-self:start;max-height:calc(100dvh - var(--reader-header-height) - var(--s12));overflow:auto;min-width:0}.reader-categories>summary{font-size:var(--text-sm);font-weight:600}.reader-categories .directory-group a{overflow-wrap:anywhere}.reader-toc{font-size:var(--text-sm)}.reader-toc>p{margin-top:0;color:var(--muted)}.reader-toc a{display:block;padding:var(--s2) 0;min-height:var(--control);font-size:var(--text-xs);line-height:1.8;color:var(--muted);overflow-wrap:anywhere}.reader-toc a[aria-current],.reader-mobile-toc a[aria-current]{color:var(--accent)}
.reader-title{font-size:clamp(1.75rem,3.2vw,2.25rem);font-weight:600;line-height:1.4;letter-spacing:normal;margin:var(--s4) 0;overflow-wrap:anywhere}.reader-main .lede{color:var(--muted);font-size:var(--text-base);line-height:1.85;overflow-wrap:anywhere}.reader-meta{display:flex;flex-wrap:wrap;gap:var(--s3);font-size:var(--text-xs);color:var(--muted);margin-block:var(--s5)}.reader-toolbar{display:flex;flex-wrap:wrap;gap:var(--s2);justify-content:space-between;align-items:center;margin-block:var(--s6);padding-block:var(--s3);border-block:1px solid var(--rule)}.reader-toolbar button{min-height:var(--control);min-width:var(--control);border:1px solid var(--rule);background:var(--paper);color:var(--ink);padding:var(--s2) var(--s3);border-radius:var(--radius-small)}.reader-toolbar button[aria-pressed=true]{color:var(--accent);border-color:var(--accent)}.reader-toolbar .reader-size{display:flex;gap:var(--s2)}
.reader-body{font-size:var(--article-size,16px);line-height:1.9;overflow-wrap:anywhere}.reader-body .reader-text{white-space:pre-wrap;font-size:inherit;line-height:inherit;margin-block:var(--s5)}.reader-body h2{font-size:1.3em;line-height:1.55;margin:var(--s12) 0 var(--s5);scroll-margin-top:calc(var(--reader-header-height) + var(--s6));overflow-wrap:anywhere}.reader-section-link{border:0;background:none;color:var(--accent);min-width:var(--control);min-height:var(--control);font-size:var(--text-base);vertical-align:middle}.reader-body figure{margin:var(--s8) 0}.reader-body img,.reader-body video{display:block;max-width:100%;width:100%;height:auto;border-radius:var(--radius)}.reader-body video{background:var(--surface)}.reader-body figcaption{font-size:var(--text-xs);color:var(--muted);line-height:1.8;margin-top:var(--s3);white-space:pre-wrap}.reader-body .prompt-box pre{max-height:28rem;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.88em;line-height:1.9}.reader-body .prompt-header{flex-wrap:wrap;gap:var(--s2)}.reader-media-message,.reader-media-fallback{font-size:var(--text-sm);color:var(--muted)}.reader-media-fallback a{color:var(--accent)}
.reader-mobile-toc{display:none;border-block:1px solid var(--rule);padding-block:var(--s3);font-size:var(--text-sm)}.reader-mobile-toc a{display:block;padding:var(--s3) 0;min-height:var(--control);color:var(--muted)}.reader-progress{position:fixed;top:0;left:0;width:100%;height:3px;z-index:50;appearance:none;border:0;background:var(--clear)}.reader-progress::-webkit-progress-bar{background:var(--clear)}.reader-progress::-webkit-progress-value{background:var(--accent)}.reader-progress::-moz-progress-bar{background:var(--accent)}
.reader-related{border-top:1px solid var(--rule);margin-top:var(--s12);padding-top:var(--s6)}.reader-related h2{font-size:var(--text-lg)}.reader-related a{display:block;padding:var(--s4) 0;border-bottom:1px solid var(--rule);color:var(--ink);overflow-wrap:anywhere}.reader-related small{display:block;color:var(--muted);font-size:var(--text-xs)}.reader-end{margin-top:var(--s10)}.reader-zoom{max-width:var(--reader-dialog-width);width:calc(100% - var(--s8));max-height:92dvh;border:1px solid var(--rule);border-radius:var(--radius);padding:var(--s4);background:var(--paper);color:var(--ink)}.reader-zoom::backdrop{background:var(--overlay)}.reader-zoom .dialog-top{padding:0 0 var(--s3);justify-content:flex-end}.reader-zoom img{display:block;max-height:74dvh;max-width:100%;width:auto;margin:auto;object-fit:contain}.reader-zoom p{font-size:var(--text-sm);color:var(--muted);margin-bottom:0}.reader-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.reader-page.reader-focus .reader-categories,.reader-page.reader-focus .reader-toc{display:none}.reader-page.reader-focus .reader-layout{grid-template-columns:minmax(0,var(--reader-body-width));justify-content:center}.reader-page.reader-focus .reader-mobile-toc{display:block}.reader-error{max-width:var(--reader-body-width);margin:var(--s16) auto;padding:var(--s6);overflow-wrap:anywhere}.reader-error h1{font-size:var(--text-title)}
@media(max-width:75rem){.reader-layout{grid-template-columns:12rem minmax(0,1fr);gap:var(--s8)}.reader-toc{display:none}.reader-mobile-toc{display:block}}@media(max-width:48rem){.reader-layout{display:block;padding-top:var(--s5)}.reader-categories{position:static;max-height:none;border-bottom:1px solid var(--rule);margin-bottom:var(--s6);padding-bottom:var(--s3)}.reader-categories>nav{max-height:45dvh;overflow:auto}.reader-header{padding:var(--s4) var(--inset)}.reader-head-actions{width:100%;justify-content:space-between}.reader-head-actions .button{font-size:var(--text-xs)}.reader-main .lede{font-size:var(--text-base)}.reader-zoom{width:calc(100% - var(--s4))}.reader-zoom img{max-height:68dvh}}
@media(prefers-reduced-motion:reduce){.reader-page{scroll-behavior:auto}}
.reader-case{margin-block:var(--s8);padding:var(--s5);border:1px solid var(--rule);border-radius:var(--radius)}.reader-case h2{margin-top:0;font-size:var(--text-lg)}.reader-case dl{margin:0}.reader-case dl>div{display:grid;grid-template-columns:8rem minmax(0,1fr);gap:var(--s4);padding-block:var(--s3);border-bottom:1px solid var(--rule)}.reader-case dl>div:last-child{border:0}.reader-case dt{color:var(--muted);font-size:var(--text-sm)}.reader-case dd{margin:0;white-space:pre-wrap;font-size:var(--text-base)}.reader-case a{color:var(--accent)}@media(max-width:48rem){.reader-case dl>div{grid-template-columns:1fr;gap:var(--s1)}}

.reader-resource-link{color:var(--accent);text-decoration:underline;text-underline-offset:.2em;overflow-wrap:anywhere}

.reader-main,.reader-body{scroll-margin-top:calc(var(--reader-header-height) + var(--s6))}

/* Keep the same five destinations available throughout article reading. */
.reader-site-nav{display:flex;align-items:center;justify-content:center;gap:var(--s2);flex:1;min-width:0}.reader-site-nav a{display:block;white-space:nowrap;font-size:var(--text-sm);color:var(--muted);padding:var(--s3);border-radius:var(--radius-small)}.reader-site-nav a:hover{color:var(--ink)}.reader-site-nav a[aria-current]{color:var(--accent);background:var(--accent-soft)}
@media(max-width:70rem){.reader-site-nav{order:3;flex-basis:100%;justify-content:flex-start;overflow-x:auto}.reader-header{gap:var(--s2)}.reader-site-nav a{padding:var(--s2) var(--s3);min-height:var(--control)}}
@media(max-width:48rem){.reader-site-nav{gap:0}.reader-site-nav a{font-size:var(--text-xs);padding-inline:var(--s2)}}

.reader-site-nav .reader-main-site{border-inline-start:1px solid var(--rule);margin-inline-start:var(--s2);padding-inline-start:var(--s4);color:var(--ink);font-weight:600}.reader-site-nav .reader-main-site span{color:var(--accent);font-size:.9em}
@media(max-width:48rem){.reader-site-nav .reader-main-site{margin-inline-start:var(--s1);padding-inline-start:var(--s3)}}

.member-gate{margin:24px 0;padding:28px;border:1px solid currentColor;border-radius:16px}.member-actions{display:flex;gap:12px;flex-wrap:wrap}.member-actions .button{white-space:normal;text-align:center}@media(max-width:600px){.member-gate{padding:20px}.member-actions{flex-direction:column}}

/* Original-platform players display immediately without autoplay. */
.reader-embed-frame{aspect-ratio:16/9;background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;max-width:100%}
.reader-embed-frame.is-portrait{aspect-ratio:9/16;width:min(100%,340px);margin-inline:auto}
.reader-embed-frame iframe{width:100%;height:100%;border:0;display:block}
.reader-video-preview figcaption a{font-weight:650}.reader-video-preview figcaption p{font-size:13px;line-height:1.6;margin:8px 0 0}

.reader-embed-frame.is-instagram{width:min(100%,420px);aspect-ratio:auto;height:740px;margin-inline:auto}

 .reader-guide{border:1px solid var(--rule);border-radius:var(--radius);padding:var(--s5);margin:var(--s4) 0 var(--s6);background:var(--surface)}
.reader-guide h2{font-size:var(--text-lg);margin:0 0 var(--s3)}.reader-guide h3{font-size:var(--text-base);margin:var(--s5) 0 var(--s2)}.reader-guide p{margin:var(--s2) 0;line-height:1.7}.reader-guide-meta{font-size:var(--text-sm);color:var(--muted)}
.reader-checklist{margin:var(--s6) 0;padding:var(--s5);border:1px solid var(--rule);border-radius:var(--radius)}.reader-checklist summary{cursor:pointer;font-weight:600}.reader-check-count{display:inline-block;margin-inline-start:var(--s3);font-size:var(--text-sm);font-weight:400;color:var(--muted)}.reader-checklist label{display:flex;align-items:baseline;gap:var(--s3);min-height:var(--control);padding-block:var(--s2);line-height:1.6}.reader-checklist input{accent-color:var(--accent);flex:none}.reader-checklist p{font-size:var(--text-sm);color:var(--muted)}.reader-feedback select{width:100%;min-width:0;max-width:100%}.member-gate ul{line-height:1.8;text-align:left}.reader-outline a{overflow-wrap:anywhere}

/* Match the reading frame while the permission-aware article request completes. */
.reader-boot{display:none}.reader-loading #draft-preview{display:none}.reader-loading .reader-boot{display:block}.reader-boot-status{color:var(--muted);font-size:var(--text-xs);margin-block:var(--s5)}.reader-boot-line{display:block;min-height:var(--s4);max-width:100%;border-radius:var(--radius-small);background:var(--surface-2);margin-block:var(--s4)}.reader-boot-nav{width:30%;height:var(--control);margin:0}.reader-boot-lines{padding:var(--s5);border:1px solid var(--rule);border-radius:var(--radius);background:var(--surface)}.reader-boot-lines .reader-boot-line:nth-child(2){width:85%}.reader-boot-lines .reader-boot-line:nth-child(3){width:65%}.reader-boot .reader-toolbar>.reader-boot-line{width:100%;height:var(--control);margin:0}@media(max-width:75rem){.reader-boot .reader-layout>aside:last-child{display:none}}@media(max-width:48rem){.reader-boot .reader-layout>aside{display:none}.reader-boot-nav{display:none}}

/* Progressive directory disclosure and article companion materials. */
.directory-group{border-bottom:1px solid var(--rule);padding:var(--s2) 0}.directory-group>summary{min-height:var(--control);display:flex;align-items:center;gap:var(--s2);cursor:pointer;font-size:var(--text-sm);font-weight:600;list-style:none}.directory-group>summary:before{content:none}.directory-group[open]>summary:before{content:none}.directory-count{margin-left:auto;color:var(--muted);font-size:var(--text-xs)}.directory-group a[aria-current]{border-left:2px solid var(--accent);padding-left:var(--s3);background:var(--surface);color:var(--accent)}
.reader-materials{border-block:1px solid var(--rule);padding:var(--s6) 0;margin:var(--s6) 0}.reader-materials h2{font-size:var(--text-lg)}.reader-materials ul{padding:0;list-style:none}.reader-materials li{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s3);padding:var(--s3) 0}.reader-materials p,.reader-diagram figcaption{font-size:var(--text-sm);color:var(--muted)}.reader-materials .button{min-height:var(--control)}.reader-diagram{margin:var(--s8) 0}.reader-diagram img{width:100%;height:auto;border-radius:var(--radius);display:block}.reader-diagram figcaption{margin-top:var(--s2)}.reader-diagram summary{min-height:var(--control);cursor:pointer}.reader-diagram li{margin:var(--s2) 0;overflow-wrap:anywhere}.reader-materials [role=status]{width:100%}

/* Keep chapter navigation reachable during long mobile tutorials. */
@media(max-width:48rem){
 .reader-mobile-toc{position:sticky;top:calc(var(--reader-header-height) + var(--s2));z-index:20;background:var(--paper);border:1px solid var(--rule);border-radius:var(--radius);padding:var(--s3) var(--s4)}
 .reader-mobile-toc nav{max-height:45dvh;overflow:auto;overscroll-behavior:contain}
 .reader-body h2{scroll-margin-top:calc(var(--reader-header-height) + 5rem)}
 .reader-related a{padding-block:var(--s5)}
}

/* Keep the vertical product demonstration and its controls visible together. */
.reader-body video[src$="/product-film/pouch-final.mp4"] {
  width: auto;
  max-width: 100%;
  max-height: 70vh;
  max-height: 70svh;
  aspect-ratio: 9 / 16;
  margin-inline: auto;
}