/* The second chapter is a complete, visible screen. */
html{scroll-padding-top:var(--header-height);scroll-snap-type:y proximity}
main>section{scroll-snap-align:start;scroll-margin-top:0}
.capture{height:calc(100svh - var(--header-height));min-height:0;padding:clamp(16px,2.5svh,28px) clamp(24px,4.2vw,80px);display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:clamp(12px,1.8svh,20px);background:#fff;overflow:clip}
.capture-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.capture-heading .eyebrow{font-size:10px;margin:0 0 8px;letter-spacing:1.3px;color:#657080}
.capture-heading h2{font-size:clamp(36px,min(4.1vw,7svh),72px);line-height:1;letter-spacing:-.055em}
.capture-tabs{display:flex;padding:4px;gap:4px;border:1px solid #dce1e8;background:#f4f6f8;border-radius:9px;flex-shrink:0}
.capture-tabs button{border:0;border-radius:6px;background:transparent;color:#657080;min-height:42px;padding:10px 20px;font-size:14px;white-space:nowrap;font-weight:700}
.capture-tabs button[aria-selected=true]{background:#1847f5;color:#fff;box-shadow:0 3px 9px #1847f51c}
.capture-steps{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;list-style:none;margin:0;padding:0}
.capture-steps li{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;line-height:1.25;padding:10px 0;border-top:1px solid #dce1e8}
.capture-steps b{display:grid;place-items:center;flex-shrink:0;width:25px;height:25px;border-radius:50%;background:#ecf1ff;color:#1847f5;font-size:12px}
.capture-stage{display:grid;grid-template-columns:1.05fr 1fr;min-height:0;border:1px solid #dce1e8;border-radius:12px;overflow:hidden;background:#f4f6f8}
.capture-shot{display:grid;grid-template-rows:minmax(0,1fr) auto;margin:0;min-width:0;min-height:0;border-right:1px solid #dce1e8}
.capture-photo{position:relative;min-height:0;background:#e9edf1;overflow:hidden}
.capture-photo>img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.capture-setting{position:absolute;left:16px;top:16px;background:#fff;padding:8px 11px;font-size:12px;border-radius:5px;box-shadow:0 3px 14px #121b2910;font-weight:700}
.capture-record{position:absolute;left:16px;bottom:14px;display:flex;align-items:center;gap:7px;padding:7px 10px;border-radius:5px;background:#121b29e8;color:white;font-size:10px}
.capture-record i{width:6px;height:6px;background:#c7f35a;border-radius:50%}
.capture-speech{display:flex;align-items:center;gap:14px;min-height:58px;padding:12px 18px;background:#fff;border-top:1px solid #dce1e8}
.capture-speech>span{font:9px monospace;letter-spacing:.08em;color:#657080;white-space:nowrap}
.capture-speech p{margin:0;font-size:clamp(14px,1.2vw,20px);font-weight:700;line-height:1.3}
.capture-scribe{position:relative;display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1fr);align-items:center;min-width:0;min-height:0;padding:clamp(16px,2.1vw,36px);gap:12px;background:#f4f6f8}
.capture-mascot{display:block;width:100%;height:100%;max-height:100%;min-height:0;object-fit:contain}
.capture-notepad{position:relative;background:white;border:1px solid #dce1e8;border-radius:8px;padding:clamp(16px,1.7vw,28px);box-shadow:0 10px 28px #121b2907;min-width:0}
.capture-notepad-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#1847f5}
.capture-notepad-heading>span{font:9px monospace;line-height:1.4;letter-spacing:.06em}
.capture-notepad-heading>i{font-style:normal;font-size:26px;line-height:1}
.capture-notepad h3{font-size:clamp(16px,1.45vw,24px);margin:12px 0 10px;line-height:1.12;letter-spacing:-.03em}
.capture-notepad ul{margin:0;padding:0;list-style:none}
.capture-notepad li{display:flex;align-items:center;gap:9px;padding:11px 0;border-bottom:1px solid #e8ecf3;font-size:clamp(13px,1.1vw,18px);line-height:1.3;transition:opacity .25s,transform .25s}
.capture-notepad li>b{color:#1847f5;font-size:13px}
.capture-notepad li.pending{opacity:.2;transform:translateY(3px)}
.capture-note-status{font-size:11px;color:#657080;line-height:1.4;margin:15px 0 0;min-height:2.8em}
.capture-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:36px}
.capture-playback{display:flex;align-items:center;gap:12px}
.capture-playback button{background:transparent;border:1px solid #dce1e8;border-radius:5px;font-size:11px;min-height:34px;padding:6px 12px;white-space:nowrap}
.capture-playback>span{font-size:10px;line-height:1.4;color:#657080;max-width:220px}
.capture-next{display:flex;gap:8px;align-items:center;font-size:13px;min-height:36px;white-space:nowrap}
.capture-next strong{color:#1847f5;border-bottom:1px solid #b3c2f3;padding:5px 0}
@media(max-width:1000px) and (min-width:761px){.capture-scribe{padding:14px;grid-template-columns:.65fr 1fr;gap:6px}.capture-notepad{padding:14px}.capture-tabs button{padding:10px 14px;font-size:12px}.capture-steps li{font-size:12px}}
@media(max-width:760px){
 .capture{padding:12px 16px;gap:10px}
 .capture-heading{display:grid;gap:10px}
 .capture-heading .eyebrow{font-size:9px;margin-bottom:6px}
 .capture-heading h2{font-size:clamp(30px,7.8vw,44px);line-height:1.03;white-space:nowrap}
 .capture-tabs{width:100%;padding:3px}
 .capture-tabs button{width:50%;min-height:36px;font-size:13px;padding:8px 10px}
 .capture-steps{gap:7px}
 .capture-steps li{gap:5px;padding:8px 0 0;font-size:10px;align-items:flex-start}
 .capture-steps b{width:18px;height:18px;font-size:9px}
 .capture-stage{grid-template-columns:1fr;grid-template-rows:minmax(0,1.6fr) minmax(0,1fr);border-radius:9px}
 .capture-shot{border-right:0;border-bottom:1px solid #dce1e8}
 .capture-setting{font-size:10px;left:9px;top:8px;padding:5px 7px}
 .capture-record{font-size:8px;left:9px;bottom:7px;padding:5px 6px;gap:5px}
 .capture-record i{width:5px;height:5px}
 .capture-speech{min-height:34px;padding:7px 10px;gap:8px}
 .capture-speech>span{font-size:7px}
 .capture-speech p{font-size:12px;line-height:1.3}
 .capture-scribe{grid-template-columns:90px minmax(0,1fr);padding:10px 12px;gap:12px}
 .capture-notepad{padding:9px 12px;border-radius:6px}
 .capture-notepad-heading>span{font-size:7px;line-height:1.2;letter-spacing:.025em}
 .capture-notepad-heading>i{font-size:15px}
 .capture-notepad h3{display:none}
 .capture-notepad li{font-size:12px;padding:5px 0;gap:6px;line-height:1.2}
 .capture-notepad li>b{font-size:10px}
 .capture-note-status{display:none}
 .capture-footer{min-height:34px;gap:8px}
 .capture-playback{gap:7px}
 .capture-playback button{font-size:10px;min-height:32px;padding:6px 8px}
 .capture-playback>span{font-size:7px;max-width:87px}
 .capture-next{font-size:11px;min-height:34px;gap:0}
 .capture-next{font-size:0}.capture-next strong{font-size:12px}
}
@media(max-width:360px){.capture{padding:10px 12px;gap:8px}.capture-heading h2{font-size:28px}.capture-scribe{grid-template-columns:72px minmax(0,1fr);padding:8px;gap:8px}.capture-notepad{padding:8px 10px}.capture-notepad li{font-size:11px}.capture-setting{font-size:9px}.capture-speech p{font-size:11px}}
@media(max-height:650px) and (min-width:761px){
 .capture{padding:12px 24px;gap:8px}.capture-heading h2{font-size:34px}.capture-heading .eyebrow{font-size:8px;margin-bottom:5px}.capture-tabs button{min-height:34px;padding:7px 14px;font-size:12px}.capture-steps li{padding:7px 0;font-size:12px}.capture-scribe{padding:12px;gap:8px}.capture-notepad{padding:12px 16px}.capture-notepad li{font-size:12px;padding:7px 0}.capture-notepad h3{font-size:16px;margin:8px 0}.capture-note-status{font-size:9px;margin-top:8px}.capture-speech{min-height:44px;padding:9px 14px}.capture-speech p{font-size:13px}.capture-notepad-heading>span{font-size:8px}
}
@media(prefers-reduced-motion:reduce){html{scroll-snap-type:none}.capture-notepad li{transition:none}}

@media(max-width:760px) and (max-height:600px){
 .capture-heading .eyebrow{display:none}.capture-heading{gap:6px}
 .capture-stage{grid-template-rows:minmax(0,1.2fr) minmax(0,1fr)}
 .capture-scribe{grid-template-columns:72px minmax(0,1fr);padding:6px 8px;gap:8px}
 .capture-notepad li{font-size:11px;padding:4px 0}
 .capture-steps li{font-size:9px;padding-top:6px}
}
@media(max-height:480px){.capture{height:auto;min-height:calc(100svh - var(--header-height))}.capture-stage{min-height:300px}}