.tool-page{width:min(100%,1160px);padding:clamp(1.25rem, 4vw, 3.5rem) var(--spacing-6) var(--spacing-20);margin-inline:auto}.tool-breadcrumbs{align-items:center;gap:var(--spacing-2);color:var(--color-muted);font-size:var(--font-size-sm);margin-bottom:clamp(2rem,5vw,4.5rem);display:flex}.tool-breadcrumbs a{color:inherit;text-decoration:none}.tool-breadcrumbs a:hover{color:var(--color-text)}.tool-hero{gap:var(--spacing-10);margin-bottom:var(--spacing-10);padding-bottom:var(--spacing-8);border-bottom:1px solid var(--color-border);grid-template-columns:minmax(0,2.2fr) minmax(260px,1fr);align-items:end;display:grid}.tool-kicker{font-family:var(--font-mono);font-size:var(--font-size-xs);letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--color-muted);grid-column:1/-1;margin:0;font-weight:600}.tool-hero h1{letter-spacing:-.055em;text-wrap:balance;margin:0;font-size:clamp(2.4rem,7vw,5.6rem);line-height:.98}.tool-hero>p:last-child{color:var(--color-text-secondary);font-size:var(--font-size-lg);margin:0;line-height:1.75}.tool-workspace{border:1px solid var(--color-border);border-radius:calc(var(--radius-lg) * 2);background:var(--color-bg);min-width:0;padding:clamp(1.25rem,3.5vw,3rem);position:relative;box-shadow:0 20px 70px var(--lightningcss-light,#12121214)var(--lightningcss-dark,#00000059)}.tool-workspace:before{content:"LOCAL / PRIVATE";background:var(--color-brand);color:var(--color-on-brand);font-family:var(--font-mono);letter-spacing:.08em;padding:.38rem .7rem;font-size:.625rem;font-weight:700;position:absolute;top:0;right:clamp(1.25rem,3.5vw,3rem)}.tool-guide{max-width:var(--content-width);margin:var(--spacing-16) auto 0;color:var(--color-text-secondary);line-height:1.85}.tool-guide h2,.tool-guide h3{color:var(--color-text);letter-spacing:var(--tracking-snug)}.tool-guide h2{margin:var(--spacing-12) 0 var(--spacing-4);font-size:var(--font-size-2xl)}.tool-guide h3{margin:var(--spacing-8) 0 var(--spacing-3);font-size:var(--font-size-lg)}.tool-guide p,.tool-guide ul,.tool-guide ol{margin:0 0 var(--spacing-5)}.tool-guide code{border-radius:var(--radius);background:var(--color-surface);font-family:var(--font-mono);padding:.15em .4em;font-size:.9em}.related-tools{margin-top:var(--spacing-20);padding-top:var(--spacing-8);border-top:1px solid var(--color-border)}.related-tools-heading{justify-content:space-between;align-items:end;gap:var(--spacing-4);margin-bottom:var(--spacing-6);display:flex}.related-tools-heading .tool-kicker{grid-column:auto}.related-tools h2{font-size:var(--font-size-2xl);margin:0}.related-tools-grid{border-top:1px solid var(--color-border);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.related-tools-grid a{gap:var(--spacing-3);min-width:0;padding:var(--spacing-5) var(--spacing-4);border-bottom:1px solid var(--color-border);color:inherit;grid-template-columns:auto 1fr auto;text-decoration:none;transition:background-color .16s,transform .16s;display:grid}.related-tools-grid a+a{border-left:1px solid var(--color-border)}.related-tools-grid a:hover{background:var(--color-surface);transform:translateY(-2px)}.related-tools-number,.related-tools-grid a>span:nth-child(2){font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--color-muted)}.related-tools-grid strong{min-width:0;font-size:var(--font-size-base);grid-column:2}.related-tools-grid small{font-size:var(--font-size-lg);grid-area:1/3/3;align-self:center}.tool-form,.tool-stack{gap:var(--spacing-5);flex-direction:column;display:flex}.tool-grid{gap:var(--spacing-5);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.tool-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}.tool-field{gap:var(--spacing-2);flex-direction:column;min-width:0;display:flex}.tool-label,.tool-field>label,.tool-field>span:first-child{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:600}.tool-input,.tool-textarea,.tool-select,.tool-workspace input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),.tool-workspace textarea,.tool-workspace select{border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg);width:100%;min-height:44px;color:var(--color-text);font:inherit;padding:.75rem .9rem;transition:border-color .15s,box-shadow .15s}.tool-textarea,.tool-workspace textarea{resize:vertical;min-height:9rem;font-family:var(--font-mono);font-size:var(--font-size-sm);line-height:1.65}.tool-input:focus-visible,.tool-textarea:focus-visible,.tool-select:focus-visible,.tool-workspace input:focus-visible,.tool-workspace textarea:focus-visible,.tool-workspace select:focus-visible,.tool-workspace button:focus-visible{outline:3px solid var(--color-brand-ring);outline-offset:2px}.tool-actions{gap:var(--spacing-3);flex-wrap:wrap;display:flex}.tool-button,.tool-workspace button{border:1px solid var(--color-text);border-radius:var(--radius-lg);background:var(--color-text);min-height:44px;color:var(--color-bg);font:inherit;cursor:pointer;justify-content:center;align-items:center;padding:.7rem 1.1rem;font-weight:650;transition:transform .15s,opacity .15s,background-color .15s;display:inline-flex}.tool-button:hover,.tool-workspace button:hover{transform:translateY(-1px)}.tool-button:disabled,.tool-workspace button:disabled{opacity:.45;cursor:not-allowed;transform:none}.tool-button--secondary,.tool-workspace button[data-variant=secondary]{color:var(--color-text);background:0 0}.tool-tabs{gap:var(--spacing-2);padding-bottom:var(--spacing-3);border-bottom:1px solid var(--color-border);flex-wrap:wrap;display:flex}.tool-result{min-width:0;padding:var(--spacing-5);border-radius:var(--radius-lg);background:var(--color-surface)}.tool-output{overflow-wrap:anywhere;white-space:pre-wrap;font-family:var(--font-mono)}.tool-message{padding:var(--spacing-3) var(--spacing-4);border-left:3px solid var(--color-brand);background:var(--color-surface);color:var(--color-text-secondary)}.tool-message--error{color:var(--lightningcss-light,#9f1239)var(--lightningcss-dark,#fda4af);border-left-color:currentColor}.tool-overflow{overscroll-behavior-inline:contain;max-width:100%;overflow-x:auto}.tool-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.tool-table th,.tool-table td{border-bottom:1px solid var(--color-border);text-align:left;white-space:nowrap;padding:.7rem .8rem}.tool-canvas,.tool-workspace canvas,.tool-workspace svg,.tool-workspace img{max-width:100%;height:auto;display:block}.tool-workspace>div>h2,.tool-workspace>div>h2+p{display:none}.tool-workspace [class*=u-stack-]>*+*{margin-top:var(--spacing-4)}.tool-workspace [class~=flex]{display:flex}.tool-workspace [class~=grid]{gap:var(--spacing-4);display:grid}.tool-workspace [class*=u-cols-2],.tool-workspace [class*=md\:grid-cols-2]{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-workspace [class~=flex-col]{flex-direction:column}.tool-workspace [class~=flex-wrap]{flex-wrap:wrap}.tool-workspace [class~=items-center]{align-items:center}.tool-workspace [class~=items-end]{align-items:flex-end}.tool-workspace [class~=justify-between]{justify-content:space-between}.tool-workspace [class~=justify-center]{justify-content:center}.tool-workspace [class*=gap-]{gap:var(--spacing-3)}.tool-workspace [class*=mt-]{margin-top:var(--spacing-4)}.tool-workspace [class*=mb-]{margin-bottom:var(--spacing-3)}.tool-workspace [class~=w-full]{width:100%}.tool-workspace [class*=overflow-]{max-width:100%;overflow:auto}.tool-workspace [class~=font-mono]{font-family:var(--font-mono)}.tool-workspace [class*=text-sm]{font-size:var(--font-size-sm)}.tool-workspace [class*=font-semibold],.tool-workspace [class*=font-bold]{font-weight:650}.tool-workspace [class*=u-surface-],.tool-workspace [class*=bg-blue-],.tool-workspace [class*=bg-green-],.tool-workspace [class*=bg-red-],.tool-workspace [class*=bg-yellow-]{background:var(--color-surface)}.tool-workspace [class*=border]{border-color:var(--color-border)}.tool-workspace button:is([class*=u-surface-],[class*=u-ink-],[class*=border-gray-],[class~=bg-white]){border-color:var(--color-border);background:var(--color-bg);color:var(--color-text)}.tool-workspace button:is([class~=bg-blue-50],[class~=bg-white][class~=shadow-sm]){border-color:var(--color-text);background:var(--color-surface);color:var(--color-text);box-shadow:inset 0 0 0 1px var(--color-text)}.tool-workspace button:is([class~=text-white],[class~=bg-blue-600],[class~=bg-green-600],[class~=u-surface-900]){border-color:var(--color-text);background:var(--color-text);color:var(--color-bg);box-shadow:none}.tool-workspace mark,.tool-workspace mark[class]{background:var(--color-brand);color:var(--color-on-brand)}.tool-workspace :is([class~=bg-rose-100],[class~=bg-rose-200]){border-color:var(--color-text);background:var(--color-text);color:var(--color-bg)}.tool-workspace :is([class~=bg-amber-100],[class~=bg-amber-200]){border-color:var(--color-brand-hover);background:var(--color-brand);color:var(--color-on-brand)}.tool-workspace :is([class~=bg-blue-100],[class~=bg-blue-200]){border-color:var(--color-border);background:var(--color-surface);color:var(--color-text)}.tool-workspace pre,.tool-workspace table{max-width:100%;overflow:auto}.tool-workspace pre{padding:var(--spacing-4);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);overflow-wrap:anywhere;white-space:pre-wrap}@media (width<=47.99rem){.tool-page{padding-inline:var(--spacing-4)}.tool-hero{gap:var(--spacing-4);grid-template-columns:1fr}.tool-hero h1{font-size:clamp(2.25rem,13vw,4rem)}.tool-workspace{padding:var(--spacing-6) var(--spacing-4);border-radius:var(--radius-lg)}.tool-grid,.tool-grid--three,.related-tools-grid,.tool-workspace [class*=u-cols-2],.tool-workspace [class*=md\:grid-cols-2]{grid-template-columns:1fr}.related-tools-grid a+a{border-left:0}.tool-actions>*,.tool-actions button{flex:100%}}@media (prefers-reduced-motion:reduce){.tool-page *,.tool-page :before,.tool-page :after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}