.lp-panel{position:fixed;visibility:visible;width:280px;max-height:400px;overflow-y:auto;z-index:1500;padding:14px;border:1px solid rgba(245,158,11,.22);border-radius:18px;background:radial-gradient(circle at 18% 0%,rgba(245,158,11,.14),transparent 34%),linear-gradient(180deg,var(--surface),var(--surface2));color:var(--text);box-shadow:0 24px 60px #1f293738,0 0 0 1px #ffffff14 inset;opacity:1;transform:translateY(0) scale(1);transition:opacity var(--d-fast) var(--ease-out),transform var(--d-fast) var(--ease-out),border-color var(--d-fast) var(--ease-out);font-family:var(--font-ui)}.lp-panel.hidden{visibility:hidden;opacity:0;pointer-events:none;transform:translateY(8px) scale(.98)}.lp-panel.pinned{border-color:var(--hoang-kim);box-shadow:0 24px 60px #1f293738,0 0 0 1px #f59e0b6b inset,0 0 0 6px #f59e0b14;animation:lpPinnedPulse .42s var(--ease-out) 1}.lp-panel .lp-header,.lp-panel .lp-actions,.lp-panel .lp-meaning-card>div,.lp-panel .lp-meta-strip,.lp-panel .lp-footer{display:flex;align-items:center}.lp-panel .lp-header{justify-content:space-between;gap:10px;margin-bottom:10px}.lp-badge{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;background:#dc26261a;color:var(--accent-text);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.lp-panel.pinned .lp-badge{background:#f59e0b29;color:var(--accent-ink)}.lp-panel .lp-actions{gap:5px}.lp-icon-btn,.lp-tts,.lp-mini-tts,.lp-primary,.lp-secondary,.lp-link-btn,.lp-recent-item{font:inherit;cursor:pointer}.lp-icon-btn{width:30px;height:30px;border:1px solid var(--border);border-radius:10px;background:#ffffff0d;color:var(--text2);display:inline-flex;align-items:center;justify-content:center;transition:border-color var(--d-fast) ease,color var(--d-fast) ease,background var(--d-fast) ease,transform var(--d-fast) ease}.lp-icon-btn:hover,.lp-icon-btn.active{border-color:var(--hoang-kim);background:#f59e0b24;color:var(--accent-ink);transform:translateY(-1px)}.lp-hero{text-align:center;padding:8px 0 12px}.lp-hanzi{font-family:var(--font-hanzi-display);font-size:56px;font-weight:500;line-height:1;letter-spacing:-.03em;color:var(--text)}.lp-pinyin{margin-top:6px;color:var(--accent-ink);font-size:22px;line-height:1.2}.lp-hero{container-type:inline-size;--lp-res: calc(100cqi - 84px) ;--lp-real: 100cqi}.lp-hero.lp-hero--img{--lp-real: calc(100cqi - 84px) }.lp-hanzi{white-space:nowrap}.lp-hanzi[data-len]{font-size:clamp(var(--hz-min, 36px),calc(var(--lp-c, var(--lp-res)) / (var(--n, 1) * 1.04)),56px)}.lp-hanzi[data-len="3"]{--n: 3;--lp-c: var(--lp-real)}.lp-hanzi[data-len="3"][data-res]{--lp-c: var(--lp-res)}.lp-hanzi[data-len="4"]{--n: 4;--lp-c: var(--lp-real)}.lp-hanzi[data-len="5"]{--n: 5;--hz-min: 30px;--lp-c: var(--lp-real)}.lp-hanzi[data-len="6"]{--n: 6;--hz-min: 26px;--lp-c: var(--lp-real)}.lp-hanzi[data-len="7"]{--n: 7;--hz-min: 24px;--lp-c: var(--lp-real)}.lp-hanzi[data-len="8"]{--n: 8;--hz-min: 22px;--lp-c: var(--lp-real)}.lp-hanzi[data-len="3"]~.lp-pinyin,.lp-hanzi[data-len="4"]~.lp-pinyin,.lp-hanzi[data-len="5"]~.lp-pinyin,.lp-hanzi[data-len="6"]~.lp-pinyin,.lp-hanzi[data-len="7"]~.lp-pinyin,.lp-hanzi[data-len="8"]~.lp-pinyin{font-size:clamp(16px,calc(var(--lp-real) * .11),22px)}.lp-hanzi[data-len="3"][data-res]~.lp-pinyin{font-size:clamp(16px,calc(var(--lp-res) * .11),22px)}.lp-tts{margin-top:10px;border:1px solid var(--border);border-radius:999px;padding:5px 11px;background:var(--surface);color:var(--text2);font-size:12px;transition:border-color var(--d-fast) ease,color var(--d-fast) ease,transform var(--d-fast) ease}.lp-tts:hover{border-color:var(--primary);color:var(--accent-text);transform:translateY(-1px)}.lp-meaning-card{display:grid;gap:8px;padding:12px;border:1px solid var(--border);border-radius:14px;background:#ffffff8c}[data-theme=dark] .lp-meaning-card{background:#ffffff0a}.lp-meaning-card>div{gap:8px;min-width:0}.lp-meaning-card strong,.lp-meaning-card span:last-child{min-width:0;overflow-wrap:anywhere}.lp-flag{flex:0 0 auto;width:26px;padding:2px 0;border-radius:6px;background:#dc26261a;color:var(--accent-text);font-size:12px;font-weight:800;text-align:center}.lp-flag-en{background:#6b72801f;color:var(--text3)}.lp-meta-strip{flex-wrap:wrap;gap:6px;margin:10px 0 2px}.lp-meta-strip span{border-radius:999px;padding:4px 8px;background:var(--surface);border:1px solid var(--border);color:var(--text2);font-size:12px;font-weight:650}.lp-meta-strip .lp-srs-badge{border-color:#10b9813d;background:#10b9811a;color:var(--success)}.lp-section-title{display:flex;align-items:center;gap:8px;margin:14px 0 8px;color:var(--text3);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.lp-section-title:before,.lp-section-title:after{content:"";height:1px;flex:1;background:var(--border)}.lp-example{position:relative;border-radius:14px;padding:12px 38px 12px 12px;background:var(--surface);border:1px solid var(--border)}.lp-mini-tts{position:absolute;top:9px;right:9px;width:26px;height:26px;border:1px solid var(--border);border-radius:9px;background:transparent;color:var(--text2)}.lp-ex-zh{margin:0 0 5px;font-family:var(--font-hanzi);font-size:18px;line-height:1.6}.lp-ex-py{margin:0 0 4px;color:var(--accent-ink);font-size:12px;line-height:1.45}.lp-ex-vi{margin:0;color:var(--text2);font-size:13px;line-height:1.45}.lp-footer{gap:8px;margin-top:12px}.lp-primary,.lp-secondary,.lp-link-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:11px;border:1px solid transparent;min-height:36px;padding:8px 10px;font-size:13px;font-weight:750;transition:transform var(--d-fast) ease,opacity var(--d-fast) ease,border-color var(--d-fast) ease}.lp-primary{flex:1.2;background:var(--primary);color:var(--on-accent);box-shadow:var(--shadow-red)}.lp-secondary,.lp-link-btn{flex:1;background:var(--surface);border-color:var(--border);color:var(--text2)}.lp-primary:hover,.lp-secondary:hover,.lp-link-btn:hover{transform:translateY(-1px)}.lp-idle{display:grid;justify-items:center;gap:10px;padding:16px 10px 8px;text-align:center}.lp-idle img{width:72px;height:72px;object-fit:contain;border-radius:50%;background:#f59e0b1f}.lp-idle p,.lp-empty-note,.lp-missing p{margin:0;color:var(--text2);font-size:13px;line-height:1.45}.lp-recent-list{display:grid;gap:6px}.lp-recent-item{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px;width:100%;border:1px solid var(--border);border-radius:12px;padding:8px;background:var(--surface);color:var(--text);text-align:left}.lp-recent-item:hover{border-color:#f59e0b80}.lp-recent-h{font-family:var(--font-hanzi);font-size:20px;font-weight:700}.lp-recent-meta{min-width:0;overflow:hidden;color:var(--text2);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.lp-host-item .lp-recent-meta{white-space:normal}.lp-char-note{margin:0 0 4px;text-align:center}.lp-link-btn{width:100%;margin-top:12px}.lp-missing{padding:18px 8px 8px;text-align:center}.lp-missing-char{font-family:var(--font-hanzi-display);font-size:46px;line-height:1;color:var(--text3)}.lp-missing h3{margin:8px 0 4px;font-size:16px}.lp-token-hover,.clickable-hanzi.lp-token-hover,ruby.lp-token-hover,[data-hanzi].lp-token-hover,[data-lookup=true].lp-token-hover,.hanzi-text.lp-token-hover{cursor:pointer;text-decoration:underline dotted rgba(245,158,11,.5);text-underline-offset:3px}.lp-token-active,.clickable-hanzi.lp-token-active,ruby.lp-token-active,[data-hanzi].lp-token-active{border-radius:4px;background:#f59e0b26!important;cursor:pointer}.lp-token-pinned,.clickable-hanzi.lp-token-pinned,ruby.lp-token-pinned,[data-hanzi].lp-token-pinned{outline:1.5px dashed var(--hoang-kim);outline-offset:2px}@keyframes lpPinnedPulse{0%{box-shadow:0 24px 60px #1f293738,0 0 #f59e0b47}to{box-shadow:0 24px 60px #1f293738,0 0 0 8px #f59e0b00}}@media(max-width:1023px){.lp-panel.lp-panel--sheet{left:0;right:0;bottom:0;top:auto!important;width:auto;max-width:560px;margin:0 auto;max-height:72vh;border-radius:20px 20px 0 0;border-bottom:0;padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px));box-shadow:0 -18px 50px #1f293747}.lp-panel.lp-panel--sheet:before{content:"";display:block;width:42px;height:4px;margin:-7px auto 9px;border-radius:999px;background:var(--border-strong)}.lp-panel--sheet.hidden{transform:translateY(16px) scale(1)}.lp-panel--sheet .lp-icon-btn{width:34px;height:34px}.lp-panel--sheet .lp-primary,.lp-panel--sheet .lp-secondary,.lp-panel--sheet .lp-link-btn{min-height:44px}}.vimg{display:block;flex:0 0 auto;object-fit:cover;background:var(--me-bach);border:1px solid var(--border-mid);border-radius:var(--r-3);box-shadow:var(--shadow-1);user-select:none}[data-theme=dark] .vimg{filter:brightness(.92)}.lp-img{width:72px;height:72px}.lp-hero.lp-hero--img{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:12px;align-items:center;text-align:left}.lp-hero--img>.vimg{grid-column:1;grid-row:1 / span 4}.lp-hero--img>:not(.vimg){grid-column:2}.lp-hero--img .lp-tts{justify-self:start}@media(max-width:1023px){.lp-panel--sheet .lp-img{width:88px;height:88px}.lp-panel--sheet .lp-hero.lp-hero--img{grid-template-columns:88px minmax(0,1fr)}.lp-panel--sheet .lp-hero{--lp-res: calc(100cqi - 100px) }.lp-panel--sheet .lp-hero.lp-hero--img{--lp-real: calc(100cqi - 100px) }}.hanviet-line{display:block;font-size:.78rem;color:var(--text-secondary);letter-spacing:.02em}.hanviet-line b{color:var(--accent-ink);font-weight:600;text-transform:lowercase}.dx{display:grid;gap:12px;margin:12px 0}.dx-block{border:1px solid var(--border);border-radius:12px;padding:10px 12px;background:var(--surface2)}.dx-title{margin:0 0 6px;color:var(--text3);font-size:12px;font-weight:600;letter-spacing:.02em}.dx-text{margin:0;color:var(--text);font-size:14px;line-height:1.6}.dx-note{margin:6px 0 0;color:var(--text3);font-size:12px;line-height:1.5}.dx-dc-row+.dx-dc-row{margin-top:8px}.dx-dc-formula{color:var(--text);font-size:15px}.dx-dc-formula b,.dx-dc-ch{font-family:var(--font-hanzi-display);font-weight:500}.dx-dc-ch{font-size:20px}.dx-dc-gloss{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:4px;color:var(--text2);font-size:13px}.dx-part b{font-family:var(--font-hanzi-display);font-weight:500;color:var(--text)}.dx--compact{gap:8px;margin:10px 0}.dx--compact .dx-block{padding:8px 10px}.dx--compact .dx-text{font-size:13px}.go{margin:12px 0;border:1px solid var(--border);border-radius:12px;padding:10px 12px;background:var(--surface2);min-width:0}.go-title{margin:0 0 6px;color:var(--text3);font-size:12px;font-weight:600;letter-spacing:.02em}.go-group+.go-group{margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}.go-gtitle{margin:0 0 2px;color:var(--text2);font-size:13px;font-weight:600}.go-list{list-style:none;margin:0;padding:0}.go-item{display:flex;flex-direction:column;gap:2px;margin:0 -8px;padding:6px 8px;border-radius:8px;color:var(--text);text-decoration:none;min-width:0}.go-item:hover{background:var(--surface)}.go-item:focus-visible{background:var(--surface);outline:2px solid var(--accent-text);outline-offset:1px}.go-label{font-size:14px;line-height:1.45;overflow-wrap:anywhere}.go-sub{color:var(--text2);font-size:12px;line-height:1.4;overflow-wrap:anywhere}.go-meta{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;color:var(--text3);font-size:12px}.go-tag{color:var(--accent-text);font-weight:600}.go-pro{min-height:16px;padding:1px 6px}.go-rest{padding:4px 0 0;color:var(--text3);font-size:12px}.go-more{margin-top:2px;padding:6px 0;border:0;background:none;color:var(--accent-text);font:inherit;font-size:13px;font-weight:600;cursor:pointer}.go-more:hover{text-decoration:underline}.go-more:focus-visible{outline:2px solid var(--accent-text);outline-offset:2px;border-radius:4px}.go--compact{margin:10px 0;padding:8px 10px}.go--compact .go-label{font-size:13px}

.note-fab{position:fixed;z-index:940;width:52px;height:52px;border-radius:50%;border:1px solid var(--border);background:var(--card);color:var(--text2);box-shadow:var(--shadow-3);display:flex;align-items:center;justify-content:center;cursor:grab;padding:0;touch-action:none;transition:transform var(--d-fast) ease,box-shadow var(--d-base) ease,color var(--d-fast) ease,translate var(--d-base) var(--ease-out),border-radius var(--d-base) var(--ease-out);-webkit-user-select:none;user-select:none}.note-fab.docked{translate:26px 0;border-radius:26px 0 0 26px}.note-fab.docked svg{translate:-13px 0}.note-fab svg{transition:translate var(--d-base) var(--ease-out)}.note-fab.docked:focus-visible,.note-fab.docked.open,.note-fab.docked.dragging{translate:0 0;border-radius:50%}.note-fab.docked:focus-visible svg,.note-fab.docked.open svg,.note-fab.docked.dragging svg{translate:0 0}@media(hover:hover){.note-fab.docked:hover{translate:0 0;border-radius:50%}.note-fab.docked:hover svg{translate:0 0}}.note-fab:hover{color:var(--accent-text);transform:translateY(-2px);box-shadow:var(--shadow-4)}.note-fab:active{cursor:grabbing}.note-fab.dragging{cursor:grabbing;transform:scale(1.06);box-shadow:var(--shadow-4);transition:none}.note-fab.open{color:var(--on-accent);background:var(--primary);border-color:var(--primary)}.note-fab svg{width:22px;height:22px;pointer-events:none}.note-fab-badge{position:absolute;top:-2px;right:-2px;min-width:12px;height:12px;border-radius:7px;background:var(--accent);border:2px solid var(--card);box-shadow:0 0 0 1px rgba(var(--primary-rgb),.15)}.note-fab-badge.hidden{display:none}.note-fab.docked:not(:focus-visible):not(.open):not(.dragging) .note-fab-badge{right:auto;left:10px;top:7px}@media(hover:hover){.note-fab.docked:hover .note-fab-badge{right:-2px;left:auto;top:-2px}}.note-fab.hidden{display:none}.note-panel{position:fixed;z-index:945;width:312px;max-width:calc(100vw - 24px);max-height:min(70vh,520px);display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-4);overflow:hidden;animation:notePanelIn .16s ease}.note-panel.hidden{display:none}@keyframes notePanelIn{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.note-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-bottom:1px solid var(--border);background:var(--surface-2, var(--surface))}.note-panel-tabs{display:flex;gap:4px}.note-tab{font:inherit;font-size:12.5px;font-weight:600;padding:5px 10px;border-radius:9px;border:1px solid transparent;background:transparent;color:var(--text3);cursor:pointer;transition:background .12s ease,color .12s ease}.note-tab:hover{color:var(--text2);background:var(--primary-soft)}.note-tab.active{color:var(--accent-text);background:var(--primary-soft);border-color:rgba(var(--primary-rgb),.25)}.note-panel-close{font:inherit;font-size:16px;line-height:1;width:28px;height:28px;border-radius:8px;border:none;background:transparent;color:var(--text3);cursor:pointer;flex-shrink:0}.note-panel-close:hover{background:var(--surface-3, var(--bg));color:var(--text)}.note-pane{padding:12px;overflow-y:auto}.note-pane.hidden{display:none}.note-route-label{font-size:12px;color:var(--text3);margin-bottom:8px}.note-route-label strong{color:var(--text2)}#noteTextarea{width:100%;min-height:160px;max-height:320px;resize:vertical;font:inherit;font-size:14px;line-height:1.55;color:var(--text);background:var(--surface, var(--bg));border:1px solid var(--border);border-radius:11px;padding:10px 12px;outline:none;transition:border-color .12s ease,box-shadow .12s ease;box-sizing:border-box}#noteTextarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}#noteTextarea::placeholder{color:var(--text3)}.note-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;font-size:12px;color:var(--text3)}.note-foot-saved{color:var(--jade, #10B981);opacity:0;transition:opacity var(--d-base) ease}.note-foot-saved.show{opacity:1}.note-count.over{color:var(--accent-text);font-weight:600}.note-lookup-tip{font-size:13px;line-height:1.55;color:var(--text2);margin:2px 0 14px}.note-lookup-tip b{color:var(--text)}.note-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--border)}.note-toggle-row:first-of-type{border-top:none}.note-toggle-label{font-size:13px;color:var(--text)}.note-toggle-label small{display:block;font-size:12px;color:var(--text3);margin-top:2px}.note-switch{position:relative;flex-shrink:0;width:40px;height:22px;border-radius:12px;border:none;background:var(--border-2, var(--border));cursor:pointer;transition:background var(--d-fast) ease;padding:0}.note-switch:after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--surface);box-shadow:var(--shadow-1);transition:transform var(--d-fast) ease}.note-switch.on{background:var(--primary)}.note-switch.on:after{transform:translate(18px)}.note-guide-btn{width:100%;margin-top:14px;font:inherit;font-size:13px;font-weight:600;color:var(--accent, var(--hsk-thuy-luc, #10B981));background:transparent;border:1px solid var(--accent, var(--hsk-thuy-luc, #10B981));border-radius:10px;padding:9px;cursor:pointer;transition:background .12s ease,color .12s ease}.note-guide-btn:hover{background:color-mix(in srgb,var(--accent, #10B981) 12%,transparent)}.note-hide-btn{width:100%;margin-top:8px;font:inherit;font-size:12.5px;color:var(--text3);background:transparent;border:1px solid var(--border);border-radius:10px;padding:8px;cursor:pointer;transition:background .12s ease,color .12s ease}.note-hide-btn:hover{background:var(--surface-3, var(--bg));color:var(--text2)}@media(max-width:480px){.note-panel{inset:auto 12px 12px!important;width:auto;max-width:none;max-height:64vh}}