/* zimai 0.20 polish layer. Generated by scripts/build-polish.mjs; edit scripts/polish-0.20-details.css. */
/* ---- Legibility floor: 162 selectors from 29 stylesheets set text below 11 px ---- */
#collection-search-results .card-facts dt,
#collection-search-results .card-kind,
#collection-search-results .dictionary-row .result-number,
#collection-search-results .dictionary-row .result-source,
#collection-search-results .panel-heading a,
#collection-search-results .search-type-tabs>a>span,
.alternate-forms,
.atlas-orientation .eyebrow,
.atlas-view .card-gloss,
.breadcrumbs,
.character-detail-grid .language-panel .eyebrow,
.chip,
.classical-char-cloud button span,
.classical-counts span,
.classical-index,
.classical-inspector-label,
.classical-note-meta,
.classical-note>small,
.classical-outline h2,
.classical-outline nav i,
.classical-outline nav small,
.classical-paper-label,
.classical-related small,
.classical-tabs .classical-source-tab,
.classical-work-card footer,
.collection-app .collection-inspector-bar button,
.collection-app .field-meta,
.collection-app .field-toolbar button,
.collection-app .network-summary p,
.collection-app.searching .collection-tabs>button,
.collection-character-grid small,
.collection-filters,
.collection-filters label>span,
.collection-footnote,
.collection-heading .section-tag,
.collection-history>span,
.collection-index-note,
.collection-inspector .home-component-path small,
.collection-inspector .home-entry-top,
.collection-inspector .home-glyph-caption,
.collection-inspector .home-source-map summary>span:last-child,
.compact-grid .card-gloss,
.compact-grid .card-reading,
.comparison-facts small,
.comparison-grid header .status-label,
.component-children small,
.component-tile small,
.connection-chip-list small,
.connection-controls-row>button,
.connection-entry-metrics>span,
.connection-export button,
.connection-export>span,
.connection-links .button,
.connection-path span,
.connection-reference small,
.connection-row-body>small,
.connection-row-number,
.connection-status,
.connection-version,
.connection-work-buttons span,
.coverage-metrics span,
.depth-card .dictionary-reading-value small,
.edition-label,
.entry-tools button,
.exact-eyebrow,
.exact-result small,
.eyebrow,
.fact-pair>span,
.featured-grid .card-gloss,
.featured-grid .card-reading,
.field-accessible small,
.field-caption,
.field-corner-label>small,
.field-hover small,
.field-meta,
.field-relation-key,
.field-toolbar button,
.field-zoom output,
.figure-caption,
.footer-meta,
.graph-edge text,
.home-card-label,
.home-component-path small,
.home-glyph-caption,
.home-page .home-kicker,
.home-readings small,
.home-senses>div>span,
.home-source-grid>a>span,
.hw-w,
.identity-facts small,
.ids-leaf>small,
.ids-operator small,
.index-filters label,
.index-filters>.small,
.index-grid .card-gloss,
.index-grid .card-reading,
.inline-controls,
.inspector>.button,
.inspector>.eyebrow,
.inspector>button[data-pin],
.lane-label,
.language-section>.small,
.language-source-links .text-link,
.language-tabs a,
.license-table td,
.license-table th,
.margin-block .eyebrow,
.margin-block .small,
.margin-block>a,
.modern-specimen>span:last-child,
.network-actions [data-network-count],
.network-summary button,
.pin-tray .small,
.portrait-body .section-heading .eyebrow,
.portrait-body p.small,
.portrait-code,
.portrait-identity .eyebrow,
.qualification strong,
.radical-chip small,
.radical-entry>.small,
.radical-member>.small,
.radical-title>span:last-child,
.reading-strip span:last-child,
.relation-field>a>small,
.relation-row small,
.relation-why,
.result-alternatives,
.result-number,
.result-source,
.results-heading .search-state,
.results-heading>.small,
.search-edition,
.search-examples,
.search-recents>span,
.search-scope-note,
.section-heading>.text-link,
.section-tag,
.sense-number,
.sentence-analysis-scope,
.sentence-lookup-group h4 small,
.sentence-reader-top .section-tag,
.sentence-result-language,
.sentence-source,
.source-list,
.source-list .small,
.source-tag,
.status-label,
.structure-card details small,
.study-item small,
.tile-number,
.tone-card-heading>span,
.tone-syllable small,
.topic-button,
.understand .eyebrow,
.vertical-label,
.view-heading .eyebrow,
.view-heading>.text-link,
.wander-discoveries small,
.wander-trail>span,
.workspace-layouts button,
html body .field-corner-label small,
th{font-size:11px}

/* ---- Hand-tuned details (scripts/polish-0.20-details.css) ---------------------------------------
   Findings of the 0.20 rendered audit at 375–1440 px in both themes: boxed blocks whose text touched
   their edges, cards stacked without a gap, small touch targets and a caption colliding with its glyph. */

/* Hover underlines (best practice): only inline text links get the fine underline. Rows and cards (results,
   best match, character rows, tone cells…) answer with their background tint and the arrow nudge instead of
   underlining every line inside them. */
/* One card gap everywhere (--card-gap: 16 px, 12 px on phones). Cards never touch: a boxed card that
   follows another keeps the gap as margin; in grids and flex stacks the container gap does the spacing
   and the margin is dropped, so the two never add up (entry cards stood 14, 16 or 30 px apart). */
:root{--card-gap:16px}
@media (max-width:640px){:root{--card-gap:12px}}
.detail-card + .detail-card{margin-top:var(--card-gap)}
.character-chapter > .detail-card + .detail-card{margin-top:var(--card-gap)}
html body :is(.word-detail-grid,.character-detail-grid,.detail-column,.catalog-record-grid),html body :is(#collection-entry,#entry-content,#main) :is(.word-detail-grid,.character-detail-grid,.detail-column){gap:var(--card-gap)}
:is(.catalog-record-grid,[class*="-grid"],[class*="grid-"],.detail-column) > .detail-card + .detail-card,
:is(.word-detail-grid,.character-detail-grid) > .detail-column > .detail-card + .detail-card{margin-top:0}
html body .catalog-record-grid{align-items:stretch}
/* A card grid that follows another block (e.g. Historical readings after 03 / Words & usage) keeps the standard gap. */
html body * + .catalog-record-grid{margin-top:var(--card-gap)}

/* Tinted bands and panels keep their text off the edges. */
.character-document .character-chapter .detail-card > .detail-card-heading{padding:12px 14px;border-radius:8px}
.detail-decomposition{padding:10px 12px 12px}
.ids-leaf{padding:5px 8px}
.mini-word-list > a.mini-word{padding-inline:10px}
.tone-syllable{padding-inline:10px}
.collection-app .collection-inspector-bar{padding-inline:12px}
.collection-inspector-bar [data-close-inspector]{margin-right:-4px}

/* Glyph stage: the glyph sits in its own clearly bounded square with 米字格 guides and scales to fit it
   (container units), so it never meets the caption, which sits below the square. */
html body .home-glyph-stage{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;min-height:0;padding:0;border:0;border-radius:0;background:none;overflow:visible;container-type:inline-size}
html body .home-glyph-stage:before,html body .home-glyph-stage:after{content:none}
html body .collection-app .collection-inspector .home-glyph-stage > .han,html body .home-glyph-stage > .han{display:grid;place-items:center;aspect-ratio:1;line-height:1;font-size:min(96px,64cqi);border:1px solid var(--rule);border-radius:10px;
 background:linear-gradient(color-mix(in srgb,var(--rule) 70%,transparent),color-mix(in srgb,var(--rule) 70%,transparent)) center/1px 100% no-repeat,linear-gradient(color-mix(in srgb,var(--rule) 70%,transparent),color-mix(in srgb,var(--rule) 70%,transparent)) center/100% 1px no-repeat,var(--subtle);transition:border-color .18s ease}
html body .home-glyph-stage:hover > .han{border-color:color-mix(in srgb,var(--accent) 45%,var(--rule))}
html body .home-glyph-caption{display:flex;flex-direction:column;align-items:center;gap:2px;padding:0 2px;font-size:11px;line-height:1.25;letter-spacing:.01em;text-align:center;color:var(--muted)}
html body .home-glyph-caption b{font-weight:600;color:var(--ink)}
html body .home-glyph-caption [title]{cursor:help}

/* Release fingerprint beside the version in the footer (scripts/release-fingerprint.mjs). */
.release-fingerprint{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--muted);cursor:help}

/* Touch: standalone links and controls get at least a 40 px target; inline links in definitions,
   tables and notes get a taller hit area without changing the line layout. */
@media (pointer:coarse){
 .breadcrumbs a,.footer-links a,.connection-entry-actions a,.tone-card-links > :is(a,button),.sentence-credit a,
 .sentence-reader-top a,.sentence-reader-actions a,.panel-heading a,.lookup-sources,.card-action,.home-readings > a,
 .home-historical-link,.sentence-lookup-entry > a,.sentence-more-examples{min-height:40px;display:inline-flex;align-items:center}
 :is(dt,dd,td,small,.entry-provenance,.detail-card-body,.home-definition) > a,a.cite{padding-block:9px;margin-block:-9px}
 input[type=checkbox],input[type=radio]{width:22px;height:22px}
}

/* Every text link answers the pointer: a soft underline on hover, and the ↗ arrow nudges toward where it
   leads. Card-like links (rows, tiles, results) keep their own background hover and are not underlined. */
@media (hover:hover){
 :is(p,li,dd,dt,td,small,figcaption,.detail-card-body,.breadcrumbs,.footer-links,.pack-head-links,.connection-entry-actions,.home-readings,.sentence-credit,.entry-provenance,.lookup-line-body) > a:not(.button):hover,
 a:has(> [aria-hidden="true"]:last-child):not(.button,.brand,.dictionary-row,.exact-result,.best-match,.char-row,.best-part,.tone-cell,.tone-word,.browse-index-link,.collection-word,.saved-entry,.unified-word-hit,.wander-choice):not(:is(.connection-hits,.unified-character-hits,.longer-entries,.result-word) > a):hover,
 :is(.text-link,.card-action,.word-permalink,.return-atlas,.lookup-sources,.home-historical-link,.home-inline-link,.sentence-more-examples,.sentence-permalink,.dictionary-crossref):hover{text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:.24em;text-decoration-color:color-mix(in srgb,currentColor 50%,transparent)}
 a > [aria-hidden="true"]:last-child{display:inline-block;transition:transform .18s cubic-bezier(.3,.7,.3,1)}
 a:hover > [aria-hidden="true"]:last-child{transform:translate(1.5px,-1.5px)}
}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}

/* Other Chinese languages & varieties: a full-width header over even variety cards. Each card shows
   name, native name and status with a chevron; an opened card takes the full row, so its guide reads
   at a comfortable width, and only one is open at a time (name attribute, character pages). */
html body .reading-guides{grid-template-columns:repeat(auto-fill,minmax(min(100%,232px),1fr));gap:8px;align-items:start;padding-top:16px}
html body .reading-guides > :not(details){grid-column:1/-1;margin:0}
html body .reading-guides > p{margin:0 0 6px;font-size:13px}
html body .reading-guides > .small:last-child,html body .reading-guides > p:last-child{margin:8px 0 0}
html body .reading-guide{margin:0;padding:0;border-radius:10px;background:var(--white);transition:border-color .18s ease,box-shadow .18s ease}
html body .reading-guide:hover{border-color:color-mix(in srgb,var(--accent) 35%,var(--rule))}
html body .reading-guide[open]{grid-column:1/-1;background:var(--white);border-color:color-mix(in srgb,var(--accent) 50%,var(--rule));box-shadow:0 10px 28px #0000000f}
html body .reading-guide > summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) 16px;align-items:center;gap:2px 10px;min-height:58px;padding:10px 14px;font-size:14px;color:var(--ink)}
html body .reading-guide > summary::-webkit-details-marker{display:none}
html body .reading-guide > summary > span{grid-column:1;font-weight:600;line-height:1.3}
html body .reading-guide > summary > span > [lang]{font-weight:400;color:var(--muted);margin-left:3px}
html body .reading-guide > summary > small{grid-column:1;grid-row:2;display:block;margin:0;padding:0;font-size:12px;color:var(--muted)}
html body .reading-guide > summary::after{content:'';grid-column:2;grid-row:1/3;justify-self:center;width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;color:var(--muted);transform:translateY(-2px) rotate(45deg);transition:transform .22s cubic-bezier(.3,.7,.3,1)}
html body .reading-guide[open] > summary::after{transform:translateY(2px) rotate(-135deg);color:var(--accent)}
html body .reading-guide > summary:hover{color:var(--ink)}
html body .reading-guide > summary:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:10px}
html body .reading-guide-body{padding:12px 16px 14px;border-top:1px solid var(--rule)}
html body .reading-guide-body > :first-child{margin-top:0}
html body .reading-guide-body .language-source-links{padding-bottom:0}
/* The same disclosure language for "Usage scope" and "Source record & scope". */
html body .reading-evidence{border-radius:10px;padding:0}
html body .reading-evidence > summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 14px}
html body .reading-evidence > summary::-webkit-details-marker{display:none}
html body .reading-evidence > summary::after{content:'';flex:none;width:7px;height:7px;border-right:1.6px solid var(--muted);border-bottom:1.6px solid var(--muted);transform:translateY(-2px) rotate(45deg);transition:transform .22s cubic-bezier(.3,.7,.3,1)}
html body .reading-evidence[open] > summary::after{transform:translateY(2px) rotate(-135deg)}
html body .reading-evidence > :not(summary){margin-inline:14px}
/* Smooth open/close where the browser can animate to auto height. */
@supports (interpolate-size:allow-keywords){
 html body :is(.reading-guide,.reading-evidence){interpolate-size:allow-keywords}
 html body :is(.reading-guide,.reading-evidence)::details-content{block-size:0;overflow:clip;transition:block-size .3s cubic-bezier(.3,.7,.3,1),content-visibility .3s allow-discrete}
 html body :is(.reading-guide,.reading-evidence)[open]::details-content{block-size:auto}
}
@media (prefers-reduced-motion:reduce){html body :is(.reading-guide,.reading-evidence)::details-content{transition:none}}

/* Reading shelf: a real header, a designed empty state with tappable examples, entries as cards. */
html body .saved-opening{padding:20px 18px 6px}
html body .saved-opening h2{margin:0 0 4px;font:600 21px/1.25 var(--serif);letter-spacing:-.005em;color:var(--ink)}
html body .saved-opening p{margin:0;font-size:14px;color:var(--muted)}
html body #collection-saved-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:8px;padding:12px 18px 20px}
html body .saved-empty{grid-column:1/-1;display:grid;justify-items:center;gap:12px;padding:28px 18px 24px;border:1.5px dashed var(--rule);border-radius:14px;background:color-mix(in srgb,var(--subtle) 60%,transparent);text-align:center;font-size:14.5px;line-height:1.55;color:var(--muted)}
html body .saved-empty svg{width:30px;height:30px;fill:color-mix(in srgb,var(--accent) 14%,transparent);stroke:var(--accent);stroke-width:1.6;stroke-linejoin:round}
html body .saved-empty p{margin:0;max-width:38ch}
html body .saved-empty strong{display:block;margin-bottom:3px;font-size:16px;font-weight:600;color:var(--ink)}
html body .saved-empty b{font-weight:600;color:var(--ink);white-space:nowrap}
html body .saved-try{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}
html body .saved-try > span{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
html body .saved-try > a{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--rule);border-radius:11px;background:var(--white);font-family:var(--han-display-tc);font-size:25px;line-height:1;color:var(--ink);text-decoration:none;transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease}
html body .saved-try > a:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 6px 16px #00000012}
html body .collection-app .saved-entry,html body .saved-entry{grid-template-columns:auto minmax(0,1fr) auto;gap:12px;padding:10px 14px;border:1px solid var(--rule);border-radius:11px;background:var(--white);color:var(--ink);text-decoration:none;transition:border-color .16s ease}
html body .saved-entry:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--rule))}
html body .saved-entry > [lang]{font-size:28px;line-height:1.1}
html body .saved-entry > span:nth-child(2){font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Word list stream on phones (collection.mjs): the list flows in the page instead of a nested scroller,
   pages are marked, and the pager is a floating pill that shows the page in view and opens a jump field. */
.word-page-marker{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:14px 0 2px;padding:6px 2px;border-bottom:1px solid var(--rule);font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--ink)}
.word-page-marker:first-of-type{margin-top:2px}
.word-page-marker small{font-weight:400;color:var(--muted);font-variant-numeric:tabular-nums}
.word-stream-end{height:1px}
.word-stream-start{display:block;width:100%;min-height:42px;margin:6px 0;border:1px dashed var(--rule);border-radius:10px;background:none;color:var(--accent);font:600 13px/1 var(--sans);cursor:pointer}
.word-stream-start[hidden]{display:none}
#collection-word-page{cursor:pointer;font-variant-numeric:tabular-nums}
.word-page-jump{display:inline-flex;align-items:center;gap:6px;margin:0}
.word-page-jump label{display:inline-flex;align-items:center;gap:6px;font-size:13px}
.word-page-jump input{width:5.5em;min-height:34px;padding:2px 8px;border:1px solid var(--accent);border-radius:8px;background:var(--white);color:var(--ink);font:inherit;font-variant-numeric:tabular-nums}
.word-page-jump button{min-height:34px;padding:0 12px;border:0;border-radius:8px;background:var(--accent);color:var(--white);font:600 13px/1 var(--sans);cursor:pointer}
@media (max-width:850px){
 html body .collection-app .collection-word-scroll,html body .collection-word-scroll{flex:none;height:auto;min-height:0;max-height:none;overflow:visible;padding-bottom:8px}
 html body #collection-words .collection-pager{position:sticky;bottom:calc(12px + env(safe-area-inset-bottom));z-index:6;display:flex;align-items:center;justify-content:center;gap:2px;width:max-content;max-width:calc(100% - 8px);margin:8px auto 4px;padding:4px;border:1px solid var(--rule);border-radius:999px;background:color-mix(in srgb,var(--white) 90%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 30px #0000002a}
 html body #collection-words .collection-pager button{min-height:40px;min-width:44px;padding:0 12px;border:0;border-radius:999px;background:none;color:var(--ink);font:600 14px/1 var(--sans)}
 html body #collection-words .collection-pager button:disabled{opacity:.35}
 html body #collection-words #collection-word-page{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;background:var(--subtle);font-size:13px;font-weight:600;color:var(--ink)}
}
/* Phones: in split view the reading half gets the larger share (the handle still resizes it), and the app
   is tall enough for several rows of characters or words. */
@media (max-width:640px){
 html body .collection-app{--dict-fr:60fr;--visual-fr:40fr;--dict-share:62%;height:max(900px,calc(100dvh - var(--workspace-top,185px)))}
 html body .collection-app .collection-character-grid.character-scroll{min-height:300px}
}
/* Index links under Characters and Words: a clear card with what it opens, and the dossier legend beneath. */
.browse-index-link{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1px 10px;margin:10px 12px 0;padding:10px 14px;border:1px solid var(--rule);border-radius:11px;background:var(--white);color:var(--ink);text-decoration:none;transition:border-color .16s ease,box-shadow .16s ease}
.browse-index-link span{font-size:14px;font-weight:600}
.browse-index-link small{grid-column:1;font-size:12px;color:var(--muted)}
.browse-index-link b{grid-column:2;grid-row:1/3;font-weight:400;color:var(--accent);transition:transform .18s cubic-bezier(.3,.7,.3,1)}
.browse-index-link:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--rule));box-shadow:0 6px 16px #0000000d}
.browse-index-link:hover b{transform:translate(1.5px,-1.5px)}
html body .collection-index-note{justify-content:flex-start;gap:8px;margin:0 12px;padding:8px 2px 10px;border-top:0;font-size:12px;color:var(--muted)}
html body .collection-index-note .dossier-key{flex:none;width:7px;height:7px;border-radius:50%;background:var(--accent)}

/* Character pages: readable shape description over the source notation; lookups for JA/KO/VI. */
.ids-readable .ids-human{font-size:15px;font-weight:600;color:var(--ink)}
.ids-readable .ids-regions{color:var(--muted)}
.ids-readable .ids-notation{font-size:12px;color:var(--muted)}
.ids-readable .ids-notation code{margin-left:4px;padding:1px 6px;border:1px solid var(--rule);border-radius:5px;background:var(--subtle);font-size:12px;cursor:help}
.cross-reading-links{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:8px 0 10px;font-size:13px}
.cross-reading-links > span{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}

/* The "/" search shortcut only means something with a keyboard: hidden on touch and narrow screens,
   explained on hover elsewhere, and out of the way while the search field has focus. */
.search-key{cursor:help}
.global-search-inner:focus-within .search-key{opacity:0}
@media (pointer:coarse),(max-width:700px){.search-key{display:none}}

/* Logo lockup: a 朱文印 — a vermilion relief seal: 字 above 脈 and a vermilion frame stamped onto the paper,
   beside the wordmark like an artist's seal beside a signature. Real weights only (Noto Sans TC 600). */
:root{--seal:#b8322a}
[data-theme=dark]{--seal:#ec6a5c}
html body .site-header .brand{display:inline-flex;align-items:center;gap:11px}
/* The seal is drawn, not typeset: seal-light/dark.png (4x) are rendered in clerical script (Libian), emboldened
   by an even outline stroke, with the box sized from the measured ink: equal margins, 字 close above 脈, and a
   heavier variant (-sm) for the smaller phone size, where thin strokes would fade. */
html body .brand-emblem{display:inline-block!important;flex:none;width:31.5px;height:43.5px;padding:0;border:0;border-radius:4px;background:url(/assets/polish-0.20.0/seal-light.png) center/100% 100% no-repeat;box-shadow:none;font-size:0;color:transparent;outline:0;transform:translateY(1px)}
[data-theme=dark] .brand-emblem{background-image:url(/assets/polish-0.20.0/seal-dark.png)!important}
html body .brand-emblem i{display:none}
html body .site-header .brand-han{display:none}
html body .wordmark{font-family:'IBM Plex Sans',var(--sans);font-weight:600;letter-spacing:-.04em;line-height:1;font-kerning:normal;text-shadow:none;
 filter:drop-shadow(0 1px 0 rgba(0,0,0,.16)) drop-shadow(0 2px 2px rgba(0,0,0,.07))}
html body .site-header .wordmark,html body .home-page .wordmark{font-size:29px;letter-spacing:-.04em}
/* Wordmark: one colour with a faint plastic sheen (top-lit gradient); "mai" is only a barely cooler step,
   so zi·mai is hinted, not split. Near-white in the dark theme, graphite in the light theme. */
html body .wordmark :is(.wm-zi,.wm-mai){-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
html body .wordmark .wm-zi{color:#2b2e33;background-image:linear-gradient(180deg,#3a3d42 0%,#26292d 60%,#1f2226 100%)}
html body .wordmark .wm-mai{margin-left:.012em;color:#3a3f46;background-image:linear-gradient(180deg,#4a4f57 0%,#363a41 60%,#2c3036 100%)}
[data-theme=dark] .wordmark .wm-zi{color:#f1f2f4;background-image:linear-gradient(180deg,#ffffff 0%,#eef0f2 55%,#dadde1 100%)}
[data-theme=dark] .wordmark .wm-mai{color:#e3e6ea;background-image:linear-gradient(180deg,#f4f6f8 0%,#e1e4e8 55%,#c9cdd3 100%)}
html body .brand-han .wm-zi{color:var(--ink)}
html body .brand-han .wm-mai{color:color-mix(in srgb,var(--muted) 80%,var(--ink))}
@media (forced-colors:active){html body .wordmark :is(.wm-zi,.wm-mai){-webkit-text-fill-color:CanvasText;background:none}}
@media (max-width:640px){html body .site-header .wordmark,html body .home-page .wordmark{font-size:26px}html body .brand-emblem{width:30px;height:41px;background-image:url(/assets/polish-0.20.0/seal-light-sm.png)}[data-theme=dark] .brand-emblem{background-image:url(/assets/polish-0.20.0/seal-dark-sm.png)!important}}

/* Footer, one layout on every page and width: a lean brand column, three titled link columns (Browse,
   Sources, zimai) and the legal line across the bottom. Wide: brand + three columns in one row.
   ≤ 900 px: brand above, three columns. ≤ 640 px: two columns with 40 px rows (zimai wraps under
   Browse). ≤ 300 px: one column. Links never wrap mid-label and never fall under a title. */
html body .site-footer{padding-top:36px;padding-bottom:22px}
html body .footer-main{display:grid;grid-template-columns:minmax(170px,1fr) minmax(0,3fr);grid-template-areas:"brand links" "legal legal";gap:0 56px;align-items:start;max-width:none}
html body .footer-main > .footer-brand{grid-area:brand;margin:0}
html body .footer-main > .footer-links{grid-area:links}
html body .footer-main > .footer-legal{grid-area:legal}
html body .footer-brand .wordmark{display:inline;font:600 15px/1.2 'IBM Plex Sans',var(--sans);letter-spacing:-.01em;color:var(--ink);text-decoration:none}
html body .footer-brand .wordmark::before{content:none}
html body .footer-brand .wordmark :is(.wm-zi,.wm-mai){-webkit-text-fill-color:currentColor;background:none}
html body .footer-brand p{margin:6px 0 0;max-width:24ch;font-size:13px;line-height:1.45;color:var(--muted)}
html body .footer-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 32px;margin:0;padding:0}
html body .footer-group{min-width:0}
html body .footer-group-title{display:block;margin:0 0 8px;font-size:11px;font-weight:600;line-height:20px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
html body .footer-group ul{display:grid;gap:2px;margin:0;padding:0;list-style:none}
html body .footer-group a{display:inline-flex;align-items:center;min-height:28px;font-size:14px;line-height:1.3;color:var(--ink);text-decoration:none;white-space:nowrap;transition:color .16s ease}
@media (hover:hover){html body .footer-group a:hover{color:var(--accent)}}
html body .footer-legal{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 24px;margin-top:28px;padding-top:16px;border-top:1px solid var(--rule);font-size:12.5px;line-height:1.5;color:var(--muted)}
html body .footer-legal a{color:var(--muted);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--muted) 40%,transparent);text-underline-offset:.2em}
@media (hover:hover){html body .footer-legal a:hover{color:var(--accent)}}
@media (max-width:900px){
 html body .footer-main{grid-template-columns:minmax(0,1fr);grid-template-areas:"brand" "links" "legal";gap:22px}
 html body .footer-main > .footer-legal{margin-top:6px}
 html body .footer-brand{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px}
 html body .footer-brand p{margin:0;max-width:none}
}
@media (max-width:640px){
 html body .site-footer{padding-top:28px}
 html body .footer-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px}
 html body .footer-group ul{gap:0}
 html body .footer-group a{min-height:40px;font-size:15px;white-space:normal}
 html body .footer-legal{flex-direction:column;align-items:flex-start;gap:4px}
 html body .footer-legal a{display:inline-flex;align-items:center;min-height:32px}
}
@media (max-width:300px){html body .footer-links{grid-template-columns:minmax(0,1fr)}}

/* Header controls: one shape and one hover for every navbar button (section links, the coverage link,
   the reading-size and theme toggles). Rest states keep their meaning (current page, pressed toggle);
   hover always adds the same quiet fill and hairline, press always sinks by the same step, and focus
   always shows the same ring. Hover only where a real pointer hovers, so touch never sticks. */
html body .site-header :is(.site-nav a,.edition-label,.reading-toggle,.theme-toggle){border:1px solid transparent;border-radius:8px;text-decoration:none;transition:background-color .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease}
html body .site-header :is(.reading-toggle:not([aria-pressed=true]),.theme-toggle){border-color:var(--rule);background:transparent}
html body .site-header .reading-toggle[aria-pressed=true]{border-color:color-mix(in srgb,var(--accent) 55%,var(--rule))}
html body .site-header .edition-label{display:inline-flex;align-items:center;min-height:32px;padding:4px 10px}
@media (max-width:1100px){html body .site-header .edition-label{display:none}}
@media (hover:hover){
 html body .site-header :is(.site-nav a,.edition-label,.reading-toggle,.theme-toggle):hover{background:var(--surface);border-color:color-mix(in srgb,var(--ink) 18%,var(--rule));color:var(--ink);box-shadow:0 1px 0 color-mix(in srgb,var(--ink) 6%,transparent)}
 html body .site-header :is(.site-nav a[aria-current=page],.reading-toggle[aria-pressed=true]):hover{background:var(--tint);color:var(--accent-dark)}
}
html body .site-header :is(.site-nav a,.edition-label,.reading-toggle,.theme-toggle):active{box-shadow:inset 0 1px 2px color-mix(in srgb,var(--ink) 14%,transparent)}
html body .site-header :is(.site-nav a,.edition-label,.reading-toggle,.theme-toggle):focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* Logo: the moving highlight stays inside the red seal. The wordmark keeps its
   quiet vertical shading and gains only a small, stationary relief shadow. */
html body .site-header .brand .brand-emblem{position:relative;overflow:hidden;transition:filter .45s ease}
html body .site-header .brand .brand-emblem::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.35) 42%,rgba(255,255,255,.95) 50%,rgba(255,255,255,.35) 58%,transparent 70%) no-repeat;background-size:320% 100%;background-position:118% 0;-webkit-mask:url(/assets/polish-0.20.0/seal-light.png) center/100% 100% no-repeat;mask:url(/assets/polish-0.20.0/seal-light.png) center/100% 100% no-repeat;transition:background-position .7s cubic-bezier(.33,.6,.2,1)}
html[data-theme=dark] body .site-header .brand .brand-emblem::after{background-image:linear-gradient(105deg,transparent 30%,rgba(255,226,214,.35) 42%,rgba(255,236,228,.95) 50%,rgba(255,226,214,.35) 58%,transparent 70%);-webkit-mask-image:url(/assets/polish-0.20.0/seal-dark.png);mask-image:url(/assets/polish-0.20.0/seal-dark.png)}
@media (max-width:640px){html body .site-header .brand .brand-emblem::after{-webkit-mask-image:url(/assets/polish-0.20.0/seal-light-sm.png);mask-image:url(/assets/polish-0.20.0/seal-light-sm.png)}html[data-theme=dark] body .site-header .brand .brand-emblem::after{-webkit-mask-image:url(/assets/polish-0.20.0/seal-dark-sm.png);mask-image:url(/assets/polish-0.20.0/seal-dark-sm.png)}}
html body .site-header .brand .wordmark .wm-zi{background-image:linear-gradient(180deg,#3a3d42 0%,#26292d 60%,#1f2226 100%)}
html body .site-header .brand .wordmark .wm-mai{background-image:linear-gradient(180deg,#4a4f57 0%,#363a41 60%,#2c3036 100%)}
html[data-theme=dark] body .site-header .brand .wordmark .wm-zi{background-image:linear-gradient(180deg,#ffffff 0%,#eef0f2 55%,#dadde1 100%)}
html[data-theme=dark] body .site-header .brand .wordmark .wm-mai{background-image:linear-gradient(180deg,#f4f6f8 0%,#e1e4e8 55%,#c9cdd3 100%)}
html body .site-header .brand .wordmark :is(.wm-zi,.wm-mai){background-size:100% 100%;background-position:0 0;background-repeat:no-repeat}
html body .site-header .brand .wordmark{filter:none;transition:filter .18s ease}
@media (hover:hover){
 html body .site-header .brand:hover .brand-emblem{filter:saturate(1.1) drop-shadow(0 1px 4px rgba(184,50,42,.28))}
 html[data-theme=dark] body .site-header .brand:hover .brand-emblem{filter:saturate(1.08) drop-shadow(0 1px 6px rgba(232,110,98,.36))}
 html body .site-header .brand:hover .brand-emblem::after{background-position:-18% 0}
 html body .site-header .brand:hover .wordmark{filter:drop-shadow(0 1px 0 rgba(255,255,255,.65)) drop-shadow(0 2px 1px rgba(35,30,24,.12))}
 html[data-theme=dark] body .site-header .brand:hover .wordmark{filter:drop-shadow(0 1px 0 rgba(0,0,0,.5)) drop-shadow(0 2px 2px rgba(0,0,0,.22))}
}
html body .site-header .brand:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:8px}
@media (prefers-reduced-motion:reduce){html body .site-header .brand .wordmark,html body .site-header .brand .brand-emblem,html body .site-header .brand .brand-emblem::after{transition:none}html body .site-header .brand:hover .brand-emblem::after{background-position:118% 0}}

/* Best match: the word's characters, each with its reading in this word and its own meaning. */
html body .best-match-also{display:block;margin-top:6px;font-size:13px;line-height:1.4;color:var(--muted)}
html body .best-match-also b{font-weight:600;color:var(--accent)}
html body .best-parts{display:flex;flex-wrap:wrap;align-items:stretch;gap:6px;margin:8px 0 14px}
html body .best-parts:not([data-state=ready]){min-height:46px}
html body .best-part{display:flex;align-items:center;gap:9px;min-width:0;max-width:100%;padding:6px 12px 6px 8px;border:1px solid var(--rule);border-radius:10px;background:var(--white);color:var(--ink);text-decoration:none;transition:border-color .16s ease,background-color .16s ease}
html body a.best-part:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--rule));background:var(--tint)}
html body .best-part-glyph{flex:none;font:400 24px/1 'Zimai Serif TC',var(--serif);color:var(--ink)}
html body .best-part-text{display:flex;flex-direction:column;min-width:0;line-height:1.25}
html body .best-part-text b{font-size:13px;font-weight:600;color:var(--accent)}
html body .best-part-text span{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:22ch}
html body .best-part-plus{align-self:center;font-size:14px;color:var(--muted)}
@media (max-width:640px){html body .best-part-text span{max-width:16ch}html body .best-part{padding:5px 10px 5px 7px}html body .best-part-glyph{font-size:22px}}
html body .search-relaxed{margin:4px 0 10px;padding:8px 12px;border-left:2px solid color-mix(in srgb,var(--accent) 55%,var(--rule));border-radius:0 8px 8px 0;background:color-mix(in srgb,var(--tint) 70%,transparent);font-size:13.5px;line-height:1.45;color:var(--ink)}
/* Cantonese bridge: a Mandarin entry shown where CC-Canto 2017 has none, visibly marked as such. */
html body .canto-bridge{border-style:dashed}
html body .best-match-reading small{margin-left:4px;font-size:11px;font-weight:500;letter-spacing:.02em;color:var(--muted)}
/* Character rows in entries (German "Schriftzeichen"): glyph, reading in this word, meaning, radical and strokes. */
html body .char-rows{display:grid;gap:8px;margin:0 0 10px}
html body .char-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px 12px 8px 10px;border:1px solid var(--rule);border-radius:10px;background:var(--white);color:var(--ink);text-decoration:none;transition:border-color .16s ease,background-color .16s ease}
html body a.char-row:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--rule));background:var(--tint)}
html body .char-row-glyph{font:400 30px/1 'Zimai Serif TC',var(--serif)}
html body .char-row-text{display:flex;flex-direction:column;min-width:0;gap:1px;line-height:1.3}
html body .char-row-text b{font-size:14px;font-weight:600;color:var(--accent)}
html body .char-row-text span{font-size:14px;color:var(--ink)}
html body .char-row-text small{font-size:12px;color:var(--muted)}
html body .char-row-arrow{color:var(--muted);font-size:13px}
html body .longer-entries{display:grid;gap:2px;margin:0 0 10px;padding:0;list-style:none}
html body .longer-entries a{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:baseline;gap:10px;padding:7px 0;border-bottom:1px solid color-mix(in srgb,var(--rule) 70%,transparent);color:var(--ink);text-decoration:none}
html body .longer-entries a > span:first-child{font:400 18px/1.2 'Zimai Serif TC',var(--serif)}
html body .longer-entries b{font-size:13px;font-weight:600;color:var(--accent)}
html body .longer-entries a > span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;color:var(--muted)}
@media (hover:hover){html body .longer-entries a:hover > span:last-child{color:var(--ink)}}
/* Wander cards: selectable text (copy a gloss or evidence line) while the card stays clickable. */
html body .wander-discoveries>.wander-choice{cursor:pointer;user-select:text;-webkit-user-select:text;color:inherit}
html body .wander-discoveries>.wander-choice:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* Tone atlas (/tones/, scripts/build-tone-atlas.mjs): tone sets, Cantonese six tones, tone-only word pairs, sandhi. */
html body .tone-atlas{display:grid;gap:14px;margin:0 0 40px}
html body .tone-atlas-head h2{margin:6px 0 8px;font:600 clamp(26px,3.4vw,36px)/1.15 var(--serif);letter-spacing:-.012em}
html body .tone-atlas-head p,html body .tone-atlas-note{max-width:68ch;margin:0;font-size:15px;line-height:1.55;color:var(--muted)}
html body .tone-atlas h3{margin:22px 0 2px;font:600 20px/1.25 var(--serif)}
html body .tone-sets{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,520px),1fr));gap:var(--card-gap,16px)}
html body .tone-set{display:grid;grid-template-columns:44px repeat(4,minmax(0,1fr));align-items:stretch;gap:6px;padding:8px;border:1px solid var(--rule);border-radius:12px;background:var(--white)}
html body .tone-set-six{grid-template-columns:44px repeat(6,minmax(0,1fr))}
html body .tone-sets-yue{grid-template-columns:repeat(auto-fill,minmax(min(100%,640px),1fr))}
html body .tone-set-base{align-self:center;justify-self:center;font:600 15px/1 'IBM Plex Sans',var(--sans);letter-spacing:.02em;color:var(--muted)}
html body .tone-cell{display:grid;justify-items:center;align-content:start;gap:3px;min-width:0;padding:8px 4px 9px;border-radius:9px;color:var(--ink);text-align:center;text-decoration:none;transition:background-color .16s ease}
html body .tone-cell:hover{background:var(--tint)}
html body .tone-shape{width:26px;height:16px;fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
html body .tone-cell-glyph{font:400 30px/1.1 'Zimai Serif TC',var(--serif)}
html body .tone-cell b{font-size:14px;font-weight:600;color:var(--accent)}
html body .tone-cell small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.3;color:var(--muted)}
html body .tone-pairs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:10px}
html body .tone-pair{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;gap:8px;padding:6px;border:1px solid var(--rule);border-radius:12px;background:var(--white)}
html body .tone-pair-vs{align-self:center;font-size:16px;color:var(--muted)}
html body .tone-word{display:grid;align-content:start;gap:2px;min-width:0;padding:8px 10px;border-radius:9px;color:var(--ink);text-decoration:none;transition:background-color .16s ease}
html body .tone-word:hover{background:var(--tint)}
html body .tone-word > span{font:400 24px/1.15 'Zimai Serif TC',var(--serif)}
html body .tone-word b{font-size:14px;font-weight:600;color:var(--accent)}
html body .tone-word small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;color:var(--muted)}
html body .tone-rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--card-gap,16px)}
html body .tone-rule{padding:14px 16px;border:1px solid var(--rule);border-radius:12px;background:var(--white)}
html body .tone-rule h4{margin:0 0 4px;font:600 17px/1.3 var(--serif)}
html body .tone-rule p{margin:0 0 8px;font-size:14px;line-height:1.5;color:var(--muted)}
html body .tone-rule ul{display:grid;gap:2px;margin:0;padding:0;list-style:none}
html body .tone-rule li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;border-top:1px solid color-mix(in srgb,var(--rule) 70%,transparent)}
html body .tone-rule li .tone-word{grid-template-columns:auto auto minmax(0,1fr);align-items:baseline;gap:8px;padding:7px 2px}
html body .tone-rule li .tone-word > span{font-size:19px}
html body .tone-said{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap}
@media (max-width:640px){
 html body .tone-set{grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;padding:6px}
 html body .tone-set-six{grid-template-columns:repeat(3,minmax(0,1fr))}
 html body .tone-set-base{grid-column:1/-1;justify-self:start;padding:2px 6px 0}
 html body .tone-cell-glyph{font-size:26px}
 html body .tone-rule li{grid-template-columns:1fr}
 html body .tone-said{padding:0 0 6px 2px}
}
/* Project name card (search for zimai / 字脈): trilingual, editorial. */
html body .name-card{display:grid;gap:10px;margin:4px 0 14px;padding:16px 18px;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--rule));border-radius:14px;background:linear-gradient(180deg,color-mix(in srgb,var(--tint) 60%,var(--white)),var(--white))}
html body .name-card-head{display:flex;align-items:center;gap:16px;margin-top:6px}
html body .name-card-head .exact-glyph{font:400 46px/1 'Zimai Serif TC',var(--serif);color:var(--ink)}
html body .name-card-readings{display:grid;grid-template-columns:auto auto;align-items:baseline;gap:2px 10px}
html body .name-card-readings b{font-size:16px;font-weight:600;color:var(--accent)}
html body .name-card-readings span{font-size:12px;color:var(--muted)}
html body .name-card-text{margin:0;font-size:15px;line-height:1.6;color:var(--ink)}
html body .name-card-text:lang(zh-Hant){font-size:15.5px;line-height:1.75}
html body .name-card-lang{display:inline-block;margin-right:8px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
html body .name-card-links{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0;font-size:14px}
html body .name-card-links > span{font-size:12px;color:var(--muted)}
html body .name-card-note{margin:0;font-size:12.5px;color:var(--muted)}
/* "Try" examples under the search box: the standard text-link hover. */
@media (hover:hover){html body .home-search-below a:hover{text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:.24em;text-decoration-color:color-mix(in srgb,currentColor 50%,transparent)}}
/* Search bar: clear (×) and pen share one size and one quiet hover; Search answers with an outline ring only. */
html body .search-form>:is(button.search-clear,button.pen-button){display:inline-flex;align-items:center;justify-content:center;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:10px;background:transparent;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}
html body .search-form>button.search-clear{color:var(--muted);font-size:22px;line-height:1}
@media (hover:hover){html body .search-form>:is(button.search-clear,button.pen-button):hover{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--rule)}}
html body .search-form>:is(button.search-clear,button.pen-button):active{background:color-mix(in srgb,var(--surface) 70%,var(--rule))}
html body .search-form>button.pen-button[aria-expanded=true]{background:var(--tint);box-shadow:inset 0 0 0 1px var(--accent)}
html body .search-form>button[type=submit]{transition:box-shadow .18s ease}
@media (hover:hover){html body .search-form>button[type=submit]:hover{filter:none;background:var(--signal);color:#fff;box-shadow:0 0 0 2px color-mix(in srgb,var(--signal) 62%,var(--ink))}[data-theme=dark] .search-form>button[type=submit]:hover{box-shadow:0 0 0 2px var(--accent)}}
html body .search-form>button[type=submit]:focus-visible{outline:none;box-shadow:0 0 0 2px var(--white),0 0 0 4px var(--accent)}
html body .search-form>button[type=submit]:active{box-shadow:0 0 0 2px color-mix(in srgb,var(--signal) 50%,var(--ink))}

/* Segmented controls (Dictionary · Split view · Connections; All · Structure · Words · Sound): one outer
   border, borderless segments, the selected one filled. Hover never paints over the selection, so a click
   shows its result at once (a generic button hover used to cover the new selection until the pointer left).
   Secondary controls share one size: 13 px. */
html body :is(.workspace-layouts,.connection-lenses){display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--rule);border-radius:10px;background:var(--white)}
html body :is(.workspace-layouts,.connection-lenses)>button{display:inline-flex;align-items:center;min-height:30px;height:30px;margin:0;padding:0 11px;border:0;border-radius:7px;background:transparent;box-shadow:none;color:var(--muted);font:500 13px/1 var(--sans);white-space:nowrap;transition:background-color .12s ease,color .12s ease}
@media (hover:hover){html body :is(.workspace-layouts,.connection-lenses)>button:not([aria-pressed=true]):hover{background:var(--surface);color:var(--ink)}}
html body .workspace-layouts>button[aria-pressed=true],html body .workspace-layouts>button[aria-pressed=true]:hover{background:var(--ink);color:var(--paper)}
html body .connection-lenses>button[aria-pressed=true],html body .connection-lenses>button[aria-pressed=true]:hover{background:var(--tint);color:var(--accent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 45%,transparent)}
html body :is(.workspace-layouts,.connection-lenses)>button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
/* Pane tabs (Entry · Wander · Characters · Words · Saved): one hover for every tab, never over the selected one. */
html body .collection-tabs>:is(button,a){font-size:13px;font-weight:500;color:var(--muted);text-decoration:none;transition:background-color .12s ease,color .12s ease}
@media (hover:hover){html body .collection-tabs>:is(button,a):not([aria-pressed=true]):hover{background:var(--surface);color:var(--ink)}}
html body .collection-tabs>button[aria-pressed=true],html body .collection-tabs>button[aria-pressed=true]:hover{background:none;color:var(--accent);font-weight:600}
/* Map tools (Reset map · 3D · ···) at the same 13 px. */
html body .field-tools :is(button,a){font-size:13px}
/* "Try" examples: Chinese and Latin at one size. */
html body .home-search-below a{font-size:14px}
/* Search button: the closing ↗ needs a touch more room on the right to look centred. */
html body .search-form>button[type=submit]{padding-inline:18px 21px}
@media (max-width:640px){html body .search-form>button[type=submit]{padding-inline:12px 15px}}
/* Map hover card: a compact peek, not a panel. Desktop: up to 360 px, gloss in two lines, evidence in one.
   Phones: one slim line (glyph · reading · gloss); the evidence is one tap away in the entry. */
html body .field-hover{right:auto;max-width:min(360px,calc(100% - 34px));gap:11px;padding:9px 13px 9px 11px;border-radius:12px;pointer-events:none}
html body .field-hover>[lang]{font-size:30px;line-height:1}
html body .field-hover>div{min-width:0}
html body .field-hover p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html body .field-hover small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:640px){
 html body .field-hover{left:8px;right:auto;max-width:calc(100% - 16px);gap:9px;padding:6px 11px 6px 9px;border-radius:10px}
 html body .field-hover>[lang]{font-size:23px}
 html body .field-hover>div{display:flex;align-items:baseline;gap:8px;min-width:0}
 html body .field-hover strong{flex:none;font-size:13px}
 html body .field-hover p{-webkit-line-clamp:1;margin:0;font-size:12.5px}
 html body .field-hover small{display:none}
}
/* …and translucent: frosted glass keeps the map visible behind the card while its text stays legible. */
html body .field-hover{background:color-mix(in srgb,var(--white) 66%,transparent);-webkit-backdrop-filter:blur(2.5px);backdrop-filter:blur(2.5px);border-color:color-mix(in srgb,var(--rule) 75%,transparent);box-shadow:0 4px 18px #00000014}
@supports not (backdrop-filter:blur(1px)){html body .field-hover{background:color-mix(in srgb,var(--white) 92%,transparent)}}
@media (prefers-reduced-transparency:reduce){html body .field-hover{background:var(--white);-webkit-backdrop-filter:none;backdrop-filter:none}}
/* Stroke order player (every character page with Make Me a Hanzi medians): the medians as an even pen line,
   stroke by stroke, over a pale trace of the whole character; the board, facts and controls reuse the
   dossier Writing widget. */
html body .stroke-player .writing-board>svg{display:block;width:100%;height:100%}
html body .stroke-player .writing-board path{fill:none;stroke-width:11;stroke-linecap:round;stroke-linejoin:round}
html body .stroke-player .stroke-trace{stroke:var(--rule)}
html body .stroke-player .stroke-pen{stroke:var(--ink)}
html body .stroke-player .stroke-pen.is-active{stroke:var(--accent)}
html body .stroke-player .stroke-pen.is-pending{visibility:hidden}
/* Map overlays on phone-width panes: the status shares the bottom row with the camera controls instead of
   stacking above them, so the clear band keeps ~40 px more of a 300–350 px canvas. Each status line stays on
   one line; the "click an entry" hint and the zoom percentage yield (the canvas label and ± remain). */
@container visual (max-width:420px){
 html body .character-field[data-controls=compact][data-render-mode] .field-stage>.field-meta{right:calc(var(--field-gap) + 145px);bottom:8px;min-height:var(--field-control);justify-content:center}
 html body .character-field[data-controls=compact][data-render-mode='3d'] .field-stage>.field-meta{right:calc(var(--field-gap) + 180px)}
 html body .character-field[data-controls=compact] .field-stage>.field-meta>[data-field-status]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
 html body .character-field[data-controls=compact] .field-status-hint,html body .character-field[data-controls=compact] .field-zoom>output{display:none}
 html body .character-field[data-controls=compact] .field-stage::after{height:60px}
 html body .character-field[data-controls=compact] .field-hover{bottom:calc(var(--field-control) + 18px)}
}
/* Stacked layouts (phones, tablets in portrait), Connections: the map pane is exactly the viewport below the
   sticky search bar (split-layout.mjs measures it as --search-sticky) and choosing Connections scrolls it there.
   It was a fixed 900 px under a 172 px bar, so the caption or the camera controls were always off-screen. */
@media (max-width:850px){
 html body .collection-app[data-layout=visual]{height:auto;grid-template-rows:auto max(360px,calc(100dvh - var(--search-sticky,0px)))}
}
/* Map lenses (All · Structure · Words · Sound) as one classic segmented control: a single outer border,
   rounded only at the outer ends, square inner segments divided by hairlines, the selected one filled.
   Stated with the map toolbar in the selector: its own rules (.character-field[data-controls] … button)
   are more specific and gave every lens a separate border, a −1 px overlap and mismatched corners. */
html body .character-field .connection-lenses,html body .character-field[data-controls] .connection-lenses{display:inline-flex;align-items:stretch;gap:0;padding:0;border:1px solid var(--rule);border-radius:9px;overflow:hidden;background:var(--white);box-shadow:none}
html body .character-field .connection-lenses>button,html body .character-field[data-controls] .connection-lenses>button,html body .character-field[data-controls] :is(.field-toolbar,.field-overlay-top) .connection-lenses>button{min-height:30px;height:30px;margin:0;padding:0 12px;border:0;border-radius:0;background:transparent;box-shadow:none;color:var(--muted);font:500 13px/1 var(--sans);transition:background-color .12s ease,color .12s ease}
html body .character-field .connection-lenses>button+button,html body .character-field[data-controls] .connection-lenses>button+button,html body .character-field[data-controls] :is(.field-toolbar,.field-overlay-top) .connection-lenses>button+button,html body .character-field[data-controls] .connection-lenses>button+button:is(:hover,[aria-pressed=true]){border-left:1px solid var(--rule)}
@media (hover:hover){html body .character-field[data-controls] .connection-lenses>button:not([aria-pressed=true]):hover,html body .character-field .connection-lenses>button:not([aria-pressed=true]):hover{border-top:0;border-right:0;border-bottom:0;background:var(--surface);color:var(--ink)}}
html body .character-field .connection-lenses>button[aria-pressed=true],html body .character-field[data-controls] .connection-lenses>button[aria-pressed=true],html body .character-field[data-controls] .connection-lenses>button[aria-pressed=true]:hover{border-top:0;border-right:0;border-bottom:0;border-radius:0;background:var(--tint);color:var(--accent);font-weight:600;box-shadow:none}
html body .character-field .connection-lenses>button:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--accent)}

/* ---- polish-0.20.2-cantonese.css ---- */
/* 0.20.2 cantonese area. Owned by the cantonese session; appended by scripts/build-polish.mjs. */
/* Cantonese text keeps the TC faces (no new fonts); lang="yue-…" asks for Hong Kong shaping where a font has it. */
[lang='yue-Hant']{font-family:var(--cjk-tc);font-synthesis:none}
[lang='yue-Hans']{font-family:var(--cjk-sc);font-synthesis:none}
.canto-jp,.canto-py{font-family:var(--sans);font-weight:500;white-space:nowrap}
.canto-py{color:var(--muted)}
.canto-label,.canto-cross-source,.canto-cmn-tag{display:inline-block;font:600 11px/1.4 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.gloss-label{font-weight:600;color:var(--muted)}

/* Character page: Cantonese card and Jyutping-first heading */
.character-identity .canto-h1-cmn,.catalog-identity .canto-h1-cmn,.canto-h1-cmn{margin:.15rem 0 .35rem;font:500 15px/1.5 var(--sans);color:var(--muted)}
.canto-h1-cmn .canto-py{color:var(--ink)}
.canto-cmn-tag{margin-left:.6rem;padding:1px 7px;border:1px solid var(--rule);border-radius:999px;vertical-align:middle;text-transform:none;letter-spacing:0}
.canto-char{border-top:3px solid var(--accent)}
.canto-char .detail-card-heading h3 span{font-weight:400;margin-left:.35rem}
.canto-char h4{margin:1.1rem 0 .45rem;font:600 14px/1.4 var(--sans)}
.canto-char-lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:16px;align-items:start}
.canto-char-reading .tone-ribbon{margin:.3rem 0}
.canto-char-own h4{margin-top:0}
.canto-char-own ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.canto-char-own li a{display:flex;gap:10px;align-items:baseline;padding:7px 4px;border-bottom:1px solid var(--rule);font-size:15px;line-height:1.5}
.canto-char-own li a:hover{background:var(--row-hover,var(--tint))}
.canto-char p.canto-char-inwords{margin:.9rem 0 0;font-size:15px}
.canto-char-inwords small{color:var(--muted);font-size:12px}
.canto-word-list .mini-word>span:first-child{font-size:19px}
.canto-word-list .mini-word>span:nth-child(3){font-size:14px}
.canto-char p.canto-char-more{margin:.5rem 0 0;font-size:15px}
.canto-char-more small{display:block;color:var(--muted);font-size:12px}
.canto-char p.canto-char-foot{margin:1rem 0 0;font-size:14px;line-height:1.6;color:var(--muted)}
@media(max-width:640px){.canto-char-lead{grid-template-columns:1fr}}

/* Pinyin ↔ Jyutping (computed) */
.canto-corr{margin-top:1.1rem}
.canto-char .canto-corr p{font-size:15px;line-height:1.6;margin:.35rem 0}
.canto-corr-glyph{font-size:20px;margin-right:.25rem}
.canto-corr-bar{display:flex;height:30px;margin:.45rem 0;border-radius:6px;overflow:hidden;border:1px solid var(--rule);font:600 12px/1 var(--sans)}
.canto-corr-bar span{display:flex;align-items:center;justify-content:center;gap:4px;min-width:0;background:var(--surface);color:var(--ink);border-right:1px solid var(--rule)}
.canto-corr-bar span:last-child{border-right:0}
.canto-corr-bar span.this{background:var(--accent);color:var(--white)}
.canto-corr-bar small{font-weight:400;font-size:11px}
.canto-corr-like{color:var(--muted)}
.canto-corr-checked{margin:.6rem 0}
.canto-corr-checked summary{cursor:pointer;font-size:14px}
.canto-corr-checked table{border-collapse:collapse;margin:.5rem 0;font:13px/1.4 var(--sans);font-variant-numeric:tabular-nums;width:100%;max-width:520px}
.canto-corr-checked caption{text-align:left;color:var(--muted);font-size:12px;padding-bottom:4px}
.canto-corr-checked th,.canto-corr-checked td{padding:4px 8px;border-bottom:1px solid var(--rule);text-align:right}
.canto-corr-checked th[scope=row]{text-align:left;white-space:nowrap}
.canto-corr-checked tr.this{background:var(--tint)}

/* Bridge, changed tones, Mandarin comparison, six-tone sets (entries and character pages) */
.canto-bridge-pairs h3,.canto-changed h3,.canto-tonesets h3{margin:1rem 0 .45rem;font:600 14px/1.4 var(--sans)}
.canto-bridge-pairs ul,.canto-changed ul,.canto-cross ul{list-style:none;margin:0;padding:0}
.canto-bridge-pairs ul{max-width:760px}
.canto-bridge-pairs li{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:4px 12px;align-items:center;padding:8px 0;border-bottom:1px solid var(--rule)}
.canto-bridge-pairs li details{grid-column:1/-1;font-size:13px;color:var(--muted)}
.canto-bridge-pairs li details summary{cursor:pointer}
.canto-bridge-side{display:flex;flex-wrap:wrap;gap:2px 8px;align-items:baseline;padding:4px 8px;border-radius:6px}
.canto-bridge-side:hover{background:var(--row-hover,var(--tint))}
.canto-bridge-side small{flex-basis:100%;font:600 11px/1.3 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.canto-bridge-form{font-size:22px;line-height:1.2}
.canto-bridge-arrow{color:var(--accent);font-size:18px}
.canto-changed li{display:flex;gap:10px;align-items:baseline;padding:6px 0;border-bottom:1px solid var(--rule);font-size:15px;line-height:1.55}
.canto-changed-glyph{font-size:22px;line-height:1}
.canto-cross li{padding:8px 0;border-bottom:1px solid var(--rule)}
.canto-cross li>a{font-size:18px;margin-right:.5rem}
.canto-cross-gloss{display:block;font-size:15px;line-height:1.6;margin-top:2px}
.canto-entry .canto-compare[open]>summary{margin-bottom:.4rem}
.canto-tonesets{margin-top:.6rem}
.canto-toneset{display:grid;grid-template-columns:52px repeat(6,minmax(0,1fr));gap:6px;align-items:stretch;margin:0 0 6px}
.canto-toneset-base{align-self:center;font:600 14px/1 var(--sans);color:var(--muted)}
.canto-tonecell{display:grid;justify-items:center;align-content:start;gap:1px;min-width:0;padding:6px 4px;border:1px solid var(--rule);border-radius:6px;text-align:center}
a.canto-tonecell:hover{background:var(--row-hover,var(--tint))}
.canto-tonecell.empty{border-style:dashed;color:var(--muted)}
.canto-tonecell-glyph{font-size:22px;line-height:1.2}
.canto-tonecell b{font:600 12px/1.3 var(--sans)}
.canto-tonecell small{font-size:11px;line-height:1.3;color:var(--muted);overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:560px){.canto-toneset{grid-template-columns:repeat(6,minmax(0,1fr))}.canto-toneset-base{grid-column:1/-1}.canto-tonecell small{display:none}}

/* Device voice (opt-in, hidden unless a matching voice exists) */
.device-voice{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;margin:.8rem 0}
.device-voice[hidden]{display:none}
.device-voice-button{min-height:40px;padding:6px 14px;border:1px solid var(--rule);border-radius:999px;background:var(--white);color:var(--ink);font:500 14px/1.2 var(--sans);cursor:pointer}
.device-voice-button:hover{background:var(--row-hover,var(--tint))}
.device-voice-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.device-voice small{font-size:12px;color:var(--muted);max-width:46ch}

/* Missing-word fallback in Cantonese search (CC-CEDICT entry, clearly marked) */
.canto-missing .best-match-why{color:var(--clay)}
.canto-missing-readings{margin:.4rem 0 0;font-size:14px;color:var(--muted)}

/* Cantonese characters page */
.canto-collection{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin:0;padding:0;list-style:none}
.canto-collection li{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;padding:12px;border:1px solid var(--rule);border-radius:8px;background:var(--white)}
.canto-collection-glyph{grid-row:1/4;font-size:40px;line-height:1.1}
.canto-collection li .canto-jp{font-size:16px}
.canto-collection-gloss{font-size:14px;line-height:1.5}
.canto-collection-links{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:4px 12px;font-size:13px;margin-top:4px}
.canto-collection-bridge{font-size:14px}
.canto-page-table{border-collapse:collapse;width:100%;font-size:14px}
.canto-page-table th,.canto-page-table td{padding:6px 8px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}

/* Wide tables scroll inside their card on phones; small links get touch-sized hit areas */
.canto-table-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.canto-table-scroll table{min-width:420px}
.canto-collection-links a,.canto-collection-bridge a,.canto-entry .entry-provenance a{display:inline-block;padding:4px 0;min-height:28px}
.canto-corr-checked .canto-table-scroll table{min-width:0}
.canto-corr-checked th,.canto-corr-checked td{padding:4px 5px}
@media(max-width:600px){.canto-word-list .mini-word{grid-template-columns:minmax(0,auto) minmax(0,1fr) 10px;gap:2px 10px}.canto-word-list .mini-word>span:nth-child(3){grid-column:1/3;grid-row:2;font-size:14px}.canto-word-list .mini-word>span:last-child{grid-column:3;grid-row:1/3}}

/* ---- polish-0.20.2-data.css ---- */
/* 0.20.2 data area. Owned by the data session; appended by scripts/build-polish.mjs. */
/* Source editions (/catalog-sources/), generated by scripts/build-catalog-sources.mjs. Every rule is scoped to .source-editions. */
.source-editions{--se-gap:clamp(16px,2.4vw,28px)}
.source-editions .page-opening h1{max-width:22ch}
.source-editions .page-opening p{max-width:72ch}
.source-editions .se-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;margin:28px 0 8px;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.source-editions .se-stats>div{padding:14px 16px 16px 0;margin:0}
.source-editions .se-stats>div+div{padding-left:16px;border-left:1px solid var(--rule)}
.source-editions .se-stats dt{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
.source-editions .se-stats dd{margin:4px 0 0;font-size:clamp(22px,2.4vw,30px);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:var(--ink)}
.source-editions .se-toc{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 4px}
.source-editions .se-toc a{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid var(--rule);border-radius:999px;background:var(--white);color:var(--ink);font-size:14px;text-decoration:none}
.source-editions .se-toc a:hover{border-color:var(--accent);color:var(--accent)}
.source-editions .se-section,.source-editions .se-group{margin-top:clamp(40px,5vw,64px);scroll-margin-top:12px}
.source-editions .se-section>h2,.source-editions .se-group>h2{font-size:clamp(22px,2.4vw,28px);line-height:1.15;letter-spacing:-.01em;margin:0 0 12px;padding-top:14px;border-top:2px solid var(--accent)}
.source-editions .se-sub{font-size:18px;margin:28px 0 8px}
.source-editions .se-note{color:var(--muted);font-size:15px;line-height:1.55;max-width:80ch;margin:0 0 14px}
.source-editions .se-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 8px}
.source-editions .se-table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.45;font-variant-numeric:tabular-nums}
.source-editions .se-table thead th{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;text-align:left;padding:8px 14px 8px 0;border-bottom:1px solid var(--ink);vertical-align:bottom;white-space:nowrap}
.source-editions .se-table thead th small{display:block;text-transform:none;letter-spacing:0;font-weight:400;font-size:12px}
.source-editions .se-table tbody th,.source-editions .se-table tbody td{padding:10px 14px 10px 0;border-bottom:1px solid var(--rule);vertical-align:top;text-align:left}
.source-editions .se-table tbody th{font-weight:600;color:var(--ink);font-size:15px;letter-spacing:0;text-transform:none}
.source-editions .se-table tbody th a{font-size:inherit}
.source-editions .se-table tbody th small{display:block;font-weight:400;color:var(--muted);font-size:13px;margin-top:1px}
.source-editions .se-table tbody tr:hover{background:var(--row-hover)}
.source-editions .se-table .n{text-align:right;white-space:nowrap}
.source-editions .se-table .c{text-align:center}
.source-editions .se-table td small{color:var(--muted);font-size:13px}
.source-editions .se-table a{color:var(--accent);text-decoration:none}
.source-editions .se-table a:hover{text-decoration:underline;text-underline-offset:3px}
.source-editions .se-table tbody th a{color:var(--ink)}
.source-editions .se-bar{display:block;height:6px;min-width:60px;background:var(--surface);border-radius:3px;overflow:hidden}
.source-editions .se-bar i{display:block;height:100%;background:var(--accent);border-radius:3px}
.source-editions .se-bar-cell{width:38%;vertical-align:middle!important}
.source-editions .se-overlap{max-width:760px}
.source-editions .se-matrix td.n{min-width:96px}
.source-editions .se-cell{display:grid;grid-template-columns:1fr;gap:3px;justify-items:end}
.source-editions .se-cell b{font-weight:600}
.source-editions .se-cell .se-bar{width:100%}
.source-editions .se-cell small{font-size:12px}
.source-editions .se-spot{max-width:860px}
.source-editions .se-spot .han{font-size:18px;font-weight:500;color:var(--ink)}
.source-editions .se-yes{color:var(--accent);font-size:13px}
.source-editions .se-no{color:var(--muted)}
.source-editions .se-fresh td:last-child{color:var(--muted);font-size:14px;min-width:260px}
.source-editions .se-fresh .se-bar-cell{width:16%}
.source-editions .se-speed td:nth-child(2){color:var(--muted);font-size:14px}
.source-editions .se-source{padding:22px 0 26px;border-bottom:1px solid var(--rule);scroll-margin-top:12px}
.source-editions .se-source:last-child{border-bottom:0}
.source-editions .se-source-head h3{font-size:clamp(19px,2vw,22px);margin:0;line-height:1.25}
.source-editions .se-source-head h3 span{font-weight:400;color:var(--muted);font-size:.8em;margin-left:6px}
.source-editions .se-source-meta{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 14px}
.source-editions .se-chip{display:inline-flex;align-items:center;min-height:26px;padding:1px 10px;border:1px solid var(--rule);border-radius:999px;font-size:13px;color:var(--ink);background:var(--white);overflow-wrap:anywhere}
.source-editions .se-chip.se-age{color:var(--muted)}
.source-editions .se-chip.se-lic a{color:var(--accent);text-decoration:none}
.source-editions .se-facts{margin:0;display:grid;gap:0;border-top:1px solid var(--rule)}
.source-editions .se-facts>div{display:grid;grid-template-columns:minmax(150px,200px) 1fr;gap:4px var(--se-gap);padding:10px 0;border-bottom:1px solid var(--rule)}
.source-editions .se-facts dt{font-size:13px;font-weight:600;color:var(--muted);letter-spacing:.02em;padding-top:2px}
.source-editions .se-facts dd{margin:0;font-size:15.5px;line-height:1.55;max-width:88ch;overflow-wrap:anywhere}
.source-editions .se-pair{display:block;margin-top:4px;color:var(--muted);font-size:14px}
.source-editions .se-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin:14px 0 0}
.source-editions .se-links a{color:var(--accent);font-size:15px;text-decoration:none;min-height:32px;display:inline-flex;align-items:center}
.source-editions .se-links a:hover{text-decoration:underline;text-underline-offset:3px}
.source-editions .se-method p{color:var(--muted);font-size:14.5px;max-width:88ch}
.source-editions .se-method code{font-size:13px;overflow-wrap:anywhere}
@media (max-width:760px){
 .source-editions .se-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .source-editions .se-stats>div,.source-editions .se-stats>div+div{padding:12px 10px 12px 0;border-left:0;border-bottom:1px solid var(--rule)}
 .source-editions .se-stats>div:nth-child(even){padding-left:12px;border-left:1px solid var(--rule)}
 .source-editions .se-stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
 .source-editions .se-stack,.source-editions .se-stack tbody,.source-editions .se-stack tr,.source-editions .se-stack th,.source-editions .se-stack td{display:block;width:auto}
 .source-editions .se-stack tr{padding:10px 0;border-bottom:1px solid var(--rule)}
 .source-editions .se-stack tbody th,.source-editions .se-stack tbody td{border:0;padding:3px 0}
 .source-editions .se-stack tbody td{display:grid;grid-template-columns:minmax(96px,38%) 1fr;gap:10px;text-align:left!important;white-space:normal}
 .source-editions .se-stack tbody td::before{content:attr(data-label);color:var(--muted);font-size:13px;font-weight:600}
 .source-editions .se-stack tbody td.se-bar-cell{display:block;width:auto}
 .source-editions .se-stack tbody td.se-bar-cell::before{content:none}
 .source-editions .se-matrix .se-cell{grid-template-columns:auto 1fr auto;align-items:center;justify-items:start;gap:10px}
 .source-editions .se-fresh td:last-child{min-width:0}
 .source-editions .se-facts>div{grid-template-columns:1fr;gap:2px}
}
.source-editions .se-table thead,.source-editions .se-table thead th,.source-editions .se-table tbody th,.source-editions .se-table tbody td{background:transparent}
.source-editions .se-table tr.se-total th,.source-editions .se-table tr.se-total td{border-top:1px solid var(--ink);font-weight:600}
.source-editions .se-table .d{white-space:nowrap}

/* ---- polish-0.20.2-map.css ---- */
/* 0.20.2 map area. Owned by the map session; appended by scripts/build-polish.mjs. */

/* Narrow map panes (phones, a narrow split): the lens takes the first row at full width with four equal
   segments (before, "Sound" ran under Reset map), group and layout share the second row with Reset map, 3D and ⋯. */
@container visual (max-width:560px){
 html body .character-field[data-controls=compact]:not([data-field-view=radicals]) .field-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;grid-template-rows:auto auto;gap:6px}
 html body .character-field[data-controls=compact]:not([data-field-view=radicals]) .connection-controls{display:contents}
 html body .character-field[data-controls=compact]:not([data-field-view=radicals]) .connection-lenses{grid-column:1/-1;grid-row:1;justify-self:stretch;width:auto;display:flex}
 html body .character-field[data-controls=compact]:not([data-field-view=radicals]) .connection-lenses>button{flex:1 1 0;min-width:0;padding-inline:4px;justify-content:center;text-align:center}
 html body .character-field[data-controls=compact]:not([data-field-view=radicals]) .connection-controls-row{grid-column:1/3;grid-row:2;display:flex;gap:6px;min-width:0}
 html body .character-field[data-controls=compact]:not([data-field-view=radicals]) .connection-controls-row>label{flex:1 1 0;min-width:0}
 html body .character-field[data-controls=compact]:not([data-field-view=radicals]) .connection-controls-row select{width:100%;min-width:0;text-overflow:ellipsis}
 html body .character-field[data-controls=compact]:not([data-field-view=radicals]) .field-tools{grid-column:3;grid-row:2;margin:0;align-self:stretch}
}
/* Very narrow panes (320 px phones): Reset map shows its target symbol; the word stays for screen readers, visually
   hidden in its own span (0.20.4: no 0 px text). */
@container visual (max-width:380px){
 html body .character-field[data-controls=compact] .field-tools [data-field-action=refocus]{padding-inline:10px}
 html body .character-field[data-controls=compact] .field-tools [data-field-action=refocus] .field-action-label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
 html body .character-field[data-controls=compact] .field-tools [data-field-action=refocus]::before{content:'⌖';font-size:18px;line-height:1}
}

/* Phones, split view with an entry open: the entry reads in the page instead of a 300 px box inside it, and the
   map follows at the height of the screen below the sticky search bar. Browsing lists keep their own scroller.
   Tablets keep the stacked split (entry and map both on screen). */
@media (max-width:600px){
 html body .collection-app[data-layout=split][data-browse=field]{height:auto;grid-template-rows:auto auto 0 auto}
 html body .collection-app[data-layout=split][data-browse=field] .collection-dictionary{height:auto;max-height:none;overflow:visible}
 html body .collection-app[data-layout=split][data-browse=field] .collection-inspector{max-height:none;overflow:visible}
 html body .collection-app[data-layout=split][data-browse=field] .workspace-divider{visibility:hidden;height:0;min-height:0;overflow:hidden}
 html body .collection-app[data-layout=split][data-browse=field] .collection-visual{height:max(420px,calc(100svh - var(--search-sticky,0px) - 12px));margin-top:12px}
}

/* /connections/: the live map (scripts/fix-0.20.2-map-connections-page.mjs). */
html body .connections-live{margin:22px 0 26px}
html body .connections-live-head h2{margin:0 0 6px}
html body .connections-live-head p{max-width:72ch}
html body .connections-live-pick{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0}
html body .connections-live-pick button{display:inline-flex;align-items:baseline;gap:6px;min-height:40px;padding:0 12px;border:1px solid var(--rule);border-radius:8px;background:var(--white);color:var(--ink);cursor:pointer}
html body .connections-live-pick button span{font-size:20px}
html body .connections-live-pick button small{font-size:12px;color:var(--muted)}
html body .connections-live-pick button[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}
html body .connections-live-pick a{margin-left:auto;font-size:14px}
html body .connections-live-pane{container:visual/inline-size;display:flex;flex-direction:column;height:min(78svh,760px);min-height:460px;border:1px solid var(--rule);border-radius:12px;overflow:hidden;background:var(--white)}
html body .connections-live-pane>.character-field{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}
html body .connections-live-pane .field-stage{flex:1 1 auto;position:relative;min-height:0}
html body .connections-live-pane .field-stage>canvas[data-field-canvas]{display:block;width:100%;height:100%}
html body .connections-live:not([data-ready]) .connections-live-pane{display:none}
/* 0.20.4: with scripts running (the head script sets html[data-theme]) the pane keeps its place while the map loads, so
   the explanation below no longer drops 500–760 px when the map appears (CLS 0.11 at 1440 px, 0.14–0.16 at 768 px).
   Without scripts, or when the map cannot load ([data-failed]), the pane stays hidden as before. */
html[data-theme] body .connections-live:not([data-ready]):not([data-failed]) .connections-live-pane{display:flex;align-items:center;justify-content:center}
html[data-theme] body .connections-live:not([data-ready]):not([data-failed]) .connections-live-pane::before{content:'Opening the map…';color:var(--muted);font-size:14px}

/* ---- polish-0.20.2-pages.css ---- */
/* 0.20.2 pages area. Owned by the pages session; appended by scripts/build-polish.mjs. */

/* ---- Workspace heading is the page h1 (home, /search/, /characters/, /dictionary/) ----
   Same look as the former h2 at every width; the old .workspace-heading h1 rules (15/12/11 px) no longer apply. */
html body .collection-heading.workspace-heading h1{font:500 22px/1.3 var(--sans);letter-spacing:-.04em;margin:3px 0 0;white-space:normal;color:var(--ink)}
@media (max-width:1100px){html body .collection-heading.workspace-heading h1{font-size:20px}}

/* ---- First paint matches what the modules settle on (no layout shift) ----
   The fallback's paragraph margin collapsed through #collection-field and moved the map pane 9 px when the
   map replaced it. */
html body #field-fallback>p{margin-top:0}
/* The fallback overlays the map area instead of sitting in its flow, so un-hiding the map cannot push it. */
html body #collection-field{position:relative}
html body #collection-field>#field-fallback{position:absolute;inset:0 0 auto 0}
/* split-layout.mjs sizes the dictionary column as 44 % of the track minus the 16 px handle. */
@media (min-width:851px){html body .collection-app{--dict-share:calc((100% - 16px) * .44)}}
/* Stacked layouts: split-layout.mjs applies 44 / 56 (the 60 / 40 default below 641 px was always replaced). */
@media (max-width:850px){html body .collection-app{--dict-fr:44fr;--visual-fr:56fr}}
/* Stacked layouts with a query (?q=): the results list arrives after the modules and pushes the map pane far
   down; until it does, the empty results area holds one screen so the map pane is not painted in view first. */
@media (max-width:850px){html body .collection-app.searching #collection-search-results[hidden]{display:block!important;min-height:calc(100svh - var(--search-sticky,0px))}}

/* ---- Tap targets on phones (24 px minimum) ----
   Inline links: vertical padding enlarges the target without moving the text. */
@media (pointer:coarse),(max-width:640px){
 html body main :is(p,li,dd,h2,h3,h4,small,blockquote,figcaption,td)>a:not([class]),
 html body main :is(.collection-footnote,.search-scope-note,.sentence-source-line,.sentence-method,.card-caption,.sentence-source) a,
 html body main :is(.canto-document>section,.canto-document>details,.classical-card,.classical-study-entry,.classical-study>header)>a:not([class]){padding-block:5px}
 html body main :is(.card-caption,.sentence-source) a.cite{display:inline-block;min-width:24px;text-align:center}
 html body .classical-guide .guide-cues a:not([class]){display:inline-flex;align-items:center;min-height:24px}
 /* Single-glyph links (component lists, scholarship series) get a square target. */
 html body main :is(dd,p,td)>a:not([class]):has(>.han:only-child),
 html body main .detail-facts dd>a:not([class]){display:inline-block;min-width:24px;text-align:center}
 html body .footer-brand>a.wordmark{display:inline-flex;align-items:center;min-height:24px}
 html body .classical-opening a.section-tag,
 html body :is(.classical-breadcrumbs,.classical-reader-tools,.classical-pagination)>a,
 html body #entry-content>.collection-pager>a{display:inline-flex;align-items:center;min-height:24px}
 html body .sentence-lookup-entry a{min-width:24px;text-align:center}
 html body :is(main,.study-workspace) input:is([type=checkbox],[type=radio]){width:24px;height:24px}
}

/* ---- Tables on phones: one record per block, each value under its column name ----
   (data-label cells come from scripts/fix-0.20.2-pages.mjs) */
@media (max-width:640px){
 html body table.stack-table,html body table.stack-table>tbody,html body table.stack-table tr,html body table.stack-table td{display:block;width:auto;max-width:100%}
 html body table.stack-table{border:0;table-layout:auto;overflow-wrap:anywhere}
 /* Each cell names its column (::before), so the header row is not drawn. */
 html body table.stack-table>thead{display:none}
 html body table.stack-table tr{padding:10px 0 12px;border-top:1px solid var(--rule)}
 html body table.stack-table tr:first-child{border-top:0}
 html body table.stack-table td{padding:3px 0;border:0;text-align:left;font-size:15px;line-height:1.5}
 html body table.stack-table td::before{content:attr(data-label);display:block;margin-bottom:1px;font:600 12px/1.4 var(--sans);color:var(--muted)}
 /* Short values (Scholarship readings): label and value side by side. */
 html body table.stack-table:not(.license-table) td{display:grid;grid-template-columns:minmax(7.5rem,40%) minmax(0,1fr);gap:12px;align-items:baseline}
 html body table.stack-table:not(.license-table) td::before{margin:0}
}

/* ---- Legibility (11 px floor) ---- */
/* A sentences rule forced 10 px with !important; the intended size is 12 px. */
html body .sentence-result-language{font-size:12px!important}

/* ---- Dark theme: the accent turns light coral, so white button text fell to 1.8:1 ---- */
html[data-theme=dark] body :is(.study-search button,[data-study-export],[data-study-save]){background:var(--signal)!important;border-color:var(--signal)!important;color:var(--signal-ink)!important}

/* ---- IDS source notation: IDS face first, then the Han faces for the character's own script ---- */
html body .ids-notation code{font-family:'Zimai IDS','Noto Sans TC','Noto Sans SC','Zimai Rare Han',ui-monospace,monospace;font-synthesis:none}
html body .ids-notation code[lang=zh-Hans]{font-family:'Zimai IDS','Noto Sans SC','Noto Sans TC','Zimai Rare Han',ui-monospace,monospace}

/* ---- Chinese names in the variety guides wrap as a whole (臺灣台語, 閩東語・福州話) ---- */
html body .reading-guide summary [lang^=zh],html body .variety-guide [lang^=zh]{white-space:nowrap}

/* ---- Example sentences: the attribution is a quiet caption, not a second translation ---- */
html body .detail-example p.sentence-source{margin:6px 0 0;font-size:13px;line-height:1.45;color:var(--muted)}
html body .detail-example p.sentence-source a{color:inherit;text-decoration-color:color-mix(in srgb,currentColor 45%,transparent)}

/* ---- The "/" hint sits inside the search box ---- */
html body .search-form>.search-key{flex:none;align-self:center;margin:0 4px 0 6px}

/* /characters/: before character-scroll.mjs fills it (it then sets role=region), the scroller box shows the
   static first page of characters as a grid. */
html body .collection-character-grid.character-scroll:not([role]){display:grid;align-content:start;overflow:hidden}
html body #collection-characters .collection-pager.character-scroll-footer{box-sizing:border-box;min-height:56px}

/* HanDeDict/English best-match breakdown: glyph-parts fills one 72 px row per character (8 px apart) after load;
   reserve that height from the server-rendered character links so the cards below do not jump. */
html body .best-parts[data-detail]:not(.char-rows):has(>.pack-head-links>a:nth-child(1):last-child){min-height:72px}
html body .best-parts[data-detail]:not(.char-rows):has(>.pack-head-links>a:nth-child(2):last-child){min-height:152px}
html body .best-parts[data-detail]:not(.char-rows):has(>.pack-head-links>a:nth-child(3):last-child){min-height:232px}
html body .best-parts[data-detail]:not(.char-rows):has(>.pack-head-links>a:nth-child(4):last-child){min-height:312px}
html body .best-parts[data-detail]:not(.char-rows):has(>.pack-head-links>a:nth-child(5):last-child){min-height:392px}
html body .best-parts[data-detail]:not(.char-rows):has(>.pack-head-links>a:nth-child(6):last-child){min-height:472px}
html body .best-parts[data-detail]:not(.char-rows):has(>.pack-head-links>a:nth-child(7):last-child){min-height:552px}
html body .best-parts[data-detail]:not(.char-rows):has(>.pack-head-links>a:nth-child(8):last-child){min-height:632px}

/* ---- About illustrations: their text is drawn in viewBox units (320 wide), so its size on screen depends on
   how wide the art is drawn. The smallest labels move from 8–9.5 to 10 units, and the art is never drawn
   narrower than about 352 px from a 390 px phone up (it was 265–340 px on phones, tablets and 1061–1300 px
   desktops), so every label renders at 11 px or more there. ---- */
html body .usp-art :is(.small,.lic,.c1-note,.c1-gloss,.c1-wr,.c1-r,.c1-on,.cand-g,.cand-r,.rank,.badge),html body .usp-art .seal text{font-size:10px}
html body .usp-art .small{letter-spacing:.04em}
@media (max-width:560px){html body .usp-card figure{padding-inline:4px}}
@media (min-width:561px) and (max-width:860px){
 html body .usp-grid{grid-template-columns:minmax(0,1fr)}
 html body .usp-card{display:flex;flex-direction:column}
 html body .usp-card figure{display:block;border-right:0;border-bottom:1px solid var(--rule)}
 html body .usp-card .usp-art{max-width:480px;margin-inline:auto}
}
@media (min-width:861px) and (max-width:1299px){
 html body .usp-grid{grid-template-columns:minmax(0,1fr)}
 html body .usp-card{display:grid;grid-template-columns:minmax(380px,46%) minmax(0,1fr)}
 html body .usp-card figure{display:grid;align-items:center;border-bottom:0;border-right:1px solid var(--rule)}
}

/* ---- polish-0.20.2-search.css ---- */
/* 0.20.2 search area. Owned by the search session; appended by scripts/build-polish.mjs. */

/* Readable cross-references in definitions (site/assets/gloss-format-0.20.2/format.mjs): the referenced word in
   the reader's script, its tone-marked reading a little quieter, and "Classifier:" as a quiet label. */
.gloss-ref{white-space:nowrap}
.gloss-reading{color:var(--muted);font-style:normal;white-space:nowrap}
.gloss-label{color:var(--muted);font-size:.92em;letter-spacing:.01em}
a.gloss-link{color:inherit;text-decoration:none;border-radius:3px}
a.gloss-link .gloss-ref{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;text-decoration-color:color-mix(in srgb,currentColor 45%,transparent)}
a.gloss-link:hover .gloss-ref{text-decoration-color:currentColor}
a.gloss-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* In a highlighted best-match card the reading keeps the card's contrast. */
.best-match .gloss-reading,.dictionary-row .gloss-reading{color:inherit;opacity:.72}

/* S7: after a search the pane stacked two tab bars (Entry · Wander · Characters · Words · Saved above All · Words ·
   Characters · Connections · Classical) and shrank the first to 11 px. While results are listed, the result tabs
   are the only bar; the view tabs return, at their normal size, once an entry is open or the search is cleared. */
html body .collection-app.searching:not(.show-selection) .collection-tabs{display:none!important}
html body .collection-app.searching .collection-tabs>:is(button,a){font-size:13px}

/* Cantonese rows that join reading variants ("mou5 / mo5") keep the readings on one line where they fit. */
.dictionary-row[data-language="yue"] .dictionary-reading{overflow-wrap:anywhere}

/* ---- polish-0.20.2-wrapup.css ---- */
/* 0.20.2 release wrap-up (coordinator). Named to sort after the area files, so these rules come last. */
/* Search examples under the search box ("Try 生命 zhong1wen2 water parts:氵+青"): one face, one size, one baseline.
   生命 used to render at 17 px in the serif face (typography ui.css), so its underline sat lower than the others. */
html body .home-search-below a,html body .home-search-below a[lang|='zh']{font-family:"IBM Plex Sans","Zimai Tone Fallback","Noto Sans TC","Noto Sans SC",sans-serif;font-size:14px;font-weight:400;line-height:20px;padding-block:2px;vertical-align:baseline}
html body .home-search-below div:has(> a[data-home-query]){align-items:baseline}

/* Footer in three parts (owner request): brand · Browse · Sources. About and Credits & rights sit in the legal line,
   left of "Source data keeps its own licences" (markup: scripts/fix-0.20.2-wrapup-footer.mjs). The legal line shows the
   version only; the release fingerprint is the version's tooltip (scripts/release-fingerprint.mjs). */
html body .footer-main{grid-template-columns:minmax(200px,1fr) minmax(0,2fr)}
html body .footer-links{grid-template-columns:repeat(2,minmax(0,1fr))}
html body .footer-brand .wordmark{filter:none;text-shadow:none}
html body .footer-legal-links{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 20px}
html body .footer-legal .release-fingerprint{font:inherit;letter-spacing:inherit;color:inherit;background:none;border:0;padding:0;cursor:help}
@media (max-width:900px){html body .footer-main{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){html body .footer-legal-links{gap:0 20px}}
@media (max-width:300px){html body .footer-links{grid-template-columns:minmax(0,1fr)}}

/* 0.20.3: small text links answer hover like every other inline text link: accent colour and a quiet underline.
   These contexts had no hover rule at all (found by hovering every kind of link set at 13 px or smaller). */
@media (hover:hover){
 html body :is(.unified-group .panel-heading,.language-source-links,.cross-reading-source,.sentence-card details,.classical-section-head,.classical-learning-strip,.classical-breadcrumbs,.classical-reader-tools,.classical-outline,.classical-pagination,.classical-reading-column dl,.tone-card-links,.sentence-method,.sentence-credit,.se-source-meta) a:hover,
 html body a.section-tag:hover{color:var(--accent);text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:color-mix(in srgb,currentColor 55%,transparent)}
 html body a.classical-source-tab:hover{color:var(--accent)}
}
/* 0.20.3: the footer tagline breaks after its comma on wide screens ("Every character, / connected and sourced."). */
@media (min-width:901px){html body .footer-brand p .footer-tagline-line{display:block}}
/* 0.20.6: the first About illustration's focus character 月 is drawn at its own size (26 units, from its font-size
   attribute). The small-label rule above (html body .usp-art :is(… .c1-on …){font-size:10px}) also matched it, since it
   shares .c1-on with "yuè". */
html body .usp-art text.han.c1-on{font-size:26px}
/* 0.20.8 (owner requests) ---------------------------------------------------------------------------------------- */
/* Entries: the first card after the two-column record grid (Mandarin tones on lexicon pages) had no gap above it; the
   card-to-card spacing only applies between two cards. */
html body article.word-detail > .catalog-record-grid + .detail-card{margin-top:var(--card-gap)}
/* Entries: the source footnote under the last card lines up with the text inside the cards (1 px border + 16 px). */
html body article.word-detail > .entry-provenance{padding-inline:17px}
/* Word pages, Characters & components: room below the last character's buttons before the character cards. */
html body #word-characters .word-character-record + .char-rows{margin-top:14px}
/* Card-style links (tiles, character cards, word rows) answer hover with their own tint or border. The generic underline
   for links inside cards (layout-0.14.1.css: :is(.detail-card-body, …) a[href]:hover) also reached them and underlined
   every line of text inside the card. */
html body :is(.detail-card-body,.classical-card) :is(a.char-row,a.mini-word,a.card-action,a.lexical-row,a.context-character,.card-link-grid > a,.detail-decomposition a,.catalog-part-links a)[href]:hover{text-decoration-line:none}
/* Character pages: reference lists use the width of wider screens: "Readings across dictionaries" and "Reference desk"
   in up to three columns, "Sources & research" in two; phones keep one column. Rows stretch, so separators line up. */
html body .depth-card dl.depth-facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr));column-gap:2rem}
html body .detail-sources{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,26rem),1fr));column-gap:2rem}
/* "Readings in Japanese, Korean & Vietnamese" is hidden by owner decision (2026-10-16) until the feature is revived
   explicitly. Its markup and data stay unchanged in the character pages; scripts/revise-cross-language-readings.mjs and
   the lookup step of scripts/integrate-character-polish-0.20.mjs are frozen (ZIMAI_REVIVE_CROSS_READINGS=1 to run). */
html body section.cross-readings[data-cross-readings]{display:none!important}

/* ---- polish-0.20.2-zdesign.css ---- */
/* 0.20.4 design pass. Small consistency and behaviour fixes found by sweeping every page template at 320, 390, 768,
   1024 and 1440 px in Chromium and WebKit, light and dark (report: zimai-0.20.2-work/reports/design.md).
   Named to sort last among scripts/polish-0.20.2-*.css, so these rules come after every area file.
   Markup for the same pass: scripts/fix-0.20.4-design.mjs. */

/* ---- The brand stays lowercase inside capitalised labels ("Gives zimai" column head on /catalog-sources/) ---- */
html body .brand-name{text-transform:none}

/* ---- Dark theme: the Knowledge bridge box ("Put the evidence to work.") on /methodology/, /scholarship/, /paths/ kept
   its light fallback background (--surface-subtle is never defined), so its heading fell to 1.03:1 ---- */
html[data-theme=dark] body .knowledge-entry-bridge{background:var(--subtle)}

/* ---- /classical/explore/: the "Teaching topic" select took the width of its longest option and pushed the page
   107 px wider than a 320 px phone (37 px at 390) ---- */
@media (max-width:520px){
 html body .classical-explore-form label{min-width:0;grid-template-columns:minmax(0,1fr)}
 html body .classical-explore-form select{width:100%}
}

/* ---- German entries, "Längere Einträge": the meaning was cut to one line with an ellipsis, down to two letters on
   phones ("C…"); it now wraps under the word when the row is too narrow ---- */
html body .longer-entries a{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:10px;row-gap:0}
html body .longer-entries a>span:last-child{flex:1 1 12em;min-width:0;overflow:visible;text-overflow:clip;white-space:normal}

/* ---- My lists and Classical study: action rows ----
   Below 751 px the "Create list" and "Download backup" buttons stretched to the height of the labelled field next to
   them (64 px beside a 40 px input); the file picker was squeezed to "no fil…ected". */
@media (max-width:750px){html body .study-top{align-items:end}}
html body .study-top>.study-import{max-width:none}
/* Phones: the file picker takes its own row, so its "No file chosen" note is not cut; the backup button fills the row above. */
@media (max-width:520px){html body .study-top>.study-import{flex:1 1 100%}html body .study-top>.study-import>input[type=file]{width:100%;min-width:0}html body .study-top>[data-study-backup]{flex:1 1 auto}}
html body :is(.study-workspace,#classical-study-dashboard) input[type=file]{width:auto;min-height:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;font-size:14px;color:var(--muted)}
html body :is(.study-workspace,#classical-study-dashboard) input[type=file]::file-selector-button{min-height:40px;margin:0 10px 0 0;padding:6px 12px;border:1px solid var(--rule);border-radius:6px;background:var(--white);color:var(--ink);font:500 14px/1.4 var(--sans);cursor:pointer}
@media (hover:hover){html body :is(.study-workspace,#classical-study-dashboard) input[type=file]:not(:disabled)::file-selector-button:hover{border-color:var(--accent);color:var(--accent)}}
/* /classical/study/: the export button and the file picker share one baseline and height (44 px, the Classical button size). */
html body #classical-study-dashboard .study-actions{align-items:end}
html body #classical-study-dashboard input[type=file]::file-selector-button{min-height:44px}
/* /classical/study/: "Find a passage ↗" sat flush against the next heading. */
html body #classical-study-dashboard>section{margin-top:28px}
html body #classical-study-dashboard>section>h2{margin:0 0 8px}
html body #classical-study-dashboard :is(#classical-review-queue,#classical-study-recent)>p{margin:0 0 6px}
html body #classical-study-dashboard :is(#classical-review-queue,#classical-study-recent)>a{display:inline-flex;align-items:center;min-height:24px}

/* ---- /sentences/ on phones: the four filters were ragged (each select as wide as its current value); two even
   columns from 360 px, one below ---- */
@media (max-width:640px){
 html body .sentence-filters{display:grid;grid-template-columns:minmax(0,1fr);gap:10px 12px}
 html body .sentence-filters>label{min-width:0}
 html body .sentence-filters select{width:100%;max-width:none}
}
@media (min-width:360px) and (max-width:640px){html body .sentence-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---- HanDeDict entries: the character breakdown moved 8 px up when glyph-parts replaced the server links with its
   rows (server state 8 px top margin, filled state none); both states now share the filled state's margins ---- */
html body .best-parts[data-detail]:not(.char-rows){margin:0 0 10px}

/* ---- Entry actions use one button size: "Zur Liste ↗" (German entries) was 14 px while the same button reads 12 px
   on English and Cantonese entries; "Keep entry" / "Copy character" (11 px, 7 px corners) beside them now match ---- */
html body .word-identity .pack-head-links .word-permalink{font-size:12px}
html body .entry-tools button{font-size:12px;border-radius:6px}

/* ---- Workspace pages (home, /search/, /dictionary/, /characters/): keyboard focus moving into the map toolbar or the
   pane divider scrolled them under the sticky search bar (Chromium; bar 170–238 px tall, html scroll padding 64 px).
   A focused control outside the dictionary pane keeps the bar's height clear above it. ---- */
html body:has(#collection-app) main :focus:not(.collection-inspector *){scroll-margin-top:184px}
@media (max-width:969px){html body:has(#collection-app) main :focus:not(.collection-inspector *){scroll-margin-top:210px}}
@media (max-width:728px){html body:has(#collection-app) main :focus:not(.collection-inspector *){scroll-margin-top:250px}}
@media (max-width:640px){html body:has(#collection-app) main :focus:not(.collection-inspector *){scroll-margin-top:216px}}
@media (max-width:600px){html body:has(#collection-app) main :focus:not(.collection-inspector *){scroll-margin-top:184px}}
@media (max-width:307px){html body:has(#collection-app) main :focus:not(.collection-inspector *){scroll-margin-top:220px}}

/* ---- Tap targets on touch screens and phones (24 px minimum, WCAG 2.5.8) ----
   Link kinds still under 24 px after the 0.20.2 pass. Inline links get vertical padding (the hit area grows, no text
   moves); block links get padding with an equal negative margin, so the layout stays exactly as it was. */
@media (pointer:coarse),(max-width:640px){
 html body main :is(.classical-learning-strip>div,.classical-connection-card)>a{padding-block:4px}
 html body main .classical-chapter-passages article>div>a{padding-block:5px}
 html body main .sentence-card>a.sentence-source{padding-block:5px}
 html body main :is(p,li,dd,td,div)>strong>a{padding-block:2px}
 html body main .source-editions .se-table :is(th,.v)>a{padding-block:3px}
 html body main .source-editions .se-table th>a.han{padding-right:6px;margin-right:-6px}
 html body main :is(.classical-toolbar,.se-chip,.connections-live-pick)>a{padding-block:2px;margin-block:-2px}
 html body main .detail-sources>div>a{padding-block:3px;margin-block:-3px}
 html body main :is(.classical-section-head>a,a.classical-example-source){padding-block:3px;margin-block:-3px}
 html body main a.classical-example-source{margin-bottom:15px}
 html body main a.part-inspect{min-width:24px}
 html body main .sentence-construction>a{padding-block:4px;margin-top:6px;margin-bottom:-4px}
}

/* /classical/study/ carries two right-hand links (Lists & Anki, Sources & editions): only the first is pushed right. */
html body .classical-tabs .classical-source-tab+.classical-source-tab{margin-left:0}

/* Tablets: the footer's legal-line links (About, Credits & rights) were 19 px tall; phones already pad them. */
@media (pointer:coarse) and (min-width:641px){html body .footer-legal-links>a{padding-block:3px;margin-block:-3px}}

/* ---- One header on every page: the "8,243 characters · 125,400 words" label sat in the header of only 302 pages
   (home, /search/, /dictionary/, /characters/, reference and index pages) and of none of the 36,460 entry and section
   pages or the server-rendered entries. It is hidden everywhere, as layout-0.14.1.css intended below 1700 px; the same
   figures stay in the workspace footnote and on /coverage/ (footer link). Delete this rule to bring it back. ---- */
html body .site-header .edition-label{display:none}

/* ---- Page openings use one label colour: the capitalised label above the page title was red (.section-tag) on
   /dictionary/index/, /catalog-sources/, /about/, /dictionaries/, /connections/, /cantonese/characters/, /lists/, /tones/
   and Classical, but grey (.eyebrow) on /credits/, /sources/, /methodology/, /scholarship/, /languages/, the character
   indexes and the 404 page. In-content eyebrows ("PRONUNCIATION", atlas cards) stay grey. ---- */
html body .page-opening>.eyebrow:first-child{color:var(--accent)}

/* ---- Classical reader: a character and its punctuation never split across lines ("。" or "，" alone at a line start,
   1440 px and phones, both engines). Markup: keepPunctuation() in classical-0.12.0/model.mjs. ---- */
html body .classical-text .classical-nobr{white-space:nowrap}

/* ---- /tones/ word cards: the meaning was cut to one line ("unable to firmly or secu…" at 768 and 1024 px); it may now
   take two lines before the ellipsis ---- */
html body .tone-word small{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;white-space:normal;overflow:hidden}

/* ---- polish-0.20.2-zentry.css ---- */
/* zimai 0.2.2: meanings first. An entry's header (CC-CEDICT, CC-Canto, HanDeDict) holds the word, its reading, its
   meanings and one row of actions (site/assets/entry-actions-0.2.2/actions.mjs); the workspace's duplicate label row and
   its separate "Keep entry · Copy word · Explore connections" row are hidden (their buttons now live in the entry). */
html body .word-identity.entry-focus{display:grid;grid-template-columns:minmax(0,max-content) minmax(0,1fr);column-gap:20px;row-gap:4px;align-items:end;min-height:0;padding:18px 20px 14px}
html body .word-identity.entry-focus>div:first-child{grid-column:1}
html body .word-identity.entry-focus>.reading{grid-column:2;align-self:end;padding-bottom:6px}
html body .word-identity.entry-focus>.reading small{display:block;margin-bottom:2px;color:var(--muted);font-size:12px;font-weight:500;letter-spacing:.01em}
html body .word-identity.entry-focus>:is(.entry-senses,.entry-senses-note,.entry-senses-german,.entry-actions,.pack-head-links){grid-column:1/-1;min-width:0}
html body .word-identity.entry-focus :is(h2,h3).sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;font-size:1px}
html body .word-identity ol.catalog-definitions.entry-senses{display:grid;gap:5px;margin:12px 0 2px;padding:0 0 0 1.55em;list-style:decimal;font:400 1.0625rem/1.5 var(--sans);color:var(--ink)}
html body .word-identity ol.entry-senses>li{margin:0;padding:0 0 0 .2em;font:inherit;color:inherit;border:0;background:none}
html body .word-identity ol.entry-senses>li::before{content:none}
html body .word-identity ol.entry-senses>li::marker{color:var(--muted);font-size:.8em;font-weight:600}
html body .word-identity .entry-senses-note{margin:6px 0 0;color:var(--muted);font-size:.8125rem;line-height:1.45}
html body .word-identity .entry-senses-german{margin-top:10px}
html body .word-identity.entry-focus>.pack-head-links{display:block;margin:0;padding:0}
html body .entry-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;padding-top:12px;border-top:1px solid var(--rule)}
html body .entry-actions .entry-action{display:inline-flex;align-items:center;gap:7px;min-height:40px;margin:0;padding:0 14px;border:1px solid var(--rule);border-radius:999px;background:transparent;color:var(--ink);font:500 .875rem/1 var(--sans);letter-spacing:0;text-decoration:none;white-space:nowrap;cursor:pointer;align-self:auto;box-shadow:none;transition:background-color .15s ease,border-color .15s ease,color .15s ease}
html body .entry-actions .entry-action svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
/* Save is the one filled button: the deep signal red in both themes (dark mode's accent is a light tint, too pale
   behind white text), white text at about 6:1. */
html body .entry-actions .entry-action-save{background:var(--signal,#b92f2a);border-color:var(--signal,#b92f2a);color:var(--signal-ink,#fff7f0)}
html body .entry-actions .entry-action-save[aria-pressed=true]{background:var(--tint);border-color:var(--accent);color:var(--accent)}
html body .entry-actions .entry-action-save[aria-pressed=true] svg{fill:currentColor}
@media (hover:hover){html body .entry-actions .entry-action:hover{background:var(--surface);border-color:var(--accent);color:var(--ink);text-decoration:none}
 html body .entry-actions .entry-action-save:hover{background:color-mix(in srgb,var(--signal,#b92f2a) 82%,#000);border-color:color-mix(in srgb,var(--signal,#b92f2a) 82%,#000);color:var(--signal-ink,#fff7f0)}
 html body .entry-actions .entry-action-save[aria-pressed=true]:hover{background:var(--tint);color:var(--accent)}}
html body .entry-actions .entry-action:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (pointer:coarse){html body .entry-actions .entry-action{min-height:44px}}
html body .entry-actions .entry-action[hidden]{display:none}
html body .entry-actions .entry-action-status{flex-basis:100%;color:var(--muted);font-size:.8125rem;line-height:1.4}
html body .entry-actions .entry-action-status:empty{display:none}
@media (prefers-reduced-motion:reduce){html body .entry-actions .entry-action{transition:none}}
/* Show on map only where the map is not already beside the entry (wide workspace with the map shown). */
@media (min-width:851px){html body #collection-app:not([data-layout=dictionary]) .entry-actions .entry-action-map{display:none}}
/* Character entries in the workspace: the row sits under the identity card. */
html body #collection-entry .character-identity+.entry-actions{margin:12px 0 18px;padding-top:0;border-top:0}
/* The workspace: the entry names itself, so the label row keeps only the way back; the old tool row is gone. */
html body .collection-inspector .entry-tools{display:none}
html body .collection-inspector-bar #collection-selection{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html body .collection-app .collection-inspector-bar{justify-content:flex-start;padding-bottom:6px}
html body .collection-app .collection-inspector-bar [data-close-inspector]{min-height:32px;padding:4px 2px;margin:0;border:0;background:none;color:var(--accent);font-size:13px;font-weight:500}
@media (pointer:coarse){html body .collection-app .collection-inspector-bar [data-close-inspector]{min-height:44px}}
@media (max-width:640px){html body .word-identity.entry-focus{grid-template-columns:minmax(0,1fr);padding:16px 16px 12px}
 html body .word-identity.entry-focus>.reading{grid-column:1;padding-bottom:0}
 html body .entry-actions .entry-action{padding:0 12px}}
/* The slimmer footer (0.2.2): two link groups, Explore and About, side by side at every width; the licence note is
   plain text in the legal line (it was a second link to /credits/). */
html body .footer-links{grid-template-columns:repeat(2,minmax(0,max-content));column-gap:clamp(40px,7vw,96px)}
html body .footer-legal-note{color:var(--muted)}

/* ---- polish-0.20.2-zglosses.css ---- */
/* 0.20.9 character glosses (scripts/build-glyph-glosses.mjs, site/assets/glyph-parts-0.20.0/parts.mjs).
   Cantonese breakdowns read CC-Canto's own character entries: a character without one for its reading shows
   the Jyutping with a quiet "no CC-Canto entry", and the row names its source on a line of its own. */
.best-part-text .best-part-none{max-width:none;font-style:italic;color:color-mix(in srgb,var(--muted) 82%,transparent)}
.best-part-text i,.char-row-text i{font-style:normal;color:var(--accent)}
.best-parts-source{flex-basis:100%;margin-top:1px;font-size:11.5px;line-height:1.3;color:var(--muted)}
.char-rows .best-parts-source{display:block;margin-top:6px}
/* Room for the source line while the shards load, so the card does not grow afterwards. */
.best-parts:is([data-pair=yue],[data-pair=yuechar]):not([data-state=ready]){min-height:63px}

/* ---- polish-0.20.2-zhover.css ---- */
/* zimai 0.2.3: one hover language for the whole site (reports/hover-0.2.3.md, qa/check-hover-0.2.3.mjs).
   Links in running prose (a sentence in a paragraph, a caption, a credit or provenance line) may underline on
   hover. Everything that is itself an entry never underlines; it reacts as a whole, one treatment per kind:
     rows    tint + 2px accent edge on the left     search results, characters in this entry, word lists, map lists
     tiles   tint + accent border                   character grids, reference cards, saved entries, card links
     chips   surface + accent border                query chips, tone seeds, trail, entry actions (0.2.2)
     tabs    surface or a soft accent edge          segmented controls, tab strips, the section nav
     list    darker accent text on a soft tint      links that are entries inside a box, link lines
     chrome  accent text                            footer, breadcrumbs, eyebrows, "N shown ↗", pagination
   No treatment changes size or position. Focus-visible repeats the hover state and adds the ring. Touch screens
   (hover:none) get no hover rule, a short press tint on entries instead, and the card arrow hover used to reveal. */
html body{--hv-tint:var(--tint);--hv-edge:var(--accent);--hv-border:color-mix(in srgb,var(--accent) 62%,var(--rule));--hv-t:.15s ease}

/* 1. No text underline on hover outside prose. Older layers add one in many contexts (wrapup, layout-0.14.1,
      details); this is the one place that decides, hence !important on this single property. Prose = links in
      p, small, figcaption, blockquote and credit/provenance lines, minus the "link lines" listed second: paragraphs
      that hold nothing but action links (generated pages, scanned in reports/hover-0.2.3.md). Credit and
      licence lines ("Original publisher · Full licence text") stay prose, like captions. */
@media (hover:hover){
 html body a[href]:hover:not(:is(p,small,figcaption,blockquote,.markdown,.prose,.entry-provenance,.footer-legal,.sentence-credit,.card-caption,.guide-procedure li) a,a.cite,a.gloss-link,.home-search-below a),
 html body :is(.classical-backlinks p,.character-chapter .detail-card-body>p:not([class]),.word-detail .detail-card-body>p:not([class]),.knowledge-entry-bridge p,.classical-evidence-card>p,.connection-reasoning>p,.classical-work-context .classical-card>p,p.search-scope-note,p.guide-repeated,p.se-links,p.field-fallback-links,p.cross-reading-links,.page-opening>p:has(>a+a)) a[href]:hover,
 html body a.sentence-related-card:hover b{text-decoration-line:none!important}
}

/* 2. Rows: entries stacked in one box. The row keeps its text colour; the box reacts. */
html body :is(a.dictionary-row,a.unified-word-hit,.connection-hits>a,.unified-character-hits>a,a.mini-word,a.collection-word,a.dictionary-index-row,.longer-entries a,article.connection-row>a,.field-accessible>div>a,a.classical-result,.classical-outline a,a.sentence-result,.script-forms a,.canto-char-own li a,.home-word-list>a,.guide-characters>a,.classical-anchor-pair>a,a.component-search-hit,.lexical-characters>div,.reading-senses li){transition:background-color var(--hv-t),box-shadow var(--hv-t),color var(--hv-t)}
@media (hover:hover){
 html body :is(a.dictionary-row,a.unified-word-hit,.connection-hits>a,.unified-character-hits>a,a.mini-word,a.collection-word,a.dictionary-index-row,.longer-entries a,article.connection-row>a,a.classical-result,.classical-outline a,a.sentence-result,.script-forms a,.canto-char-own li a,.home-word-list>a,.guide-characters>a,.classical-anchor-pair>a,a.component-search-hit):not([aria-current=true]):hover{background:var(--hv-tint);box-shadow:inset 2px 0 0 var(--hv-edge);color:var(--ink)}
 html body .field-accessible>div>a:hover{background:var(--hv-tint);box-shadow:inset 2px 0 0 var(--hv-edge);color:var(--accent-dark)}
 /* Characters in this entry: only the glyph is a link, so it is stretched over its row (below). */
 html body .lexical-characters>div:has(dt>a:hover),html body .reading-senses li:has(>a:hover){background:var(--hv-tint);box-shadow:inset 2px 0 0 var(--hv-edge)}
 html body :is(.lexical-characters dt>a,.reading-senses li>a):hover{color:var(--ink)}
}
/* Rows without side padding (the glyph or number sits on the box edge): the tint reaches 10px past each side
   and the edge sits outside it, drawn with box-shadow so nothing moves. Reading senses also cover the number. */
@media (hover:hover){
 html body :is(article.connection-row>a,.longer-entries a,.script-forms a,.classical-outline a):not([aria-current=true]):hover,html body .lexical-characters>div:has(dt>a:hover){box-shadow:-10px 0 0 var(--hv-tint),10px 0 0 var(--hv-tint),-12px 0 0 var(--hv-edge)}
 html body .reading-senses li:has(>a:hover){box-shadow:-26px 0 0 var(--hv-tint),10px 0 0 var(--hv-tint),-28px 0 0 var(--hv-edge)}
}
html body :is(article.connection-row>a,.longer-entries a,.script-forms a,.classical-outline a):focus-visible,html body .lexical-characters>div:has(dt>a:focus-visible){box-shadow:-10px 0 0 var(--hv-tint),10px 0 0 var(--hv-tint),-12px 0 0 var(--hv-edge);outline-offset:2px}
html body .reading-senses li:has(>a:focus-visible){box-shadow:-26px 0 0 var(--hv-tint),10px 0 0 var(--hv-tint),-28px 0 0 var(--hv-edge)}
html body .lexical-characters>div{position:relative}
html body .lexical-characters>div dt>a::after{content:"";position:absolute;inset:0}
html body :is(a.dictionary-row,a.unified-word-hit,.connection-hits>a,.unified-character-hits>a,a.mini-word,a.collection-word,a.dictionary-index-row,.longer-entries a,article.connection-row>a,.field-accessible>div>a,a.classical-result,.classical-outline a,a.sentence-result,.script-forms a,.canto-char-own li a,.home-word-list>a,.guide-characters>a,.classical-anchor-pair>a,a.component-search-hit):focus-visible{background:var(--hv-tint);box-shadow:inset 2px 0 0 var(--hv-edge);outline:2px solid var(--accent);outline-offset:-2px}
html body :is(.lexical-characters>div:has(dt>a:focus-visible),.reading-senses li:has(>a:focus-visible)){background:var(--hv-tint);box-shadow:inset 2px 0 0 var(--hv-edge)}

/* Relation labels in the map lists are fixed colours without dark values (connections-0.10.0): in dark they fell
   to 2.4:1 on the hover tint (3:1 at rest). Mixed halfway to ink they reach 5.9:1 on the tint. */
html[data-theme=dark] body .connection-row[data-kind=structure] .connection-row-body>small{color:color-mix(in srgb,#755d86 50%,var(--ink))}
html[data-theme=dark] body .connection-row[data-kind=sound] .connection-row-body>small{color:color-mix(in srgb,#276c75 50%,var(--ink))}

/* 3. Tiles and cards: bordered boxes, mostly in grids. */
html body :is(a.character-card,a.char-row,a.best-part,a.reference-card,a.saved-entry,a.browse-index-link,.card-link-grid>a,.catalog-part-links a,a.component-tile,.collection-character-grid>a,.character-scroll-cell>a,a.classical-work-card,a.classical-chapter-card,a.classical-grammar-card,a.knowledge-card,.knowledge-foundations>a,.classical-depth-door>a,a.classical-related,a.sentence-related-card,.sentence-characters a,a.wander-choice,.home-component-path a,.relation-field>a,.canto-character-links>a,a.canto-bridge-side,.classical-topic-links>a,.saved-try>a,a.exact-result.best-match,a.usp-card,a.detail-card,a.catalog-card){transition:background-color var(--hv-t),border-color var(--hv-t),box-shadow var(--hv-t),color var(--hv-t)}
@media (hover:hover){
 html body :is(a.character-card,a.char-row,a.best-part,a.reference-card,a.saved-entry,a.browse-index-link,a.component-tile,.collection-character-grid>a,.character-scroll-cell>a,a.classical-work-card,a.classical-chapter-card,a.classical-grammar-card,a.knowledge-card,.knowledge-foundations>a,.classical-depth-door>a,a.classical-related,a.sentence-related-card,.sentence-characters a,a.wander-choice,.home-component-path a,.relation-field>a,.canto-character-links>a,a.canto-bridge-side,.saved-try>a,a.usp-card,a.detail-card,a.catalog-card):hover{background:var(--hv-tint);border-color:var(--hv-border);box-shadow:none;transform:none;color:var(--ink)}
 html body :is(.card-link-grid>a,.catalog-part-links a,.classical-topic-links>a):hover{background:var(--hv-tint);border-color:var(--hv-border);color:var(--accent-dark)}
 html body a.exact-result.best-match:hover{background:var(--hv-tint);box-shadow:inset 0 0 0 1px var(--hv-border);color:var(--ink)}
 html body a.classical-work-card:hover{border-top-color:var(--hv-edge)}
}
html body :is(a.character-card,a.char-row,a.best-part,a.reference-card,a.saved-entry,a.browse-index-link,.card-link-grid>a,.catalog-part-links a,a.component-tile,.collection-character-grid>a,.character-scroll-cell>a,a.classical-work-card,a.classical-chapter-card,a.classical-grammar-card,a.knowledge-card,.knowledge-foundations>a,.classical-depth-door>a,a.classical-related,a.sentence-related-card,.sentence-characters a,a.wander-choice,.home-component-path a,.relation-field>a,.canto-character-links>a,a.canto-bridge-side,.classical-topic-links>a,.saved-try>a,a.exact-result.best-match,a.usp-card,a.detail-card,a.catalog-card):focus-visible{background:var(--hv-tint);border-color:var(--hv-border);outline:2px solid var(--accent);outline-offset:2px}

/* 4. Chips: rounded pills (the entry action row of 0.2.2 already follows this). */
html body :is(.sentence-query-chips a,.sentence-cues a,.tone-seeds a,.source-editions .se-toc a,.collection-history>div>a){transition:background-color var(--hv-t),border-color var(--hv-t),color var(--hv-t)}
@media (hover:hover){
 html body :is(.sentence-query-chips a,.sentence-cues a,.tone-seeds a,.source-editions .se-toc a,.collection-history>div>a):hover{background:var(--surface);border-color:var(--accent);color:var(--ink)}
}
html body :is(.sentence-query-chips a,.sentence-cues a,.tone-seeds a,.source-editions .se-toc a,.collection-history>div>a):focus-visible{background:var(--surface);border-color:var(--accent);outline:2px solid var(--accent);outline-offset:2px}

/* 5. Tabs. Strips whose current tab carries an accent bar show a soft bar on hover; the jump nav and the
      language tabs take a surface background. The current tab never changes. */
html body :is(.search-type-tabs>a,.classical-tabs>a,.character-section-nav a,.language-tabs>a){transition:background-color var(--hv-t),color var(--hv-t),box-shadow var(--hv-t),border-color var(--hv-t)}
@media (hover:hover){
 html body :is(.search-type-tabs>a,.classical-tabs>a):not([aria-current]):not([aria-selected=true]):hover{color:var(--ink);box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--accent) 40%,transparent)}
 html body .character-section-nav a:hover{color:var(--ink);background:var(--surface);box-shadow:0 0 0 6px var(--surface);border-radius:4px}
 html body .language-tabs>a:not(.selected):not([aria-current]):hover{background:var(--surface);border-color:var(--hv-border);color:var(--ink)}
}
html body .character-section-nav a:focus-visible{color:var(--ink);background:var(--surface);box-shadow:0 0 0 6px var(--surface);border-radius:4px;outline:2px solid var(--accent);outline-offset:6px}

/* 6. List links: links that are entries inside a box without a row or tile of their own, and the links of
      link lines. A soft tint drawn by box-shadow (no layout change), darker accent text. */
html body :is(.dictionary-related-links>a,.connection-entry-actions>a,.detail-sources a,.detail-card-body>a:not(.card-action),.depth-facts a,.identity-facts a,.detail-facts a,.confusion-record>a,.ids-leaf>a,.network-actions>a,.field-accessible>a,.canto-cross>a,.canto-document>a,.canto-related>a,.canto-compare a,.canto-collection-bridge>a,.canto-collection-links>a,.canto-page-table a,.reference-links a,.source-list h2>a,.classical-card>a:not(.classical-related),.classical-connection-card>a,.classical-evidence-card>a,.classical-chapter-passages a,.classical-study a,.classical-connection-card h3>a,.structure-card header>a,.classical-reader-tools>a,.classical-section-head>a,.classical-learning-strip>a,.classical-study>a,.classical-study-entry a,.study-actions>a,.classical-toolbar>a,.classical-pagination a,.guide-cues a,.tone-card-links a,.tone-card-heading a,.tone-reference-title a,.sentence-lookup-entry a,.sentence-reader-actions a,a.sentence-more-examples,a.sentence-permalink,.sentence-construction>a,.connections-live-pick a,.pack-head-links a,.pack-examples a.pack-example-form,.script-merges a.script-simplified,a.card-action,.collection-footnote a,.result-alternatives>a,:is(.classical-backlinks p,.character-chapter .detail-card-body>p:not([class]),.word-detail .detail-card-body>p:not([class]),.knowledge-entry-bridge p,.classical-evidence-card>p,.connection-reasoning>p,.classical-work-context .classical-card>p,p.search-scope-note,p.guide-repeated,p.se-links,p.field-fallback-links,p.cross-reading-links,.page-opening>p:has(>a+a))>a){border-radius:3px;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background-color var(--hv-t),box-shadow var(--hv-t),color var(--hv-t)}
@media (hover:hover){
 html body :is(.dictionary-related-links>a,.connection-entry-actions>a,.detail-sources a,.detail-card-body>a:not(.card-action),.depth-facts a,.identity-facts a,.detail-facts a,.confusion-record>a,.ids-leaf>a,.network-actions>a,.field-accessible>a,.canto-cross>a,.canto-document>a,.canto-related>a,.canto-compare a,.canto-collection-bridge>a,.canto-collection-links>a,.canto-page-table a,.reference-links a,.source-list h2>a,.classical-card>a:not(.classical-related),.classical-connection-card>a,.classical-evidence-card>a,.classical-chapter-passages a,.classical-study a,.classical-connection-card h3>a,.structure-card header>a,.classical-reader-tools>a,.classical-section-head>a,.classical-learning-strip>a,.classical-study>a,.classical-study-entry a,.study-actions>a,.classical-toolbar>a,.classical-pagination a,.guide-cues a,.tone-card-links a,.tone-card-heading a,.tone-reference-title a,.sentence-lookup-entry a,.sentence-reader-actions a,a.sentence-more-examples,a.sentence-permalink,.sentence-construction>a,.connections-live-pick a,.pack-head-links a,.pack-examples a.pack-example-form,.script-merges a.script-simplified,a.card-action,.collection-footnote a,.result-alternatives>a,:is(.classical-backlinks p,.character-chapter .detail-card-body>p:not([class]),.word-detail .detail-card-body>p:not([class]),.knowledge-entry-bridge p,.classical-evidence-card>p,.connection-reasoning>p,.classical-work-context .classical-card>p,p.search-scope-note,p.guide-repeated,p.se-links,p.field-fallback-links,p.cross-reading-links,.page-opening>p:has(>a+a))>a):hover{color:var(--accent-dark);background:var(--hv-tint);box-shadow:0 0 0 3px var(--hv-tint)}
}
html body :is(.dictionary-related-links>a,.connection-entry-actions>a,.detail-sources a,.detail-card-body>a:not(.card-action),.depth-facts a,.identity-facts a,.detail-facts a,.confusion-record>a,.ids-leaf>a,.network-actions>a,.field-accessible>a,.canto-cross>a,.canto-document>a,.canto-related>a,.canto-compare a,.canto-collection-bridge>a,.canto-collection-links>a,.canto-page-table a,.reference-links a,.source-list h2>a,.classical-card>a:not(.classical-related),.classical-connection-card>a,.classical-evidence-card>a,.classical-chapter-passages a,.classical-study a,.classical-connection-card h3>a,.structure-card header>a,.classical-reader-tools>a,.classical-section-head>a,.classical-learning-strip>a,.classical-study>a,.classical-study-entry a,.study-actions>a,.classical-toolbar>a,.classical-pagination a,.guide-cues a,.tone-card-links a,.tone-card-heading a,.tone-reference-title a,.sentence-lookup-entry a,.sentence-reader-actions a,a.sentence-more-examples,a.sentence-permalink,.sentence-construction>a,.connections-live-pick a,.pack-head-links a,.pack-examples a.pack-example-form,.script-merges a.script-simplified,a.card-action,.collection-footnote a,.result-alternatives>a,:is(.classical-backlinks p,.character-chapter .detail-card-body>p:not([class]),.word-detail .detail-card-body>p:not([class]),.knowledge-entry-bridge p,.classical-evidence-card>p,.connection-reasoning>p,.classical-work-context .classical-card>p,p.search-scope-note,p.guide-repeated,p.se-links,p.field-fallback-links,p.cross-reading-links,.page-opening>p:has(>a+a))>a):focus-visible{color:var(--accent-dark);background:var(--hv-tint);box-shadow:0 0 0 3px var(--hv-tint);outline:2px solid var(--accent);outline-offset:4px}

/* 7. Chrome links: navigation around the content. Ink or muted text turns accent; text that is already accent
      darkens (light) or brightens to ink (dark, where the accent is already the light colour). */
html body :is(.footer-group a,.footer-brand a.wordmark,.breadcrumbs a,.classical-breadcrumbs a,a.section-tag,a.eyebrow,.panel-heading a,.lookup-sources,.page-opening>a:not(.eyebrow),.classical-opening>a,.collection-pager a,.dictionary-pagination a,main.main>a){transition:color var(--hv-t)}
@media (hover:hover){
 html body :is(.footer-group a,.footer-brand a.wordmark,.breadcrumbs a,.classical-breadcrumbs a,.panel-heading a,.lookup-sources,.page-opening>a:not(.eyebrow),.classical-opening>a:not(.section-tag),.collection-pager a,main.main>a):hover,
 html body #collection-search-results .panel-heading a:hover{color:var(--accent)}
 html body :is(a.section-tag,a.eyebrow,.breadcrumbs a.return-atlas,.dictionary-pagination a):hover{color:var(--accent-dark)}
 html[data-theme=dark] body :is(a.section-tag,a.eyebrow,.breadcrumbs a.return-atlas,.dictionary-pagination a):hover{color:var(--ink)}
}

/* 8. Controls without a hover state, and primary buttons whose hover turned their background light
      (the generic layout-0.14.1 button hover reached them: white text on a pale background). */
@media (hover:hover){
 html body :is(.field-zoom>button,.collection-inspector-bar>button,.classical-reading-footer>button,.connection-pages>button,.collection-pager>button):not(:disabled):hover,
 html body #collection-words .collection-pager button:not(:disabled):hover{background:var(--surface);color:var(--ink)}
 html body :is(form.classical-finder,form.sentence-search,form.tone-search,form.study-search) button[type=submit]:not(:disabled):hover{background:color-mix(in srgb,var(--signal,var(--accent)) 84%,#000);border-color:color-mix(in srgb,var(--signal,var(--accent)) 84%,#000);color:var(--signal-ink,#fff)}
 /* The study buttons set their background with !important (study-0.11.0, details), so their hover has to as well. */
 html body :is(form.study-search button,[data-study-export],[data-study-save]):not(:disabled):hover{background:color-mix(in srgb,var(--signal,var(--accent)) 84%,#000)!important;border-color:color-mix(in srgb,var(--signal,var(--accent)) 84%,#000)!important}
}

/* 9. Touch: hover rules above do not apply; entries get a short press tint, and the character card's arrow,
      which desktop shows on hover, is always visible. */
@media (hover:none){
 html body :is(a.dictionary-row,a.unified-word-hit,.connection-hits>a,a.mini-word,a.collection-word,article.connection-row>a,a.classical-result,a.sentence-result,.script-forms a,a.character-card,a.char-row,a.reference-card,a.saved-entry,.collection-character-grid>a,.character-scroll-cell>a,.card-link-grid>a):active{background:var(--hv-tint)}
 html body .character-card .card-arrow{opacity:.6}
}

/* 10. Reduced motion: state changes are immediate and nothing moves. */
@media (prefers-reduced-motion:reduce){
 html body :is(a,button,summary,[role=tab],.lexical-characters>div,.reading-senses li){transition:none}
 html body a:hover>[aria-hidden="true"]:last-child,html body .search-form>button.random-button:hover .random-die,html body .browse-index-link:hover b{transform:none}
}

/* ---- polish-0.20.2-zmap.css ---- */
/* zimai 0.2.3: map quick wins (reports/map-quickwins.md). Appended by scripts/build-polish.mjs before
   polish-0.20.2-zmappolish.css, whose card tokens, backdrops and 44 px touch targets this file leaves alone. */

/* Line families (structure.mjs RELATION_FAMILIES), read by character-field.mjs colors(); the purple and teal are the
   map's existing structure and sound colours, the gold is the site's --gold token, cross-references take the muted ink. */
html body .character-field{--map-shape:#755d86;--map-sound:#276c75;--map-words:#806322;--map-references:#68635c}
html[data-theme=dark] body .character-field{--map-shape:#bca7d0;--map-sound:#76bfc8;--map-words:#dcc277;--map-references:#aab3ac}
@media (prefers-color-scheme:dark){html:not([data-theme=light]) body .character-field{--map-shape:#bca7d0;--map-sound:#76bfc8;--map-words:#dcc277;--map-references:#aab3ac}}

/* Fit all (corner brackets) and Focus (⌖) in the zoom row: inline SVG, centred like the − / ＋ glyphs. */
html body .character-field .field-zoom>button>svg{display:block;margin:auto;pointer-events:none}

/* "74 of 119 in view · Fit all" follows the status on its line (one row, the status ellipsised first); the grow hint
   gives way to it. */
html body .character-field .field-stage>.field-meta>.field-status-row{display:flex;align-items:baseline;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden}
html body .character-field .field-stage>.field-meta>.field-status-row>[data-field-status]{display:block;flex:0 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
html body .character-field .field-stage>.field-meta>.field-status-row>[data-field-inview]{display:block;flex:none;white-space:nowrap;color:var(--ink)}
html body .character-field .field-stage>.field-meta>.field-status-row>[data-field-inview][hidden]{display:none}
html body .character-field .field-stage>.field-meta>.field-status-row>[data-field-inview]::before{content:'\00a0· '}
html body .character-field .field-stage>.field-meta:has([data-field-inview]:not([hidden])) .field-status-hint{display:none}
/* Narrow panes (phones, a narrow split): the overlay beside the five touch-size zoom buttons is about 115 px wide, so
   while cards are out of view it says only "6 of 48 in view": the status text stays for screen readers and Fit all is
   the corner-bracket button right beside it. */
@container visual (max-width:560px){
 html body .character-field .field-stage>.field-meta>.field-status-row:has(>[data-field-inview]:not([hidden]))>[data-field-status]{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 html body .character-field .field-stage>.field-meta>.field-status-row>[data-field-inview]::before{content:none}
 html body .character-field .field-stage>.field-meta>.field-status-row>[data-field-inview]>.field-inview-fit{display:none}
}
/* The overlay keeps clear of the zoom row (its inset is measured: character-field.mjs clearZoomRow). */
html body .character-field[data-controls=compact][data-zoom-inset][data-zoom-inset] .field-stage>.field-meta{right:var(--field-meta-right)}
html body .character-field .field-stage>.field-meta [data-field-inview]>button{font:inherit;color:var(--accent);background:none;border:0;padding:0 2px;margin:0;min-height:0;min-width:0;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
html body .character-field [data-field-inview]>button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}
@media (pointer:coarse){html body .character-field .field-stage>.field-meta [data-field-inview]>button{padding:10px 6px;margin:-10px -4px}}

/* The line legend in the ⋯ menu and the matching swatch before each relation in the entry list. */
html body .character-field .connection-export>.map-legend{flex:1 1 100%;list-style:none;margin:0 0 6px;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:6px 14px}
html body .character-field .map-legend>li{display:grid;grid-template-columns:24px 1fr;column-gap:7px;align-items:center;font-size:12px;line-height:1.35;color:var(--ink)}
html body .character-field .map-legend>li>i{grid-row:1/span 2;width:24px;height:0}
html body .character-field .map-legend>li>b{font-weight:600}
html body .character-field .map-legend>li>small{grid-column:2;font-size:11px;color:var(--muted)}
html body .character-field :is(.map-legend>li>i,.field-swatch){border-top:2.5px solid var(--map-words)}
html body .character-field :is(.map-legend>li>i,.field-swatch)[data-family=shape]{border-top-color:var(--map-shape)}
html body .character-field :is(.map-legend>li>i,.field-swatch)[data-family=sound]{border-top:2.5px dotted var(--map-sound)}
html body .character-field :is(.map-legend>li>i,.field-swatch)[data-family=references]{border-top:2.5px dashed var(--map-references)}
html body .character-field .field-swatch{display:inline-block;width:14px;height:0;vertical-align:middle;margin:0 5px 2px 0}

/* Very narrow panes: Reset map (start a fresh map) shows ↺, since ⌖ is now the Focus button in the zoom row. */
@container visual (max-width:380px){
 html body .character-field[data-controls=compact] .field-tools [data-field-action=refocus]::before{content:'↺'}
}

/* Focus mode (focus-mode-0.21.0/focus-mode.mjs). The header button wears the theme toggle's sizes; wide headers
   add the word. */
html body .site-header .focus-mode-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;color:var(--ink);cursor:pointer;font:inherit}
html body .site-header .focus-mode-toggle>svg{flex:none}
html body .site-header .focus-mode-toggle .focus-mode-word{display:none}
@media (min-width:760px){html body .site-header .focus-mode-toggle{width:auto;min-width:0;padding:0 11px;border-radius:8px}html body .site-header .focus-mode-toggle .focus-mode-word{display:inline;font-size:14px;line-height:1}}
html[data-focus-mode] .focus-icon-head{stroke-dasharray:2 2;opacity:.55}
html:is([data-focus-mode="2"],[data-focus-mode="3"]) .focus-icon-bar{opacity:.3}
/* 1: the site header goes; 2: the search bar too ("/" shows it over the page until focus leaves it). */
html[data-focus-mode] body .site-header{display:none!important}
html:is([data-focus-mode="2"],[data-focus-mode="3"]):not([data-focus-peek]) body .global-search-bar{display:none!important}
html[data-focus-mode][data-focus-peek] body .global-search-bar{position:fixed!important;top:0!important;left:0;right:0;z-index:1200;max-height:100svh;overflow:auto;background:var(--paper);box-shadow:0 8px 28px rgba(0,0,0,.18)}
/* 3: the map pane fills the window (fullscreen on desktop where allowed). */
html[data-focus-mode="3"],html[data-focus-mode="3"] body{overflow:hidden}
html[data-focus-mode="3"] body [data-focus-pane]{position:fixed!important;inset:0!important;z-index:1100;width:auto!important;height:auto!important;min-height:0!important;max-height:none!important;margin:0!important;border:0!important;border-radius:0!important;background:var(--paper);display:flex!important;flex-direction:column;overflow:hidden;grid-area:auto}
html[data-focus-mode="3"] body [data-focus-pane]>#collection-field{flex:1 1 auto;display:flex!important;flex-direction:column;min-height:0;height:auto}
html[data-focus-mode="3"] body [data-focus-pane] .character-field{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;height:auto;padding:8px 10px 10px}
html[data-focus-mode="3"] body [data-focus-pane] .field-stage{flex:1 1 auto;height:auto!important;min-height:0!important}
html[data-focus-mode="3"] body [data-focus-pane] .field-stage>canvas[data-field-canvas]{height:100%}
/* The floating control (steps 1–3) on the right edge: next step and show everything. */
/* A quiet edge tab; secondary controls only appear on demand. */
.focus-mode-float{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:1300;display:flex;align-items:center;padding:0 3px;background:var(--white,#fff);color:var(--muted,var(--ink));border:1px solid var(--line,#8884);border-right:0;border-radius:6px 0 0 6px}
.focus-mode-float[hidden],.focus-mode-float [hidden]{display:none!important}
.focus-mode-float button{display:flex;align-items:center;justify-content:center;gap:5px;height:30px;padding:0 7px;border:0;border-radius:4px;background:transparent;color:inherit;cursor:pointer;font:500 11px/1.2 var(--sans)}
.focus-mode-float button:hover{background:var(--surface);color:var(--ink)}
.focus-mode-float button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.focus-mode-tools{position:absolute;right:0;bottom:100%;padding:5px;min-width:130px;background:var(--white,#fff);color:var(--ink);border:1px solid var(--line,#8884);border-radius:6px;box-shadow:0 3px 12px #0002}
.focus-mode-tools button{width:100%;height:36px;justify-content:flex-start}
@media(pointer:coarse){.focus-mode-float button{height:40px}.focus-mode-float [data-focus-mode-menu]{width:40px}}
@media print{.focus-mode-float,.site-header .focus-mode-toggle{display:none!important}}

/* ---- polish-0.20.2-zmappolish.css ---- */
/* zimai 0.2.2: connection map polish (reports/map-polish/report.md items 1, 2, 9; items 4, 10 and 11 are drawn in
   network-renderer.mjs). Cards get their own tokens, read by character-field.mjs colors(): a white card with a visible
   edge and shadow in light, a raised card in dark (the dark card was darker than the stage it sits on). */
html body .character-field{--map-card:#ffffff;--map-card-edge:#d3d5ce;--map-card-shadow:rgba(20,24,22,.10)}
html[data-theme=dark] body .character-field{--map-card:#262d2a;--map-card-edge:#4a5550;--map-card-shadow:rgba(0,0,0,.35)}
@media (prefers-color-scheme:dark){html:not([data-theme=light]) body .character-field{--map-card:#262d2a;--map-card-edge:#4a5550;--map-card-shadow:rgba(0,0,0,.35)}}
/* 1. The title row and the status line float over the map: a soft paper backdrop keeps cards that slide under them
   from colliding with their text (the zoom group already has its own background). */
html body .character-field .network-summary,html body .character-field .field-stage>.field-meta,html body .character-field[data-controls=compact] .field-overlay-top .network-summary,html body .character-field[data-controls=compact] .field-stage>.field-meta{background:color-mix(in srgb,var(--white) 84%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:8px}
html body .character-field .network-summary,html body .character-field[data-controls=compact] .field-overlay-top .network-summary{padding:2px 8px}
html body .character-field .field-stage>.field-meta,html body .character-field[data-controls=compact] .field-stage>.field-meta{padding:2px 8px}
/* 9. Touch screens: every map control is at least 44 px (the 3D button stays as it is). */
@media (pointer:coarse){
 html body .character-field .connection-lenses>button,html body .character-field[data-controls] .connection-lenses>button,html body .character-field[data-controls] :is(.field-toolbar,.field-overlay-top) .connection-lenses>button{min-height:44px;height:44px}
 html body .character-field :is(.connection-group-label,.connection-layout-label)>select{min-height:44px}
 html body .character-field .field-tools>button:not([data-field-action=depth]):not([data-field-action=orbit]),html body .character-field[data-controls=compact] .field-tools>button:not([data-field-action=depth]):not([data-field-action=orbit]){min-height:44px;min-width:44px}
 /* 0.2.3: the zoom row and "Read entry" float over the map, and the map is fitted into the band they leave, so their
    44 px tap areas are invisible extensions: on tablets the visible 44 px buttons had cost the map 16 of its 23 cards. */
 html body .character-field .field-zoom>button,html body .character-field[data-controls=compact] .field-zoom>button{position:relative;min-width:42px}
 html body .character-field .field-zoom>button::after,html body .character-field[data-controls=compact] .field-zoom>button::after{content:"";position:absolute;inset:-4px 0}
 html body .character-field .network-summary [data-read-selected],html body .character-field[data-controls=compact] .network-summary [data-read-selected]{position:relative}
 html body .character-field .network-summary [data-read-selected]::after,html body .character-field[data-controls=compact] .network-summary [data-read-selected]::after{content:"";position:absolute;inset:-8px -4px}
}

/* ---- polish-0.20.2-zpages.css ---- */
/* 0.20.9 pages fixes (scripts/fix-0.20.9-pages.mjs writes the matching markup). */

/* A4: the skip link moves focus to <main tabindex="-1">; that programmatic focus needs no ring. */
#main[tabindex="-1"]:focus{outline:none}

/* A2: /sources/ list headings are h2 now (were h3); same look as before at every width. */
html body .source-list h2{font:600 15px/1.5 var(--sans);letter-spacing:-.015em;margin:0;overflow-wrap:anywhere}

/* C4: /cantonese/characters/ on phones.
   The 7-column tone table keeps scrolling sideways: its wrapper is a focusable, named region, and edge shadows show
   that more columns follow (the shadows travel with the content, so they disappear at either end). */
.canto-table-scroll[tabindex]{background:linear-gradient(to right,var(--white) 30%,transparent) left center/40px 100% no-repeat local,linear-gradient(to left,var(--white) 30%,transparent) right center/40px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,rgb(0 0 0/.16),transparent) left center/14px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgb(0 0 0/.16),transparent) right center/14px 100% no-repeat scroll}
.canto-table-scroll[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.canto-page-table th[scope=row],#cedict-cantonese .canto-page-table td:first-child{white-space:nowrap}
/* The 3-column word table becomes one block per word below 480 px, each source labelled, so nothing is cut off. */
@media (max-width:480px){
 #cedict-cantonese .canto-table-scroll table{min-width:0}
 #cedict-cantonese .canto-page-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 #cedict-cantonese .canto-page-table,#cedict-cantonese .canto-page-table tbody,#cedict-cantonese .canto-page-table tr,#cedict-cantonese .canto-page-table td{display:block;width:auto}
 #cedict-cantonese .canto-page-table tr{padding:10px 0;border-bottom:1px solid var(--rule)}
 #cedict-cantonese .canto-page-table td{border:0;padding:2px 0}
 #cedict-cantonese .canto-page-table td:first-child{font-size:20px;line-height:1.3;white-space:nowrap}
 #cedict-cantonese .canto-page-table td:nth-child(2)::before,#cedict-cantonese .canto-page-table td:nth-child(3)::before{display:block;font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em}
 #cedict-cantonese .canto-page-table td:nth-child(2)::before{content:"CC-CEDICT (Mandarin dictionary)"}
 #cedict-cantonese .canto-page-table td:nth-child(3)::before{content:"CC-Canto"}
}

/* U9: /lists/?add=… shows the incoming entry first, under the page heading. */
.study-incoming{border:1px solid var(--rule);border-left:3px solid var(--accent);border-radius:8px;background:var(--white);padding:14px 16px;margin:0 0 18px}
.study-incoming h2{font:600 17px/1.35 var(--sans);margin:0 0 4px}
.study-incoming p{font-size:14px;line-height:1.5;color:var(--muted);margin:0 0 10px}
.study-incoming p b{color:var(--ink);font-weight:600}
html body .study-incoming button{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;width:100%;margin:0 0 8px;text-align:left}
.study-incoming button b{font-size:23px;grid-row:span 2}
.study-incoming button span{font-size:14px}
.study-incoming button small{font-size:12px;color:var(--accent)}
.study-incoming-back{font-size:14px}
@media (max-width:600px){.study-has-incoming .study-opening{padding-bottom:12px}.study-has-incoming .study-opening p{display:none}}
/* The bulk-add example lines are hints, not content: muted like every other placeholder. */
.study-workspace textarea::placeholder,.study-workspace input::placeholder{color:var(--muted);opacity:1}

/* ---- polish-0.20.2-zphone.css ---- */
/* zimai 0.2.3: phones first (reports/ux-polish-0.2.4/report.md Ph1–Ph4, Ph6, Ph9; D2 for the desktop pane).
   1. Only the search field row stays pinned on phones and short screens: the lookup line above it scrolls away
      (search-controller.mjs measures --search-pin, the part above the field row, and --search-pin-h, what stays
      visible). The pinned block was 172 px on a 390×844 phone and 216 px (55 %) in landscape. Under 500 px of height
      nothing is pinned. */
@media (max-width:850px),(max-height:820px){
 html body .global-search-bar{top:calc(-1*var(--search-pin,0px))}
}
@media (max-height:500px) and (orientation:landscape){
 html body .global-search-bar{position:static}
}
@media (max-width:850px){
 html body:has(#collection-app) :is(.collection-inspector,.character-field){scroll-margin-top:calc(var(--search-pin-h,124px) + 8px)}
 /* 2. While there is a query, the "Try" examples give way to the results (they only help an empty field). */
 html body .global-search-bar:has(#character-search:not(:placeholder-shown)) .home-search-below{display:none}
 /* 3. A results list needs no page heading and layout switch above it: they return with the entry. */
 html body .collection-app.searching:not(.show-selection)>.workspace-heading{display:none!important}
}
/* 4. An opened entry starts with the entry. The breadcrumb "Dictionary / 水" is for the entry's own page; in the
      workspace "← Results" / "← Browse" already leads back. The back row is a slim 44 px line. */
html body .collection-inspector #collection-entry>nav.breadcrumbs{display:none}
html body .collection-app .collection-inspector-bar{min-height:44px;padding-top:0;padding-bottom:0}
html body .collection-app .collection-inspector-bar [data-close-inspector]{min-height:40px}
@media (pointer:coarse){html body .collection-app .collection-inspector-bar [data-close-inspector]{min-height:44px}}
/* 5. Desktop: an entry opened from the results replaces them, as on phones ("← Results" brings them back where
      they were); the results no longer shrink into a 217 px strip above an entry that starts at the screen's edge. */
@media (min-width:851px){
 html body .collection-app.searching.show-selection .collection-overview{display:none!important}
}
/* 6. Touch targets: 44 px without making the controls look bigger (an invisible extension of the hit area). */
@media (pointer:coarse){
 html body .header-right>:is(.reading-toggle,.theme-toggle,button){position:relative}
 html body .header-right>:is(.reading-toggle,.theme-toggle,button)::after{content:"";position:absolute;inset:-2px -5px}
 html body .site-nav a{min-height:44px;display:inline-flex;align-items:center}
 html body .home-search-below a{position:relative}
 html body .home-search-below a::after{content:"";position:absolute;inset:-7px -4px}
}
/* 7. Tab strips that scroll sideways: 0.20.9 fades the end while more tabs follow; once scrolled, the start fades too
      (chrome.mjs marks data-scrolled), so a tab cut at the left edge ("ntry") reads as scrolled, not broken. */
html body :is(.collection-tabs,.search-type-tabs)[data-overflow][data-scrolled]:not([data-at-end]){-webkit-mask-image:linear-gradient(90deg,transparent,#000 32px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent,#000 32px,#000 calc(100% - 40px),transparent)}
html body :is(.collection-tabs,.search-type-tabs)[data-overflow][data-scrolled][data-at-end]{-webkit-mask-image:linear-gradient(90deg,transparent,#000 32px);mask-image:linear-gradient(90deg,transparent,#000 32px)}

/* ---- polish-0.20.2-zrandom.css ---- */
/* zimai 0.20.10: random-character button beside the pen (handwriting-0.19.0/pen.mjs), in the pen's style:
   44 px target, accent icon, the same hover, press and focus treatment. 0.2.1: a die with a visible label from
   600 px ("Random", and "Random character" from 900 px); the die tilts on hover and rolls on click. */
html body .search-form>button.random-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;margin:0;border:0;border-radius:10px;background:transparent;color:var(--accent);box-shadow:none;cursor:pointer;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}
html body .search-form>button.random-button svg{display:block;fill:currentColor;overflow:visible}
html body .search-form>button.random-button .random-die{flex:none;transition:transform .22s ease}
html body .search-form>button.random-button .random-label{display:none;font-size:.875rem;font-weight:500;line-height:1;white-space:nowrap;letter-spacing:.005em}
@media (min-width:600px){html body .search-form>button.random-button{width:auto;gap:7px;padding:0 12px 0 10px}html body .search-form>button.random-button .random-label{display:inline}html body .search-form>button.random-button .random-label-long{display:none}}
@media (min-width:900px){html body .search-form>button.random-button .random-label-long{display:inline}html body .search-form>button.random-button .random-label-short{display:none}}
@media (hover:hover){html body .search-form>button.random-button:hover .random-die{transform:rotate(22deg)}}
html body .search-form>button.random-button.rolling .random-die{animation:zimai-die-roll .32s cubic-bezier(.3,.7,.4,1)}
@keyframes zimai-die-roll{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@media (hover:hover){html body .search-form>button.random-button:hover{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--rule)}}
html body .search-form>button.random-button:active{background:color-mix(in srgb,var(--surface) 70%,var(--rule))}
html body .search-form>button.random-button[aria-busy=true]{cursor:progress}
html body .search-form>button.random-button[aria-busy=true] svg{opacity:.55}
@media (prefers-reduced-motion:reduce){html body .search-form>button.random-button,html body .search-form>button.random-button .random-die{transition:none;animation:none}}
/* Narrow phones (under 360 px): with three icon buttons the field would drop under 100 px, so Search shows the
   magnifier instead of its label (its accessible name stays "Search dictionary"). */
@media (max-width:359px){
 html body .search-form>button[type=submit]{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:44px;min-width:44px;padding:0;padding-inline:0;font-size:0;letter-spacing:0}
 html body .search-form>button[type=submit]::before{content:"";width:19px;height:19px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='black' stroke-width='2.2'/%3E%3Cpath d='m15.6 15.6 5 5' stroke='black' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='black' stroke-width='2.2'/%3E%3Cpath d='m15.6 15.6 5 5' stroke='black' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
}

/* ---- polish-0.20.2-zreference.css ---- */
/* zimai 0.2.1: the Reference hub (/reference/), its script page (/reference/script/) and the "moved" pages that
   replace the pilot and planning pages (scripts/fix-0.2.1-reference.mjs). Site tokens only; one column on phones. */
html body .reference-hub{display:grid;gap:clamp(28px,4vw,44px);margin:8px 0 clamp(32px,5vw,56px)}
html body .reference-group{scroll-margin-top:16px}
html body .reference-group>header{display:flex;align-items:baseline;gap:12px;margin:0 0 14px}
html body .reference-group>header b{font-family:var(--han-display-tc);font-weight:500;font-size:1.75rem;line-height:1;color:var(--accent)}
html body .reference-group>header h2{margin:0;font-size:1.25rem;line-height:1.3}
html body .reference-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17.5rem),1fr));gap:16px}
html body a.reference-card{display:flex;flex-direction:column;gap:6px;min-height:100%;padding:18px 20px;border:1px solid var(--rule);border-radius:12px;background:var(--surface);color:var(--ink);text-decoration:none;transition:border-color .16s ease,background-color .16s ease}
html body a.reference-card h3{margin:0;font-size:1.05rem;line-height:1.35}
html body a.reference-card p{margin:0;color:var(--muted);line-height:1.5;overflow-wrap:anywhere}
html body a.reference-card span{margin-top:auto;padding-top:6px;color:var(--accent);font-weight:500}
@media (hover:hover){html body a.reference-card:hover{border-color:var(--accent);background:var(--tint);text-decoration:none}}
html body a.reference-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
html body .reference-links{display:flex;flex-wrap:wrap;gap:10px 24px;margin:0;padding:0;list-style:none}
html body .reference-links a{font-weight:500}
html body .script-merges{list-style:none;margin:8px 0 24px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr));gap:12px}
html body .script-merges>li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:start;padding:14px 16px;border:1px solid var(--rule);border-radius:12px;background:var(--surface)}
html body .script-merges .script-simplified{font-family:var(--han-display-sc);font-size:2.25rem;line-height:1.1;color:var(--ink);text-decoration:none}
html body .script-forms{display:grid;gap:8px;min-width:0}
html body .script-forms a{display:grid;grid-template-columns:auto auto minmax(0,1fr);column-gap:10px;align-items:baseline;color:var(--ink);text-decoration:none}
html body .script-forms b{font-family:var(--han-display-tc);font-weight:500;font-size:1.35rem;line-height:1.2}
html body .script-forms span{color:var(--accent);font-weight:500;white-space:nowrap}
html body .script-forms small{color:var(--muted);font-size:.9rem;line-height:1.4;overflow-wrap:anywhere}
@media (hover:hover){html body .script-forms a:hover small{color:var(--ink)}}
html body .reference-source{color:var(--muted);font-size:.9rem}
html body .moved-page{min-height:40vh}

/* ---- polish-0.20.2-zsearch.css ---- */
/* 0.20.9 search and lookup fixes from the 0.20.7 audit (report: zimai-0.20.2-work/reports/fix-search-0.20.9.md).
   Named to sort after polish-0.20.2-zdesign.css. JS for the same pass: search-controller.mjs, search-view.mjs,
   gloss-format-0.20.2/format.mjs, cantonese-0.16.0/search.mjs, lookup-0.18.0/lookup.mjs, rendered-0.17.0/chrome.mjs. */

/* ---- C2: a Cantonese search link (/?q=m4goi1&lang=yue) jumped twice on phones. The results area held one screen
   only while [hidden]; the Cantonese path shows it at once with a one-line "Opening Cantonese entries…" status, so the
   map pane was painted in view and pushed away again when the results came (CLS 0.78 at 390 px, throttled). The same
   reservation now holds while the results are loading (aria-busy), on every search path. ---- */
@media (max-width:850px){html body .collection-app.searching #collection-search-results[aria-busy=true]{min-height:calc(100svh - var(--search-sticky,0px))}}

/* ---- U3: the entry tabs and the result-type tabs scroll sideways on phones; like the main navigation they fade
   at the end while more tabs follow (data-overflow / data-at-end from rendered-0.17.0/chrome.mjs). ---- */
html body :is(.collection-tabs,.search-type-tabs)[data-overflow]:not([data-at-end]){-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent)}

/* ---- polish-0.20.2-zui.css ---- */
/* zimai 0.2.3: desktop polish (reports/ux-polish-0.2.4/report.md D1, D3, D4, B1, B2, D9). Started by the desk-polish
   session (its frame idea: one gutter, chrome never centred), finished in the release tree. No hover rules here.

   D1. One frame for every page family. The header, the search bar, the page and the footer of content pages
   (Reference, Classical, About, Lists, character pages) now share the workspace's edges: 24 px from 1101 px, 16 px
   to 850 px, 12 px below. Before, they sat at 40 / 28 / 16 px and at 1920 px centred in a 1440 frame (x = 280), so the
   whole chrome jumped when moving from Dictionary to Reference. The workspace and its map are unchanged. Content keeps
   its 1440 px measure, from the same left edge as the logo and the search box. */
html body:not(:has(#collection-app)) :is(.site-header,.global-search-bar,.site-footer){max-width:none;margin-inline:0;padding-inline:24px}
html body:not(:has(#collection-app)) main.main{max-width:1488px;margin-inline:0;padding-inline:24px}
@media (max-width:1100px){html body:not(:has(#collection-app)) :is(.site-header,.global-search-bar,.site-footer,main.main){padding-inline:16px}}
@media (max-width:850px){html body:not(:has(#collection-app)) :is(.site-header,.global-search-bar,.site-footer,main.main){padding-inline:12px}}
/* The logo is a link to the home page: it stretched over the whole header row (1183 px at 1440), so a click on empty
   header space left the page. It keeps its own width; the buttons stay on the right. */
html body .site-header>a.brand{flex:0 0 auto;justify-self:start}

/* D3. Reading measure: paragraphs and list items on content pages stop at about 72 characters (Methodology ran to
   ~110, Sources to 183, character-page notes to 190). Tables, cards and grids are narrower already or exempt. */
html body:not(:has(#collection-app)) main :is(p,li,dd,blockquote,figcaption):not(:is(table,.card-link-grid,.detail-card-grid) *){max-width:72ch}

/* D4. Controls share one corner: 8 px, as the search field, header buttons and cards already have. The entry actions
   were the only pills on the site (pills stay for chips and tags); the layout switch had 7 px and the 404 button 4 px. */
:root{--radius-control:8px}
html body .entry-actions>.entry-action.entry-action{border-radius:var(--radius-control)}
html body .workspace-layouts{border-radius:var(--radius-control)}
html body .workspace-layouts>button{border-radius:calc(var(--radius-control) - 2px)}
html body :is(a,button).button{border-radius:var(--radius-control)}
/* B2. The 404 page offers the main sections next to its one button. */
html body .not-found-ways{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:8px}
html body .not-found-ways nav{display:flex;flex-wrap:wrap;gap:4px 18px}
html body .not-found-ways nav a{display:inline-flex;align-items:center;min-height:40px;color:var(--accent);font-weight:500}
@media (pointer:coarse){html body .not-found-ways nav a{min-height:44px}}

/* B1. Entry section cards: every "… ↗" action link in them reads the same (accent colour, 1rem). Three cards drew them
   in ink at 16–17 px, two in red at 14–16 px. Only action links: a paragraph's lone link into Classical, never
   prose, captions or citations. Counts of 0 are no longer drawn (views.mjs). */
html body .detail-card :is(.detail-card-body>a[href],.connection-entry-actions>a[href]),
html body .detail-card:not(.classical-backlinks) .detail-card-body>p:not([class])>a[href^="/classical/"]:only-child{color:var(--accent);font-size:1rem;font-weight:500}
html body .connection-entry-metrics:empty{display:none}

/* D5. The character card's own "Entry ↗": on a character page it linked to the page itself, and in the dictionary pane
   the action row under the card already offers "Full entry". */
html body .catalog-identity>a[href]{display:none}

/* D8. Focus mode, step 2 (header and search bar hidden): the workspace heading and layout switch go too. */
html[data-focus-mode="2"] body .collection-app>.workspace-heading{display:none!important}
/* With counts of 0 left out, the tile row holds one to three tiles: it is as wide as its tiles (up to 168 px each). */
html body .connection-entry-metrics{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,168px);width:fit-content;max-width:100%}

/* B2. The 404 page (site/404.html, served by serve.mjs for every unknown page with status 404): the address that was
   not found, what kind of page it was (not-found-0.2.3/not-found.mjs), a lookup when it holds Chinese, the sections.
   Its links follow the hover file's language: section links are chrome (already accent: darker in light, ink in dark),
   the link in the explanation is prose. */
html body .not-found-context{display:grid;gap:6px;margin:0 0 22px;max-width:72ch}
html body .not-found-context p{margin:0}
html body .not-found-address{color:var(--muted);font-size:14px}
html body .not-found-address code{font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink);background:var(--subtle);border:1px solid var(--rule);border-radius:6px;padding:1px 6px;margin-left:4px;overflow-wrap:anywhere}
html body .not-found-kind a{color:var(--accent);font-weight:500}
html body .not-found-ways .button{border-radius:var(--radius-control)}
html body .not-found-ways nav a{transition:color var(--hv-t,.15s)}
@media (hover:hover){
 html body .not-found-ways nav a:hover{color:var(--accent-dark)}
 html[data-theme=dark] body .not-found-ways nav a:hover{color:var(--ink)}
}
html body .not-found-ways nav a:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
@media (prefers-reduced-motion:reduce){html body .not-found-ways nav a{transition:none}}
/* The same notice inside the workspace, when a link or ?entry= names an entry this edition does not have. */
html body .collection-app .entry-missing{scroll-margin-top:calc(var(--search-pin-h,0px) + 16px);font-size:13px;line-height:1.55;color:var(--muted);padding:9px 12px;margin-bottom:8px;background:var(--subtle);border:1px solid var(--rule);border-left:3px solid var(--accent);border-radius:7px}
html body .collection-app .entry-missing b{color:var(--ink);font-weight:600}
html body .collection-app .entry-missing code{font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink);overflow-wrap:anywhere}
html body .collection-app .entry-missing a{color:var(--accent);font-weight:500;white-space:nowrap}

/* Focus mode's Compact search palette (focus-mode-0.21.0: the floating search button, "/" or ⌘K/Ctrl+K). The search
   bar comes back in its own place at the top of the page, sticky, slim (the language and Try rows stay hidden) and
   lifted by a shadow, so the live results show right under it: in the workspace pane, or in its own dropdown on other
   pages. It closes when focus leaves it or on Esc. (zmap floated it over the page, covering the top of the results.) */
html[data-focus-mode][data-focus-peek] body .global-search-bar{position:sticky!important;top:0!important;left:auto;right:auto;max-height:none;overflow:visible;z-index:1200;background:var(--paper);box-shadow:0 10px 28px rgba(0,0,0,.16)}
html[data-focus-mode][data-focus-peek] body .global-search-bar :is(.lookup-line,.home-search-below){display:none!important}

/* 0.2.4: the floating control's way out is labelled. The bare × ("Show everything", explained only by a tooltip that
   phones never show) was easy to overlook; it now reads "Exit focus" under the ×, set apart from search and next step
   by a rule. The control stays one button wide. */

/* 0.2.4: ⋯ → PNG (character-field.mjs exportPNG) is a desktop feature: phones and tablets keep SVG and the view link
   (a whole grown map at reading size is beyond what a phone's canvas will hold). */
@media (hover:none),(pointer:coarse){html body .connection-export [data-export-map=png]{display:none}}

/* ---- polish-0.20.2-zwords.css ---- */
/* zimai 0.2.4: one page per written form (/word/<form>/). A form with several records lists each reading with its
   own meanings under the one heading (section.entry-reading, id = the reading's anchor, #hang2); a link carries the
   anchor. Notes above an entry (a simplified spelling it also stands for; a Cantonese reader's Mandarin entry) and the
   chooser for a simplified spelling with several traditional forms (发 → 發 / 髮). Everything else keeps 0.2.2. */
html body .word-identity.entry-focus>.entry-readings{grid-column:1/-1;min-width:0;display:grid;gap:0;margin-top:6px}
/* Sections reach 10 px into the card's padding so a targeted reading's tint and edge clear the text; the divider
   between readings stays on the text column. */
html body .entry-readings>.entry-reading{--divider:linear-gradient(var(--rule),var(--rule)) 10px 0/calc(100% - 20px) 1px no-repeat;margin-inline:-10px;padding:12px 10px 4px;background:var(--divider);border-radius:2px;scroll-margin-top:12px}
html body .entry-readings>.entry-reading:first-child{--divider:linear-gradient(transparent,transparent);padding-top:4px}
html body .entry-reading>.reading{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;font-size:1.25rem}
html body .entry-reading>.reading small{color:var(--muted);font-size:12px;font-weight:500;letter-spacing:.01em}
html body .entry-reading>.reading [lang$="-Latn"]{font-size:inherit}
html body .entry-reading ol.catalog-definitions.entry-senses{margin-top:6px}
html body .entry-reading>.entry-senses-german{margin-top:6px}
html body .entry-reading-link{margin-left:auto;padding:0 6px;border-radius:var(--radius-control,8px);color:var(--muted);font-size:13px;font-weight:500;text-decoration:none;opacity:0;transition:opacity .15s,color .15s}
html body .entry-reading:is(:hover,:focus-within)>.reading .entry-reading-link,html body .entry-reading-link:focus-visible{opacity:1}
@media (hover:hover){html body .entry-reading-link:hover{color:var(--accent);text-decoration-line:none!important}}
@media (hover:none){html body .entry-reading-link{opacity:.7}}
html body .entry-reading:target,html body .entry-reading.entry-reading-target{background:var(--divider),linear-gradient(90deg,var(--tint,rgba(176,46,38,.06)),transparent 70%);box-shadow:inset 2px 0 0 var(--accent)}
html body .word-identity.entry-focus>.reading:target{box-shadow:inset 0 -2px 0 var(--accent)}
@media (prefers-reduced-motion:reduce){html body .entry-reading-link{transition:none}}
html body .word-route-note{margin:0 0 12px;padding:9px 12px;border:1px solid var(--rule);border-radius:var(--radius-control,8px);background:var(--surface);color:var(--muted);font-size:14px;line-height:1.45}
html body .word-route-note a{color:var(--accent)}
html body .word-chooser>.word-identity{display:block;padding:18px 20px 14px}
html body .word-chooser>.word-identity p{margin:8px 0 0;color:var(--muted)}
html body .word-chooser-list{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:2px}
html body a.word-chooser-form{display:grid;grid-template-columns:minmax(3.2em,max-content) minmax(0,1fr);gap:4px 16px;align-items:baseline;margin-inline:-12px;padding:10px 12px;border-radius:var(--radius-control,8px);color:var(--ink);text-decoration:none}
html body a.word-chooser-form>span:first-child{font-size:1.75rem;line-height:1.2}
html body a.word-chooser-form strong{display:block;font-weight:600}
html body a.word-chooser-form small{display:block;color:var(--muted);font-size:15px}
@media (hover:hover){html body a.word-chooser-form:hover{background:var(--hv-tint);box-shadow:inset 2px 0 0 var(--hv-edge);text-decoration-line:none!important}}
html body a.word-chooser-form:focus-visible{background:var(--hv-tint);box-shadow:inset 2px 0 0 var(--hv-edge);outline:2px solid var(--accent);outline-offset:-2px}



/* ---- polish-0.20.2-zzworkspace.css ---- */
/* Search-first workspace chrome. Focus mode and standalone reading pages retain their layouts. */
html:not([data-focus-mode]) body .site-header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"brand nav tools";align-items:center;gap:24px;min-height:60px;padding:8px 24px;margin:0;max-width:none;border-bottom:0}
html:not([data-focus-mode]) body .site-header>.brand{grid-area:brand;margin:0;gap:8px}
html:not([data-focus-mode]) body .site-header .brand-emblem{width:23px;height:32px;background-size:100% 100%}
html:not([data-focus-mode]) body .site-header .wordmark{font-size:25px}
html:not([data-focus-mode]) body .site-header>.site-nav{grid-area:nav;display:flex;align-items:center;justify-content:flex-start;gap:4px;width:auto;min-width:0;margin:0;padding:0;border:0;overflow:auto;white-space:nowrap}
html:not([data-focus-mode]) body .site-header .site-nav a{padding:7px 10px;min-height:34px;font-size:13px;line-height:20px;border-radius:6px}
html:not([data-focus-mode]) body .site-header>.header-right{grid-area:tools;display:flex;align-items:center;gap:6px;margin:0}
html:not([data-focus-mode]) body .site-header :is(.reading-toggle,.theme-toggle){height:34px;min-height:34px;width:34px;padding:0;border-radius:6px}
html:not([data-focus-mode]) body .site-header .focus-mode-toggle{width:auto;padding:0 9px}
html:not([data-focus-mode]) body .global-search-bar{display:flex;flex-direction:column;gap:4px;padding:4px 24px 6px;margin:0;max-width:none;border-bottom:1px solid var(--rule)}
html:not([data-focus-mode]) body .global-search-inner{order:0;width:100%;max-width:none;margin:0}
html:not([data-focus-mode]) body .search-form{min-height:52px;height:52px;padding:4px 6px 4px 14px;border-radius:9px;gap:8px}
html:not([data-focus-mode]) body .search-form input[type=search]{font-size:18px;min-height:40px;height:40px;padding-block:0}
html:not([data-focus-mode]) body .search-form>button[type=submit]{min-height:40px;height:40px;padding:0 20px;font-size:14px}
html:not([data-focus-mode]) body .search-form .random-label{display:none}
html:not([data-focus-mode]) body .search-form>.random-button{width:40px;min-width:40px;height:40px;min-height:40px;padding:0}
html:not([data-focus-mode]) body:has(#collection-app) .home-search-below{display:none}
html:not([data-focus-mode]) body .lookup-line{order:1;margin:0;align-self:stretch}
html:not([data-focus-mode]) body .lookup-line>summary{display:flex;align-items:center;gap:8px;width:max-content;max-width:100%;min-height:30px;padding:2px 4px;border:0;border-radius:4px;background:transparent;list-style:none;cursor:pointer;font:400 12px/1.5 var(--sans);color:var(--muted)}
html:not([data-focus-mode]) body .lookup-line>summary::-webkit-details-marker{display:none}
html:not([data-focus-mode]) body .lookup-chip-caption{font-size:12px;font-weight:500;color:var(--ink)}
html:not([data-focus-mode]) body .lookup-chip-value{flex:none;font-size:12px}
html:not([data-focus-mode]) body .lookup-line>summary::after{content:'';width:5px;height:5px;border:solid currentColor;border-width:0 1px 1px 0;transform:translateY(-2px) rotate(45deg);margin-left:3px}
html:not([data-focus-mode]) body .lookup-line[open]>summary::after{transform:translateY(1px) rotate(-135deg)}
html:not([data-focus-mode]) body .lookup-line[open]>.lookup-line-body{padding:10px 12px;margin:3px 0 6px;border:1px solid var(--rule);border-radius:7px;background:var(--white)}
html:not([data-focus-mode]) body :is(.search-recents,.global-search-results){order:2}
html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading{min-height:34px;margin:0 0 6px;padding:0;gap:12px}
html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading .section-tag{display:none}
html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading h1{font:500 14px/1.3 var(--sans);letter-spacing:0;margin:0;color:var(--muted)}
html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts{padding:2px;border-radius:6px}
html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts button{min-height:28px;padding:4px 10px;font-size:12px}
@media(max-width:850px){
 html:not([data-focus-mode]) body .site-header{grid-template-columns:1fr auto;grid-template-areas:"brand tools" "nav nav";gap:4px 12px;padding:7px 12px 3px;min-height:0}
 html:not([data-focus-mode]) body .site-header .site-nav a{padding:5px 9px;min-height:32px;font-size:12px}
 html:not([data-focus-mode]) body .global-search-bar{padding:4px 12px}
 html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading h1{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
 html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading{justify-content:flex-end;min-height:32px;margin-bottom:4px}
 html:not([data-focus-mode]) body .search-form{gap:3px;padding-left:10px}
 html:not([data-focus-mode]) body .search-form input[type=search]{font-size:16px;min-width:0}
 html:not([data-focus-mode]) body .search-form>button[type=submit]{padding-inline:12px}
}
@media(pointer:coarse){
 html:not([data-focus-mode]) body .site-header :is(.reading-toggle,.theme-toggle){height:40px;min-height:40px}
 html:not([data-focus-mode]) body .lookup-line>summary{min-height:40px}
 html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts button{min-height:36px}
}

/* Shared 4 px spacing rhythm for workspace controls and panel interiors. */
html body .collection-app{--workspace-inset:12px;--workspace-gap:8px}
html:not([data-focus-mode]) body .lookup-line>summary{padding-inline:0}
html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading{padding-block:4px;margin-bottom:8px;min-height:40px}
html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading h1{font-size:13px}
html body .collection-app .collection-tabs{align-items:center;gap:4px;padding:4px var(--workspace-inset);min-height:40px}
html body .collection-app .collection-tabs>button{display:inline-flex;align-items:center;justify-content:center;height:32px;min-height:32px;padding:5px 10px;margin:0;font-size:13px;line-height:20px;white-space:nowrap}
html body .collection-app .collection-filters{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:5px var(--workspace-inset) 4px;margin:0}
html body .collection-app .collection-filters>label{display:inline-flex;align-items:center;gap:6px;margin:0;font-size:12px;line-height:20px;white-space:nowrap}
html body .collection-app .collection-filters select{min-height:32px;height:32px;margin:0;padding:4px 28px 4px 8px;font-size:13px;line-height:20px;border-radius:6px}
html body .collection-app .collection-filters input[type=checkbox]{width:14px;height:14px;margin:0;flex:none;accent-color:var(--accent)}
html body .collection-app .character-explorer-launch{display:inline-flex;align-items:center;justify-content:center;height:32px;min-height:32px;padding:0 10px;margin:0;border-radius:6px;font-size:12px;line-height:20px}
/* The continuous-scroll footer already states the total; retain the live count for assistive technology. */
html body .collection-app #collection-count{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html body .collection-app .character-scroll-cell>a{display:grid;grid-template-rows:2.86rem 2.5rem;align-content:center;justify-items:center;align-items:start;gap:4px;padding:4px}
html body .collection-app .character-scroll-cell .han{line-height:1.3;text-align:center}
html body .collection-app .character-scroll-cell small{margin:0;line-height:1.35}
html body .collection-app .character-scroll-footer{padding:6px var(--workspace-inset) 9px;gap:8px;min-height:44px}
html body .collection-app .character-scroll-footer>button{padding:4px 8px;min-height:28px!important;height:28px;border-radius:5px;line-height:20px}
html body .collection-app .character-scroll-label,html body .collection-app #collection-character-page{font-size:11px;line-height:20px}
html body .collection-app .collection-index-note{margin:0;padding:8px var(--workspace-inset);font-size:11px;line-height:18px}
@media(min-width:851px) and (pointer:fine){
 html body .collection-app .character-field:not([data-controls=compact]) .field-toolbar{padding:8px var(--workspace-inset);gap:8px}
 html body .collection-app .character-field:not([data-controls=compact]) .connection-lenses>button{min-height:28px;height:28px;padding:4px 10px;line-height:20px;font-size:12px}
 html body .collection-app .character-field:not([data-controls=compact]) .connection-controls-row{gap:8px;margin-top:0}
 html body .collection-app .character-field:not([data-controls=compact]) .connection-controls-row select{min-height:32px;height:32px;line-height:20px;padding-block:4px;font-size:13px}
 html body .collection-app .character-field:not([data-controls=compact]) .field-tools>button{height:32px;min-height:32px;padding:4px 10px;line-height:20px;font-size:12px}
}
@media(max-width:850px){
 html body .collection-app{--workspace-inset:10px}
 html body .collection-app .collection-tabs{gap:0;padding-inline:6px}
 html body .collection-app .collection-tabs>button{padding-inline:9px;font-size:12px}
 html body .collection-app .collection-filters{gap:8px 10px;padding-block:8px}
 html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading{padding-block:2px;min-height:36px;margin-bottom:6px}
}
@media(pointer:coarse){
 html body .collection-app .collection-tabs>button{min-height:44px}
 html body .collection-app .collection-filters select,html body .collection-app .character-explorer-launch{height:40px;min-height:40px}
 html body .collection-app .collection-filters>label{min-height:40px}
 html body .collection-app .character-scroll-footer>button{height:40px;min-height:40px!important}
}

/* A single compact segmented switch with equal columns and stable text baselines. */
html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading{align-items:center;min-height:48px;padding-block:8px;margin-bottom:0}
html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts{display:inline-grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:2px;padding:2px;margin-block:0;border:0;border-radius:7px;background:color-mix(in srgb,var(--ink) 5%,transparent);box-shadow:none;max-width:100%}
html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts button{display:flex;align-items:center;justify-content:center;box-sizing:border-box;height:28px;min-height:28px;margin:0;padding:0 10px;border:0;border-radius:5px;background:transparent;box-shadow:none;font:500 12px/20px var(--sans);letter-spacing:0;color:var(--muted);white-space:nowrap}
html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts button[aria-pressed=true]{background:var(--white);color:var(--ink);box-shadow:0 1px 2px #00000010,inset 0 0 0 1px var(--rule)}
html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts button:hover{color:var(--ink)}
html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;position:relative;z-index:1}
@media(max-width:850px){
 html:not([data-focus-mode]) body:has(#collection-app) .collection-heading.workspace-heading>div:first-child{position:absolute}
 html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts button{padding-inline:9px;height:40px;min-height:40px}
}
@media(pointer:coarse){html:not([data-focus-mode]) body:has(#collection-app) .workspace-layouts button{height:40px;min-height:40px}}

/* Keep evidence in the reading flow; optional research tools share one row. */
.word-detail .entry-research{margin:12px 0;border:1px solid var(--rule);border-radius:8px;background:var(--white)}
.word-detail .entry-research>summary{padding:12px 16px;min-height:44px;cursor:pointer;font:500 13px/20px var(--sans);color:var(--ink)}
.word-detail .entry-research>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.word-detail .entry-research-body{padding:0 16px 12px}
.word-detail .entry-research .entry-research-group{margin:0;padding:12px 0;border:0;border-top:1px solid var(--rule);border-radius:0;background:transparent;box-shadow:none}
.word-detail .entry-research .detail-card-heading{padding:0 0 8px;border:0}
.word-detail .entry-research .detail-card-heading h2{font-size:13px;line-height:20px}
.word-detail .entry-research .detail-card-body{padding:0;font-size:13px;line-height:1.6}
.word-detail .entry-research .detail-card-body p{margin:0 0 8px}
.word-detail .entry-action-icon{width:40px;min-width:40px;padding-inline:0;justify-content:center}
.word-detail .entry-action-icon>span{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.word-detail .entry-action-status:empty{display:none}

/* Results use their space for spelling, pronunciation, meaning and attribution. */
html body :is(#collection-search-results,.unified-groups,.pack-word-results,.cantonese-word-results) .dictionary-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:12px 10px;min-width:0}
html body :is(#collection-search-results,.unified-groups,.pack-word-results,.cantonese-word-results) .dictionary-row .result-number,html body :is(#collection-search-results,.unified-groups,.pack-word-results,.cantonese-word-results) .dictionary-row .result-arrow{display:none}
html body :is(#collection-search-results,.unified-groups,.pack-word-results,.cantonese-word-results) .dictionary-row .dictionary-headword{flex:0 1 auto;max-width:100%;min-width:0;font-size:26px;line-height:1.35;overflow-wrap:anywhere}
html body :is(#collection-search-results,.unified-groups,.pack-word-results,.cantonese-word-results) .dictionary-row .dictionary-reading{flex:1 1 110px;min-width:0;margin:0;font-size:15px;line-height:1.5;overflow-wrap:anywhere}
html body :is(#collection-search-results,.unified-groups,.pack-word-results,.cantonese-word-results) .dictionary-row .dictionary-gloss{flex:1 0 100%;min-width:0;font-size:15px;line-height:1.5}
html body :is(#collection-search-results,.unified-groups,.pack-word-results,.cantonese-word-results) .dictionary-row .result-source{flex-basis:100%;font-size:11px;line-height:16px;margin:0}
html body .word-detail .entry-actions .entry-action-icon{padding:0;width:40px;min-width:40px}
html body .word-detail .entry-action-icon svg{width:16px;height:16px;flex:0 0 16px}
/* Cards have a balanced outline on every side, never a heavier left stripe. */
html body a.exact-result.best-match,html body .collection-app .entry-missing,
html body .search-none,html body .search-relaxed,html body .dictionary-context-notice,
html body .connection-query-note,html body .study-incoming,html body .sentence-construction{
 border:1px solid color-mix(in srgb,var(--accent) 45%,var(--rule));border-radius:8px}
html body .understand,html body .notice,html body .examples blockquote{border:1px solid var(--rule);border-radius:8px}

html body .result-word:has([aria-current=true]){box-shadow:inset 0 0 0 1px var(--accent);border-radius:6px}

/* Large displays retain the search trail alongside the opened definition. */
@media(min-width:1400px){
 html body .collection-app[data-layout=split][data-results-beside-entry].searching.show-selection .collection-dictionary{display:grid;grid-template-columns:minmax(240px,.85fr) minmax(360px,1.15fr);gap:0;align-items:stretch}
 html body .collection-app[data-layout=split][data-results-beside-entry].searching.show-selection .collection-overview{display:flex!important;min-height:0;max-height:none;border:0;border-right:1px solid var(--rule);padding:0 10px 0 0}
 html body .collection-app[data-layout=split][data-results-beside-entry].searching.show-selection .collection-inspector{display:block;min-width:0;padding:0 10px 16px 14px}
 html body .collection-app[data-results-beside-entry].searching.show-selection .collection-tabs{display:none!important}
 html body .collection-app[data-results-beside-entry].searching.show-selection .collection-history{display:none}
 html body .collection-app[data-results-beside-entry].searching.show-selection #collection-search-results{display:block!important;max-height:none;min-height:0}
}
html body #collection-search-results a[data-map-preview]{outline:1px solid var(--accent);outline-offset:-1px;border-radius:6px;background:color-mix(in srgb,var(--accent) 5%,var(--white))}
html body #collection-search-results a[aria-current=true]{box-shadow:inset 0 0 0 1px var(--accent);border-radius:6px;background:var(--tint)}
html body .map-result-preview{display:inline-flex;align-items:center;align-self:center;font:500 10px/18px var(--sans);padding:1px 6px;border:1px solid var(--rule);border-radius:4px;color:var(--muted);white-space:nowrap}
html body .map-result-preview[hidden]{display:none}

@media(min-width:1400px){
 html body .collection-app[data-results-beside-entry].searching.show-selection #collection-search-results a.best-match{padding:10px 12px;margin:8px 0 12px;gap:3px 8px}
 html body .collection-app[data-results-beside-entry].searching.show-selection .best-match .exact-glyph{font-size:32px;line-height:1.25}
 html body .collection-app[data-results-beside-entry].searching.show-selection .best-match .best-match-gloss{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;font-size:14px;line-height:1.5}
 html body .collection-app[data-results-beside-entry].searching.show-selection .best-match .best-match-why{font-size:11px}
}

@media(min-width:1400px){
 html body .collection-app[data-results-beside-entry] .entry-actions{gap:6px}
 html body .collection-app[data-results-beside-entry] .entry-actions .entry-action{padding-inline:9px;font-size:12px}
 html body .collection-app[data-results-beside-entry] .entry-actions [data-copy-entry],html body .collection-app[data-results-beside-entry] .entry-actions .entry-action-icon{padding:0;width:36px;min-width:36px;justify-content:center}
 html body .collection-app[data-results-beside-entry] .entry-actions [data-copy-entry]>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
}

@media(min-width:851px){html:not([data-focus-mode]) body .collection-app{height:var(--workspace-height,max(520px,calc(100dvh - var(--workspace-top,160px) - 12px)))}}

/* Contained card interactions: full outlines, no paint leaking into card gutters. */
html body .word-detail .lexical-characters>div{padding:8px 10px;border:1px solid transparent;border-radius:6px;min-height:48px;transition:background-color .15s ease,border-color .15s ease}
html body .word-detail .lexical-characters>div+div{margin-top:3px}
html body .word-detail .lexical-characters dt>a::after{border-radius:6px}
html body .word-detail .lexical-characters dt>a:focus-visible{outline:none}
html body .word-detail .entry-research>summary{border-radius:7px;transition:background-color .15s ease}
html body .word-detail .entry-research[open]>summary{border-radius:7px 7px 0 0}
html body .word-detail .entry-research>summary:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
@media (hover:hover){
 html body .word-detail .lexical-characters>div:has(dt>a:hover){background:var(--hv-tint);border-color:var(--hv-border);box-shadow:none}
 html body .word-detail .entry-research:has(>summary:hover){border-color:var(--hv-border)}
 html body .word-detail .entry-research>summary:hover{background:var(--hv-tint);box-shadow:none}
}
html body .word-detail .lexical-characters>div:has(dt>a:focus-visible){background:var(--hv-tint);border-color:var(--accent);box-shadow:none;outline:2px solid var(--accent);outline-offset:-2px}
@media (hover:none){html body .word-detail .lexical-characters>div:has(dt>a:active){background:var(--hv-tint);border-color:var(--hv-border)}}
@media (prefers-reduced-motion:reduce){html body .word-detail :is(.lexical-characters>div,.entry-research>summary){transition:none}}
/* A calm, screen-space grid: identical geometry, individually balanced theme colours. */
html .character-field{--map-dot:#b5bfb8}
html[data-theme=dark] .character-field{--map-dot:#536159}

/* Optional source layers keep their own provenance and stay out of the primary sense list. */
html body .word-detail .source-layers{padding:0;margin:12px 0;border:1px solid var(--rule);border-radius:8px;background:var(--white)}
html body .source-layers>summary{padding:11px 14px;min-height:44px;border-radius:7px;font:500 13px/20px var(--sans);cursor:pointer}
html body .source-layers>summary>span{font-size:11px;color:var(--muted);margin-left:6px}
html body .source-layers[open]>summary{border-radius:7px 7px 0 0}
html body .source-layers>summary:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
html body .source-layers-body{padding:0 14px 12px;overflow-wrap:anywhere}
html body .source-layer{padding-top:12px;border-top:1px solid var(--rule)}
html body .source-layer+.source-layer{margin-top:14px}
html body .source-layer h3{margin:0 0 8px;font:600 14px/1.5 var(--sans)}
html body .source-layer h3 small{display:block;font:400 11px/1.5 var(--sans);color:var(--muted)}
html body .source-layer h4{margin:12px 0 4px;font:600 12px/1.5 var(--sans)}
html body .source-layer ol{margin:0;padding-left:20px;font-size:14px;line-height:1.6}
html body .source-layer li+li{margin-top:6px}
html body .source-layer-readings{font-size:16px;color:var(--accent);line-height:1.7;margin:0 0 6px}
html body .source-layer-credit{font-size:11px;line-height:1.7;margin:8px 0 0}
@media (hover:hover){html body .source-layers:has(>summary:hover){border-color:var(--hv-border)}html body .source-layers>summary:hover{background:var(--hv-tint);box-shadow:none}}

/* Compact dictionary senses: keep definitions primary, source labels inline. */
html body .dictionary-character .catalog-record-grid{align-items:start;gap:10px}
html body .dictionary-character .detail-card-heading{padding:10px 12px;gap:8px}
html body .dictionary-character .detail-card-heading h2{font-size:13px;line-height:1.4;margin:0}
html body .dictionary-character .detail-card-heading>span{font-size:10px;color:var(--muted)}
html body .dictionary-character .detail-card-body{padding:10px 12px;font-size:.875rem;line-height:1.5}
html body .dictionary-character .detail-card-body>p{margin:0 0 8px}
html body .dictionary-character .detail-card-body>p:last-child{margin-bottom:0}
html body .dictionary-character .context-sense{padding:8px 0}
html body .dictionary-character .context-sense:first-child{padding-top:0}
html body .dictionary-character .context-sense:last-child{padding-bottom:0;border-bottom:0}
html body .dictionary-character .context-sense>a{font-size:12px;line-height:1.5}
html body .dictionary-character .context-sense>.pack-senses{margin-top:6px}
html body :is(.dictionary-character,.word-detail) .pack-senses{padding-inline-start:22px;margin-bottom:0}
html body :is(.dictionary-character,.word-detail) .pack-senses>.pack-sense{padding:6px 0 7px 3px;margin:0;line-height:1.5}
html body :is(.dictionary-character,.word-detail) .pack-senses>.pack-sense:first-child{padding-top:0}
html body :is(.dictionary-character,.word-detail) .pack-senses>.pack-sense:last-child{padding-bottom:0}
html body :is(.dictionary-character,.word-detail) .pack-meaning{display:inline;font:400 1.125rem/1.5 var(--sans);margin:0}
html body :is(.dictionary-character,.word-detail) .pack-labels{display:inline-flex;vertical-align:baseline;gap:4px;margin:0 0 0 7px}
html body :is(.dictionary-character,.word-detail) .pack-labels>span{padding:0 4px;font-size:10px;line-height:1.5}
html body :is(.dictionary-character,.word-detail) .pack-examples{margin-top:3px}
html body :is(.dictionary-character,.word-detail) .pack-examples>summary{font-size:12px;line-height:1.5;min-height:30px;padding:5px 0}
html body :is(.dictionary-character,.word-detail) .pack-examples>ul>li{padding:7px 0}
html body :is(.dictionary-character,.word-detail) .pack-examples li>p{font-size:.875rem;line-height:1.5}
html body :is(.dictionary-character,.word-detail) .pack-example-form{font-size:20px;line-height:1.4}
html body :is(.dictionary-character,.word-detail) .pack-example-alternate{font-size:17px}
html body .word-detail .entry-senses{margin-block:8px 0}
html body .word-detail .entry-senses>li{margin-block:3px;padding-block:2px;line-height:1.5}
@media(pointer:coarse){html body :is(.dictionary-character,.word-detail) .pack-examples>summary{min-height:44px;display:flex;align-items:center}}

/* Entry layout follows its panel, including resizable desktop split views. */
html body .word-detail{container-type:inline-size;container-name:dictionary-entry;min-width:0}
html body .word-identity.entry-focus{grid-template-columns:minmax(0,1fr);align-items:start;gap:8px 20px}
html body .word-identity.entry-focus>div:first-child{min-width:0}
html body .word-identity.entry-focus>.reading{grid-column:1;min-width:0;padding-bottom:0;line-height:1.5}
html body .word-identity :is(h1,h2):not(.sr-only){display:block;max-width:100%;word-break:normal;overflow-wrap:anywhere;line-break:strict;text-wrap:pretty}
html body .word-identity .word-script-alternate{display:block;margin:4px 0 0;font-size:16px;line-height:1.5;overflow-wrap:anywhere}
html body .word-detail :is(.reading,.section-tag,.entry-senses,.pack-meaning,.card-caption,.entry-provenance){word-break:normal;overflow-wrap:anywhere;white-space:normal}
html body .word-detail :is(.reading [lang$="-Latn"],.canto-jp,.canto-py){white-space:normal;word-break:normal;overflow-wrap:anywhere}
html body .word-detail :is(.detail-card,.detail-card-body,.canto-document,.entry-reading,.entry-reading>.reading>*,.lexical-characters dd){min-width:0;max-width:100%}
html body .word-detail .entry-actions{flex-wrap:wrap;gap:6px}
html body .word-detail .entry-action{flex-shrink:0}
html body .word-detail .tone-ribbon{display:flex;flex-wrap:wrap;gap:8px}
html body .word-detail .tone-syllable{flex:0 1 84px;min-width:64px}
html body .word-detail .canto-toneset{overflow-x:auto;max-width:100%}
@container dictionary-entry (min-width:640px){
 html body .word-identity.entry-focus{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:end}
 html body .word-identity.entry-focus>.reading{grid-column:2;padding-bottom:3px}
}
@container dictionary-entry (max-width:420px){
 html body .word-identity.entry-focus{padding:12px}
 html body .word-identity :is(h1,h2):not(.sr-only){font-size:32px}
 html body .word-identity .reading{font-size:18px}
 html body .word-detail-grid,.canto-char-lead{grid-template-columns:minmax(0,1fr)}
}

html[data-reading-size=large] body :is(.dictionary-character,.word-detail) .pack-meaning{font-size:1.25rem}
html body .word-identity.entry-focus>.entry-senses-note{grid-column:1/-1;margin:0;font-size:13px;line-height:1.5;color:var(--muted)}
html body .entry-senses-note>summary{cursor:pointer;min-height:32px;display:list-item;padding-block:6px}
html body .entry-senses-note>p{font-size:13px;line-height:1.5;margin:4px 0 0;color:var(--muted)}
@media(pointer:coarse){html body .entry-senses-note>summary{min-height:44px;padding-block:12px}}

html body .entry-source-switch{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:12px 0;border-top:1px solid var(--rule);margin-top:12px;font-size:13px}
html body .entry-source-switch>span{font-weight:600;flex-basis:100%}
html body .entry-source-switch>a{display:inline-flex;align-items:center;min-height:36px;padding:6px 10px;border:1px solid var(--rule);border-radius:6px;background:var(--white);color:var(--accent)}
html body .entry-source-switch>small{flex-basis:100%;color:var(--muted);font-size:12px}
@media(pointer:coarse){html body .entry-source-switch>a{min-height:44px}}

/* Layout selection belongs to the existing lookup row, not a separate content toolbar. */
html body .global-search-bar.has-inline-layout{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:4px 12px}
html body .global-search-bar.has-inline-layout>.global-search-inner{grid-column:1/-1;grid-row:1;min-width:0;width:100%}
html body .global-search-bar.has-inline-layout>.lookup-line{grid-column:1;grid-row:2;order:initial;min-width:0;margin:0}
html body .global-search-bar.has-inline-layout>.lookup-line>summary{min-height:34px;max-width:100%;padding-block:3px;box-sizing:border-box}
html body .global-search-bar.has-inline-layout .lookup-chip-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
html body .global-search-bar.has-inline-layout>.workspace-layout-inline{grid-column:2;grid-row:2;align-self:start;display:flex;min-width:0}
html body .workspace-layout-segments{display:flex;align-items:center;gap:2px;padding:2px;border:1px solid var(--rule);border-radius:7px;background:color-mix(in srgb,var(--ink) 3%,transparent)}
html body .workspace-layout-segments>button{min-height:28px;padding:3px 9px;border:0;border-radius:4px;white-space:nowrap;background:transparent;color:var(--muted);font:500 12px/20px var(--sans)}
html body .workspace-layout-segments>button[aria-pressed=true]{background:var(--white);color:var(--ink);box-shadow:0 1px 2px #00000010,inset 0 0 0 1px var(--rule)}
html body .workspace-layout-segments>button:hover{color:var(--ink)}
html body .workspace-layout-select{display:none;max-width:136px;min-height:44px;padding:0 26px 0 9px;border:1px solid var(--rule);border-radius:7px;background-color:var(--white);color:var(--ink);font:500 12px/1.4 var(--sans)}
html body .workspace-layout-inline :is(button,select):focus-visible{outline:2px solid var(--accent);outline-offset:2px}
html body:has(#collection-app) .collection-app.has-inline-layout>.workspace-heading{height:0;min-height:0;margin:0;padding:0;overflow:visible;pointer-events:none}
html body:has(#collection-app) .collection-app.has-inline-layout{grid-template-rows:0 minmax(0,1fr)}
html body .global-search-bar.has-inline-layout>.lookup-line[open]{grid-column:1/-1}
html body .global-search-bar.has-inline-layout>.lookup-line[open]>summary{max-width:calc(100% - 290px)}
html body .global-search-bar.has-inline-layout>.workspace-layout-inline{z-index:1}
@media(max-width:850px){
 html body .workspace-layout-segments{display:none}
 html body .workspace-layout-select{display:block}
 html body .global-search-bar.has-inline-layout{column-gap:8px}
 html body .global-search-bar.has-inline-layout>.lookup-line>summary{min-height:44px;gap:5px}
 html body .global-search-bar.has-inline-layout>.lookup-line[open]>summary{max-width:calc(100% - 144px)}
 html body .global-search-bar.has-inline-layout .lookup-chip-label{display:none}
 html body:has(#collection-app) .collection-app.has-inline-layout{grid-template-rows:0 minmax(140px,var(--dict-share)) 12px minmax(190px,1fr)}
 html body:has(#collection-app) .collection-app.has-inline-layout:is([data-layout=dictionary],[data-layout=visual]){grid-template-rows:0 minmax(0,1fr)}
 html body:has(#collection-app) .collection-app.has-inline-layout[data-layout=split][data-browse=field]{grid-template-rows:0 auto 0 auto}
}
@media(pointer:coarse){html body .workspace-layout-segments>button{min-height:40px}}
html[data-focus-mode][data-focus-peek] body .global-search-bar.has-inline-layout>.workspace-layout-inline{display:none}

html body:has(#collection-app) .collection-app.has-inline-layout>.workspace-heading>:not(:first-child){display:none}
html body:has(#collection-app) .collection-app.has-inline-layout>.workspace-heading>div:first-child{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

html body:has(#collection-app) main.main{padding-top:6px}
html body .global-search-bar.has-inline-layout .lookup-chip-value{flex:1 1 auto;width:auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
@media(max-width:850px){
 html body .global-search-bar.has-inline-layout .lookup-chip-caption{display:none}
 html body:has(#collection-app) .workspace-layout-inline .workspace-layout-select{box-sizing:border-box;width:136px;max-width:136px;min-width:0;height:44px;min-height:44px;padding:0 28px 0 10px;font-size:14px}
}

/* No view-selection row: display controls in the header, lookup beside search. */
html body .workspace-layout-inline.in-header{display:flex;position:relative;flex:none}
html body .global-search-bar.has-inline-layout{grid-template-columns:minmax(0,1fr) auto;position:sticky;top:0;z-index:50;align-items:center}
html body .global-search-bar.has-inline-layout>.global-search-inner{grid-column:1;grid-row:1}
html body .global-search-bar.has-inline-layout>.lookup-line,
html body .global-search-bar.has-inline-layout>.lookup-line[open]{grid-column:2;grid-row:1;align-self:center}
html body .global-search-bar.has-inline-layout>.lookup-line>summary,
html body .global-search-bar.has-inline-layout>.lookup-line[open]>summary{max-width:220px;min-height:44px;padding:0 10px;border:1px solid var(--rule);border-radius:7px;background:var(--white)}
html body .global-search-bar.has-inline-layout .lookup-chip-caption{display:none}
html body .global-search-bar.has-inline-layout>.lookup-line[open]>.lookup-line-body{position:absolute;top:100%;right:12px;left:12px;z-index:30;margin:4px 0;padding:12px;background:var(--white);box-shadow:0 6px 20px #00000018}
@media(max-width:1100px){
 html body .workspace-layout-inline.in-header .workspace-layout-segments{display:none}
 html body .workspace-layout-inline.in-header .workspace-layout-select{display:block;width:120px;height:34px;min-height:34px;font-size:12px}
}
@media(max-width:850px){
 html body .workspace-layout-inline.in-header .workspace-layout-select{width:44px;max-width:44px;height:44px;min-height:44px;padding:0;color:transparent;appearance:none;cursor:pointer}
 html body .workspace-layout-inline.in-header::before{content:'◫';position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;color:var(--ink);font:24px/1 var(--sans)}
 html body .workspace-layout-inline.in-header .workspace-layout-select option{color:var(--ink);background:var(--white)}
 html body .site-header .focus-mode-word{display:none}
 html body .global-search-bar.has-inline-layout{column-gap:6px}
 html body .global-search-bar.has-inline-layout>.lookup-line>summary{width:44px;max-width:44px;height:44px;padding:0;justify-content:center}
 html body .global-search-bar.has-inline-layout>.lookup-line>summary::before{content:'文';font:20px/1 var(--sans);color:var(--ink)}
 html body .global-search-bar.has-inline-layout>.lookup-line>summary::after,
 html body .global-search-bar.has-inline-layout .lookup-chip-value{display:none}
}

@media(max-width:850px){
 html body:has(#collection-app) .workspace-layout-inline.in-header .workspace-layout-select{width:44px;max-width:44px;min-width:44px;padding:0;background-image:none}
}
/* Secondary language evidence: compact, explicit, and independent of reading preferences. */
html body .cross-language-results{margin:0 0 12px;border:1px solid var(--rule);border-radius:8px;background:var(--white);overflow:hidden}
html body .cross-language-results>summary{display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px;cursor:pointer;font:500 13px/1.4 var(--sans);color:var(--ink);list-style:none;box-sizing:border-box}
html body .cross-language-results>summary::before{content:'›';font-size:20px;line-height:1;transform-origin:center}
html body .cross-language-results[open]>summary::before{transform:rotate(90deg)}
html body .cross-language-results>summary>span{margin-left:auto;color:var(--muted);font-size:12px}
html body .cross-language-results>summary:hover{background:color-mix(in srgb,var(--accent) 5%,var(--white))}
html body .cross-language-body{padding:0 10px 10px}
html body .cross-language-note{margin:0 2px 10px;font-size:12px;line-height:1.45;color:var(--muted)}
html body .cross-language-card{border:1px solid var(--rule);border-radius:6px;padding:10px;margin:6px 0 0;min-width:0}
html body .cross-language-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
html body .cross-language-form{font-size:24px;line-height:1.3;overflow-wrap:anywhere}
html body .cross-language-alternate{font-size:17px;color:var(--muted)}
html body .cross-language-reading{font-size:14px;color:var(--accent)}
html body .cross-language-reading small{font-size:11px;color:var(--muted);margin-right:4px}
html body .cross-language-gloss{font-size:14px;line-height:1.5;margin:6px 0;overflow-wrap:anywhere}
html body .cross-language-links{display:flex;flex-wrap:wrap;gap:4px 12px}
html body .cross-language-links a{display:inline-flex;align-items:center;min-height:32px;font-size:12px;line-height:1.4;color:var(--accent)}
html body .cross-language-results :is(summary,a):focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:4px}
@media(pointer:coarse){html body .cross-language-links a{min-height:44px}}

/* Clip the panel paint without introducing a nested scrolling box on phones. */
html body .collection-app .collection-dictionary{overflow:clip}
html body .collection-app .collection-overview{border-start-start-radius:13px;border-start-end-radius:13px}
html body .collection-app .collection-tabs{border-start-start-radius:13px;border-start-end-radius:13px}
@media(max-width:600px){html body .collection-app[data-layout=split][data-browse=field] .collection-dictionary{overflow:clip}}
/* The compact view chooser uses the same visual size and stroke as adjacent tools. */
html body .workspace-layout-trigger{display:none;box-sizing:border-box;align-items:center;justify-content:center;width:34px;height:34px;min-height:34px;padding:0;border:1px solid var(--rule);border-radius:6px;background:transparent;color:var(--ink);cursor:pointer}
html body .workspace-layout-inline.in-header::before{content:none}
html body .workspace-layout-menu{position:absolute;right:0;top:calc(100% + 7px);z-index:80;min-width:174px;padding:5px;border:1px solid var(--rule);border-radius:8px;background:var(--white);box-shadow:0 5px 18px #00000024}
html body .workspace-layout-menu[hidden]{display:none}
html body .workspace-layout-menu>button{display:flex;align-items:center;width:100%;min-height:44px;padding:8px 12px;border:1px solid transparent;border-radius:5px;background:transparent;color:var(--ink);font:500 14px/20px var(--sans);text-align:left;cursor:pointer}
html body .workspace-layout-menu>button[aria-pressed=true]{border-color:var(--rule);background:var(--tint);color:var(--accent)}
html body .workspace-layout-menu>button[aria-pressed=true]::after{content:'✓';margin-left:auto;padding-left:16px}
@media(hover:hover){html body .workspace-layout-menu>button:hover,html body .workspace-layout-trigger:hover{background:var(--subtle);border-color:var(--muted)}}
@media(max-width:1100px){html body .workspace-layout-trigger{display:flex}html body .site-header{position:relative;z-index:60}html body .workspace-layout-inline.in-header{align-items:center}}
@media(pointer:coarse){html body .workspace-layout-trigger::after{content:'';position:absolute;inset:-5px}}

html body .search-spelling{padding:10px 12px;margin:8px 0;border:1px solid var(--rule);border-radius:8px;background:var(--white);font-size:14px;line-height:1.6}
html body .search-spelling button{min-height:44px;margin:2px;padding:6px 10px;border:1px solid var(--rule);border-radius:6px;background:var(--subtle);color:var(--accent);font:inherit;cursor:pointer}
html body .search-spelling small{display:block;font-size:11px;color:var(--muted)}

/* One quiet status line; interaction guidance and source detail live in the ⋯ panel. */
html body .character-field .field-notes .field-caption{padding-top:10px;margin-top:4px}
html body .character-field .field-notes .field-help{display:block;margin-top:8px;color:var(--muted);font-size:12px}

/* Compact character references: one aligned row, with a 44px minimum target. */
html body .word-detail .detail-card:has(.lexical-characters) .detail-card-heading{padding:10px 12px}
html body .word-detail .detail-card:has(.lexical-characters) .detail-card-heading h2{margin:0;font-size:15px;line-height:1.4}
html body .word-detail .detail-card-body:has(>.lexical-characters){padding:4px 8px 8px}
html body .word-detail .lexical-characters>div{box-sizing:border-box;min-height:44px;padding:4px 6px;gap:10px;align-items:center}
html body .word-detail .lexical-characters>div+div{margin-top:0}
html body .word-detail .lexical-characters dt{flex:0 0 30px;min-width:30px;font-size:26px;line-height:1.25}
html body .word-detail .lexical-characters dt [lang]{font-size:26px;line-height:1.25}
html body .word-detail .lexical-characters dd{font-size:14px;line-height:1.4}
html body .word-detail .lexical-characters+small{display:block;padding:4px 6px 0;font-size:11px;line-height:1.4;color:var(--muted)}
html body :is(#connection-rules,#connection-intelligence){max-width:880px;margin:32px auto;padding-inline:16px;line-height:1.7}
html body :is(#connection-rules,#connection-intelligence) h2{font-size:24px;line-height:1.3}
/* Static document-height gradient; no fixed layer or scroll handler. */
html{--document-top:#fefdfb;--document-bottom:#f8f7f4;min-height:100%;background-color:var(--document-top)}
html[data-theme=dark]{--document-top:#151917;--document-bottom:#1a1f1c}
@media(prefers-color-scheme:dark){html:not([data-theme=light]):not([data-theme=dark]){--document-top:#151917;--document-bottom:#1a1f1c}}
html body{min-height:100vh;min-height:100svh;background-color:var(--document-top);background-image:linear-gradient(180deg,var(--document-top) 0%,var(--document-bottom) 100%);background-size:100% 100%;background-repeat:no-repeat;background-attachment:scroll}
html body .site-footer{background:var(--document-bottom)}

/* Back navigation shares the entry's source-label line instead of reserving a row. */
html body .collection-app .collection-inspector:has(.word-detail){position:relative;inset:auto}
html body .collection-app .collection-inspector:has(.word-detail)>.collection-inspector-bar{position:absolute;top:10px;right:16px;left:auto;width:auto;min-height:0;margin:0;padding:0;background:transparent;z-index:4}
html body .collection-app .collection-inspector:has(.word-detail) .collection-inspector-bar [data-close-inspector]{box-sizing:border-box;min-height:36px;padding:4px 8px;border:1px solid var(--rule);border-radius:6px;background:var(--white);font-size:12px;line-height:20px}
html body .collection-inspector .word-detail .word-identity>div:first-child>.section-tag{display:block;padding-right:100px;min-height:30px}
@media(pointer:coarse){html body .collection-app .collection-inspector:has(.word-detail) .collection-inspector-bar [data-close-inspector]{min-height:44px}html body .collection-inspector .word-detail .word-identity>div:first-child>.section-tag{min-height:38px}}

html body .browse-index-link{grid-template-columns:minmax(0,1fr) 20px;grid-template-areas:"title arrow" "description arrow";gap:3px 12px;padding:10px 12px;border-radius:8px;text-align:left;align-items:center}
html body .browse-index-link>span{grid-area:title;line-height:1.4;margin:0}
html body .browse-index-link>small{grid-area:description;line-height:1.4;margin:0}
html body .browse-index-link>b{grid-area:arrow;justify-self:center;align-self:center;line-height:1}
html body .global-search-bar.has-inline-layout{column-gap:8px}
html body .global-search-bar.has-inline-layout>.lookup-line>summary,html body .global-search-bar.has-inline-layout>.lookup-line[open]>summary{box-sizing:border-box;height:52px;min-height:52px;border-radius:9px;padding:0 12px;border:1px solid var(--rule);background:var(--white)}
@media(max-width:850px){html body .global-search-bar.has-inline-layout{column-gap:6px}html body .global-search-bar.has-inline-layout>.lookup-line>summary,html body .global-search-bar.has-inline-layout>.lookup-line[open]>summary{width:52px;max-width:52px;padding:0}html body .site-header .focus-mode-word{display:none}}
html body .global-search-bar .search-form .random-label{display:none!important}
html body .global-search-bar .search-form>.random-button{flex:0 0 36px;width:36px;min-width:36px;overflow:hidden}
html body .global-search-bar .search-form>kbd{display:none}
html body .global-search-bar.has-inline-layout>.search-recents{grid-column:1/-1}
@media(pointer:coarse){html body .workspace-layout-trigger{height:40px;min-height:40px}html body .workspace-layout-trigger::after{inset:-2px -5px}}

/* Compact footer: useful destinations, quiet provenance, comfortable touch targets. */
html body .site-footer{padding-top:24px;padding-bottom:18px;background:var(--document-bottom)}
html body .footer-main{grid-template-columns:minmax(180px,1fr) minmax(0,2fr);grid-template-areas:"brand links" "legal legal";gap:0 40px}
html body .footer-brand p{max-width:25ch;font-size:12px;line-height:1.5;margin-top:6px}
html body .footer-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 32px}
html body .footer-group-title{margin-bottom:4px;letter-spacing:.06em;font-size:10px;line-height:20px}
html body .footer-group ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
html body .footer-group a{min-height:32px;font-size:13px;line-height:1.4;white-space:normal;text-underline-offset:3px;border-radius:3px}
html body .footer-group a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
html body .footer-legal{margin-top:20px;padding-top:12px;gap:4px 20px;font-size:11px;line-height:1.6}
@media (hover:hover){html body .footer-group a:hover{text-decoration:underline;text-decoration-thickness:1px}}
@media (max-width:1100px){html body .footer-group ul{grid-template-columns:minmax(0,1fr)}}
@media (max-width:700px){
 html body .site-footer{padding-top:20px;padding-bottom:16px}
 html body .footer-main{grid-template-columns:minmax(0,1fr);grid-template-areas:"brand" "links" "legal";gap:16px}
 html body .footer-brand{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
 html body .footer-brand p{margin:0;max-width:none}
 html body .footer-brand p .footer-tagline-line{display:inline}
 html body .footer-links{gap:16px}
 html body .footer-group a{min-height:44px;font-size:13px}
 html body .footer-main>.footer-legal{margin-top:0;padding-top:12px;gap:3px}
}
@media (pointer:coarse){html body .footer-group a{min-height:44px}}
@media (max-width:300px){html body .footer-links{grid-template-columns:minmax(0,1fr)}}

/* Recents are a quiet shortcut strip, subordinate to the search field. */
html body #search-recents.search-recents{flex-wrap:nowrap;gap:5px;margin-top:3px;min-width:0;overflow-x:auto;scrollbar-width:thin;align-items:center}
html body #search-recents.search-recents>span:first-child{flex:none;font-size:10px;letter-spacing:.06em;margin-right:2px;line-height:24px}
html body #search-recents.search-recents>button{flex:0 0 auto;min-height:24px;max-width:24ch;padding:2px 7px;border-radius:5px;font-size:12px;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #search-recents.search-recents>[data-clear-recents]{margin-left:3px;padding-inline:6px;font-size:11px}
@media (pointer:coarse){
 html body #search-recents.search-recents{gap:6px;margin-top:2px}
 html body #search-recents.search-recents>button{min-height:32px;padding-block:5px}
}

/* Dictionary inspector: one outer gutter and one shared card inset. */
html body .collection-app .collection-inspector:has(.word-detail){--entry-inset:16px;padding:12px!important;scroll-padding-top:12px}
html body .collection-app .collection-inspector:has(.word-detail)>.collection-inspector-bar{top:24px;right:28px}
html body .collection-app .collection-inspector:has(.word-detail) .collection-inspector-bar [data-close-inspector]{display:inline-flex;align-items:center;justify-content:center;min-height:32px;margin:0;padding:4px 10px;line-height:20px;white-space:nowrap;background:var(--surface);color:var(--muted);border-radius:7px}
html body .collection-inspector .word-detail .word-identity.entry-focus{padding:12px var(--entry-inset) 14px;column-gap:16px;row-gap:6px}
html body .collection-inspector .word-detail .word-identity>div:first-child>.section-tag{padding-right:88px;min-height:32px;margin:0 0 8px;display:flex;align-items:center;line-height:1.4}
html body .collection-inspector .word-detail .detail-card-heading{padding:10px var(--entry-inset)}
html body .collection-inspector .word-detail .detail-card-body{padding:10px var(--entry-inset) 12px}
html body .collection-inspector .word-detail .entry-research .detail-card-heading{padding:0 0 8px}
html body .collection-inspector .word-detail .entry-research .detail-card-body{padding:0}
html body .collection-inspector .word-detail .entry-actions{gap:6px;margin-top:8px;padding-top:10px}
html body .collection-inspector .word-detail>.entry-provenance{padding-inline:var(--entry-inset)}
@media(hover:hover){html body .collection-app .collection-inspector:has(.word-detail) .collection-inspector-bar [data-close-inspector]:hover{color:var(--accent);border-color:var(--accent);background:var(--tint)}}
html body .collection-app .collection-inspector:has(.word-detail) .collection-inspector-bar [data-close-inspector]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:640px){html body .collection-app .collection-inspector:has(.word-detail){--entry-inset:12px;padding:8px!important}html body .collection-app .collection-inspector:has(.word-detail)>.collection-inspector-bar{top:20px;right:20px}}
@media(pointer:coarse){html body .collection-app .collection-inspector:has(.word-detail) .collection-inspector-bar [data-close-inspector]{min-height:44px}html body .collection-inspector .word-detail .word-identity>div:first-child>.section-tag{min-height:44px}}