:root {
    --tool-primary: #5b4cf0;
    --tool-primary-dark: #4235c7;
    --tool-ink: #182037;
    --tool-muted: #667085;
    --tool-line: #e6e9f2;
    --tool-soft: #f7f8fc;
    --tool-shadow: 0 18px 50px rgba(35, 39, 74, .08);
}

.toolbox-site { margin: 0; color: var(--tool-ink); background: #fff; font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif; }
.toolbox-site *, .toolbox-site *::before, .toolbox-site *::after { box-sizing: border-box; }
.toolbox-site small, .toolbox-site em, .toolbox-site label, .toolbox-site button, .toolbox-site input, .toolbox-site select, .toolbox-site option { font-size: max(12px, 1em); }
.toolbox-site { --tool-min-text: 12px; }
.toolbox-site a { color: inherit; text-decoration: none; }
.toolbox-site button, .toolbox-site input { font: inherit; }
.toolbox-site .container { width: min(1360px, calc(100% - 48px)); max-width: none; margin-inline: auto; padding-inline: 0; }

.tool-header { position: sticky; z-index: 1000; top: 0; height: 80px; border-bottom: 1px solid rgba(230, 233, 242, .82); background: rgba(255, 255, 255, .9); box-shadow: 0 8px 28px rgba(35, 39, 74, .035); backdrop-filter: blur(18px); }
.tool-nav-inner { height: 80px; display: flex; align-items: center; gap: 26px; }
.tool-logo { display: inline-flex; align-items: center; gap: 9px; flex: none; }
.tool-logo img,.tool-logo-mark { display: block; width: 46px; height: 46px; flex: none; object-fit: contain; }
.tool-logo-mark{display:inline-flex;align-items:center;justify-content:center;color:#5b4be8;font-size:46px!important;line-height:1}
.tool-logo-copy{display:flex;align-items:center;flex-direction:column;line-height:1;white-space:nowrap}
.tool-logo-copy strong{color:#161a27;font-size:21px;font-weight:850;letter-spacing:.02em}
.tool-logo-copy small{position:relative;margin-top:5px;color:#5b4cf0;font-size:12px!important;font-weight:800;letter-spacing:.04em;text-transform:none}
.tool-logo-copy small:before,.tool-logo-copy small:after{position:absolute;top:50%;width:14px;height:1px;background:#5b4cf0;content:""}
.tool-logo-copy small:before{right:calc(100% + 5px)}
.tool-logo-copy small:after{left:calc(100% + 5px)}
.tool-desktop-nav { flex: 1; display: flex; align-items: center; justify-content: center; gap: 18px; }
.tool-desktop-nav a { position: relative; color: #4a5268; font-size: 13px; font-weight: 650; white-space: nowrap; transition: .2s ease; }
.tool-desktop-nav a:hover, .tool-desktop-nav a.active { color: var(--tool-primary); }
.tool-desktop-nav a.active::after { content: ""; position: absolute; right: 0; bottom: -30px; left: 0; height: 2px; border-radius: 2px 2px 0 0; background: var(--tool-primary); }
.tool-nav-actions { display: flex; align-items: center; gap: 9px; flex: none; }
.tool-search-trigger, .tool-mobile-toggle { width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 10px; color: #40485e; background: #f4f5f9; cursor: pointer; }
.tool-nav-search { position: relative; width: 38px; height: 38px; flex: none; }
.tool-nav-search-box { position: absolute; top: 0; right: 0; width: 38px; height: 38px; display: flex; align-items: center; overflow: hidden; border: 1px solid transparent; border-radius: 10px; background: #f4f5f9; transition: width .24s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.tool-nav-search.is-open .tool-nav-search-box { width: 270px; }
.tool-nav-search.is-open .tool-nav-search-box { border-color: #dcdff0; background: #fff; box-shadow: 0 10px 28px rgba(34, 40, 72, .12); }
.tool-nav-search input { width: 0; min-width: 0; flex: 1; padding: 0; opacity: 0; border: 0; outline: 0; color: #30384e; background: transparent; font-size: 13px; pointer-events: none; transition: width .24s ease, padding .24s ease, opacity .15s ease; }
.tool-nav-search.is-open input { width: auto; padding: 0 4px 0 13px; opacity: 1; pointer-events: auto; }
.tool-nav-search .tool-search-trigger { flex: none; background: transparent; }
.tool-nav-search-results { position: absolute; z-index: 1300; top: 46px; right: 0; width: 270px; max-height: 330px; display: none; overflow: auto; padding: 7px; border: 1px solid #e4e7ef; border-radius: 12px; background: #fff; box-shadow: 0 18px 46px rgba(23, 29, 55, .16); }
.tool-nav-search.is-open .tool-nav-search-results { display: block; }
.tool-nav-search-results > p { margin: 16px 8px; color: #98a0b3; text-align: center; font-size: 12px; }
.tool-nav-search-results .tool-search-item { padding: 10px 11px; font-size: 13px; }
.tool-login-link, .tool-member-link { padding: 9px 8px; color: #4d556b; font-size: 14px; font-weight: 600; }
.tool-member-link { display: inline-flex; align-items: center; gap: 6px; }
.tool-register-link { padding: 10px 16px; color: #fff !important; border-radius: 10px; background: var(--tool-primary); font-size: 14px; font-weight: 700; box-shadow: 0 8px 18px rgba(91, 76, 240, .18); }
.tool-mobile-toggle { display: none; }
.tool-mobile-nav, .tool-nav-backdrop { display: none; }

/* 全站颜色选择：显色块 + HEX 色值，保持所有工具操作一致 */
.tool-color-field {
    width: 100%;
    min-width: 0;
    height: 42px;
    display: flex !important;
    align-items: center;
    gap: 9px;
    padding: 4px 10px 4px 5px !important;
    border: 1px solid #dce2e8;
    border-radius: 9px;
    background: #fff;
    box-shadow: none;
    transition: border-color .18s ease, box-shadow .18s ease;
}
.tool-color-field:focus-within { border-color: #7164f2; box-shadow: 0 0 0 3px rgba(91,76,240,.09); }
.tool-color-field > input[type="color"] {
    width: 34px !important;
    min-width: 34px !important;
    height: 32px !important;
    flex: 0 0 34px !important;
    padding: 0 !important;
    overflow: hidden;
    border: 1px solid #d9dee7 !important;
    border-radius: 7px !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: pointer;
}
.tool-color-field > input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
.tool-color-field > input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 5px; }
.tool-color-field > input[type="color"]::-moz-color-swatch { border: 0; border-radius: 5px; }
.tool-color-field > .tool-color-hex {
    width: 100% !important;
    min-width: 0 !important;
    height: 32px !important;
    flex: 1 1 auto !important;
    padding: 0 3px !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    color: #3e4759 !important;
    background: transparent !important;
    box-shadow: none !important;
    font: 13px/32px Consolas,Monaco,"Microsoft YaHei",monospace !important;
    letter-spacing: .3px;
    text-transform: uppercase;
}
.tool-color-field > .tool-color-hex.is-invalid { color: #d4535f !important; }
.tool-color-field .tool-color-copy {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    color: #8a91a1;
    background: #f3f4f8;
    cursor: pointer;
}
.tool-color-field .tool-color-copy:hover { color: var(--tool-primary); background: #eeecff; }
/* 已经使用专用大面积取色器的颜色转换工具维持原布局 */
.color-preview > input[type="color"] { cursor: pointer; }

/* 生成代码统一展示器：沿用 HTML 在线编辑器的深色工作区视觉 */
.tool-code-source { position:absolute!important; width:1px!important; height:1px!important; min-height:0!important; margin:0!important; padding:0!important; opacity:0!important; pointer-events:none!important; }
.tool-code-source-pre { display:none!important; }
.tool-code-host > span:first-child { display:none; }
.tool-code-viewer {
    --code-height: 230px;
    width:100%;
    min-width:0;
    overflow:hidden;
    border:1px solid #343a49;
    border-radius:10px;
    background:#292e3b;
    box-shadow:0 10px 26px rgba(27,31,44,.12);
}
.tool-code-viewer-header {
    height:42px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:0 10px 0 13px;
    border-bottom:1px solid #3a4050;
    color:#c8ceda;
    background:#252936;
}
.tool-code-viewer-header>i{display:inline-flex;align-items:center;justify-content:center;color:#8dafff;font-size:17px;line-height:1;}
.tool-code-viewer-header strong{font-size:12px;line-height:1;font-weight:700;letter-spacing:.5px;}
.tool-code-viewer-header small{margin-left:2px;color:#777f90;font-size:12px;line-height:1;}
.tool-code-viewer-copy{
    height:28px;
    display:inline-flex;
    align-items:center;
    gap:5px;
    margin-left:auto;
    padding:0 9px;
    border:1px solid #444b5d;
    border-radius:6px;
    color:#bac1cf;
    background:#313746;
    font-size:12px;
    cursor:pointer;
}
.tool-code-viewer-copy:hover{color:#fff;border-color:#5f6a83;background:#3b4253;}
.tool-code-scroll{height:var(--code-height);display:grid;grid-template-columns:46px max-content;overflow:auto;overscroll-behavior:contain;background:#292e3b;}
.tool-code-lines{
    position:sticky;
    z-index:1;
    left:0;
    min-height:100%;
    padding:14px 9px;
    border-right:1px solid #3a4050;
    color:#687083;
    background:#292e3b;
    text-align:right;
    white-space:pre;
    user-select:none;
    font:12px/1.72 Consolas,Monaco,monospace;
}
.tool-code-viewer pre{min-width:100%;margin:0;padding:14px 18px;color:#dce2ef;background:transparent;white-space:pre;tab-size:2;}
.tool-code-viewer code{display:block;color:#dce2ef;background:transparent;font:13px/1.6 Consolas,Monaco,"Microsoft YaHei",monospace;}
.tool-code-empty{color:#747c8c;font-style:normal;}
.tool-code-comment{color:#76849a;}
.tool-code-string{color:#a8d279;}
.tool-code-number{color:#e7b86d;}
.tool-code-keyword{color:#c69af1;}
.tool-code-property{color:#7eb7f1;}
.tool-code-selector,.tool-code-tag{color:#ef8f98;}
.tool-code-attribute{color:#e6ba74;}
.tool-code-value{color:#89d2c0;}
.tool-code-viewer-footer{height:32px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-top:1px solid #383e4d;color:#7e8799;background:#252936;font-size:12px;}
.tool-code-viewer-footer span{font-size:12px;}
.tool-code-legacy-copy{display:none!important;}
.tool-action-toast{position:fixed;z-index:10050;top:88px;left:50%;min-width:230px;max-width:min(420px,calc(100vw - 32px));min-height:48px;display:flex;align-items:center;justify-content:center;gap:9px;padding:11px 18px;color:#174b3d;border:1px solid #bfe7d9;border-radius:12px;background:rgba(241,252,248,.98);box-shadow:0 14px 42px rgba(25,55,48,.16);font-size:13px;font-weight:650;line-height:1.5;opacity:0;pointer-events:none;transform:translate(-50%,-12px);transition:opacity .2s ease,transform .2s ease;}
.tool-action-toast i{flex:none;color:#16a17d;font-size:19px;line-height:1;}
.tool-action-toast.is-error{color:#913d48;border-color:#f0cbd1;background:rgba(255,246,247,.98);}
.tool-action-toast.is-error i{color:#d34f61;}
.tool-action-toast.is-visible{opacity:1;transform:translate(-50%,0);}
@media(max-width:600px){
    .tool-code-scroll{grid-template-columns:38px max-content;}
    .tool-code-lines{padding-right:7px;padding-left:5px;}
    .tool-code-viewer pre{padding-right:13px;padding-left:13px;}
    .tool-code-viewer code{font-size:12px;}
    .tool-action-toast{top:72px;min-width:0;width:calc(100vw - 28px);font-size:12px;}
}

.tool-search-panel { position: fixed; z-index: 1200; inset: 0; display: grid; align-items: start; justify-items: center; padding-top: 12vh; opacity: 0; visibility: hidden; background: rgba(17, 23, 42, .56); backdrop-filter: blur(10px); transition: .2s ease; }
.tool-search-panel.is-open { opacity: 1; visibility: visible; }
.tool-search-dialog { width: min(680px, calc(100% - 32px)); padding: 12px; border-radius: 20px; background: #fff; box-shadow: 0 30px 90px rgba(12, 18, 40, .3); transform: translateY(-10px); transition: .2s ease; }
.tool-search-panel.is-open .tool-search-dialog { transform: translateY(0); }
.tool-search-box { height: 60px; display: flex; align-items: center; gap: 12px; padding: 0 16px; border: 1px solid #e3e6ef; border-radius: 14px; background: #f9fafc; }
.tool-search-box > i { color: var(--tool-primary); font-size: 21px; }
.tool-search-box input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--tool-ink); font-size: 16px; }
.tool-search-box button { width: 34px; height: 34px; border: 0; border-radius: 8px; background: #eceef4; cursor: pointer; }
.tool-search-results { max-height: 330px; overflow: auto; padding: 10px 4px 4px; }
.tool-search-results > p { margin: 24px 10px; color: #98a0b3; text-align: center; }
.tool-search-item { display: flex; align-items: center; justify-content: space-between; padding: 13px 14px; border-radius: 10px; font-size: 14px; font-weight: 650; }
.tool-search-item:hover { color: var(--tool-primary); background: #f4f2ff; }
.tool-search-hints { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; padding: 12px 8px 4px; border-top: 1px solid #edf0f5; color: #8a91a3; font-size: 12px; }
.tool-search-hints button { border: 0; color: #596175; background: transparent; cursor: pointer; }

.tool-hero { position: relative; overflow: hidden; padding: 80px 0 32px; background: radial-gradient(circle at 78% 28%, rgba(105, 91, 246, .09), transparent 32%), linear-gradient(180deg, #f7f7ff 0%, #fff 94%); }
.tool-hero::before { content: ""; position: absolute; inset: 0; opacity: .42; background-image: linear-gradient(#ebeafe 1px, transparent 1px), linear-gradient(90deg, #ebeafe 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to bottom, #000, transparent 78%); }
.tool-hero-glow { position: absolute; width: 380px; height: 380px; border-radius: 50%; filter: blur(80px); opacity: .18; }
.tool-hero-glow-one { top: -160px; left: -90px; background: #7668ff; }
.tool-hero-glow-two { right: -100px; bottom: -200px; background: #57c8ff; }
.tool-hero-inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(430px, .94fr); align-items: center; gap: 72px; }
.tool-trust-pill { width: fit-content; margin-bottom: 20px; padding: 8px 12px; color: #5144c7; border: 1px solid #ded9ff; border-radius: 999px; background: rgba(243, 241, 255, .9); font-size: 12px; font-weight: 700; }
.tool-trust-pill i { margin-right: 4px; }
.tool-hero-copy h1 { max-width: 720px; margin: 0 0 18px; color: #151b31; font-size: clamp(43px, 4.1vw, 62px); line-height: 1.13; letter-spacing: -2.5px; font-weight: 800; }
.tool-hero-copy h1 span { color: var(--tool-primary); }
.tool-hero-copy > p { max-width: 590px; margin: 0 0 28px; color: #626b80; font-size: 17px; line-height: 1.78; }
.tool-hero-search { height: 64px; max-width: 590px; display: flex; align-items: center; gap: 13px; padding: 0 16px 0 20px; border: 1px solid #dcdff0; border-radius: 15px; background: rgba(255, 255, 255, .96); box-shadow: 0 14px 38px rgba(45, 41, 112, .1); }
.tool-hero-search > i { color: var(--tool-primary); font-size: 22px; }
.tool-hero-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: #30384e; font-size: 15px; }
.tool-hero-search kbd { padding: 5px 8px; color: #858ca0; border: 1px solid #e3e5ec; border-radius: 6px; background: #f6f7f9; font: 12px/1.2 inherit; box-shadow: none; }
.tool-hero-hot { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; color: #8a91a4; font-size: 12px; }
.tool-hero-hot a { color: #5f6679; }
.tool-hero-hot a:hover { color: var(--tool-primary); }
.tool-hero-board { position: relative; padding: 12px; border: 1px solid rgba(218, 219, 237, .92); border-radius: 20px; background: rgba(255, 255, 255, .9); box-shadow: 0 28px 68px rgba(45, 41, 112, .12), inset 0 1px 0 rgba(255, 255, 255, .9); transform: translateY(3px) rotate(.2deg); }
.tool-board-top { height: 42px; display: flex; align-items: center; justify-content: space-between; padding: 0 10px; border-bottom: 1px solid #eceef4; color: #8890a3; font-size:12px; }
.tool-board-top > span { display: flex; gap: 5px; }
.tool-board-top > span i { width: 7px; height: 7px; border-radius: 50%; background: #d8dbe5; }
.tool-board-top > span i:first-child { background: #ff8e8e; }
.tool-board-top > span i:nth-child(2) { background: #ffd178; }
.tool-board-top > span i:last-child { background: #74db9d; }
.tool-board-top em { color: #697186; font-style: normal; font-weight: 650; }
.tool-board-top b { padding: 5px 8px; color: #2f9a62; border-radius: 6px; background: #eaf9f1; font-size:12px; }
.tool-drop-card { min-height: 268px; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 14px 6px; border: 1.5px dashed #cac6fa; border-radius: 16px; background: linear-gradient(135deg, #faf9ff, #f6f9ff); text-align: center; }
.tool-file-stack { height: 68px; display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
.tool-file-stack span { width: 54px; height: 62px; display: grid; place-items: center; border-radius: 10px; background: #fff; box-shadow: 0 10px 28px rgba(37, 41, 74, .1); }
.tool-file-stack span:first-child { color: #f15b63; transform: rotate(-10deg) translateX(10px); }
.tool-file-stack span:nth-child(2) { position: relative; z-index: 2; color: #4b83e6; transform: translateY(-6px); }
.tool-file-stack span:last-child { color: #e2a311; transform: rotate(10deg) translateX(-10px); }
.tool-file-stack i { font-size: 27px; }
.tool-drop-card h3 { margin: 0 0 6px; font-size: 17px; font-weight: 750; }
.tool-drop-card p { margin: 0 0 18px; color: #8b92a4; font-size: 12px; }
.tool-drop-card button { padding: 10px 16px; color: #fff; border: 0; border-radius: 9px; background: var(--tool-primary); font-size: 12px; font-weight: 700; cursor: pointer; }
.tool-board-status { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; color: #757d90; font-size:12px; }
.tool-board-status > span:first-child { display: grid; grid-template-columns: 28px auto; column-gap: 8px; }
.tool-board-status > span:first-child > i { grid-row: span 2; display: grid; place-items: center; color: var(--tool-primary); border-radius: 8px; background: #efedff; font-size: 15px; }
.tool-board-status strong { color: #596176; }
.tool-board-status small { font-size:12px; }
.tool-status-ready { display: flex; align-items: center; gap: 5px; color: #42a66e; }
.tool-status-ready i { width: 6px; height: 6px; border-radius: 50%; background: #42c177; box-shadow: 0 0 0 4px #e7f8ee; }
.tool-proof-row { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 60px; border-top: 1px solid #ececf4; }
.tool-proof-row > span { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 24px 12px 0; color: #7d8599; font-size: 14px; line-height: 1.4; }
.tool-proof-row > span + span { border-left: 1px solid #ececf4; }
.tool-proof-row > span > i { flex: none; color: #6e60f2; font-size: 21px; line-height: 1; }
.tool-proof-row > span > strong { color: #434b61; font-size: 14px; font-weight: 750; }

.tool-section { padding: 96px 0; }
.tool-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 32px; }
.tool-section-heading > div > span, .tool-category-kicker, .tool-local-copy > span, .tool-member-card > div > span { display: block; margin-bottom: 8px; color: var(--tool-primary); font-size:12px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
.tool-section-heading h2 { margin: 0 0 9px; color: #1a2136; font-size: 30px; letter-spacing: -.8px; font-weight: 780; }
.tool-section-heading p { margin: 0; color: #7a8296; font-size: 14px; }
.tool-section-heading > a { color: var(--tool-primary); font-size: 13px; font-weight: 700; }
.tool-section-heading.centered { justify-content: center; text-align: center; }
.tool-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.tool-card { position: relative; min-height: 184px; display: flex; flex-direction: column; padding: 24px; overflow: hidden; border: 1px solid #e7e9f3; border-radius: 18px; background: linear-gradient(180deg, #fff 0%, #fdfdff 100%); box-shadow: 0 8px 30px rgba(41, 47, 78, .035); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
a.tool-card:hover, .tool-card:hover { z-index: 2; color: inherit; border-color: #d0caff; box-shadow: 0 22px 52px rgba(45, 41, 112, .105); transform: translateY(-6px); }
.tool-card-icon { width: 45px; height: 45px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 12px; font-size: 22px; }
.tool-card-icon.is-red, .tool-category-grid .is-red { color: #e4535c; background: #fff0f1; }
.tool-card-icon.is-orange, .tool-category-grid .is-orange { color: #e97b32; background: #fff4e9; }
.tool-card-icon.is-blue, .tool-category-grid .is-blue { color: #3977d9; background: #edf4ff; }
.tool-card-icon.is-cyan, .tool-category-grid .is-cyan { color: #168ea7; background: #ebf9fc; }
.tool-card-icon.is-yellow, .tool-category-grid .is-yellow { color: #c88a08; background: #fff7df; }
.tool-card-icon.is-purple, .tool-category-grid .is-purple { color: #6553df; background: #f1efff; }
.tool-card-icon.is-green, .tool-category-grid .is-green { color: #269763; background: #eaf9f2; }
.tool-card-icon.is-dark, .tool-category-grid .is-dark { color: #374056; background: #edf0f4; }
.tool-card-badge { position: absolute; top: 25px; right: 22px; padding: 4px 8px; color: #e54b55; border-radius: 6px; background: #fff0f1; font-size:12px; font-weight: 750; }
.tool-card-badge.is-new { color: #6855df; background: #efedff; }
.tool-card-badge.is-online { color: #208957; background: #e8f8ef; }
.tool-card h3 { margin: 0 0 8px; color: #242b40; font-size: 16px; font-weight: 750; }
.tool-card p { margin: 0; color: #8a91a3; font-size: 12px; line-height: 1.7; }
.tool-card em { display: flex; align-items: center; justify-content: space-between; margin-top: auto; color: #8a91a3; font-size:12px; font-style: normal; }
.tool-card em i { color: #aeb4c2; font-size: 15px; }

.tool-category-section { background: #f8f9fc; }
.tool-category-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.tool-category-grid > a { display: grid; grid-template-columns: 48px 1fr 20px; align-items: center; gap: 15px; min-height: 120px; padding: 22px; border: 1px solid #e6e9f1; border-radius: 16px; background: #fff; transition: .2s ease; }
.tool-category-grid > a:hover { border-color: #d5d0ff; box-shadow: 0 15px 40px rgba(45, 41, 112, .08); transform: translateY(-3px); }
.tool-category-grid > a > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 13px; font-size: 23px; }
.tool-category-grid h3 { margin: 0 0 5px; font-size: 15px; font-weight: 750; }
.tool-category-grid p { margin: 0; color: #858da0; font-size: 12px; line-height: 1.65; }
.tool-category-grid em { color: #a0a6b5; font-size:12px; font-style: normal; }
.tool-category-grid > a > i { color: #b0b5c2; }

/* Homepage featured tools mirror the compact category-card layout. */
.tool-home .tool-featured-section .tool-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tool-featured-section .tool-card { min-height: 120px; display: grid; grid-template-columns: 48px minmax(0, 1fr) 20px; grid-template-rows: auto auto; align-content: center; align-items: center; gap: 4px 15px; padding: 22px; border-radius: 16px; background: #fff; box-shadow: none; }
.tool-featured-section .tool-card:nth-child(n+13) { display: none; }
.tool-featured-section .tool-card-icon { grid-row: 1 / 3; width: 48px; height: 48px; margin: 0; border-radius: 13px; font-size: 23px; }
.tool-featured-section .tool-card h3 { grid-column: 2; margin: 0; font-size: 15px; }
.tool-featured-section .tool-card p { grid-column: 2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.55; }
.tool-featured-section .tool-card-arrow { grid-column: 3; grid-row: 1 / 3; color: #b0b5c2; font-size: 16px; }
.tool-featured-section a.tool-card:hover { border-color: #d5d0ff; box-shadow: 0 15px 40px rgba(45, 41, 112, .08); transform: translateY(-3px); }

.tool-ranking-section { padding: 96px 0; background: #fff; }
.tool-ranking-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.tool-ranking-card { min-width: 0; padding: 22px; border: 1px solid #e6e9f1; border-radius: 18px; background: #fff; box-shadow: 0 8px 30px rgba(41, 47, 78, .035); }
.tool-ranking-card header { display: grid; grid-template-columns: 46px minmax(0, 1fr) 34px; align-items: center; gap: 13px; padding-bottom: 18px; border-bottom: 1px solid #eef0f5; }
.tool-ranking-card header > span { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 13px; font-size: 22px; }
.tool-ranking-card header > span.is-red { color: #e4535c; background: #fff0f1; }
.tool-ranking-card header > span.is-blue { color: #3977d9; background: #edf4ff; }
.tool-ranking-card header > span.is-purple { color: #6553df; background: #f1efff; }
.tool-ranking-card header > span.is-yellow { color: #c88a08; background: #fff7df; }
.tool-ranking-card header > span.is-green { color: #269763; background: #eaf9f2; }
.tool-ranking-card header > span.is-dark { color: #374056; background: #edf0f4; }
.tool-ranking-card h3 { margin: 0 0 4px; color: #242b40; font-size: 15px; font-weight: 760; }
.tool-ranking-card header p { margin: 0; color: #9299aa; font-size: 12px; }
.tool-ranking-card header > a { width: 34px; height: 34px; display: grid; place-items: center; color: #a5abba; border: 1px solid #e8eaf0; border-radius: 9px; transition: .2s ease; }
.tool-ranking-card header > a:hover { color: var(--tool-primary); border-color: #d9d4ff; background: #f7f6ff; }
.tool-ranking-card ol { display: grid; gap: 0; margin: 10px 0 0; padding: 0; list-style: none; }
.tool-ranking-card li { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 58px; border-top: 1px solid #f1f2f6; }
.tool-ranking-card li:first-child { border-top: 0; }
.tool-ranking-card li > span { width: 24px; height: 24px; display: grid; place-items: center; color: #8d94a5; border-radius: 7px; background: #f1f3f7; font-size: 12px; font-weight: 800; }
.tool-ranking-card li:first-child > span { color: #fff; background: var(--tool-primary); }
.tool-ranking-card li > a { min-width: 0; }
.tool-ranking-card strong, .tool-ranking-card small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tool-ranking-card strong { color: #343b50; font-size: 13px; font-weight: 700; }
.tool-ranking-card small { margin-top: 3px; color: #a0a6b5; font-size: 12px; }
.tool-ranking-card em { color: #7c8497; font-size: 12px; font-style: normal; white-space: nowrap; }

.tool-local-section { padding: 90px 0; }
.tool-local-card { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 72px; min-height: 380px; padding: 48px 68px !important; overflow: hidden; border-radius: 18px; background: linear-gradient(135deg, #26224e, #171b36); color: #fff; box-shadow: 0 22px 60px rgba(25, 25, 61, .16); }
.tool-local-visual { position: relative; height: 270px; display: grid; place-items: center; }
.tool-local-ring { width: 155px; height: 155px; display: grid; place-items: center; border: 1px solid rgba(143, 133, 255, .32); border-radius: 50%; background: radial-gradient(circle, rgba(103, 88, 242, .35), rgba(103, 88, 242, .04) 68%); box-shadow: 0 0 0 35px rgba(95, 82, 218, .05), 0 0 0 70px rgba(95, 82, 218, .025); }
.tool-local-ring i { font-size: 62px; color: #9187ff; }
.tool-local-file { position: absolute; width: 48px; height: 55px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, .13); border-radius: 11px; background: rgba(255, 255, 255, .08); backdrop-filter: blur(8px); font-size: 21px; }
.tool-local-file.one { top: 24px; right: 54px; color: #ff9299; transform: rotate(8deg); }
.tool-local-file.two { bottom: 28px; right: 66px; color: #79bdff; transform: rotate(-7deg); }
.tool-local-file.three { bottom: 45px; left: 55px; color: #ffd574; transform: rotate(6deg); }
.tool-local-copy > span { color: #9187ff; }
.tool-local-copy h2 { margin: 0 0 16px; font-size: 34px; font-weight: 780; }
.tool-local-copy > p { margin: 0 0 22px; color: #b8bed1; font-size: 14px; line-height: 1.9; }
.tool-local-copy ul { display: grid; gap: 11px; padding: 0; margin: 0; list-style: none; color: #d6d9e5; font-size: 12px; }
.tool-local-copy li i { width: 20px; height: 20px; display: inline-grid; place-items: center; margin-right: 7px; color: #9b91ff; border-radius: 50%; background: rgba(145, 135, 255, .13); }

.tool-member-section { padding: 0 0 90px; }
.tool-member-card { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 38px 46px !important; border: 1px solid #e1ddff; border-radius: 18px; background: linear-gradient(115deg, #f6f4ff, #fbfbff); }
.tool-member-card h2 { margin: 0 0 8px; font-size: 25px; font-weight: 770; }
.tool-member-card p { margin: 0; color: #737b90; font-size: 13px; }
.tool-member-actions { flex: none; text-align: center; }
.tool-member-actions > a { display: block; padding: 12px 22px; color: #fff; border-radius: 10px; background: var(--tool-primary); font-size: 13px; font-weight: 750; box-shadow: 0 10px 25px rgba(91, 76, 240, .2); }
.tool-member-actions small { display: block; margin-top: 9px; color: #969caf; font-size:12px; }
.tool-member-actions small a { color: var(--tool-primary); }

.tool-category-hero { padding: 70px 0 54px; border-bottom: 1px solid #eceef4; background: linear-gradient(180deg, #f7f6ff, #fff); text-align: center; }
.tool-breadcrumb { display: flex; align-items: center; justify-content: center; gap: 5px; margin-bottom: 24px; color: #979daf; font-size:12px; }
.tool-category-hero h1 { margin: 0 0 13px; font-size: 42px; letter-spacing: -1.5px; font-weight: 800; }
.tool-category-hero > .container > p { max-width: 640px; margin: 0 auto; color: #747c90; font-size: 14px; line-height: 1.8; }
.tool-category-search { max-width: 520px; height: 52px; display: flex; align-items: center; gap: 10px; margin: 28px auto 0; padding: 0 16px; border: 1px solid #e2e4ef; border-radius: 13px; background: #fff; box-shadow: 0 12px 35px rgba(40, 42, 82, .07); }
.tool-category-search i { color: var(--tool-primary); }
.tool-category-search input { flex: 1; border: 0; outline: 0; background: transparent; font-size: 13px; }
.tool-category-overview { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; padding: 14px 18px; color: #666e82; border: 1px solid #e6e2ff; border-radius: 12px; background: #f8f7ff; font-size: 12px; }
.tool-category-overview strong { color: #584bd0; }
.tool-category-overview span { display: inline-flex; align-items: center; gap: 6px; }
.tool-category-overview i { color: #29936a; font-size: 16px; }
.tool-category-tools .tool-card { display: none; }
.tool-category-tools .tool-card.is-visible { display: grid; }
.tool-category-page .tool-category-tools { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tool-category-page .tool-category-tools .tool-card { min-height: 112px; grid-template-columns: 44px minmax(0, 1fr) 16px; grid-template-rows: auto auto; align-content: center; align-items: center; gap: 4px 13px; padding: 19px; border-radius: 16px; background: #fff; box-shadow: none; }
.tool-category-page .tool-category-tools .tool-card-arrow { grid-column: 3; grid-row: 1 / 3; color: #b0b5c2; font-size: 15px; }
.tool-category-page .tool-category-tools .tool-card-icon { grid-row: 1 / 3; width: 44px; height: 44px; margin: 0; border-radius: 12px; font-size: 21px; }
.tool-category-page .tool-category-tools .tool-card h3 { grid-column: 2; margin: 0; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.tool-category-page .tool-category-tools .tool-card p { grid-column: 2; overflow: hidden; line-height: 1.55; text-overflow: ellipsis; white-space: nowrap; }
.tool-category-page .tool-category-tools a.tool-card:hover { border-color: #d5d0ff; box-shadow: 0 15px 38px rgba(45, 41, 112, .08); transform: translateY(-3px); }
.tool-empty-state { display: none; padding: 70px 20px; text-align: center; color: #8d94a5; }
.tool-empty-state.is-visible { display: block; }
.tool-empty-state i { font-size: 44px; color: #c4c8d2; }
.tool-empty-state h3 { margin: 12px 0 6px; color: #424a60; font-size: 17px; }
.tool-empty-state p { margin: 0; font-size: 12px; }

.tool-footer { padding: 0; color: #8f97ab; border-top: 1px solid #292f43; background: #151a2b; }
.tool-footer-columns{display:grid;grid-template-columns:minmax(250px,1.25fr) minmax(260px,1.35fr) minmax(140px,.7fr) minmax(140px,.7fr);gap:48px;padding-top:48px;padding-bottom:42px;}
.tool-footer-brand{max-width:320px;}
.tool-footer-logo{display:inline-flex;align-items:center;gap:10px;margin-bottom:18px;padding:0;border-radius:0;background:transparent;}
.tool-footer-logo img{width:48px;height:48px;display:block;flex:none;object-fit:contain;}
.tool-footer-logo-mark{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;flex:none;color:#8f85ff;font-size:48px!important;line-height:1;}
.tool-footer-logo .tool-logo-copy strong{color:#8f85ff;font-size:20px}
.tool-footer-logo .tool-logo-copy small{color:#8f85ff}
.tool-footer-logo .tool-logo-copy small:before,.tool-footer-logo .tool-logo-copy small:after{background:#8f85ff}
.tool-footer-brand p{margin:0;color:#9199ac;font-size:12px;line-height:1.85;}
.tool-footer-local{display:inline-flex;align-items:center;gap:6px;margin-top:17px;color:#aaa2ff;font-size:12px;}
.tool-footer-local i{font-size:15px;}
.tool-footer-column{display:flex;align-items:flex-start;flex-direction:column;gap:10px;}
.tool-footer-column h3{margin:3px 0 7px;color:#f1f3f8;font-size:14px;font-weight:750;}
.tool-footer-column a{color:#9ba3b6;font-size:12px;line-height:1.55;transition:color .2s ease,transform .2s ease;}
.tool-footer-column a:hover,.tool-friend-links a:hover{color:#fff;transform:translateX(2px);}
.tool-footer-categories>div{display:grid;grid-template-columns:1fr 1fr;gap:10px 22px;}
.tool-friend-links { min-height: 54px; display: flex; align-items: center; gap: 22px; border-top: 1px solid rgba(255, 255, 255, .07); }
.tool-friend-links strong { flex: none; color: #c7ccda; font-size: 12px; font-weight: 700; }
.tool-friend-links > div { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 22px; }
.tool-friend-links a { color: #858da2; font-size: 12px; transition: color .2s ease; }
.tool-friend-links .tool-friend-apply { color: #a9a2ff; }
.tool-footer-bottom { display: flex; align-items: center; justify-content: space-between; min-height: 54px; border-top: 1px solid rgba(255, 255, 255, .07); color: #737c92; font-size:12px; }
.tool-footer-bottom p { margin: 0; }
.tool-footer-bottom>div{display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px;}
.tool-footer-bottom a,.tool-footer-bottom span{color:#737c92;font-size:12px;}
.tool-footer-bottom a:hover{color:#bec4d2;}
.tool-gotop { position: fixed; z-index: 900; right: 24px; bottom: 24px; width: 42px; height: 42px; display: none; place-items: center; color: #fff; border: 0; border-radius: 11px; background: var(--tool-primary); box-shadow: 0 10px 24px rgba(91, 76, 240, .27); cursor: pointer; }
.tool-gotop.show { display: grid; }

/* Favicon generator */
.favicon-page { background: #f8f9fc; }
.favicon-heading { padding: 58px 0 46px; border-bottom: 1px solid #e8eaf2; background: linear-gradient(180deg, #f7f6ff 0%, #fff 100%); text-align: center; }
.favicon-heading h1 { margin: 0 0 12px; color: #161d32; font-size: clamp(34px, 5vw, 48px); font-weight: 800; letter-spacing: -1.8px; }
.favicon-heading > .container > p { margin: 0; color: #737b90; font-size: 14px; }
.favicon-safety { width: fit-content; display: flex; align-items: center; gap: 7px; margin: 22px auto 0; padding: 9px 13px; color: #397b5b; border: 1px solid #d9eee3; border-radius: 9px; background: #f1fbf6; font-size:12px; }
.favicon-safety i { font-size: 15px; }
.favicon-safety strong { font-size:12px; }
.favicon-safety span { color: #69917c; }
.favicon-workspace { padding: 52px 0 35px; }
.favicon-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr); align-items: start; gap: 22px; }
.favicon-main-panel, .favicon-preview-panel { padding: 30px; border: 1px solid #e4e7ef; border-radius: 20px; background: #fff; box-shadow: 0 12px 40px rgba(37, 42, 75, .045); }
.favicon-step-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 24px; }
.favicon-step-head > span { width: 34px; height: 34px; display: grid; place-items: center; flex: none; color: #fff; border-radius: 10px; background: var(--tool-primary); font-size:12px; font-weight: 800; box-shadow: 0 7px 16px rgba(91, 76, 240, .2); }
.favicon-step-head h2 { margin: 0 0 4px; color: #222a40; font-size: 19px; font-weight: 760; }
.favicon-step-head p { margin: 0; color: #9096a8; font-size:12px; line-height: 1.6; }
.favicon-dropzone { min-height: 350px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 28px; border: 1.5px dashed #c9c5f4; border-radius: 17px; outline: 0; background: linear-gradient(135deg, #fbfaff, #f7f9ff); text-align: center; cursor: pointer; transition: .2s ease; }
.favicon-dropzone:hover, .favicon-dropzone.is-dragging, .favicon-dropzone:focus-visible { border-color: var(--tool-primary); background: #f6f4ff; box-shadow: inset 0 0 0 3px rgba(91, 76, 240, .04); }
.favicon-drop-icon { width: 68px; height: 68px; display: grid; place-items: center; margin-bottom: 17px; color: var(--tool-primary); border-radius: 20px; background: #eeecff; font-size: 31px; }
.favicon-dropzone h3 { margin: 0 0 8px; color: #333b50; font-size: 17px; font-weight: 730; }
.favicon-dropzone p { margin: 0 0 19px; color: #969daf; font-size:12px; }
.favicon-dropzone button { padding: 10px 18px; color: #fff; border: 0; border-radius: 9px; background: var(--tool-primary); font-size:12px; font-weight: 700; cursor: pointer; }
.favicon-editor { min-height: 350px; }
.favicon-source-bar { display: grid; grid-template-columns: 54px 1fr auto; align-items: center; gap: 12px; padding: 12px; border: 1px solid #e6e8ef; border-radius: 13px; background: #fafbfc; }
.favicon-source-thumb { width: 54px; height: 54px; display: grid; place-items: center; overflow: hidden; border-radius: 10px; background: repeating-conic-gradient(#e9ebf1 0 25%, #fff 0 50%) 50% / 12px 12px; }
.favicon-source-thumb img { width: 100%; height: 100%; object-fit: contain; }
.favicon-source-bar strong, .favicon-source-bar span { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.favicon-source-bar strong { color: #30374b; font-size: 12px; }
.favicon-source-bar span { margin-top: 4px; color: #9399aa; font-size:12px; }
.favicon-source-bar button { padding: 8px 10px; color: #5e6578; border: 1px solid #e0e3ea; border-radius: 8px; background: #fff; font-size:12px; cursor: pointer; }
.favicon-control-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; margin-top: 23px; }
.favicon-control-grid label { display: flex; flex-direction: column; gap: 8px; color: #5c6478; font-size:12px; font-weight: 650; }
.favicon-control-grid label > span { display: flex; justify-content: space-between; }
.favicon-control-grid label b { color: var(--tool-primary); font-size:12px; }
.favicon-control-grid select, .favicon-color-control > div { width: 100%; height: 40px; padding: 0 10px; color: #41495d; border: 1px solid #e0e3eb; border-radius: 9px; outline: 0; background: #fff; font-size:12px; }
.favicon-control-grid input[type="range"] { width: 100%; accent-color: var(--tool-primary); }
.favicon-color-control > div { display: flex; align-items: center; gap: 8px; }
.favicon-color-control input[type="color"] { width: 25px; height: 25px; padding: 0; border: 0; border-radius: 6px; background: transparent; }
.favicon-color-control input[type="text"] { flex: 1; min-width: 0; border: 0; outline: 0; color: #4a5266; background: transparent; font-size:12px; }
.favicon-toggle-control { align-items: flex-start; justify-content: flex-end; position: relative; }
.favicon-toggle-control input { position: absolute; opacity: 0; }
.favicon-toggle-control > i { position: relative; width: 42px; height: 24px; border-radius: 99px; background: #dfe2e9; cursor: pointer; transition: .2s; }
.favicon-toggle-control > i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,.18); transition: .2s; }
.favicon-toggle-control input:checked + i { background: var(--tool-primary); }
.favicon-toggle-control input:checked + i::after { left: 21px; }
.favicon-quality-note { display: flex; align-items: center; gap: 8px; margin-top: 20px; padding: 10px 12px; color: #777f93; border-radius: 9px; background: #f5f6f9; font-size:12px; }
.favicon-quality-note.is-warning { color: #a26c16; background: #fff7e6; }
.favicon-preview-panel { position: sticky; top: 92px; }
.favicon-preview-head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 21px; }
.favicon-preview-head span { color: var(--tool-primary); font-size:12px; font-weight: 800; letter-spacing: 1.3px; text-transform: uppercase; }
.favicon-preview-head h2 { margin: 4px 0 0; color: #2b3247; font-size: 17px; font-weight: 750; }
.favicon-preview-head em { padding: 5px 8px; color: #8e95a6; border-radius: 6px; background: #f1f2f6; font-size:12px; font-style: normal; }
.favicon-preview-head em.is-ready { color: #258a58; background: #eaf8f1; }
.favicon-browser-mock { overflow: hidden; border: 1px solid #dde0e8; border-radius: 13px; background: #f5f6f8; }
.favicon-browser-top { height: 38px; display: grid; grid-template-columns: 48px 1fr 18px; align-items: end; gap: 6px; padding: 0 9px; background: #e9ebf0; }
.favicon-browser-top > span { display: flex; align-self: center; gap: 3px; }
.favicon-browser-top > span i { width: 5px; height: 5px; border-radius: 50%; background: #c0c4cd; }
.favicon-browser-top > div { height: 29px; display: flex; align-items: center; gap: 6px; padding: 0 10px; border-radius: 8px 8px 0 0; background: #fff; }
.favicon-browser-top canvas { width: 16px; height: 16px; }
.favicon-browser-top b { color: #555d70; font-size:12px; font-weight: 600; }
.favicon-browser-top > i { align-self: center; color: #a3a8b5; font-size: 12px; }
.favicon-browser-body { min-height: 105px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #fff; }
.favicon-browser-body span { color: #c4c8d2; font-size: 19px; font-weight: 800; letter-spacing: 3px; }
.favicon-browser-body small { margin-top: 5px; color: #adb2be; font-size:12px; }
.favicon-device-previews { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.favicon-device-previews > div { padding: 16px 12px 12px; border: 1px solid #e7e9f0; border-radius: 12px; background: #fafbfc; text-align: center; }
.favicon-device-icon { width: 68px; height: 68px; display: grid; place-items: center; margin: 0 auto 10px; overflow: hidden; background: repeating-conic-gradient(#e8eaf0 0 25%, #fff 0 50%) 50% / 10px 10px; box-shadow: 0 7px 18px rgba(34, 39, 69, .12); }
.favicon-device-icon.is-ios { border-radius: 16px; }
.favicon-device-icon.is-android { border-radius: 50%; }
.favicon-device-icon canvas { width: 100%; height: 100%; }
.favicon-device-previews strong, .favicon-device-previews small { display: block; }
.favicon-device-previews strong { color: #555d71; font-size:12px; }
.favicon-device-previews small { margin-top: 3px; color: #a0a6b5; font-size:12px; }
.favicon-size-row { display: flex; align-items: end; justify-content: center; gap: 21px; margin-top: 20px; padding-top: 17px; border-top: 1px solid #eceef3; }
.favicon-size-row span { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.favicon-size-row canvas { image-rendering: auto; box-shadow: 0 3px 9px rgba(37, 42, 75, .1); }
.favicon-size-row span:nth-child(1) canvas { width: 16px; height: 16px; }
.favicon-size-row span:nth-child(2) canvas { width: 24px; height: 24px; }
.favicon-size-row span:nth-child(3) canvas { width: 32px; height: 32px; }
.favicon-size-row span:nth-child(4) canvas { width: 42px; height: 42px; }
.favicon-size-row small { color: #9aa0b0; font-size:12px; }
.favicon-output-section { padding: 34px 0 80px; }
.favicon-output-section > .container { padding: 34px !important; border: 1px solid #e4e7ef; border-radius: 20px; background: #fff; box-shadow: 0 12px 40px rgba(37, 42, 75, .045); }
.favicon-record-note { display: flex; align-items: center; gap: 8px; margin: -6px 0 18px; padding: 10px 12px; color: #737b8e; border: 1px solid #e5e7f2; border-radius: 9px; background: #f8f8fe; font-size:12px; }
.favicon-record-note > i, .favicon-record-note a { color: var(--tool-primary); }
.favicon-record-note a { font-weight: 700; }

/* Image compressor */
.compress-page{background:#f7f9fc}.compress-heading{padding:58px 0 46px;border-bottom:1px solid #e6eaf0;background:linear-gradient(180deg,#f2f8ff 0%,#fff 100%);text-align:center}.compress-heading h1{margin:0 0 12px;color:#161f33;font-size:clamp(35px,5vw,49px);font-weight:800;letter-spacing:-1.8px}.compress-heading>.container>p{margin:0;color:#747e91;font-size:14px}.compress-workspace{padding:52px 0}.compress-shell{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(310px,.55fr);align-items:start;gap:22px}.compress-panel,.compress-settings{padding:30px;border:1px solid #e3e8ef;border-radius:20px;background:#fff;box-shadow:0 12px 40px rgba(32,52,78,.045)}.compress-settings{position:sticky;top:92px}.compress-step-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:24px}.compress-step-head>span,.compress-result-head>div>span{width:34px;height:34px;display:grid;place-items:center;flex:none;color:#fff;border-radius:10px;background:#317be8;font-size:12px;font-weight:800;box-shadow:0 7px 16px rgba(49,123,232,.2)}.compress-step-head h2,.compress-result-head h2{margin:0 0 4px;color:#222c40;font-size:19px;font-weight:760}.compress-step-head p,.compress-result-head p{margin:0;color:#929aab;font-size:12px;line-height:1.6}.compress-dropzone{min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;border:1.5px dashed #bcd2ee;border-radius:17px;outline:0;background:linear-gradient(135deg,#fafdff,#f4f8fe);text-align:center;cursor:pointer;transition:.2s}.compress-dropzone:hover,.compress-dropzone:focus-visible,.compress-dropzone.is-dragging{border-color:#317be8;background:#f0f6ff;box-shadow:inset 0 0 0 3px rgba(49,123,232,.04)}.compress-dropzone>span{width:70px;height:70px;display:grid;place-items:center;margin-bottom:17px;color:#317be8;border-radius:21px;background:#e6f0ff;font-size:32px}.compress-dropzone h3{margin:0 0 8px;color:#313c51;font-size:17px;font-weight:730}.compress-dropzone p{margin:0 0 20px;color:#969fb0;font-size:12px}.compress-dropzone button,.compress-list-head button{padding:10px 18px;color:#fff;border:0;border-radius:9px;background:#317be8;font-size:12px;font-weight:700;cursor:pointer}.compress-list-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.compress-list-head strong,.compress-list-head small{display:block}.compress-list-head strong{color:#303a4e;font-size:14px}.compress-list-head small{margin-top:4px;color:#929aab;font-size:12px}.compress-list-head>div:last-child{display:flex;gap:7px}.compress-list-head button{padding:8px 10px;color:#5f6a7d;border:1px solid #dfe5ed;background:#fff}.compress-file-list,.compress-result-list{display:grid;gap:9px}.compress-file-item,.compress-result-item{display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px;border:1px solid #e7ebf1;border-radius:12px;background:#fafbfd}.compress-file-item img,.compress-result-item img{width:52px;height:52px;object-fit:cover;border-radius:9px;background:#edf1f5}.compress-file-item strong,.compress-file-item small,.compress-result-item strong,.compress-result-item small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.compress-file-item strong,.compress-result-item strong{color:#344055;font-size:12px}.compress-file-item small,.compress-result-item small{margin-top:5px;color:#9099aa;font-size:12px}.compress-file-item button{width:30px;height:30px;border:0;border-radius:8px;color:#8b94a4;background:#f0f3f7;cursor:pointer}.compress-setting{display:flex;flex-direction:column;gap:9px;margin-bottom:21px;color:#59657a;font-size:12px;font-weight:650}.compress-setting>span{display:flex;justify-content:space-between}.compress-setting b{color:#317be8}.compress-setting input[type=range]{width:100%;accent-color:#317be8}.compress-setting select{width:100%;height:42px;padding:0 11px;color:#424e62;border:1px solid #dfe5ed;border-radius:9px;outline:0;background:#fff;font-size:12px}.compress-toggle{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:4px 0 22px;cursor:pointer}.compress-toggle strong,.compress-toggle small{display:block}.compress-toggle strong{color:#515d72;font-size:12px}.compress-toggle small{margin-top:4px;color:#9aa2b1;font-size:12px}.compress-toggle input{position:absolute;opacity:0}.compress-toggle>i{position:relative;width:42px;height:24px;flex:none;border-radius:99px;background:#dfe4eb;transition:.2s}.compress-toggle>i:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.17);transition:.2s}.compress-toggle input:checked+i{background:#317be8}.compress-toggle input:checked+i:after{left:21px}.compress-start{width:100%;height:47px;color:#fff;border:0;border-radius:11px;background:linear-gradient(135deg,#317be8,#2465ca);font-size:12px;font-weight:750;box-shadow:0 10px 24px rgba(49,123,232,.2);cursor:pointer}.compress-start:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.compress-start i{margin-right:7px}.compress-local-note{display:flex;align-items:flex-start;gap:8px;margin-top:15px;padding:11px;color:#7c8799;border-radius:9px;background:#f4f6f9;font-size:12px;line-height:1.65}.compress-local-note i{color:#317be8;font-size:14px}.compress-results{padding:0 0 70px}.compress-results>.container{padding:32px!important;border:1px solid #e3e8ef;border-radius:20px;background:#fff;box-shadow:0 12px 40px rgba(32,52,78,.045)}.compress-result-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.compress-result-head>div{display:flex;align-items:flex-start;gap:14px}.compress-result-head>button,.compress-result-item>button{padding:10px 14px;color:#fff;border:0;border-radius:9px;background:#317be8;font-size:12px;font-weight:700;cursor:pointer}.compress-result-head>button:disabled{opacity:.55}.compress-result-item{grid-template-columns:58px minmax(0,1fr) auto;padding:12px 14px;background:#fff}.compress-result-item img{width:58px;height:58px}.compress-result-item>button{color:#2469ce;border:1px solid #dce8f8;background:#edf5ff}.compress-result-item.is-error>span{width:52px;height:52px;display:grid;place-items:center;color:#d96a58;border-radius:9px;background:#fff0ed;font-size:23px}.compress-guide{padding:75px 0;background:#fff}.compress-guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.compress-guide-grid>div{padding:27px;border:1px solid #e4e9ef;border-radius:15px;text-align:center}.compress-guide-grid i{display:block;margin-bottom:13px;color:#317be8;font-size:29px}.compress-guide-grid h3{margin:0 0 7px;color:#344055;font-size:13px}.compress-guide-grid p{margin:0;color:#8e97a8;font-size:12px;line-height:1.7}.ri-spin{display:inline-block;animation:tool-spin .8s linear infinite}@keyframes tool-spin{to{transform:rotate(360deg)}}

@media (max-width: 991px){.compress-shell{grid-template-columns:1fr}.compress-settings{position:static}.compress-guide-grid{grid-template-columns:1fr}.compress-dropzone{min-height:300px}}
@media (max-width: 575px){.compress-heading{padding:43px 0 36px}.compress-workspace{padding:28px 0}.compress-panel,.compress-settings,.compress-results>.container{padding:20px!important;border-radius:15px}.compress-list-head,.compress-result-head{align-items:flex-start;flex-direction:column}.compress-list-head>div:last-child,.compress-result-head>button{width:100%}.compress-list-head button{flex:1}.compress-result-head>button{height:42px}.compress-file-item,.compress-result-item{grid-template-columns:46px minmax(0,1fr)}.compress-file-item img,.compress-result-item img{width:46px;height:46px}.compress-file-item button,.compress-result-item>button{grid-column:1/-1;width:100%}.compress-guide{padding:58px 0}}
.favicon-output-grid { display: grid; grid-template-columns: 1.5fr .75fr .75fr; gap: 13px; }
.favicon-package-card, .favicon-single-card { min-height: 112px; display: flex; align-items: center; gap: 13px; padding: 17px; border: 1px solid #e4e6ee; border-radius: 14px; background: #fafbfc; }
.favicon-package-card { color: #fff; border: 0; background: linear-gradient(135deg, #5d4df2, #4336c4); }
.favicon-package-icon { width: 47px; height: 47px; display: grid; place-items: center; flex: none; border-radius: 12px; background: rgba(255,255,255,.14); font-size: 23px; }
.favicon-package-card > div:nth-child(2) { flex: 1; }
/* Chinese UI text uses a 12px minimum; icon-only glyphs keep their designed scale. */
.tool-board-top,.tool-board-top b,.tool-board-status,.tool-board-status small,.tool-proof-row span,
.tool-section-heading>div>span,.tool-category-kicker,.tool-local-copy>span,.tool-member-card>div>span,
.tool-card-badge,.tool-card em,.tool-category-grid p,.tool-category-grid em,.tool-member-actions small,
.tool-breadcrumb,.tool-category-status,.tool-footer-safe,.tool-footer-links a,.tool-footer-bottom,
.favicon-safety,.favicon-safety strong,.favicon-step-head>span,.favicon-step-head p,.favicon-dropzone p,
.favicon-dropzone button,.favicon-source-bar span,.favicon-source-bar button,.favicon-control-grid label,
.favicon-control-grid label b,.favicon-control-grid select,.favicon-color-control>div,.favicon-color-control input[type=text],
.favicon-quality-note,.favicon-preview-head span,.favicon-preview-head em,.favicon-browser-top b,
.favicon-browser-body small,.favicon-device-previews strong,.favicon-device-previews small,.favicon-size-row small,
.favicon-record-note,.favicon-package-card span,.favicon-package-card p,.favicon-single-card p,
.favicon-package-card button,.favicon-code-head,.favicon-code-head button,.favicon-code-panel pre,
.favicon-file-list>div,.favicon-guide-grid p,.compress-step-head>span,.compress-result-head>div>span,
.compress-step-head p,.compress-result-head p,.compress-dropzone p,.compress-dropzone button,
.compress-list-head button,.compress-list-head small,.compress-file-item strong,.compress-result-item strong,
.compress-file-item small,.compress-result-item small,.compress-setting,.compress-setting select,
.compress-toggle strong,.compress-toggle small,.compress-local-note,.compress-result-head>button,
.compress-result-item>button,.compress-guide-grid p { font-size: 12px; }

.convert-dropzone>span{color:#0b9f96;background:#e6f8f6}.convert-settings .compress-step-head>span,.convert-start{background:linear-gradient(135deg,#13a89e,#087d83);box-shadow:0 10px 24px rgba(12,145,140,.2)}.convert-settings .compress-setting b{color:#098d88}.convert-settings input[type=range]{accent-color:#0b9f96}.convert-format-note,.convert-notice{display:flex;align-items:flex-start;gap:8px;padding:11px 12px;color:#5e7181;border:1px solid #d9ecea;border-radius:9px;background:#f1fbfa;font-size:12px;line-height:1.6}.convert-format-note{margin:-4px 0 20px}.convert-format-note i{color:#0b9f96;font-size:16px}.convert-notice{margin:15px 0;color:#8a6132;border-color:#f1dfc8;background:#fff9f0}.convert-color{height:42px;display:flex;align-items:center;gap:9px;padding:0 10px;border:1px solid #dfe5ed;border-radius:9px}.convert-color input[type=color]{width:25px;height:25px;padding:0;border:0;background:transparent;cursor:pointer}.convert-color input[type=text]{flex:1;min-width:0;border:0;outline:0;color:#424e62;background:transparent;font-size:12px;text-transform:uppercase}

.resize-dropzone>span{color:#7b4ddb;background:#f0eaff}.resize-settings .compress-step-head>span,.resize-start{background:linear-gradient(135deg,#8a5ce5,#6540b6);box-shadow:0 10px 24px rgba(112,69,199,.22)}.resize-mode-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:20px;padding:4px;border-radius:10px;background:#f1f2f6}.resize-mode-tabs button{height:36px;border:0;border-radius:8px;color:#6c7485;background:transparent;font-size:12px;font-weight:700;cursor:pointer}.resize-mode-tabs button.is-active{color:#6840ba;background:#fff;box-shadow:0 3px 10px rgba(46,35,76,.09)}.resize-dimensions{display:grid;grid-template-columns:1fr 18px 1fr;align-items:end;gap:7px}.resize-dimensions>i{height:42px;display:grid;place-items:center;color:#9ba2b2}.resize-dimensions label{display:flex;flex-direction:column;gap:7px;color:#59657a;font-size:12px;font-weight:650}.resize-dimensions input{width:100%;height:42px;padding:0 10px;color:#414c61;border:1px solid #dfe5ed;border-radius:9px;outline:0}.resize-dimensions input:focus{border-color:#8a5ce5;box-shadow:0 0 0 3px rgba(138,92,229,.1)}.resize-presets{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 18px}.resize-presets button{padding:6px 8px;color:#7255a8;border:1px solid #e3daf2;border-radius:7px;background:#faf7ff;font-size:12px;cursor:pointer}.resize-scale{margin:0 0 22px}.resize-settings input[type=range]{accent-color:#7950cf}.resize-settings .compress-setting b{color:#734bc5}.resize-summary{display:flex;align-items:flex-start;gap:8px;margin:-3px 0 18px;padding:11px;color:#66587d;border:1px solid #e5ddf3;border-radius:9px;background:#faf7ff;font-size:12px;line-height:1.6}.resize-summary i{color:#7950cf;font-size:16px}

.pdf-page{background:#f8f9fc}.pdf-heading{padding:58px 0 46px;border-bottom:1px solid #ece5e6;background:linear-gradient(180deg,#fff4f4 0%,#fff 100%);text-align:center}.pdf-heading h1{margin:0 0 12px;color:#271c21;font-size:clamp(35px,5vw,49px);font-weight:800;letter-spacing:-1.8px}.pdf-heading>.container>p{margin:0;color:#80747a;font-size:14px}.pdf-workspace{padding:52px 0}.pdf-panel{padding:32px;border:1px solid #e5e7ed;border-radius:20px;background:#fff;box-shadow:0 12px 40px rgba(47,35,40,.055)}.pdf-dropzone{min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;border:1.5px dashed #e5bfc3;border-radius:17px;outline:0;background:linear-gradient(135deg,#fffdfd,#fff6f6);text-align:center;cursor:pointer;transition:.2s}.pdf-dropzone:hover,.pdf-dropzone:focus-visible,.pdf-dropzone.is-dragging{border-color:#df5966;background:#fff1f2;box-shadow:inset 0 0 0 3px rgba(223,89,102,.04)}.pdf-dropzone>span{width:72px;height:72px;display:grid;place-items:center;margin-bottom:17px;color:#dc4e5b;border-radius:21px;background:#ffe7e9;font-size:35px}.pdf-dropzone h3{margin:0 0 8px;color:#3b3035;font-size:18px}.pdf-dropzone p{margin:0 0 20px;color:#9d9096;font-size:12px}.pdf-dropzone button,.pdf-list-head button{padding:10px 18px;color:#fff;border:0;border-radius:9px;background:#dd5360;font-size:12px;font-weight:700;cursor:pointer}.pdf-list-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}.pdf-list-head strong,.pdf-list-head small{display:block}.pdf-list-head strong{color:#342b2f;font-size:16px}.pdf-list-head small{margin-top:4px;color:#90868b;font-size:12px}.pdf-list-head>div:last-child{display:flex;gap:7px}.pdf-list-head button{padding:8px 10px;color:#675c61;border:1px solid #e5dfe1;background:#fff}.pdf-sort-tip{display:flex;align-items:center;gap:7px;margin:0 0 12px;padding:9px 11px;color:#7b7075;border-radius:8px;background:#f7f5f6;font-size:12px}.pdf-file-list{display:grid;gap:9px}.pdf-file-item{display:grid;grid-template-columns:26px 28px 45px minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 13px;border:1px solid #e9e5e7;border-radius:12px;background:#fcfbfc;transition:.2s}.pdf-file-item[draggable=true]{cursor:grab}.pdf-file-item.is-dragging{opacity:.45}.pdf-file-item.is-error{border-color:#f0c9c9;background:#fff7f7}.pdf-drag{color:#a69da1;font-size:18px}.pdf-number{color:#8e8489;font-size:12px;font-weight:700;text-align:center}.pdf-file-icon{width:42px;height:46px;display:grid;place-items:center;color:#d94d5a;border-radius:9px;background:#ffebed;font-size:23px}.pdf-file-item strong,.pdf-file-item small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pdf-file-item strong{color:#43383d;font-size:13px}.pdf-file-item small{margin-top:4px;color:#93898e;font-size:12px}.pdf-item-actions{display:flex;gap:5px}.pdf-item-actions button{width:31px;height:31px;border:1px solid #e5e0e2;border-radius:8px;color:#766a70;background:#fff;cursor:pointer}.pdf-item-actions button:disabled{opacity:.35;cursor:not-allowed}.pdf-output-settings{margin-top:20px;padding-top:19px;border-top:1px solid #eee9eb}.pdf-output-settings label{display:flex;align-items:center;justify-content:space-between;gap:18px;color:#554a4f;font-size:13px;font-weight:700}.pdf-output-settings label>div{width:min(380px,65%);height:43px;display:flex;align-items:center;padding:0 11px;border:1px solid #e2dcdf;border-radius:9px}.pdf-output-settings input{flex:1;min-width:0;border:0;outline:0;color:#43393d;background:transparent;font-size:13px}.pdf-output-settings em{color:#958b8f;font-size:12px;font-style:normal}.pdf-action-row{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:20px}.pdf-local-note{display:flex;align-items:center;gap:8px;color:#81757a;font-size:12px}.pdf-local-note i{color:#338c71}.pdf-merge-start{min-width:220px;height:48px;padding:0 22px;color:#fff;border:0;border-radius:11px;background:linear-gradient(135deg,#e45b68,#bd3947);font-size:13px;font-weight:750;box-shadow:0 10px 22px rgba(201,59,72,.2);cursor:pointer}.pdf-merge-start:disabled{opacity:.5;box-shadow:none;cursor:not-allowed}.pdf-result{padding:0 0 65px}.pdf-result-card{display:grid;grid-template-columns:66px minmax(0,1fr) auto;align-items:center;gap:20px;padding:26px 30px!important;border:1px solid #dcebe5;border-radius:18px;background:#fff;box-shadow:0 12px 36px rgba(31,99,76,.06)}.pdf-result-icon{width:62px;height:62px;display:grid;place-items:center;color:#16936e;border-radius:18px;background:#e9f8f3;font-size:31px}.pdf-result h2{margin:0 0 5px;color:#253b34;font-size:20px}.pdf-result p,.pdf-result small{display:block;margin:0;color:#76847f;font-size:12px}.pdf-result small{margin-top:4px}.pdf-result-card>button{height:45px;padding:0 18px;color:#fff;border:0;border-radius:10px;background:#159071;font-size:13px;font-weight:700;cursor:pointer}.pdf-result .favicon-record-note{grid-column:1/-1;margin:0}.pdf-guide{background:#fff}@media(max-width:700px){.pdf-panel{padding:20px}.pdf-list-head,.pdf-action-row,.pdf-output-settings label{align-items:flex-start;flex-direction:column}.pdf-list-head>div:last-child,.pdf-merge-start,.pdf-output-settings label>div{width:100%}.pdf-list-head button{flex:1}.pdf-file-item{grid-template-columns:22px 25px 39px minmax(0,1fr)}.pdf-file-icon{width:38px;height:42px}.pdf-item-actions{grid-column:1/-1}.pdf-item-actions button{flex:1}.pdf-result-card{grid-template-columns:55px 1fr;padding:22px!important}.pdf-result-icon{width:53px;height:53px}.pdf-result-card>button{grid-column:1/-1;width:100%}}

.pdf-split-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);align-items:start;gap:22px}.pdf-split-settings{position:sticky;top:92px}.pdf-source-card{display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:14px;padding:16px;border:1px solid #eadfe1;border-radius:13px;background:#fffafa}.pdf-source-card>span{width:52px;height:56px;display:grid;place-items:center;color:#d84d5a;border-radius:10px;background:#ffe8ea;font-size:27px}.pdf-source-card strong,.pdf-source-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pdf-source-card strong{color:#43383d;font-size:14px}.pdf-source-card small{margin-top:5px;color:#91858a;font-size:12px}.pdf-source-card button{height:37px;padding:0 11px;color:#755e66;border:1px solid #e5dadd;border-radius:8px;background:#fff;font-size:12px;cursor:pointer}.pdf-split-modes{display:grid;gap:8px;margin-bottom:20px}.pdf-split-modes label{display:block;cursor:pointer}.pdf-split-modes input{position:absolute;opacity:0}.pdf-split-modes label>span{display:grid;grid-template-columns:34px 1fr;align-items:center;padding:12px;border:1px solid #e5e1e3;border-radius:10px;color:#73676c;background:#fff}.pdf-split-modes label>span>i{grid-row:1/3;color:#b0a4a9;font-size:22px}.pdf-split-modes strong,.pdf-split-modes small{display:block;font-size:12px}.pdf-split-modes small{margin-top:3px;color:#968b90}.pdf-split-modes label.is-selected>span{border-color:#e0707a;background:#fff6f7;box-shadow:0 0 0 3px rgba(224,112,122,.07)}.pdf-split-modes label.is-selected>span>i,.pdf-split-modes label.is-selected strong{color:#cb4653}.pdf-range-setting{margin-bottom:19px}.pdf-range-setting>label,.pdf-name-setting{display:flex;flex-direction:column;gap:8px;color:#5e5358;font-size:12px;font-weight:700}.pdf-range-setting input{height:43px;padding:0 11px;color:#44393e;border:1px solid #e3dcdf;border-radius:9px;outline:0;font-size:13px}.pdf-range-setting>p{display:flex;gap:6px;margin:8px 0 0;color:#8d8186;font-size:12px;line-height:1.55}.pdf-range-presets{display:flex;gap:6px;margin-top:10px}.pdf-range-presets button{padding:6px 9px;color:#a13f49;border:1px solid #eed4d7;border-radius:7px;background:#fff8f8;font-size:12px;cursor:pointer}.pdf-name-setting{margin-bottom:18px}.pdf-name-setting>div{height:43px;display:flex;align-items:center;padding:0 11px;border:1px solid #e3dcdf;border-radius:9px}.pdf-name-setting input{flex:1;min-width:0;border:0;outline:0;color:#44393e;background:transparent;font-size:13px}.pdf-name-setting em{color:#95898e;font-size:12px;font-style:normal}.pdf-split-summary{margin:0 0 17px}.pdf-split-start{width:100%}.pdf-split-settings .compress-local-note{margin-bottom:0}@media(max-width:900px){.pdf-split-layout{grid-template-columns:1fr}.pdf-split-settings{position:static}}@media(max-width:560px){.pdf-source-card{grid-template-columns:45px minmax(0,1fr)}.pdf-source-card>span{width:44px;height:49px}.pdf-source-card button{grid-column:1/-1;width:100%}}

.pdf-pages-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:12px}.pdf-pages-toolbar strong,.pdf-pages-toolbar small{display:block;max-width:560px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pdf-pages-toolbar strong{color:#41363b;font-size:15px}.pdf-pages-toolbar small{margin-top:4px;color:#92868b;font-size:12px}.pdf-pages-toolbar>div:last-child{display:flex;gap:7px}.pdf-pages-toolbar button{height:36px;padding:0 11px;color:#6d6066;border:1px solid #e4dcdf;border-radius:8px;background:#fff;font-size:12px;cursor:pointer}.pdf-pages-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:15px}.pdf-page-card{min-width:0;padding:10px;border:1px solid #e5e1e3;border-radius:13px;background:#fbfafb;cursor:grab;transition:.2s}.pdf-page-card:hover{border-color:#dbaeb3;box-shadow:0 8px 20px rgba(67,43,49,.07);transform:translateY(-2px)}.pdf-page-card.is-dragging{opacity:.4}.pdf-page-sheet{position:relative;aspect-ratio:var(--page-ratio);display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;border:1px solid #e2dadd;border-radius:7px;color:#9f868c;background:linear-gradient(135deg,#fff,#f7f3f4);box-shadow:0 3px 8px rgba(57,42,47,.06)}.pdf-page-sheet>i{font-size:27px}.pdf-page-sheet>b{margin-top:7px;color:#6e5d63;font-size:12px}.pdf-page-sheet>small{margin-top:4px;color:#a39499;font-size:12px}.pdf-page-corner{position:absolute;top:0;right:0;width:20px;height:20px;background:linear-gradient(225deg,#efe5e7 50%,transparent 51%)}.pdf-page-card-meta{display:flex;align-items:center;justify-content:space-between;gap:5px;padding:9px 1px 7px}.pdf-page-card-meta strong,.pdf-page-card-meta em{font-size:12px}.pdf-page-card-meta strong{color:#5e5156}.pdf-page-card-meta em{color:#9a8d92;font-style:normal}.pdf-page-card-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px}.pdf-page-card-actions button{height:31px;border:1px solid #e5dfe1;border-radius:7px;color:#71656a;background:#fff;cursor:pointer}.pdf-page-card-actions button:last-child{color:#cb5360;background:#fff8f8}.pdf-pages-footer{display:grid;grid-template-columns:minmax(280px,.7fr) minmax(360px,1.3fr);align-items:end;gap:24px;margin-top:24px;padding-top:21px;border-top:1px solid #ece7e9}.pdf-pages-footer>label{display:flex;flex-direction:column;gap:8px;color:#5d5055;font-size:12px;font-weight:700}.pdf-pages-footer>label>div{height:43px;display:flex;align-items:center;padding:0 11px;border:1px solid #e1dade;border-radius:9px}.pdf-pages-footer input{flex:1;min-width:0;border:0;outline:0;color:#41363a;background:transparent;font-size:13px}.pdf-pages-footer em{color:#978b90;font-size:12px;font-style:normal}.pdf-pages-footer>div{display:flex;align-items:center;justify-content:flex-end;gap:18px}.pdf-pages-footer p{margin:0;color:#81757a;font-size:12px}.pdf-pages-footer .pdf-merge-start{min-width:190px}@media(max-width:1050px){.pdf-pages-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:800px){.pdf-pages-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pdf-pages-toolbar,.pdf-pages-footer,.pdf-pages-footer>div{align-items:flex-start;flex-direction:column}.pdf-pages-toolbar>div:last-child,.pdf-pages-footer>div,.pdf-pages-footer .pdf-merge-start{width:100%}.pdf-pages-toolbar button{flex:1}.pdf-pages-footer{display:flex}.pdf-pages-footer>label{width:100%}}@media(max-width:560px){.pdf-pages-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pdf-pages-toolbar>div:last-child{flex-wrap:wrap}.pdf-pages-toolbar button{min-width:calc(50% - 5px)}}

.images-pdf-layout{grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr)}.images-pdf-dropzone>span{color:#db6440;background:#fff0e8}.images-pdf-settings .compress-step-head>span,.images-pdf-start{background:linear-gradient(135deg,#e8754f,#c65031);box-shadow:0 10px 24px rgba(200,80,49,.2)}.images-pdf-list{display:grid;gap:9px}.images-pdf-item{display:grid;grid-template-columns:26px 28px 58px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px;border:1px solid #e7e4e1;border-radius:12px;background:#fdfcfb;cursor:grab}.images-pdf-item.is-dragging{opacity:.42}.images-pdf-item.is-error{border-color:#edc9c1;background:#fff8f6}.images-pdf-item>img{width:56px;height:56px;object-fit:cover;border-radius:9px;background:#f0ecea}.images-pdf-item strong,.images-pdf-item small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.images-pdf-item strong{color:#453b37;font-size:13px}.images-pdf-item small{margin-top:4px;color:#938984;font-size:12px}.images-pdf-settings input[type=range]{accent-color:#d66340}.images-pdf-settings .compress-setting b{color:#c75838}.images-pdf-name{margin-bottom:18px}.images-pdf-summary{margin:0 0 18px;color:#765e54;border-color:#ecdcd4;background:#fff9f6}.images-pdf-summary i{color:#d36342}@media(max-width:700px){.images-pdf-item{grid-template-columns:22px 25px 48px minmax(0,1fr)}.images-pdf-item>img{width:46px;height:46px}.images-pdf-item .pdf-item-actions{grid-column:1/-1}}

.favicon-package-card span { color: #cfcaff; font-size: 12px; font-weight: 750; text-transform: uppercase; }
.favicon-package-card h3, .favicon-single-card h3 { margin: 3px 0 4px; font-size: 13px; font-weight: 740; }
.favicon-package-card p, .favicon-single-card p { margin: 0; color: #d3d0f7; font-size:12px; }
.favicon-package-card button { padding: 9px 12px; color: #5144cf; border: 0; border-radius: 8px; background: #fff; font-size:12px; font-weight: 750; cursor: pointer; }
.favicon-single-card > span { width: 38px; height: 38px; display: grid; place-items: center; flex: none; color: var(--tool-primary); border-radius: 10px; background: #efedff; font-size: 18px; }
.favicon-single-card > div { flex: 1; }
.favicon-single-card h3 { color: #343b50; }
.favicon-single-card p { color: #969cad; line-height: 1.5; }
.favicon-single-card button { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid #e1e3ea; border-radius: 8px; background: #fff; color: #6e7588; cursor: pointer; }
.favicon-code-panel { margin-top: 18px; overflow: hidden; border: 1px solid #e3e5ed; border-radius: 13px; background: #151a2b; }
.favicon-code-head { display: flex; align-items: center; justify-content: space-between; height: 43px; padding: 0 14px; color: #b6bdcf; border-bottom: 1px solid rgba(255,255,255,.08); background: #1b2134; font-size:12px; }
.favicon-code-head div { display: flex; align-items: center; gap: 7px; }
.favicon-code-head button { padding: 6px 9px; color: #d9dcec; border: 1px solid rgba(255,255,255,.1); border-radius: 6px; background: rgba(255,255,255,.05); font-size:12px; cursor: pointer; }
.favicon-code-panel pre { margin: 0; padding: 18px; overflow: auto; color: #c6d1f3; font: 12px/1.9 Consolas, Monaco, monospace; }
.favicon-file-list { margin-top: 18px; padding: 17px; border: 1px solid #e6e8ef; border-radius: 13px; }
.favicon-file-list h3 { margin: 0 0 11px; color: #3a4256; font-size: 12px; }
.favicon-file-list > div { display: flex; align-items: center; justify-content: space-between; padding: 8px 2px; color: #565e72; border-top: 1px solid #f0f1f5; font-size:12px; }
.favicon-file-list span { display: flex; align-items: center; gap: 7px; }
.favicon-file-list span i { color: var(--tool-primary); }
.favicon-file-list em { color: #9ba1b0; font-style: normal; }
.favicon-guide-section { padding: 80px 0; background: #fff; }
.favicon-guide-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.favicon-guide-grid > div { position: relative; padding: 26px; border: 1px solid #e6e8ef; border-radius: 15px; text-align: center; }
.favicon-guide-grid b { position: absolute; top: 12px; left: 14px; color: #d5d1fa; font-size: 23px; }
.favicon-guide-grid i { display: block; margin-bottom: 13px; color: var(--tool-primary); font-size: 28px; }
.favicon-guide-grid h3 { margin: 0 0 7px; color: #343b50; font-size: 13px; }
.favicon-guide-grid p { margin: 0; color: #8c93a5; font-size:12px; line-height: 1.7; }

@media (max-width: 880px) {
    .favicon-layout { grid-template-columns: 1fr; }
    .favicon-preview-panel { position: static; }
    .favicon-output-grid { grid-template-columns: 1fr 1fr; }
    .favicon-package-card { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
    .favicon-heading { padding: 43px 0 36px; }
    .favicon-safety span { display: none; }
    .favicon-workspace { padding-top: 28px; }
    .favicon-main-panel, .favicon-preview-panel { padding: 20px; }
    .favicon-dropzone { min-height: 280px; }
    .favicon-source-bar { grid-template-columns: 48px 1fr; }
    .favicon-source-bar button { grid-column: 1 / -1; }
    .favicon-control-grid { grid-template-columns: 1fr; }
    .favicon-output-section > .container { padding: 20px !important; }
    .favicon-output-grid { grid-template-columns: 1fr; }
    .favicon-package-card { grid-column: auto; align-items: flex-start; flex-wrap: wrap; }
    .favicon-package-card button { width: 100%; }
    .favicon-guide-grid { grid-template-columns: 1fr; }
}

@media (max-width: 1100px) {
    .tool-nav-inner { gap: 14px; }
    .tool-desktop-nav { gap: 8px; }
    .tool-desktop-nav a { font-size: 12px; }
    .tool-hero-inner { gap: 40px; }
    .tool-card-grid { grid-template-columns: repeat(3, 1fr); }
    .tool-category-page .tool-category-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1280px) {
    .tool-home .tool-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 960px) {
    .toolbox-site .container { width: min(100% - 30px, 720px); }
    .tool-header, .tool-nav-inner { height: 68px; }
    .tool-header { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
    .tool-desktop-nav, .tool-login-link, .tool-register-link, .tool-member-link { display: none; }
    .tool-nav-actions { margin-left: auto; }
    .tool-mobile-toggle { display: grid; }
    .tool-mobile-nav { position: fixed; z-index: 1200; inset: 0 0 0 auto; width: min(340px, 88vw); height: 100vh; height: 100dvh; max-height: 100dvh; display: flex; flex-direction: column; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; padding: 18px 18px max(18px, env(safe-area-inset-bottom)); background: #fff; box-shadow: -20px 0 55px rgba(19, 25, 48, .16); transform: translateX(105%); transition: transform .25s ease; }
    .tool-mobile-nav.is-open { transform: translateX(0); }
    .tool-mobile-head { position: sticky; z-index: 1; top: -18px; display: flex; align-items: center; justify-content: space-between; margin: 0 -2px 9px; padding: 18px 2px 14px; border-bottom: 1px solid #eceef4; background: #fff; }
    .tool-mobile-head strong { color: #171d31; font-size: 16px; }
    .tool-mobile-head button { width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 10px; color: #424a5d; background: #f2f3f7; cursor: pointer; }
    .tool-mobile-nav > a { display: flex; align-items: center; gap: 11px; min-height: 46px; padding: 11px 12px; color: #40485d; border-radius: 10px; font-size: 14px; font-weight: 650; }
    .tool-mobile-nav > a:hover, .tool-mobile-nav > a:focus-visible { color: var(--tool-primary); background: #f5f3ff; }
    .tool-mobile-nav > a i { width: 20px; color: #737b91; text-align: center; font-size: 17px; }
    .tool-mobile-account { margin-top: auto; padding-top: 18px; }
    .tool-mobile-account a { display: block; padding: 12px; color: #fff; border-radius: 10px; background: var(--tool-primary); text-align: center; font-size: 13px; font-weight: 700; }
    .tool-nav-backdrop { position: fixed; z-index: 1100; inset: 0; display: block; opacity: 0; visibility: hidden; background: rgba(17, 23, 42, .48); transition: .2s; }
    .tool-nav-backdrop.is-open { opacity: 1; visibility: visible; }
    .toolbox-site.is-mobile-nav-open { overflow: hidden; }
    .tool-hero { padding-top: 58px; }
    .tool-hero-inner { grid-template-columns: 1fr; }
    .tool-hero-copy { text-align: center; }
    .tool-trust-pill, .tool-hero-search { margin-inline: auto; }
    .tool-hero-hot { justify-content: center; }
    .tool-hero-board { width: min(500px, 100%); margin: 0 auto; transform: none; }
    .tool-proof-row { grid-template-columns: repeat(2, 1fr); }
    .tool-proof-row span:nth-child(3) { border-left: 0; }
    .tool-card-grid { grid-template-columns: repeat(2, 1fr); }
    .tool-category-page .tool-category-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tool-category-grid { grid-template-columns: repeat(2, 1fr); }
    .tool-home .tool-featured-section .tool-card-grid, .tool-ranking-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tool-local-card { grid-template-columns: 1fr; gap: 25px; padding: 38px !important; }
    .tool-local-visual { height: 220px; }
    .tool-footer-columns { grid-template-columns: 1.2fr 1fr 1fr; gap: 34px; }
    .tool-footer-brand { grid-column: 1 / -1; max-width: 560px; }
}

@media (max-width: 560px) {
    .toolbox-site .container { width: calc(100% - 24px); }
    .tool-logo{gap:7px}
    .tool-logo img,.tool-logo-mark { width: 40px; height: 40px; }
    .tool-logo-mark{font-size:40px!important}
    .tool-logo-copy strong{font-size:18px}
    .tool-logo-copy small{margin-top:4px;font-size:12px!important}
    .tool-logo-copy small:before,.tool-logo-copy small:after{width:10px}
    .tool-nav-search.is-open { position: fixed; z-index: 1350; top: 13px; right: 58px; width: calc(100% - 82px); }
    .tool-nav-search.is-open .tool-nav-search-box, .tool-nav-search-results { width: 100%; }
    .tool-hero { padding-top: 46px; }
    .tool-hero-copy h1 { font-size: 38px; letter-spacing: -1.6px; }
    .tool-hero-copy > p { font-size: 14px; }
    .tool-hero-search { height: 56px; }
    .tool-hero-search kbd { display: none; }
    .tool-proof-row { margin-top: 50px; }
    .tool-proof-row span { flex-direction: column; text-align: center; }
    .tool-section { padding: 65px 0; }
    .tool-section-heading { align-items: flex-start; }
    .tool-section-heading > a { display: none; }
    .tool-section-heading h2 { font-size: 25px; }
    .tool-card-grid, .tool-category-grid { grid-template-columns: 1fr; }
    .tool-category-page .tool-category-tools { grid-template-columns: 1fr; }
    .tool-card { min-height: 195px; }
    .tool-home .tool-featured-section .tool-card-grid, .tool-ranking-grid { grid-template-columns: 1fr; }
    .tool-featured-section .tool-card { min-height: 108px; padding: 18px; }
    .tool-ranking-section { padding: 65px 0; }
    .tool-ranking-card { padding: 18px; }
    .tool-ranking-card li { grid-template-columns: 26px minmax(0, 1fr); padding: 9px 0; }
    .tool-ranking-card em { grid-column: 2; margin-top: -7px; }
    .tool-category-grid > a { min-height: 105px; }
    .tool-local-section { padding: 65px 0; }
    .tool-local-card { padding: 30px 22px !important; }
    .tool-local-copy h2 { font-size: 27px; }
    .tool-member-card { align-items: flex-start; flex-direction: column; padding: 28px 22px !important; }
    .tool-member-actions { width: 100%; }
    .tool-category-hero { padding: 52px 0 42px; }
    .tool-category-hero h1 { font-size: 34px; }
    .tool-category-overview { align-items: flex-start; flex-direction: column; }
    .tool-footer-columns { grid-template-columns: 1fr 1fr; gap: 30px 24px; padding-top: 38px; padding-bottom: 32px; }
    .tool-footer-brand,.tool-footer-categories { grid-column: 1 / -1; }
    .tool-footer-categories>div { grid-template-columns: 1fr 1fr; }
    .tool-friend-links { align-items:flex-start; flex-direction:column; gap:10px; padding-block:16px; }
    .tool-friend-links { align-items: flex-start; padding-block: 16px; }
    .tool-footer-bottom { align-items: flex-start; flex-direction: column; justify-content: center; gap: 5px; }
}

.json-heading{background:linear-gradient(180deg,#fffdf3,#fff)}.json-heading .tool-category-kicker{color:#9a7411}.json-workspace{padding:42px 0 70px;background:#f7f8fa}.json-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}.json-primary-actions,.json-secondary-actions,.json-secondary-actions label{display:flex;align-items:center;gap:8px}.json-toolbar button,.json-secondary-actions select{height:39px;padding:0 12px;color:#5c5c55;border:1px solid #dedfdc;border-radius:9px;background:#fff;font-size:12px;cursor:pointer}.json-toolbar button i{margin-right:5px}.json-toolbar button.is-primary{color:#fff;border-color:#b58a18;background:#b58a18;font-weight:700}.json-secondary-actions label{height:39px;padding:0 10px;color:#73736c;border:1px solid #dedfdc;border-radius:9px;background:#fff;font-size:12px}.json-secondary-actions select{height:30px;padding:0 5px;border:0;background:#f5f5f2}.json-secondary-actions .json-check{cursor:pointer}.json-check input{accent-color:#b58a18}.json-notice{display:flex;align-items:flex-start;gap:8px;margin-bottom:13px;padding:11px 13px;color:#41695c;border:1px solid #cfe5dd;border-radius:9px;background:#effaf6;font-size:12px}.json-notice.is-error{color:#a2464c;border-color:#efd0d3;background:#fff4f5}.json-editor-grid{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border:1px solid #dcdee3;border-radius:15px;background:#fff;box-shadow:0 15px 38px rgba(44,51,65,.06)}.json-editor-panel{min-width:0}.json-editor-panel+section{border-left:1px solid #dcdee3}.json-editor-panel header{height:54px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 15px;border-bottom:1px solid #e5e6ea;background:#fafafa}.json-editor-panel header>div{display:flex;align-items:center;gap:8px}.json-editor-panel header span{color:#3d414b;font-size:13px;font-weight:750}.json-editor-panel header small{color:#8c9099;font-size:12px}.json-editor-panel header button{height:32px;padding:0 9px;color:#696e79;border:1px solid #dfe1e5;border-radius:7px;background:#fff;font-size:12px;cursor:pointer}.json-editor-panel header button:disabled{opacity:.45;cursor:not-allowed}.json-editor-panel textarea{width:100%;height:500px;display:block;resize:vertical;padding:18px;color:#2f3746;border:0;outline:0;background:#fff;font:13px/1.7 Consolas,Monaco,"Microsoft YaHei",monospace;tab-size:2}.json-editor-panel.is-output textarea{background:#fcfcfb}.json-result-bar{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:14px;padding:15px 18px;border:1px solid #e0e2e5;border-radius:12px;background:#fff}.json-result-bar>div{display:flex;align-items:flex-start;gap:8px;color:#737882;font-size:12px;line-height:1.55}.json-result-bar>div.is-success{color:#23805f}.json-result-bar>div.is-error{color:#bd424d}.json-result-bar>div i{margin-top:2px;font-size:16px}.json-result-bar dl{display:flex;gap:22px;margin:0}.json-result-bar dl div{min-width:58px;text-align:center}.json-result-bar dt{color:#9498a1;font-size:12px;font-weight:500}.json-result-bar dd{margin:3px 0 0;color:#464c57;font-size:14px;font-weight:750}.json-workspace .favicon-record-note{margin-top:14px}.json-guide{background:#fff}@media(max-width:1050px){.json-toolbar{align-items:flex-start;flex-direction:column}.json-secondary-actions{flex-wrap:wrap}}@media(max-width:760px){.json-editor-grid{grid-template-columns:1fr}.json-editor-panel+section{border-top:1px solid #dcdee3;border-left:0}.json-editor-panel textarea{height:360px}.json-result-bar{align-items:flex-start;flex-direction:column}.json-result-bar dl{width:100%;justify-content:space-between;gap:8px}}@media(max-width:560px){.json-primary-actions,.json-secondary-actions{width:100%}.json-primary-actions button{flex:1}.json-secondary-actions label,.json-secondary-actions button{flex:1;justify-content:center}.json-secondary-actions label:first-child{flex-basis:100%}.json-editor-panel header{height:auto;min-height:54px;align-items:flex-start;flex-direction:column;padding:11px 13px}.json-editor-panel header>div{width:100%;justify-content:space-between}.json-editor-panel header>div:last-child{justify-content:flex-end}}

.flex-heading{background:linear-gradient(180deg,#f7f4ff,#fff)}.flex-heading .tool-category-kicker{color:#745bd1}.flex-workspace{padding:46px 0 75px;background:#f7f7fa}.flex-shell{display:grid;grid-template-columns:minmax(340px,.72fr) minmax(0,1.28fr);align-items:start;gap:22px}.flex-controls,.flex-preview-card,.flex-presets,.flex-code-card{border:1px solid #e2e1e8;border-radius:18px;background:#fff;box-shadow:0 12px 38px rgba(57,48,89,.055)}.flex-controls{padding:25px;position:sticky;top:88px}.flex-control-head,.flex-control-head>div,.flex-item-heading,.flex-item-heading>div{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.flex-control-head>div,.flex-item-heading>div{justify-content:flex-start}.flex-control-head>div>span,.flex-item-heading>div>span{width:32px;height:32px;display:grid;place-items:center;flex:none;color:#fff;border-radius:9px;background:#765de0;font-size:12px;font-weight:800}.flex-control-head h2,.flex-item-heading h2{margin:0 0 3px;color:#343346;font-size:17px}.flex-control-head p,.flex-item-heading p{margin:0;color:#91909c;font-size:12px}.flex-control-head>button{height:32px;padding:0 9px;color:#706e7b;border:1px solid #e2e1e7;border-radius:8px;background:#fafafa;font-size:12px;cursor:pointer}.flex-control-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}.flex-control-grid label{display:flex;flex-direction:column;gap:7px;color:#666574;font-size:12px;font-weight:650}.flex-control-grid label:first-child{grid-column:1/-1}.flex-control-grid select,.flex-control-grid input{width:100%;height:40px;padding:0 10px;color:#464554;border:1px solid #deddE5;border-radius:9px;outline:0;background:#fff;font-size:12px}.flex-control-grid select:focus,.flex-control-grid input:focus{border-color:#8a74e5;box-shadow:0 0 0 3px rgba(118,93,224,.08)}.flex-range-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:20px}.flex-range-grid label{display:flex;flex-direction:column;gap:7px;color:#696777;font-size:12px}.flex-range-grid label span{display:flex;justify-content:space-between}.flex-range-grid b{color:#765de0;font-size:12px}.flex-range-grid input{width:100%;accent-color:#765de0}.flex-divider{height:1px;margin:25px 0;background:#ecebf0}.flex-item-heading>div:last-child{gap:6px}.flex-item-heading button{width:32px;height:32px;color:#725fd0;border:1px solid #dfd9f8;border-radius:8px;background:#f8f6ff;font-size:16px;cursor:pointer}.flex-item-heading button:disabled{opacity:.4;cursor:not-allowed}.flex-selected{display:flex;align-items:center;justify-content:space-between;margin-top:18px;padding:10px 12px;color:#7c7988;border-radius:9px;background:#f7f6fb;font-size:12px}.flex-selected strong{color:#7159d4}.flex-control-grid.is-item{margin-top:13px}.flex-control-grid.is-item label:first-child{grid-column:auto}.flex-control-grid.is-item .is-wide{grid-column:1/-1}.flex-local-tip{display:flex;align-items:flex-start;gap:7px;margin:20px 0 0;padding:10px;color:#7f7c8a;border-radius:9px;background:#f7f7f9;font-size:12px;line-height:1.55}.flex-local-tip i{color:#765de0}.flex-stage-column{display:grid;gap:15px;min-width:0}.flex-preview-card{overflow:hidden}.flex-preview-card header,.flex-code-card header{min-height:55px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 16px;border-bottom:1px solid #e8e7ec}.flex-preview-card header span,.flex-code-card header span{display:block;color:#3d3b4b;font-size:13px;font-weight:750}.flex-preview-card header small,.flex-code-card header small{display:block;margin-top:3px;color:#92909d;font-size:12px}.flex-viewports,.flex-code-card header>div{display:flex;align-items:center;gap:6px}.flex-viewports button{width:34px;height:33px;color:#7c7987;border:1px solid #e2e1e7;border-radius:8px;background:#fff;cursor:pointer}.flex-viewports button.is-active{color:#fff;border-color:#765de0;background:#765de0}.flex-preview-outer{min-height:420px;display:flex;align-items:flex-start;justify-content:center;padding:28px;overflow:auto;background:repeating-linear-gradient(45deg,#f4f3f7,#f4f3f7 12px,#f8f7fa 12px,#f8f7fa 24px)}.flex-preview{width:100%;overflow:auto;border:2px dashed #c9c3e2;border-radius:14px;background:#eeebfa;transition:width .25s}.flex-preview-outer[data-viewport=tablet] .flex-preview{width:720px}.flex-preview-outer[data-viewport=mobile] .flex-preview{width:360px}.flex-demo-item{min-width:0;min-height:74px;padding:12px;color:#fff;border:3px solid transparent;border-radius:11px;outline:0;box-shadow:0 6px 15px rgba(42,38,59,.12);cursor:pointer}.flex-demo-item strong,.flex-demo-item small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flex-demo-item strong{font-size:13px}.flex-demo-item small{margin-top:5px;color:rgba(255,255,255,.86);font-size:12px}.flex-demo-item.is-selected{border-color:#fff;box-shadow:0 0 0 3px #4e3aa9,0 8px 18px rgba(42,38,59,.17)}.flex-preview-card footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 16px;color:#85828f;border-top:1px solid #e8e7ec;font-size:12px}.flex-preview-card footer i{margin-right:5px;color:#765de0}.flex-presets{padding:16px}.flex-presets>span{display:block;margin-bottom:10px;color:#5d5a69;font-size:12px;font-weight:750}.flex-presets>div{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.flex-presets button{height:40px;color:#625d76;border:1px solid #e4e0f2;border-radius:9px;background:#faf9ff;font-size:12px;cursor:pointer}.flex-presets button:hover{color:#654dcc;border-color:#cfc5f3}.flex-presets button i{margin-right:5px}.flex-code-card{overflow:hidden}.flex-code-card header button{height:35px;padding:0 10px;color:#696674;border:1px solid #e1e0e6;border-radius:8px;background:#fff;font-size:12px;cursor:pointer}.flex-code-card header button.is-primary{color:#fff;border-color:#765de0;background:#765de0}.flex-code-tabs{height:39px;display:flex;align-items:end;gap:3px;padding:0 14px;background:#1f2030}.flex-code-tabs button{height:32px;padding:0 16px;color:#9da2b8;border:0;border-radius:7px 7px 0 0;background:transparent;font-size:12px;cursor:pointer}.flex-code-tabs button.is-active{color:#fff;background:#2c2e43}.flex-code-card pre{min-height:245px;margin:0;padding:20px;overflow:auto;color:#d9ddf1;background:#2c2e43;font:13px/1.75 Consolas,Monaco,monospace}.flex-stage-column>.favicon-record-note{margin:0}@media(max-width:1050px){.flex-shell{grid-template-columns:1fr}.flex-controls{position:static}.flex-preview-outer{min-height:380px}}@media(max-width:680px){.flex-controls{padding:20px}.flex-control-grid,.flex-range-grid{grid-template-columns:1fr}.flex-control-grid label:first-child,.flex-control-grid.is-item .is-wide{grid-column:auto}.flex-preview-card header,.flex-code-card header{align-items:flex-start;flex-direction:column}.flex-preview-card header>div,.flex-code-card header>div{width:100%;justify-content:space-between}.flex-preview-outer{padding:15px}.flex-presets>div{grid-template-columns:1fr 1fr}.flex-code-card header button{flex:1}.flex-preview-card footer{align-items:flex-start;flex-direction:column}}

.qr-heading{background:linear-gradient(180deg,#effbf6,#fff)}.qr-heading .tool-category-kicker{color:#168663}.qr-workspace{padding:48px 0 72px;background:#f6f9f8}.qr-shell{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(330px,.82fr);align-items:start;gap:22px}.qr-controls,.qr-preview-panel{padding:28px;border:1px solid #dde8e3;border-radius:19px;background:#fff;box-shadow:0 13px 40px rgba(25,90,68,.055)}.qr-preview-panel{position:sticky;top:90px}.qr-step-head,.qr-preview-head>div,.qr-control-head{display:flex;align-items:flex-start;gap:12px}.qr-step-head>span,.qr-preview-head>div>span{width:33px;height:33px;display:grid;place-items:center;flex:none;color:#fff;border-radius:9px;background:#17926e;font-size:12px;font-weight:800}.qr-step-head h2,.qr-preview-head h2{margin:0 0 3px;color:#2d413a;font-size:18px}.qr-step-head p,.qr-preview-head p{margin:0;color:#8a9994;font-size:12px}.qr-type-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:22px 0}.qr-type-tabs button{height:46px;color:#697871;border:1px solid #dde5e1;border-radius:10px;background:#fff;font-size:12px;cursor:pointer}.qr-type-tabs button i{margin-right:5px;font-size:16px}.qr-type-tabs button.is-active{color:#fff;border-color:#17926e;background:#17926e;box-shadow:0 7px 17px rgba(23,146,110,.18)}.qr-form-panel label,.qr-setting-grid label,.qr-range{display:flex;flex-direction:column;gap:7px;color:#5c6c66;font-size:12px;font-weight:680}.qr-form-panel input,.qr-form-panel textarea,.qr-form-panel select,.qr-setting-grid select,.qr-color{width:100%;padding:0 11px;color:#34433e;border:1px solid #dce4e1;border-radius:9px;outline:0;background:#fff;font-size:13px}.qr-form-panel input,.qr-form-panel select,.qr-setting-grid select,.qr-color{height:42px}.qr-form-panel textarea{padding:11px;resize:vertical;line-height:1.6}.qr-form-panel input:focus,.qr-form-panel textarea:focus,.qr-form-panel select:focus,.qr-setting-grid select:focus{border-color:#36a884;box-shadow:0 0 0 3px rgba(23,146,110,.08)}.qr-form-panel>p{display:flex;gap:6px;margin:8px 0 0;color:#8d9995;font-size:12px}.qr-form-grid,.qr-setting-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.qr-form-grid .is-wide{grid-column:1/-1}.qr-form-grid .qr-check{height:42px;display:flex;align-items:center;flex-direction:row;padding:0 11px;border:1px solid #dce4e1;border-radius:9px;font-weight:500;cursor:pointer}.qr-check input{width:auto;height:auto;accent-color:#17926e}.qr-content-meta{display:flex;align-items:center;justify-content:space-between;margin-top:12px;color:#8a9692;font-size:12px}.qr-content-meta button{padding:5px 8px;color:#8a716e;border:0;background:transparent;font-size:12px;cursor:pointer}.qr-divider{height:1px;margin:25px 0;background:#e9eeec}.qr-setting-grid{margin-top:20px}.qr-color{display:flex;align-items:center;padding:0 8px}.qr-color input[type=color]{width:28px;height:28px;padding:0;border:0;background:transparent;cursor:pointer}.qr-color input[type=text]{flex:1;min-width:0;height:auto;padding:0 7px;border:0;box-shadow:none;font-family:Consolas,monospace}.qr-range{margin-top:17px}.qr-range span{display:flex;justify-content:space-between}.qr-range b{color:#168d69}.qr-range input{width:100%;accent-color:#17926e}.qr-notice{display:flex;gap:7px;margin-top:16px;padding:10px 11px;color:#31755f;border:1px solid #d4ebe2;border-radius:9px;background:#f1faf6;font-size:12px}.qr-notice.is-error{color:#ad4e55;border-color:#efd5d7;background:#fff5f6}.qr-preview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.qr-preview-head em{padding:5px 8px;color:#17845f;border-radius:7px;background:#eaf8f3;font-size:12px;font-style:normal}.qr-preview-stage{position:relative;min-height:390px;display:grid;place-items:center;margin:25px 0 17px;padding:38px;border-radius:17px;background:linear-gradient(145deg,#eff8f4,#f9fcfb)}.qr-preview-stage canvas{width:min(100%,300px);height:auto;display:block;border-radius:4px;box-shadow:0 9px 30px rgba(26,67,53,.12)}.qr-empty{display:flex;align-items:center;flex-direction:column;gap:10px;color:#91a099;font-size:12px}.qr-empty i{font-size:66px}.qr-empty.is-error{color:#bd6269}.qr-corner{position:absolute;width:22px;height:22px;border-color:#63b89d}.qr-corner.one{top:17px;left:17px;border-top:2px solid;border-left:2px solid}.qr-corner.two{top:17px;right:17px;border-top:2px solid;border-right:2px solid}.qr-corner.three{bottom:17px;left:17px;border-bottom:2px solid;border-left:2px solid}.qr-corner.four{right:17px;bottom:17px;border-right:2px solid;border-bottom:2px solid}.qr-preview-info{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:17px}.qr-preview-info>span{display:flex;align-items:center;gap:8px;color:#394b44;font-size:13px}.qr-preview-info i{color:#17926e;font-size:19px}.qr-preview-info small{color:#8b9893;font-size:12px}.qr-downloads{display:grid;grid-template-columns:1fr 1fr;gap:9px}.qr-downloads button,.qr-copy-content{height:44px;color:#3f6e5e;border:1px solid #cae2da;border-radius:10px;background:#f3faf7;font-size:12px;font-weight:700;cursor:pointer}.qr-downloads button.is-primary{color:#fff;border-color:#17926e;background:#17926e;box-shadow:0 8px 18px rgba(23,146,110,.18)}.qr-downloads button:disabled{opacity:.45;cursor:not-allowed}.qr-copy-content{width:100%;height:39px;margin-top:9px;color:#757f7b;border-color:#e2e6e4;background:#fff;font-weight:500}.qr-preview-panel .favicon-record-note{margin:14px 0 0}.qr-guide{background:#fff}@media(max-width:950px){.qr-shell{grid-template-columns:1fr}.qr-preview-panel{position:static}.qr-preview-stage{min-height:350px}}@media(max-width:600px){.qr-controls,.qr-preview-panel{padding:20px}.qr-type-tabs{grid-template-columns:1fr 1fr}.qr-form-grid,.qr-setting-grid{grid-template-columns:1fr}.qr-form-grid .is-wide{grid-column:auto}.qr-preview-stage{min-height:300px;padding:28px}.qr-preview-info{align-items:flex-start;flex-direction:column}.qr-downloads{grid-template-columns:1fr}}

.html-editor-heading{padding:42px 0 34px;border-bottom:1px solid #e3e6eb;background:linear-gradient(180deg,#f1f3f7,#fff)}.html-editor-heading .tool-breadcrumb{justify-content:flex-start;margin-bottom:18px}.html-editor-title{display:flex;align-items:flex-end;justify-content:space-between;gap:30px}.html-editor-title h1{margin:5px 0 8px;color:#202736;font-size:38px;font-weight:800}.html-editor-title p{margin:0;color:#747d8b;font-size:14px}.html-editor-title .tool-category-kicker{color:#344154}.html-editor-safety{display:flex;align-items:center;gap:9px;padding:10px 13px;color:#63716d;border:1px solid #dfe7e4;border-radius:10px;background:#f7fbf9;font-size:12px}.html-editor-safety i{color:#188965;font-size:19px}.html-editor-safety strong{display:block;color:#2b5e4e}.html-editor-workspace{padding:22px 0 65px;background:#f2f3f6}.html-editor-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}.html-editor-actions{display:flex;align-items:center;gap:7px}.html-editor-actions button,.html-template-select{height:38px;display:flex;align-items:center;padding:0 11px;color:#5e6571;border:1px solid #d9dce2;border-radius:8px;background:#fff;font-size:12px;cursor:pointer}.html-editor-actions button.is-primary{color:#fff;border-color:#2e394a;background:#2e394a;font-weight:700}.html-editor-actions button i{margin-right:5px}.html-editor-actions kbd{margin-left:7px;padding:2px 5px;color:#d8dce5;border:1px solid rgba(255,255,255,.16);border-radius:4px;background:rgba(255,255,255,.08);font-size:12px}.html-auto-run{height:38px;display:flex;align-items:center;gap:7px;padding:0 10px;color:#646b76;border:1px solid #d9dce2;border-radius:8px;background:#fff;font-size:12px;cursor:pointer}.html-auto-run input{position:absolute;opacity:0}.html-auto-run>i{position:relative;width:32px;height:18px;border-radius:20px;background:#cfd3da}.html-auto-run>i:after{content:"";position:absolute;top:3px;left:3px;width:12px;height:12px;border-radius:50%;background:#fff;transition:.2s}.html-auto-run input:checked+i{background:#2e9476}.html-auto-run input:checked+i:after{left:17px}.html-template-select{gap:7px;cursor:default}.html-template-select select{height:28px;color:#404754;border:0;outline:0;background:#f4f5f7;font-size:12px}.html-editor-shell{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border:1px solid #d8dbe1;border-radius:15px;background:#fff;box-shadow:0 15px 44px rgba(35,42,55,.08)}.html-code-pane,.html-preview-pane{min-width:0}.html-preview-pane{border-left:1px solid #d8dbe1}.html-code-tabs{height:51px;display:flex;align-items:flex-end;gap:2px;padding:0 10px;background:#252936}.html-code-tabs button{height:41px;display:flex;align-items:center;gap:5px;padding:0 13px;color:#9da4b4;border:0;border-radius:8px 8px 0 0;background:transparent;font-size:12px;cursor:pointer}.html-code-tabs button i{font-size:17px}.html-code-tabs button small{color:#787f90;font-size:12px}.html-code-tabs button.is-active{color:#fff;background:#343947}.html-code-tabs button.is-active small{color:#b7bdcb}.html-editor-area{position:relative;height:590px;display:grid;grid-template-columns:48px minmax(0,1fr);overflow:hidden;background:#292e3b}.html-line-numbers{height:100%;padding:16px 9px;overflow:hidden;color:#687083;border-right:1px solid #3a3f4d;text-align:right;white-space:pre;font:13px/1.7 Consolas,Monaco,monospace;user-select:none}.html-editor-area textarea{width:100%;height:100%;resize:none;padding:16px;color:#dce2ef;border:0;outline:0;background:#292e3b;font:13px/1.7 Consolas,Monaco,"Microsoft YaHei",monospace;tab-size:2;white-space:pre}.html-code-pane>footer{height:39px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;color:#838b9b;background:#252936;font-size:12px}.html-code-pane>footer i{margin-right:5px;color:#63b796}.html-preview-pane>header{height:51px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 12px;border-bottom:1px solid #e0e2e6;background:#fafafa}.html-preview-pane>header span,.html-preview-pane>header small{display:block}.html-preview-pane>header span{color:#3c4350;font-size:13px;font-weight:750}.html-preview-pane>header small{margin-top:2px;color:#8a909b;font-size:12px}.html-preview-viewports{display:flex;gap:5px}.html-preview-viewports button{width:32px;height:31px;color:#757c88;border:1px solid #dee0e5;border-radius:7px;background:#fff;cursor:pointer}.html-preview-viewports button.is-active{color:#fff;border-color:#354052;background:#354052}.html-preview-stage{height:425px;display:flex;justify-content:center;padding:0;overflow:auto;background:repeating-linear-gradient(45deg,#eff0f3,#eff0f3 12px,#f5f5f7 12px,#f5f5f7 24px)}.html-preview-stage iframe{width:100%;height:100%;border:0;background:#fff;transition:width .25s}.html-preview-stage[data-viewport=tablet] iframe{width:720px}.html-preview-stage[data-viewport=mobile] iframe{width:375px}.html-console{height:204px;border-top:1px solid #dfe1e5;background:#20242e}.html-console>header{height:37px;display:flex;align-items:center;justify-content:space-between;padding:0 11px;color:#adb4c2;border-bottom:1px solid #363b47;font-size:12px}.html-console>header button{color:#8f97a7;border:0;background:transparent;font-size:12px;cursor:pointer}.html-console-list{height:167px;overflow:auto;padding:8px 11px;color:#d3d8e2;font:12px/1.6 Consolas,monospace}.html-console-list p{display:grid;grid-template-columns:48px 1fr;gap:7px;margin:0;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.055)}.html-console-list p>span{color:#7f8798;text-transform:uppercase}.html-console-list p>code{color:inherit;white-space:pre-wrap;word-break:break-word}.html-console-list p.is-info{color:#77b9ef}.html-console-list p.is-warn{color:#e3bc65}.html-console-list p.is-error{color:#ef7d86}.html-console-list p.is-muted{display:block;color:#7f8797}.html-editor-record{margin:13px 0 0}.html-editor-guide{background:#fff}@media(max-width:1100px){.html-editor-toolbar{align-items:flex-start;flex-direction:column}.html-editor-actions{flex-wrap:wrap}.html-editor-shell{grid-template-columns:1fr}.html-preview-pane{border-top:1px solid #d8dbe1;border-left:0}.html-editor-area{height:470px}}@media(max-width:650px){.html-editor-heading{padding:35px 0 28px}.html-editor-title{align-items:flex-start;flex-direction:column}.html-editor-title h1{font-size:32px}.html-editor-actions{width:100%}.html-editor-actions button,.html-auto-run{flex:1;justify-content:center}.html-editor-actions kbd{display:none}.html-template-select{width:100%;justify-content:space-between}.html-template-select select{flex:1}.html-code-tabs{padding:0 5px}.html-code-tabs button{flex:1;justify-content:center;padding:0 5px}.html-code-tabs button small{display:none}.html-editor-area{height:410px;grid-template-columns:40px}.html-preview-stage{height:360px}.html-console{height:190px}.html-console-list{height:153px}}

.multi-tool-heading{background:linear-gradient(180deg,#f4f8fb,#fff)}.multi-tool-workspace{padding:45px 0 72px;background:#f5f6f8}.multi-tool-workspace button,.multi-tool-workspace input,.multi-tool-workspace select,.multi-tool-workspace textarea{font-size:13px}.multi-tool-record{margin:14px 0 0}.wb-toolbar{min-height:65px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 16px;border:1px solid #dde1e7;border-radius:14px 14px 0 0;background:#fff}.wb-toolbar strong,.wb-toolbar span{display:block}.wb-toolbar strong{color:#303744;font-size:16px}.wb-toolbar span{margin-top:3px;color:#8a919c;font-size:12px}.wb-toolbar>[data-actions]{display:flex;align-items:center;flex-wrap:wrap;gap:7px}.wb-toolbar button,.wb-toolbar label,.wb-builder button,.wb-form-result button{height:37px;display:flex;align-items:center;gap:6px;padding:0 11px;color:#59616d;border:1px solid #dce0e5;border-radius:8px;background:#fff;font-size:12px;cursor:pointer}.wb-toolbar label{cursor:default}.wb-toolbar select{height:28px;border:0;outline:0;background:#f4f5f7}.wb-toolbar button.is-primary,.wb-builder button.is-primary,.wb-form-result button.is-primary,.wb-api .is-primary{color:#fff;border-color:#334153;background:#334153;font-weight:700}.wb-check input{accent-color:#334153}.wb-editor-grid{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border:1px solid #dde1e7;border-top:0;border-radius:0 0 14px 14px;background:#fff;box-shadow:0 14px 38px rgba(42,50,62,.055)}.wb-editor-grid section+section{border-left:1px solid #dde1e7}.wb-editor-grid header{height:43px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;color:#3e4652;border-bottom:1px solid #e4e7eb;background:#fafafa;font-size:13px;font-weight:700}.wb-editor-grid small{color:#9299a4;font-size:12px;font-weight:500}.wb-editor-grid textarea{width:100%;height:480px;display:block;resize:vertical;padding:17px;color:#2c3440;border:0;outline:0;font:13px/1.75 Consolas,Monaco,"Microsoft YaHei",monospace}.wb-editor-grid section:last-child textarea{background:#fbfbfa}.wb-status{display:flex;align-items:flex-start;gap:8px;margin-top:12px;padding:12px 14px;color:#6c7682;border:1px solid #dde1e6;border-radius:10px;background:#fff;font-size:12px}.wb-status.is-success{color:#28765f;border-color:#cee6de;background:#f2faf7}.wb-status.is-error{color:#ae4f57;border-color:#eed3d6;background:#fff5f6}.wb-builder{display:grid;grid-template-columns:340px minmax(0,1fr);align-items:start;gap:20px}.wb-builder>aside,.wb-builder>section,.wb-form-result>section,.wb-api-request,.wb-api-response,.wb-api-history{overflow:hidden;border:1px solid #dde1e6;border-radius:15px;background:#fff;box-shadow:0 12px 34px rgba(45,53,65,.05)}.wb-builder>aside{padding:24px}.wb-builder h2,.wb-form-result h2{margin:0 0 19px;color:#303744;font-size:18px}.wb-builder aside>label,.wb-builder [data-effect-controls] label,.wb-form-result section:first-child label{display:flex;flex-direction:column;gap:7px;margin-bottom:17px;color:#626b77;font-size:12px;font-weight:650}.wb-builder label b{color:#6557d5}.wb-builder input[type=range]{width:100%;accent-color:#6657d5}.wb-builder select,.wb-form-result input,.wb-form-result textarea,.wb-form-result select{width:100%;height:41px;padding:0 10px;color:#3e4652;border:1px solid #dce0e5;border-radius:8px;outline:0;background:#fff}.wb-builder>aside>button{width:100%;justify-content:center}.wb-builder>section>header{height:48px;display:flex;align-items:center;padding:0 15px;color:#3e4652;border-bottom:1px solid #e2e5e9;font-size:13px;font-weight:700}.wb-grid-preview{min-height:370px;display:grid;padding:24px;overflow:auto;background:#f3f1fc}.wb-grid-preview span{min-height:85px;display:grid;place-items:center;padding:12px;color:#fff;border-radius:10px;background:#6959d8;font-size:12px;font-weight:700}.wb-grid-preview span:nth-child(3n+2){background:#299d7d}.wb-grid-preview span:nth-child(3n){background:#e07850}.wb-builder pre,.wb-form-result pre{min-height:190px;margin:0;padding:18px;overflow:auto;color:#d8dfed;background:#262b38;font:13px/1.7 Consolas,monospace}.wb-effect-stage{min-height:370px;display:grid;place-items:center;padding:30px;background:#f0f2f6}.wb-effect-stage>[data-demo]{width:220px;height:150px;display:grid;place-items:center;color:#fff;border-radius:28px;background:#6557df;font-size:20px;font-weight:800}.wb-form-result{display:grid;grid-template-columns:minmax(320px,.8fr) minmax(0,1.2fr);gap:20px}.wb-form-result>section:first-child{padding:24px}.wb-form-result textarea{height:88px;padding:10px;resize:vertical}.wb-form-result>section:last-child>header{min-height:50px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 13px;border-bottom:1px solid #e1e4e8}.wb-form-result>section:last-child>header>div{display:flex;gap:6px}.wb-form-result>section:last-child>header strong{color:#353d49;font-size:13px}.wb-share-preview{margin:18px;padding:18px;border:1px solid #dfe3e7;border-radius:11px}.wb-share-preview small{color:#258263;font-size:12px}.wb-share-preview strong{display:block;margin:6px 0;color:#2e3743;font-size:17px}.wb-share-preview p{margin:0;color:#78818c;font-size:12px}.wb-api{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);gap:18px}.wb-api-request{grid-column:1/-1}.wb-api-url{height:58px;display:grid;grid-template-columns:110px minmax(0,1fr) 110px;gap:8px;padding:10px;border-bottom:1px solid #e0e4e8}.wb-api-url select,.wb-api-url input,.wb-api-url button{height:38px;padding:0 10px;border:1px solid #dce0e5;border-radius:8px;background:#fff}.wb-api-tabs{height:43px;display:flex;align-items:end;padding:0 12px;background:#f7f8f9}.wb-api-tabs button{height:35px;padding:0 14px;color:#6a727e;border:0;border-radius:7px 7px 0 0;background:transparent;font-size:12px}.wb-api-tabs button.is-active{color:#fff;background:#303846}.wb-api-request textarea,.wb-api-request>pre{width:100%;height:230px;margin:0;padding:16px;resize:vertical;color:#303846;border:0;outline:0;background:#fff;font:13px/1.7 Consolas,monospace}.wb-api-request>pre{overflow:auto;color:#d9e0ed;background:#262b37}.wb-api-response>header,.wb-api-history>header{height:45px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;border-bottom:1px solid #e1e4e8}.wb-api-response header strong,.wb-api-history header strong{font-size:13px}.wb-api-response header span{color:#7d8590;font-size:12px}.wb-api-response pre{height:330px;margin:0;padding:15px;overflow:auto;color:#d6deec;background:#262b37;font:12px/1.7 Consolas,monospace}.wb-api-history header button{color:#7a828e;border:0;background:transparent;font-size:12px}.wb-api-history>[data-history]{height:330px;overflow:auto;padding:8px}.wb-api-history>[data-history]>button{width:100%;display:grid;grid-template-columns:55px minmax(0,1fr) auto;align-items:center;gap:8px;padding:10px;color:#5d6571;border:0;border-bottom:1px solid #eceef1;background:#fff;text-align:left;font-size:12px}.wb-api-history b{color:#2d876a}.wb-api-history span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wb-api-history small{color:#939aa4;font-size:12px}.wb-api-history p{padding:30px;color:#9299a4;text-align:center;font-size:12px}@media(max-width:900px){.wb-editor-grid,.wb-form-result,.wb-builder,.wb-api{grid-template-columns:1fr}.wb-editor-grid section+section{border-top:1px solid #dde1e7;border-left:0}.wb-api-request{grid-column:auto}}@media(max-width:600px){.wb-toolbar{align-items:flex-start;flex-direction:column}.wb-toolbar>[data-actions]{width:100%}.wb-toolbar button,.wb-toolbar label{flex:1;justify-content:center}.wb-editor-grid textarea{height:360px}.wb-builder>aside,.wb-form-result>section:first-child{padding:19px}.wb-api-url{height:auto;grid-template-columns:90px minmax(0,1fr);padding:9px}.wb-api-url button{grid-column:1/-1}.wb-api-history>[data-history]>button{grid-template-columns:52px minmax(0,1fr)}.wb-api-history small{grid-column:2}}

/* Final accessibility floor: all previously compact Chinese UI labels stay at 12px or above. */
.toolbox-site [hidden] { display: none !important; }
.tool-board-top,.tool-board-top b,.tool-board-status,.tool-board-status small,.tool-proof-row span,
.tool-section-heading>div>span,.tool-category-kicker,.tool-local-copy>span,.tool-member-card>div>span,
.tool-card-badge,.tool-card em,.tool-category-grid p,.tool-category-grid em,.tool-member-actions small,
.tool-breadcrumb,.tool-category-status,.tool-footer-safe,.tool-footer-links a,.tool-footer-bottom,
.favicon-safety,.favicon-safety strong,.favicon-step-head>span,.favicon-step-head p,.favicon-dropzone p,
.favicon-dropzone button,.favicon-source-bar span,.favicon-source-bar button,.favicon-control-grid label,
.favicon-control-grid label b,.favicon-control-grid select,.favicon-color-control>div,.favicon-color-control input[type=text],
.favicon-quality-note,.favicon-preview-head span,.favicon-preview-head em,.favicon-browser-top b,
.favicon-browser-body small,.favicon-device-previews strong,.favicon-device-previews small,.favicon-size-row small,
.favicon-record-note,.favicon-package-card span,.favicon-package-card p,.favicon-single-card p,
.favicon-package-card button,.favicon-code-head,.favicon-code-head button,.favicon-code-panel pre,
.favicon-file-list>div,.favicon-guide-grid p,.compress-step-head>span,.compress-result-head>div>span,
.compress-step-head p,.compress-result-head p,.compress-dropzone p,.compress-dropzone button,
.compress-list-head button,.compress-list-head small,.compress-file-item strong,.compress-result-item strong,
.compress-file-item small,.compress-result-item small,.compress-setting,.compress-setting select,
.compress-toggle strong,.compress-toggle small,.compress-local-note,.compress-result-head>button,
.compress-result-item>button,.compress-guide-grid p,.tool-logo small { font-size: 12px !important; }
.tool-proof-row > span { font-size: 14px !important; }

/* Text processor */
.text-processor-heading{background:linear-gradient(180deg,#f3f5f8,#fff)}.text-processor-heading .tool-category-kicker{color:#465268}.text-processor-workspace{padding:42px 0 72px;background:#f6f7f9}.text-processor-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:16px}.text-processor-stats>span{padding:15px;border:1px solid #e1e5ea;border-radius:12px;background:#fff;text-align:center}.text-processor-stats small,.text-processor-stats strong{display:block}.text-processor-stats small{color:#858d99;font-size:12px}.text-processor-stats strong{margin-top:4px;color:#303948;font-size:21px}.text-processor-shell{display:grid;grid-template-columns:minmax(0,1fr) 190px minmax(0,1fr);overflow:hidden;border:1px solid #dfe3e8;border-radius:16px;background:#fff;box-shadow:0 14px 40px rgba(38,48,63,.055)}.text-processor-editor{min-width:0}.text-processor-editor>header{height:58px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;border-bottom:1px solid #e5e8ec;background:#fafbfc}.text-processor-editor header strong,.text-processor-editor header small{display:block}.text-processor-editor header strong{color:#343c49;font-size:14px}.text-processor-editor header small{margin-top:3px;color:#9299a4;font-size:12px}.text-processor-editor header>div:last-child{display:flex;gap:6px}.text-processor-editor button{height:33px;padding:0 9px;color:#626b78;border:1px solid #dfe3e8;border-radius:8px;background:#fff;font-size:12px;cursor:pointer}.text-processor-editor button:disabled{opacity:.45;cursor:not-allowed}.text-processor-editor textarea{width:100%;height:520px;display:block;resize:vertical;padding:18px;color:#303946;border:0;outline:0;font:13px/1.75 Consolas,Monaco,"Microsoft YaHei",monospace}.text-processor-editor.is-output{border-left:1px solid #e1e4e8}.text-processor-editor.is-output textarea{background:#fcfcfb}.text-processor-actions{padding:14px 10px;border-left:1px solid #e1e4e8;background:#f7f8fa}.text-processor-actions>div+div{margin-top:17px;padding-top:16px;border-top:1px solid #e2e5e9}.text-processor-actions span{display:block;margin:0 5px 8px;color:#8b929f;font-size:12px;font-weight:700}.text-processor-actions button{width:100%;height:36px;display:flex;align-items:center;gap:7px;margin:5px 0;padding:0 9px;color:#56606d;border:1px solid #dfe3e8;border-radius:8px;background:#fff;font-size:12px;text-align:left;cursor:pointer}.text-processor-actions button:hover{color:#fff;border-color:#465268;background:#465268}.text-replace-card{margin-top:16px;overflow:hidden;border:1px solid #dfe3e8;border-radius:14px;background:#fff}.text-replace-card>header{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 16px;border-bottom:1px solid #e6e9ed}.text-replace-card header strong,.text-replace-card header small{display:block}.text-replace-card header strong{font-size:14px}.text-replace-card header small{margin-top:3px;color:#9299a4;font-size:12px}.text-replace-card header label{color:#68717e;font-size:12px}.text-replace-card header input{accent-color:#465268}.text-replace-card>div{display:grid;grid-template-columns:1fr 1fr 130px;align-items:end;gap:12px;padding:16px}.text-replace-card>div label{display:flex;flex-direction:column;gap:7px;color:#626b78;font-size:12px}.text-replace-card input[type=text]{height:40px;padding:0 11px;border:1px solid #dce1e6;border-radius:8px;outline:0}.text-replace-card>div button{height:40px;color:#fff;border:0;border-radius:8px;background:#465268;font-size:12px;font-weight:700;cursor:pointer}.text-processor-workspace .favicon-record-note{margin:14px 0 0}@media(max-width:1050px){.text-processor-stats{grid-template-columns:repeat(3,1fr)}.text-processor-shell{grid-template-columns:1fr}.text-processor-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border-top:1px solid #e1e4e8;border-left:0}.text-processor-actions>div+div{margin:0;padding:0;border:0}.text-processor-editor.is-output{border-top:1px solid #e1e4e8;border-left:0}}@media(max-width:650px){.text-processor-stats{grid-template-columns:repeat(2,1fr)}.text-processor-actions{grid-template-columns:1fr}.text-processor-actions>div+div{margin-top:10px;padding-top:10px;border-top:1px solid #e2e5e9}.text-processor-editor>header{height:auto;min-height:58px;align-items:flex-start;flex-direction:column;padding:11px 13px}.text-processor-editor header>div:last-child{width:100%}.text-processor-editor button{flex:1}.text-processor-editor textarea{height:390px}.text-replace-card>header{align-items:flex-start;flex-direction:column}.text-replace-card>div{grid-template-columns:1fr}.text-replace-card>div button{width:100%}}

/* Utility tool workbench */
.utility-tool-heading{background:linear-gradient(180deg,#f4f7fa,#fff)}.utility-tool-workspace{padding:44px 0 72px;background:#f5f7f9}.utility-tool-record{margin:14px 0 0}.utility-grid,.regex-layout,.jwt-layout,.color-layout{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:18px}.utility-card{overflow:hidden;border:1px solid #dfe4e9;border-radius:16px;background:#fff;box-shadow:0 12px 36px rgba(39,52,70,.05)}.utility-card>header{min-height:62px;display:flex;align-items:center;gap:12px;padding:13px 17px;border-bottom:1px solid #e7eaee}.utility-card>header>span{width:35px;height:35px;display:grid;place-items:center;flex:none;color:#fff;border-radius:10px;background:#56657a;font-size:18px}.utility-card>header h2,.utility-card>header p{margin:0}.utility-card>header h2{color:#303a49;font-size:17px}.utility-card>header p{margin-top:3px;color:#929aa6;font-size:12px}.utility-form{display:grid;gap:15px;padding:20px}.utility-form label,.utility-field{display:flex;flex-direction:column;gap:7px;color:#5f6977;font-size:12px}.utility-form label>span,.utility-field>span{display:flex;justify-content:space-between}.utility-form input,.utility-form select,.utility-field input,.utility-field textarea{width:100%;height:42px;padding:0 11px;color:#344050;border:1px solid #dce2e8;border-radius:9px;outline:0;background:#fff;font-size:13px}.utility-field textarea{height:180px;padding:12px;resize:vertical;line-height:1.65}.utility-buttons,.utility-card-actions{display:flex;flex-wrap:wrap;gap:8px}.utility-buttons button,.utility-card-actions button,.utility-result-list button{height:39px;padding:0 12px;color:#596574;border:1px solid #dce2e8;border-radius:9px;background:#fff;font-size:12px;cursor:pointer}.utility-buttons button.is-primary{color:#fff;border-color:#56657a;background:#56657a;font-weight:700}.utility-result-list{margin:0 20px 20px;border:1px solid #e3e7eb;border-radius:10px}.utility-result-list>p{margin:0;padding:28px;color:#979eaa;text-align:center;font-size:12px}.utility-result-list>div{display:grid;grid-template-columns:115px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid #eceef1}.utility-result-list>div:last-child{border-bottom:0}.utility-result-list span{color:#8b939f;font-size:12px}.utility-result-list strong{min-width:0;overflow:hidden;color:#394352;font:13px/1.5 Consolas,monospace;text-overflow:ellipsis}.utility-result-list button{height:30px}.utility-notice{display:flex;align-items:flex-start;gap:8px;margin-top:14px;padding:12px 14px;color:#637283;border:1px solid #dfe5ea;border-radius:10px;background:#fff;font-size:12px}.utility-notice i{font-size:16px}.utility-notice.is-success{color:#28765f;border-color:#cfe7de;background:#f2faf7}.utility-notice.is-error{color:#ad4d56;border-color:#efd2d5;background:#fff5f6}.utility-toolbar{min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 16px;border:1px solid #dfe3e8;border-radius:14px 14px 0 0;background:#fff}.utility-toolbar strong,.utility-toolbar span{display:block}.utility-toolbar strong{font-size:16px}.utility-toolbar span{margin-top:3px;color:#9299a5;font-size:12px}.utility-toolbar>div:last-child{display:flex;flex-wrap:wrap;gap:7px}.utility-toolbar button{height:37px;padding:0 11px;color:#596473;border:1px solid #dce2e7;border-radius:8px;background:#fff;font-size:12px;cursor:pointer}.utility-toolbar button.is-primary{color:#fff;border-color:#56657a;background:#56657a}.utility-editor-grid{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border:1px solid #dfe3e8;border-top:0;border-radius:0 0 14px 14px;background:#fff}.utility-editor-grid section+section{border-left:1px solid #e1e5e9}.utility-editor-grid header{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #e7eaed;background:#fafbfc}.utility-editor-grid header strong{font-size:13px}.utility-editor-grid header small{color:#9299a5;font-size:12px}.utility-editor-grid textarea{width:100%;height:500px;display:block;resize:vertical;padding:17px;color:#303946;border:0;outline:0;background:#fff;font:13px/1.75 Consolas,monospace}.utility-editor-grid section:last-child textarea{background:#fcfcfb}.regex-controls{padding-bottom:20px}.regex-controls>.utility-field,.regex-controls>.utility-buttons{margin:16px 20px 0}.regex-pattern{display:grid;grid-template-columns:auto minmax(0,1fr) auto 70px;align-items:center;gap:7px;margin:20px}.regex-pattern input{height:40px;padding:0 10px;border:1px solid #dce2e8;border-radius:8px;outline:0;font:13px Consolas,monospace}.regex-pattern b{font-size:18px}.regex-flag-list{display:flex;flex-wrap:wrap;gap:8px 13px;margin:0 20px;color:#687280;font-size:12px}.regex-flag-list input{accent-color:#56657a}.regex-results>header{border-bottom:1px solid #e7eaee}.regex-match-list{height:330px;overflow:auto;padding:10px 16px}.regex-match-list>p{padding:35px;color:#969da8;text-align:center}.regex-match-list article{display:grid;grid-template-columns:32px minmax(0,1fr);gap:9px;padding:11px 0;border-bottom:1px solid #eceff2}.regex-match-list article>span{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;color:#56657a;background:#edf0f4;font-size:12px}.regex-match-list strong,.regex-match-list small{display:block}.regex-match-list strong{word-break:break-all}.regex-match-list small{margin-top:3px;color:#9299a4;font-size:12px}.regex-match-list ol{margin:7px 0 0;padding-left:20px;color:#687280;font:12px/1.6 Consolas,monospace}.regex-replace-preview{border-top:1px solid #e7eaee}.regex-replace-preview>strong{display:block;padding:10px 15px;color:#56606d;font-size:12px}.regex-replace-preview pre{height:150px;margin:0;padding:14px;overflow:auto;color:#dfe5ee;background:#28313e;font:12px/1.7 Consolas,monospace;white-space:pre-wrap}.jwt-layout{grid-template-columns:minmax(320px,.75fr) minmax(0,1.25fr)}.jwt-layout>.utility-card:first-child{padding-bottom:20px}.jwt-layout .utility-field,.jwt-layout>.utility-card:first-child>.utility-buttons{margin:18px 20px 0}.jwt-layout .utility-field textarea{height:220px;word-break:break-all}.jwt-structure{display:flex;align-items:center;justify-content:center;gap:9px;margin:20px 20px 0;padding:12px;border-radius:9px;background:#f4f6f8}.jwt-structure span{color:#707a88;font-size:12px}.jwt-structure i{width:8px;height:8px;border-radius:50%;background:#cbd1d8}.jwt-structure.is-valid i{background:#3aad7c}.jwt-output{display:grid;grid-template-columns:1fr 1fr}.jwt-block+div{border-left:1px solid #e2e6ea}.jwt-block header{height:45px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid #e4e8ec}.jwt-block header strong{font-size:12px}.jwt-block header button{height:29px;color:#626c79;border:1px solid #dce1e6;border-radius:7px;background:#fff;font-size:12px}.jwt-block pre{height:310px;margin:0;padding:15px;overflow:auto;color:#dce4ef;background:#29323f;font:12px/1.7 Consolas,monospace}.jwt-block.is-payload pre{background:#31384a}.jwt-claims{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px;border-top:1px solid #e2e6ea}.jwt-claims>div{padding:10px;border-radius:8px;background:#f5f7f9}.jwt-claims span,.jwt-claims strong{display:block}.jwt-claims span{color:#8b939f;font-size:12px}.jwt-claims strong{margin-top:3px;color:#4b5564;font-size:12px}.jwt-claims .is-valid{background:#eaf8f1}.jwt-claims .is-valid strong{color:#268060}.jwt-claims .is-expired{background:#fff0f1}.jwt-claims .is-expired strong{color:#b74952}.uuid-layout{display:grid;grid-template-columns:330px minmax(0,1fr);align-items:start;gap:18px}.uuid-note{display:flex;align-items:center;gap:7px;margin:0 20px 20px;padding:11px;color:#557363;border-radius:9px;background:#eff8f3;font-size:12px}.uuid-results>header{justify-content:flex-start}.uuid-results>header>.utility-card-actions{margin-left:auto}.uuid-results textarea{width:100%;height:440px;display:block;resize:vertical;padding:18px;color:#35404f;border:0;outline:0;font:13px/1.8 Consolas,monospace}.utility-check{align-items:center!important;flex-direction:row!important}.utility-check input{width:auto;height:auto;accent-color:#56657a}.color-picker-card{padding-bottom:20px}.color-preview{height:190px;display:flex;align-items:center;justify-content:center;gap:13px;margin:20px;border-radius:13px;background:#5b4cf0}.color-preview input{width:52px;height:52px;padding:0;border:4px solid rgba(255,255,255,.7);border-radius:12px;background:transparent}.color-preview strong{color:#fff;font-size:22px;text-shadow:0 2px 8px rgba(0,0,0,.25)}.color-picker-card>.utility-field,.color-picker-card>.utility-buttons{margin:0 20px 16px}.color-contrast{display:grid;grid-template-columns:auto 1fr 1fr;align-items:center;gap:8px;margin:0 20px}.color-contrast>span{color:#7d8795;font-size:12px}.color-contrast strong{padding:10px;border:1px solid #e1e5e9;border-radius:8px;text-align:center;font-size:12px}.color-contrast [data-light-text]{color:#fff;background:#2f3744}.color-contrast [data-dark-text]{color:#263043;background:#f3f5f7}.color-values>div:first-of-type{display:grid;gap:8px;padding:18px}.color-values [data-color-value]{display:grid;grid-template-columns:90px minmax(0,1fr) 20px;align-items:center;gap:10px;padding:12px;color:#46515f;border:1px solid #e0e5e9;border-radius:9px;background:#fff;text-align:left;cursor:pointer}.color-values [data-color-value] span{color:#8a929e;font-size:12px}.color-values [data-color-value] strong{overflow:hidden;font:13px Consolas,monospace;text-overflow:ellipsis}.color-sliders{display:grid;gap:13px;padding:18px;border-top:1px solid #e4e8ec}.color-sliders label{display:grid;gap:7px;color:#626c79;font-size:12px}.color-sliders label span{display:flex;justify-content:space-between}.color-sliders input{width:100%;accent-color:#56657a}@media(max-width:950px){.utility-grid,.regex-layout,.jwt-layout,.uuid-layout,.color-layout{grid-template-columns:1fr}.utility-toolbar{align-items:flex-start;flex-direction:column}.utility-editor-grid{grid-template-columns:1fr}.utility-editor-grid section+section{border-top:1px solid #e1e5e9;border-left:0}.jwt-output{grid-template-columns:1fr}.jwt-block+div{border-top:1px solid #e2e6ea;border-left:0}.jwt-claims{grid-column:auto}.utility-editor-grid textarea{height:380px}}@media(max-width:600px){.utility-tool-workspace{padding-top:28px}.utility-result-list>div{grid-template-columns:1fr}.utility-toolbar>div:last-child{width:100%}.utility-toolbar button{flex:1}.regex-pattern{grid-template-columns:auto minmax(0,1fr) auto 55px;margin:15px}.regex-controls>.utility-field,.regex-controls>.utility-buttons{margin-right:15px;margin-left:15px}.jwt-output{display:block}.jwt-claims{grid-template-columns:1fr}.uuid-results>header{align-items:flex-start;flex-direction:column}.uuid-results>header>.utility-card-actions{width:100%;margin-left:0}.uuid-results>header button{flex:1}.color-contrast{grid-template-columns:1fr 1fr}.color-contrast>span{grid-column:1/-1}.color-values [data-color-value]{grid-template-columns:70px minmax(0,1fr) 18px}}
[hidden]{display:none!important}
/* Friend link application */
.friend-apply-page{min-height:calc(100vh - 190px);padding-bottom:72px;background:#f7f8fc}
.friend-apply-page .inner-toolbar{padding-top:24px}
.friend-apply-page .position{display:flex;align-items:center;gap:7px;color:#7d879b;font-size:13px}
.friend-apply-page .position a{color:#59657a}
.friend-apply-page .generic-form-page{max-width:900px;margin:0 auto}
.friend-apply-page .page-content-head{padding-bottom:30px}
.friend-apply-page .mainbody{max-width:none;margin:0;padding:34px 38px;border:1px solid #e2e6f0;border-radius:14px;box-shadow:0 18px 55px rgba(41,50,78,.08)}
.friend-apply-note{display:flex;align-items:flex-start;gap:9px;margin-bottom:28px;padding:13px 15px;border:1px solid #d8e9e4;border-radius:9px;background:#f1faf7;color:#357567;font-size:13px;line-height:1.7}
.friend-apply-note i{flex:none;margin-top:2px;font-size:17px;line-height:1}
.friend-apply-note em{color:#e24b54;font-style:normal}
.friend-apply-form{display:grid;grid-template-columns:1fr 1fr;gap:20px 22px}
.friend-apply-form .lele-form-item{min-width:0;margin:0}
.friend-apply-form .lele-form-item:nth-of-type(5),.friend-apply-form .lele-form-item:nth-of-type(11){grid-column:1/-1}
.friend-apply-form .lele-form-label{display:block;margin-bottom:8px;color:#30394f;font-size:13px;font-weight:600}
.friend-apply-form .lele-form-item.required .lele-form-label:after{margin-left:4px;color:#e24b54;content:"*"}
.friend-apply-form .lele-form-control{min-width:0}
.friend-apply-form .lele-input,.friend-apply-form .lele-select,.friend-apply-form .lele-textarea{width:100%;min-height:46px;padding:10px 13px;border:1px solid #d7dce7;border-radius:8px;background:#fff;color:#252d42;font-size:14px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}
.friend-apply-form .lele-textarea{min-height:100px;resize:vertical}
.friend-apply-form .lele-input:focus,.friend-apply-form .lele-select:focus,.friend-apply-form .lele-textarea:focus{border-color:#6253ef;box-shadow:0 0 0 3px rgba(98,83,239,.11)}
.friend-apply-form .tip{margin-top:6px;color:#8993a6;font-size:12px;line-height:1.6}
.friend-apply-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.friend-apply-form .by-form-button{grid-column:1/-1;display:flex;align-items:center;gap:18px;padding-top:8px}
.friend-apply-form .by-form-button .btn{min-width:150px;min-height:46px;border:0;border-radius:8px;background:#5c4df0;color:#fff;font-size:14px;font-weight:600}
.friend-apply-form .by-form-button>a{color:#69748a;font-size:13px}
@media (max-width:767px){
    .friend-apply-page{padding-bottom:48px}
    .friend-apply-page .mainbody{padding:24px 18px;border-radius:12px}
    .friend-apply-form{grid-template-columns:1fr;gap:17px}
    .friend-apply-form .lele-form-item:nth-of-type(5),.friend-apply-form .lele-form-item:nth-of-type(11){grid-column:auto}
}

/* Information, cooperation and contact pages */
.site-info-page{padding-bottom:78px;background:#f7f8fc}
.site-info-hero{padding:42px 0 56px;border-bottom:1px solid #e9ebf3;background:linear-gradient(135deg,#f1f0ff 0,#fafbff 58%,#eef8f6 100%)}
.site-info-hero.is-ad{background:linear-gradient(135deg,#fff7e8,#faf9ff 60%,#eef8f6)}
.site-info-hero.is-feedback{background:linear-gradient(135deg,#eef8f6,#fafbff 62%,#f2f0ff)}
.site-info-hero.is-contact{background:linear-gradient(135deg,#f2f0ff,#fbfbff 60%,#eef7fb)}
.site-info-breadcrumb{display:flex;align-items:center;gap:6px;margin-bottom:32px;color:#818a9c;font-size:12px}
.site-info-breadcrumb a{color:#626d82}
.site-info-kicker{display:block;color:#5b4cf0;font-size:12px;font-weight:800;letter-spacing:.14em}
.site-info-hero h1{max-width:800px;margin:9px 0 11px;color:#182037;font-size:42px;line-height:1.25;font-weight:850}
.site-info-hero>div>p{max-width:760px;margin:0;color:#68738a;font-size:15px;line-height:1.85}
.site-info-primary{min-height:43px;display:inline-flex;align-items:center;justify-content:center;gap:7px;margin-top:24px;padding:0 17px;border-radius:9px;background:#5b4cf0;color:#fff!important;font-size:13px;font-weight:700;box-shadow:0 10px 24px rgba(91,76,240,.19)}
.site-info-content{padding-top:38px}
.site-info-intro{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(290px,.5fr);gap:20px}
.site-info-intro>div,.site-info-intro>aside,.site-info-section,.site-info-split,.contact-email-card,.contact-email-note,.feedback-page-layout{border:1px solid #e1e5ee;border-radius:15px;background:#fff;box-shadow:0 13px 40px rgba(42,51,79,.05)}
.site-info-intro>div{padding:34px 38px}.site-info-intro>div>span,.site-info-section header>span,.site-info-split>div>span{color:#5b4cf0;font-size:12px;font-weight:800;letter-spacing:.12em}
.site-info-intro h2,.site-info-section h2,.site-info-split h2{margin:7px 0 10px;color:#242c42;font-size:26px}.site-info-intro p,.site-info-section header p,.site-info-split p{margin:0;color:#737d91;line-height:1.85}
.site-info-intro>aside{padding:30px;color:#346f63;background:#f1faf7}.site-info-intro>aside i{font-size:32px}.site-info-intro>aside strong{display:block;margin-top:12px;font-size:17px}.site-info-intro>aside p{margin-top:6px;color:#64877f;font-size:13px}
.site-info-section{margin-top:20px;padding:34px 38px}.site-info-section>header{max-width:760px;margin-bottom:25px}.site-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.site-info-grid.is-three{grid-template-columns:repeat(3,1fr)}
.site-info-grid article{padding:23px;border:1px solid #e7eaf1;border-radius:12px;background:#fafbfe}.site-info-grid article i{color:#5b4cf0;font-size:25px}.site-info-grid h3{margin:11px 0 7px;color:#343c52;font-size:16px}.site-info-grid p{margin:0;color:#798397;font-size:13px;line-height:1.8}
.site-info-callout{min-height:118px;display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:20px;padding:28px 34px;border-radius:15px;background:#202840;color:#fff}.site-info-callout h2{margin:0;font-size:21px}.site-info-callout p{margin:5px 0 0;color:#b7bed0;font-size:13px}.site-info-callout>a{min-height:42px;display:flex;align-items:center;gap:8px;flex:none;padding:0 16px;border-radius:8px;background:#fff;color:#333b55;font-size:13px;font-weight:700}
.site-info-split{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;margin-top:20px;padding:36px 38px}.site-info-split ul{display:grid;gap:13px;margin:22px 0 0;padding:0}.site-info-split li{display:flex;gap:12px;padding:17px;border-radius:11px;background:#f7f8fc}.site-info-split li>i{color:#5b4cf0;font-size:23px}.site-info-split li strong{color:#353e54}.site-info-split li p{margin-top:4px;font-size:13px}.site-info-split aside{padding:25px;border-radius:12px;background:#242c44;color:#fff}.site-info-split aside h3{margin:0 0 18px;font-size:17px}.site-info-split ol{display:grid;gap:11px;margin:0;padding:0;list-style:none}.site-info-split ol li{align-items:center;padding:0;background:transparent;color:#c2c8d7;font-size:13px}.site-info-split ol span{width:28px;height:28px;display:grid;place-items:center;flex:none;border-radius:7px;background:rgba(255,255,255,.09);color:#aaa1ff;font-size:12px}
.feedback-page-layout{display:grid;grid-template-columns:minmax(280px,.65fr) minmax(0,1.35fr);overflow:hidden}.feedback-page-layout>aside{padding:34px;background:#242c44;color:#fff}.feedback-page-layout>aside h2{margin:0 0 23px;font-size:21px}.feedback-page-layout>aside>div{display:flex;gap:12px;padding:14px 0;border-top:1px solid rgba(255,255,255,.1)}.feedback-page-layout>aside>div>span{width:34px;height:34px;display:grid;place-items:center;flex:none;border-radius:8px;background:rgba(255,255,255,.08);color:#aaa1ff}.feedback-page-layout>aside p{margin:0;color:#aeb6c8;font-size:12px;line-height:1.65}.feedback-page-layout>aside strong{display:block;margin-bottom:3px;color:#fff;font-size:13px}.feedback-page-layout>aside small{display:flex;gap:7px;margin-top:24px;color:#8fa8a2;font-size:12px;line-height:1.6}.feedback-page-form{padding:32px 36px}.feedback-page-form .lele-feedback{padding:0!important;border:0!important;box-shadow:none!important}.feedback-page-form .lele-feedback-head h2{font-size:22px}.feedback-page-form .lele-feedback-fields{display:grid;grid-template-columns:1fr 1fr;gap:15px 18px}.feedback-page-form .lele-form-item{margin:0}.feedback-page-form .lele-form-item:nth-child(5){grid-column:1/-1}.feedback-page-form .lele-form-label{font-size:13px}.feedback-page-form .lele-input,.feedback-page-form .lele-select,.feedback-page-form .lele-textarea{font-size:13px}
.contact-email-card{display:grid;grid-template-columns:1fr 1fr;overflow:hidden}.contact-email-main{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;padding:48px;background:linear-gradient(145deg,#5b4cf0,#4135c8);color:#fff}.contact-email-main>span{color:#c9c4ff;font-size:12px;letter-spacing:.08em}.contact-email-main>a:not(.site-info-primary){max-width:100%;margin-top:8px;color:#fff;font-size:28px;font-weight:800;word-break:break-all}.contact-email-main>p{max-width:490px;margin:14px 0 0;color:#d9d6f7;font-size:13px;line-height:1.8}.contact-email-main .site-info-primary{background:#fff;color:#4b3ede!important;box-shadow:none}.contact-email-topics{padding:36px}.contact-email-topics h2{margin:0 0 17px;color:#30384e;font-size:20px}.contact-email-topics>a{display:grid;grid-template-columns:38px 1fr 20px;align-items:center;gap:11px;padding:14px 0;border-top:1px solid #e9ebf1}.contact-email-topics>a>i:first-child{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:#f1efff;color:#5b4cf0;font-size:18px}.contact-email-topics strong,.contact-email-topics small{display:block}.contact-email-topics strong{color:#343d53;font-size:13px}.contact-email-topics small{margin-top:3px;color:#8a93a5;font-size:12px}.contact-email-topics>a>i:last-child{color:#a2a9b7}.contact-email-note{display:flex;align-items:flex-start;gap:13px;margin-top:20px;padding:22px 25px}.contact-email-note>i{color:#5b4cf0;font-size:22px}.contact-email-note strong{color:#374056}.contact-email-note p{margin:5px 0 0;color:#788296;font-size:13px;line-height:1.75}
@media(max-width:900px){.site-info-grid.is-three{grid-template-columns:1fr}.site-info-split,.feedback-page-layout,.contact-email-card{grid-template-columns:1fr}.feedback-page-layout>aside{padding:28px}.contact-email-main{padding:38px}.feedback-page-form{padding:28px}}
@media(max-width:700px){.site-info-page{padding-bottom:52px}.site-info-hero{padding:28px 0 42px}.site-info-hero h1{font-size:32px}.site-info-content{padding-top:24px}.site-info-intro,.site-info-grid{grid-template-columns:1fr}.site-info-intro>div,.site-info-section,.site-info-split{padding:25px 20px}.site-info-callout{align-items:flex-start;flex-direction:column;padding:24px}.feedback-page-form{padding:24px 18px}.feedback-page-form .lele-feedback-fields{grid-template-columns:1fr}.feedback-page-form .lele-form-item:nth-child(5){grid-column:auto}.contact-email-main,.contact-email-topics{padding:28px 22px}.contact-email-main>a:not(.site-info-primary){font-size:22px}}

/* Icon and copy alignment for information notices. */
.contact-email-note>i{width:22px;height:22px;display:grid;place-items:center;flex:none;margin:0;color:#5b4cf0;font-size:20px;line-height:1}
.contact-email-note>div{min-width:0}
.contact-email-note strong{min-height:22px;display:flex;align-items:center;margin:0;color:#374056;font-size:14px;line-height:22px}
.contact-email-note p{margin:4px 0 0;color:#788296;font-size:13px;line-height:1.75}

/* QR studio extensions */
.qr-studio-form{margin-top:22px}.qr-action-tabs{margin-top:0;grid-template-columns:repeat(3,1fr)}.qr-logo-upload small{color:#899792;font-size:12px;font-weight:500;line-height:1.6}.qr-file-picker{position:relative;height:46px;display:flex;align-items:center;overflow:hidden;padding:5px;border:1px solid #dce4e1;border-radius:9px;background:#fff;cursor:pointer}.qr-file-picker:hover,.qr-file-picker:focus-within{border-color:#36a884;box-shadow:0 0 0 3px rgba(23,146,110,.08)}.qr-file-picker input[type=file]{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}.qr-file-button{height:34px;display:inline-flex;align-items:center;gap:7px;flex:none;padding:0 13px;color:#fff;border-radius:7px;background:#17926e;font-size:12px;font-weight:700}.qr-file-name{overflow:hidden;min-width:0;padding:0 12px;color:#77847f;font-size:12px;font-weight:500;text-overflow:ellipsis;white-space:nowrap}.qr-studio-form .qr-form-grid>.qr-check{height:42px;align-self:end;justify-content:flex-start;flex-direction:row;gap:9px;padding:0 12px;border:1px solid #dce4e1;border-radius:9px;background:#fff;font-weight:500}.qr-studio-form .qr-form-grid>.qr-check input{width:14px;height:14px;flex:none;margin:0}.qr-studio-form .qr-form-grid>.qr-check span{display:flex;align-items:center;min-height:20px}.qr-studio-page [data-qr-preview]:not(:empty){width:100%;display:flex;align-items:center;justify-content:center}.qr-studio-page .qr-preview-stage canvas{margin-right:auto;margin-left:auto}.qr-print-label{width:100%;height:42px;margin-top:9px;color:#fff;border:0;border-radius:10px;background:#243d35;font-size:13px;font-weight:700;cursor:pointer}.qr-capacity-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.qr-capacity-cards>div{padding:14px;border:1px solid #dfe8e4;border-radius:10px;background:#f7faf9}.qr-capacity-cards span,.qr-capacity-cards strong{display:block}.qr-capacity-cards span{color:#7f8e88;font-size:12px}.qr-capacity-cards strong{margin-top:4px;color:#24443a;font-size:18px}.qr-preview-stage.is-capacity{min-height:360px}.qr-capacity-meter{display:flex;align-items:center;flex-direction:column;text-align:center}.qr-capacity-meter>i{color:#17926e;font-size:82px}.qr-capacity-meter strong{margin-top:10px;color:#273d35;font-size:28px}.qr-capacity-meter span{margin-top:5px;color:#74847e;font-size:12px}.qr-capacity-meter em{margin-top:16px;padding:8px 12px;border-radius:8px;font-size:12px;font-style:normal}.qr-capacity-meter em.is-safe{color:#197154;background:#e6f7f0}.qr-capacity-meter em.is-warn{color:#9c6617;background:#fff5df}.qr-capacity-meter em.is-danger{color:#a74550;background:#fff0f2}.qr-preview-stage.is-label{display:block;overflow:auto;max-height:580px;padding:14px;background:#e8ecea}.qr-label-sheet{--label-columns:3;display:grid;grid-template-columns:repeat(var(--label-columns),1fr);gap:5px;width:100%;padding:10px;background:#fff}.qr-label-sheet>div{min-width:0;padding:7px;text-align:center;border:1px dashed #cbd6d1}.qr-label-sheet img{display:block;width:100%;height:auto;box-shadow:none}.qr-label-sheet span{display:block;overflow:hidden;margin-top:4px;color:#273c35;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:600px){.qr-capacity-cards{grid-template-columns:1fr}.qr-action-tabs{grid-template-columns:1fr}.qr-label-sheet{grid-template-columns:repeat(2,1fr)!important}}
@media print{body>*:not(.qr-studio-page){display:none!important}.qr-studio-page .qr-heading,.qr-studio-page .qr-controls,.qr-studio-page .qr-preview-head,.qr-studio-page .qr-preview-info,.qr-studio-page .qr-downloads,.qr-studio-page .qr-copy-content,.qr-studio-page .qr-print-label,.qr-studio-page .favicon-record-note,.qr-studio-page .qr-corner{display:none!important}.qr-studio-page,.qr-studio-page .qr-workspace,.qr-studio-page .qr-shell,.qr-studio-page .qr-preview-panel,.qr-studio-page .qr-preview-stage{display:block!important;margin:0!important;padding:0!important;border:0!important;background:#fff!important;box-shadow:none!important}.qr-studio-page .qr-label-sheet{gap:0;width:190mm;padding:0}.qr-studio-page .qr-label-sheet>div{break-inside:avoid}}

/* QR guide spacing and hierarchy */
.qr-guide{padding:68px 0 82px;background:#fff}.qr-guide .compress-guide-head{margin-bottom:26px}.qr-guide .compress-guide-head>span{display:block;margin-bottom:7px;color:#168663;font-size:12px;font-weight:800;letter-spacing:.08em}.qr-guide .compress-guide-head h2{margin:0;color:#23352f;font-size:26px;line-height:1.35}.qr-guide .compress-guide-grid{gap:18px}.qr-guide .compress-guide-grid>div{padding:30px 25px;border-color:#dfe9e5;border-radius:14px;background:#fff}.qr-guide .compress-guide-grid i{color:#17926e}.qr-guide .compress-guide-grid h3{font-size:14px}.qr-guide .compress-guide-grid p{font-size:12px;line-height:1.8}
@media(max-width:600px){.qr-guide{padding:48px 0 58px}.qr-guide .compress-guide-head{margin-bottom:20px}.qr-guide .compress-guide-head h2{font-size:22px}}