:root{color-scheme:light;--ink:#171714;--muted:#6e6d67;--paper:#f5f2eb;--card:#fff;--soft:#e9e5dc;--soft-2:#faf9f6;--line:#ddd8ce;--acid:#d8ff47;--dark:#22221e;--on-dark:#fff;--green:#347946;--red:#a34637;--warning-bg:#fff5d9;--warning-border:#e7cf8c;--warning-text:#584615;--header-bg:rgba(245,242,235,.91);--shadow:0 24px 70px rgba(39,34,23,.11)}
html[data-theme="dark"]{color-scheme:dark;--ink:#f4f2eb;--muted:#aaa9a2;--paper:#171714;--card:#22221e;--soft:#2d2d28;--soft-2:#1d1d1a;--line:#3b3b35;--dark:#080807;--on-dark:#fff;--green:#79bf85;--red:#e08675;--warning-bg:#332d1c;--warning-border:#6e5c29;--warning-text:#f3df9c;--header-bg:rgba(23,23,20,.91);--shadow:0 24px 70px rgba(0,0,0,.28)}
*{box-sizing:border-box;-ms-touch-action:manipulation;touch-action:manipulation;-webkit-tap-highlight-color:transparent}html{scroll-behavior:smooth;overflow-x:hidden}body{margin:0;overflow-x:hidden;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.shell{width:min(1180px,calc(100% - 32px));margin:auto}button,input{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}.mono{font-family:ui-monospace,SFMono-Regular,monospace}.muted{color:var(--muted)}
.site-header{position:sticky;top:0;z-index:20;background:rgba(245,242,235,.91);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.nav{min-height:72px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:11px;font-weight:900;letter-spacing:-.045em;font-size:21px;margin-right:auto}.mark{width:34px;height:34px;background:var(--ink);color:var(--acid);display:grid;place-items:center;border-radius:10px}.nav-links{display:flex;gap:4px}.nav-links a{padding:10px 12px;border-radius:9px;font-size:13px;font-weight:700}.nav-links a:hover,.nav-links a.active{background:var(--soft)}.wallet-pill{border:1px solid var(--line);background:var(--card);border-radius:12px;padding:8px 11px;display:flex;align-items:center;gap:9px;font-size:12px}.wallet-pill b{background:var(--acid);padding:5px 8px;border-radius:7px}.menu-btn{display:none;border:0;background:var(--ink);color:#fff;width:40px;height:40px;border-radius:10px}.mobile-menu{display:none;padding:0 0 12px}.mobile-menu a{display:block;padding:11px;border-radius:8px;font-weight:700;font-size:14px}.mobile-menu a:hover{background:var(--soft)}
.eyebrow{font:700 11px ui-monospace,SFMono-Regular,monospace;letter-spacing:.14em;text-transform:uppercase;margin-bottom:18px}.eyebrow span{background:var(--acid);padding:7px 10px;border-radius:99px;margin-right:8px}.hero{padding:74px 0 52px}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}.hero h1,.page-hero h1{font-size:clamp(50px,7vw,88px);line-height:.92;letter-spacing:-.075em;margin:0 0 25px}.hero h1 em,.page-hero h1 em{font-family:'Palatino Linotype',Georgia,serif;font-weight:400}.lead{color:var(--muted);font-size:17px;line-height:1.65;max-width:590px;margin:0}.hero-actions{display:flex;gap:11px;margin-top:30px;flex-wrap:wrap}.btn{border:0;border-radius:10px;padding:13px 17px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.18s}@media(hover:hover) and (pointer:fine){.btn:hover{transform:translateY(-2px)}}.btn-dark{background:var(--ink);color:#fff}.btn-light{background:var(--soft)}.btn-acid{background:var(--acid);color:var(--ink)}.btn-block{width:100%}.btn-outline{border:1px solid var(--line);background:var(--card)}.trust{display:flex;flex-wrap:wrap;gap:20px;margin-top:25px;font-size:12px;font-weight:700}.trust span:before{content:'✓';display:inline-grid;place-items:center;width:19px;height:19px;border:1px solid #bab6ac;border-radius:50%;margin-right:7px}
.hero-panel{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:15px;box-shadow:var(--shadow);transform:rotate(1deg)}.demo-head{background:var(--dark);color:#fff;border-radius:15px;padding:22px;display:flex;justify-content:space-between;align-items:flex-start}.demo-head small{font:700 10px ui-monospace,monospace;letter-spacing:.15em;color:#aaa}.demo-head h3{font-size:26px;letter-spacing:-.04em;margin:8px 0}.balance{background:var(--acid);color:var(--ink);border-radius:10px;padding:10px;text-align:right}.balance b{display:block;font-size:23px}.tool-stack{padding:6px 4px}.mini-tool{display:grid;grid-template-columns:45px 1fr auto;gap:12px;align-items:center;padding:15px 10px;border-bottom:1px solid var(--line)}.mini-tool:last-child{border:0}.tool-icon{width:45px;height:45px;border-radius:12px;background:var(--soft);display:grid;place-items:center;font-size:21px}.mini-tool strong{display:block;font-size:14px}.mini-tool small{color:var(--muted)}.price{font:800 11px ui-monospace,monospace;background:#efffc0;padding:7px 9px;border-radius:99px}
.mini-tool-link{border-radius:12px;transition:background .18s,transform .18s}@media(hover:hover) and (pointer:fine){.mini-tool-link:hover{background:var(--soft-2);transform:translateX(3px)}}.mini-tool-link:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.hero-compare-card{padding:12px;transform:rotate(1deg)}.hero-compare-stage{position:relative;aspect-ratio:5/4;overflow:hidden;border-radius:16px;background:var(--soft)}.hero-compare-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;user-select:none}.hero-before{filter:blur(3.2px) saturate(.68);transform:scale(1.02)}.hero-after{clip-path:inset(0 0 0 50%)}.hero-compare-stage input{position:absolute;z-index:5;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}.hero-compare-line{position:absolute;z-index:4;top:0;bottom:0;left:50%;width:2px;background:var(--acid);transform:translateX(-1px);pointer-events:none}.hero-compare-line:after{content:'↔';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--acid);color:#171714;font-style:normal;font-weight:950;box-shadow:0 8px 25px rgba(0,0,0,.25)}.hero-compare-label{position:absolute;z-index:3;top:13px;padding:7px 9px;border-radius:99px;background:rgba(15,15,13,.78);color:#fff;font:850 9px ui-monospace,monospace;letter-spacing:.06em;backdrop-filter:blur(8px)}.hero-compare-label.before{left:13px}.hero-compare-label.after{right:13px;background:var(--acid);color:#171714}.hero-compare-meta{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 5px 4px}.hero-compare-meta div{min-width:0}.hero-compare-meta small,.hero-compare-meta strong,.hero-compare-meta span{display:block}.hero-compare-meta small{color:var(--muted);font:800 9px ui-monospace,monospace;letter-spacing:.08em}.hero-compare-meta strong{margin:5px 0 3px;font-size:16px;letter-spacing:-.025em}.hero-compare-meta span{color:var(--muted);font-size:10px}.hero-compare-meta .btn{flex:0 0 auto;padding:11px 13px;font-size:11px}@media(max-width:520px){.hero-compare-stage{aspect-ratio:1/1}.hero-compare-meta{align-items:stretch;flex-direction:column}.hero-compare-meta .btn{width:100%}}
.section{padding:70px 0}.section-line{border-top:1px solid var(--line)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:28px}.section-head h2{font-size:clamp(32px,4vw,50px);letter-spacing:-.055em;margin:0}.section-head p{color:var(--muted);max-width:420px;line-height:1.55;margin:0}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.tool-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:21px;min-height:245px;display:flex;flex-direction:column;transition:.2s}
/* Thumb ảnh so sánh trong tool-card (trang chủ). Chỉ card CÓ .tool-thumb mới đổi, nên các
   card dùng .tool-icon ở /cong-cu giữ nguyên. Nửa phải cắt bằng clip-path đúng kỹ thuật của
   .up-demo-after ở /nang-cap-anh: hai ảnh chồng khít nhau nên không phải tính lại kích thước.
   Tĩnh, không kéo được — cả card là link, thêm control kéo sẽ tranh click với link. */
.tool-thumb{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:var(--soft);user-select:none;-webkit-user-select:none}
.tool-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}
/* Cắt ở 40% chứ không phải 50%: chừa nhiều đất cho nửa KẾT QUẢ hơn, và khớp vị trí mặc
   định của thanh kéo ở /nang-cap-anh. Núm ↔ chỉ là trang trí (thumb tĩnh), nhưng nó là thứ
   khiến người xem đọc ra ngay đây là ảnh so sánh chứ không phải hai ảnh ghép. */
.tool-thumb-after{position:absolute;inset:0;clip-path:inset(0 0 0 40%)}
.tool-thumb-line{position:absolute;z-index:2;top:0;bottom:0;left:40%;width:2px;background:var(--acid);transform:translateX(-1px)}
.tool-thumb-line:after{content:'';position:absolute;left:50%;top:50%;width:34px;height:34px;border-radius:50%;transform:translate(-50%,-50%);background-color:var(--acid);background-image:url('svgs/regular/arrows-left-right.svg');background-position:center;background-repeat:no-repeat;background-size:15px;box-shadow:0 8px 22px rgba(0,0,0,.28),0 0 0 3px rgba(216,255,71,.16)}
.tool-thumb-tag{position:absolute;z-index:3;bottom:9px;padding:4px 7px;border-radius:99px;font:850 8px/1 ui-monospace,monospace;letter-spacing:.06em}
.tool-thumb-tag.before{left:9px;background:rgba(15,16,14,.58);color:#fff;backdrop-filter:blur(6px)}
.tool-thumb-tag.after{right:9px;background:var(--acid);color:#171714}
/* Thumb đã là điểm nhìn của card nên tiêu đề không cần khoảng thở 25px như khi đứng sau
   .tool-icon. Ràng cả .tool-card để thắng các override trong media query bên dưới. */
.tool-card .tool-thumb+h3{margin-top:14px}@media(hover:hover) and (pointer:fine){.tool-card:hover{transform:translateY(-5px);box-shadow:0 18px 45px rgba(39,34,23,.09)}}.tool-card.featured{background:var(--card);color:var(--ink);border:2px solid #171714;box-shadow:0 14px 38px rgba(23,23,20,.08)}.tool-card.featured .muted{color:var(--muted)}.tool-card.featured .tool-icon{background:var(--acid);color:#171714}.tool-top{display:flex;justify-content:space-between;align-items:start}.tool-card .tool-icon{width:50px;height:50px}.tool-card h3{font-size:21px;letter-spacing:-.035em;margin:25px 0 7px}.tool-card p{font-size:13px;line-height:1.55;margin:0 0 22px}.ai-model-list{display:flex;flex-wrap:wrap;gap:6px;margin:-7px 0 18px}.ai-model-list span{padding:6px 9px;border:1px solid var(--line);border-radius:99px;background:var(--soft);font:800 9px ui-monospace,monospace;letter-spacing:.02em}.tool-footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center}.text-link{font-weight:800;font-size:13px}.text-link:hover{text-decoration:underline}.tag{font:700 10px ui-monospace,monospace;padding:6px 8px;border-radius:99px;border:1px solid var(--line)}.old-price{position:relative;display:inline-block;color:var(--muted);margin-right:5px}.old-price:after{content:'';position:absolute;left:-2px;right:-2px;top:50%;height:1.5px;background:currentColor;transform:rotate(-35deg);transform-origin:center}.sale-price{color:var(--ink);font-weight:900}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:17px;overflow:hidden}.step{background:var(--paper);padding:27px}.step small{font:700 11px ui-monospace,monospace;color:var(--muted)}.step h3{font-size:18px;margin:35px 0 9px}.step p{font-size:13px;color:var(--muted);line-height:1.55;margin:0}.cta{background:var(--dark);color:#fff;border-radius:25px;padding:45px;display:flex;justify-content:space-between;align-items:center;gap:30px}.cta h2{font-size:clamp(32px,5vw,58px);letter-spacing:-.06em;margin:0;max-width:700px}.cta h2 em{font-family:'Palatino Linotype',Georgia,serif;font-weight:400;color:var(--acid)}
.page-hero{padding:56px 0 38px}.page-hero h1{font-size:clamp(45px,6vw,75px);max-width:800px}.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:25px}.filter{border:1px solid var(--line);background:transparent;border-radius:99px;padding:9px 13px;font-weight:750;font-size:12px}.filter.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.topup-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:20px;align-items:start}.choice-card,.checkout,.panel{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px}.choice-card{cursor:pointer;margin-bottom:12px}.choice-card.active{outline:2px solid var(--ink);background:color-mix(in srgb,var(--acid) 10%,var(--card))}.choice-card h3{margin:0 0 7px}.choice-card p{font-size:13px;line-height:1.5;margin:0;color:var(--muted)}.radio{float:right;width:20px;height:20px;border:1px solid #aaa;border-radius:50%}.active .radio{border:6px solid var(--ink)}.packages{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:18px 0}.package{border:1px solid var(--line);border-radius:13px;background:var(--soft-2);padding:17px;text-align:left}.package.active{background:var(--ink);color:#fff;border-color:var(--ink)}.package b{font-size:23px;display:block}.package small{color:var(--muted)}.package.active small{color:#ccc}.bonus{color:var(--green)!important;font-weight:800}.checkout-total{display:flex;justify-content:space-between;align-items:end;border-top:1px solid var(--line);padding-top:18px;margin-top:18px}.checkout-total b{font-size:29px}.qr-wrap{display:none;text-align:center;padding-top:20px}.qr{width:190px;height:190px;margin:0 auto 15px;background:repeating-conic-gradient(#171714 0 25%,#fff 0 50%) 0/22px 22px;border:12px solid #fff;box-shadow:0 0 0 1px var(--line)}.warning{background:var(--warning-bg);border:1px solid var(--warning-border);border-radius:12px;padding:13px;font-size:12px;line-height:1.5;margin:14px 0}
.auth-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}.auth-card{background:var(--card);border:1px solid var(--line);border-radius:21px;padding:30px}.auth-card.dark{background:var(--dark);color:#fff}.auth-card h2{font-size:30px;letter-spacing:-.04em;margin:8px 0 12px}.auth-card p{color:var(--muted);line-height:1.55;font-size:14px}.auth-card.dark p{color:#b8b8b3}.input{width:100%;border:1px solid var(--line);border-radius:11px;padding:14px;background:var(--soft-2);margin:8px 0}.auth-card.dark .input{background:#30302b;border-color:#44443e;color:#fff}.divider{text-align:center;color:var(--muted);font-size:11px;margin:18px 0;position:relative}.divider:before,.divider:after{content:'';position:absolute;top:50%;width:42%;height:1px;background:var(--line)}.divider:before{left:0}.divider:after{right:0}
.history-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:18px}.history-list{border:1px solid var(--line);border-radius:17px;overflow:hidden}.history-row{display:grid;grid-template-columns:1.3fr .8fr .7fr .5fr;gap:14px;padding:17px 19px;background:var(--card);border-bottom:1px solid var(--line);align-items:center;font-size:13px}.history-row:last-child{border:0}.history-row.head{background:var(--soft);font:700 10px ui-monospace,monospace;letter-spacing:.1em}.status-ok{color:var(--green);font-weight:800}.empty-state{text-align:center;padding:70px 20px;background:var(--card);border:1px solid var(--line);border-radius:18px}.empty-state .tool-icon{margin:auto;width:60px;height:60px;font-size:26px}.empty-state h3{font-size:24px;margin:18px 0 8px}.footer{margin-top:70px;border-top:1px solid var(--line);padding:27px 0 35px}.footer-row{display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:11px}
.toast{position:fixed;right:20px;bottom:20px;z-index:400;background:#10100e;color:#fff;border:1px solid #35352f;border-radius:12px;padding:14px 17px;box-shadow:0 20px 55px rgba(0,0,0,.32);font-size:13px;display:none;max-width:340px}.toast b{color:var(--acid)}
@media(max-width:600px){.toast{left:14px;right:14px;bottom:calc(88px + env(safe-area-inset-bottom));max-width:none}}
.theme-btn{width:40px;height:40px;flex:0 0 auto;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);display:grid;place-items:center;font-size:17px;transition:.18s}@media(hover:hover) and (pointer:fine){.theme-btn:hover{transform:translateY(-1px);border-color:var(--muted)}}
.balance,.balance b{color:#171714}.balance small{color:#626653}.price,.eyebrow span,.btn-acid,.wallet-pill b{color:#171714}.mark,.menu-btn,html[data-theme="dark"] .mark{background:var(--acid);color:#171714}
.site-header,html[data-theme="dark"] .site-header{background:var(--header-bg)}.nav-links a:hover,.nav-links a.active,.mobile-menu a:hover,.btn-light{background:var(--soft)}.wallet-pill,.btn-outline,.tool-card,.choice-card,.checkout,.panel,.auth-card,.history-row,.empty-state,.upload{background:var(--card)}.drop,.input,.package{background:var(--soft-2)}.tool-icon{background:var(--soft)}.mark,html[data-theme="dark"] .mark{background:var(--acid);color:#171714}.menu-btn,html[data-theme="dark"] .menu-btn{background:var(--soft);color:var(--ink);border:1px solid var(--line)}.btn-dark,.filter.active,.package.active{background:var(--ink);color:var(--paper)}.btn-dark:hover{color:var(--paper)}.featured,.cta,.auth-card.dark,.demo-head,html[data-theme="dark"] .auth-card.dark{background:var(--dark);color:var(--on-dark)}.tool-card.featured{background:var(--card);color:var(--ink);border-color:#171714}.tool-card.featured .muted,html[data-theme="dark"] .tool-card.featured .muted{color:var(--muted)}html[data-theme="dark"] .tool-card.featured{background:var(--card);color:var(--ink);border-color:#aaa9a2;box-shadow:0 14px 38px rgba(0,0,0,.18)}.auth-card.dark{border-color:color-mix(in srgb,var(--on-dark) 18%,transparent)}.auth-card.dark .input{background:#30302b;border-color:#4a4a43;color:#fff}.auth-card.dark .input::placeholder{color:#92928b}.warning,.auth-card.dark .warning{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)!important}.warning b,.warning strong{color:inherit}.history-row.head{background:var(--soft)}.choice-card.active{background:color-mix(in srgb,var(--acid) 10%,var(--card))}.package.active small{color:var(--paper);opacity:.68}.package.active .bonus{color:var(--green)!important;opacity:1}.input::placeholder{color:var(--muted);opacity:1}.auth-layout>*,.topup-layout>*,.packages>*,.nav>*{min-width:0}
.tool-icon,html[data-theme="dark"] .tool-icon{background:var(--acid);color:#171714}.hero{position:relative;isolation:isolate;overflow:hidden}.hero:before{content:"";position:absolute;z-index:-2;inset:0;background-image:linear-gradient(color-mix(in srgb,var(--ink) 6%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--ink) 6%,transparent) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.86) 72%,transparent 100%)}.hero:after{content:"";position:absolute;z-index:-1;inset:-25%;pointer-events:none;background:radial-gradient(circle at 14% 25%,color-mix(in srgb,var(--acid) 18%,transparent) 0,transparent 28%),radial-gradient(circle at 82% 36%,color-mix(in srgb,var(--acid) 13%,transparent) 0,transparent 26%),radial-gradient(circle at 90% 85%,color-mix(in srgb,var(--acid) 9%,transparent) 0,transparent 24%);filter:blur(32px)}html[data-theme="dark"] .hero:before{background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px)}html[data-theme="dark"] .hero:after{background:radial-gradient(circle at 13% 25%,color-mix(in srgb,var(--acid) 17%,transparent) 0,transparent 29%),radial-gradient(circle at 76% 37%,color-mix(in srgb,var(--acid) 13%,transparent) 0,transparent 28%),radial-gradient(circle at 91% 86%,color-mix(in srgb,var(--acid) 9%,transparent) 0,transparent 24%);filter:blur(38px)}.drop:hover{background:color-mix(in srgb,var(--acid) 10%,var(--soft-2));border-color:var(--ink)}
.mobile-dock{display:none}
@media(max-width:900px){.nav-links,.wallet-pill{display:none}.menu-btn{display:block}.hero-grid,.topup-layout{grid-template-columns:1fr}.hero{padding-top:48px}.hero-panel{transform:none}.tool-grid{grid-template-columns:repeat(2,1fr)}.auth-layout{grid-template-columns:1fr}.cta{align-items:flex-start;flex-direction:column}.history-row{grid-template-columns:1.3fr .8fr .6fr}.history-row>*:nth-child(3){display:none}}
@media(max-width:600px){body{padding-bottom:82px}.shell{width:min(1180px,calc(100% - 20px))}.nav{min-height:62px;gap:10px}.brand{font-size:18px}.hero h1,.page-hero h1{font-size:48px}.section{padding:50px 0}.section-head{display:block}.section-head p{margin-top:10px}.tool-grid{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.cta{padding:28px}.packages{grid-template-columns:1fr 1fr}.history-row{grid-template-columns:1fr auto}.history-row>*:nth-child(2){display:none}.auth-card,.choice-card,.checkout,.panel{padding:20px}.footer{margin-bottom:8px}.mobile-dock{position:fixed;z-index:40;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));height:67px;padding:6px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;background:color-mix(in srgb,var(--card) 92%,transparent);border:1px solid var(--line);border-radius:18px;box-shadow:0 14px 45px rgba(0,0,0,.2);backdrop-filter:blur(16px)}.dock-item{min-width:0;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--muted);font-size:9px;font-weight:750}.dock-item i{font-style:normal;font-size:18px;line-height:1}.dock-item span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dock-item.active{background:var(--acid);color:#171714}.dock-item:active{transform:scale(.96)}}
.image-viewer{display:none;position:fixed;z-index:200;inset:0;background:#101214;color:#f5f3ec}.image-viewer.open{display:grid;grid-template-rows:62px minmax(0,1fr)}.viewer-bar{display:flex;align-items:center;gap:10px;padding:0 14px;border-bottom:1px solid #303438;background:#151719}.viewer-close{width:38px;height:38px;border:1px solid #373b3e;border-radius:10px;background:#242729;color:#fff;font-size:20px}.viewer-heading{min-width:0}.viewer-heading b,.viewer-heading small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.viewer-heading small{color:#8e9498;font-size:9px;margin-top:3px}.viewer-actions{margin-left:auto;display:flex;gap:7px}.viewer-actions button,.viewer-actions a{height:38px;padding:0 12px;border:1px solid #373b3e;border-radius:10px;background:#242729;color:#fff;display:flex;align-items:center;gap:7px;font-weight:800;font-size:11px}.viewer-actions .primary{background:var(--acid);border-color:var(--acid);color:#171714}.viewer-main{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 250px}.viewer-canvas{position:relative;min-width:0;min-height:0;overflow:hidden;display:grid;place-items:center;padding:28px;background-image:radial-gradient(circle,#41484d 1.4px,transparent 1.5px);background-size:46px 46px;touch-action:none}.viewer-stage{position:relative;display:grid;place-items:center;transform-origin:center;transition:transform .08s}.viewer-stage>img{display:block;max-width:min(75vw,1100px);max-height:calc(100vh - 130px);object-fit:contain;user-select:none}.viewer-original{display:none;position:absolute;inset:0;overflow:hidden;clip-path:inset(0 50% 0 0)}.viewer-original img{width:100%;height:100%;object-fit:fill}.viewer-stage.comparing .viewer-original,.viewer-stage.comparing~.viewer-range,.viewer-stage.comparing~.viewer-line{display:block}.viewer-range{display:none;position:absolute;z-index:3;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize}.viewer-line{display:none;position:absolute;z-index:2;left:50%;top:0;bottom:0;width:2px;background:var(--acid)}.viewer-zoom{position:absolute;bottom:12px;display:flex;align-items:center;gap:7px;padding:6px;border:1px solid #373b3e;border-radius:12px;background:#191c1e}.viewer-zoom button{width:31px;height:31px;border:0;border-radius:8px;background:#292d30;color:#fff}.viewer-zoom input{width:120px;accent-color:var(--acid)}.viewer-zoom output{width:40px;font-size:9px}.viewer-info{padding:21px;border-left:1px solid #303438;background:#151719}.viewer-info .tag{display:inline-block;border-color:#41464a}.viewer-info h3{font-size:20px;margin:18px 0 8px;word-break:break-word}.viewer-info p{color:#91979a;font-size:11px;line-height:1.6}.viewer-info button{width:100%;margin-top:9px}.viewer-delete{border:1px solid #633b35;background:transparent;color:#ef9a8c;border-radius:10px;padding:10px;font-weight:800}@media(max-width:700px){.image-viewer.open{grid-template-rows:56px minmax(0,1fr)}.viewer-bar{padding:0 8px}.viewer-heading{max-width:34vw}.viewer-actions span{display:none}.viewer-actions button,.viewer-actions a{width:38px;padding:0;justify-content:center}.viewer-main{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.viewer-info{padding:10px 13px;border-left:0;border-top:1px solid #303438}.viewer-info p{display:none}.viewer-info h3{font-size:14px;margin:8px 0}.viewer-stage>img{max-width:94vw;max-height:calc(100vh - 220px)}.viewer-canvas{padding:12px}.viewer-zoom input{width:80px}}
.demo-captcha{margin:12px 0;padding:13px;border:1px solid var(--line);border-radius:13px;background:var(--soft-2)}.captcha-label{display:flex;justify-content:space-between;gap:10px;margin-bottom:9px;color:var(--muted);font:800 9px ui-monospace,monospace;letter-spacing:.08em}.captcha-label em{color:var(--red);font-style:normal}.captcha-row{display:grid;grid-template-columns:126px 38px minmax(0,1fr);gap:7px}.captcha-code{position:relative;overflow:hidden;min-height:44px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--card);font:900 20px ui-monospace,monospace;letter-spacing:.18em;text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--acid) 80%,var(--ink));user-select:none}.captcha-code:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(17deg,transparent 0 8px,color-mix(in srgb,var(--ink) 7%,transparent) 9px 10px);pointer-events:none}.captcha-refresh{min-height:44px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font-size:18px;display:flex;justify-content:center;align-items:center}.captcha-input{min-width:0;width:100%;min-height:44px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);text-transform:uppercase;outline:0}.captcha-input:focus{border-color:var(--acid);box-shadow:0 0 0 3px color-mix(in srgb,var(--acid) 22%,transparent)}.captcha-hint{display:block;margin-top:8px;color:var(--muted);font-size:9px;line-height:1.45}.captcha-hint.locked{color:var(--red);font-weight:800}.lookup-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);gap:18px;align-items:start}.lookup-card,.lookup-result{padding:25px;border:1px solid var(--line);border-radius:21px;background:var(--card)}.lookup-card h2,.lookup-result h2{margin:0 0 7px;font-size:26px;letter-spacing:-.04em}.lookup-card>p,.lookup-result>p{margin:0 0 20px;color:var(--muted);font-size:13px;line-height:1.6}.lookup-fields{display:grid;grid-template-columns:1fr 170px;gap:9px}.lookup-fields .input{margin:0}.lookup-result{min-height:440px;display:grid;place-items:center}.lookup-empty{text-align:center;max-width:380px}.lookup-empty .tool-icon{margin:auto}.lookup-empty h3{font-size:22px;margin:17px 0 7px}.lookup-empty p{color:var(--muted);font-size:12px;line-height:1.6}.lookup-found{width:100%}.lookup-found-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding-bottom:18px;border-bottom:1px solid var(--line)}.lookup-found-head small,.lookup-fact span{display:block;color:var(--muted);font:750 9px ui-monospace,monospace;letter-spacing:.07em}.lookup-found-head h3{margin:5px 0 0;font:900 23px ui-monospace,monospace;letter-spacing:.03em}.lookup-status{padding:7px 10px;border-radius:99px;background:#dcefd8;color:#24642e;font-size:9px;font-weight:900}.lookup-status.expired{background:#f2d9d4;color:#87382c}.lookup-facts{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:18px}.lookup-fact{padding:14px;background:var(--soft-2);border-radius:12px}.lookup-fact b{display:block;margin-top:5px;font-size:13px;word-break:break-word}.lookup-security{margin-top:17px;padding:13px;border:1px dashed var(--line);border-radius:12px;color:var(--muted);font-size:10px;line-height:1.55}@media(max-width:800px){.lookup-layout{grid-template-columns:1fr}.lookup-result{min-height:330px}}@media(max-width:560px){.captcha-row{grid-template-columns:1fr 42px}.captcha-input{grid-column:1/-1}.lookup-fields,.lookup-facts{grid-template-columns:1fr}}
.lookup-modes{display:grid;grid-template-columns:1fr 1.35fr;gap:7px;padding:5px;margin-bottom:14px;border:1px solid var(--line);border-radius:13px;background:var(--soft-2)}.lookup-mode{min-height:42px;padding:8px 12px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-weight:850;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:8px}.lookup-mode .inline-ui-icon{width:14px;height:14px;flex-basis:14px}.lookup-mode.active{background:var(--ink);color:var(--paper);box-shadow:0 6px 18px rgba(0,0,0,.1)}.lookup-panel>.input{margin:0 0 9px}.lookup-panel[hidden]{display:none}.transfer-fields{margin-top:0}.lookup-field-hint{display:block;margin:9px 2px 2px;color:var(--muted);font-size:10px;line-height:1.5}@media(max-width:560px){.lookup-modes{grid-template-columns:1fr}.lookup-mode{min-height:39px}}
.google-login-modal{display:none;position:fixed;z-index:320;inset:0;padding:18px;background:rgba(15,16,16,.58);backdrop-filter:blur(11px);align-items:center;justify-content:center}.google-login-modal.open{display:flex}.google-login-card{position:relative;width:min(430px,100%);padding:27px;border:1px solid var(--line);border-radius:22px;background:var(--card);color:var(--ink);box-shadow:0 28px 90px rgba(0,0,0,.3);text-align:center}.google-login-close{position:absolute;right:13px;top:13px;width:35px;height:35px;border:1px solid var(--line);border-radius:10px;background:var(--soft);color:var(--ink);font-size:20px}.google-login-icon{width:58px;height:58px;margin:3px auto 17px;border-radius:17px;display:grid;place-items:center;background:#fff;border:1px solid var(--line)}
.google-login-icon svg{width:27px;height:27px;display:block}
.google-btn-g{display:inline-grid;place-items:center;width:21px;height:21px;flex:0 0 auto;border-radius:50%;background:#fff;vertical-align:-5px;margin-right:3px}
.google-btn-g svg{width:12px;height:12px;display:block}.google-login-card>small{color:var(--muted);font:850 9px ui-monospace,monospace;letter-spacing:.1em}.google-login-card h3{margin:8px 0 9px;font-size:27px;letter-spacing:-.045em}.google-login-card p{margin:0 0 22px;color:var(--muted);font-size:13px;line-height:1.6}.google-login-later{margin-top:13px;border:0;background:transparent;color:var(--muted);font-size:11px;font-weight:800}.google-login-later:hover{color:var(--ink);text-decoration:underline}@media(max-width:560px){.google-login-modal{padding:10px;align-items:flex-end}.google-login-card{padding:25px 20px 20px;border-radius:22px 22px 14px 14px}.google-login-card h3{font-size:24px}}
.account-section{padding-top:10px}.account-card{overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--card);box-shadow:var(--shadow)}.account-profile{display:grid;grid-template-columns:72px minmax(0,1fr) auto;align-items:center;gap:18px;padding:28px;border-bottom:1px solid var(--line)}.account-avatar{width:72px;height:72px;border-radius:21px;display:grid;place-items:center;background:var(--acid);color:#171714;font-size:30px;font-weight:950}.account-avatar.has-image{background-size:cover;background-position:center}.account-profile small,.account-stats small{color:var(--muted);font:800 9px ui-monospace,monospace;letter-spacing:.09em}.account-profile h2{margin:5px 0 3px;font-size:28px;letter-spacing:-.045em}.account-profile p{margin:0;color:var(--muted);font-size:13px;line-height:1.7;letter-spacing:.01em}.account-profile p+p{margin-top:2px}#accountUserId{letter-spacing:.04em}.account-status{padding:8px 10px;border-radius:99px;background:color-mix(in srgb,var(--green) 14%,var(--card));color:var(--green);font:900 9px ui-monospace,monospace}.account-stats{display:grid;grid-template-columns:1fr 1fr}.account-stats>div{padding:28px}.account-stats>div+div{border-left:1px solid var(--line)}.account-stats strong,.account-stats span{display:block}.account-stats strong{margin:8px 0 5px;font-size:30px;letter-spacing:-.045em}.account-stats span{color:var(--muted);font-size:11px}.account-actions{display:flex;justify-content:flex-end;gap:9px;padding:18px 28px;border-top:1px solid var(--line);background:var(--soft-2)}.account-gate{max-width:600px;margin:auto;padding:55px 24px;border:1px solid var(--line);border-radius:22px;background:var(--card);text-align:center}.account-gate .tool-icon{margin:auto}.account-gate h2{margin:18px 0 7px;font-size:29px}.account-gate p{margin:0 auto 22px;max-width:410px;color:var(--muted);line-height:1.6}@media(max-width:650px){.account-profile{grid-template-columns:58px 1fr;padding:20px;gap:13px}.account-avatar{width:58px;height:58px;border-radius:17px;font-size:24px}.account-profile h2{font-size:22px}.account-status{grid-column:1/-1;width:max-content}.account-stats{grid-template-columns:1fr}.account-stats>div{padding:21px}.account-stats>div+div{border-left:0;border-top:1px solid var(--line)}.account-stats strong{font-size:25px}.account-actions{padding:15px;flex-direction:column}.account-actions .btn{width:100%}}
.task-storage-notice{display:flex;align-items:center;gap:12px;margin:0 0 20px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--card)}.task-storage-notice>span{flex:0 0 auto;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--soft);font-size:18px}.task-storage-notice b,.task-storage-notice small{display:block}.task-storage-notice b{font-size:12px}.task-storage-notice small{margin-top:4px;color:var(--muted);font-size:10px;line-height:1.45}.task-storage-notice small a{color:var(--ink);font-weight:850;text-decoration:underline;text-decoration-color:var(--acid);text-decoration-thickness:2px;text-underline-offset:3px}.task-storage-notice.server{border-color:color-mix(in srgb,var(--acid) 42%,var(--line));background:color-mix(in srgb,var(--acid) 7%,var(--card))}.task-storage-notice.server>span{background:var(--acid);color:#171714}.task-storage-notice.local{border-style:dashed}.task-storage-notice.local>span{background:var(--acid);color:#171714}#upOutput .task-storage-notice,#toolOutput .task-storage-notice{margin-bottom:24px}@media(max-width:560px){.task-storage-notice{align-items:flex-start;padding:12px}.task-storage-notice>span{width:34px;height:34px}.task-storage-notice small{font-size:9px}}
.viewer-canvas{display:flex;align-items:center;justify-content:center}.viewer-stage{width:100%;height:100%;max-width:1100px;max-height:calc(100dvh - 118px);margin:auto}.viewer-stage>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;object-position:center center}.viewer-original img{object-fit:contain;object-position:center center}.viewer-zoom{z-index:5;left:50%;transform:translateX(-50%)}@media(max-width:700px){.viewer-canvas{padding:10px 10px 64px}.viewer-stage{width:100%;height:100%;max-width:100%;max-height:calc(100dvh - 190px)}.viewer-stage>img{max-width:none;max-height:none}.viewer-info{max-height:82px;overflow:hidden}}
.viewer-facts{display:grid;gap:0;margin:16px 0}.viewer-facts>div{padding:10px 0;border-top:1px solid #303438}.viewer-facts span,.viewer-facts b{display:block}.viewer-facts span{color:#777e82;font:750 8px ui-monospace,monospace;letter-spacing:.08em}.viewer-facts b{margin-top:5px;color:#f5f3ec;font-size:10px;line-height:1.35;word-break:break-word}#viewerErrorFact b{color:#ef9a8c}@media(max-width:700px){.viewer-info{max-height:154px;overflow:auto}.viewer-info .tag{font-size:7px}.viewer-info h3{margin:5px 0 7px}.viewer-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px;margin:0}.viewer-facts>div{padding:6px 0}.viewer-facts span{font-size:7px}.viewer-facts b{font-size:9px;margin-top:3px}.viewer-delete{display:none}}
.point-history{margin:24px;border:1px solid var(--line);border-radius:19px;background:var(--card);overflow:hidden;box-shadow:0 10px 28px color-mix(in srgb,var(--ink) 5%,transparent)}.point-history-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:22px 24px;border-bottom:1px solid var(--line)}.point-history-head small{font:800 9px ui-monospace,monospace;letter-spacing:.09em;color:var(--muted)}.point-history-head h2{margin:6px 0 0;font-size:24px}.point-history-head>span{color:var(--muted);font-size:11px;font-weight:750}.point-history-list{padding:0 24px}.point-history-row{display:grid;grid-template-columns:42px minmax(0,1fr) 155px 92px minmax(86px,auto);gap:13px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line)}.point-history-row:last-child{border-bottom:0}.point-history-icon{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:19px;font-weight:900}.point-history-icon.minus{background:var(--soft);color:var(--ink)}.point-history-icon.plus{background:var(--acid);color:#171714}.point-history-row b,.point-history-row small{display:block}.point-history-row b{font-size:12px}.point-history-row small{margin-top:4px;color:var(--muted);font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.point-history-row time{color:var(--muted);font-size:9px}.point-history-row strong{text-align:right;font-size:11px}.point-history-row strong.plus{color:var(--green)}.point-history-row strong.minus{color:var(--ink)}.point-history-row em{justify-self:end;padding:6px 8px;border-radius:99px;background:var(--soft);color:var(--muted);font:750 8px ui-monospace,monospace;font-style:normal;white-space:nowrap}.point-history-empty{padding:48px 20px;text-align:center}.point-history-empty span,.point-history-empty b,.point-history-empty small{display:block}.point-history-empty span{font-size:28px}.point-history-empty b{margin-top:11px}.point-history-empty small{margin-top:6px;color:var(--muted)}.point-pagination{display:flex;justify-content:center;gap:6px;padding:16px 20px;border-top:1px solid var(--line)}.point-pagination button{min-width:35px;height:35px;padding:0 9px;border:1px solid var(--line);border-radius:9px;background:var(--card);color:var(--ink);font-size:10px;font-weight:850}.point-pagination button.active{background:var(--ink);border-color:var(--ink);color:var(--paper)}.point-pagination button:disabled{opacity:.35}@media(max-width:760px){.point-history{margin:14px}.point-history-head{align-items:flex-start;padding:18px}.point-history-head h2{font-size:20px}.point-history-list{padding:0 16px}.point-history-row{grid-template-columns:34px minmax(0,1fr) auto;gap:4px 10px}.point-history-icon{grid-column:1;grid-row:1/3;width:30px;height:30px;border-radius:9px;font-size:15px}.point-history-row>div{grid-column:2;grid-row:1;min-width:0}.point-history-row strong{grid-column:3;grid-row:1;font-size:11px;white-space:nowrap;align-self:start}.point-history-row time{grid-column:2;grid-row:2;font-size:8px;align-self:center}.point-history-row em{grid-column:3;grid-row:2;justify-self:end;align-self:center;padding:4px 7px}.point-pagination{overflow-x:auto;justify-content:flex-start}}
html[data-theme="light"] .image-viewer{background:#efeee9;color:#171714}html[data-theme="light"] .viewer-bar,html[data-theme="light"] .viewer-info{background:#fbfaf6;border-color:#d8d5cc}html[data-theme="light"] .viewer-heading small,html[data-theme="light"] .viewer-info p{color:#77766f}html[data-theme="light"] .viewer-close,html[data-theme="light"] .viewer-actions button,html[data-theme="light"] .viewer-actions a{background:#f1efe9;border-color:#d8d5cc;color:#171714}html[data-theme="light"] .viewer-actions .primary{background:var(--acid);border-color:var(--acid);color:#171714}html[data-theme="light"] .viewer-canvas{background-color:#ebeae5;background-image:radial-gradient(circle,#c4c3bd 1.35px,transparent 1.5px)}html[data-theme="light"] .viewer-zoom{background:rgba(251,250,246,.94);border-color:#d2d0c8;color:#171714;box-shadow:0 10px 30px rgba(25,25,20,.1)}html[data-theme="light"] .viewer-zoom button{background:#e5e3dc;color:#171714}html[data-theme="light"] .viewer-facts>div{border-color:#dedcd5}html[data-theme="light"] .viewer-facts span{color:#7c7a73}html[data-theme="light"] .viewer-facts b{color:#171714}html[data-theme="light"] #viewerErrorFact b{color:#a33d31}html[data-theme="light"] .viewer-delete{border-color:#d8aaa2;color:#a33d31;background:#fff8f6}html[data-theme="light"] .viewer-info .tag{border-color:#cbc9c1;color:#171714;background:#f1efe9}
.viewer-canvas.can-pan{cursor:grab}.viewer-canvas.can-pan.dragging{cursor:grabbing}.viewer-canvas.dragging .viewer-stage{transition:none}.viewer-stage>img,.viewer-original img{-webkit-user-drag:none;pointer-events:none}
.viewer-loading{display:none;position:absolute;z-index:4;width:46px;height:46px;margin:-23px;left:50%;top:50%;border:4px solid rgba(255,255,255,.25);border-top-color:var(--acid);border-radius:50%;animation:viewerSpin .8s linear infinite}.viewer-stage.is-processing #viewerResult{filter:blur(10px) brightness(.55);transform:scale(1.03)}.viewer-stage.is-processing .viewer-loading{display:block}@keyframes viewerSpin{to{transform:rotate(360deg)}}
#viewerCompare.is-active{border-color:rgba(216,255,71,.7);box-shadow:inset 0 0 0 1px rgba(216,255,71,.7)}
html[data-theme="light"] #viewerCompare.is-active{border-color:rgba(23,23,20,.7);box-shadow:inset 0 0 0 1px rgba(23,23,20,.7)}
.viewer-actions button.is-loading{pointer-events:none;opacity:.75}.viewer-actions button.is-loading svg{display:none}.viewer-actions button.is-loading::before{content:'';width:15px;height:15px;flex:0 0 auto;border:2px solid color-mix(in srgb,currentColor 30%,transparent);border-top-color:var(--acid);border-radius:50%;animation:viewerSpin .8s linear infinite}.viewer-actions button.primary.is-loading::before{border-top-color:currentColor}
.viewer-close svg,.viewer-actions svg,.viewer-zoom svg{width:17px;height:17px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}.viewer-close .ui-svg{width:14px;height:14px;fill:currentColor;stroke:none;margin:auto}.viewer-close{display:grid;place-items:center}.viewer-zoom button{display:grid;place-items:center}@media(max-width:700px){.viewer-bar{gap:7px;overflow:hidden}.viewer-close{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:0 0 34px}.viewer-heading{width:0;min-width:0;max-width:none;flex:1 1 0;overflow:hidden}.viewer-heading b,.viewer-heading small{display:block;width:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewer-heading b{font-size:12px}.viewer-heading small{font-size:8px}.viewer-actions{min-width:max-content;flex:0 0 auto;margin-left:0;gap:5px}.viewer-actions button,.viewer-actions a{width:34px;height:34px;min-width:34px;padding:0;border-radius:10px}.viewer-actions svg{width:16px;height:16px}.viewer-actions .primary{width:38px;min-width:38px}}@media(max-width:430px){.viewer-bar{gap:5px;padding-left:6px;padding-right:6px}.viewer-close{width:32px;height:32px;flex-basis:32px}.viewer-actions{gap:4px}.viewer-actions button,.viewer-actions a{width:32px;height:32px;min-width:32px}.viewer-actions .primary{width:34px;min-width:34px}.viewer-heading b{font-size:11px}}
.hero-compare-meta .old-price,.hero-compare-meta .sale-price{display:inline-block}.hero-compare-meta .sale-price{color:var(--ink);font-weight:900}
.run .old-price{margin-right:-5px;color:#5d642d}.run .batch-old-price{margin-right:7px}.run .sale-price{color:#171714}
.viewer-line{pointer-events:none}.viewer-original{will-change:clip-path}.viewer-line:after{content:'';position:absolute;left:50%;top:50%;width:58px;height:58px;border-radius:50%;transform:translate(-50%,-50%);background-color:var(--acid);background-image:url('svgs/regular/arrows-left-right.svg');background-position:center;background-repeat:no-repeat;background-size:24px;box-shadow:0 9px 28px rgba(0,0,0,.32),0 0 0 4px rgba(216,255,71,.16)}@media(max-width:700px){.viewer-line:after{width:48px;height:48px;background-size:20px}}
.brand-name{white-space:nowrap}.brand-beta{align-self:center;margin:1px 0 0 -5px;padding:3px 6px;border:1px solid color-mix(in srgb,var(--acid) 65%,var(--line));border-radius:99px;background:color-mix(in srgb,var(--acid) 14%,var(--card));color:var(--ink);font:900 7px ui-monospace,monospace;letter-spacing:.08em;line-height:1}
.ui-svg{display:block;width:1em;height:1em;overflow:visible;fill:currentColor;stroke:none;pointer-events:none}.inline-ui-icon{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em;flex:0 0 1em;vertical-align:-.12em}.inline-ui-icon .ui-svg{width:100%;height:100%}.mark .ui-svg{width:17px;height:17px}.menu-btn .ui-svg,.theme-btn .ui-svg{width:18px;height:18px;margin:auto}.tool-icon .ui-svg{width:46%;height:46%}.action-icon .ui-svg,.editor-tool>i .ui-svg{width:18px;height:18px;margin:auto}.dock-item>i .ui-svg{width:18px;height:18px;margin:auto}.task-storage-notice>span .ui-svg{width:18px;height:18px}.point-history-icon .ui-svg{width:17px;height:17px}.vibe-confirm-icon .ui-svg{width:22px;height:22px}.google-login-close .ui-svg,.history-drawer-head>button .ui-svg,.model-close .ui-svg,.batch-manager-head>button .ui-svg,.batch-file>button .ui-svg{width:14px;height:14px;margin:auto}.editor-zoom>button .ui-svg,.viewer-zoom>button .ui-svg,.zoom-box>button .ui-svg{width:13px;height:13px;margin:auto}.bulk-exit{display:inline-flex;align-items:center;justify-content:center}.bulk-exit .ui-svg{width:12px;height:12px;margin:auto}.detail-bar .back .ui-svg{width:17px;height:17px;margin:auto}.btn .inline-ui-icon,.text-link .inline-ui-icon{font-size:.9em}.btn-acid .ui-svg,.mark .ui-svg,.tool-icon .ui-svg{color:inherit}
.trust span:before{content:'';display:inline-block;width:19px;height:19px;margin-right:7px;vertical-align:-5px;border:0;background:currentColor;mask:url('svgs/regular/circle-check.svg') center/contain no-repeat;-webkit-mask:url('svgs/regular/circle-check.svg') center/contain no-repeat}.hero-compare-line:after{content:'';background-color:var(--acid);background-image:url('svgs/regular/arrows-left-right.svg');background-position:center;background-repeat:no-repeat;background-size:18px}
@media(max-width:600px){body{padding-bottom:calc(78px + env(safe-area-inset-bottom))}.mobile-dock{left:0;right:0;bottom:0;height:calc(70px + env(safe-area-inset-bottom));padding:7px 6px max(6px,env(safe-area-inset-bottom));gap:0;background:var(--card);border:1px solid var(--line);border-bottom:0;border-radius:24px 24px 0 0;box-shadow:0 -8px 28px rgba(23,23,20,.11);backdrop-filter:none}.dock-item{position:relative;padding-top:4px;border-radius:0;gap:3px;font-size:9px;font-weight:850}.dock-item i{font-size:20px}.dock-item>i .ui-svg{width:20px;height:20px}.dock-item.active{background:transparent;color:var(--ink)}.dock-item.active:before{content:'';position:absolute;top:-8px;left:50%;width:36px;height:3px;border-radius:0 0 4px 4px;background:var(--acid);transform:translateX(-50%)}.dock-item:active{background:var(--soft);transform:none}}
.mobile-balance-pill{display:none}@media(max-width:600px){.mobile-balance-pill{height:27px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;border:1px solid color-mix(in srgb,var(--acid) 65%,var(--line));border-radius:99px;background:color-mix(in srgb,var(--acid) 16%,var(--card));color:var(--ink);white-space:nowrap}.mobile-balance-pill:before{content:'';width:6px;height:6px;margin-right:6px;border-radius:50%;background:var(--acid);box-shadow:0 0 0 3px color-mix(in srgb,var(--acid) 18%,transparent)}.mobile-balance-pill b{font:900 10px ui-monospace,SFMono-Regular,monospace}.mobile-balance-pill:active{transform:scale(.96)}}@media(max-width:390px){.mobile-balance-pill{padding:0 8px}.mobile-balance-pill:before{display:none}}
@media(max-width:600px){.dock-item,.dock-item:active,.dock-item:focus{background:transparent;transform:none;-webkit-tap-highlight-color:transparent}.dock-item:focus-visible{outline:none}}
.brand,.brand:active,.brand:focus{background:transparent;-webkit-tap-highlight-color:transparent}
@media(max-width:900px){.theme-btn{display:none}.mobile-theme-btn{width:100%;padding:10px 11px;border:0;border-radius:8px;background:transparent;color:var(--ink);display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px;text-align:left;-webkit-tap-highlight-color:transparent}.mobile-theme-btn:hover{background:var(--soft)}.mobile-theme-btn i{width:20px;height:20px;margin-left:auto;display:grid;place-items:center;font-style:normal}.mobile-theme-btn .ui-svg{width:18px;height:18px}.mobile-theme-btn:active{background:transparent}}
button,input,select,textarea{color:inherit}a[x-apple-data-detectors]{color:inherit!important;text-decoration:none!important;font:inherit!important}

/* Trang chủ không dùng ảnh hero: giữ nội dung thành một cột gọn hơn. */
.hero-grid{grid-template-columns:minmax(0,820px);gap:0}
.hero h1{max-width:780px;font-size:clamp(44px,5.2vw,68px);line-height:.98;letter-spacing:-.065em}
@media(max-width:600px){.hero h1{font-size:clamp(36px,11vw,44px);line-height:1}}

/* Khối công cụ nổi bật trên trang chủ. */
.featured-tools-section{padding:48px 0}
.featured-tools-section .section-head{align-items:center;margin-bottom:20px}
.featured-tools-section .section-head h2{font-size:clamp(30px,3.4vw,44px)}
.featured-tools-section .section-head p{max-width:390px;font-size:13px;line-height:1.5}
.featured-tools-section .tool-grid{gap:12px}
.featured-tools-section .tool-card{min-height:210px;padding:18px;border-radius:16px}
@media(hover:hover) and (pointer:fine){.featured-tools-section .tool-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(39,34,23,.08)}}
.featured-tools-section .tool-card .tool-icon{width:44px;height:44px;border-radius:11px}
.featured-tools-section .tool-card h3{margin:18px 0 6px;font-size:19px}
.featured-tools-section .tool-card p{margin-bottom:16px;font-size:12px;line-height:1.5}
.featured-tools-section .tag{padding:5px 7px;font-size:9px}
.featured-tools-section .ai-model-list{gap:5px;margin:-4px 0 13px}
.featured-tools-section .ai-model-list span{padding:5px 7px;font-size:8px}
.featured-tools-section .text-link{font-size:12px}
.featured-tools-section .tool-footer>span{font-size:11px}
.featured-tools-actions{margin-top:18px}
.featured-tools-actions .btn{padding:11px 14px;font-size:12px}
@media(max-width:600px){.featured-tools-section{padding:40px 0}.featured-tools-section .section-head{margin-bottom:16px}.featured-tools-section .section-head p{margin-top:7px}.featured-tools-section .tool-card{min-height:190px}.featured-tools-actions{margin-top:14px}.featured-tools-actions .btn{width:100%}}

/* Tài khoản là luồng chính; TCode chỉ là mã quà tặng sau khi đăng nhập. */
.auth-layout-single{grid-template-columns:minmax(0,560px);justify-content:center}
.topup-account-card{cursor:default}.topup-account-card.active{outline:0}
.custom-topup.invalid{border-color:var(--red);box-shadow:0 0 0 1px var(--red)}
.topup-hero{text-align:center;display:flex;flex-direction:column;align-items:center;padding-bottom:24px}.topup-hero h1{max-width:850px}.topup-hero .lead{max-width:640px}.topup-section{padding-top:18px}.topup-checkout{width:min(820px,100%);margin:auto;padding:0;overflow:hidden;border-radius:26px;box-shadow:var(--shadow)}.topup-account-line{display:flex;align-items:center;gap:13px;padding:16px 28px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--acid) 9%,var(--card))}.topup-account-icon{width:38px;height:38px;flex:0 0 38px;border-radius:11px;display:grid;place-items:center;background:var(--card);border:1px solid var(--line);font-weight:950}.topup-account-line div{min-width:0}.topup-account-line small,.topup-account-line b{display:block}.topup-account-line small{margin-bottom:3px;color:var(--muted);font:800 8px ui-monospace,monospace;letter-spacing:.1em}.topup-account-line b{font-size:13px}.topup-account-status{margin-left:auto;padding:6px 9px;border-radius:99px;background:var(--acid);color:#171714;font:900 8px ui-monospace,monospace;letter-spacing:.06em}.topup-step{padding:30px 34px;border-bottom:1px solid var(--line)}.topup-step-final{border-bottom:0}.topup-step-head{display:flex;align-items:center;gap:13px;margin-bottom:20px}.topup-step-number{width:35px;height:35px;flex:0 0 35px;border-radius:11px;display:grid;place-items:center;background:var(--ink);color:var(--paper);font-weight:950}.topup-step-head h2{margin:0 0 3px;font-size:20px;letter-spacing:-.035em}.topup-step-head p{margin:0;color:var(--muted);font-size:11px}.topup-checkout .packages{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 10px}.topup-checkout .package{min-height:80px;padding:15px 17px;border-radius:14px;text-align:left;transition:transform .16s,border-color .16s,background .16s}@media(hover:hover) and (pointer:fine){.topup-checkout .package:hover{transform:translateY(-2px);border-color:var(--muted)}}.topup-checkout .package.active{background:color-mix(in srgb,var(--acid) 18%,var(--card));color:var(--ink);border:2px solid var(--ink);padding:14px 16px}.topup-checkout .package b{font-size:19px;letter-spacing:-.025em}.topup-checkout .package small{display:block;margin-top:6px;font-size:10px}.topup-checkout .package.active small{color:var(--muted);opacity:1}.custom-topup{min-height:54px;padding:8px 14px 8px 17px;border:1px solid var(--line);border-radius:14px;background:var(--soft-2);display:flex;align-items:center;justify-content:space-between;gap:15px;color:var(--muted);font-size:12px;font-weight:750}.custom-topup:focus-within{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}.custom-topup-field{display:flex;align-items:center;gap:7px;color:var(--ink)}.custom-topup input{width:130px;padding:7px 0;border:0;outline:0;background:transparent;color:var(--ink);text-align:right;font-weight:900}.custom-topup input::placeholder{color:var(--muted);font-weight:650}.custom-topup input::-webkit-inner-spin-button{display:none}.topup-checkout .checkout-total{margin-top:14px;padding:17px 19px;border:1px solid color-mix(in srgb,var(--ink) 25%,var(--line));border-radius:15px;background:var(--soft);align-items:center}.topup-checkout .checkout-total>div{display:flex;flex-direction:column}.topup-checkout .checkout-total>div:last-child{text-align:right}.topup-checkout .checkout-total small{margin-bottom:5px;color:var(--muted);font:800 8px ui-monospace,monospace;letter-spacing:.09em}.topup-checkout .checkout-total b{font-size:23px;letter-spacing:-.035em}.checkout-total-arrow{display:grid;place-items:center;color:var(--muted)}
.checkout-total-arrow .ui-svg{width:14px;height:14px}.topup-payment-method{min-height:76px;padding:14px 16px;border:1px solid var(--line);border-radius:15px;background:var(--soft-2);display:flex;align-items:center;gap:13px}.topup-payment-method.active{border:2px solid var(--ink);padding:13px 15px}.topup-method-icon{width:44px;height:44px;flex:0 0 44px;border-radius:12px;display:grid;place-items:center;background:var(--acid);color:#171714;font-size:21px;font-weight:950}.topup-payment-method b,.topup-payment-method small{display:block}.topup-payment-method b{font-size:14px}.topup-payment-method small{margin-top:4px;color:var(--muted);font-size:10px}.topup-method-check{width:25px;height:25px;flex:none;margin-left:auto;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--paper);font-size:11px;font-weight:950}.topup-step-final .warning{margin:0 0 13px}.pay-note{background:var(--soft-2);border:1px solid var(--line);border-radius:12px;padding:14px 15px;font-size:12px;line-height:1.7;margin:14px 0;color:var(--ink)}.pay-note b,.pay-note strong{color:var(--ink)}.pay-note.pay-note-accent{border-color:color-mix(in srgb,var(--acid) 55%,var(--line));background:color-mix(in srgb,var(--acid) 12%,var(--soft-2))}.pay-note.pay-note-warn{border-color:color-mix(in srgb,var(--red) 45%,var(--line));background:color-mix(in srgb,var(--red) 8%,var(--soft-2));color:var(--red)}.pay-note.pay-note-warn b{color:inherit}.topup-step-final .pay-note{margin:0 0 13px}.payment-modal-card .pay-note{margin:16px 0 0;text-align:left;font-size:11px}.topup-submit{min-height:54px;border-radius:13px;font-size:15px}.topup-submit:disabled{cursor:wait;opacity:.7;transform:none}.topup-checkout .qr-wrap{margin-top:18px;padding:22px;border:1px solid var(--line);border-radius:17px;background:var(--soft-2)}.topup-checkout .qr{border-radius:13px;overflow:hidden}.topup-checkout .qr-wrap>p{font-size:11px}.topup-security{margin:16px 0 0;text-align:center;color:var(--muted);font-size:10px}.topup-security:first-letter{color:var(--green)}
.promo-bar{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;padding:3px 50px;background:#171714;color:var(--acid);font-size:12px;font-weight:750;text-align:center}
.promo-bar[hidden]{display:none}
.promo-bar p{margin:0;min-width:0}
.promo-bar b{font-weight:900}
.promo-cta{flex:none;padding:3px 11px;border-radius:99px;background:var(--acid);color:#171714;font-size:11px;font-weight:900;line-height:1.35;white-space:nowrap;text-decoration:none;transition:opacity .15s}
.promo-cta:hover{opacity:.85}
.live-dot{position:relative;flex:none;width:8px;height:8px;border-radius:50%;background:currentColor}
.live-dot::before{content:"";position:absolute;inset:0;border-radius:50%;background:currentColor;animation:live-ping 1.6s cubic-bezier(0,0,.2,1) infinite}
@keyframes live-ping{0%{transform:scale(1);opacity:.7}70%,100%{transform:scale(2.6);opacity:0}}
@media(prefers-reduced-motion:reduce){.live-dot::before{animation:none}}
.promo-bar button{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:0;border-radius:7px;background:color-mix(in srgb,var(--acid) 16%,transparent);color:var(--acid);display:grid;place-items:center;cursor:pointer;transition:background .15s,color .15s}
/* xmark.svg có viewBox 384x512 (không vuông): ép vào ô vuông thì browser tự canh giữa với lề lẻ
   (13px -> glyph 9.75px, lề 1.625px) khiến nét X bị mờ/lệch. Giữ đúng tỉ lệ 3:4 để không letterbox. */
.promo-bar button .ui-svg{width:12px;height:16px;margin:auto}
.promo-bar button:hover{background:var(--acid);color:#171714}
html[data-theme="dark"] .promo-bar{background:var(--acid);color:#171714}
html[data-theme="dark"] .promo-bar button{background:rgba(23,23,20,.14);color:#171714}
html[data-theme="dark"] .promo-bar button:hover{background:#171714;color:var(--acid)}
html[data-theme="dark"] .promo-cta{background:#171714;color:var(--acid)}
@media(max-width:760px){
  .promo-bar{justify-content:flex-start;text-align:left;font-size:11px;gap:7px;padding:3px 38px 3px 12px}
  .promo-cta{padding:3px 9px;font-size:10px}
}
@media(max-width:420px){
  .promo-bar{gap:6px;padding-left:10px}
  .promo-bar p{font-size:10px;line-height:1.4}
  .promo-cta{padding:4px 9px}
}
.topup-transfer{display:grid;grid-template-columns:260px minmax(0,1fr);gap:18px;align-items:stretch}
.topup-qr-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:22px 16px;border:1px solid var(--line);border-radius:17px;background:var(--soft-2);text-align:center}
.topup-qr-card>small{font:800 8px ui-monospace,monospace;letter-spacing:.1em;color:var(--muted)}
.topup-qr-card .payment-qr-frame{margin:0;width:min(180px,55vw)}
.topup-qr-amount{font-size:18px;letter-spacing:-.02em}
.topup-qr-hint{color:var(--muted);font-size:10px}
.topup-transfer-info{display:flex;flex-direction:column;gap:10px}
.payment-copy-mini .ui-svg{width:13px;height:13px;margin:auto}
.payment-copy-mini{transition:background .15s,color .15s}
.payment-copy-mini:hover{background:var(--ink);color:var(--paper)}
.topup-transfer-info .payment-bank-info{margin:0}
.topup-transfer-info .pay-note{margin:0}
.topup-rules{margin:2px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:11px;line-height:1.6}
.topup-rules li{position:relative;padding-left:17px}
.topup-rules li::before{content:'✓';position:absolute;left:0;color:var(--green);font-weight:900}
.topup-rules b{color:var(--ink)}
.topup-watch{display:flex;align-items:center;justify-content:center;gap:9px;margin:18px 0 0;color:var(--muted);font-size:10px;font-weight:750}
.topup-watch i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--acid);box-shadow:0 0 0 4px color-mix(in srgb,var(--acid) 20%,transparent);animation:paymentPulse 1.4s infinite}
.topup-watch.paid{color:var(--green)}
.topup-watch.paid i{background:var(--green);box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 20%,transparent);animation:none}
@media(max-width:760px){.topup-transfer{grid-template-columns:1fr}}
@media(max-width:600px){.topup-hero{padding-top:38px;padding-bottom:10px}.topup-hero h1{font-size:44px}.topup-hero .lead{font-size:14px}.topup-section{padding-top:12px}.topup-checkout{border-radius:21px}.topup-account-line{padding:14px 17px}.topup-account-status{display:none}.topup-step{padding:24px 18px}.topup-step-head{align-items:flex-start}.topup-step-head h2{font-size:18px}.topup-checkout .packages{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.topup-checkout .package{min-height:74px}.custom-topup{align-items:flex-start;flex-direction:column;gap:3px}.custom-topup-field{width:100%;justify-content:space-between}.custom-topup input{width:100%;text-align:left}.topup-checkout .checkout-total{padding:14px}.topup-checkout .checkout-total b{font-size:19px}.topup-checkout .qr-wrap{padding:17px}.topup-checkout .qr{width:170px;height:170px}}
.tcode-redeem-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:22px;align-items:center;padding:24px 28px;border-top:1px solid var(--line);background:color-mix(in srgb,var(--acid) 8%,var(--card))}
.tcode-redeem-card small{color:var(--muted);font:850 9px ui-monospace,monospace;letter-spacing:.09em}.tcode-redeem-card h2{margin:6px 0;font-size:22px;letter-spacing:-.035em}.tcode-redeem-card p{max-width:580px;margin:0;color:var(--muted);font-size:12px;line-height:1.55}.tcode-redeem-card form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.tcode-redeem-card .input{margin:0;text-transform:uppercase}.tcode-redeem-card .btn{height:47px;white-space:nowrap}.tcode-redeem-card #tcodeRedeemStatus{grid-column:1/-1}.tcode-redeem-card #tcodeRedeemStatus:empty{display:none}.tcode-redeem-card #tcodeRedeemStatus .warning{margin:0}
@media(max-width:700px){.tcode-redeem-card{grid-template-columns:1fr;padding:20px;gap:16px}.tcode-redeem-card form{grid-template-columns:1fr}.tcode-redeem-card .btn{width:100%}}

/* Điều hướng khi chưa đăng nhập. */
body.auth-pending .auth-only-nav,body.is-guest .auth-only-nav{display:none!important}body.auth-pending .wallet-pill b,body.is-guest .wallet-pill b{display:none}body.auth-pending .mobile-balance-pill,body.is-guest .mobile-balance-pill{display:none!important}
.task-badge{position:absolute;z-index:2;height:18px;min-width:18px;padding:0 5px;border-radius:99px;background:var(--acid);color:#171714;font:800 9.5px/1 ui-monospace,monospace;display:flex;align-items:center;justify-content:center;gap:3px;border:2px solid var(--card);box-shadow:0 3px 10px rgba(23,23,20,.22)}.task-badge.running{animation:dockBadgePulse 1.6s ease-out infinite}.task-badge.running:before{content:'';width:8px;height:8px;flex:0 0 8px;border-radius:50%;border:2px solid rgba(23,23,20,.16);border-top-color:#171714;animation:dockBadgeSpin .75s linear infinite}.task-badge[hidden]{display:none}.nav-links a{position:relative}.nav-task-badge{top:-4px;right:-5px}
/* Badge "+5 Xu" mời làm khảo sát. Không dùng chung .task-badge vì badge tác vụ có biến thể
   .running (spinner) và bị JS đếm task điều khiển — đây chỉ là nhãn tĩnh, site.js gỡ hẳn
   khi account-me trả survey_bonus_pending=false (đã nhận thưởng rồi thì thôi mời nữa).
   Nằm INLINE cạnh chữ chứ không position:absolute như .task-badge: .nav-links a có
   padding 10px/12px nên badge treo góc bị đẩy ra ngoài phần chữ, trông rời rạc và đè sang
   wallet-pill (gap giữa các link chỉ 4px). Inline thì hộp link tự nới, không bao giờ chồng. */
.nav-gift-badge{display:inline-flex;align-items:center;margin-left:6px;height:17px;padding:0 6px;border-radius:99px;background:var(--acid);color:#171714;font-size:9.5px;font-weight:800;letter-spacing:.01em;white-space:nowrap;vertical-align:middle;pointer-events:none}
@media(max-width:600px){.dock-badge{top:0;left:calc(50% + 4px)}}@keyframes dockBadgePulse{0%{box-shadow:0 3px 10px rgba(23,23,20,.22),0 0 0 0 color-mix(in srgb,var(--acid) 55%,transparent)}100%{box-shadow:0 3px 10px rgba(23,23,20,.22),0 0 0 7px transparent}}@keyframes dockBadgeSpin{to{transform:rotate(360deg)}}

/* FAQ trang chủ. */
.home-faq-grid{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:70px;align-items:start}.home-faq-copy{position:sticky;top:110px}.home-faq-copy h2{margin:0;font-size:clamp(38px,5vw,58px);line-height:.95;letter-spacing:-.06em}.home-faq-copy h2 em{font-family:'Palatino Linotype',Georgia,serif;font-weight:400}.home-faq-copy p{max-width:360px;margin:18px 0 0;color:var(--muted);font-size:14px;line-height:1.6}.home-faq .faq-list{border-top:1px solid var(--line)}.home-faq .faq-item{border-bottom:1px solid var(--line)}.home-faq .faq-question{width:100%;padding:20px 0;border:0;background:transparent;color:var(--ink);display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:left;font-weight:850}.home-faq .faq-question i{width:27px;height:27px;flex:0 0 27px;border-radius:50%;display:grid;place-items:center;background:var(--soft);font-style:normal;transition:transform .2s,background .2s}.home-faq .faq-item.open .faq-question i{transform:rotate(45deg);background:var(--acid);color:#171714}.home-faq .faq-answer{display:none;padding:0 42px 20px 0;color:var(--muted);font-size:13px;line-height:1.65}
@media(max-width:760px){.home-faq-grid{grid-template-columns:1fr;gap:30px}.home-faq-copy{position:static}.home-faq-copy h2{font-size:40px}.home-faq-copy p{margin-top:12px}.home-faq .faq-question{padding:17px 0}.home-faq .faq-answer{padding-right:20px}}

/* Modal thanh toán SePay. */
.topup-checkout .package{position:relative}.package-bonus{position:absolute;top:8px;right:8px;padding:4px 6px;border-radius:99px;background:var(--acid);color:#171714;font:900 8px ui-monospace,monospace;font-style:normal}.checkout-bonus{margin-top:3px;color:var(--green);font-size:9px;font-weight:850;font-style:normal}.payment-modal-reward{display:block;width:max-content;max-width:100%;margin:-14px auto 21px;padding:7px 10px;border-radius:99px;background:color-mix(in srgb,var(--acid) 18%,var(--soft));color:var(--ink);font-size:10px;font-weight:850}
.payment-modal{display:none;position:fixed;z-index:350;inset:0;padding:24px;overflow:hidden;background:rgba(10,10,8,.72);backdrop-filter:blur(12px);align-items:center;justify-content:center}.payment-modal.open{display:flex}.payment-modal-card{position:relative;width:min(570px,100%);max-height:calc(100dvh - 48px);overflow-y:auto;margin:auto;padding:26px 34px;border:1px solid var(--line);border-radius:27px;background:var(--card);color:var(--ink);box-shadow:0 32px 100px rgba(0,0,0,.38);text-align:center}.payment-modal-close{position:absolute;top:18px;right:18px;width:42px;height:42px;border:1px solid var(--line);border-radius:13px;background:var(--soft);color:var(--muted);display:grid;place-items:center;font-size:21px;font-weight:800}.payment-modal-icon{width:34px;height:34px;margin:0 auto 8px;border-radius:50%;display:grid;place-items:center;background:var(--acid);color:#171714;font-size:16px;font-weight:950}.payment-modal-card h2{margin:0 0 7px;font-size:19px;letter-spacing:-.045em}.payment-countdown{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--line);border-radius:99px;background:var(--soft);color:var(--muted);font:850 11px ui-monospace,monospace}.payment-countdown:before{content:'◷';color:var(--ink);font-size:15px}.payment-qr-frame{position:relative;width:min(190px,42dvh);aspect-ratio:1;margin:12px auto 10px;border:4px solid var(--ink);border-radius:21px;overflow:hidden;background:#fff;display:grid;place-items:center}.payment-qr-frame img{position:relative;z-index:1;width:100%;height:100%;display:block;object-fit:contain}.payment-qr-loading{position:absolute;inset:0;display:grid;place-items:center;padding:25px;color:#777;font-size:12px}.payment-modal-amount{display:block;margin:0 0 16px;font-size:29px;letter-spacing:-.045em;text-decoration:underline;text-decoration-color:var(--acid);text-decoration-thickness:6px;text-underline-offset:-2px}.payment-bank-info{overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--soft-2);text-align:left}.payment-bank-info>div{min-height:40px;padding:7px 15px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line)}.payment-bank-info>div:last-child{border-bottom:0}.payment-bank-info span{color:var(--muted);font-size:12px}.payment-bank-info b{min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:7px;color:var(--ink);font-size:13px;text-align:right;overflow-wrap:anywhere}.payment-bank-info b>span{color:inherit;font-size:inherit}.payment-bank-info>div:last-child b,.payment-bank-info>div:last-child b>span{color:var(--green)}.payment-bank-logo{width:20px;height:20px;flex:0 0 20px;border-radius:5px;object-fit:contain;background:#fff;border:1px solid var(--line)}.payment-copy-mini{width:26px;height:26px;flex:0 0 26px;padding:0;border:0;border-radius:7px;background:var(--soft);color:var(--muted);display:grid;place-items:center}.payment-modal-actions{display:grid;grid-template-columns:.8fr .9fr 1.25fr;gap:8px;margin-top:14px}.payment-modal-actions .btn{min-width:0;padding:12px 8px;border-radius:12px;font-size:11px}.payment-waiting{width:100%;min-height:50px;margin-top:14px;border:1px solid color-mix(in srgb,var(--ink) 25%,var(--line));border-radius:13px;background:color-mix(in srgb,var(--acid) 10%,var(--soft));color:var(--muted);display:flex;align-items:center;justify-content:center;gap:9px;font-weight:800}.payment-waiting i{width:8px;height:8px;border-radius:50%;background:var(--acid);box-shadow:0 0 0 4px color-mix(in srgb,var(--acid) 20%,transparent);animation:paymentPulse 1.4s infinite}.payment-waiting.paid{border-color:var(--green);color:var(--green)}.payment-waiting.paid i{background:var(--green);animation:none}.custom-topup.invalid{border-color:var(--red);box-shadow:0 0 0 1px var(--red)}@keyframes paymentPulse{50%{opacity:.35;transform:scale(.75)}}
@media(max-width:600px){.payment-modal{padding:10px}.payment-modal-card{padding:26px 16px 20px;border-radius:22px}.payment-modal-close{top:13px;right:13px;width:38px;height:38px}.payment-modal-icon{width:50px;height:50px;border-radius:15px;margin-bottom:14px}.payment-modal-card h2{font-size:23px}.payment-qr-frame{width:min(190px,60vw);margin-top:14px}.payment-modal-amount{font-size:29px}.payment-bank-info>div{min-height:38px;padding:6px 12px}.payment-bank-info span{font-size:10px}.payment-bank-info b{font-size:11px}.payment-modal-actions{grid-template-columns:1fr 1fr}.payment-modal-actions .btn:last-child{grid-column:1/-1}.payment-waiting{min-height:46px}}

/* Giá gạch trong pill (eyebrow hero, tag thẻ công cụ): bỏ dấu chéo xoay (bị giãn xấu với
   monospace + letter-spacing), thay bằng line-through nhỏ gọn, mờ hơn giá bán. */
.eyebrow span .old-price,.tag .old-price{margin:0 3px 0 0;color:color-mix(in srgb,currentColor 52%,transparent);letter-spacing:.02em;text-decoration:line-through;text-decoration-thickness:1.5px}
.eyebrow span .sale-price,.tag .sale-price{letter-spacing:.02em}
.eyebrow span:has(.old-price),.eyebrow span:has(.sale-price){letter-spacing:.05em}
.eyebrow span .old-price:after,.tag .old-price:after{content:none}
.eyebrow span .sale-price{color:#171714;font-weight:900}
.tag .sale-price{color:var(--ink);font-weight:900}
.point-history-loading{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:10px;font-weight:750}.point-history-loading i{width:14px;height:14px;border:2px solid var(--line);border-top-color:var(--acid);border-radius:50%;animation:pointHistorySpin .8s linear infinite}@keyframes pointHistorySpin{to{transform:rotate(360deg)}}
.footer-links{display:flex;gap:5px 18px;flex-wrap:wrap;justify-content:center}.footer-links a{color:var(--muted);font-weight:750}.footer-links a:hover{color:var(--ink);text-decoration:underline}
@media(max-width:600px){.footer-row{flex-direction:column;align-items:center;gap:9px;text-align:center}}

/* Nút đăng nhập Facebook (trang đăng nhập) — cùng bố cục với nút Google */
.btn-facebook{background:#1877f2;color:#fff}.btn-facebook:hover{background:#1567d3;color:#fff}
.fb-btn-f{display:inline-grid;place-items:center;width:21px;height:21px;flex:0 0 auto;border-radius:50%;background:#0f5cc7;vertical-align:-5px;margin-right:3px}.fb-btn-f svg{width:13px;height:13px;display:block}

/* ===== Giới thiệu bạn bè (/moi-ban-be + thẻ ở /tai-khoan) + dropdown tài khoản trên nav */
.nav{position:relative}
.account-menu{position:absolute;top:calc(100% - 8px);right:0;z-index:60;min-width:208px;padding:7px;border:1px solid var(--line);border-radius:16px;background:var(--card);box-shadow:var(--shadow);display:flex;flex-direction:column;gap:2px}
.account-menu[hidden]{display:none}
.account-menu a,.account-menu button{display:flex;align-items:center;gap:8px;padding:10px 13px;border:0;border-radius:10px;background:transparent;color:var(--ink);font-family:inherit;font-size:13px;font-weight:700;text-align:left;cursor:pointer;text-decoration:none}
.account-menu a:hover,.account-menu button:hover{background:var(--soft-2)}
.account-menu #accountMenuLogout{color:var(--red);border-top:1px solid var(--line);border-radius:0 0 10px 10px;margin-top:4px;padding-top:12px}
.ref-share-block{padding:28px;border-bottom:1px solid var(--line)}
.ref-share-block small{color:var(--muted);font:850 9px ui-monospace,monospace;letter-spacing:.09em}
.ref-link-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:10px 0 12px}
.ref-link-row .input{margin:0;font-size:13px}
.ref-share-row{display:flex;flex-wrap:wrap;gap:8px}
.ref-code-line{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin:16px 0 0;color:var(--muted);font-size:13px}
.ref-code-line b{color:var(--ink);font-size:15px;letter-spacing:.05em}
.btn-mini{padding:6px 10px;font-size:11px}
.ref-note-line{margin:12px 0 0;color:var(--muted);font-size:12px}
.ref-note{margin:0;padding:14px 28px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}
.ref-note b{color:var(--ink)}
.ref-account-card .ref-account-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.ref-redeem-label{grid-column:1/-1;color:var(--muted);font-size:12px;line-height:1.5}
.tcode-redeem-card #refRedeemStatus{grid-column:1/-1}.tcode-redeem-card #refRedeemStatus:empty{display:none}.tcode-redeem-card #refRedeemStatus .warning{margin:0}
@media(max-width:700px){.ref-share-block{padding:20px}.ref-link-row{grid-template-columns:1fr}.ref-share-row .btn{flex:1 1 calc(50% - 8px);justify-content:center}.ref-note{padding:14px 20px}}

/* ===== Modal "hết Xu": 3 cách có thêm Xu (nạp / khảo sát / mời bạn) — site.js dựng #xuModal */
.xu-modal{display:none;position:fixed;z-index:320;inset:0;padding:18px;background:rgba(15,16,16,.58);backdrop-filter:blur(11px);align-items:center;justify-content:center}
.xu-modal.open{display:flex}
.xu-modal-card{position:relative;width:min(470px,100%);padding:27px;border:1px solid var(--line);border-radius:22px;background:var(--card);color:var(--ink);box-shadow:0 28px 90px rgba(0,0,0,.3);text-align:center}
.xu-modal-card>small{color:var(--muted);font:850 9px ui-monospace,monospace;letter-spacing:.1em}
.xu-modal-card h3{margin:9px 0 7px;font-size:25px;letter-spacing:-.04em}
.xu-modal-card>p{margin:0 auto 20px;max-width:370px;color:var(--muted);font-size:13px;line-height:1.6}
.xu-options{display:grid;gap:9px;text-align:left}
.xu-option{display:grid;grid-template-columns:42px minmax(0,1fr) 15px;align-items:center;gap:13px;padding:13px;border:1px solid var(--line);border-radius:15px;background:var(--soft-2);color:var(--ink);text-decoration:none;transition:border-color .15s,transform .15s}
@media(hover:hover) and (pointer:fine){.xu-option:hover{border-color:var(--ink);transform:translateY(-1px)}}
.xu-option.primary{background:var(--acid);border-color:var(--acid);color:#171714}
.xu-option.primary:hover{border-color:#171714}
.xu-option-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--card);border:1px solid var(--line)}
.xu-option.primary .xu-option-icon{background:#171714;border-color:#171714;color:var(--acid)}
.xu-option-icon .ui-svg{width:17px;height:17px}
.xu-option b{display:block;font-size:14px;letter-spacing:-.015em}
.xu-option small{display:block;margin-top:3px;color:var(--muted);font-size:11.5px;line-height:1.45}
.xu-option.primary small{color:rgba(23,23,20,.72)}
.xu-option-go{display:grid;place-items:center}
.xu-option-go .ui-svg{width:14px;height:14px}
@media(max-width:600px){.xu-modal{padding:10px;align-items:flex-end}.xu-modal-card{padding:24px 18px 18px;border-radius:22px 22px 14px 14px}}

/* Đăng nhập bằng email KHÔNG mật khẩu (assets/auth-email.js). Một cột duy nhất: nút mạng
   xã hội trên cùng → gạch "hoặc" → ô email → nút "Tiếp tục với email", rồi bước nhập mã.
   Dùng lại .input, .divider, .demo-captcha và .captcha-* có sẵn. */
/* Card đăng nhập ăn theo kiểu card "nặng ký" của site (.account-card, .topup-checkout):
   bo 24px + đổ bóng, không để viền mảnh trơ trọi giữa nền giấy. */
/* Mọi ô nhập và nút trong card đăng nhập cùng một chiều cao: xếp dọc Google → hoặc → email
   → "Tiếp tục với email" mà cao thấp so le thì cột trông gãy nhịp. Đổi số ở ĐÂY là đổi cả
   cụm, không phải chỉnh padding từng phần tử. */
.auth-single{--auth-control-h:50px;width:min(452px,100%);margin:0 auto;padding:32px;border-radius:24px;box-shadow:var(--shadow)}
.auth-single h2{margin:0 0 6px;font-size:28px;letter-spacing:-.045em}
.auth-single .auth-lead{margin:0 0 18px;color:var(--muted);font-size:13.5px;line-height:1.55}
/* margin-bottom:0 — .warning mặc định có margin 14px 0, cộng với padding đáy card làm
   khoảng trắng dưới dày gấp rưỡi khoảng trắng trên. */
.auth-single .warning{margin:18px 0 0;padding:13px 15px;font-size:12px}
.btn-social{justify-content:center;gap:10px;margin-bottom:8px;padding:13px 17px;font-weight:750}
.auth-single .btn-social,.auth-single .auth-submit{min-height:var(--auth-control-h);padding-top:0;padding-bottom:0}
.btn-social svg{width:18px;height:18px}
.auth-single .divider{margin:18px 0}
.auth-panel[hidden],.auth-step[hidden]{display:none}
/* .btn đặt display:inline-flex sau [hidden]{display:none} trong file này nên thắng ở cùng
   độ ưu tiên — nút bị ẩn vẫn hiện. Selector hai phần dưới đây mới đủ mạnh để ẩn thật. */
.btn[hidden],.divider[hidden]{display:none}
.auth-field{margin:0 0 12px}
.auth-field label{display:block;margin-bottom:5px;color:var(--muted);font:750 9px ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase}
.auth-field .input{margin:0}
.auth-single .input{padding:11px 14px;font-size:13.5px}
/* Ô email/ô mã cao bằng nút Google — giờ email là lối đăng nhập chính ngang hàng mạng xã
   hội, không còn là phương án phụ nép bên dưới. */
.auth-single .auth-email-input{height:var(--auth-control-h);margin:0 0 10px;padding:0 15px;font-size:14.5px}
.auth-single .auth-code-input{text-align:center;font:800 20px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.34em;padding-left:.34em}
.auth-note{margin:12px 2px 0;color:var(--muted);font-size:11.5px;line-height:1.55;text-align:center}
.auth-single .captcha-input,.auth-single .captcha-code,.auth-single .captcha-refresh{min-height:43px}
.auth-hint{margin:0 0 16px;color:var(--muted);font-size:12.5px;line-height:1.55}
.auth-alt{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px;margin:12px 0 0;text-align:center;font-size:11.5px;color:var(--muted);opacity:.85}
.auth-alt button{border:0;background:0;padding:3px 6px;border-radius:7px;color:var(--muted);font:700 11.5px inherit;cursor:pointer;transition:background .15s,color .15s}
.auth-alt button:hover{background:var(--soft);color:var(--ink)}
.auth-alt-sep{color:var(--line);padding:0 2px}
.auth-submit{margin-top:6px}
.auth-submit[disabled]{opacity:.55;cursor:not-allowed}
/* Ô captcha là <img> PNG do api/captcha.php sinh — bỏ kiểu chữ giả của .captcha-code. */
.captcha-code.captcha-img{padding:0;text-decoration:none;letter-spacing:normal;background:var(--soft-2)}
.captcha-code.captcha-img img{display:block;width:100%;height:auto;border-radius:9px}
.captcha-code.captcha-img:after{display:none}
@media(max-width:600px){.auth-single{padding:26px 20px;border-radius:20px}.auth-single h2{font-size:25px}}

/* ===== Danh mục "Công cụ miễn phí" (trang chủ + /cong-cu) =====
   Card CỐ Ý không có .tool-thumb: nhóm tool chạy thẳng trong trình duyệt, không có cặp ảnh
   trước/sau để khoe, nên chỉ dùng icon — cũng là dấu hiệu thị giác tách khỏi nhóm tool AI.
   Lưới nằm ngoài .tool-grid có filter ở /cong-cu (site.js chỉ toggle '.tool-grid:not(.free-grid)
   .tool-card') nên bấm lọc "Chỉnh sửa ảnh"/"Tạo ảnh AI" không làm nhóm này biến mất. */
.free-grid{grid-template-columns:repeat(4,1fr);gap:12px}
.free-card{min-height:0;padding:16px;border-radius:15px}
.free-card .tool-icon{width:38px;height:38px;border-radius:11px;background:var(--soft);color:var(--ink)}
.free-card .tool-icon .ui-svg{width:17px;height:17px}
.free-card:hover .tool-icon{background:var(--acid);color:#171714}
.free-card h3{font-size:16px;letter-spacing:-.025em;margin:14px 0 5px}
.free-card p{font-size:12px;line-height:1.5;margin-bottom:14px}
.free-card .text-link{font-size:12px}
.free-card .tag{font-size:9px;padding:5px 7px}
.free-card .tool-footer{flex-wrap:wrap;gap:8px}
.free-tag{border-color:color-mix(in srgb,var(--acid) 70%,var(--line));background:color-mix(in srgb,var(--acid) 22%,transparent);color:var(--ink)}
@media(max-width:1080px){.free-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.free-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.free-grid{grid-template-columns:1fr}}

/* ===== Range slider tuỳ biến (dùng ở /nen-anh: minh hoạ hero + thanh chất lượng) =====
   --range-pct do JS set qua style.setProperty mỗi khi value đổi, để tô phần "đã kéo qua"
   bằng gradient — input[type=range] không có API canh riêng phần này. Firefox có sẵn
   ::-moz-range-progress nên không cần biến, chỉ webkit cần gradient thủ công.
   LƯU Ý: KHÔNG gộp bộ chọn ::-webkit-* và ::-moz-* vào cùng một rule — trình duyệt bỏ cả
   rule khi gặp bộ chọn nó không hiểu, slider sẽ về kiểu mặc định (xanh dương của hệ điều hành). */
.range-fancy{-webkit-appearance:none;appearance:none;width:100%;height:24px;margin:0;background:transparent;cursor:pointer;--range-pct:50%}
.range-fancy:focus{outline:none}
.range-fancy::-webkit-slider-runnable-track{height:8px;border-radius:99px;border:1px solid var(--line);background:linear-gradient(to right,var(--acid) 0%,var(--acid) var(--range-pct),var(--soft) var(--range-pct),var(--soft) 100%)}
.range-fancy::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;margin-top:-9px;width:24px;height:24px;border-radius:50%;background:var(--card);border:4px solid var(--acid);box-shadow:0 3px 10px rgba(0,0,0,.22);cursor:pointer;transition:transform .15s}
@media(hover:hover) and (pointer:fine){.range-fancy::-webkit-slider-thumb:hover{transform:scale(1.08)}}
.range-fancy::-webkit-slider-thumb:active{transform:scale(1.16)}
.range-fancy:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px color-mix(in srgb,var(--acid) 35%,transparent)}
.range-fancy::-moz-range-track{height:8px;border-radius:99px;border:1px solid var(--line);background:var(--soft)}
.range-fancy::-moz-range-progress{height:8px;border-radius:99px 0 0 99px;background:var(--acid)}
.range-fancy::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--card);border:4px solid var(--acid);box-shadow:0 3px 10px rgba(0,0,0,.22);cursor:pointer}
.range-fancy:focus-visible::-moz-range-thumb{box-shadow:0 0 0 4px color-mix(in srgb,var(--acid) 35%,transparent)}

/* Nút -/+ cạnh range: bấm tạo đúng một sự kiện thay đổi, nhẹ hơn kéo thanh liên tục trên
   máy yếu (mỗi pixel kéo bắn một sự kiện input, phải debounce mới nén lại được). */
.cz-range-row{display:flex;align-items:center;gap:10px}
.cz-step{flex:0 0 auto;width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font-size:17px;font-weight:800;display:grid;place-items:center;transition:.15s}
.cz-step:hover{border-color:color-mix(in srgb,var(--acid) 62%,var(--line));background:color-mix(in srgb,var(--acid) 10%,var(--card))}
.cz-step:active{transform:scale(.94)}

/* Dải trấn an dưới lưới công cụ miễn phí — cùng thông điệp với banner .cz-privacy trên /nen-anh. */
.free-note{display:flex;align-items:center;gap:12px;margin:14px 0 0;padding:14px 16px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);font-size:12.5px;line-height:1.55}
.free-note .tool-icon{flex:0 0 auto;width:36px;height:36px;border-radius:11px;background:var(--acid);color:#171714}
.free-note .tool-icon .ui-svg{width:16px;height:16px}
.free-note b{color:var(--ink)}
@media(max-width:680px){.free-note{align-items:flex-start;font-size:12px}}

/* ===== Khối "Công cụ liên quan" cuối mỗi trang tool free (includes/free-tools.php) =====
   Thẻ ngang gọn (icon · tên+mô tả · nhãn) chứ không dùng .tool-card như lưới danh mục — đây
   là gợi ý đi tiếp ở cuối trang, không nên nặng bằng lưới công cụ chính ở trang chủ. */
.rel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rel-card{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--card);transition:transform .18s,border-color .18s,box-shadow .18s}
@media(hover:hover) and (pointer:fine){.rel-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--acid) 60%,var(--line));box-shadow:0 14px 34px rgba(39,34,23,.08)}}
.rel-card .tool-icon{flex:0 0 auto;width:44px;height:44px;border-radius:13px;background:var(--soft);color:var(--ink)}
.rel-card.is-free .tool-icon{background:var(--acid);color:#171714}
.rel-body{min-width:0;flex:1 1 auto}
.rel-body b{display:block;font-size:14.5px;letter-spacing:-.02em}
.rel-body small{display:block;margin-top:4px;color:var(--muted);font-size:12px;line-height:1.5}
.rel-card>.tag{flex:0 0 auto;white-space:nowrap}
@media(max-width:760px){.rel-grid{grid-template-columns:1fr}}
@media(max-width:480px){.rel-card{flex-wrap:wrap;gap:11px}.rel-body{flex-basis:100%;order:3}.rel-card>.tag{margin-left:auto}}

/* ===== Phản hồi khi CHẠM (thay cho hover trên máy cảm ứng) ==========================
   Cảm ứng không có hover: mọi hiệu ứng nẩy lên đã bị khoá sau @media(hover:hover) and
   (pointer:fine) ở trên. Đổi lại, ngón tay cần một phản hồi lúc bấm — dùng :active nên
   nó tắt ngay khi nhả tay, không "dính" như :hover trên mobile.
   Viền sáng vẽ bằng box-shadow (vòng ngoài, không phải border) vì hai lý do: không xô
   lệch bố cục như đổi border-width, và vòng nằm trên nền trang nên thấy rõ với cả nút
   nền acid lẫn nút nền tối — ring nằm trong lòng nút thì nút .btn-dark nuốt mất. */
@media(hover:none){
  .btn:active,.theme-btn:active,.mini-tool-link:active,.tool-card:active,.rel-card:active,
  .flow-card:active,.xu-option:active,.topup-checkout .package:active{box-shadow:0 0 0 3px color-mix(in srgb,var(--acid) 55%,transparent)}
  /* Card vốn đã có sẵn border thì tô luôn viền đó cho khối màu liền mạch với vòng ngoài. */
  .tool-card:active,.rel-card:active,.flow-card:active,.xu-option:active,
  .topup-checkout .package:active{border-color:var(--acid)}
}
