/* zimai 0.18 lookup line. The three independent choices that shape every lookup sit with the
   search box and read as a sentence: Chinese · Characters · Meanings in → resulting dictionary.
   Only display settings (text size, theme) remain in the header. On phones the line collapses
   to one chip that opens the same three labelled choices in place. */
.lookup-line{display:block;margin:0 0 10px;min-width:0}
.lookup-line>summary{display:none}
.lookup-line-body{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;min-width:0}
.lookup-field{display:inline-flex;align-items:center;gap:8px;margin:0;min-width:0;font:500 13px/1.2 var(--sans);color:var(--muted);white-space:nowrap}
html body .lookup-field select{width:auto;max-width:100%;min-height:36px;padding-inline:10px 32px;background-position:right 10px center;font:500 16px/1.3 var(--sans);color:var(--ink)}
.lookup-result{font:400 13px/1.3 var(--sans);color:var(--muted);white-space:nowrap}
.lookup-result::before{content:'→ ';color:var(--accent)}
.lookup-sources{margin-left:auto;font-size:13px;white-space:nowrap}
/* The resulting pair is unavailable (Cantonese–German): say so plainly in the line. */
html[data-language-focus=yue][data-active-dictionary=de] .lookup-result{color:var(--accent)}

@media (max-width:640px){
 .lookup-line>summary{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 14px;border:1px solid var(--rule);border-radius:10px;background:var(--white);list-style:none;cursor:pointer;font:500 15px/1.2 var(--sans);color:var(--ink)}
 .lookup-line>summary::-webkit-details-marker{display:none}
 .lookup-line>summary .lookup-chip-caption{font-size:12px;color:var(--muted);font-weight:400}
 .lookup-line>summary .lookup-chip-value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .lookup-line>summary::after{content:'';flex:none;width:7px;height:7px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:translateY(-2px) rotate(45deg);opacity:.65}
 .lookup-line[open]>summary{border-radius:10px 10px 0 0}
 .lookup-line[open]>summary::after{transform:translateY(1px) rotate(-135deg)}
 .lookup-line-body{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:12px 14px 14px;border:1px solid var(--rule);border-top:0;border-radius:0 0 10px 10px;background:var(--white)}
 .lookup-field{display:grid;grid-template-columns:6.8rem minmax(0,1fr);gap:10px;font-size:14px}
 html body .lookup-field select{width:100%;font-size:16px;min-height:44px}
 .lookup-result{white-space:normal}
 .lookup-sources{margin-left:0}
}
@media print{.lookup-line{display:none}}

/* 0.19 handwriting: the pen button sits in every search bar (the pad loads on demand). */
html body .search-form>button.pen-button{display:inline-grid;place-items:center;flex:0 0 auto;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;margin:0;border:0;border-radius:8px;background:transparent;color:var(--accent);box-shadow:none}
@media (hover:hover) and (pointer:fine){html body .search-form>button.pen-button:hover{background:var(--ui-hover,var(--tint))}}
html body .search-form>button.pen-button[aria-expanded=true]{background:var(--tint);box-shadow:inset 0 0 0 1px var(--accent)}