/* Local system fonts keep the interface available without network dependencies. */
:root{color-scheme:light;--bg:#f7f8fa;--surface:#fff;--soft:#f2f5f7;--ink:#202e39;--muted:#697780;--line:#e3e8ec;--brand:#087e78;--brand-soft:#e7f4f1;--focus:#178f86;--red:#b43a48;--red-bg:#fceef0;--green:#23734b;--green-bg:#eaf7ef;--shadow:0 8px 30px #1d3b4c05}
:root[data-theme=dark]{color-scheme:dark;--bg:#12191d;--surface:#192228;--soft:#202c32;--ink:#e2e9ec;--muted:#9aaab3;--line:#2b3941;--brand:#72d0be;--brand-soft:#1e3b37;--focus:#72d0be;--red:#ff9ca6;--red-bg:#3c272e;--green:#8cddb0;--green-bg:#203b30;--shadow:none}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;font-size:14px;line-height:1.65}button,input,select,textarea{font:inherit}a{color:inherit;text-decoration:none}button,a,input,select,textarea,summary{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}button,select{white-space:nowrap}a,button,input,textarea,select{outline-offset:4px} :focus-visible{outline:2px solid var(--focus)}::selection{background:#a3dfcc;color:#183a31}button,input,select,textarea{color:var(--ink)}button{border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:8px 14px;transition:background .15s,transform .15s}button:hover{background:var(--soft)}button.primary{background:var(--brand);border-color:var(--brand);color:var(--surface);font-weight:600}button.primary:hover{filter:brightness(.94)}:root[data-theme=dark] button.primary{color:#152724}.button-link{display:inline-flex;padding:9px 16px;border:1px solid var(--line);border-radius:7px;background:var(--surface)}.muted,.caption{color:var(--muted)}.caption{font-size:12px}.mono,code,kbd,textarea{font-family:"Cascadia Code",Consolas,"SFMono-Regular",monospace}code{font-size:.94em;background:var(--soft);border-radius:4px;padding:2px 5px}h1,h2,h3,p{margin-top:0}h1{font-size:32px;line-height:1.35;letter-spacing:-.8px;font-weight:700}h2{font-size:18px;letter-spacing:-.3px}h3{font-size:15px}p{margin-bottom:16px}.skip{position:fixed;top:-80px;left:20px;z-index:100;background:var(--surface);padding:10px}.skip:focus{top:10px}.header{height:70px;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 32px;position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:11px;font-size:18px;font-weight:750;letter-spacing:.3px}.brand-mark{height:32px;width:32px;border-radius:9px;background:var(--brand);color:var(--surface);display:grid;place-items:center;font-family:Consolas,monospace;font-size:18px;letter-spacing:-3px;padding-right:3px}:root[data-theme=dark] .brand-mark{color:#152724}.brand small{font-size:10px;letter-spacing:1.7px;color:var(--muted);font-weight:500;display:block;line-height:1}.header-right{display:flex;align-items:center;gap:24px}.header-right>a{color:var(--muted);font-size:13px}.theme-button{padding:6px 10px;border:0;background:var(--soft);min-width:36px;font-size:17px}.menu-button{display:none}.shell{display:grid;grid-template-columns:224px minmax(0,1fr);min-height:calc(100vh - 70px)}.sidebar{border-right:1px solid var(--line);padding:30px 20px;position:sticky;top:70px;height:calc(100vh - 70px);background:var(--surface);display:flex;flex-direction:column;gap:30px;overflow:auto}.nav-label{color:var(--muted);font-size:11px;letter-spacing:1.2px;padding:0 12px;margin-bottom:10px}.nav-link{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:7px;margin:3px 0;color:var(--muted);font-size:13px}.nav-link:hover,.nav-link.active{color:var(--brand);background:var(--brand-soft)}.nav-link.active{font-weight:600}.nav-link .nav-symbol{font-family:Consolas,monospace;font-size:16px;width:18px;text-align:center}.nav-count{margin-left:auto;font-size:11px}.side-note{margin-top:auto;border-top:1px solid var(--line);padding:20px 12px 0;font-size:12px;color:var(--muted)}.status-dot{display:inline-block;width:6px;height:6px;background:#3aa489;border-radius:50%;margin-right:6px}.side-note strong{display:block;font-weight:500;color:var(--ink);margin-bottom:4px}.main{min-width:0;max-width:1500px;width:100%;padding:36px 46px 0;margin:0 auto}.eyebrow{color:var(--brand);font-size:11px;letter-spacing:1.8px;font-weight:600;margin-bottom:14px}.hero{padding:9px 0 25px;position:relative}.hero h1{font-size:35px;margin-bottom:12px}.hero p{color:var(--muted);font-size:14px}.hero-top{display:flex;justify-content:space-between;gap:24px;align-items:center}.hero-stamp{font-family:Consolas,monospace;border:1px solid var(--line);padding:17px 22px;border-radius:10px;transform:rotate(4deg);color:var(--brand);background:var(--surface);font-size:24px;box-shadow:var(--shadow);text-align:center;line-height:1.3}.hero-stamp small{display:block;font-family:inherit;font-size:9px;letter-spacing:1.4px;margin-top:6px;color:var(--muted)}.search-wrap{margin-top:18px;display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid #cfdcde;border-radius:9px;padding:2px 17px;box-shadow:0 3px 8px #283c4c03}.search-wrap:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}.search-wrap svg{width:20px;height:20px;color:var(--muted)}.search-wrap input{border:0;background:transparent;outline:0;width:100%;padding:15px 0;min-width:0}.search-wrap kbd{border:1px solid var(--line);border-radius:4px;padding:0 7px;color:var(--muted);font-size:12px}.search-hints{display:flex;gap:14px;margin-top:10px;color:var(--muted);font-size:11px}.search-hints button{border:0;padding:0;background:none;font-size:11px;color:var(--muted)}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:28px 0 15px}.section-heading h2{margin:0;font-size:16px}.section-heading h2 span{font-size:11px;color:var(--muted);font-weight:400;margin-left:10px}.section-heading .caption{font-size:11px}.featured-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.featured{position:relative;padding:21px;border:1px solid var(--line);background:var(--surface);border-radius:10px;overflow:hidden;transition:border .2s,transform .2s}.featured:first-child{background:var(--brand-soft);border-color:transparent}.featured:hover{transform:translateY(-3px);border-color:var(--brand)}.featured-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:21px}.tool-icon{display:grid;place-items:center;height:38px;width:38px;border-radius:9px;font:600 16px Consolas,monospace;background:var(--soft);color:var(--brand)}.featured:first-child .tool-icon{background:var(--surface)}.small-tag{font-size:10px;color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:1px 6px}.featured h3{font-size:15px;margin-bottom:5px}.featured p{font-size:12px;color:var(--muted);margin-bottom:17px}.featured-code{border-top:1px solid var(--line);padding-top:12px;font-size:10px;font-family:Consolas,monospace;color:var(--muted)}.featured .arrow{position:absolute;right:20px;bottom:17px;color:var(--brand)}.filters{display:flex;flex-wrap:wrap;gap:8px;margin:30px 0 6px;border-bottom:1px solid var(--line);padding-bottom:16px}.filter{font-size:12px;padding:6px 13px;border:1px solid transparent;background:transparent;color:var(--muted)}.filter.active{background:var(--brand);color:var(--surface)}:root[data-theme=dark] .filter.active{color:#152724}.category{margin-bottom:27px}.category-head{display:flex;align-items:center;gap:10px;margin:20px 0 13px}.category-head h2{margin:0;font-size:15px}.category-head span{font-size:11px;color:var(--muted)}.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.tool-card{display:flex;position:relative;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:18px;gap:13px;transition:border .15s,box-shadow .15s}.tool-card:hover{border-color:#9bbdb7;box-shadow:var(--shadow)}.tool-card>a{display:flex;gap:13px;min-width:0;flex:1}.tool-card .tool-icon{width:34px;height:34px;font-size:13px;flex-shrink:0}.tool-card h3{font-size:13px;line-height:1.4;margin:2px 18px 7px 0}.tool-card p{font-size:11px;color:var(--muted);margin:0;line-height:1.7}.favorite{position:absolute;right:9px;top:8px;background:transparent;border:0;padding:2px 4px;font-size:17px;color:var(--muted);line-height:1.2}.favorite[aria-pressed=true]{color:var(--brand)}.empty-state{padding:40px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:9px}.note-strip{display:flex;gap:30px;align-items:center;border-top:1px solid var(--line);padding:27px 0;margin-top:35px}.note-strip h3{font-size:13px;margin:0 0 3px}.note-strip p{margin:0;font-size:12px;color:var(--muted)}.note-strip>div{flex:1}.footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--muted);font-size:11px;border-top:1px solid var(--line);padding:24px 0;margin-top:32px}.footer nav{display:flex;gap:18px}.footer a:hover{color:var(--brand)}.breadcrumb{font-size:12px;color:var(--muted);margin:0 0 23px}.breadcrumb a:hover{color:var(--brand)}.tool-heading{display:flex;gap:18px;align-items:flex-start;margin-bottom:25px}.tool-heading .tool-icon{width:48px;height:48px;font-size:21px;margin-top:2px}.tool-heading h1{font-size:28px;margin:0 0 7px}.tool-heading p{color:var(--muted);margin:0;font-size:13px}.local-badge{margin-left:auto;white-space:nowrap;border:1px solid var(--line);border-radius:20px;padding:5px 11px;font-size:11px;color:var(--muted)}.workbench{background:var(--surface);border:1px solid var(--line);border-radius:11px;box-shadow:var(--shadow);overflow:hidden}.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:16px 20px;border-bottom:1px solid var(--line);background:var(--surface)}.toolbar label{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}.toolbar .spacer{flex:1}.toolbar button{font-size:12px;padding:7px 12px}.workbody{padding:22px}.two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.field{display:flex;flex-direction:column;gap:8px;margin:0 0 18px;min-width:0}.field>label,.field-label{font-size:12px;font-weight:600;display:flex;justify-content:space-between}.field>label span{font-size:11px;color:var(--muted);font-weight:400}.field input,.field select,.field textarea,select,input[type=text],input[type=number],input[type=datetime-local]{border:1px solid var(--line);border-radius:6px;background:var(--surface);padding:10px 12px;min-width:0;width:100%}select{width:auto;padding:7px 28px 7px 10px;max-width:100%}textarea{resize:vertical;min-height:240px;line-height:1.65;font-size:12px;tab-size:2}textarea[readonly]{background:var(--soft);color:var(--ink)}textarea.short{min-height:140px}.field input[type=file]{font-size:12px;padding:13px;border-style:dashed;background:var(--soft)}input[type=checkbox]{accent-color:var(--brand);width:15px;height:15px}input[type=range]{accent-color:var(--brand);width:100%}.checks{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:20px}.checks label{display:flex;align-items:center;gap:6px;font-size:13px}.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:5px 0 18px}.actions button{font-size:12px}.message{padding:11px 20px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;min-height:44px;background:var(--soft);overflow-wrap:anywhere}.message[data-state=success]{color:var(--green);background:var(--green-bg)}.message[data-state=error]{color:var(--red);background:var(--red-bg)}.inline-note{font-size:12px;color:var(--muted);margin:8px 0 16px}.help-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:35px;margin-top:35px}.help h2{font-size:15px}.help p,.help li{font-size:12px;line-height:1.95;color:var(--muted)}.help ol{padding-left:18px}.help details{border-bottom:1px solid var(--line);padding:11px 0}.help summary{font-size:12px;cursor:pointer;font-weight:500}.help details p{margin:10px 0 0}.related{margin-top:35px}.related h2{font-size:15px}.result-box{border:1px solid var(--line);background:var(--soft);border-radius:7px;padding:16px;white-space:pre-wrap;overflow-wrap:anywhere;font-family:Consolas,monospace;font-size:13px;min-height:70px}.result-list{margin:0;padding-left:25px;font-family:Consolas,monospace;font-size:13px}.result-list li{padding:6px;border-bottom:1px solid var(--line)}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.stat{padding:15px;border:1px solid var(--line);border-radius:7px;background:var(--soft)}.stat strong{font-size:23px;display:block;line-height:1.4;font-weight:600;font-family:Consolas,monospace}.stat span{font-size:11px;color:var(--muted)}.diff-result{font-family:Consolas,monospace;font-size:12px;overflow:auto;max-height:520px;border:1px solid var(--line);border-radius:6px}.diff-line{display:grid;grid-template-columns:38px 38px 22px minmax(0,1fr);min-height:25px;line-height:25px;white-space:pre-wrap;overflow-wrap:anywhere}.diff-line>span{padding:0 5px}.diff-line>span:nth-child(-n+2){color:var(--muted);text-align:right;border-right:1px solid var(--line);font-size:10px;user-select:none}.diff-line.add{background:var(--green-bg);color:var(--green)}.diff-line.remove{background:var(--red-bg);color:var(--red)}.swatch{height:180px;border-radius:8px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;background:var(--soft)}input[type=color]{border:0;width:66px;height:48px;background:none;cursor:pointer;padding:0}.preview-area{display:flex;align-items:center;justify-content:center;min-height:280px;border:1px dashed var(--line);border-radius:8px;background:var(--soft);padding:22px;overflow:hidden}.preview-area canvas,.preview-area img{max-width:100%;height:auto;max-height:400px;object-fit:contain}.preview-area canvas{image-rendering:pixelated}.preview-area p{text-align:center;font-size:12px;color:var(--muted);margin:0}.prose{max-width:800px;margin:10px 0 70px}.prose h1{margin-bottom:18px}.prose h2{margin:32px 0 12px;font-size:18px}.prose p,.prose li{color:var(--muted);line-height:1.95;font-size:14px}.prose .lead{font-size:17px;color:var(--ink);max-width:670px}.info-card{padding:24px;border:1px solid var(--line);border-radius:10px;background:var(--surface);margin:23px 0}.info-card h3{margin-bottom:7px}.info-card p:last-child{margin:0}.big404{font:700 100px Consolas,monospace;color:var(--brand);letter-spacing:-8px;margin:30px 0 15px}.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);padding:10px 20px;background:var(--ink);color:var(--surface);border-radius:8px;font-size:12px;z-index:100;max-width:90vw}.hidden,[hidden]{display:none!important}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px}th,td{text-align:left;padding:10px;border-bottom:1px solid var(--line);vertical-align:top}th{color:var(--muted);font-weight:500}td{overflow-wrap:anywhere}mark{background:#f3dfa2;color:#3f3314}.full-width{grid-column:1/-1}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1550px){.main{padding:45px 65px 0}.tool-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1160px){.main{padding:30px 27px 0}.shell{grid-template-columns:196px minmax(0,1fr)}.sidebar{padding:25px 13px}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.featured{padding:16px}.featured-code{font-size:9px}.hero h1{font-size:31px}.local-badge{display:none}}
@media(max-width:840px){.header{padding:0 20px;height:64px}.shell{display:block}.sidebar{display:none;position:fixed;z-index:30;top:64px;left:0;width:235px;height:calc(100vh - 64px);box-shadow:30px 0 80px #0002}.sidebar.open{display:flex}.menu-button{display:block;padding:5px 9px;font-size:17px}.header-right{gap:12px}.header-right>a{display:none}.main{padding:25px 22px 0}.hero-stamp{display:none}.hero h1{font-size:30px}.featured-grid{gap:10px}.featured h3{font-size:13px}.featured p{font-size:11px}.featured-code{display:none}.featured-top{margin-bottom:15px}.featured .arrow{bottom:13px}.featured p{margin-bottom:12px}.breadcrumb{margin-bottom:18px}.footer{padding-bottom:28px}}
@media(max-width:580px){.main{padding:23px 16px 0}.header{padding:0 16px}.brand{font-size:16px}.brand small{font-size:9px}.header-right{gap:6px}.hero{padding:7px 0 15px}.hero h1{font-size:28px}.hero p{font-size:12px;max-width:280px}.hero .eyebrow{font-size:10px}.search-wrap input{font-size:12px}.search-wrap kbd{display:none}.search-hints{gap:12px;font-size:10px}.featured-grid{grid-template-columns:1fr}.featured{display:grid;grid-template-columns:40px 1fr;gap:0 13px;padding:16px}.featured-top{grid-row:1/3;margin:0}.featured .small-tag{display:none}.featured h3{margin:0 0 4px;font-size:14px}.featured p{margin:0;padding-right:15px}.featured .arrow{bottom:23px}.featured-code{display:none}.tool-grid{grid-template-columns:1fr}.tool-card{padding:16px}.tool-card h3{font-size:14px}.tool-card p{font-size:12px}.tool-card .tool-icon{width:38px;height:38px}.filters{gap:3px;margin-top:25px}.filter{padding:6px 9px;font-size:11px}.section-heading .caption{display:none}.category{margin-bottom:22px}.note-strip{display:block}.note-strip>div+div{margin-top:16px}.footer{font-size:10px;gap:12px}.footer nav{gap:16px}.tool-heading{gap:12px;margin-bottom:20px}.tool-heading .tool-icon{height:40px;width:40px;font-size:18px}.tool-heading h1{font-size:23px}.tool-heading p{font-size:12px}.toolbar{padding:13px;gap:8px}.toolbar .spacer{display:none}.workbody{padding:15px}.two-col{grid-template-columns:1fr;gap:0}textarea{min-height:200px}.help-grid{grid-template-columns:1fr;gap:20px}.actions{gap:7px}.actions button{padding:8px 11px}.stat-grid{gap:7px}.stat{padding:12px}.stat strong{font-size:20px}.prose .lead{font-size:16px}.prose h1{font-size:27px}.message{padding:12px 15px}.preview-area{min-height:220px}.tool-heading h1{letter-spacing:-.5px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
