.tgen{--tg-accent:#067957;--tg-accent-h:#055f45;--tg-soft:#ecfbf5;--tg-ink:#172033;--tg-muted:#5b687e;--tg-line:#dfe5ec;--tg-bg:#f8fafc;--tg-bad:#b42318;--tg-bad-g:#e5484d;
box-sizing:border-box;max-width:880px;margin:0 auto 1.5em;padding:16px;background:#fff;border:1px solid var(--tg-line);border-radius:14px;color:var(--tg-ink);font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 1px 3px rgba(23,32,51,.06)}
.tgen *,.tgen *::before,.tgen *::after{box-sizing:border-box}
.tgen .tgen-title{margin:0 0 4px;font-size:1.45em;line-height:1.2;color:var(--tg-ink)}
.tgen .tgen-intro{margin:0 0 12px;color:var(--tg-muted)}
.tgen-panel{background:var(--tg-bg);border:1px solid var(--tg-line);border-radius:12px;padding:14px}
.tgen-readout{text-align:center}
.tgen-hz{display:block;font-size:clamp(40px,11vw,64px);font-weight:800;line-height:1.05;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--tg-ink)}
.tgen-note{display:block;color:var(--tg-muted);font-size:.95em;min-height:1.5em}
.tgen-scope{display:block;width:100%;height:80px;margin:10px 0;background:#fff;border:1px solid var(--tg-line);border-radius:10px}
.tgen-freq>label,.tgen-field>label,.tgen-label{display:block;font-weight:700;margin-bottom:4px;font-size:.95em}
.tgen-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.tgen-freq .tgen-row{flex-wrap:nowrap}
.tgen .tgen-num{flex:1 1 auto;min-width:0;width:100%;font:inherit;font-size:1.15em;font-weight:700;text-align:center;min-height:44px;padding:6px 8px;border:1px solid #c9d3de;border-radius:10px;background:#fff;color:var(--tg-ink)}
.tgen-slider{display:block;width:100%;margin:12px 0 2px;accent-color:var(--tg-accent)}
.tgen-scale{display:flex;justify-content:space-between;font-size:.75em;color:var(--tg-muted)}
.tgen .tgen-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 14px;border:1px solid var(--tg-line);border-radius:10px;background:#fff;color:var(--tg-ink);font:inherit;font-weight:600;cursor:pointer;line-height:1.2}
.tgen .tgen-btn:hover{border-color:var(--tg-accent);color:var(--tg-accent)}
.tgen .tgen-sm{min-width:44px;padding:8px 10px;flex:0 0 auto}
.tgen .tgen-btn:focus-visible,.tgen input:focus-visible,.tgen select:focus-visible,.tgen .tgen-chip:focus-visible{outline:3px solid var(--tg-accent);outline-offset:2px}
.tgen-actions{display:flex;justify-content:center;margin-top:12px}
.tgen .tgen-play{min-width:200px;font-size:1.1em;background:var(--tg-accent);border-color:var(--tg-accent);color:#fff}
.tgen .tgen-play:hover{background:var(--tg-accent-h);border-color:var(--tg-accent-h);color:#fff}
.tgen.is-playing .tgen-play{background:#fff;color:var(--tg-bad);border-color:var(--tg-bad-g)}
.tgen-status{margin:10px 0 0;text-align:center;font-size:.9em;color:var(--tg-muted);min-height:1.5em}
.tgen-status.is-error{color:var(--tg-bad)}
.tgen-form{margin-top:12px}
.tgen fieldset{border:1px solid var(--tg-line);border-radius:10px;margin:0 0 12px;padding:8px 12px 10px;min-width:0}
.tgen fieldset[disabled]{opacity:.5}
.tgen legend{font-weight:700;font-size:.95em;padding:0 4px}
.tgen fieldset label{display:inline-flex;align-items:center;gap:6px;min-height:40px;margin-right:14px;cursor:pointer}
.tgen input[type=radio]{accent-color:var(--tg-accent);width:18px;height:18px}
.tgen-sub{margin-bottom:12px}
.tgen-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:12px}
.tgen-field input[type=number],.tgen-field select,.tgen-inline select{font:inherit;min-height:42px;width:100%;padding:6px 10px;border:1px solid #c9d3de;border-radius:8px;background:#fff;color:var(--tg-ink)}
.tgen-field input[type=range]{width:100%;accent-color:var(--tg-accent);min-height:32px}
.tgen-field output{font-weight:600;color:var(--tg-muted)}
.tgen-presets{margin-bottom:12px}
.tgen-chips{display:flex;flex-wrap:wrap;gap:6px}
.tgen .tgen-chip{appearance:none;min-height:40px;padding:6px 12px;border:1px solid #bfe8d7;border-radius:999px;background:var(--tg-soft);color:var(--tg-accent);font:inherit;font-size:.92em;font-weight:600;cursor:pointer}
.tgen .tgen-chip:hover{background:#d9f4e8}
.tgen-extra{gap:8px}
.tgen-inline{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:.95em}
.tgen-inline select{width:auto;min-height:44px}
.tgen-small{font-size:.85em;color:var(--tg-muted);margin:8px 0 0}
.tgen [hidden]{display:none!important}
@media (min-width:640px){
.tgen{padding:22px}
.tgen-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.tgen-sub .tgen-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.tgen-scope{height:96px}
}
@media (prefers-reduced-motion:reduce){.tgen *{transition:none!important}}