*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;background:#0e1622;color:#e7eef7;margin:0}
header{max-width:900px;margin:24px auto 0 auto;padding:0 16px}
h1{margin:0;font-size:28px}
.subtitle{opacity:.7;margin-top:6px}
main{max-width:900px;margin:24px auto;padding:0 16px;display:grid;gap:20px}
.card{background:#101722;border:1px solid #1d2733;border-radius:16px;padding:18px 16px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
h2{margin:0 0 12px 0;font-size:18px}
.row{display:flex;gap:12px;flex-wrap:wrap;margin:8px 0}
input,textarea{width:100%;background:#0b121c;border:1px solid #243245;border-radius:10px;color:#e6eef7;padding:10px 12px;outline:none}
textarea{resize:vertical}
button{padding:10px 14px;border-radius:12px;border:1px solid transparent;background:#27a376;color:white;font-weight:700;cursor:pointer}
button.ghost{background:transparent;border-color:#2a384b;color:#b8c6d9}
button.outline{background:transparent;border-color:#27a376;color:#27a376}
pre{background:#0b121c;border:1px solid #243245;border-radius:10px;padding:12px;max-height:220px;overflow:auto}
footer{max-width:900px;margin:20px auto 40px auto;padding:0 16px;color:#7f8ea3;opacity:.7}
.muted{color:#88a0b9;font-size:14px;margin-top:6px}