/* Reader-to-study navigation keeps collection and writing as distinct views. */
.reader-next{display:flex;justify-content:flex-end;align-items:center;gap:var(--space-5);padding:var(--space-6) 0 var(--space-2)}
.reader-next p{margin:0;max-width:420px;font-size:var(--text-md)}
.reader-next .study-next{flex-shrink:0;min-height:var(--control-lg);padding:0 var(--space-6);font-size:var(--text-lg)}
.study-navigation{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-5)}
.study-navigation .back-to-reader{font-size:var(--text-md)}
.study-navigation .muted{font-size:var(--text-base)}
#detail[data-view="study"]{max-width:1120px;margin-inline:auto}
#detail[data-view="study"]>.actions{margin:var(--space-2) 0 var(--space-4)}
#detail[data-view="study"] .study-prompt{min-height:var(--control-lg);padding:0 var(--space-5);font-size:var(--text-lg)}
#detail[data-view="study"]>.muted{font-size:var(--text-md)}
.study-info{margin:6px 0 0}
.study-info>summary{font-size:var(--text-base);font-weight:600;color:var(--color-muted)}
.study-info .article-metadata{margin:.5rem 0 .8rem}

/* Study workspace: compact header, three real steps, one task visible at a time. */
.study-workspace{display:block;min-width:0;margin-top:var(--space-2)}
.study-steps{display:flex;gap:6px;overflow-x:auto;border-bottom:1px solid var(--color-line);scrollbar-width:none}
.study-step{flex:1 1 0;min-width:max-content;min-height:var(--control-lg);gap:10px;padding:10px var(--space-4);border:0;border-bottom:3px solid transparent;border-radius:var(--radius-md) var(--radius-md) 0 0;background:transparent;font-size:var(--text-md);font-weight:600;color:var(--color-muted)}
.study-step:hover{background:var(--color-surface-hover)}
.study-step-number{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:var(--radius-pill);background:var(--color-surface-muted);color:var(--color-ink);font-size:var(--text-base)}
.study-step[aria-selected="true"]{border-bottom-color:var(--color-accent);color:var(--color-ink);background:var(--color-surface-sunken)}
.study-step[aria-selected="true"] .study-step-number{background:var(--color-accent);color:var(--color-accent-ink)}
.study-panel{padding:var(--space-6) var(--space-1) var(--space-2);min-width:0}
.study-panel:focus{outline:none}
.study-panel:focus-visible{outline:var(--focus-ring);outline-offset:2px}
.study-panel[hidden]{display:none}
.study-panel h3{margin:0 0 6px;font-size:var(--text-2xl)}
.study-panel p{font-size:var(--text-md)}
.study-panel-nav{display:flex;justify-content:space-between;gap:var(--space-3);margin-top:28px;padding-top:var(--space-4);border-top:1px solid var(--color-line)}
.study-panel-nav .step-forward{margin-left:auto}
.guide-steps{margin:var(--space-4) 0;padding-left:1.4em;max-width:640px;display:grid;gap:10px;font-size:var(--text-lg)}
.guide-steps li{padding-left:var(--space-1)}
.paste-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr);gap:28px;align-items:start;margin-top:var(--space-4)}
.paste-form{min-width:0}
.paste-form label{margin:0 0 14px}
.paste-form textarea{min-height:260px;line-height:1.7}
.paste-form .paste-date input{max-width:200px}
.paste-guide{padding:var(--space-4);background:var(--color-surface-sunken);border-radius:var(--radius-lg);min-width:0}
.paste-guide h4{margin:0 0 var(--space-2);font-size:var(--text-md)}
.paste-guide pre{margin:0 0 10px;padding:var(--space-3);background:var(--color-surface);border-radius:var(--radius-md);font-family:var(--font-mono);font-size:var(--text-base);line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
.paste-guide p{font-size:var(--text-base)}
.submission-options{display:flex;flex-wrap:wrap;gap:6px var(--space-6);margin:var(--space-2) 0 var(--space-3)}
.submission-options label{margin:var(--space-1) 0;font-weight:500}
#detail[data-view="study"] .submission{margin-top:0;padding-top:0;border-top:0}
.image-pager{display:grid;gap:14px;min-width:0}
.pager-thumbs{display:flex;gap:var(--space-2);overflow-x:auto;padding:var(--space-1) 2px var(--space-2)}
.pager-thumb{flex:0 0 auto;display:grid;gap:var(--space-1);justify-items:center;width:88px;min-height:0;padding:6px;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500}
.pager-thumb img{width:100%;height:72px;object-fit:cover;object-position:top;border-radius:var(--radius-sm);background:var(--color-surface-muted)}
.pager-thumb.current{background:var(--color-accent-soft);border-color:var(--color-accent)}
.pager-stage{min-width:0}
.image-slide{min-width:0}
.image-slide h4{margin:0 0 var(--space-2);font-size:var(--text-md)}
.image-slide img{display:block;width:100%;max-width:720px;max-height:70vh;object-fit:contain;object-position:top;border-radius:var(--radius-lg);border:1px solid var(--color-line);background:var(--color-surface)}
.pager-controls{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pager-status{margin:0;text-align:center;font-size:var(--text-md)}
.pager-controls button:disabled{opacity:.4;cursor:default}
.study-tools{margin-top:36px;padding-top:var(--space-4);border-top:1px solid var(--color-line)}
.study-tools>h3{margin:0 0 2px;font-size:var(--text-xl)}
.study-tools>p{margin:0 0 6px;font-size:var(--text-md)}
.study-tools details{margin:10px 0;padding:10px 14px;background:var(--color-surface-sunken);border-radius:var(--radius-lg)}
.study-tools details>summary{font-size:var(--text-md)}
.study-tools details p{font-size:var(--text-md)}
.study-tools .screenshots>div{flex:0 0 180px}
.article-image-section h3{margin:var(--space-3) 0 var(--space-1);font-size:var(--text-xl)}
@media(max-width:900px){.paste-layout{grid-template-columns:1fr}.paste-guide{order:-1}}
@media(max-width:680px){.reader-next{align-items:stretch;flex-direction:column;gap:var(--space-3);padding-top:var(--space-5)}.reader-next .study-next{width:100%}.study-navigation{flex-wrap:wrap;gap:10px}#detail[data-view="study"]{width:100%}.study-step{flex:1 0 auto;padding:10px var(--space-3);gap:var(--space-2)}.study-panel{padding-top:var(--space-4)}.study-panel-nav{flex-wrap:wrap}.study-panel-nav button{flex:1 1 140px}.pager-thumb{width:72px}.image-slide img{max-height:60vh}}
@media(prefers-reduced-motion:no-preference){.study-step{transition:background var(--duration-fast)}}