.tool-page{gap:1.2rem;max-width:1220px;margin:0 auto;padding-bottom:4rem;display:grid}.tool-page__hero{grid-template-columns:minmax(0,1.04fr) minmax(320px,.96fr);align-items:stretch;gap:1rem;display:grid}.tool-page__surface{border:1px solid var(--border-soft);background:linear-gradient(180deg, #ffffff08, transparent 38%), var(--surface-2);box-shadow:var(--shadow-soft);border-radius:1.9rem;position:relative;overflow:hidden}.tool-page__hero-copy,.tool-page__hero-side,.tool-page__panel{padding:1.45rem}.tool-page__hero-copy{background:radial-gradient(circle at top right, #7de2d124, transparent 20rem), linear-gradient(180deg, #ffffff08, transparent 38%), var(--surface-2);align-content:start;gap:1rem;min-height:21rem;padding:clamp(1.5rem,3vw,2.2rem);display:grid}.tool-page__eyebrow{border:1px solid var(--border-soft);background:var(--surface-4);width:fit-content;color:var(--accent-strong);letter-spacing:.14em;text-transform:uppercase;border-radius:999px;align-items:center;gap:.55rem;padding:.5rem .8rem;font-size:.76rem;font-weight:800;display:inline-flex}.tool-page__eyebrow:before{content:"";background:var(--accent);border-radius:50%;width:.52rem;height:.52rem;box-shadow:0 0 1rem #7de2d199}.tool-page h1,.tool-page h2,.tool-page h3,.tool-page h4{font-family:var(--font-display);letter-spacing:-.035em;margin:0;font-weight:700;line-height:1}.tool-page h1{text-wrap:balance;max-width:12ch;font-size:clamp(2.8rem,5.8vw,5.1rem)}.tool-page__lede,.tool-page__hero-side p,.tool-page__panel p,.tool-page__field-hint,.tool-page__notice p{color:var(--text-muted);line-height:1.7}.tool-page__hero-actions{flex-wrap:wrap;gap:.75rem;display:flex}.tool-page__chip-row,.tool-page__quick-links{flex-wrap:wrap;gap:.6rem;display:flex}.tool-page__chip,.tool-page__mini-chip{color:var(--text-soft);background:#ffffff0a;border-radius:999px;align-items:center;padding:.45rem .72rem;font-size:.8rem;font-weight:700;display:inline-flex}.tool-page__mini-chip{background:var(--accent-ghost);color:var(--accent)}.tool-page__hero-side{align-content:start;gap:.9rem;display:grid}.tool-page__hero-side h2{text-wrap:balance;font-size:clamp(1.8rem,3vw,2.6rem)}.tool-page__stat-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;display:grid}.tool-page__stat{border:1px solid var(--border-soft);background:#ffffff08;border-radius:1.2rem;padding:.95rem}.tool-page__stat strong{letter-spacing:-.04em;font-size:1.35rem;display:block}.tool-page__stat span{color:var(--text-soft);margin-top:.3rem;font-size:.88rem;line-height:1.5;display:block}.tool-page__workspace,.tool-page__other-tools,.tool-page__grid,.tool-page__grid--equal,.tool-page__grid--sidebar{gap:1rem;display:grid}.tool-page__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}.tool-page__grid--equal{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-page__grid--sidebar{grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr)}.tool-page__panel{gap:1rem;display:grid}.tool-page__panel-title{justify-content:space-between;align-items:start;gap:1rem;display:flex}.tool-page__panel-title h2,.tool-page__panel-title h3{font-size:1.75rem}.tool-page__panel-kicker{color:var(--accent-strong);letter-spacing:.12em;text-transform:uppercase;margin:0 0 .45rem;font-size:.76rem;font-weight:800}.tool-page__field{gap:.5rem;display:grid}.tool-page__field-row,.tool-page__button-row,.tool-page__toggle-row{flex-wrap:wrap;gap:.75rem;display:flex}.tool-page__field label,.tool-page__label{color:var(--text-strong);font-size:.88rem;font-weight:700}.tool-page__input,.tool-page__select,.tool-page__textarea{border:1px solid var(--border-soft);width:100%;color:var(--text-strong);font:inherit;background:#ffffff08;border-radius:1rem}.tool-page__input,.tool-page__select{min-height:3rem;padding:.78rem .95rem}.tool-page__textarea{resize:vertical;min-height:16rem;padding:.95rem 1rem;line-height:1.6}.tool-page__textarea--compact{min-height:11rem}.tool-page__select{appearance:none}.tool-page__toggle{border:1px solid var(--border-soft);color:var(--text-muted);background:#ffffff08;border-radius:999px;align-items:center;gap:.55rem;padding:.7rem .9rem;font-size:.9rem;display:inline-flex}.tool-page__toggle input{accent-color:var(--accent);margin:0}.tool-page__button{cursor:pointer;min-height:3rem;font:inherit;letter-spacing:.01em;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;padding:.82rem 1.15rem;font-weight:700;transition:transform .18s,border-color .18s,background-color .18s;display:inline-flex}.tool-page__button:hover{transform:translateY(-1px)}.tool-page__button--primary{background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:#08111b}.tool-page__button--secondary{border-color:var(--border-strong);color:var(--text-strong);background:#ffffff0a}.tool-page__button--ghost{border-color:var(--border-soft);color:var(--text-soft);background:0 0}.tool-page__notice{border:1px solid var(--border-soft);background:#ffffff08;border-radius:1.2rem;padding:1rem}.tool-page__notice--error{background:#ff848414;border-color:#ff848452}.tool-page__notice--success{background:#59cd9014;border-color:#59cd904d}.tool-page__notice--accent{background:#7de2d114;border-color:#7de2d147}.tool-page__notice strong{font-size:.96rem;display:block}.tool-page__notice p{margin:.45rem 0 0}.tool-page__code,.tool-page__output,.tool-page__pre{border:1px solid var(--border-soft);color:var(--text-strong);background:#060d1670;border-radius:1.2rem;font-family:JetBrains Mono,Fira Code,SFMono-Regular,Monaco,Consolas,monospace}html[data-theme=light] .tool-page__code,html[data-theme=light] .tool-page__output,html[data-theme=light] .tool-page__pre{background:#14202b0a}.tool-page__output,.tool-page__pre{white-space:pre-wrap;word-break:break-word;padding:1rem;line-height:1.6;overflow:auto}.tool-page__code{padding:.3rem .55rem;font-size:.9rem}.tool-page__metric-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;display:grid}.tool-page__metric{border:1px solid var(--border-soft);background:#ffffff08;border-radius:1.1rem;padding:.95rem}.tool-page__metric strong{font-size:1.2rem;display:block}.tool-page__metric span{color:var(--text-soft);margin-top:.28rem;font-size:.86rem;display:block}.tool-page__tool-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;display:grid}.tool-page__tool-link{border:1px solid var(--border-soft);background:linear-gradient(135deg, var(--tool-card-tint,#7de2d114), transparent 42%), var(--surface-2);box-shadow:var(--shadow-soft);border-radius:1.5rem;gap:.7rem;padding:1.15rem;transition:transform .18s,border-color .18s;display:grid}.tool-page__tool-link:hover{border-color:var(--border-strong);transform:translateY(-2px)}.tool-page__tool-link h3{font-size:1.5rem}.tool-page__tool-link p{color:var(--text-muted);margin:0;line-height:1.65}.tool-page__tool-link code{color:var(--text-soft);font-size:.86rem}@media (width<=1080px){.tool-page__hero,.tool-page__grid,.tool-page__grid--equal,.tool-page__grid--sidebar{grid-template-columns:1fr}.tool-page__tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=760px){.tool-page h1{max-width:none;font-size:clamp(2.5rem,10vw,4rem)}.tool-page__stat-grid,.tool-page__metric-row,.tool-page__tool-grid{grid-template-columns:1fr}.tool-page__button{width:100%}}
