*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{line-height:1.6;-webkit-font-smoothing:antialiased}img,svg{display:block;max-width:100%}button{cursor:pointer;border:none;background:none;font:inherit;color:inherit}a{color:inherit;text-decoration:none}table{border-collapse:collapse;border-spacing:0}ul,ol{list-style:none}:root{--ff-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--ff-mono: "JetBrains Mono", "Fira Code", "SF Mono", Consolas, monospace;--fs-xs: .75rem;--fs-sm: .875rem;--fs-base: 1rem;--fs-lg: 1.125rem;--fs-xl: 1.25rem;--fs-2xl: 1.5rem;--fs-3xl: 2rem;--fs-4xl: 2.5rem;--fw-normal: 400;--fw-medium: 500;--fw-semibold: 600;--fw-bold: 700;--lh-tight: 1.25;--lh-normal: 1.6;--lh-relaxed: 1.75;--ls-tight: -.02em;--sp-1: .25rem;--sp-2: .5rem;--sp-3: .75rem;--sp-4: 1rem;--sp-5: 1.25rem;--sp-6: 1.5rem;--sp-8: 2rem;--sp-10: 2.5rem;--sp-12: 3rem;--sp-16: 4rem;--sp-20: 5rem;--content-pad: clamp(1.5rem, 4vw, 4rem);--max-w: 100%;--header-h: 64px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px;--c-bg: #ffffff;--c-bg-elevated: #ffffff;--c-bg-subtle: #f5f5f7;--c-bg-inset: #eeeef0;--c-surface: #ffffff;--c-surface-hover: #f5f5f7;--c-border: #d1d1d6;--c-border-subtle: #e5e5ea;--c-text: #1a1a1e;--c-text-secondary: #48484a;--c-text-tertiary: #8a8a8e;--c-text-inverse: #ffffff;--c-accent: #0060c0;--c-accent-hover: #004fa0;--c-accent-subtle: #eaf2ff;--c-success: #248a3d;--c-success-subtle: #eef8f0;--c-warning: #c47e00;--c-warning-subtle: #fef7e6;--c-error: #d62c20;--c-error-subtle: #fdeeed;--c-highlight: #c47e00;--c-danger: #d62c20;--shadow-xs: 0 1px 2px rgba(0,0,0,.04);--shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);--shadow-md: 0 4px 12px rgba(0,0,0,.08);--shadow-lg: 0 12px 32px rgba(0,0,0,.1);--ease: cubic-bezier(.4, 0, .2, 1);--dur-fast: .15s;--dur-normal: .25s}body{font-family:var(--ff-sans);font-size:var(--fs-base);color:var(--c-text);background:var(--c-bg);font-feature-settings:"cv01","cv02","ss01";text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.layout{display:flex;flex-direction:column;min-height:100vh}.layout__main{flex:1;width:100%}.layout__main--flush{max-width:none;padding:0}.layout__body{width:100%;max-width:1400px;margin:0 auto;padding:var(--sp-8) var(--content-pad)}.layout__body--with-sidebar{display:grid;grid-template-columns:260px 1fr;gap:0;max-width:none;width:100%;padding:0}.layout__content{min-width:0;width:100%;padding:var(--sp-10) var(--content-pad) var(--sp-16);box-sizing:border-box}.layout__content>*{max-width:1080px;margin-left:auto;margin-right:auto}.header{position:sticky;top:0;z-index:100;height:var(--header-h);background:#ffffffd9;border-bottom:1px solid var(--c-border);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.header__inner{display:flex;align-items:center;justify-content:space-between;height:100%;padding:0 var(--content-pad)}.header__logo{display:flex;align-items:center;gap:var(--sp-2);font-family:var(--ff-sans);font-size:var(--fs-lg);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);color:var(--c-text)}.header__nav{display:flex;align-items:center;gap:var(--sp-2)}.header__link{display:inline-flex;align-items:center;gap:var(--sp-1);padding:var(--sp-2) var(--sp-3);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-secondary);border-radius:var(--radius-sm);transition:color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}.header__link:hover{color:var(--c-text);background:var(--c-surface-hover)}.header__link--active{color:var(--c-accent)}.header__dropdown{position:relative}.header__dropdown-arrow{transition:transform var(--dur-fast) var(--ease);margin-left:2px}.header__dropdown-arrow--open{transform:rotate(180deg)}.header__dropdown-panel{display:none}.mega-menu{position:fixed;left:50%;transform:translate(-50%);top:calc(var(--header-h) - 2px);width:calc(100vw - var(--sp-8));max-width:1400px;background:var(--c-bg-elevated);border:1px solid var(--c-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--sp-6);z-index:200;animation:mega-enter var(--dur-fast) var(--ease)}@keyframes mega-enter{0%{opacity:0;transform:translate(-50%) translateY(-6px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.mega-menu__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--sp-6) var(--sp-5)}.mega-menu__col{min-width:0}.mega-menu__cat{display:block;font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--c-accent);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--sp-2);padding-bottom:var(--sp-2);border-bottom:1px solid var(--c-border-subtle);transition:color var(--dur-fast) var(--ease)}.mega-menu__cat:hover{color:var(--c-accent-hover, var(--c-accent))}.mega-menu__list{display:flex;flex-direction:column;gap:1px}.mega-menu__link{display:block;padding:var(--sp-1) var(--sp-2);font-size:var(--fs-sm);color:var(--c-text-secondary);border-radius:var(--radius-sm);transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mega-menu__link:hover{background:var(--c-surface-hover);color:var(--c-text)}.mega-menu__link--active{color:var(--c-accent);font-weight:var(--fw-medium)}.mega-menu__more{display:block;padding:var(--sp-1) var(--sp-2);font-size:var(--fs-xs);font-weight:var(--fw-medium);color:var(--c-accent);border-radius:var(--radius-sm);transition:background var(--dur-fast) var(--ease)}.mega-menu__more:hover{background:var(--c-surface-hover)}.tool-sidebar{position:sticky;top:var(--header-h);height:calc(100vh - var(--header-h));overflow-y:auto;padding:var(--sp-6) var(--sp-4) var(--sp-6) var(--sp-6);background:var(--c-bg);border-right:1px solid var(--c-border);-webkit-overflow-scrolling:touch}.tool-sidebar::-webkit-scrollbar{width:4px}.tool-sidebar::-webkit-scrollbar-thumb{background:var(--c-border);border-radius:2px}.tool-sidebar__nav{display:flex;flex-direction:column;gap:var(--sp-1)}.tool-sidebar__group{border-radius:var(--radius-sm)}.tool-sidebar__cat{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-2) var(--sp-3);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-secondary);border-radius:var(--radius-sm);transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}.tool-sidebar__cat:hover{background:var(--c-surface-hover);color:var(--c-text)}.tool-sidebar__group--open>.tool-sidebar__cat{color:var(--c-accent);font-weight:var(--fw-semibold)}.tool-sidebar__count{font-size:var(--fs-xs);color:var(--c-text-secondary);background:var(--c-bg-inset);padding:0 var(--sp-2);border-radius:var(--radius-full);line-height:1.6}.tool-sidebar__list{display:flex;flex-direction:column;padding:var(--sp-1) 0 var(--sp-2) var(--sp-3);border-left:2px solid var(--c-border);margin-left:var(--sp-4);gap:1px}.tool-sidebar__link{display:block;padding:var(--sp-1) var(--sp-3);font-size:var(--fs-xs);color:var(--c-text-secondary);border-radius:var(--radius-sm);transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tool-sidebar__link:hover{background:var(--c-surface-hover);color:var(--c-text)}.tool-sidebar__link--active{color:var(--c-accent);font-weight:var(--fw-medium);background:var(--c-accent-subtle)}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-sm);color:var(--c-text-secondary);transition:color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}.icon-btn:hover{color:var(--c-text);background:var(--c-surface-hover)}.lang-select{position:relative}.lang-select__trigger{display:inline-flex;align-items:center;gap:var(--sp-1);padding:var(--sp-1) var(--sp-2);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-secondary);border:1px solid var(--c-border);border-radius:var(--radius-sm);background:transparent;transition:all var(--dur-fast) var(--ease)}.lang-select__trigger:hover{color:var(--c-text);border-color:var(--c-text-tertiary)}.lang-select__dropdown{position:absolute;right:0;top:calc(100% + var(--sp-1));min-width:160px;background:var(--c-bg-elevated);border:1px solid var(--c-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--sp-1);z-index:200}.lang-select__option{display:flex;align-items:center;gap:var(--sp-2);width:100%;padding:var(--sp-2) var(--sp-3);font-size:var(--fs-sm);border-radius:var(--radius-sm);transition:background var(--dur-fast) var(--ease);text-align:left}.lang-select__option:hover{background:var(--c-surface-hover)}.lang-select__option--active{color:var(--c-accent);font-weight:var(--fw-medium)}.footer{border-top:1px solid var(--c-border);padding:var(--sp-8) var(--content-pad)}.footer__inner{font-size:var(--fs-sm);color:var(--c-text-tertiary)}.footer__links{display:flex;justify-content:center;gap:var(--sp-6);margin-bottom:var(--sp-4)}.footer__link{color:var(--c-text);transition:color var(--dur-fast) var(--ease)}.footer__link:hover{color:var(--c-accent)}.page-header{margin-bottom:var(--sp-8)}.page-header--hero{width:100%;margin-bottom:0;background:linear-gradient(135deg,#f0f4ff,#e8f0fe 30%,#f5f0ff 70%,#faf5ff);border-bottom:1px solid var(--c-border-subtle);position:relative;overflow:hidden}.page-header--hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle at 1px 1px,rgba(0,96,192,.06) 1px,transparent 0);background-size:32px 32px;pointer-events:none}.page-header--hero .page-header__inner{position:relative;z-index:1;padding:var(--sp-16) var(--content-pad) var(--sp-12);max-width:1400px;margin:0 auto}.page-header__breadcrumb{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-sm);color:var(--c-text-tertiary);margin-bottom:var(--sp-4)}.page-header__breadcrumb a{color:var(--c-text-secondary);transition:color var(--dur-fast) var(--ease)}.page-header__breadcrumb a:hover{color:var(--c-accent)}.page-header__breadcrumb-sep{color:var(--c-text-tertiary);-webkit-user-select:none;user-select:none}.page-header__title{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);line-height:var(--lh-tight);margin-bottom:var(--sp-3);color:var(--c-text)}.page-header__desc{font-size:var(--fs-lg);color:var(--c-text-secondary);max-width:640px;line-height:var(--lh-relaxed)}.page-header__category-badge{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-3);font-size:var(--fs-xs);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.05em;background:var(--c-accent);color:#fff;border-radius:var(--radius-full);margin-bottom:var(--sp-4)}.page-header--hero[data-category=network]{background:linear-gradient(135deg,#eff6ff,#dbeafe 40%,#e0e7ff 75%,#f5f3ff)}.page-header--hero[data-category=network]:before{background-image:radial-gradient(circle at 1px 1px,rgba(37,99,235,.08) 1px,transparent 0)}.page-header--hero[data-category=network] .page-header__category-badge{background:#2563eb}.page-header--hero[data-category=encode]{background:linear-gradient(135deg,#f0fdf4,#dcfce7 40%,#d1fae5 75%,#ecfdf5)}.page-header--hero[data-category=encode]:before{background-image:radial-gradient(circle at 1px 1px,rgba(5,150,105,.08) 1px,transparent 0)}.page-header--hero[data-category=encode] .page-header__category-badge{background:#059669}.page-header--hero[data-category=web]{background:linear-gradient(135deg,#fffbeb,#fef3c7 40%,#ffedd5 75%,#fff7ed)}.page-header--hero[data-category=web]:before{background-image:radial-gradient(circle at 1px 1px,rgba(217,119,6,.09) 1px,transparent 0)}.page-header--hero[data-category=web] .page-header__category-badge{background:#d97706}.page-header--hero[data-category=format]{background:linear-gradient(135deg,#faf5ff,#f3e8ff 40%,#ede9fe 75%,#f5f3ff)}.page-header--hero[data-category=format]:before{background-image:radial-gradient(circle at 1px 1px,rgba(124,58,237,.08) 1px,transparent 0)}.page-header--hero[data-category=format] .page-header__category-badge{background:#7c3aed}.page-header--hero[data-category=converter]{background:linear-gradient(135deg,#ecfeff,#cffafe 40%,#e0f2fe 75%,#f0f9ff)}.page-header--hero[data-category=converter]:before{background-image:radial-gradient(circle at 1px 1px,rgba(8,145,178,.08) 1px,transparent 0)}.page-header--hero[data-category=converter] .page-header__category-badge{background:#0891b2}.page-header--hero[data-category=developer]{background:linear-gradient(135deg,#eef2ff,#e0e7ff 40%,#ddd6fe 75%,#f5f3ff)}.page-header--hero[data-category=developer]:before{background-image:radial-gradient(circle at 1px 1px,rgba(99,102,241,.09) 1px,transparent 0)}.page-header--hero[data-category=developer] .page-header__category-badge{background:#4f46e5}.page-header--hero[data-category=validator]{background:linear-gradient(135deg,#f0fdfa,#ccfbf1 40%,#d1fae5 75%,#ecfdf5)}.page-header--hero[data-category=validator]:before{background-image:radial-gradient(circle at 1px 1px,rgba(20,184,166,.08) 1px,transparent 0)}.page-header--hero[data-category=validator] .page-header__category-badge{background:#0d9488}.page-header--hero[data-category=sysadmin]{background:linear-gradient(135deg,#f8fafc,#f1f5f9 40%,#e9eef5 75%,#f8fafc)}.page-header--hero[data-category=sysadmin]:before{background-image:radial-gradient(circle at 1px 1px,rgba(71,85,105,.08) 1px,transparent 0)}.page-header--hero[data-category=sysadmin] .page-header__category-badge{background:#475569}.page-header--hero[data-category=general]{background:linear-gradient(135deg,#fefce8,#fef9c3 40%,#fef3c7 75%,#fffbeb)}.page-header--hero[data-category=general]:before{background-image:radial-gradient(circle at 1px 1px,rgba(161,138,0,.09) 1px,transparent 0)}.page-header--hero[data-category=general] .page-header__category-badge{background:#a16207}.page-header--hero[data-category=security]{background:linear-gradient(135deg,#fff1f2,#ffe4e6 40%,#fce7f3 75%,#fdf2f8)}.page-header--hero[data-category=security]:before{background-image:radial-gradient(circle at 1px 1px,rgba(225,29,72,.08) 1px,transparent 0)}.page-header--hero[data-category=security] .page-header__category-badge{background:#e11d48}.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden}.card--elevated{box-shadow:var(--shadow-sm)}.card__header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-5) var(--sp-6);border-bottom:1px solid var(--c-border-subtle)}.card__title{font-size:var(--fs-base);font-weight:var(--fw-semibold)}.card__body{padding:0}.ip-result{width:100%}.ip-result__row{display:grid;grid-template-columns:180px 1fr;border-bottom:1px solid var(--c-border-subtle);transition:background var(--dur-fast) var(--ease)}.ip-result__row:last-child{border-bottom:none}.ip-result__row:hover{background:var(--c-surface-hover)}.ip-result__label{padding:var(--sp-3) var(--sp-6);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-secondary);display:flex;align-items:center}.ip-result__value{padding:var(--sp-3) var(--sp-6);font-family:var(--ff-mono);font-size:var(--fs-sm);word-break:break-all;display:flex;align-items:center}.ip-result__value--highlight{font-size:var(--fs-lg);font-weight:var(--fw-bold);color:var(--c-accent)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-6);font-size:var(--fs-sm);font-weight:var(--fw-semibold);border-radius:var(--radius-full);transition:all var(--dur-fast) var(--ease);cursor:pointer}.btn--primary{background:var(--c-accent);color:var(--c-text-inverse);box-shadow:0 2px 8px #0060c040}.btn--primary:hover{background:var(--c-accent-hover);box-shadow:0 4px 12px #0060c04d;transform:translateY(-1px)}.btn--primary:active{transform:translateY(0);box-shadow:0 1px 4px #0060c033}.btn--ghost{color:var(--c-text-secondary);border:1px solid var(--c-border);background:var(--c-bg)}.btn--ghost:hover{color:var(--c-text);background:var(--c-surface-hover);border-color:var(--c-text-tertiary)}.btn--sm{padding:var(--sp-1) var(--sp-3);font-size:var(--fs-xs)}.btn--lg{padding:var(--sp-4) var(--sp-8);font-size:var(--fs-base)}.btn:disabled{opacity:.5;cursor:default;transform:none;box-shadow:none}.status-dot{display:inline-block;width:8px;height:8px;border-radius:var(--radius-full);background:var(--c-success)}.status-dot--loading{background:var(--c-warning);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.skeleton{background:var(--c-bg-subtle);border-radius:var(--radius-sm);animation:shimmer 1.5s ease-in-out infinite}@keyframes shimmer{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}.alert{display:flex;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-4) var(--sp-5);border-radius:var(--radius-md);font-size:var(--fs-sm)}.alert--error{background:var(--c-error-subtle);color:var(--c-error);border:1px solid var(--c-error)}.alert--warning{background:var(--c-warning-subtle);color:var(--c-warning);border:1px solid var(--c-warning)}.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--sp-5)}.copy-btn{display:inline-flex;align-items:center;gap:var(--sp-1);padding:var(--sp-1) var(--sp-2);font-size:var(--fs-xs);color:var(--c-text-tertiary);border:1px solid var(--c-border);border-radius:var(--radius-sm);transition:all var(--dur-fast) var(--ease)}.copy-btn:hover{color:var(--c-text);border-color:var(--c-text-tertiary)}.copy-btn--copied{color:var(--c-success);border-color:var(--c-success)}@media (max-width: 768px){:root{--header-h: 52px}.layout__body{padding:var(--sp-5) var(--sp-4)}.page-header--hero .page-header__inner{padding:var(--sp-9) var(--sp-4) var(--sp-7)}.page-header__title{font-size:var(--fs-2xl)}.page-header__desc{font-size:var(--fs-base)}.page-header__category-badge{font-size:.65rem}.tool-panels--side{grid-template-columns:1fr}.tool-info__section{padding:var(--sp-5)}.tool-info__list,.ip-result__row{grid-template-columns:1fr}.ip-result__label{padding:var(--sp-3) var(--sp-4) var(--sp-1)}.ip-result__value{padding:var(--sp-1) var(--sp-4) var(--sp-3)}.ip-hero{padding:var(--sp-8) var(--sp-4)}.tool-grid{grid-template-columns:1fr}.hero{min-height:auto;padding:calc(var(--header-h) + var(--sp-8)) var(--sp-4) var(--sp-12)}.hero__heading{font-size:clamp(2rem,8vw,2.8rem)}.tools-intro{padding-top:var(--sp-8)}.section-header{flex-direction:column;align-items:flex-start;gap:var(--sp-2)}.header__link span{display:none}.mega-menu{width:calc(100vw - var(--sp-4));padding:var(--sp-4);max-height:70vh;overflow-y:auto}.mega-menu__grid{grid-template-columns:1fr 1fr;gap:var(--sp-4) var(--sp-3)}.layout__body--with-sidebar{grid-template-columns:1fr}.tool-sidebar{display:none}.layout__content{padding:var(--sp-5) var(--sp-4)}.layout__content>*{max-width:none}.footer__links{flex-direction:column;gap:var(--sp-3)}}@media (max-width: 480px){.lang-select__dropdown{position:fixed;left:var(--sp-4);right:var(--sp-4);bottom:var(--sp-4);top:auto;min-width:unset}.mega-menu__grid{grid-template-columns:1fr}}@media print{.header,.footer,.icon-btn,.lang-select,.btn{display:none}.layout__body{padding:0;max-width:none}.card{border:1px solid #ccc;box-shadow:none}}.hero{position:relative;display:flex;align-items:center;justify-content:center;min-height:80vh;padding:calc(var(--header-h) + var(--sp-16)) var(--content-pad) var(--sp-20);background:linear-gradient(180deg,#f8fafc,#fff);color:var(--c-text);text-align:center;width:100%;overflow:hidden}.hero__canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}.hero__glow,.hero__aurora,.hero__aurora-band,.hero__grid,.hero__scanline,.hero__particles,.hero__particle,.hero__symbols,.hero__sym,.hero__scroll,.hero:before{display:none}.hero__content{position:relative;z-index:1;max-width:800px;margin:0 auto}.hero__heading{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:var(--fw-bold);letter-spacing:-.04em;line-height:1.08;margin-bottom:var(--sp-6);color:var(--c-text)}.hero__heading span{display:block}.hero__heading-accent{color:var(--c-accent)}.hero__sub{font-size:clamp(1.05rem,2vw,1.25rem);color:var(--c-text-secondary);line-height:1.7;max-width:560px;margin:0 auto var(--sp-10)}.hero__cta{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-8);font-size:var(--fs-base);font-weight:var(--fw-medium);color:var(--c-text-inverse);background:var(--c-text);border-radius:var(--radius-full);transition:transform var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}.hero__cta:hover{background:var(--c-text-secondary);transform:translateY(-1px)}.hero__cta-arrow{display:inline-flex}.layout--home .header{background:#ffffffd9;border-bottom-color:var(--c-border)}.tools-intro{text-align:center;margin-bottom:var(--sp-16);padding-top:var(--sp-12)}.tools-intro__title{font-size:clamp(1.5rem,3.5vw,2.25rem);font-weight:var(--fw-bold);letter-spacing:-.03em;line-height:var(--lh-tight);margin-bottom:var(--sp-3)}.tools-intro__desc{font-size:var(--fs-lg);color:var(--c-text-secondary);max-width:520px;margin:0 auto}.section-header{display:flex;align-items:center;gap:var(--sp-4);margin-bottom:var(--sp-6)}.section-header__icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);flex-shrink:0;transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.section-header__icon:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.section-header__icon--network{background:#2563eb;color:#fff}.section-header__icon--encode{background:#7c3aed;color:#fff}.section-header__icon--web{background:#0891b2;color:#fff}.section-header__icon--format{background:#b45309;color:#fff}.section-header__icon--converter{background:#059669;color:#fff}.section-header__icon--developer{background:#4f46e5;color:#fff}.section-header__icon--validator{background:#dc2626;color:#fff}.section-header__icon--sysadmin{background:#57534e;color:#fff}.section-header__icon--general{background:#7c3aed;color:#fff}.section-header__icon--security{background:#16a34a;color:#fff}.section-header__text{flex:1}.section-header__title{font-size:var(--fs-xl);font-weight:var(--fw-semibold);letter-spacing:var(--ls-tight)}.section-header__title-link{color:inherit;transition:color var(--dur-fast) var(--ease)}.section-header__title-link:hover{color:var(--c-accent)}.section-header__desc{font-size:var(--fs-sm);color:var(--c-text-secondary);margin-top:var(--sp-1)}.tool-card{display:flex;flex-direction:column;padding:var(--sp-6);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);transition:box-shadow var(--dur-normal) var(--ease),background var(--dur-normal) var(--ease);position:relative;overflow:hidden}.tool-card:hover{box-shadow:var(--shadow-md);background:var(--c-surface-hover)}.tool-card--network{--card-accent: #2563eb}.tool-card--encode{--card-accent: #7c3aed}.tool-card--web{--card-accent: #0891b2}.tool-card--format{--card-accent: #b45309}.tool-card--converter{--card-accent: #059669}.tool-card--developer{--card-accent: #4f46e5}.tool-card--validator{--card-accent: #dc2626}.tool-card--sysadmin{--card-accent: #57534e}.tool-card--general{--card-accent: #7c3aed}.tool-card--security{--card-accent: #16a34a}.tool-card__icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--card-accent, var(--c-accent));color:#fff;border-radius:var(--radius-md);margin-bottom:var(--sp-4);font-size:var(--fs-xl)}.tool-card__badge{display:inline-flex;align-items:center;gap:var(--sp-1);padding:2px var(--sp-2);font-size:.65rem;font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.06em;border-radius:var(--radius-full);margin-left:auto;flex-shrink:0}.tool-card__badge--live{background:var(--c-success-subtle);color:var(--c-success)}.tool-card__badge--soon{background:var(--c-bg-subtle);color:var(--c-text-tertiary)}.tool-card__top{display:flex;align-items:flex-start;gap:var(--sp-3);margin-bottom:var(--sp-4)}.tool-card__title{font-size:var(--fs-base);font-weight:var(--fw-semibold);margin-bottom:var(--sp-1)}.tool-card__desc{font-size:var(--fs-sm);color:var(--c-text-secondary);flex:1;line-height:1.5}.tool-card__footer{margin-top:auto;padding-top:var(--sp-4);display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--c-border-subtle)}.tool-card__category{font-size:var(--fs-xs);color:var(--c-text-secondary);text-transform:uppercase;letter-spacing:.04em;font-weight:var(--fw-medium)}.tool-card__arrow{font-size:var(--fs-sm);color:var(--card-accent, var(--c-accent));font-weight:var(--fw-medium);transition:transform var(--dur-fast) var(--ease);display:inline-flex;align-items:center;gap:var(--sp-1)}.tool-card:hover .tool-card__arrow{opacity:1}.tool-section{margin-bottom:var(--sp-12)}.tool-section:last-child{margin-bottom:var(--sp-16)}.ip-layout{display:flex;flex-direction:column;gap:var(--sp-6)}.ip-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}.ip-grid__left,.ip-grid__right{display:flex;flex-direction:column;gap:var(--sp-6)}.ip-map{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--c-border);background:var(--c-surface)}.ip-map__canvas{width:100%;height:280px}.ip-section{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden}.ip-section__header{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--c-border-subtle);background:var(--c-surface-elevated)}.ip-section__icon{color:var(--c-accent);display:flex;align-items:center}.ip-section__title{font-size:var(--fs-sm);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.05em;color:var(--c-text-secondary)}.ip-section__body{padding:0}.ip-section__row{display:grid;grid-template-columns:160px 1fr;border-bottom:1px solid var(--c-border-subtle);transition:background var(--dur-fast) var(--ease)}.ip-section__row:last-child{border-bottom:none}.ip-section__row:hover{background:var(--c-surface-hover)}.ip-section__label{padding:var(--sp-3) var(--sp-5);font-size:var(--fs-xs);font-weight:var(--fw-medium);color:var(--c-text-tertiary);display:flex;align-items:center}.ip-section__value{padding:var(--sp-3) var(--sp-5);font-size:var(--fs-sm);color:var(--c-text);word-break:break-all;display:flex;align-items:center}.ip-section__value--mono{font-family:var(--ff-mono);font-size:var(--fs-xs)}.ip-education{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden}.ip-education__header{padding:var(--sp-8) var(--sp-6) var(--sp-4);text-align:center}.ip-education__title{font-size:var(--fs-xl);font-weight:var(--fw-bold);color:var(--c-text);margin:0 0 var(--sp-2)}.ip-education__lead{font-size:var(--fs-sm);color:var(--c-text-secondary);max-width:540px;margin:0 auto;line-height:1.6}.ip-faq{padding:0 var(--sp-6) var(--sp-6)}.ip-faq__item{border-bottom:1px solid var(--c-border-subtle)}.ip-faq__item:last-child{border-bottom:none}.ip-faq__q{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--sp-4) 0;background:none;border:none;cursor:pointer;color:var(--c-text);font-size:var(--fs-sm);font-weight:var(--fw-medium);text-align:left;gap:var(--sp-3);font-family:inherit}.ip-faq__q svg{flex-shrink:0;transition:transform var(--dur-normal) var(--ease);color:var(--c-text-tertiary)}.ip-faq__q--open svg{transform:rotate(180deg)}.ip-faq__q:hover{color:var(--c-accent)}.ip-faq__a{padding:0 0 var(--sp-4);font-size:var(--fs-sm);color:var(--c-text-secondary);line-height:1.7}.ip-hero{--ip-hero-bg: linear-gradient(135deg, #0f172a 0%, #1e1b4b 35%, #172554 65%, #0c4a6e 100%);--ip-hero-glow: rgba(99, 102, 241, .25);--ip-hero-ring: rgba(148, 163, 184, .12);--ip-hero-text: #ffffff;--ip-hero-text-muted: rgba(255, 255, 255, .55);--ip-hero-badge-bg: rgba(255, 255, 255, .08);--ip-hero-badge-border: rgba(255, 255, 255, .12);--ip-hero-btn-bg: rgba(255, 255, 255, .1);--ip-hero-btn-border: rgba(255, 255, 255, .15);--ip-hero-btn-hover: rgba(255, 255, 255, .18);position:relative;text-align:center;padding:var(--sp-12) var(--sp-6) var(--sp-10);background:var(--ip-hero-bg);border-radius:var(--radius-lg);overflow:hidden;color:var(--ip-hero-text)}.ip-hero__deco{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none}.ip-hero__deco-ring{position:absolute;border-radius:50%;border:1px solid var(--ip-hero-ring);top:50%;left:50%;transform:translate(-50%,-50%)}.ip-hero__deco-ring--1{width:260px;height:260px}.ip-hero__deco-ring--2{width:440px;height:440px;opacity:.7}.ip-hero__deco-ring--3{width:640px;height:640px;opacity:.4}.ip-hero__deco-glow{position:absolute;width:300px;height:300px;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--ip-hero-glow);border-radius:50%;filter:blur(100px)}.ip-hero__deco-pulse{position:absolute;width:180px;height:180px;top:50%;left:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(99,102,241,.3) 0%,transparent 70%);border-radius:50%;animation:ipPulse 3s ease-in-out infinite}@keyframes ipPulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.6}50%{transform:translate(-50%,-50%) scale(1.4);opacity:.15}}.ip-hero>*:not(.ip-hero__deco){position:relative;z-index:1}.ip-hero__badge{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-4);font-size:var(--fs-xs);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.1em;color:var(--ip-hero-text-muted);background:var(--ip-hero-badge-bg);border:1px solid var(--ip-hero-badge-border);border-radius:var(--radius-full);margin-bottom:var(--sp-4)}.ip-hero__badge-dot{width:6px;height:6px;border-radius:50%;background:#4ade80;box-shadow:0 0 6px #4ade8099;animation:dotBlink 2s ease-in-out infinite}@keyframes dotBlink{0%,to{opacity:1}50%{opacity:.3}}.ip-hero__flag{font-size:3rem;line-height:1;margin-bottom:var(--sp-3);filter:drop-shadow(0 2px 8px rgba(0,0,0,.2))}.ip-hero__ip{font-family:var(--ff-sans);font-size:clamp(1.8rem,5vw,3rem);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);color:var(--ip-hero-text);margin-bottom:var(--sp-4);-webkit-user-select:all;user-select:all;text-shadow:0 0 40px rgba(99,102,241,.3)}.ip-hero__location,.ip-hero__org{display:flex;align-items:center;justify-content:center;gap:var(--sp-2);font-size:var(--fs-sm);color:var(--ip-hero-text-muted)}.ip-hero__location{margin-bottom:var(--sp-1)}.ip-hero__org{margin-bottom:var(--sp-2)}.ip-hero__location svg,.ip-hero__org svg{opacity:.7;flex-shrink:0}.ip-hero__actions{display:flex;justify-content:center;gap:var(--sp-3);flex-wrap:wrap;margin-top:var(--sp-5)}.ip-hero__copy,.ip-hero__refresh{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--ip-hero-text);background:var(--ip-hero-btn-bg);border:1px solid var(--ip-hero-btn-border);border-radius:var(--radius-md);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background var(--dur-fast) var(--ease)}.ip-hero__copy:hover,.ip-hero__refresh:hover{background:var(--ip-hero-btn-hover)}.ip-hero__copy--copied{background:#4ade8026;border-color:#4ade804d}.ip-map__canvas--loading{display:flex;align-items:center;justify-content:center;background:var(--c-bg-subtle);animation:skeleton-pulse 1.5s ease-in-out infinite}@keyframes skeleton-pulse{0%,to{opacity:.6}50%{opacity:.3}}.ad-slot{width:100%;display:flex;justify-content:center;overflow:hidden}.ad-slot:empty{display:none}.ad-slot--leaderboard{max-width:728px;margin:0 auto}.ad-slot--rectangle{max-width:336px;margin:0 auto}.ad-slot--banner{max-width:468px;margin:0 auto}.related-tools{margin-top:var(--sp-4);padding-top:var(--sp-8);border-top:1px solid var(--c-border)}.related-tools__title{font-size:var(--fs-xl);font-weight:var(--fw-bold);margin-bottom:var(--sp-5)}.related-tools__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--sp-4)}.related-tools__card{display:flex;flex-direction:column;gap:var(--sp-2);padding:var(--sp-5);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.related-tools__card:hover{border-color:var(--c-accent);box-shadow:0 0 0 1px var(--c-accent)}.related-tools__card--disabled{opacity:.5;cursor:default}.related-tools__card--disabled:hover{border-color:var(--c-border);box-shadow:none}.related-tools__card-title{font-size:var(--fs-base);font-weight:var(--fw-semibold)}.related-tools__card-desc{font-size:var(--fs-sm);color:var(--c-text-secondary);line-height:var(--lh-relaxed)}.related-tools__card-action{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-accent);margin-top:auto}.related-tools__card-badge{font-size:var(--fs-xs);color:var(--c-text-tertiary);background:var(--c-bg-subtle);padding:1px var(--sp-2);border-radius:var(--radius-full)}.tool-info{margin-top:var(--sp-12);padding-top:var(--sp-10);border-top:2px solid var(--c-border-subtle)}.tool-info__section{margin-bottom:var(--sp-10);padding:var(--sp-8);background:var(--c-bg-subtle);border-radius:var(--radius-lg);border:1px solid var(--c-border-subtle)}.tool-info__section:last-child{margin-bottom:0}.tool-info__heading{display:flex;align-items:center;gap:var(--sp-3);font-size:var(--fs-xl);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);margin-bottom:var(--sp-5);color:var(--c-text);padding-bottom:var(--sp-4);border-bottom:1px solid var(--c-border-subtle)}.tool-info__heading:before{content:"";display:block;width:4px;height:24px;background:var(--c-accent);border-radius:2px;flex-shrink:0}.tool-info__text{font-size:var(--fs-base);color:var(--c-text-secondary);line-height:1.85;max-width:780px}.tool-info__text p{margin-bottom:var(--sp-4)}.tool-info__text p:last-child{margin-bottom:0}.tool-info__list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--sp-4)}.tool-info__list li{display:flex;align-items:flex-start;gap:var(--sp-3);font-size:var(--fs-base);color:var(--c-text-secondary);line-height:var(--lh-relaxed);padding:var(--sp-4);background:var(--c-bg);border-radius:var(--radius-md);border:1px solid var(--c-border-subtle);transition:box-shadow var(--dur-fast) var(--ease)}.tool-info__list li:hover{box-shadow:var(--shadow-sm)}.tool-info__list li:before{content:"✓";display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:var(--c-accent);color:#fff;border-radius:50%;flex-shrink:0;font-size:var(--fs-xs);font-weight:var(--fw-bold);margin-top:2px}.tool-layout{display:flex;flex-direction:column;gap:var(--sp-6)}.tool-controls{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;padding:var(--sp-3) var(--sp-4);background:var(--c-bg-subtle);border:1px solid var(--c-border-subtle);border-radius:var(--radius-lg)}.tool-controls--wrap{flex-wrap:wrap}.tool-toggle{display:inline-flex;border:1px solid var(--c-border);border-radius:var(--radius-full);overflow:hidden;background:var(--c-bg-subtle);padding:3px;gap:2px}.tool-toggle__btn{padding:var(--sp-2) var(--sp-5);font-size:var(--fs-sm);font-weight:var(--fw-medium);background:transparent;color:var(--c-text-secondary);border:none;border-radius:var(--radius-full);cursor:pointer;transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.tool-toggle__btn:hover{color:var(--c-text)}.tool-toggle__btn--active{background:var(--c-accent);color:#fff;box-shadow:var(--shadow-sm)}.tool-panels{display:flex;flex-direction:column;gap:var(--sp-6)}.tool-panels--side{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}.tool-panel{display:flex;flex-direction:column;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-xs);transition:box-shadow var(--dur-fast) var(--ease)}.tool-panel:hover{box-shadow:var(--shadow-sm)}.tool-panel>.tool-panel__label{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-5);font-size:var(--fs-xs);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.06em;color:var(--c-text-secondary);background:var(--c-bg-subtle);border-bottom:1px solid var(--c-border-subtle);flex-shrink:0}.tool-panel__header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-5);background:var(--c-bg-subtle);border-bottom:1px solid var(--c-border-subtle);flex-shrink:0}.tool-panel__header .tool-panel__label{padding:0;background:transparent;border:none;font-size:var(--fs-xs);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.06em;color:var(--c-text-secondary)}.tool-panel__hint{padding:var(--sp-2) var(--sp-5);font-size:var(--fs-xs);color:var(--c-text-tertiary);background:var(--c-bg-subtle);border-bottom:1px solid var(--c-border-subtle);flex-shrink:0}.tool-panel:has(.tool-panel__textarea--output)>.tool-panel__label,.tool-panel:has(.tool-panel__textarea--output) .tool-panel__header{background:#f0f7f2;border-bottom-color:#c8e6d0;color:var(--c-success)}.tool-panel__textarea{width:100%;padding:var(--sp-4) var(--sp-5);font-family:var(--ff-mono);font-size:var(--fs-sm);line-height:var(--lh-relaxed);background:var(--c-surface);color:var(--c-text);border:none;border-radius:0;resize:vertical;min-height:160px;flex:1;transition:background var(--dur-fast) var(--ease);box-sizing:border-box}.tool-panel__textarea:focus{outline:none;background:#0060c004;box-shadow:inset 0 0 0 2px var(--c-accent)}.tool-panel__textarea--output{background:#f8fafb;color:var(--c-text);cursor:default}.tool-panel__textarea--output:focus{box-shadow:none;background:#f8fafb}.tool-panel__textarea--code{-moz-tab-size:2;tab-size:2;white-space:pre}.tool-dual{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}.tool-pane{display:flex;flex-direction:column;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-xs);transition:box-shadow var(--dur-fast) var(--ease)}.tool-pane:hover{box-shadow:var(--shadow-sm)}.tool-pane__label{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-5);font-size:var(--fs-xs);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.06em;color:var(--c-text-secondary);background:var(--c-bg-subtle);border-bottom:1px solid var(--c-border-subtle);flex-shrink:0}.tool-textarea{width:100%;padding:var(--sp-4) var(--sp-5);font-family:var(--ff-mono);font-size:var(--fs-sm);line-height:var(--lh-relaxed);background:var(--c-surface);color:var(--c-text);border:none;border-radius:0;resize:vertical;min-height:160px;flex:1;transition:background var(--dur-fast) var(--ease);box-sizing:border-box}.tool-textarea:focus{outline:none;background:#0060c004;box-shadow:inset 0 0 0 2px var(--c-accent)}.tool-textarea[readonly],.tool-textarea:read-only{background:#f8fafb;cursor:default}.tool-textarea[readonly]:focus,.tool-textarea:read-only:focus{box-shadow:none;background:#f8fafb}.tool-pane:has(.tool-textarea[readonly]) .tool-pane__label,.tool-pane:has(.tool-textarea:read-only) .tool-pane__label{background:#f0f7f2;border-bottom-color:#c8e6d0;color:var(--c-success)}.tool-tabs{display:inline-flex;border:1px solid var(--c-border);border-radius:var(--radius-full);overflow:hidden;background:var(--c-bg-subtle);padding:3px;gap:2px}.tool-tab{padding:var(--sp-2) var(--sp-5);font-size:var(--fs-sm);font-weight:var(--fw-medium);background:transparent;color:var(--c-text-secondary);border:none;border-radius:var(--radius-full);cursor:pointer;transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.tool-tab:hover{color:var(--c-text)}.tool-tab.is-active,.tool-tab--active{background:var(--c-accent);color:#fff;box-shadow:var(--shadow-sm)}@media (max-width: 640px){.tool-dual{grid-template-columns:1fr}}.tool-action-row{display:flex;align-items:center;justify-content:center;gap:var(--sp-3);padding:var(--sp-5) var(--sp-6);background:var(--c-bg-subtle);border:1px solid var(--c-border-subtle);border-radius:var(--radius-lg)}.tool-action-row .btn--primary{padding:var(--sp-3) var(--sp-8);font-size:var(--fs-base);min-width:140px}.tool-error{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-sm);color:var(--c-error);background:var(--c-error-subtle);padding:var(--sp-3) var(--sp-4);border-radius:var(--radius-md);border:1px solid var(--c-error);margin:0}.tool-error:before{content:"⚠";font-size:var(--fs-base);flex-shrink:0}.tool-input{padding:var(--sp-2) var(--sp-3);font-family:var(--ff-mono);font-size:var(--fs-sm);background:var(--c-bg);color:var(--c-text);border:1px solid var(--c-border);border-radius:var(--radius-md);transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.tool-input:focus{outline:none;border-color:var(--c-accent);box-shadow:0 0 0 3px var(--c-accent-subtle);background:var(--c-bg)}.tool-input--sm{width:80px}.tool-select-label{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-secondary)}.tool-select{padding:var(--sp-2) var(--sp-3);font-size:var(--fs-sm);background:var(--c-bg);color:var(--c-text);border:1px solid var(--c-border);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--dur-fast) var(--ease)}.tool-select:focus{outline:none;border-color:var(--c-accent);box-shadow:0 0 0 3px var(--c-accent-subtle)}.tool-checkbox{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:var(--fs-sm);color:var(--c-text-secondary);cursor:pointer}.tool-checkboxes{display:flex;gap:var(--sp-3);flex-wrap:wrap}.tool-result{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-xs)}.tool-result__header{display:flex;justify-content:flex-end;padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--c-border)}.tool-result__pre{padding:var(--sp-4) var(--sp-5);font-family:var(--ff-mono);font-size:var(--fs-sm);line-height:var(--lh-relaxed);margin:0;white-space:pre-wrap;word-break:break-all}.tool-table{width:100%;border-collapse:collapse}.tool-table td,.tool-table th{padding:var(--sp-3) var(--sp-5);font-size:var(--fs-sm);border-bottom:1px solid var(--c-border-subtle);vertical-align:middle}.tool-table tr:last-child td,.tool-table tr:last-child th{border-bottom:none}.tool-table td:first-child{color:var(--c-text-tertiary);font-size:var(--fs-xs);font-weight:var(--fw-medium);width:50%}.tool-table td:last-child{font-family:var(--ff-mono);font-size:var(--fs-sm);color:var(--c-text);font-weight:var(--fw-semibold)}.tool-table tr:hover td{background:var(--c-surface-hover)}.hash-results{display:flex;flex-direction:column;gap:var(--sp-3)}.hash-result{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden}.hash-result__header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--c-border);background:var(--c-bg-subtle)}.hash-result__algo{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--c-text-secondary)}.hash-result__value{display:block;padding:var(--sp-3) var(--sp-4);font-family:var(--ff-mono);font-size:var(--fs-sm);line-height:var(--lh-relaxed);word-break:break-all}.password-list{display:flex;flex-direction:column;gap:var(--sp-2)}.password-item{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-md);padding:var(--sp-2) var(--sp-3)}.password-item__value{font-family:var(--ff-mono);font-size:var(--fs-sm);word-break:break-all;flex:1}.diff-stats{display:flex;gap:var(--sp-4);font-size:var(--fs-sm);font-weight:var(--fw-semibold)}.diff-stats__add{color:#22c55e}.diff-stats__remove{color:#ef4444}.diff-output{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:auto;font-family:var(--ff-mono);font-size:var(--fs-sm);line-height:var(--lh-relaxed);max-height:600px}.diff-line{display:flex;white-space:pre-wrap}.diff-line--add{background:color-mix(in srgb,#22c55e 12%,transparent)}.diff-line--remove{background:color-mix(in srgb,#ef4444 12%,transparent)}.diff-line__gutter{flex-shrink:0;width:40px;text-align:right;padding:0 var(--sp-2);color:var(--c-text-tertiary);border-right:1px solid var(--c-border);-webkit-user-select:none;user-select:none}.diff-line__marker{flex-shrink:0;width:20px;text-align:center;color:var(--c-text-tertiary);-webkit-user-select:none;user-select:none}.diff-line__text{flex:1;padding:0 var(--sp-2)}.unixtime-now{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:var(--sp-4) var(--sp-6);text-align:center}.unixtime-now__label{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--sp-2)}.unixtime-now__value{display:flex;align-items:center;justify-content:center;gap:var(--sp-3)}.unixtime-now__value code{font-size:clamp(1.5rem,4vw,2.5rem);font-weight:var(--fw-bold);color:var(--c-accent)}.unixtime-now__date{font-size:var(--fs-sm);color:var(--c-text-tertiary);margin-top:var(--sp-1)}@media (max-width: 768px){.tool-panels--side{grid-template-columns:1fr}.diff-line__gutter{width:30px;font-size:var(--fs-xs)}}@media (max-width: 768px){.ip-grid,.ip-section__row{grid-template-columns:1fr}.ip-section__label{padding:var(--sp-3) var(--sp-4) var(--sp-1)}.ip-section__value{padding:var(--sp-1) var(--sp-4) var(--sp-3)}.ip-map__canvas{height:200px}.ip-hero{padding:var(--sp-8) var(--sp-4) var(--sp-6)}.ip-hero__ip{font-size:clamp(1.4rem,6vw,2rem)}.ip-hero__flag{font-size:2rem}.ip-hero__deco-ring--3{display:none}.ip-education__header{padding:var(--sp-6) var(--sp-4) var(--sp-3)}.ip-faq{padding:0 var(--sp-4) var(--sp-4)}.related-tools__grid{grid-template-columns:1fr}.header__dropdown-panel{right:auto;left:0;min-width:240px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.visually-hidden{composes:sr-only}.dns-search{display:flex;flex-direction:column;gap:var(--sp-3);margin-bottom:var(--sp-5)}.dns-search__row{display:flex;gap:var(--sp-2)}.dns-search__input{flex:1;min-width:0}.dns-search__input--sm{width:200px;padding:var(--sp-1) var(--sp-2);font-size:var(--fs-sm);border:1px solid var(--c-border);border-radius:var(--radius-md);background:var(--c-surface);color:var(--c-text);outline:none;transition:border-color var(--dur-fast) var(--ease)}.dns-search__input--sm:focus{border-color:var(--c-brand)}.dns-type-filters{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center}.dns-type-label{font-size:var(--fs-sm);color:var(--c-text-muted);font-weight:500}.dns-type-badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:9999px;font-size:var(--fs-xs);font-weight:600;letter-spacing:.03em;border:1.5px solid var(--c-border);background:var(--c-surface);color:var(--c-text-muted);cursor:pointer;transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease);-webkit-user-select:none;user-select:none}.dns-type-badge:hover{border-color:var(--c-brand);color:var(--c-brand)}.dns-type-badge--active{background:var(--c-brand);border-color:var(--c-brand);color:#fff}.dns-results{display:flex;flex-direction:column;gap:var(--sp-4)}.dns-results__meta{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);background:var(--c-bg-subtle);border-radius:var(--radius-md);font-size:var(--fs-sm);color:var(--c-text-muted)}.dns-results__domain{font-weight:600;color:var(--c-text)}.dns-results__count{margin-left:auto}.dns-results__empty{text-align:center;padding:var(--sp-10);color:var(--c-text-muted);font-size:var(--fs-sm)}.dns-type-group{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden}.dns-type-group__header{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--c-border);background:var(--c-bg-subtle)}.dns-type-group__name{font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;padding:2px 8px;border-radius:4px;color:#fff}.dns-type-group__count{font-size:var(--fs-xs);color:var(--c-text-muted);margin-left:auto}.dns-records{display:flex;flex-direction:column}.dns-record{display:flex;align-items:baseline;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);font-size:var(--fs-sm);border-bottom:1px solid var(--c-border);font-family:var(--font-mono);transition:background var(--dur-fast) var(--ease)}.dns-record:last-child{border-bottom:none}.dns-record:hover{background:var(--c-surface-hover)}.dns-record__priority{font-size:var(--fs-xs);color:var(--c-text-muted);min-width:32px;text-align:right}.dns-record__data{flex:1;word-break:break-all;color:var(--c-text)}.dns-record__ttl{font-size:var(--fs-xs);color:var(--c-text-muted);white-space:nowrap}.headers-results{display:flex;flex-direction:column;gap:var(--sp-4)}.headers-meta{display:flex;flex-direction:column;gap:var(--sp-1);padding:var(--sp-3) var(--sp-4);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg)}.headers-status{display:flex;align-items:center;gap:var(--sp-2)}.headers-status__code{font-size:2rem;font-weight:700;font-family:var(--font-mono);line-height:1}.headers-status__text{font-size:var(--fs-base);color:var(--c-text-muted)}.headers-meta__info{display:flex;align-items:center;gap:var(--sp-3);font-size:var(--fs-sm)}.headers-meta__url{color:var(--c-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60%;font-family:var(--font-mono)}.headers-meta__timing{margin-left:auto;color:var(--c-text-muted);font-family:var(--font-mono);font-size:var(--fs-xs)}.headers-section__title{font-size:var(--fs-sm);font-weight:600;color:var(--c-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--sp-2)}.headers-redirects{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:var(--sp-3) var(--sp-4)}.headers-redirect{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) 0;font-size:var(--fs-sm);font-family:var(--font-mono);border-bottom:1px solid var(--c-border)}.headers-redirect:last-child{border-bottom:none}.headers-redirect__status{font-weight:700;min-width:36px}.headers-redirect__url{flex:1;color:var(--c-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.headers-redirect__arrow{color:var(--c-text-muted);flex-shrink:0}.headers-security{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:var(--sp-3) var(--sp-4)}.headers-security__grid{display:flex;flex-wrap:wrap;gap:var(--sp-2)}.headers-security__item{display:flex;align-items:center;gap:5px;font-size:var(--fs-xs);font-family:var(--font-mono);padding:3px 8px;border-radius:4px}.headers-security__item--present{background:#16a34a18;color:#16a34a}.headers-security__item--missing{background:var(--c-bg-subtle);color:var(--c-text-muted);opacity:.6}.headers-list-section{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden}.headers-list-header{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--c-border);background:var(--c-bg-subtle);flex-wrap:wrap}.headers-list-header .headers-section__title{margin-bottom:0}.headers-list{display:flex;flex-direction:column;max-height:520px;overflow-y:auto}.headers-item{display:grid;grid-template-columns:minmax(180px,28%) 1fr auto;gap:var(--sp-2);align-items:baseline;padding:var(--sp-2) var(--sp-4);font-size:var(--fs-sm);border-bottom:1px solid var(--c-border);cursor:pointer;transition:background var(--dur-fast) var(--ease)}.headers-item:last-child{border-bottom:none}.headers-item:hover{background:var(--c-surface-hover)}.headers-item--security{background:#2563eb08}.headers-item:hover.headers-item--security{background:#2563eb12}.headers-item__name{font-family:var(--font-mono);font-weight:600;font-size:var(--fs-xs);color:var(--c-brand);word-break:break-word}.headers-item__value{font-family:var(--font-mono);color:var(--c-text);word-break:break-all;line-height:var(--lh-relaxed)}.headers-item__copy{font-size:var(--fs-xs);color:var(--c-text-muted);opacity:0;transition:opacity var(--dur-fast) var(--ease)}.headers-item:hover .headers-item__copy{opacity:1}.home-tools{max-width:1400px;margin:0 auto;padding:var(--sp-8) var(--content-pad) var(--sp-16)}.tool-list{display:flex;flex-direction:column;gap:var(--sp-2)}.tool-list__item{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4) var(--sp-5);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);transition:box-shadow var(--dur-normal) var(--ease),background var(--dur-normal) var(--ease),border-color var(--dur-normal) var(--ease);text-decoration:none;color:inherit}.tool-list__item:hover{box-shadow:var(--shadow-md);background:var(--c-surface-hover);border-color:var(--list-accent, var(--c-accent))}.tool-list__item--network{--list-accent: #2563eb}.tool-list__item--encode{--list-accent: #a855f7}.tool-list__item--web{--list-accent: #06b6d4}.tool-list__item--format{--list-accent: #f59e0b}.tool-list__item--converter{--list-accent: #10b981}.tool-list__item--developer{--list-accent: #6366f1}.tool-list__item--validator{--list-accent: #f43658}.tool-list__item--sysadmin{--list-accent: #78716c}.tool-list__item--general{--list-accent: #8b5cf6}.tool-list__item--security{--list-accent: #16a34a}.tool-list__icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:linear-gradient(135deg,color-mix(in srgb,var(--list-accent, var(--c-accent)) 12%,transparent),color-mix(in srgb,var(--list-accent, var(--c-accent)) 20%,transparent));color:var(--list-accent, var(--c-accent));border-radius:var(--radius-md);font-size:var(--fs-lg);flex-shrink:0}.tool-list__body{flex:1;min-width:0}.tool-list__title{font-size:var(--fs-base);font-weight:var(--fw-semibold);line-height:var(--lh-tight)}.tool-list__desc{font-size:var(--fs-sm);color:var(--c-text-secondary);margin-top:var(--sp-1);line-height:1.4}.tool-list__arrow{flex-shrink:0;color:var(--c-text-tertiary);transition:color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease)}.tool-list__item:hover .tool-list__arrow{color:var(--list-accent, var(--c-accent));transform:translate(3px)}.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--sp-8);margin-bottom:var(--sp-8);text-align:left}.footer__brand{font-size:var(--fs-lg);font-weight:var(--fw-bold);color:var(--c-text);text-decoration:none}.footer__brand:hover{color:var(--c-accent)}.footer__tagline{font-size:var(--fs-sm);color:var(--c-text-tertiary);margin-top:var(--sp-2);line-height:1.5}.footer__heading{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--c-text-secondary);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--sp-3)}.footer__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--sp-2)}.footer__bottom{display:flex;align-items:center;justify-content:space-between;padding-top:var(--sp-6);border-top:1px solid var(--c-border);font-size:var(--fs-sm);color:var(--c-text-tertiary)}.footer__powered{display:flex;align-items:center;gap:var(--sp-1);font-size:var(--fs-xs);color:var(--c-text-tertiary);opacity:.55;transition:opacity var(--dur-fast) var(--ease)}.footer__powered:hover{opacity:.9}.footer__powered-link{color:var(--c-text-tertiary);font-weight:var(--fw-normal);text-decoration:none}.footer__powered-link:hover{text-decoration:underline}.prose{max-width:72ch;line-height:1.75;color:var(--c-text-secondary)}.prose h2,.prose h3{color:var(--c-text);margin-top:var(--sp-8);margin-bottom:var(--sp-3);font-weight:var(--fw-semibold)}.prose h2{font-size:var(--fs-xl)}.prose h3{font-size:var(--fs-lg)}.prose p{margin-bottom:var(--sp-4)}.prose ul,.prose ol{padding-left:var(--sp-6);margin-bottom:var(--sp-4)}.prose li{margin-bottom:var(--sp-2)}.prose a{color:var(--c-accent);text-decoration:underline;text-underline-offset:2px}.prose a:hover{color:var(--c-accent-hover)}.prose code{font-family:var(--font-mono);font-size:.9em;background:var(--c-bg-subtle);padding:2px var(--sp-1);border-radius:var(--radius-sm)}.prose strong{color:var(--c-text);font-weight:var(--fw-semibold)}.prose__updated{font-size:var(--fs-sm);color:var(--c-text-tertiary);margin-bottom:var(--sp-6)}.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--sp-6)}.blog-card{display:flex;flex-direction:column;padding:var(--sp-6);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);text-decoration:none;color:inherit;transition:box-shadow var(--dur-normal) var(--ease),background var(--dur-normal) var(--ease)}.blog-card:hover{box-shadow:var(--shadow-md);background:var(--c-surface-hover)}.blog-card__meta{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-3);font-size:var(--fs-xs)}.blog-card__category{display:inline-flex;align-items:center;gap:var(--sp-1);padding:2px var(--sp-2);background:var(--c-bg-subtle);border-radius:var(--radius-full);font-weight:var(--fw-medium);color:var(--c-text-secondary)}.blog-card__date{color:var(--c-text-tertiary)}.blog-card__title{font-size:var(--fs-lg);font-weight:var(--fw-semibold);color:var(--c-text);margin-bottom:var(--sp-2);line-height:var(--lh-tight)}.blog-card__desc{font-size:var(--fs-sm);color:var(--c-text-secondary);flex:1;line-height:1.5}.blog-card__read{display:inline-block;margin-top:var(--sp-4);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-accent)}.blog-post__meta{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4);font-size:var(--fs-sm)}.blog-post__category{display:inline-flex;align-items:center;gap:var(--sp-1);padding:2px var(--sp-3);background:#ffffff1f;border-radius:var(--radius-full);font-weight:var(--fw-medium)}.blog-post__body{margin-bottom:var(--sp-12)}.blog-post__tools{padding:var(--sp-6);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);margin-bottom:var(--sp-8)}.blog-post__tools-title{font-size:var(--fs-base);font-weight:var(--fw-semibold);margin-bottom:var(--sp-4)}.blog-post__tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--sp-3)}.blog-post__tool-link{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);background:var(--c-bg);border:1px solid var(--c-border);border-radius:var(--radius-md);text-decoration:none;color:var(--c-text);font-size:var(--fs-sm);font-weight:var(--fw-medium);transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.blog-post__tool-link:hover{border-color:var(--c-accent);box-shadow:var(--shadow-sm)}.blog-post__nav{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);padding-top:var(--sp-8);border-top:1px solid var(--c-border)}.blog-post__nav-link{display:flex;flex-direction:column;gap:var(--sp-1);padding:var(--sp-4);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);text-decoration:none;color:var(--c-text);font-size:var(--fs-sm);transition:border-color var(--dur-fast) var(--ease)}.blog-post__nav-link:hover{border-color:var(--c-accent)}.blog-post__nav-link--prev{text-align:left}.blog-post__nav-link--next{text-align:right}.category-tools{display:flex;flex-direction:column;gap:var(--sp-2)}@media (max-width: 768px){.home-tools{padding:var(--sp-8) var(--sp-4) var(--sp-12)}.tool-list__item{padding:var(--sp-3) var(--sp-4)}.tool-list__desc{display:none}.footer__grid{grid-template-columns:1fr;gap:var(--sp-6)}.footer__bottom{flex-direction:column;gap:var(--sp-3);text-align:center}.blog-grid,.blog-post__nav,.blog-post__tools-grid{grid-template-columns:1fr}}.contact-form{max-width:560px;display:flex;flex-direction:column;gap:var(--sp-5)}.contact-form__field{display:flex;flex-direction:column;gap:var(--sp-2)}.contact-form__label{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-secondary)}.contact-form__required{color:var(--c-danger, #ef4444);margin-left:2px}.contact-form__input,.contact-form__select,.contact-form__textarea{width:100%;padding:var(--sp-3) var(--sp-4);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-md);color:var(--c-text);font-size:var(--fs-base);font-family:var(--font-sans);transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.contact-form__input:focus,.contact-form__select:focus,.contact-form__textarea:focus{outline:none;border-color:var(--c-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--c-accent) 18%,transparent)}.contact-form__textarea{resize:vertical;min-height:140px;line-height:var(--lh-relaxed)}.contact-form__select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--sp-4) center;padding-right:var(--sp-10);cursor:pointer}.contact-form__note{font-size:var(--fs-xs);color:var(--c-text-tertiary);margin-top:calc(var(--sp-1) * -1)}.contact-form__submit{align-self:flex-start}.contact-form__submit:disabled{opacity:.4;cursor:not-allowed}.contact-thanks{display:flex;flex-direction:column;align-items:center;gap:var(--sp-4);padding:var(--sp-16) var(--sp-4);text-align:center}.contact-thanks__icon{font-size:3rem;line-height:1}.contact-thanks__title{font-size:var(--fs-2xl);font-weight:var(--fw-bold);color:var(--c-text)}.contact-thanks__text{font-size:var(--fs-base);color:var(--c-text-secondary);max-width:40ch}.cp-card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden;-webkit-user-select:none;user-select:none}.cp-card__cols{display:grid;grid-template-columns:1fr 260px}.cp-sv-panel{width:100%;min-height:300px;height:100%;position:relative;cursor:crosshair;touch-action:none}.cp-sv-handle{position:absolute;width:18px;height:18px;border-radius:var(--radius-full);transform:translate(-50%,-50%);border:2px solid #fff;box-shadow:0 0 0 1.5px #00000059;pointer-events:none}.cp-info{display:flex;flex-direction:column;border-left:1px solid var(--c-border)}.cp-preview{flex:1;min-height:100px;display:flex;align-items:flex-end;padding:var(--sp-3)}.cp-preview__hex{font-family:var(--ff-mono);font-size:var(--fs-sm);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.04em}.cp-hue-wrap{padding:var(--sp-3) var(--sp-3) var(--sp-2)}.cp-hue-track{position:relative;height:14px;border-radius:var(--radius-full);cursor:pointer;touch-action:none;background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);box-shadow:inset 0 0 0 1px #0000001f}.cp-hue-handle{position:absolute;top:50%;width:20px;height:20px;border-radius:var(--radius-full);transform:translate(-50%,-50%);border:2.5px solid #fff;box-shadow:0 2px 6px #0006;pointer-events:none}.cp-fmt-rows{display:flex;flex-direction:column;padding:var(--sp-2) var(--sp-3) var(--sp-3);gap:var(--sp-2)}.cp-fmt-row{display:flex;align-items:center;gap:var(--sp-2)}.cp-fmt-lbl{font-family:var(--ff-mono);font-size:.65rem;font-weight:var(--fw-semibold);color:var(--c-text-tertiary);width:30px;flex-shrink:0;text-transform:uppercase;letter-spacing:.04em}.cp-fmt-inputs{display:flex;gap:3px;flex:1;min-width:0}.cp-fmt-input{flex:1;min-width:0;border:1.5px solid var(--c-border);border-radius:var(--radius-sm);background:var(--c-bg-subtle);color:var(--c-text);font-family:var(--ff-mono);font-size:var(--fs-xs);padding:5px 2px;text-align:center;height:30px;transition:border-color .12s}.cp-fmt-input--wide{text-align:left;padding-left:6px}.cp-fmt-input:focus{outline:none;border-color:var(--c-accent)}.cp-fmt-input[type=number]::-webkit-inner-spin-button,.cp-fmt-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.cp-copy-btn{font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--c-text-secondary);border:1px solid var(--c-border);border-radius:var(--radius-sm);padding:4px 8px;height:30px;white-space:nowrap;cursor:pointer;background:transparent;transition:background .1s,color .1s,border-color .1s}.cp-copy-btn:hover{background:var(--c-accent);color:#fff;border-color:var(--c-accent)}.cp-section{display:flex;flex-direction:column;gap:var(--sp-3)}.cp-section__title{font-size:var(--fs-base);font-weight:var(--fw-semibold);color:var(--c-text);margin:0}.cp-scale{display:grid;grid-template-columns:repeat(9,1fr);border-radius:var(--radius-md);overflow:hidden;height:88px}.cp-scale__cell{border:none;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;padding:7px 4px;position:relative;transition:filter .1s}.cp-scale__cell:hover{filter:brightness(1.08);z-index:1}.cp-scale__cell.is-base{box-shadow:inset 0 0 0 3px #ffffff73}.cp-scale__label{font-size:.6rem;font-weight:var(--fw-semibold);opacity:.85;line-height:1;letter-spacing:-.01em}.cp-scale__hex{font-family:var(--ff-mono);font-size:.52rem;line-height:1;opacity:0;transition:opacity .12s;word-break:break-all}.cp-scale__cell:hover .cp-scale__hex{opacity:.9}.cp-harmonies-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:var(--sp-3)}.cp-harmony-card{border:1px solid var(--c-border);border-radius:var(--radius-md);overflow:hidden}.cp-harmony-card__strips{display:flex;height:64px}.cp-harmony-card__strip{flex:1;border:none;cursor:pointer;transition:filter .1s;position:relative}.cp-harmony-card__strip:hover{filter:brightness(1.1);z-index:1}.cp-harmony-card__strip.is-current:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:2.5px solid rgba(255,255,255,.75);pointer-events:none}.cp-harmony-card__label{padding:var(--sp-2) var(--sp-3);font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--c-text-secondary);text-align:center;border-top:1px solid var(--c-border);margin:0}.cp-chart{display:flex;flex-direction:column;gap:3px;overflow-x:auto}.cp-chart__row{display:flex;gap:3px}.cp-chart__row--grays{margin-top:4px}.cp-chart__cell{width:32px;height:24px;border-radius:4px;border:none;cursor:pointer;flex-shrink:0;transition:transform .1s;position:relative}.cp-chart__cell:hover{transform:scale(1.2);z-index:1}.cp-chart__cell.is-selected:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:4px;border:2.5px solid rgba(255,255,255,.8);box-shadow:0 0 0 1.5px #0000004d}@media (max-width: 700px){.cp-card__cols{grid-template-columns:1fr}.cp-sv-panel{min-height:240px;height:240px}.cp-info{border-left:none;border-top:1px solid var(--c-border)}}