:root{--header-height: 82px;color-scheme:light;--bg: #f8fafc;--surface: #ffffff;--surface-2: #f1f5f9;--surface-3: #eaf8f5;--text: #0f172a;--muted: #64748b;--line: #e2e8f0;--brand: #0f766e;--brand-strong: #115e59;--accent: #14b8a6;--focus: #0f766e;--action-bg: #0f766e;--action-hover: #115e59;--tint-text: #0f766e;--error-text: #b91c1c;--explanatory: #596a80;--shadow: 0 12px 45px rgba(15,23,42,.045)}:root[data-theme=dark]{color-scheme:dark;--bg: #091221;--surface: #101e31;--surface-2: #17283e;--surface-3: #123e42;--text: #edf6fc;--muted: #a2b3c7;--line: #26384e;--brand: #1b998c;--brand-strong: #117d75;--accent: #38d8c6;--focus: #38d8c6;--action-bg: #117d75;--action-hover: #0f766e;--tint-text: #38d8c6;--error-text: #ff9292;--explanatory: #a2b3c7;--shadow: 0 18px 55px rgba(0,0,0,.17)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + 12px)}body{margin:0;background:var(--bg);color:var(--text);font:400 15px/1.6 DM Sans,Inter,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}::selection{background:#14b8a647}:focus-visible,.hero-search input:focus-visible,.code-input:focus-visible,.field-input:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.skip-link{position:fixed;top:12px;left:12px;z-index:10;padding:10px 17px;border:1px solid var(--focus);border-radius:9px;background:var(--surface);color:var(--text);transform:translateY(-200%)}.skip-link:focus{transform:translateY(0)}.container{max-width:1170px;padding:0 30px;margin:0 auto}.site-shell{min-height:100vh;display:flex;flex-direction:column}main{flex:1}.site-header{height:var(--header-height);flex-shrink:0;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:20px;font-weight:800;letter-spacing:-.9px;white-space:nowrap}.brand-mark{display:inline-grid;place-items:center;width:37px;height:37px;border-radius:11px;background:var(--brand);color:#fff;font:700 13px/1 JetBrains Mono,monospace;box-shadow:0 5px 15px #0f766e38}.brand-accent{color:var(--brand)}.brand-dot{color:var(--accent)}.header-nav,.header-actions{display:flex;align-items:center;gap:29px}.header-nav a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:13px;font-weight:700;color:var(--muted)}.header-nav a:hover,.footer-links a:hover{color:var(--brand)}.header-actions{gap:11px}.header-control{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;height:44px;border-radius:10px;padding:0 12px;border:1px solid var(--line);background:var(--surface);color:var(--text);font-weight:700;font-size:12px}.header-control:hover{background:var(--surface-2)}.mobile-nav-toggle{display:none}.hero{background:radial-gradient(ellipse 50% 72% at 76% 30%,rgba(20,184,166,.11),transparent 65%),linear-gradient(180deg,var(--surface),var(--bg));border-bottom:1px solid var(--line);min-height:425px;position:relative;overflow:hidden}.hero-orbit{width:350px;height:350px;border:1px solid rgba(20,184,166,.09);border-radius:50%;position:absolute;right:5%;top:8%;pointer-events:none}.orbit-two{width:520px;height:520px;right:-1%;top:-13%;opacity:.7}.hero-content{padding-top:74px;padding-bottom:68px;position:relative;z-index:1;text-align:center}.eyebrow,.section-kicker{font-size:12px;font-weight:800;letter-spacing:2.2px;text-transform:uppercase;color:var(--brand)}.eyebrow{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(20,184,166,.25);background:var(--surface-3);color:var(--tint-text);padding:7px 15px;border-radius:50px;letter-spacing:1.1px;font-size:12px}.eyebrow-dot,.live-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;box-shadow:0 0 0 4px #14b8a621}.hero h1{font-size:clamp(38px,5.5vw,65px);line-height:1.11;letter-spacing:-2.8px;margin:20px 0 16px;font-weight:800}.hero-gradient{color:var(--brand)}.hero-description{font-size:15px;line-height:1.8;color:var(--muted);max-width:630px;margin:0 auto 26px}.hero-search{display:flex;align-items:center;gap:14px;max-width:560px;margin:0 auto;background:var(--surface);border:1px solid var(--line);padding:12px 15px;border-radius:12px;box-shadow:var(--shadow)}.search-icon{font-size:25px;color:var(--brand);line-height:1}.hero-search input{flex:1;min-width:0;min-height:44px;margin:-6px 0;border:0;outline:0;background:transparent;color:var(--text);font-size:13px}.hero-search input::placeholder{color:var(--muted)}.search-key{font:600 12px/1 JetBrains Mono,monospace;color:var(--explanatory);background:var(--surface-2);border:1px solid var(--line);padding:8px;border-radius:6px;white-space:nowrap}.quick-results{max-width:560px;margin:8px auto 0;padding:12px;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}.quick-results h2{font-size:14px;letter-spacing:0;margin:0 4px 4px}.quick-results-count{font-size:12px;color:var(--muted);margin:0 4px 6px}.quick-results-list{list-style:none;margin:0;padding:7px;max-height:min(260px,35vh);overflow-y:auto}.quick-results-list li+li{border-top:1px solid var(--line)}.quick-results-list a{display:flex;flex-direction:column;justify-content:center;gap:3px;min-height:44px;padding:9px 6px;border-radius:6px;overflow-wrap:anywhere}.quick-results-list a:hover{background:var(--surface-2)}.quick-results-list a:hover span{color:var(--explanatory)}.quick-results-list strong{font-size:13px;color:var(--text)}.quick-results-list span{font-size:12px;line-height:1.5;color:var(--muted)}.quick-results-catalog{display:flex;align-items:center;gap:8px;min-height:44px;padding:6px 4px;font-size:13px;font-weight:700;color:var(--brand)}.hero-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:24px;margin-top:20px;font-size:12px;color:var(--muted)}.hero-meta span:first-letter{color:var(--brand)}.catalog-section{padding-top:72px;padding-bottom:84px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}.section-heading h2,.benefits-intro h2,.related-section h2{font-size:clamp(23px,3vw,31px);font-weight:800;letter-spacing:-1.15px;margin:9px 0 4px;line-height:1.25}.section-heading p{font-size:13px;color:var(--muted);margin:6px 0}.count-label{font-size:12px;font-weight:700;color:var(--muted);white-space:nowrap}.filter-scroll-hint{display:none}.filter-bar{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:27px}.filter-pill{min-width:44px;min-height:44px;background:var(--surface);color:var(--muted);border:1px solid var(--line);border-radius:8px;padding:9px 16px;font-size:13px;font-weight:700;transition:background .15s,color .15s}.filter-pill.active{background:var(--action-bg);border-color:var(--action-bg);color:#fff}.filter-pill:hover:not(.active){color:var(--brand);border-color:var(--accent)}.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.category-heading{grid-column:1/-1;margin:12px 0 0}.tool-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:25px;display:flex;flex-direction:column;min-height:240px;transition:transform .18s,border-color .18s,box-shadow .18s;box-shadow:var(--shadow)}.tool-card:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 18px 40px #0f766e1c}.card-top{display:flex;align-items:flex-start;justify-content:space-between}.tool-icon{width:47px;height:47px;display:inline-grid;place-items:center;background:var(--surface-3);border:1px solid rgba(20,184,166,.1);border-radius:12px;color:var(--tint-text);font:800 14px/1 JetBrains Mono,monospace;flex:none}.card-arrow{color:var(--muted);font-size:21px}.tool-card h3{font-size:15px;line-height:1.4;margin:20px 0 5px;font-weight:800}.tool-card p{font-size:13px;color:var(--muted);line-height:1.65;margin:0}.card-foot{border-top:1px solid var(--line);margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:8px;color:var(--muted);font-size:12px;font-weight:700;padding-top:16px}.card-foot span:last-child{color:var(--brand)}.empty-message{grid-column:1/-1;background:var(--surface);padding:45px 20px;text-align:center;border:1px dashed var(--line);border-radius:14px;color:var(--muted)}.benefits-section{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding-top:48px;padding-bottom:50px;margin-bottom:95px}.benefits-intro{text-align:center}.benefits-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin:35px auto 0;max-width:940px}.benefits-grid>div{text-align:center}.benefit-icon{display:grid;place-items:center;margin:0 auto 12px;width:42px;height:42px;background:var(--surface-3);border-radius:12px;color:var(--brand);font-size:19px}.benefits-grid h3{font-size:14px;margin:0 0 5px}.benefits-grid p{font-size:13px;color:var(--muted);margin:0}.site-footer{background:var(--surface);border-top:1px solid var(--line)}.footer-grid{padding-top:42px;padding-bottom:40px;display:flex;justify-content:space-between;gap:24px}.footer-grid p{font-size:13px;color:var(--muted)}.footer-links{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.footer-links a{display:inline-flex;align-items:center;min-width:44px;min-height:44px;font-size:13px;font-weight:700;color:var(--muted)}.footer-bottom{border-top:1px solid var(--line);padding-top:17px;padding-bottom:17px;color:var(--muted);font-size:12px;display:flex;justify-content:space-between;gap:15px}.tool-page{padding-top:25px;padding-bottom:80px}.breadcrumbs{display:flex;align-items:center;gap:0 10px;color:var(--muted);font-size:12px;flex-wrap:wrap}.breadcrumbs a{display:inline-flex;align-items:center;min-width:44px;min-height:44px}.breadcrumbs a:hover{color:var(--brand)}.tool-heading{display:flex;align-items:center;gap:17px;margin:37px 0 33px}.tool-icon-lg{width:64px;height:64px;border-radius:17px;font-size:20px}.tool-heading h1{font-size:clamp(23px,3vw,34px);letter-spacing:-1.3px;line-height:1.25;margin:4px 0}.tool-heading p{font-size:13px;color:var(--muted);margin:0}.tool-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px}.tool-main{min-width:0}.workspace-panel,.result-panel,.side-card{background:var(--surface);border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow)}.workspace-panel{padding:25px}.workspace-heading,.result-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:23px}.workspace-heading>div{display:flex;align-items:center;gap:10px}.workspace-heading h2,.result-heading h2,.side-card h2{font-size:15px;margin:0;font-weight:800}.mini-badge{font-size:12px;font-weight:700;color:var(--tint-text);border:1px solid rgba(20,184,166,.2);padding:5px 10px;border-radius:20px;background:var(--surface-3)}.field-label{display:block;font-size:12px;font-weight:800;margin-bottom:9px}.code-input,.field-input{display:block;width:100%;border:1px solid var(--line);border-radius:10px;color:var(--text);background:var(--bg);outline:0;transition:border .15s}.code-input:focus,.field-input:focus{border-color:var(--accent)}.code-input{min-height:178px;padding:15px;font:13px/1.7 JetBrains Mono,monospace;resize:vertical}.field-input{min-height:44px;padding:10px 13px;font-size:14px}.narrow-input{max-width:200px}.two-fields{display:grid;grid-template-columns:2fr 1fr;gap:17px}.hint{font-size:12px;color:var(--muted);margin:10px 0 0}.action-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:18px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;min-height:44px;border-radius:9px;padding:10px 17px;border:1px solid transparent;font-size:13px;font-weight:800;transition:filter .2s}.btn:hover{filter:brightness(1.08)}.btn-primary{background:var(--action-bg);color:#fff}.btn-primary:hover{background:var(--action-hover);filter:none}.btn-secondary{background:var(--surface-3);border-color:#14b8a624;color:var(--tint-text)}.btn-ghost{border-color:var(--line);background:var(--surface);color:var(--explanatory)}.alert-error{padding:12px;background:#dc262612;border:1px solid rgba(220,38,38,.2);border-radius:9px;color:var(--error-text);font-size:12px;margin:16px 0 0}.result-panel{margin-top:17px;padding:23px}.result-heading{margin-bottom:10px}.btn-copy{min-width:44px;min-height:44px;padding:6px 8px;background:transparent;border:0;color:var(--brand);font-size:12px;font-weight:800}.code-output{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;padding:15px;background:var(--bg);border:1px solid var(--line);border-radius:10px;max-height:480px;min-height:100px;overflow:auto;color:var(--text);font:13px/1.7 JetBrains Mono,monospace}.output-empty{color:var(--muted)}.privacy-note{padding:15px;color:var(--muted);font-size:12px;display:flex;gap:10px;align-items:center}.privacy-note span{color:var(--brand);font-size:20px}.result-table{margin:0;display:grid;gap:0}.result-table div{display:flex;justify-content:space-between;gap:20px;padding:11px 0;border-bottom:1px solid var(--line);font-size:12px}.result-table div:last-child{border:0}.result-table dt{color:var(--muted)}.result-table dd{margin:0;font-family:JetBrains Mono,monospace;font-size:12px;font-weight:700;text-align:right}.side-card{padding:25px;margin-bottom:17px}.side-card h2{margin-top:10px}.side-card ol{margin:23px 0 0;padding:0;list-style:none;display:grid;gap:18px}.side-card li{display:flex;align-items:start;gap:12px}.side-card li span{width:25px;height:25px;border-radius:50%;background:var(--surface-3);color:var(--tint-text);display:grid;place-items:center;font-size:12px;font-weight:800;flex:none}.side-card li p{font-size:13px;color:var(--muted);line-height:1.65;margin:2px 0}.info-card{background:var(--surface-3);border-color:transparent;box-shadow:none}.side-card-emoji{font-size:25px;color:var(--brand)}.info-card h3{font-size:14px;margin:8px 0}.info-card p{font-size:13px;color:var(--explanatory);margin:0}.tool-guide-link{display:none}.segmented{display:inline-flex;gap:3px;border-radius:9px;padding:3px;background:var(--surface-2);margin:0 0 21px}.segmented button{min-width:44px;min-height:44px;background:transparent;border:0;padding:8px 15px;border-radius:7px;font-size:12px;font-weight:700;color:var(--explanatory)}.segmented button.selected{background:var(--surface);box-shadow:var(--shadow);color:var(--brand)}.documentation-section{border-top:1px solid var(--line);margin:55px 0 0;padding-top:42px}.doc-main{max-width:730px}.doc-main h2{font-size:24px;letter-spacing:-.7px;margin:9px 0 8px}.doc-main p{font-size:14px;color:var(--muted);line-height:1.9;margin:0}.related-section{margin-top:55px}.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.related-card{display:flex;align-items:center;gap:12px;padding:18px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.related-card .tool-icon{width:37px;height:37px;font-size:12px}.related-card>div{min-width:0;flex:1}.related-card h3{font-size:13px;line-height:1.3;margin:0 0 3px}.related-card p{font-size:12px;color:var(--muted);margin:0;line-height:1.4}.related-card .card-arrow{font-size:15px}.related-card:hover{border-color:var(--accent)}.info-page{padding-top:75px;padding-bottom:100px;max-width:850px}.info-page h1{font-size:38px;line-height:1.2;letter-spacing:-1.4px}.info-page p{font-size:15px;line-height:1.95;color:var(--muted)}@media(max-width:950px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-layout{grid-template-columns:minmax(0,1fr)}.tool-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}.side-card{margin-bottom:0}.related-grid{grid-template-columns:1fr 1fr}.footer-grid{flex-wrap:wrap}.tool-guide-link{display:inline-flex;align-items:center;gap:8px;min-width:44px;min-height:44px;font-size:13px;font-weight:700;color:var(--brand)}.tool-page>.tool-guide-link{margin:-16px 0 12px}.side-card .tool-guide-link{margin-top:12px}}@media(max-width:767px){.header-inner{gap:8px}.header-nav{display:none;position:absolute;top:100%;left:0;right:0;padding:10px 18px;flex-direction:column;align-items:stretch;gap:2px;background:var(--surface);border-bottom:1px solid var(--line);box-shadow:var(--shadow)}.header-nav.mobile-open{display:flex}.header-nav a{justify-content:flex-start;padding:0 12px}.mobile-nav-toggle{display:inline-flex;margin-left:auto;font-size:20px}}@media(max-width:650px){:root{--header-height:72px}.container{padding-left:18px;padding-right:18px}.brand{font-size:17px}.brand-mark{width:34px;height:34px}.header-actions{gap:6px}.header-control{width:44px;height:44px;padding:0;gap:4px}.theme-label{display:none}.hero-content{padding-top:63px;padding-bottom:58px}.hero h1{letter-spacing:-1.8px}.hero-description{font-size:13px}.hero-search{padding:10px 12px}.hero-search input,.field-input,.code-input{font-size:16px}.hero-meta{gap:13px}.catalog-section{padding-top:48px;padding-bottom:58px}.section-heading{display:block}.count-label{display:inline-block;margin-top:10px}.filter-bar{flex-wrap:nowrap;overflow-x:auto;margin:-6px -6px 21px;padding:6px 6px 15px;scrollbar-width:thin;scrollbar-color:var(--brand) var(--surface-2)}.filter-scroll-hint{display:block;margin:-12px 0 12px;font-size:12px;color:var(--muted)}.filter-pill{flex:none}.tool-grid,.related-grid{grid-template-columns:1fr}.tool-card{min-height:210px}.benefits-section{border-radius:0;margin-bottom:60px}.benefits-grid{grid-template-columns:1fr;gap:26px}.footer-grid{display:block}.footer-links{margin-top:12px;gap:4px 12px}.footer-bottom{display:block}.footer-bottom span{display:block;margin-bottom:6px}.tool-page{padding-top:22px}.tool-heading{align-items:flex-start;margin-top:28px}.tool-icon-lg{width:50px;height:50px;font-size:16px}.workspace-panel,.result-panel{padding:17px}.action-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.action-row>.btn-primary{grid-column:1/-1}.code-output{padding:10px;max-height:none;overflow:visible}.tool-side,.two-fields{grid-template-columns:1fr}.related-section{margin-top:40px}}@media(max-width:380px){.site-header .brand{font-size:16px;gap:7px}.site-header .brand-mark{width:32px;height:32px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
