.cong-cu-goc{display:contents}.cong-cu{--cc-day: calc(18px + env(safe-area-inset-bottom)) ;position:fixed;left:0;bottom:var(--cc-day);z-index:54;display:flex;align-items:stretch;transition:transform var(--cc-truot) var(--ease-truot)}.cong-cu[data-gon="1"]{transform:translate(calc(-100% + var(--cc-gay)))}.cong-cu-thanh{display:flex;gap:2px;padding:6px;border:1px solid var(--border);border-left:0;border-right:0;background:var(--surface);box-shadow:var(--cc-thanh-bong);transition:opacity var(--cc-truot) var(--ease-truot)}.cong-cu[data-gon="1"] .cong-cu-thanh{opacity:0}.cong-cu-nut{all:unset;position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:60px;padding:7px 6px;box-sizing:border-box;border-radius:var(--r-vua);cursor:pointer;color:var(--text);font:600 12px/1.2 var(--font-ui);text-align:center;white-space:nowrap;transition:background var(--t-nhanh) var(--ease),color var(--t-nhanh) var(--ease)}.cong-cu-nut svg{width:22px;height:22px}.cong-cu-nut:hover,.cong-cu-nut[aria-pressed=true]{background:var(--nut-nhat);color:var(--nut)}:root[data-theme=toi] .cong-cu-nut:is(:hover,[aria-pressed=true]){color:var(--nut-vien)}.cong-cu-nut:focus-visible{outline:2px solid var(--nut);outline-offset:-2px}.cong-cu-cham{position:absolute;top:4px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--danger);box-shadow:0 0 0 2px var(--surface)}.cong-cu-tab{all:unset;position:relative;display:grid;place-items:center;align-content:center;gap:6px;width:var(--cc-gay);min-height:52px;padding:10px 0;box-sizing:border-box;border-radius:0 10px 10px 0;background:var(--cc-tab);color:var(--cc-tab-chu);box-shadow:var(--cc-tab-bong);cursor:pointer}.cong-cu-tab:hover{filter:brightness(1.08)}.cong-cu-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.cong-cu-tab svg{transition:transform var(--cc-truot) var(--ease-truot)}.cong-cu[data-gon="1"] .cong-cu-tab svg{transform:rotate(180deg)}.cong-cu-tab-cham{position:absolute;top:5px;right:4px;width:8px;height:8px;border-radius:50%;background:var(--cc-cham);box-shadow:0 0 0 2px var(--nut-bam)}.cong-cu-khung{--cc-tren: calc(96px + env(safe-area-inset-bottom)) ;position:fixed;z-index:54;left:calc(var(--cc-gay) + 8px);bottom:var(--cc-tren);display:flex;flex-direction:column;width:min(340px,calc(100vw - var(--cc-gay) - 16px));max-height:calc(100dvh - var(--cc-tren) - 72px);box-sizing:border-box;border:1px solid var(--border);border-radius:var(--r-vua);overflow:hidden;background:var(--khung-cong-cu);box-shadow:var(--cc-khung-bong);animation:cc-tu-nut var(--cc-mo) var(--ease-truot) both}.cong-cu-khung[data-dong]{pointer-events:none;animation:cc-ve-nut var(--cc-dong) cubic-bezier(.5,0,.75,.2) both}@keyframes cc-tu-nut{0%{opacity:0;transform:translate(var(--cc-ve-x, 0),var(--cc-ve-y, 12px)) scale(.08)}40%{opacity:1}}@keyframes cc-ve-nut{60%{opacity:1}to{opacity:0;transform:translate(var(--cc-ve-x, 0),var(--cc-ve-y, 12px)) scale(.08)}}@keyframes cc-hien{0%{opacity:0;transform:translateY(10px) scale(.98)}}.cong-cu-khung header{flex:none;display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid var(--border-soft);color:var(--text)}.cong-cu-khung h2{margin:0;font:700 16px var(--font-ui)}.cong-cu-khung header button{all:unset;cursor:pointer;font-size:20px;line-height:1;padding:0 4px}.cong-cu-noi-dung{flex:1;min-height:0;overflow:auto;padding:12px;font-size:14px;color:var(--text);overscroll-behavior:contain}.cc-trang{animation:cc-doi var(--cc-mo) var(--ease-truot) both}@keyframes cc-doi{0%{opacity:0;transform:translateY(4px)}}.cong-cu-khung[data-khung=tro-chuyen]{width:min(360px,calc(100vw - var(--cc-gay) - 16px));height:min(var(--chat-cao, 460px),calc(100dvh - var(--cc-tren) - 72px))}.cong-cu-khung[data-khung=tro-chuyen] .cong-cu-noi-dung{padding:0;overflow:hidden}.cong-cu-khung[data-khung=tro-chuyen] .cc-trang{height:100%}.chat{display:flex;flex-direction:column;height:100%}.chat-keo{position:absolute;top:0;left:0;right:0;z-index:4;height:10px;cursor:ns-resize;touch-action:none}.chat-keo:after{content:"";display:block;width:40px;height:4px;margin:3px auto 0;border-radius:var(--r-tron);background:var(--border)}.chat-keo:focus-visible{outline:2px solid var(--nut)}.cong-cu-bong{position:absolute;left:calc(100% + 8px);bottom:0;display:flex;align-items:flex-start;gap:2px;width:max-content;max-width:min(280px,calc(100vw - 100% - 16px));padding:8px 6px 8px 12px;box-sizing:border-box;border:1px solid var(--border-soft);border-radius:var(--r-vua);background:var(--surface);color:var(--text);box-shadow:var(--bong-noi);font:13px/1.45 var(--font-ui);animation:cc-hien var(--cc-mo) var(--ease-truot) both}.cong-cu-bong button{padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}.cong-cu-bong .cong-cu-bong-tat{flex:none;width:22px;color:var(--text-muted);font-size:16px;text-align:center}@media(max-width:640px){.cong-cu{--cc-day: calc(12px + env(safe-area-inset-bottom)) }.cong-cu-khung{--cc-tren: calc(87px + env(safe-area-inset-bottom)) }.cong-cu-nut{min-width:56px;padding:6px 4px;font-size:11px}}.cong-cu-khung[data-khung=nhac]{width:min(360px,calc(100vw - var(--cc-gay) - 16px));max-height:calc(100dvh - var(--cc-tren) - 72px)}.nhac{display:grid;gap:12px}.nhac-keo{display:none}.nhac-dau{display:flex;align-items:center;gap:12px}.nhac-phat{flex:none;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--nut);border-radius:50%;background:var(--nut);color:var(--nut-chu);cursor:pointer}.nhac-phat[aria-pressed=true]{background:var(--surface);color:var(--nut)}.nhac-phat:disabled{opacity:.6;cursor:progress}.nhac-phat svg{width:20px;height:20px}.nhac-ten{display:grid;gap:2px;min-width:0}.nhac-ten strong{font:700 15px var(--font-ui)}.nhac-ten span{font-size:12px;color:var(--text-muted)}.nhac-canh{display:grid;gap:3px;margin:0;padding:0;border:0}.nhac-canh legend,.nhac-muc{font:600 12px var(--font-ui);color:var(--text-muted)}.nhac-canh legend{margin-bottom:4px;padding:0}.nhac-canh label{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;padding:4px 8px;border:1px solid var(--border-soft);border-radius:var(--r-vua);cursor:pointer}.nhac-canh label.dang{border-color:var(--nut);background:var(--nut-nhat)}.nhac-canh input{grid-row:span 2;margin:0;accent-color:var(--nut)}.nhac-canh b{font:600 13px var(--font-ui);color:var(--text)}.nhac-canh small{font-size:11px;color:var(--text-muted)}.nhac-muc{display:grid;grid-template-columns:76px 1fr;align-items:center;gap:8px}.nhac-muc input[type=range]{width:100%;accent-color:var(--nut)}.nhac-muc select{min-height:32px;border:1px solid var(--border);border-radius:var(--r-vua);background:var(--surface);color:var(--text);font:inherit;font-weight:400}.vien-nhac{position:fixed;z-index:53;left:calc(var(--cc-gay) + 8px);bottom:calc(24px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:2px;padding:2px;border:1px solid var(--border);border-radius:var(--r-tron);background:var(--surface);box-shadow:var(--cc-thanh-bong);transition:opacity var(--t-nhanh) var(--ease);animation:cc-hien .3s var(--ease) both}.vien-nhac[data-cuon]{opacity:.35}.vien-nhac-nut{all:unset;display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:var(--r-tron);cursor:pointer;font:600 12px var(--font-ui);color:var(--text);touch-action:none;user-select:none;-webkit-user-select:none}.vien-nhac-nut:focus-visible{outline:2px solid var(--nut)}.vien-nhac-nut svg{width:16px;height:16px}.vien-nhac-ten{max-width:40vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vien-nhac-tat{all:unset;width:24px;text-align:center;color:var(--text-muted);font-size:16px;cursor:pointer}.vien-nhac-vach{display:flex;align-items:flex-end;gap:2px;height:14px}.vien-nhac-vach i{width:3px;height:100%;border-radius:1px;background:var(--nut);transform-origin:bottom;transform:scaleY(.3)}.vien-nhac[data-dang="1"] .vien-nhac-vach i{animation:nhac-vach 1.1s ease-in-out infinite alternate}.vien-nhac[data-dang="1"] .vien-nhac-vach i:nth-child(2){animation:nhac-vach .9s ease-in-out -.4s infinite alternate}.vien-nhac[data-dang="1"] .vien-nhac-vach i:nth-child(3){animation:nhac-vach 1.3s ease-in-out -.7s infinite alternate}@keyframes nhac-vach{0%{transform:scaleY(.25)}to{transform:scaleY(1)}}@media(prefers-reduced-motion:reduce){.vien-nhac[data-dang="1"] .vien-nhac-vach i:nth-child(n){animation:none;transform:scaleY(.7)}}@media(max-width:640px){.vien-nhac{bottom:calc(18px + env(safe-area-inset-bottom))}.cong-cu-khung[data-khung=nhac]{left:0;right:0;bottom:0;width:auto;max-height:82dvh;border-radius:16px 16px 0 0;padding-bottom:env(safe-area-inset-bottom);animation-name:nhac-tam-len}.cong-cu-khung[data-khung=nhac][data-dong]{animation-name:nhac-tam-xuong}.cong-cu-khung[data-khung=nhac] header{padding-top:18px}.nhac-keo{display:block;position:absolute;top:0;left:48px;right:48px;z-index:4;height:28px;touch-action:none;cursor:grab}.nhac-keo:after{content:"";display:block;width:40px;height:5px;margin:7px auto 0;border-radius:var(--r-tron);background:var(--border)}}@media(max-width:767px){:root:has(.reader-toolbar[data-visible=true]) .vien-nhac{bottom:calc(78px + env(safe-area-inset-bottom))}}@keyframes nhac-tam-len{0%{transform:translateY(100%)}}@keyframes nhac-tam-xuong{to{transform:translateY(100%)}}