:root{--color-bg:#fff;--color-surface:#f9fafb;--color-surface-strong:#f3f4f6;--color-border:#e5e7eb;--color-border-strong:#d1d5db;--color-border-control:#8f949b;--color-text:#1f2937;--color-text-strong:#111827;--color-text-muted:#4b5563;--color-primary:#3b82f6;--color-primary-strong:#2563eb;--color-primary-soft:#eff6ff;--color-secondary:#10b981;--color-success:#047857;--color-success-soft:#ecfdf5;--color-error:#dc2626;--color-error-soft:#fef2f2;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:clamp(1.375rem, 1.2rem + .75vw, 1.625rem);--text-3xl:clamp(1.75rem, 1.35rem + 1.6vw, 2.25rem);--leading-tight:1.2;--leading-snug:1.35;--leading-normal:1.6;--tracking-tight:-.015em;--tracking-wide:.06em;--spacing-2xs:.25rem;--spacing-xs:.5rem;--spacing-sm:1rem;--spacing-md:1.5rem;--spacing-lg:2rem;--spacing-xl:3rem;--spacing-2xl:4rem;--spacing-3xl:6rem;--radius-sm:4px;--radius-md:8px;--shadow-sm:0 1px 2px #1118270f;--container-max:960px;--container-prose:68ch;--grid-card-min:17rem;--header-height:3.5rem;--font-sans:system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--ease-out:cubic-bezier(.22, 1, .36, 1);--duration-fast:.12s;--duration-base:.18s}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::selection{background:var(--color-primary-soft);color:var(--color-text-strong)}:target{scroll-margin-top:calc(var(--header-height) + var(--spacing-sm))}:focus-visible{outline:2px solid var(--color-primary-strong);outline-offset:2px}.site-header{z-index:20;border-bottom:1px solid var(--color-border);background:color-mix(in srgb, var(--color-bg) 88%, transparent);backdrop-filter:blur(8px);position:sticky;top:0}.site-header nav{align-items:center;gap:var(--spacing-md);min-height:var(--header-height);max-width:var(--container-max);padding-inline:var(--spacing-sm);flex-wrap:wrap;margin-inline:auto;display:flex}.site-brand{font-size:var(--text-base);letter-spacing:var(--tracking-tight);color:var(--color-text-strong);margin-right:auto;font-weight:700;text-decoration:none}.site-header nav a:not(.site-brand){padding-block:var(--spacing-xs);font-size:var(--text-sm);color:var(--color-text-muted);transition:color var(--duration-fast) var(--ease-out);font-weight:500;text-decoration:none}.site-header nav a:not(.site-brand):hover{color:var(--color-text-strong)}.wrap{max-width:var(--container-max);padding:var(--spacing-xl) var(--spacing-sm) var(--spacing-3xl);margin-inline:auto}.site-footer{border-top:1px solid var(--color-border);padding-block:var(--spacing-lg);font-size:var(--text-sm);color:var(--color-text-muted)}.site-footer nav{gap:var(--spacing-md);max-width:var(--container-max);padding-inline:var(--spacing-sm);flex-wrap:wrap;margin-inline:auto;display:flex}.site-footer nav a{color:var(--color-text-muted);transition:color var(--duration-fast) var(--ease-out);text-decoration:none}.site-footer nav a:hover{color:var(--color-text-strong);text-underline-offset:3px;text-decoration:underline}.site-footer p{max-width:var(--container-max);margin:var(--spacing-sm) auto 0;padding-inline:var(--spacing-sm)}.skip-link{position:absolute;left:-9999px}.skip-link:focus,.skip-link:focus-visible{left:var(--spacing-sm);top:var(--spacing-sm);z-index:100;padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-bg);color:var(--color-text-strong)}.noscript-banner{padding:var(--spacing-xs) var(--spacing-sm);border-bottom:1px solid var(--color-border);background:var(--color-surface-strong);text-align:center;font-size:var(--text-sm)}main.wrap>h1{max-width:var(--container-prose);margin:0 0 var(--spacing-xs);font-size:var(--text-3xl);font-weight:700;line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--color-text-strong)}main.wrap>h1+p,main.wrap>.lede{max-width:var(--container-prose);margin-bottom:var(--spacing-lg);font-size:var(--text-lg);line-height:var(--leading-normal);color:var(--color-text-muted)}main.wrap>section{margin-top:var(--spacing-xl)}.tool-grid{grid-template-columns:repeat(auto-fill, minmax(var(--grid-card-min), 1fr));gap:var(--spacing-sm);margin:var(--spacing-md) 0 0;max-width:none;padding:0;list-style:none;display:grid}.tool-grid>li{padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-base) var(--ease-out);margin:0}.tool-grid>li:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-sm)}.tool-grid>li>h3{margin:0 0 var(--spacing-xs);font-size:var(--text-base);font-weight:600;line-height:var(--leading-snug)}.tool-grid>li>h3>a{color:var(--color-text-strong);transition:color var(--duration-fast) var(--ease-out);text-decoration:none}.tool-grid>li:hover>h3>a,.tool-grid>li>h3>a:hover{color:var(--color-primary-strong)}.tool-grid>li>p{max-width:none;font-size:var(--text-sm);line-height:var(--leading-normal);color:var(--color-text-muted);margin:0}:where(main.wrap) :where(h2){max-width:var(--container-prose);margin:var(--spacing-xl) 0 var(--spacing-sm);font-size:var(--text-2xl);font-weight:600;line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--color-text-strong)}:where(main.wrap) :where(h3){max-width:var(--container-prose);margin:var(--spacing-lg) 0 var(--spacing-xs);font-size:var(--text-xl);font-weight:600;line-height:var(--leading-snug);color:var(--color-text-strong)}:where(main.wrap) :where(h4){max-width:var(--container-prose);margin:var(--spacing-md) 0 var(--spacing-2xs);font-size:var(--text-base);font-weight:600;line-height:var(--leading-snug);color:var(--color-text-strong)}:where(main.wrap) :where(p){max-width:var(--container-prose);margin:0 0 var(--spacing-sm);font-size:var(--text-base);line-height:var(--leading-normal)}:where(main.wrap) :where(ul,ol){max-width:var(--container-prose);margin:0 0 var(--spacing-sm);padding-left:1.25rem}:where(main.wrap) :where(li){margin-bottom:var(--spacing-2xs)}:where(main.wrap) :where(li)::marker{color:var(--color-text-muted)}:where(main.wrap) :where(li)>:where(ul,ol){margin-top:var(--spacing-2xs);margin-bottom:0}:where(main.wrap) :where(blockquote){max-width:var(--container-prose);margin:var(--spacing-md) 0;padding:var(--spacing-xs) 0 var(--spacing-xs) var(--spacing-md);border-left:2px solid var(--color-border-strong);color:var(--color-text-muted)}:where(main.wrap) :where(p,li,dd,td,blockquote) a{color:var(--color-primary-strong);text-underline-offset:2px;text-decoration:underline 1px;text-decoration-color:color-mix(in srgb, currentColor 35%, transparent);transition:text-decoration-color var(--duration-fast) var(--ease-out)}:where(main.wrap) :where(p,li,dd,td,blockquote) a:hover{text-decoration-color:currentColor}:where(main.wrap) :where(table){width:100%;margin:var(--spacing-md) 0;border-collapse:collapse;font-size:var(--text-sm);line-height:var(--leading-snug)}:where(main.wrap) :where(th){padding:var(--spacing-xs) var(--spacing-sm);border-bottom:1px solid var(--color-border-strong);text-align:left;color:var(--color-text-strong);font-weight:600}:where(main.wrap) :where(td){padding:var(--spacing-xs) var(--spacing-sm);border-bottom:1px solid var(--color-border);vertical-align:top;overflow-wrap:anywhere}:where(main.wrap) :where(tbody) tr:last-child :where(td){border-bottom:0}:where(main.wrap) :where(pre){max-width:100%;margin:var(--spacing-md) 0;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-strong);font-family:var(--font-mono);font-size:var(--text-sm);tab-size:2;line-height:1.55;overflow-x:auto}:where(main.wrap) :where(code){border-radius:var(--radius-sm);background:var(--color-surface-strong);font-family:var(--font-mono);padding:.15em .4em;font-size:.9em}:where(main.wrap) :where(pre) :where(code){font-size:inherit;background:0 0;border:0;padding:0}main.wrap>nav[aria-label=Breadcrumb]{align-items:center;gap:var(--spacing-2xs);margin-bottom:var(--spacing-sm);font-size:var(--text-sm);color:var(--color-text-muted);flex-wrap:wrap;display:flex}main.wrap>nav[aria-label=Breadcrumb] a{color:var(--color-text-muted);transition:color var(--duration-fast) var(--ease-out);text-decoration:none}main.wrap>nav[aria-label=Breadcrumb] a:hover{color:var(--color-text-strong);text-underline-offset:2px;text-decoration:underline}main.wrap>nav[aria-label=Breadcrumb]>span{color:var(--color-text-strong);font-weight:500}.tool-container{margin:var(--spacing-md) 0}.example{margin:var(--spacing-md) 0;padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.example h3{margin:0 0 var(--spacing-2xs);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-text-muted);font-weight:700}.example pre{margin:0 0 var(--spacing-md);padding:var(--spacing-sm);border-radius:var(--radius-sm);background:var(--color-surface-strong);font-size:var(--text-sm);border:0}.example h3+pre{margin-top:0}.example pre:last-child,.example>:last-child{margin-bottom:0}.example p{margin:var(--spacing-sm) 0 0;font-size:var(--text-sm);color:var(--color-text-muted)}.faq{margin:var(--spacing-md) 0 0}.faq dt{padding-top:var(--spacing-md);border-top:1px solid var(--color-border);font-size:var(--text-base);font-weight:600;line-height:var(--leading-snug);color:var(--color-text-strong)}.faq dt:first-of-type{border-top:0;padding-top:0}.faq dd{max-width:var(--container-prose);margin:var(--spacing-2xs) 0 0;line-height:var(--leading-normal);color:var(--color-text-muted)}.tool-button{min-height:44px;padding:0 var(--spacing-sm);border:1px solid var(--color-border-control);border-radius:var(--radius-sm);background:var(--color-bg);color:var(--color-text-strong);font-family:inherit;font-size:var(--text-sm);cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out);font-weight:600}.tool-button:hover{border-color:var(--color-primary-strong);background:var(--color-primary-soft)}.tool-button--primary{border-color:var(--color-text-strong);background:var(--color-text-strong);color:var(--color-bg)}.tool-button--primary:hover{border-color:var(--color-text);background:var(--color-text)}.tool-button[data-copied=true]{border-color:var(--color-success);background:var(--color-success-soft);color:var(--color-success)}.tool-button:disabled{opacity:.5;cursor:not-allowed}.tool-error{border-color:var(--color-error);background:var(--color-error-soft);color:var(--color-text-strong);font-weight:600}.alert{margin:var(--spacing-sm) 0;padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-error);border-radius:var(--radius-sm);background:var(--color-error-soft);color:var(--color-text-strong);font-weight:600}.tool-missing{margin:var(--spacing-sm) 0;color:var(--color-text-muted);font-style:italic}.tool-meta{margin-top:var(--spacing-xl);padding-top:var(--spacing-sm);border-top:1px solid var(--color-border);font-size:var(--text-sm);color:var(--color-text-muted)}.tool-meta p{margin:0}.tool-container :where(p,ul,ol,table,pre){max-width:none;margin:0}.tool-panel{gap:var(--spacing-md);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;display:grid}.tool-pane{gap:var(--spacing-sm);min-width:0;padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);box-shadow:var(--shadow-sm);flex-direction:column;display:flex}.tool-input{width:100%;min-height:200px;padding:var(--spacing-sm);border:1px solid var(--color-border-control);border-radius:var(--radius-sm);background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);resize:vertical}.tool-options{gap:var(--spacing-sm);grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));display:grid}.tool-option{align-items:center;gap:var(--spacing-xs);min-height:44px;font-size:var(--text-sm);font-weight:600;display:flex}.tool-option select,.tool-option input[type=number]{min-width:0;min-height:44px;padding:0 var(--spacing-xs);border:1px solid var(--color-border-control);border-radius:var(--radius-sm);background:var(--color-bg);color:var(--color-text);font-family:inherit;font-size:var(--text-base);flex:1}.tool-option input[type=checkbox]{width:1.25rem;height:1.25rem}.tool-actions{gap:var(--spacing-xs);flex-wrap:wrap;display:flex}.tool-output-header{justify-content:space-between;align-items:center;gap:var(--spacing-sm);display:flex}.tool-output-label{font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-text-muted);font-weight:700}.tool-loading{color:var(--color-text-muted);font-style:italic}.tool-text{padding:var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-strong);max-height:380px;font-family:var(--font-mono);font-size:var(--text-sm);white-space:pre-wrap;overflow-wrap:anywhere;margin:0;overflow:auto}.tool-metrics{gap:var(--spacing-sm);grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));margin:0;display:grid}.tool-metric{padding:var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-strong)}.tool-metric dt{font-size:var(--text-xs);color:var(--color-text-muted);font-weight:600}.tool-metric dd{font-family:var(--font-mono);font-size:1.75rem;font-weight:700;line-height:var(--leading-tight);margin:0}@media (width<=900px){.wrap{padding-top:var(--spacing-lg)}main.wrap>section{margin-top:var(--spacing-lg)}.tool-panel{grid-template-columns:minmax(0,1fr)}}@media (width<=600px){.wrap{padding:var(--spacing-lg) var(--spacing-sm) var(--spacing-2xl)}.site-header nav,.site-footer nav{gap:var(--spacing-sm)}.site-footer{padding-block:var(--spacing-md)}.tool-grid{grid-template-columns:1fr}.example{padding:var(--spacing-sm)}.tool-actions .tool-button{flex:100%}.tool-metrics{grid-template-columns:repeat(auto-fit,minmax(7rem,1fr))}:where(main.wrap) :where(pre){padding:var(--spacing-sm)}}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}