:root{--bg:#f4f1ea;--surface:#fff;--text:#1f2522;--muted:#5d6862;--accent:#205e50;--good:#17663c;--danger:#9b2c2c;--black:#050505;--line:#dce2de;--shadow:0 8px 28px rgba(20,32,27,.08)}
*{box-sizing:border-box}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}body{margin:0}.topbar{max-width:1100px;margin:auto;padding:22px 18px 8px;display:flex;align-items:center;justify-content:space-between;gap:18px}.topbar h1{font-size:clamp(2rem,5vw,3.2rem);margin:0}.topbar p{margin:.35rem 0;color:var(--muted)}main{max-width:1100px;margin:auto;padding:8px 18px 50px;display:grid;gap:16px}.card{background:var(--surface);border-radius:18px;padding:18px;box-shadow:var(--shadow)}.section-title{text-transform:uppercase;letter-spacing:.09em;color:var(--accent);font-size:.77rem;font-weight:800;margin-bottom:12px}.muted{color:var(--muted);line-height:1.45}.mic-badge{border-radius:13px;padding:14px 16px;color:#fff;font-weight:800;white-space:pre-line;margin-bottom:10px}.mic-green{background:var(--good)}.mic-black{background:var(--black)}button,select,input{font:inherit}.button-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.primary,.secondary,.danger,.text-button{border-radius:13px;padding:12px 16px;min-height:48px;cursor:pointer}.primary{background:var(--accent);color:white;border:1px solid var(--accent);font-weight:700}.secondary{background:#fff;color:var(--accent);border:1px solid var(--accent);font-weight:650}.danger{background:#fff;color:var(--danger);border:1px solid var(--danger);font-weight:650}.text-button{background:transparent;color:var(--accent);border:0;text-decoration:underline}.hidden{display:none!important}button:disabled{opacity:.4;cursor:not-allowed}select,input[type=number]{border:1px solid var(--line);border-radius:10px;padding:9px;background:#fff}.string-select{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.string-option{border:1px solid var(--line);background:#fff;border-radius:11px;padding:10px}.string-option.active{background:var(--accent);color:#fff;border-color:var(--accent)}.hero-note{text-align:center;color:var(--accent);font-size:clamp(3.8rem,12vw,6rem);font-weight:850;line-height:1.05;margin-top:14px}.hero-note.small{font-size:clamp(3rem,9vw,4.8rem)}.hero-sub{text-align:center;font-weight:650;font-size:1.15rem}.advice{text-align:center;font-weight:700;margin-top:7px}.inline-setting{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:12px}.controls-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:12px}.controls-grid.compact{grid-template-columns:2fr 1fr 1fr;margin-top:10px}.controls-grid label{display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:.88rem}.beat-display{font-size:2rem;font-weight:850;min-width:90px;text-align:center}.status-line{text-align:center;font-weight:750;margin:10px 0}.version{text-align:right;color:var(--muted);font-size:.8rem}canvas{display:block;width:100%;height:auto;border-radius:12px;background:#fafbf9;border:1px solid var(--line)}#staff{min-height:190px}.editor-row{margin-top:10px}#toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:#111;color:#fff;padding:11px 15px;border-radius:10px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90vw;z-index:50}#toast.show{opacity:1}@media(max-width:720px){.topbar{align-items:flex-start;flex-direction:column}.controls-grid{grid-template-columns:1fr 1fr}.controls-grid.compact{grid-template-columns:1fr}.button-row>*{flex:1}.inline-setting{grid-template-columns:1fr}.string-select{grid-template-columns:repeat(5,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}