*{box-sizing:border-box}
body{margin:0;background:#141618;color:#f3f3ee;font:16px/1.6 system-ui,-apple-system,sans-serif}
main{max-width:940px;margin:0 auto;padding:32px 22px 80px}
h1{font-size:34px;margin:0 0 6px;letter-spacing:-1px}
h2{font-size:22px;margin:0 0 14px}
.lead{color:#a8adae;margin:0 0 22px}
a{color:#a6e400}
.panel,details{background:#1c2124;border:1px solid #3a4348;border-radius:14px;padding:22px;margin:18px 0}
details>summary{cursor:pointer;font-weight:700;font-size:17px}
label,.field>span{display:block;font-size:13px;color:#c7d0cb;margin:16px 0 6px}
input,textarea,select{width:100%;background:#262c30;color:#fff;border:1px solid #58615e;border-radius:8px;padding:11px;font:inherit}
textarea{min-height:96px;resize:vertical}
input:focus,textarea:focus,select:focus,button:focus-visible{outline:2px solid #51d3c6;outline-offset:2px}
button,.button{background:#a6e400;color:#172000;border:0;border-radius:8px;padding:11px 18px;margin:4px 6px 4px 0;font:inherit;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block}
button.secondary{background:#39413d;color:#fff}
button.small{padding:5px 11px;font-size:13px}
button.danger{background:#6b2a2a;color:#fff}
.bar{position:sticky;top:0;z-index:5;background:#141618f2;padding:12px 0;border-bottom:1px solid #2c3438}
#status{min-height:26px;margin:6px 0;color:#a6e400}
#status[data-state=error],.error{color:#ff9a8a}
.mode{margin:8px 0;padding:10px 14px;border-radius:8px;background:#233028;border:1px solid #51d3c6;color:#bff3ec}
.mode.live{background:#352a1c;border-color:#c8a76a;color:#f0dcb4}
.problems{list-style:none;padding:0;margin:10px 0}
.problems li{background:#3a2a22;border-left:4px solid #ff9a8a;padding:8px 12px;margin:6px 0;border-radius:6px}
.tools{margin:4px 0}
.preview{margin:8px 0 0;padding:12px;border:1px dashed #58615e;border-radius:8px;color:#d9dfdc;white-space:pre-line;font-size:14px}
.preview:empty::before{content:'Formatted preview appears here.';color:#7e8884}
.hint{font-size:12px;color:#8e9696;margin:4px 0 0}
.warn{font-size:13px;color:#e8cb78;margin:4px 0 0}
.logo-preview{max-height:56px;max-width:220px;margin-top:8px;background:#0f1214;padding:6px;border-radius:6px}
.actions{margin-top:18px;padding-top:14px;border-top:1px solid #3a4348}
