.tool-page[data-astro-cid-mqzpnqfb]{padding-bottom:24px}.tool-header[data-astro-cid-mqzpnqfb],.tool-content[data-astro-cid-mqzpnqfb]{border:0;box-shadow:0 8px 24px #0000000f;border-radius:22px;overflow:hidden}.tool-header[data-astro-cid-mqzpnqfb]{background:radial-gradient(circle at top right,rgba(64,158,255,.14),transparent 34%),linear-gradient(135deg,#fffffffa,#f7fafff2)}.tool-headline[data-astro-cid-mqzpnqfb]{display:flex;align-items:center;justify-content:space-between;gap:16px}.tool-kicker[data-astro-cid-mqzpnqfb]{flex:0 0 auto;padding:4px 10px;border-radius:999px;background:#409eff1a;color:#1677ff;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.tool-title[data-astro-cid-mqzpnqfb]{font-size:clamp(1.45rem,3vw,2.15rem);font-weight:800;line-height:1.15}.tool-desc[data-astro-cid-mqzpnqfb]{max-width:720px;color:#66707a;font-size:.98rem;line-height:1.7}@media(max-width:768px){.tool-headline[data-astro-cid-mqzpnqfb]{align-items:flex-start;gap:12px}.tool-kicker[data-astro-cid-mqzpnqfb]{margin-top:4px}}.io-black-mode .tool-header[data-astro-cid-mqzpnqfb],.io-black-mode .tool-content[data-astro-cid-mqzpnqfb]{background:#26282b!important;color:#d9dde3;box-shadow:0 10px 30px #0000002e}.io-black-mode .tool-header[data-astro-cid-mqzpnqfb]{background:radial-gradient(circle at top right,rgba(64,158,255,.2),transparent 34%),linear-gradient(135deg,#26282bfa,#1f2124fa)!important}.io-black-mode .tool-kicker[data-astro-cid-mqzpnqfb]{background:#409eff29;color:#7cb8ff}.io-black-mode .tool-desc[data-astro-cid-mqzpnqfb]{color:#a9b1ba}.tool-switch{display:inline-flex;padding:4px;border-radius:999px;background:#0000000d;gap:4px;box-shadow:inset 0 0 0 1px #00000008}.tool-tab{border:0;background:transparent;color:#5c6773;padding:9px 18px;border-radius:999px;font-weight:700;transition:all .18s ease}.tool-tab.active{background:#1677ff;color:#fff;box-shadow:0 8px 20px #1677ff33}.tool-tab:hover{color:#2f3a45;background:#fff9}.tool-tab.active:hover{color:#fff;background:#1677ff}.tool-card{border-radius:18px;overflow:hidden;box-shadow:0 8px 24px #0000000f!important}.tool-label{color:#2f3a45}.tool-textarea{min-height:180px;border-radius:14px;resize:vertical;border:1px solid rgba(0,0,0,.06);box-shadow:none!important;padding:14px 16px;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}.tool-textarea:focus{border-color:#1677ff66;box-shadow:0 0 0 3px #1677ff14!important}.tool-preview-box{min-height:280px;border-radius:14px;background:linear-gradient(180deg,#f8fafcf5,#f2f6fbeb);display:flex;align-items:center;justify-content:center;overflow:hidden;padding:14px;border:1px solid rgba(0,0,0,.04)}.tool-preview-image{max-width:100%;max-height:256px;display:block;border-radius:10px}.tool-preview-empty{color:#7c8794;text-align:center;display:flex;align-items:center;justify-content:center;width:100%;min-height:240px}.tool-actions{gap:.5rem}.tool-status{min-height:24px}.tool-upload-btn{min-width:120px;border-radius:12px;font-weight:700;box-shadow:0 10px 20px #1677ff2e}.tool-actions .btn{border-radius:12px;font-weight:600;min-height:40px}.tool-actions .btn-outline-dark,.tool-actions .btn-outline-secondary,.tool-actions .btn-outline-primary{background:#fffc}.tool-actions .btn-outline-primary:hover,.tool-actions .btn-outline-primary:focus,.tool-actions .btn-outline-primary:active{background:#1677ff!important;border-color:#1677ff!important;color:#fff}.tool-actions .btn-outline-secondary:hover,.tool-actions .btn-outline-secondary:focus,.tool-actions .btn-outline-secondary:active{background:#6c757d!important;border-color:#6c757d!important;color:#fff}.tool-actions .btn-outline-dark:hover,.tool-actions .btn-outline-dark:focus,.tool-actions .btn-outline-dark:active{background:#343a40!important;border-color:#343a40!important;color:#fff}@media(max-width:767.98px){.tool-switch{width:100%}.tool-tab{flex:1 1 0;text-align:center}.tool-actions .btn,.tool-upload-btn{width:100%}}.io-black-mode .tool-switch{background:#ffffff0f;box-shadow:inset 0 0 0 1px #ffffff0a}.io-black-mode .tool-tab{color:#aab3bd}.io-black-mode .tool-tab.active{background:#2d8cff;color:#fff}.io-black-mode .tool-tab:hover{color:#d9dde3;background:#ffffff0d}.io-black-mode .tool-tab.active:hover{color:#fff;background:#2d8cff}.io-black-mode .tool-card{background:#2c2e2f!important;box-shadow:0 10px 28px #0000002e!important}.io-black-mode .tool-label{color:#d9dde3}.io-black-mode .tool-textarea{background:#141618c7;color:#d9dde3;border-color:#ffffff0f}.io-black-mode .tool-textarea:focus{border-color:#2d8cff73;box-shadow:0 0 0 3px #2d8cff1f!important}.io-black-mode .tool-preview-box{background:linear-gradient(180deg,#202224fa,#191b1df2);border-color:#ffffff0a}.io-black-mode .tool-preview-empty,.io-black-mode .tool-status{color:#9ba6b2!important}.io-black-mode .tool-actions .btn-outline-dark,.io-black-mode .tool-actions .btn-outline-secondary,.io-black-mode .tool-actions .btn-outline-primary{background:#ffffff08;color:#d9dde3;border-color:#ffffff14}.io-black-mode .tool-actions .btn-outline-primary:hover,.io-black-mode .tool-actions .btn-outline-primary:focus,.io-black-mode .tool-actions .btn-outline-primary:active,.io-black-mode .tool-actions .btn-outline-secondary:hover,.io-black-mode .tool-actions .btn-outline-secondary:focus,.io-black-mode .tool-actions .btn-outline-secondary:active,.io-black-mode .tool-actions .btn-outline-dark:hover,.io-black-mode .tool-actions .btn-outline-dark:focus,.io-black-mode .tool-actions .btn-outline-dark:active{color:#fff!important}
