.tools-page{padding:clamp(2rem,5vw,5rem) 1rem 5rem;background:var(--color-background,#f7f8fc);color:var(--color-text,#172033);min-height:65vh}.tools-intro{max-width:760px;margin:0 auto 2.5rem;text-align:center}.tools-eyebrow{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:#5267bd;margin:0 0 .55rem}.tools-intro h1{font-size:clamp(2.2rem,5vw,3.7rem);line-height:1.08;margin:.3rem 0 1rem;letter-spacing:-.04em}.tools-intro>p:last-child{font-size:1.1rem;color:#697386;line-height:1.7}.tools-filters{display:grid;grid-template-columns:auto minmax(200px,1fr) auto minmax(190px,.8fr) auto;align-items:end;gap:.8rem;background:#fff;padding:1rem;border:1px solid #e4e7ef;border-radius:16px;margin-bottom:2.5rem}.tools-filters label{font-size:.82rem;font-weight:650}.tools-filters input,.tools-filters select,.tool-fields input,.tool-fields textarea,.tool-fields select{font:inherit;color:inherit;background:#fff;border:1px solid #d5d9e3;border-radius:9px;padding:.75rem;min-width:0;width:100%}.tools-button{font:inherit;font-weight:650;border:1px solid #d5d9e3;border-radius:9px;padding:.4rem 1rem;background:#fff;color:#253047;cursor:pointer}.tools-button:hover{border-color:#253047}.tools-button:disabled{opacity:.5;cursor:not-allowed}.tools-clear-link{font-size:.9rem}.tools-category{margin:3rem 0}.tools-category__heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:1rem}.tools-category__heading h2{margin:0;font-size:1.6rem}.tools-category__heading>span{font-size:.9rem;color:#737d90}.tools-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.tool-card,.tool-related__card{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid #e4e7ef;border-radius:14px;padding:1.25rem;min-width:0}.tool-card h3{margin:.35rem 0 .45rem;font-size:1.08rem}.tool-card h3 a{color:inherit;text-decoration:none}.tool-card>p:not(.tool-card__category){margin:0;color:#687286;line-height:1.55;font-size:.94rem}.tool-card__category{color:#586cc0;font-weight:650;font-size:.75rem;margin:0}.tool-card__link{margin-top:auto;padding-top:1rem;text-decoration:none;font-weight:650;color:#3157d5}.tools-empty{background:#fff;padding:1.5rem;border:1px solid #e4e7ef;border-radius:12px}.tool-workbench{background:#fff;border:1px solid #e2e6ef;border-radius:18px;padding:clamp(1rem,3vw,2rem);box-shadow:0 12px 45px #1720330b}.tool-workbench__top{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.2rem}.tool-workbench__top h2,.tool-output-wrap h3{margin:0 0 .25rem}.tool-workbench__top p{margin:0;color:#778094;font-size:.9rem}.tool-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.tool-field{display:flex;flex-direction:column;gap:.4rem;min-width:0}.tool-field--wide{grid-column:1/-1}.tool-field label{font-weight:650;font-size:.9rem}.tool-field textarea{resize:vertical;min-height:155px;font-family:ui-monospace,Consolas,monospace}.tool-field input[type=checkbox]{width:auto;min-height:1.1rem;accent-color:#3454d1}.tool-check{display:flex;align-items:center;gap:.55rem}.tool-hint{font-size:.82rem;color:#737d90}.tool-actions{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;margin-top:1rem}.tool-actions [role=status]{font-size:.9rem;color:#475569}.tool-output-wrap{margin-top:1.5rem}.tool-output{margin:.55rem 0 0;white-space:pre-wrap;overflow-wrap:anywhere;overflow:auto;max-height:560px;min-height:100px;padding:1rem;border:1px solid #e1e5ed;border-radius:10px;background:#f7f8fb;color:#172033;font:.88rem/1.55 ui-monospace,SFMono-Regular,Consolas,monospace}.tool-guide,.tool-related{margin-top:2.5rem;max-width:820px}.tool-guide h2,.tool-related h2{font-size:1.25rem;margin:1.6rem 0 .4rem}.tool-guide p{color:#657084;line-height:1.7}.tool-related__card{text-decoration:none;color:inherit;gap:.5rem}.tool-related__card span{color:#6c7687;font-size:.9rem;line-height:1.5}.tool-back{margin-top:2.5rem}.tool-back a{font-weight:650}.og-preview{display:flex;max-width:560px;margin:1.4rem auto 0;border:1px solid #d9dee8;border-radius:12px;overflow:hidden;background:#f6f7f9}.og-preview img{width:38%;aspect-ratio:1.91;object-fit:cover;background:#e5e8ef}.og-preview div{padding:1rem;min-width:0}.og-preview p{margin:.4rem 0;color:#657084}.og-preview small{color:#778094;overflow-wrap:anywhere}@media(max-width:850px){.tools-filters{grid-template-columns:1fr 1fr}.tools-filters label{align-self:end}.tools-filters input,.tools-filters select{grid-row:auto}.tools-filters .tools-button{grid-column:1/-1}.tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.tools-page{padding-inline:.85rem}.tools-filters{grid-template-columns:1fr;gap:.55rem}.tools-filters .tools-button{grid-column:auto}.tools-grid{grid-template-columns:1fr}.tool-fields{grid-template-columns:1fr}.tool-field--wide{grid-column:auto}.tool-workbench__top{align-items:center}}html.dark .tools-page{background:#101522;color:#e7eaf2}html.dark .tools-filters,html.dark .tool-card,html.dark .tool-related__card,html.dark .tool-workbench,html.dark .tools-empty{background:#171e2d;border-color:#2a3448}html.dark .tools-filters input,html.dark .tools-filters select,html.dark .tool-fields input,html.dark .tool-fields textarea,html.dark .tool-fields select,html.dark .tools-button{background:#121927;color:#e7eaf2;border-color:#39445b}html.dark .tool-output{background:#101522;color:#e7eaf2;border-color:#2a3448}html.dark .tool-card>p:not(.tool-card__category),html.dark .tool-guide p,html.dark .tool-workbench__top p,html.dark .tool-related__card span{color:#a8b2c5}html.dark .og-preview{background:#121927;border-color:#39445b}html.dark .og-preview p,html.dark .og-preview small{color:#a8b2c5}.tools-filters{width:100%;grid-template-columns:minmax(0,1fr) auto}.tools-filters .tools-filter-field:first-child{grid-column:1/-1}@media(max-width:560px){.tools-filters{grid-template-columns:1fr}.tools-filters .tools-filter-field:first-child{grid-column:auto}}.tools-filters{width:min(820px,100%);margin:0 auto 1.75rem;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:end;justify-content:center}.tools-filter-field{display:flex;flex-direction:column;gap:.4rem;min-width:0}.tools-filter-actions{display:flex;align-items:center;gap:.75rem;min-height:44px}.tools-category{margin:2rem 0}.tools-category__heading{margin-bottom:.75rem}.tools-category__description{margin:.25rem 0 0;color:#737d90;font-size:.9rem}.tool-check{position:relative;min-height:48px;padding:.7rem .85rem;border:1px solid #d5d9e3;border-radius:10px;background:#f8f9fc;cursor:pointer;line-height:1.35}.tool-check:hover{border-color:#8492d4;background:#f2f4fc}.tool-check:focus-within{outline:3px solid #3454d155;outline-offset:1px}.tool-check input{width:1.1rem!important;height:1.1rem;min-height:1.1rem!important;flex:0 0 auto}.tool-check span{font-size:.9rem}.tool-live-clock{margin-top:1rem;padding:.85rem 1rem;border:1px solid #dfe4ee;border-radius:10px;background:#f7f8fb;font-variant-numeric:tabular-nums}.tool-output{min-height:150px}.tools-filters input:focus-visible,.tools-filters select:focus-visible,.tool-fields input:focus-visible,.tool-fields textarea:focus-visible,.tool-fields select:focus-visible,.tools-button:focus-visible{outline:3px solid #3454d155;outline-offset:1px}@media(max-width:850px){.tools-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.tools-filter-actions{grid-column:1/-1;justify-content:center}.tools-filters .tools-button{grid-column:auto}}@media(max-width:560px){.tools-filters{grid-template-columns:1fr;padding:.85rem}.tools-filter-actions{grid-column:auto;justify-content:flex-start}.tool-check{min-height:46px}.tool-live-clock{font-size:.85rem}}html.dark .tools-category__description{color:#a8b2c5}html.dark .tool-check,html.dark .tool-live-clock{background:#121927;color:#e7eaf2;border-color:#39445b}html.dark .tool-check:hover{background:#1b2538;border-color:#7888d0}.tools-page{min-height:0;padding:1.5rem 0 3rem}.tools-hero{padding-bottom:48px}.tools-intro{margin-bottom:1.25rem}.tools-intro h1{font-size:clamp(1.8rem,3.3vw,2.5rem);margin:.2rem 0 .55rem}.tools-intro>p:last-child{font-size:.95rem;line-height:1.5}.tools-eyebrow{font-size:.68rem;margin-bottom:.35rem}.tools-filters{gap:.65rem;padding:.8rem;border-radius:12px;margin-bottom:1.5rem}.tools-filters input,.tools-filters select{padding:.55rem .65rem;font-size:.9rem}.tools-category{margin:1.5rem 0}.tools-category__heading{margin-bottom:.6rem}.tools-category__heading h2{font-size:1.15rem}.tools-category__heading>span,.tools-category__description{font-size:.82rem}.tools-grid{gap:.7rem}.tool-card{--spotlight-x:50%;--spotlight-y:50%;--spotlight-opacity:0;position:relative;overflow:hidden;min-height:108px;padding:.8rem .9rem;border-radius:12px;transition:border-color .24s var(--ease-out),background-color .24s var(--ease-out),transform .3s var(--ease-out)}.tool-card::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:var(--spotlight-opacity);background:radial-gradient(300px circle at var(--spotlight-x) var(--spotlight-y),rgba(76,51,216,.09),transparent 62%);transition:opacity .32s var(--ease-out)}html.dark .tool-card::before{background:radial-gradient(300px circle at var(--spotlight-x) var(--spotlight-y),rgba(124,102,240,.14),transparent 62%)}.tool-card:hover,.tool-card:focus-within{transform:translateY(-2px);border-color:#a7a0de;box-shadow:0 8px 22px rgba(49,38,112,.08)}.tool-card>*{position:relative;z-index:1}.tool-card h3{margin:0 0 .35rem;font-size:.98rem;line-height:1.3}.tool-card>p:not(.tool-card__category){font-size:.84rem;line-height:1.45}.tool-card__link{padding-top:.45rem;font-size:.8rem}.tool-workbench{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:.8rem;padding:1rem;border-radius:14px}.tool-workbench__top{grid-column:1/-1;margin-bottom:.1rem;align-items:center}.tool-workbench__top h2{font-size:1.08rem}.tool-workbench__top p{font-size:.82rem;line-height:1.4}.tool-workbench form{grid-column:1;grid-row:2;min-width:0}.tool-fields{gap:.65rem}.tool-field{gap:.25rem}.tool-field label{font-size:.82rem}.tool-fields input:not([type=checkbox]),.tool-fields textarea,.tool-fields select{padding:.52rem .62rem;font-size:.88rem}.tool-field textarea{min-height:112px}.tool-actions{gap:.45rem;margin-top:.7rem}.tool-actions .tools-button{padding:.55rem .75rem;font-size:.84rem}.tool-actions [role=status]{font-size:.82rem}.tool-live-clock{grid-column:1;grid-row:3;margin-top:0;padding:.65rem .8rem;font-size:.8rem}.tool-output-wrap{grid-column:2;grid-row:2;margin-top:0;min-width:0}.tool-output-wrap h3{font-size:1rem}.tool-output{min-height:100px;max-height:370px;margin-top:.4rem;padding:.75rem;font-size:.8rem;line-height:1.5}.tool-guide{display:block;max-width:760px;margin-top:1rem}.tool-guide h2{font-size:.86rem;margin:.75rem 0 .15rem}.tool-guide h2:first-child{margin-top:0}.tool-guide p{font-size:.84rem;line-height:1.55;margin:.15rem 0 0}.tool-related{max-width:none;margin-top:1.25rem}.tool-related h2{font-size:1.05rem;margin:0 0 .6rem}.tool-related__card{padding:.8rem;gap:.35rem}.tool-related__card strong{font-size:.88rem}.tool-related__card span{font-size:.8rem}.tool-back{margin-top:1.2rem;font-size:.88rem}.tools-hero__container{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:1.5rem;align-items:center}.tools-hero__container>.hero__content{max-width:none}.tools-hero__guide{margin:0}@media(max-width:850px){.tool-workbench{display:block}.tool-workbench__top{margin-bottom:.8rem}.tool-output-wrap{margin-top:1rem}.tool-live-clock{margin-top:.75rem}}@media(max-width:850px){.tools-hero__container{grid-template-columns:1fr;gap:1rem}}@media(max-width:560px){.tools-page{padding:1.1rem 0 2.25rem}.tools-category{margin:1.2rem 0}.tool-card{min-height:0}.tool-workbench{padding:.8rem}}.tool-card,.tool-related__card{--spotlight-x:50%;--spotlight-y:50%;--spotlight-opacity:0;position:relative;overflow:hidden;text-decoration:none;color:inherit;transition:border-color .24s var(--ease-out),background-color .24s var(--ease-out),transform .3s var(--ease-out)}.tool-card::before,.tool-related__card::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:var(--spotlight-opacity);background:radial-gradient(300px circle at var(--spotlight-x) var(--spotlight-y),rgba(76,51,216,.09),transparent 62%);transition:opacity .32s var(--ease-out)}html.dark .tool-card::before,html.dark .tool-related__card::before{background:radial-gradient(300px circle at var(--spotlight-x) var(--spotlight-y),rgba(124,102,240,.14),transparent 62%)}.tool-card:hover,.tool-card:focus-visible,.tool-related__card:hover,.tool-related__card:focus-visible{transform:translateY(-2px);border-color:#a7a0de;box-shadow:0 8px 22px rgba(49,38,112,.08)}.tool-card>*,.tool-related__card>*{position:relative;z-index:1}.tool-card:focus-visible,.tool-related__card:focus-visible{outline:3px solid #3454d155;outline-offset:2px}.tool-output-wrap{border-left:1px solid #dfe4ee;padding-left:.9rem}.tool-fields--diff{column-gap:1.1rem}.tool-fields--diff .tool-field:nth-child(2){border-left:1px solid #dfe4ee;padding-left:.85rem}html.dark .tool-output-wrap,html.dark .tool-fields--diff .tool-field:nth-child(2){border-color:#39445b}@media(max-width:850px){.tool-output-wrap{border-left:0;border-top:1px solid #dfe4ee;padding:1rem 0 0}}@media(max-width:560px){.tool-fields--diff .tool-field:nth-child(2){border-left:0;border-top:1px solid #dfe4ee;padding:.75rem 0 0}.tool-output-wrap{padding-top:.8rem}}.tools-hero__container{display:block}.tools-hero__container>.hero__content{max-width:760px}.tools-hero__guide{display:block;max-width:760px;margin:1rem 0 0}.tool-workbench{display:block}.tool-workbench form{display:block}.tool-fields{grid-template-columns:minmax(0,1fr)}.tool-field--wide{grid-column:auto}.tool-live-clock{grid-column:auto;grid-row:auto}.tool-output-wrap{grid-column:auto;grid-row:auto;margin-top:1rem;padding:1rem 0 0;border:0;border-top:1px solid #dfe4ee}.tool-fields--diff .tool-field:nth-child(2){padding:0;border:0}html.dark .tool-output-wrap{border-color:#39445b}.tool-field[hidden]{display:none}
.tools-hero,.tools-page{background:var(--background);color:var(--foreground)}.tools-hero{padding-bottom:clamp(42px,7vw,72px);border-bottom:1px solid var(--border)}.tools-hero .hero__content,.tools-hero__container>.hero__content{width:100%;max-width:none}.tools-hero .page-title{width:100%;max-width:none;margin:0}.tools-hero .hero__subtitle{width:100%;max-width:none;margin:.5rem 0 0}
