/* Hallmark pre-emit critique: preserve page compositions; unify reading hierarchy,
 * naming, return states and touch targets. Responsive verification recorded with v91.
 * This is a component repair, not a competition score. */
:root{
 --reading-paper:#fff;--reading-ink:#24292c;--reading-muted:#53616a;
 --reading-rule:#dce1e4;--reading-accent:var(--red-deep);--reading-soft:#f3f5f5;
 --reading-body:var(--font-body);--reading-heading:var(--entry-heading);
 --reading-space:clamp(16px,4.5vw,28px);
}
#info-dialog[open]{position:fixed;inset:0;display:flex;flex-direction:column;width:100vw;max-width:none;height:100vh;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:0;overflow:clip;background:var(--reading-paper);color:var(--reading-ink)}
#info-dialog .drawer-head{position:relative;inset:auto;flex:none;margin:0;padding:calc(10px + env(safe-area-inset-top)) var(--reading-space) 10px;min-height:64px;gap:10px;border-bottom:1px solid var(--reading-rule);background:var(--reading-paper)}
#info-dialog .drawer-head h2{flex:1;min-width:0;margin:0;color:var(--reading-ink);font:700 21px/1.4 var(--reading-heading);overflow-wrap:anywhere}
#info-dialog .drawer-head button{display:grid;place-items:center;flex:none;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;border:1px solid var(--reading-rule);border-radius:50%;background:var(--reading-paper);color:var(--reading-ink);font:400 25px/1 var(--reading-body);text-decoration:none}
#info-dialog .drawer-head button[hidden]{display:none}
#info-dialog .drawer-head [data-close]{font-size:0}
#info-dialog .drawer-head [data-close]:after{content:'×';font:400 25px/1 var(--reading-body)}
#info-dialog.drawer #info-body{flex:1;min-height:0;width:100%;max-width:720px;align-self:center;margin:0;padding:20px var(--reading-space) calc(32px + env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;font:400 16px/1.85 var(--reading-body);color:var(--reading-ink);user-select:text;overflow-wrap:anywhere}
#info-dialog #info-body p{font-size:inherit;line-height:inherit;margin-block:0 14px}
#info-dialog #info-body h3{font:600 19px/1.5 var(--reading-body);margin:26px 0 10px;color:var(--reading-ink)}
#info-dialog #info-body h3:first-child{margin-top:0}
#info-dialog #info-body small,#info-dialog #info-body .fine-print,#info-dialog #info-body figcaption{font-size:13px;line-height:1.7;color:var(--reading-muted)}
#info-dialog #info-body a{color:var(--reading-accent);text-underline-offset:4px;overflow-wrap:anywhere}
#info-dialog #info-body article{padding:14px 0;border-bottom:1px solid var(--reading-rule)}
#info-dialog #info-body article h3{margin:4px 0 10px}
#info-dialog #info-body button{min-height:44px;touch-action:manipulation}
#info-dialog #info-body .text-link{font-size:15px;line-height:1.6;text-align:left}
#info-dialog #info-body summary{min-height:44px;cursor:pointer;font-size:15px;line-height:1.6;padding-block:10px}
#info-dialog #info-body .reading-license{margin-top:20px;border-top:1px solid var(--reading-rule)}
#info-dialog :focus-visible{outline:2px solid var(--reading-accent);outline-offset:-2px}
#info-dialog .drawer-head button:active{background:var(--reading-soft)}
#info-dialog #info-body .journal-list article>p{margin-top:10px;padding-left:12px;border-left:2px solid var(--reading-rule)}
#case-return{min-height:44px;padding:0 5px;color:inherit;font:500 13px/1.5 var(--reading-body);white-space:nowrap;text-underline-offset:4px}
#case-return[hidden]{display:none}
#case-return:focus-visible{outline:2px solid var(--reading-accent);outline-offset:2px}

/* Material identities must agree with the image being enlarged. */
#image-dialog.is-photo-viewer .drawer-head h2:before{display:none}
#image-dialog.is-photo-viewer .drawer-head h2:after{content:attr(data-material-label);display:block;margin-top:4px;font:400 13px/1.5 var(--reading-body);color:var(--reading-muted)}
.is-map-viewer .drawer-head h2:before,.is-map-viewer .map-viewer-hint,.is-map-viewer .map-viewer-credit summary,.is-map-viewer .map-viewer-note{font-size:13px}

/* Keep the map visible. Optional geographic follow-up opens over the footer,
 * scrolls independently and never consumes the rest of the map's height. */
.chishui-summary .map-stage-notes{margin-top:4px}
.map-stage-notes summary{font:500 13px/1.5 var(--cm-font);min-height:44px;display:flex;align-items:center;cursor:pointer;color:var(--cm-red);list-style:none}
.map-stage-notes summary:after{content:'＋';margin-left:6px}
.map-stage-notes[open] summary:after{content:'−'}
.map-stage-notes summary::-webkit-details-marker{display:none}
.map-stage-notes>div{position:absolute;left:12px;right:12px;bottom:calc(100% + 8px);z-index:12;background:var(--cm-paper);border:1px solid var(--cm-rule);padding:14px 16px;max-height:35dvh;overflow:auto;overscroll-behavior:contain;box-shadow:0 3px 12px var(--cm-shadow)}
.chishui-summary #chishui-path,.chishui-summary #chishui-followup{font-size:14px;line-height:1.65}
.chishui-head p,.chishui-endpoints small,.chishui-tabs small,.chishui-credit summary,.chishui-tools output{font-size:13px}
.chishui-hint{font-size:13px;line-height:1.5;margin-top:3px}
.chishui-summary{padding-block:6px;position:static}
.chishui-endpoints button{padding-block:3px}
#p8-map-dialog .p8-map-reading{min-height:0;padding-top:6px}
#p8-map-dialog .p8-map-reading h3{margin:0}
#p8-map-dialog .p8-map-reading>p:last-child{padding:5px 0 8px;line-height:1.55}
#p8-map-dialog .p8-map-reading-date,.p8-map-head p,.p8-map-tools button,.p8-map-tools output,.p8-map-hint{font-size:13px}
#p8-map-dialog .p8-stops button{min-height:52px;padding-block:6px}

/* Necessary annotations stay legible; each page retains its own composition. */
.turning-reading figcaption,.turning-reading .fine-print,
.tactics-reading .tactics-map figcaption,.tactics-reading .crossing-controls small,
.mountain-reading .mountain-landscape figcaption,
.people-renewed .p7-landscape figcaption,.people-renewed .p7-source-caption,
.arrival-renewed .p8-map-figure figcaption,.arrival-renewed .p8-map-figure figcaption span,
.arrival-renewed .p8-map-figure figcaption button,.arrival-renewed .p8-evidence,
.p9-material-note,.p10-material figcaption,.finale-renewed .p10-note{font-size:13px;line-height:1.5}
.reunion-renewed .p9-photo figcaption{font-size:13px;line-height:1.5}
.bridge-reading .bridge-exhibit figcaption,.bridge-reading .bridge-photo-tag{font-size:13px;line-height:1.5}
.tactics-reading .p4-map-legend small,.tactics-reading .p4-map-legend strong,.tactics-reading .p4-map-legend em{font-size:12px}
.mountain-reading .photo-observation{display:none}
.mountain-reading .photo-credit{display:block}
.mountain-reading .mountain-landscape{grid-template-columns:minmax(0,1fr)}
.mountain-reading .mountain-landscape .photo-credit span{white-space:normal}
.mountain-reading .photo-credit span+span:before{content:' · '}
.atlas.page2-tight .atlas-heading{padding-top:8px}
.people-renewed .p7-landscape figcaption{max-width:calc(100% - 2 * var(--gutter))}

@media(min-width:768px){#info-dialog .drawer-head{padding-inline:max(var(--reading-space),calc((100vw - 720px)/2 + var(--reading-space)))}}
@media(max-width:350px){#info-dialog .drawer-head h2{font-size:19px}.chishui-tabs button{gap:3px}.chishui-tabs small{font-size:12px}.chishui-endpoints strong{font-size:12px}.tactics-reading .p4-map-legend{gap:3px}.tactics-reading .p4-map-legend em{display:none}.tactics-reading .p4-map-legend{grid-template-columns:1fr 1fr}.people-renewed .p7-landscape figcaption{font-size:12px}.arrival-renewed .p8-map-figure figcaption span{max-width:none}}
@media(orientation:portrait) and (max-height:620px){.chishui-hint{display:none}.chishui-head{padding-block:calc(4px + env(safe-area-inset-top)) 4px}.chishui-head p{display:none}.chishui-tabs button{min-height:44px}.chishui-summary p{font-size:14px;line-height:1.5}.chishui-endpoints button{min-height:44px}.chishui-endpoints strong{font-size:13px}.people-renewed .p7-source-caption{font-size:12px}}
@media(orientation:landscape) and (max-height:500px){#info-dialog .drawer-head{padding-block:calc(4px + env(safe-area-inset-top)) 4px;min-height:52px}}
@media(prefers-reduced-motion:reduce){#info-dialog button{transition:none}}

/* Hallmark · pre-emit critique: P4 H5 E4 S5 R5 V4. Existing editorial tokens. */
#info-dialog #info-body .reading-outline{margin:0 0 20px;border-block:1px solid var(--reading-rule)}
#info-dialog #info-body .reading-outline>summary,#info-dialog #info-body .reading-evidence>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;font-weight:600;color:var(--reading-accent)}
#info-dialog #info-body .reading-outline>summary::-webkit-details-marker,#info-dialog #info-body .reading-evidence>summary::-webkit-details-marker{display:none}
#info-dialog #info-body .reading-outline>summary:after,#info-dialog #info-body .reading-evidence>summary:after{content:'＋';flex:none}
#info-dialog #info-body .reading-outline[open]>summary:after,#info-dialog #info-body .reading-evidence[open]>summary:after{content:'−'}
#info-dialog #info-body .reading-outline nav{display:grid;padding-bottom:8px}
#info-dialog #info-body .reading-outline button{display:grid;grid-template-columns:2em minmax(0,1fr);gap:8px;align-items:center;padding:8px 0;min-height:44px;border:0;border-radius:0;background:var(--reading-paper);color:var(--reading-ink);font:400 15px/1.6 var(--reading-body);text-align:left}
#info-dialog #info-body .reading-outline button span:first-child{color:var(--reading-muted);font-variant-numeric:tabular-nums}
#info-dialog #info-body .reading-outline button span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#info-dialog #info-body .reading-outline button:active{background:var(--reading-soft)}
#info-dialog #info-body .reading-evidence{margin:24px 0 16px;padding-top:4px;border-top:1px solid var(--reading-rule)}
#info-dialog #info-body .reading-evidence>div{padding-top:8px}
#info-dialog #info-body .reading-evidence>div>p:has(a){margin-top:18px;margin-bottom:5px;font-weight:500}
#info-dialog #info-body .reading-evidence>div>p:has(a)+p{color:var(--reading-muted);font-size:15px;line-height:1.75}

/* First answer, then context: a readable distinction without extra cards. */
#info-dialog #info-body .reading-answer{font-weight:500;color:var(--reading-ink);padding-left:12px;border-left:2px solid var(--reading-accent);line-height:1.8}
#info-dialog #info-body .reading-answer+p{margin-top:12px}
#info-dialog #info-body .reading-section-intro{margin-top:28px;padding-top:16px;border-top:1px solid var(--reading-rule);font-weight:600}
#info-dialog #info-body h3{max-width:32em;text-wrap:pretty}

/* Keep the close mark independent of text baselines and anonymous grid rows. */
#info-dialog .drawer-head [data-close],
#image-dialog .drawer-head [data-close],
#chishui-dialog .chishui-close{position:relative;display:block;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;flex:none;font-size:0;line-height:0}
#info-dialog .drawer-head [data-close]::before,#info-dialog .drawer-head [data-close]::after,
#image-dialog .drawer-head [data-close]::before,#image-dialog .drawer-head [data-close]::after,
#chishui-dialog .chishui-close::before,#chishui-dialog .chishui-close::after{content:'';position:absolute;top:50%;left:50%;width:18px;height:2px;border-radius:1px;background:currentColor;transform:translate(-50%,-50%) rotate(45deg);pointer-events:none}
#info-dialog .drawer-head [data-close]::after,
#image-dialog .drawer-head [data-close]::after,
#chishui-dialog .chishui-close::after{transform:translate(-50%,-50%) rotate(-45deg)}