/* Personal vocabulary notebook. Meanings are entered by the learner. */
.passage-inner .text-tools{gap:7px}
.passage-inner .text-tools .vocabulary-open{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));color:var(--accent)}
.passage-inner .text-tools .vocabulary-open:hover{background:color-mix(in srgb,var(--accent) 13%,var(--surface));box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 20%,transparent)}
.reading-paragraph p[lang=de],.reading-subheading[lang=de],.text-card>p,.ad-copy>p,.grammar-text{cursor:copy}
#dialog:has(.vocabulary-library){width:min(660px,calc(100vw - 28px));max-height:calc(100dvh - 28px);overflow:auto}
#dialog:has(.vocabulary-form){width:min(470px,calc(100vw - 28px))}
.vocabulary-intro{display:flex;align-items:center;gap:13px;padding:14px;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));border-radius:15px;background:color-mix(in srgb,var(--accent) 7%,var(--surface));margin-bottom:16px}
.vocabulary-mark{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:12px;background:color-mix(in srgb,var(--accent) 18%,var(--surface));color:var(--accent)}
.vocabulary-mark svg{width:21px;height:21px}.vocabulary-intro strong{color:var(--text);font-size:15px}.vocabulary-intro p,.vocabulary-form p{margin:4px 0 0;color:var(--muted);font-size:12px;line-height:1.8}
.vocabulary-filters{display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:9px;margin-bottom:14px}
.vocabulary-filters :is(input,select),.vocabulary-form input{width:100%;min-width:0;min-height:42px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:var(--text);outline:none}
.vocabulary-filters :is(input,select):focus-visible,.vocabulary-form input:focus-visible{border-color:var(--accent);outline:2px solid color-mix(in srgb,var(--accent) 25%,transparent)}
.vocabulary-list{display:grid;gap:8px;max-height:min(430px,50dvh);overflow:auto;padding:2px 3px 2px 0;scrollbar-color:var(--line) transparent}
.vocabulary-row{display:flex;justify-content:space-between;align-items:center;gap:14px;min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface2)}
.vocabulary-row-copy{display:grid;gap:2px;min-width:0}.vocabulary-row-copy strong{color:var(--text);font:800 16px Inter,Cairo,sans-serif;overflow-wrap:anywhere}.vocabulary-row-copy span{color:var(--text);font-size:13px;overflow-wrap:anywhere}.vocabulary-row-copy small{color:var(--muted);font-size:10px;overflow-wrap:anywhere}
.vocabulary-row-actions{display:flex;gap:6px;flex:none}.vocabulary-row-actions button{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--line);border-radius:9px;color:var(--muted)}.vocabulary-row-actions button:hover{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--surface))}.vocabulary-row-actions button:last-child:hover{border-color:#f1849966;color:#f18499}
.vocabulary-row-actions svg{width:15px;height:15px}.vocabulary-empty{text-align:center;padding:38px 10px;color:var(--muted)}
.vocabulary-form{display:grid;gap:13px}.vocabulary-form label{display:grid;gap:6px;color:var(--text);font-size:12px;font-weight:700}.vocabulary-form input[readonly]{opacity:.75}.vocabulary-source{display:block;color:var(--muted);font-size:11px;overflow-wrap:anywhere}
.vocabulary-actions{display:flex;align-items:center;gap:9px;margin-top:17px}.vocabulary-actions button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:9px 15px}.vocabulary-actions svg{width:16px;height:16px}.vocabulary-form #vocabulary-error{color:#f18499}
@media(max-width:700px){.passage-inner .text-tools{position:static;justify-content:center;margin:-10px 0 20px}.passage-inner .text-tools button{width:auto;height:auto;min-height:36px;padding:8px 12px;font-size:11px;border-radius:10px}.passage-inner .text-tools button svg{width:15px;height:15px}}
@media(max-width:420px){.vocabulary-filters{grid-template-columns:1fr 96px}.vocabulary-row{padding:11px}.vocabulary-row-copy strong{font-size:14px}.vocabulary-actions{flex-wrap:wrap}.vocabulary-actions button{flex:1}}