.archive-title>img{display:block;width:52px;height:52px;object-fit:cover;border:1px solid #5d64da;border-radius:14px;box-shadow:0 0 18px rgba(94,80,255,.28)}

/* Dictionary reference layout; keep the project's Aimi portrait. */
#screenVocab:has(#archiveWordsPane:not(.hidden)) { color:#edf4ff; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-command,
#screenVocab #archiveWordsPane { border:0; background:transparent; box-shadow:none; padding:0; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title {
    display:flex; align-items:center; gap:16px; min-height:128px; padding:14px; box-sizing:border-box;
    border:1px solid #167bff; border-radius:18px;
    background:linear-gradient(90deg,#001020e8 20%,#06173399 60%,#04112b22),url('../assets/dictionary-night-scene-v1.webp') right center/cover;
}
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title > img { width:90px; height:90px; flex:0 0 90px; border:1px solid #0aadff; border-radius:15px; object-fit:cover; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title h1 { margin:0 0 8px; color:#fff; font-size:28px; line-height:1.1; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title p { margin:0; color:#83dfff; font-size:14px; line-height:1.4; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-tabs { display:none; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors { display:flex; flex-direction:column; gap:8px; margin:12px 0; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors > div { display:flex; align-items:center; flex-wrap:wrap; gap:7px; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors small { width:70px; flex:0 0 70px; color:#a9d4ff; text-transform:uppercase; font-size:12px; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors button { min-height:40px; min-width:48px; margin:0; padding:8px 14px; border:1px solid #1352a0; border-radius:11px; color:#eff6ff; background:#04162e; font-size:14px; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors button.active { border-color:#27dfff; background:linear-gradient(135deg,#05b9ff,#0867f5); box-shadow:0 0 12px #058eff55; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors .archive-favorites-toggle { color:#ffd052; font-size:23px; padding:3px 14px; }
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors.archive-filters-collapsed { display:none; }
#screenVocab #archiveWordsPane .archive-pane-head { display:none; }
#screenVocab .dictionary-searchbar { display:grid; grid-template-columns:minmax(0,1fr) 48px; gap:9px; margin:0 0 12px; }
#screenVocab .archive-search { display:flex; align-items:center; gap:10px; margin:0; padding:10px 14px; min-height:48px; box-sizing:border-box; border:1px solid #1684ff; border-radius:13px; background:#03152e; color:#fff; font-size:24px; }
#screenVocab .archive-search input { width:100%; min-width:0; padding:0; border:0; outline:0; background:transparent; color:#eff4ff; font-size:14px; }
#screenVocab .archive-search input::placeholder { color:#a4c5f4; }
#screenVocab .dictionary-filter-toggle { border:1px solid #1684ff; border-radius:13px; background:#03152e; color:#a4d7ff; font-size:28px; }
#screenVocab .archive-word-list { display:flex; flex-direction:column; gap:9px; }
#screenVocab .dictionary-card { display:grid; grid-template-columns:76px minmax(140px,1fr) auto; align-items:center; gap:14px; min-height:96px; padding:8px; border:1px solid #12549c; border-radius:16px; background:linear-gradient(130deg,#03172d,#051a34); color:#fff; }
#screenVocab .dictionary-card.has-example { grid-template-columns:76px minmax(140px,.9fr) minmax(190px,1.2fr) auto; }
#screenVocab .dictionary-hanzi { display:grid; place-items:center; width:76px; min-height:76px; box-sizing:border-box; border:1px solid #0bb9ff; border-radius:13px; background:linear-gradient(#06133422,#12155666),url('../assets/dictionary-night-scene-v1.webp') 75% center/auto 100%; color:#fff; font-size:32px; font-weight:800; text-shadow:0 0 10px #476dff; }
#screenVocab .dictionary-word { min-width:0; }
#screenVocab .dictionary-pronunciation { display:flex; align-items:center; gap:10px; }
#screenVocab .dictionary-pronunciation strong { color:#fff; font-size:19px; line-height:1.2; }
#screenVocab .dictionary-pronunciation button { border:0; background:transparent; padding:2px; color:#53bfff; font-size:18px; cursor:pointer; }
#screenVocab .dictionary-meaning { color:#aed0ff; margin:5px 0 6px; font-size:13px; line-height:1.35; }
#screenVocab .dictionary-meaning > span { color:#02d9ff; }
#screenVocab .dictionary-level { display:inline-block; padding:3px 8px; border:1px solid #258ae0; border-radius:7px; background:#07549a; color:#e7f5ff; font-size:12px; }
#screenVocab .dictionary-example { padding-left:14px; border-left:1px solid #1463a2; color:#a9ccff; font-size:13px; line-height:1.35; }
#screenVocab .dictionary-example > b { display:block; color:#fff; font-size:17px; margin-bottom:3px; }
#screenVocab .dictionary-example > span { display:block; }
#screenVocab .dictionary-example p { margin:3px 0 0; }
#screenVocab .archive-word-actions { align-self:start; gap:6px; padding-top:2px; }
#screenVocab .archive-word-actions button { width:36px; height:36px; border:1px solid #1672cd!important; border-radius:10px; background:#071d3b!important; color:white; font-size:24px; }
#screenVocab .archive-word-actions .active { color:#ffcd4e; }
@media(max-width:600px) {
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title { gap:10px; min-height:96px; padding:9px; border-radius:14px; }
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title > img { width:62px; height:70px; flex-basis:62px; border-radius:11px; }
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title h1 { font-size:20px; margin-bottom:5px; }
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title p { font-size:10px; }
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors { gap:6px; margin:10px 0; }
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors > div { gap:5px; }
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors small { width:47px; flex-basis:47px; font-size:9px; }
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors button { min-width:29px; min-height:32px; padding:5px 8px; font-size:11px; border-radius:8px; }
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-selectors .archive-favorites-toggle { padding:2px 10px; font-size:20px; }
    #screenVocab .dictionary-searchbar { grid-template-columns:minmax(0,1fr) 38px; gap:6px; }
    #screenVocab .archive-search { min-height:40px; padding:7px 9px; gap:6px; }
    #screenVocab .archive-search input { font-size:11px; }
    #screenVocab .dictionary-card, #screenVocab .dictionary-card.has-example { grid-template-columns:52px minmax(0,1fr) 62px; gap:8px; padding:7px; min-height:82px; border-radius:13px; }
    #screenVocab .dictionary-hanzi { width:52px; min-height:60px; font-size:24px; border-radius:10px; }
    #screenVocab .dictionary-pronunciation { gap:4px; }
    #screenVocab .dictionary-pronunciation strong { font-size:14px; }
    #screenVocab .dictionary-pronunciation button { font-size:15px; }
    #screenVocab .dictionary-meaning { font-size:11px; margin:3px 0 4px; }
    #screenVocab .dictionary-level { font-size:10px; padding:2px 6px; }
    #screenVocab .dictionary-example { grid-column:2/-1; grid-row:2; padding:6px 0 0; border-left:0; border-top:1px solid #1463a2; font-size:10px; }
    #screenVocab .dictionary-example > b { font-size:14px; }
    #screenVocab .archive-word-actions { grid-column:3; grid-row:1; gap:4px; }
    #screenVocab .archive-word-actions button { width:28px; height:30px; font-size:20px; }
}
html[data-mobile] #mRoot #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-command,
html[data-mobile] #mRoot #screenVocab #archiveWordsPane { padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; }

/* Aimi's original portrait keeps its proportions and its own illustrated frame. */
#screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title > img.knowledge-aimi-portrait {
    width:90px; height:90px; flex:0 0 90px; aspect-ratio:1;
    object-fit:contain; object-position:center; padding:0; border:0;
    border-radius:12px; box-shadow:none;
}
@media(max-width:600px) {
    #screenVocab:has(#archiveWordsPane:not(.hidden)) .archive-title > img.knowledge-aimi-portrait {
        width:70px; height:70px; flex-basis:70px;
    }
}