/* Dictionary: home, results, word and kanji pages. Colours come from tokens.css. */
.dict{
 --dict-card:var(--color-surface);--dict-line:var(--color-rule);--dict-soft:var(--color-accent-soft);
 --dict-l1:color-mix(in oklch,oklch(94% 0.06 160),oklch(31% 0.06 160) var(--dark-mix));--dict-l1-ink:color-mix(in oklch,oklch(36% 0.09 160),oklch(84% 0.1 160) var(--dark-mix));
 --dict-l2:color-mix(in oklch,oklch(95% 0.035 230),oklch(30% 0.045 230) var(--dark-mix));--dict-l2-ink:color-mix(in oklch,oklch(40% 0.09 240),oklch(84% 0.08 240) var(--dark-mix));
 --dict-l3:var(--color-study-yellow);--dict-l3-ink:color-mix(in oklch,oklch(42% 0.08 70),oklch(85% 0.09 80) var(--dark-mix));
 --dict-l4:var(--color-paper);--dict-l4-ink:var(--color-muted);
 display:grid;gap:20px;min-width:0
}
.dict [lang=ja]{font-family:var(--font-japanese)}
.dict ruby{ruby-position:over}
.dict rt{font-size:.42em;color:var(--color-muted);font-weight:400;letter-spacing:0}
/* Furigana on running text and small labels needs a larger share of the
   base size to stay readable; large single kanji keep the smaller ratio. */
.ds-ja rt,.dict-today-example rt,.ds-words rt,.de-refs rt,.de-conj rt,.de-forms rt,.dict-crumbs rt,.dr-head rt,.dict-examples rt,.dict-hint rt,.dk-primary-reading rt,.dk-tile-read rt,.de-related rt{font-size:.58em}
.ds-ja,.dict-today-example p{line-height:2.05}
.dk-big rt{font-size:.28em}
.dk-big ruby,.dk-tile-char ruby,.de-kanji-char ruby{line-height:1}
.dk-primary-reading{margin:10px 0 0;font-size:14px}
.dk-primary-reading>span:first-child{font-size:12px;color:var(--color-muted)}
.dk-primary-reading b{font-size:22px;color:var(--color-accent)}
.dk-primary-reading small{font-size:11px;color:var(--color-muted)}
.dk-primary{color:var(--color-accent)!important;font-weight:600}
.dk-reading-list{display:flex;flex-wrap:wrap;gap:4px 14px}
.dk-reading-list .is-primary{color:var(--color-accent);font-weight:600}
.dk-reading-list .is-rare{color:var(--color-muted);opacity:.6;font-size:.8em;align-self:flex-end}
.dict h2{font-size:19px;letter-spacing:-.01em}
.dict h3{font-size:14px}
.dict-eyebrow{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--color-accent)}
.dict-hint{font-size:12px;color:var(--color-muted);line-height:1.6}
.dict-count{display:inline-flex;align-items:center;padding:1px 8px;border-radius:99px;background:var(--color-paper-2);font-size:12px;font-weight:500;color:var(--color-muted);font-variant-numeric:tabular-nums;letter-spacing:0}
.dict-empty{padding:24px;background:var(--color-paper-2);border-radius:var(--radius-control);text-align:center;color:var(--color-muted)}
.dict-link-arrow{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--color-accent);text-decoration:none;min-height:32px}
.dict-link-arrow svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.dict-link-arrow:hover{text-decoration:underline}

/* Badges */
.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:500;line-height:1.6;white-space:nowrap;background:var(--color-paper-2);color:var(--color-muted);border:0}
.badge.level-1{background:var(--dict-l1);color:var(--dict-l1-ink)}
.badge.level-2{background:var(--dict-l2);color:var(--dict-l2-ink)}
.badge.level-3{background:var(--dict-l3);color:var(--dict-l3-ink)}
.badge.level-4{background:var(--color-paper-2);color:var(--dict-l4-ink)}
.badge.class-badge{background:var(--color-paper-2);color:var(--color-ink)}
.badge.infl{background:var(--dict-soft);color:var(--color-accent);white-space:normal}
.badge.auto{background:var(--color-study-coral);color:color-mix(in oklch,oklch(42% 0.09 32),oklch(80% 0.1 40) var(--dark-mix));cursor:help}
.badge.editorial{background:var(--color-violet-paper);color:var(--color-violet-ink);cursor:help}
.badge.verified{background:var(--dict-l1);color:var(--dict-l1-ink);cursor:help}
.badge[title]{cursor:help}
.dw-badges{display:flex;flex-wrap:wrap;gap:6px;align-items:center}

/* Hero and search */
.dict-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:28px;align-items:stretch;padding:32px;border-radius:24px;background:linear-gradient(135deg,var(--dict-soft),var(--color-violet-paper))}
.dict-hero-main{display:flex;flex-direction:column;gap:12px;justify-content:center;min-width:0}
.dict-hero h1{font-size:40px;line-height:1.1;letter-spacing:-.035em}
.dict-hero .dictionary-search-form{margin-top:6px}
.dict-hero .dictionary-search-field{min-height:58px;border-radius:16px;box-shadow:0 1px 2px oklch(0% 0 0 / .04)}

/* Sticky quick search on every page after the home page: it sticks under
   the header, and anchors land below both. */
:root:has(.dict-quick){scroll-padding-top:calc(var(--sticky-top) + var(--dict-quick-height) + 12px)}
:root{--dict-quick-height:132px}
@media(max-width:767px){:root{--dict-quick-height:118px}}
.dict-quick{position:sticky;top:var(--sticky-top);z-index:6;margin:-6px 0 0;padding:8px 0;background:color-mix(in oklab,var(--color-paper) 88%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.dict-quick-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;margin:0;padding:8px;background:var(--dict-card);border:0;border-radius:var(--radius-surface);box-shadow:0 1px 3px var(--color-shadow),0 8px 24px var(--color-shadow)}
.dict-quick-form:focus-within{box-shadow:0 0 0 3px var(--dict-soft),0 8px 24px var(--color-shadow)}
.dict-quick-field{display:flex;align-items:center;gap:8px;min-width:0;padding-left:6px}
.dict-quick-field>svg{width:18px;height:18px;flex-shrink:0;color:var(--color-muted);fill:none;stroke:currentColor;stroke-width:2}
.dict-quick-field input[type=search][name]{width:100%;min-width:0;min-height:44px;border:0;border-radius:0;background:transparent;padding:0;font-size:16px;box-shadow:none;outline:none;color:var(--color-ink)}
.dict-quick-form .btn{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 18px;border-radius:var(--radius-control)}
.dict-quick-form .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}

/* Result tabs ride in the sticky search bar: switching between words,
kanji and sentences never needs scrolling back up. */

/* Word of the day */
.dict-today{display:flex;flex-direction:column;gap:8px;padding:22px 24px;background:var(--dict-card);border-radius:20px;border:1px solid var(--dict-line);min-width:0}
.dict-today-word{font-size:44px;line-height:1.3;color:var(--color-ink);text-decoration:none;overflow-wrap:anywhere}
.dict-today-word:hover{color:var(--color-accent)}
.dict-today-reading{font-size:13px;color:var(--color-muted)}
.dict-today .dw-lines{margin-top:2px}
.dict-today-example{margin-top:4px;padding:10px 12px;background:var(--color-paper);border-radius:12px;font-size:14px;line-height:1.6}
.dict-today-example mark,.ds-ja mark{background:var(--dict-soft);color:var(--color-accent);border-radius:4px;padding:0 2px}
.dict-today-en{font-size:12px;color:var(--color-muted)}

/* Home sections */
.dict-section{display:grid;gap:14px}
.dict-section-head{display:grid;gap:4px}
.dict-section-head p{font-size:13px;color:var(--color-muted);max-width:70ch}
.de-related{list-style:none;margin:0;padding:0}
.de-related li+li{border-top:1px solid var(--dict-line)}
.dw-row{display:grid;grid-template-columns:minmax(72px,auto) minmax(0,1fr);gap:12px;align-items:baseline;padding:8px 0;color:inherit;text-decoration:none}
.dw-row:hover .dw-row-word{color:var(--color-accent)}
.dw-row-word{font-size:18px;line-height:1.5}
.dw-row-gloss{font-size:12px;color:var(--color-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Chips (grades, facets) */
.dict-chips{display:flex;gap:6px;flex-wrap:wrap}
.dict-chips a{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:5px 12px;border-radius:999px;font-size:12px;color:var(--color-ink);background:var(--dict-card);border:1px solid var(--dict-line);text-decoration:none}
.dict-chips a span{font-size:11px;color:var(--color-muted)}
.dict-chips a:hover{border-color:var(--color-accent)}
.dict-chips a[aria-current=page]{background:var(--color-ink);border-color:var(--color-ink);color:var(--color-surface)}
.dict-chips a[aria-current=page] span{color:inherit;opacity:.75}

/* Kanji tiles: fixed column counts that divide the page sizes (30 on the
home preview, 60 per browse page) so every row is full. */
.dict-section-head.has-action{display:flex;align-items:flex-end;justify-content:space-between;gap:8px 16px;flex-wrap:wrap}
.dict-section-head.has-action>div{display:grid;gap:4px;min-width:0}
.dict-section-head.has-action>.dict-link-arrow,.dict-section-head.has-action>.dict-count{flex-shrink:0}
.dict-kanji-tiles{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px}
.dk-tile{display:flex;flex-direction:column;align-items:center;gap:1px;padding:10px 6px 9px;background:var(--dict-card);border:1px solid var(--dict-line);border-radius:14px;color:inherit;text-decoration:none;text-align:center;min-width:0;transition:border-color .15s,transform .15s}
.dk-tile:hover,.dk-tile:focus-visible{border-color:var(--color-accent);transform:translateY(-1px)}
.dk-tile:hover .dk-tile-char{color:var(--color-accent)}
.dk-tile-char{font-size:32px;line-height:1.25}
.dk-tile-read{font-size:11px;line-height:1.4;color:var(--color-muted)}
.dk-tile-mean{font-size:11px;line-height:1.4;color:var(--color-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}
/* Word tiles: the same grid as the kanji tiles, wider cells. 12 on the home
preview and 48 per browse page fill every row. */
.dict-word-tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.dw-tile{display:flex;flex-direction:column;align-items:center;gap:1px;padding:12px 8px 10px;background:var(--dict-card);border:1px solid var(--dict-line);border-radius:14px;color:inherit;text-decoration:none;text-align:center;min-width:0;transition:border-color .15s,transform .15s}
.dw-tile:hover,.dw-tile:focus-visible{border-color:var(--color-accent);transform:translateY(-1px)}
.dw-tile:hover .dw-tile-word{color:var(--color-accent)}
.dw-tile-word{font-size:24px;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.dw-tile-read{font-size:11px;line-height:1.4;color:var(--color-muted)}
.dw-tile-mean,.dw-tile-read{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}
.dw-tile-mean{font-size:12px;line-height:1.4;color:var(--color-ink)}

.dict-section-head h1{font-size:24px;letter-spacing:-.02em;line-height:1.25}
.badge.jlpt{background:var(--dict-l2);color:var(--dict-l2-ink)}

/* Audio buttons */
.dict-audio{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;height:44px;flex-shrink:0;border:0;border-radius:999px;background:var(--dict-soft);color:var(--color-accent);cursor:pointer;font:500 13px var(--font-body)}
.dict-audio svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.dict-audio.small{min-width:36px;height:36px}.dict-audio.small svg{width:16px;height:16px}
.dict-audio.large{padding:0 18px;height:48px;background:var(--color-accent);color:var(--color-accent-ink)}
.dict-audio[data-audio-state=playing]{background:var(--color-accent);color:var(--color-accent-ink)}
.dict-audio.large[data-audio-state=playing]{background:var(--color-accent-hover)}

/* Entry page */
.dict-crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;color:var(--color-muted)}
.dict-crumbs a{color:var(--color-muted)}
.de-hero{display:flex;gap:20px;align-items:flex-end;justify-content:space-between;padding:28px 32px;border-radius:24px;background:linear-gradient(135deg,var(--dict-soft),var(--color-violet-paper))}
.de-word{display:grid;gap:6px;min-width:0}
.de-headword{font:400 56px/1.35 var(--font-japanese);letter-spacing:.02em;overflow-wrap:anywhere}
.de-reading{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--color-muted)}
.de-toc{display:flex;gap:6px;flex-wrap:wrap}
.de-toc a{font-size:12px;padding:5px 12px;border-radius:999px;color:var(--color-ink);text-decoration:none;border:1px solid var(--dict-line);background:var(--dict-card)}
.de-toc a:hover{border-color:var(--color-accent);color:var(--color-accent)}
.de-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:20px;align-items:start}
.de-main,.de-side{display:grid;gap:16px;min-width:0}
.de-card{display:grid;gap:12px;padding:22px 24px;background:var(--dict-card);border:0;border-radius:var(--radius-surface);min-width:0}
.de-card h3{margin-top:4px}
.de-senses{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.de-sense{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px}
.de-sense+.de-sense{padding-top:18px;border-top:1px solid var(--dict-line)}
.de-sense-num{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--color-ink);color:var(--color-surface);font-size:12px;font-weight:600}
.de-sense-body{display:grid;gap:6px;min-width:0}
.de-pos{display:flex;flex-wrap:wrap;gap:6px}
.de-pos span{font-size:11px;font-weight:600;color:var(--color-accent);text-transform:uppercase;letter-spacing:.04em}
.de-pos span+span::before{content:"·";margin-right:6px;color:var(--color-muted)}
.de-pos .has-hint{text-decoration:underline dotted;text-underline-offset:3px;cursor:help}
.de-gloss{font-size:17px;line-height:1.55}
.de-gloss-en,.dk-meaning-en{margin-top:2px;font-size:13px;line-height:1.5;color:var(--color-muted)}
.de-gloss-en abbr,.dk-meaning-en abbr{margin-right:4px;font-size:10px;font-weight:700;letter-spacing:.04em;text-decoration:none}
.de-tags{display:flex;flex-wrap:wrap;gap:4px}
.de-tags span{font-size:11px;padding:1px 9px;border-radius:999px;background:var(--color-paper);border:1px solid var(--dict-line);color:var(--color-muted)}
.de-note{font-size:12px;color:var(--color-muted);line-height:1.6}
.de-note b{color:var(--color-ink);font-weight:600}
.de-refs{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--color-muted)}
.de-refs a{color:var(--color-accent)}
.de-sense-examples{display:grid;gap:8px;margin-top:4px}
.de-sense-examples .ds-card{background:var(--color-paper);padding:10px 14px}
.de-sense-examples .ds-ja{font-size:15px}
.de-conj{border-collapse:collapse;width:100%;font-size:14px;table-layout:fixed}
.de-conj th{width:52%;text-align:left;font-weight:500;font-size:12px;padding:8px 12px 8px 0;vertical-align:top;overflow-wrap:anywhere}
.de-conj th small{display:block;font-weight:400;font-size:11px;color:var(--color-muted);line-height:1.4;white-space:normal;overflow-wrap:anywhere;word-break:break-word}
.de-conj td{padding:8px 0;font-size:16px;vertical-align:top;overflow-wrap:anywhere;word-break:keep-all}
.de-conj td small{display:block;font-size:11px;color:var(--color-muted)}
.de-conj tr+tr{border-top:1px solid var(--dict-line)}
.de-kanji{display:grid;gap:8px}
.de-kanji-part{display:flex;gap:14px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--color-paper);color:inherit;text-decoration:none;border:1px solid transparent}
.de-kanji-part:hover{border-color:var(--color-accent)}
.de-kanji-char{font-size:40px;line-height:1;flex-shrink:0}
.de-kanji-body{display:grid;gap:2px;font-size:12px;min-width:0}
.de-kanji-body strong{font-size:13px;overflow-wrap:anywhere}
.de-kanji-body b{color:var(--color-accent)}
.de-kanji-body small{color:var(--color-muted)}
.de-forms{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:18px}
.de-forms small{font-size:12px;color:var(--color-muted)}
.de-forms em{display:inline-block;margin-left:6px;font-size:11px;font-style:normal;color:var(--color-muted);padding:1px 8px;border-radius:999px;background:var(--color-paper)}

/* Kanji page */
.dk-hero{justify-content:flex-start;align-items:center;gap:28px}
.dk-big{display:grid;place-items:center;width:150px;height:150px;flex-shrink:0;border-radius:24px;background:var(--dict-card);border:1px solid var(--dict-line);font-size:104px;line-height:1}
.dk-meaning{font-size:26px;line-height:1.3;letter-spacing:-.01em}
.dk-level{margin:8px 0 0}
.dk-level .badge{font-size:12px;text-decoration:none}
.dk-readings{display:grid;gap:14px;margin:0}
.dk-readings dt{font-size:12px;font-weight:600}
.dk-readings dd{margin:2px 0 0;font-size:20px}
.dk-readings dd.dict-hint{font-size:11px}

.dict .list-pagination{margin-top:4px;padding-bottom:8px}

@media(max-width:1023px){
 .dict-hero{grid-template-columns:minmax(0,1fr)}
 .de-layout{grid-template-columns:minmax(0,1fr)}
 /* Filters become a chip row above the list. */
 /* The site header is sticky here too: the search slides under it and
    only the result tabs stay pinned below the header. */
 .dict-kanji-tiles{grid-template-columns:repeat(6,minmax(0,1fr))}
 .dict-word-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:767px){
 .dict{gap:16px}
 .dict-hero{padding:20px 18px;border-radius:20px}
 .dict-quick-form .btn{padding:0 14px}
 .dict-quick-form .btn span{display:none}
 .dict-section-head h1{font-size:20px}
 .dict-hero h1{font-size:28px}
 .de-hero{flex-direction:column;align-items:flex-start;padding:20px 18px}
 .de-headword{font-size:40px}
 .de-card{padding:16px}
 .dk-hero{flex-direction:row;align-items:flex-start;gap:16px}
 .dk-big{width:96px;height:96px;font-size:64px;border-radius:18px}
 .dk-meaning{font-size:19px}
 .dict-chips.is-grades{flex-wrap:nowrap;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
 .dict-chips.is-grades::-webkit-scrollbar{display:none}
 .dict-chips.is-grades a{flex-shrink:0;white-space:nowrap}
 .dict-kanji-tiles{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
 .dict-kanji-tiles.is-preview>:nth-child(n+16){display:none}
 .dict-word-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 .dict-word-tiles.is-preview>:nth-child(n+9){display:none}
 .dw-tile{padding:10px 6px 8px;border-radius:12px}
 .dw-tile-word{font-size:21px}
 .dk-tile{padding:8px 4px 7px;border-radius:12px}
 .dk-tile-char{font-size:26px}
 .dk-tile-mean{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.dict *{transition:none!important}}

/* Hallmark · macrostructure: search desk · tone: quiet and bookish · anchor hue: indigo
 * Pre-emit critique: P4 H5 E4 S5 R5 V4 · existing content and typography. */
.dict-hero{
 grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);
 gap:48px;padding:40px;border-radius:24px;
 background:var(--color-surface);color:var(--color-ink)
}
.dict-hero:not(:has(.dict-today)){grid-template-columns:minmax(0,1fr)}
.dict-hero-main{gap:16px;padding:12px 0;align-items:flex-start}
.dict-hero h1{max-width:16ch;font-size:clamp(32px,3.8vw,52px);line-height:1.12;letter-spacing:-.035em;color:var(--color-ink);overflow-wrap:anywhere}
.dict-hero-intro{max-width:52ch;font-size:15px;line-height:1.65;color:var(--color-muted)}
.dict-hero .dictionary-search-form{width:100%;max-width:none;margin-top:12px}
.dict-hero .dictionary-search-field{min-height:64px;gap:12px;padding:6px 6px 6px 16px;border:1px solid var(--color-rule);border-radius:14px;box-shadow:var(--shadow-soft);color:var(--color-ink)}
.dict-hero .dictionary-search-field:focus-within{outline:3px solid var(--color-accent-soft);border-color:var(--color-accent);outline-offset:2px}
.dict-hero .dictionary-search-field input[type=search][name]{font-size:16px;min-height:48px;color:var(--color-ink);box-shadow:none}
.dict-hero .dictionary-search-field input[type=search][name]:focus-visible{outline:none}
.dict-hero .dictionary-search-field .btn{min-height:48px;padding-inline:24px;white-space:nowrap;font-size:14px}
.dict-hero .dictionary-examples{gap:8px;margin:0;color:var(--color-muted);font-size:12px}
.dict-hero .dictionary-examples>span{margin-right:4px}
.dict-hero .dictionary-examples a{min-height:44px;padding:8px 12px;border:1px solid var(--color-rule);border-radius:var(--radius-pill);background:var(--color-paper);color:var(--color-ink)}
.dict-hero .dictionary-examples a:hover{background:var(--color-accent-soft);border-color:var(--color-accent)}
.dict-hero .dictionary-examples a:active{background:var(--color-paper-2)}
.dict-hero .dict-today{gap:12px;align-self:stretch;padding:28px;border:1px solid var(--color-rule);border-radius:20px;background:var(--color-paper);color:var(--color-ink)}
.dict-hero .dict-today>.dict-eyebrow{padding-bottom:8px;color:var(--color-accent);font-size:11px}
.dict-hero .dict-today-word{align-self:flex-start;margin-top:8px;font-size:48px;line-height:1.4}
.dict-hero .dict-today .dw-lines{font-size:14px;line-height:1.65}
.dict-hero .dict-today-example{margin:0;padding:16px 0 0;border-radius:0;background:var(--color-transparent)}
.dict-hero .dict-today-example mark{background:var(--color-accent-soft);color:var(--color-accent)}
.dict-hero .dict-today .dict-link-arrow{align-self:flex-start;min-height:44px;margin-top:auto;color:var(--color-accent);white-space:nowrap}
@media(max-width:1023px){
 .dict-hero{gap:28px;padding:28px;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
 .dict-hero .dict-today{padding:20px}
 .dict-hero .dictionary-search-field .btn{padding-inline:16px}
}
@media(max-width:767px){
 .dict-hero{grid-template-columns:minmax(0,1fr);gap:24px;padding:24px 16px 16px;border-radius:20px}
 .dict-hero-main{padding:0 4px;gap:12px}
 .dict-hero h1{max-width:none;font-size:32px}
 .dict-hero-intro{font-size:14px}
 .dict-hero .dictionary-search-form{margin-top:8px}
 .dict-hero .dictionary-search-field{min-height:60px;padding-left:12px;gap:8px}
 .dict-hero .dictionary-search-field .btn{padding-inline:14px;font-size:13px}
 .dict-hero .dict-today{padding:20px;gap:10px}
 .dict-hero .dict-today-word{font-size:40px}
}

/* ---- Search page: every kind of result on one compact page ----
   Words fill the main column with kanji beside them on wide screens, and
   sentences follow. Rows are dense but keep a clear column grid. */
.dict:has(.dr-head){gap:16px}

.dr-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 14px}
.dr-head h1{font-size:22px;letter-spacing:-.02em;line-height:1.3}
.dr-head q{font-family:var(--font-japanese);quotes:"「" "」"}
.dr-head .dict-hint{margin:0}
.dr-head .dict-hint a{color:var(--color-accent)}

.dr-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start;min-width:0}
.dr-grid:empty{display:none}
/* html keeps 6rem clear above an anchor; the sticky search bar needs less,
   so a section lands just below it. */
.dr-section{display:grid;gap:14px;min-width:0;padding:22px;border-radius:var(--radius-surface);background:var(--dict-card)}
.dr-section-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2px 12px;min-height:32px}
.dict .dr-section-head h2{display:flex;align-items:center;gap:8px;margin:0;font-size:18px;font-weight:500;letter-spacing:-.005em}
.dr-section .dict-empty{padding:16px;font-size:13px}
/* Inside a section card the lists drop their own surface: rows sit on the
   card, divided by a rule, and hover as tiles. */
.dr-section .dw-list,.dr-section .dk-list,.dr-section .ds-list{margin-inline:-10px;background:none;border:0;border-radius:0;overflow:visible}
.dr-section .dw-card>a,.dr-section .dk-row,.dr-section .ds-card{border-radius:var(--radius-control)}
.dr-section .ds-card{background:none}
.dr-facets{display:flex;gap:4px;width:fit-content;max-width:100%;padding:4px;border-radius:14px;background:var(--color-paper-2);overflow-x:auto;scrollbar-width:none}
.dr-facets::-webkit-scrollbar{display:none}
.dr-facets a{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border-radius:10px;font-size:13px;color:var(--color-muted);text-decoration:none;white-space:nowrap}
.dr-facets a span{font-size:11px;color:var(--color-muted);font-variant-numeric:tabular-nums}
.dr-facets a:hover{color:var(--color-ink)}
.dr-facets a[aria-current=page]{background:var(--color-surface);color:var(--color-ink);font-weight:500;box-shadow:0 1px 3px var(--color-shadow)}
.dr-facets a[aria-current=page] span{color:var(--color-muted)}
@media(min-width:1024px){
 .dr-grid.has-kanji{grid-template-columns:minmax(0,1fr) 320px;column-gap:20px}
 .dr-grid.has-kanji>.dr-kanji{grid-column:2;grid-row:1/span 2}
 .dr-grid.has-kanji>:not(.dr-kanji){grid-column:1}
}

/* A section's pager: where the list is, and small step links. */
.dr-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;padding-top:4px;font-size:13px;color:var(--color-muted)}
.dr-pager-steps{display:inline-flex;align-items:center;gap:4px}
.dr-pager-steps>a,.dr-pager-steps>span[aria-disabled]{display:inline-flex;align-items:center;gap:4px;min-height:40px;padding:0 14px;border:1px solid var(--color-rule);border-radius:var(--radius-control);background:var(--dict-card);color:var(--color-ink);text-decoration:none;font-weight:500}
.dr-pager-steps>span[aria-disabled]{opacity:.4}
.dr-pager-steps>a:hover,.dr-pager-steps>a:focus-visible{border-color:var(--color-accent);color:var(--color-accent)}
.dr-pager-steps svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.dr-pager-page{padding:0 6px;font-variant-numeric:tabular-nums}

/* Word rows (search page and kanji page). */
.dw-list{display:grid;background:var(--dict-card);border-radius:var(--radius-surface);overflow:hidden}
.dw-card+.dw-card{border-top:1px solid var(--dict-line)}
.dw-card>a{display:grid;grid-template-columns:minmax(150px,210px) minmax(0,1fr) 16px;gap:4px 20px;align-items:start;padding:14px 10px;color:inherit;text-decoration:none;transition:background-color .15s}
.dw-card>a:hover,.dw-card>a:focus-visible{background:var(--color-paper-2)}
.dw-card>a:focus-visible{outline-offset:-3px}
.dw-head{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
.dw-word{font-size:21px;line-height:1.5;overflow-wrap:anywhere}
.dw-word rt{font-size:.45em}
.dw-card>a:hover .dw-word{color:var(--color-accent)}
.dw-romaji{font-size:12px;color:var(--color-muted)}
.dw-reading-in{display:inline-flex;align-items:baseline;gap:4px;padding:0 7px;border-radius:7px;background:var(--dict-soft);color:var(--color-accent);font-size:12.5px}
.dw-reading-in small{font-family:var(--font-body);font-size:10px;color:var(--color-muted)}
.dw-head .dw-badges{gap:4px;margin:4px 0 0}
.dw-head .badge{padding:1px 8px;font-size:11px;line-height:1.6}
.dw-body{display:grid;gap:3px;align-content:start;min-width:0;padding-top:4px}
.dw-infl{margin:0}
.dw-infl .badge{font-size:11px}
.dw-lines{margin:0;padding:0 0 0 18px;list-style:none;counter-reset:sense;display:grid;gap:3px}
.dw-lines:has(>li:only-child){padding-left:0}
.dw-lines li{position:relative;counter-increment:sense;font-size:14.5px;line-height:1.55;color:var(--color-ink)}
.dw-lines li::before{content:counter(sense) ".";position:absolute;left:-18px;top:.12em;font-size:11px;font-weight:600;color:var(--color-muted);font-variant-numeric:tabular-nums}
.dw-lines li:only-child::before{content:none}
.dw-pos{font-size:12px;font-weight:400;color:var(--color-muted)}
.dw-meta{margin:2px 0 0;font-size:12px;color:var(--color-muted)}
.dw-go{align-self:center;width:16px;height:16px;color:var(--color-muted);fill:none;stroke:currentColor;stroke-width:2;transition:transform .15s,color .15s}
.dw-card>a:hover .dw-go{color:var(--color-accent);transform:translateX(2px)}
.de-card .dw-list{margin-inline:-14px;background:none;border-radius:0}
.de-card .dw-card>a{border-radius:var(--radius-control)}

/* Kanji rows: the character, meanings, readings and JLPT level. */
.dk-list{list-style:none;margin:0;padding:0;display:grid;background:var(--dict-card);border-radius:var(--radius-surface);overflow:hidden}
.dk-list>li+li{border-top:1px solid var(--dict-line)}
.dk-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px;color:inherit;text-decoration:none;transition:background-color .15s}
.dk-row:hover,.dk-row:focus-visible{background:var(--color-paper-2)}
.dk-row-char{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--color-paper-2);font-size:26px;line-height:1}
.dk-row-char ruby{line-height:1}
.dk-row-char rt{font-size:.4em}
.dk-row:hover .dk-row-char{background:var(--color-surface);color:var(--color-accent)}
.dk-row-body{display:grid;gap:2px;min-width:0}
.dk-row-body strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:14px;font-weight:500;line-height:1.4}
.dk-row-body small{display:flex;gap:0 8px;font-size:12px;line-height:1.5;color:var(--color-muted);white-space:nowrap;overflow:hidden}
.dk-row-body small b{font-weight:600;color:var(--color-accent)}
.dk-row-body small>span{overflow:hidden;text-overflow:ellipsis}
.dk-row .badge{padding:1px 8px;font-size:11px}

/* Sentence rows: the sentence, its translations under it, then its words. */
.ds-list{display:grid;background:var(--dict-card);border-radius:var(--radius-surface);overflow:hidden}
.ds-list>.ds-card+.ds-card{background:linear-gradient(var(--dict-line),var(--dict-line)) top/100% 1px no-repeat}
.ds-card{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;align-items:start;padding:14px 10px;background:var(--dict-card)}
.ds-card>.dict-audio.small{min-width:36px;height:36px;margin-top:6px}
.ds-body{display:grid;gap:2px;min-width:0}
.ds-ja{margin:0;font-size:17px;line-height:1.95;color:var(--color-ink);overflow-wrap:anywhere}
.ds-en{list-style:none;margin:0;padding:0;font-size:14px;line-height:1.55;color:var(--color-muted)}
.ds-more summary{font-size:12px;color:var(--color-accent);cursor:pointer}
.ds-none{font-size:12px;color:var(--color-muted);font-style:italic}
.ds-foot{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;justify-content:space-between;margin-top:6px}
.ds-foot .badge{padding:1px 8px;font-size:11px}
.ds-words{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline;margin:0;font-size:12px}
.ds-words span{color:var(--color-muted)}
.ds-words a{color:var(--color-accent);text-decoration:none}
.ds-words a:hover{text-decoration:underline}
.ds-words b{font-weight:600;background:var(--dict-soft);border-radius:4px;padding:0 3px}
.de-card .ds-list{margin-inline:-14px;background:none;border-radius:0}
.de-card .ds-card{border-radius:var(--radius-control);background:none}


/* Search within example sentences (search page and word pages). */
.ds-filter{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center;margin:0;padding:4px;background:var(--color-paper-2);border:0;border-radius:14px}
.ds-filter:has(select){grid-template-columns:minmax(0,1fr) minmax(0,14em) auto}
.ds-filter:focus-within{box-shadow:0 0 0 3px var(--dict-soft)}
.ds-filter-field{display:flex;align-items:center;gap:8px;min-width:0;padding-left:8px}
.ds-filter-field>svg{width:15px;height:15px;flex-shrink:0;color:var(--color-muted);fill:none;stroke:currentColor;stroke-width:2}
.ds-filter-field input[type=search][name]{width:100%;min-width:0;min-height:36px;border:0;border-radius:0;background:transparent;padding:0;font-size:14px;box-shadow:none;outline:none;color:var(--color-ink)}
.ds-filter select{min-width:0;min-height:36px;padding:0 8px;border:0;border-radius:10px;background:var(--color-surface);color:var(--color-ink);font-size:13px;text-overflow:ellipsis}
.ds-filter .btn{min-height:36px;padding-inline:16px;border:0;border-radius:10px;background:var(--color-surface);color:var(--color-ink);box-shadow:0 1px 3px var(--color-shadow);white-space:nowrap;font-size:13px;font-weight:500}
.ds-filter .btn:hover,.ds-filter .btn:focus-visible{background:var(--color-accent);color:var(--color-accent-ink)}
.ds-filter-status{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin:0;font-size:12.5px;color:var(--color-muted)}
.ds-filter-status a{color:var(--color-accent);text-decoration:none;font-weight:600}
.ds-filter-status a:hover,.ds-filter-status a:focus-visible{text-decoration:underline}
.de-card>.ds-filter-status{margin-top:-4px}

/* Sentence translation: the sentence, its words as small cards, and the
   corpus sentences that use them. */
.dt-card{display:grid;gap:14px;padding:22px;background:var(--dict-card);border:0;border-radius:var(--radius-surface);min-width:0}
.dt-head{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px}
.dict .dt-title{margin:0;font-size:18px;font-weight:500;letter-spacing:-.005em;color:var(--color-ink)}
.dt-head .dict-hint{margin:0}
.dt-pair{display:flex;align-items:center;gap:8px;margin-left:auto;font-size:13px;color:var(--color-muted)}
.dt-pair label{white-space:nowrap}
.dict .dt-head .dt-pair>label{margin:0}
.dt-pair select{margin:0;min-height:36px;padding:0 10px;border:0;border-radius:10px;background:var(--color-paper-2);color:var(--color-ink);font-size:13px}
.dt-target{margin:0;font-size:20px;line-height:1.6;color:var(--color-ink);overflow-wrap:anywhere}
.dt-main{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;padding:16px 18px;border-radius:var(--radius-control);background:var(--color-paper-2)}
.dt-main:not(:has(.dict-audio)){grid-template-columns:minmax(0,1fr)}
.dt-lines{display:grid;gap:8px;min-width:0}
.dt-line{display:grid;min-width:0}
.dt-line+.dt-line{padding-top:8px;border-top:1px dashed var(--dict-line)}
.dt-style{justify-self:start;margin-bottom:2px;background:var(--dict-soft);color:var(--color-accent)}
.dt-line.is-plain .dt-style{background:var(--color-surface);color:var(--color-muted)}
.dt-ja{margin:0;font-size:24px;line-height:1.95;color:var(--color-ink);word-break:keep-all;line-break:strict;overflow-wrap:anywhere;letter-spacing:.01em}
.dt-ja rt{font-size:.5em}
.dt-line.is-plain .dt-ja{font-size:18px}
.dt-line.is-plain .dt-ja rt{font-size:.58em}
.dt-romaji{margin:0;font-size:13px;line-height:1.5;color:var(--color-muted);overflow-wrap:anywhere}
.dt-note{margin:2px 0 0;font-size:11.5px;line-height:1.5;color:var(--color-muted)}
.dt-section{display:grid;gap:6px;min-width:0}
.dict .dt-label{margin:0;font-size:14px;font-weight:500;color:var(--color-ink)}
.dt-section>.dict-hint{margin:-4px 0 0}
.dt-section .ds-list{margin-inline:-10px;border-radius:0;background:none}
.dt-section .ds-card{border-radius:var(--radius-control);background:none}
/* Wide screens: the sentence and its words side by side, the example
   sentences below them. */
@media(min-width:1024px){
 .dt-card:has(.dt-main):has(.dt-words){grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:16px;align-items:start}
 .dt-card:has(.dt-main):has(.dt-words)>:not(.dt-main):not(.dt-words-section){grid-column:1/-1}
 .dt-card:has(.dt-main):has(.dt-words)>.dt-main{grid-column:1}
 .dt-card:has(.dt-main):has(.dt-words)>.dt-words-section{grid-column:2}
}
.dt-words{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px}
.dt-word{display:flex;flex-direction:column;min-width:0;padding:10px 12px;border-radius:var(--radius-control);background:var(--color-paper-2)}
.dt-src{font-size:17px;line-height:1.8;font-weight:500;color:var(--color-ink);overflow-wrap:anywhere}
.dt-src:not([lang]){font-family:var(--font-body);font-size:14px;line-height:1.6;font-weight:600}
.dt-src rt{font-size:.5em;font-weight:400}
.dt-src a{color:inherit;text-decoration:none}
.dt-src a:hover,.dt-src a:focus-visible{color:var(--color-accent)}
.dt-jp{font-size:14px;line-height:1.8;min-width:0;overflow-wrap:anywhere;color:var(--color-muted)}
.dt-jp rt{font-size:.55em}
.dt-arrow{margin-right:4px;font-family:var(--font-body)}
.dt-jp a{color:var(--color-accent);text-decoration:none}
.dt-jp a:hover,.dt-jp a:focus-visible{text-decoration:underline}
.dt-jp small{font-family:var(--font-body);font-size:11.5px;color:var(--color-muted)}
.dt-meta{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;margin-top:2px;font-size:12px;line-height:1.5;color:var(--color-muted)}
.dt-meta .badge{padding:0 6px;font-size:10px;line-height:1.7;vertical-align:1px}
.dt-gloss{color:var(--color-ink)}
.dt-others{font-size:11.5px;color:var(--color-muted)}
.dt-others a{color:var(--color-accent);text-decoration:none}
.dt-others a:hover{text-decoration:underline}
.dt-role{background:var(--color-surface)}
.dt-role.is-verb,.dt-role.is-adjective{background:var(--dict-soft);color:var(--color-accent);border-color:transparent}
.dt-role.is-topic,.dt-role.is-object,.dt-role.is-adverb,.dt-role.is-modifier{background:var(--color-violet-paper);color:var(--color-violet-ink);border-color:transparent}
.dt-role.is-time,.dt-role.is-place,.dt-role.is-noun,.dt-role.is-number{background:var(--dict-l2);color:var(--dict-l2-ink);border-color:transparent}
.dt-role.is-question{background:var(--dict-l1);color:var(--dict-l1-ink);border-color:transparent}
.dt-role.is-unknown{background:var(--color-study-coral);color:color-mix(in oklch,oklch(42% 0.09 32),oklch(80% 0.1 40) var(--dark-mix));border-color:transparent}

@media(max-width:1023px){
 .dk-list{gap:6px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
 .dk-list>li+li{border-top:0}
 .dk-row{background:var(--color-paper-2)}
 .dk-row .dk-row-char{background:var(--color-surface)}
}
@media(max-width:767px){
 .dict:has(.dr-head){gap:12px}
 .dr-head h1{font-size:19px}
 .dr-section,.dt-card{padding:16px}
 .dr-section .dw-list,.dr-section .dk-list,.dr-section .ds-list{margin-inline:-6px}
 .dw-card>a{grid-template-columns:minmax(0,1fr) 14px;gap:2px 10px;padding:12px 6px}
 .dw-head,.dw-body{grid-column:1}
 .dw-word{flex-basis:auto;font-size:20px}
 .dw-head{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:0 8px}
 .dw-head .dw-badges{flex-basis:100%;margin:2px 0 0}
 .dw-body{padding-top:2px}
 .dw-go{grid-column:2;grid-row:1/3}
 .dw-lines li{font-size:13.5px}
 .de-card .dw-list,.de-card .ds-list{margin-inline:-6px}
 .dk-list{grid-template-columns:minmax(0,1fr);gap:0}
 .dk-list>li+li{border-top:1px solid var(--dict-line)}
 .dk-row{background:none;padding:10px 6px}
 .dk-row .dk-row-char{background:var(--color-paper-2)}
 .ds-card{grid-template-columns:32px minmax(0,1fr);gap:10px;padding:12px 6px}
 .ds-card>.dict-audio.small{min-width:32px;height:32px}
 .ds-ja{font-size:15.5px}
 .dt-card{gap:12px}
 .dt-pair{flex-basis:100%;margin-left:0}
 .dt-pair select{flex:1;min-height:36px}
 .dt-main{padding:10px 12px;gap:10px}
 .dt-ja{font-size:21px}
 .dt-words{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ds-filter,.ds-filter:has(select){grid-template-columns:minmax(0,1fr) auto}
 .ds-filter select{grid-column:1/-1;grid-row:2;min-height:40px}
 .ds-filter-field input[type=search][name]{font-size:16px;min-height:40px}
 .ds-filter .btn{min-height:40px}
 .dr-pager{justify-content:center}
 .dr-pager-count{flex-basis:100%;text-align:center}
}
