.tool-widget:has(.cf-app){padding:0;border:0;background:transparent;box-shadow:none}
.cf-app{--cf-border:rgba(148,163,184,.18);--cf-card:rgba(15,23,42,.84);--cf-muted:#94a3b8;width:100%}
.cf-shell{padding:1.2rem;border:1px solid var(--cf-border);border-radius:20px;background:radial-gradient(circle at 0 0,rgba(56,189,248,.16),transparent 32%),radial-gradient(circle at 100% 0,rgba(34,197,94,.08),transparent 30%),linear-gradient(155deg,#111827,#080f1d);box-shadow:0 20px 55px rgba(0,0,0,.28)}
.cf-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.cf-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}
.cf-kicker{margin:0 0 .35rem;color:#7dd3fc;font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.cf-hero h2{margin:0;color:#f8fafc;font-size:clamp(1.35rem,3vw,2rem);letter-spacing:-.035em}
.cf-hero p:not(.cf-kicker){max-width:650px;margin:.45rem 0 0;color:var(--cf-muted);font-size:.88rem;line-height:1.55}
.cf-hero-actions,.cf-primary-actions,.cf-head-actions,.cf-export-actions{display:flex;gap:.5rem;flex-wrap:wrap}
.cf-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:1rem;padding:.7rem;border:1px solid var(--cf-border);border-radius:13px;background:rgba(2,8,20,.38)}
.cf-options{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;flex-wrap:wrap}
.cf-options label{display:flex;align-items:center;gap:.4rem;color:#cbd5e1;font-size:.72rem;font-weight:700;cursor:pointer}
.cf-options input{accent-color:#0ea5e9}.cf-select{padding:.38rem .55rem;border:1px solid var(--cf-border);border-radius:8px;background:#0b1423;color:#e2e8f0;font:inherit;font-size:.72rem}
.cf-editors{display:grid;grid-template-columns:1fr auto 1fr;gap:.7rem;align-items:stretch}
.cf-card{min-width:0;padding:1rem;border:1px solid var(--cf-border);border-radius:16px;background:var(--cf-card)}
.cf-card-head,.cf-card-head>div{display:flex;align-items:center;gap:.5rem}.cf-card-head{justify-content:space-between;margin-bottom:.7rem}
.cf-card-head h3{margin:0;color:#e2e8f0;font-size:.9rem}.cf-step{display:grid;width:1.4rem;height:1.4rem;place-items:center;border-radius:50%;background:linear-gradient(135deg,#38bdf8,#22c55e);color:#07101e;font-size:.7rem;font-weight:900}
.cf-text-btn{border:0;background:transparent;color:#7dd3fc;font:inherit;font-size:.72rem;font-weight:800;cursor:pointer}
.cf-editor{box-sizing:border-box;width:100%;min-height:330px;padding:.8rem;border:1px solid var(--cf-border);border-radius:11px;outline:0;resize:vertical;background:rgba(2,8,20,.58);color:#dbeafe;font:400 .8rem/1.55 "JetBrains Mono",ui-monospace,Consolas,monospace;tab-size:2;white-space:pre}
.cf-editor:focus,.cf-select:focus,.cf-text-btn:focus-visible{border-color:rgba(56,189,248,.65);box-shadow:0 0 0 3px rgba(14,165,233,.15)}
.cf-middle{display:grid;align-self:center;width:2rem;height:2rem;place-items:center;border-radius:50%;background:linear-gradient(135deg,#0284c7,#38bdf8);color:#fff;font-weight:900;box-shadow:0 8px 22px rgba(14,165,233,.3)}
.cf-stats{display:flex;justify-content:space-between;gap:.45rem;flex-wrap:wrap;margin-top:.55rem;color:var(--cf-muted);font-size:.65rem}
.cf-status{margin:.8rem 0 0;padding:.6rem .7rem;border:1px solid var(--cf-border);border-radius:10px;background:rgba(56,189,248,.07);color:#bae6fd;font-size:.75rem}
.cf-status.is-success{background:rgba(52,211,153,.08);color:#a7f3d0}.cf-status.is-error{background:rgba(248,113,113,.1);color:#fecaca}
.cf-lower-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}
.cf-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
.cf-metrics div{padding:.65rem;border:1px solid var(--cf-border);border-radius:10px;background:rgba(2,8,20,.32)}
.cf-metrics span,.cf-metrics strong{display:block}.cf-metrics span{color:var(--cf-muted);font-size:.66rem}.cf-metrics strong{margin-top:.2rem;color:#e2e8f0;font-size:.92rem}
.cf-export-card p{margin:0 0 .75rem;color:var(--cf-muted);font-size:.78rem;line-height:1.5}
@media(max-width:960px){.cf-toolbar{align-items:flex-start;flex-direction:column}.cf-options{justify-content:flex-start}.cf-editors{grid-template-columns:1fr}.cf-middle{justify-self:center;transform:rotate(90deg)}.cf-lower-grid{grid-template-columns:1fr}}
@media(max-width:580px){.cf-shell{padding:.75rem;border-radius:14px}.cf-hero{flex-direction:column}.cf-card{padding:.8rem;border-radius:13px}.cf-primary-actions,.cf-primary-actions .btn{width:100%}.cf-editor{min-height:240px;font-size:.76rem}.cf-metrics{grid-template-columns:1fr 1fr}.cf-head-actions{gap:.75rem}}
