:root { --bg:#0f172a; --card:#1e293b; --accent:#2563eb; --txt:#e2e8f0; --muted:#94a3b8; --danger:#dc2626; --ok:#16a34a; }
* { box-sizing: border-box; }
body { margin:0; font-family:system-ui,Segoe UI,sans-serif; background:var(--bg); color:var(--txt); }
header { display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #334155; }
h1 { margin:0; font-size:1.4rem; }
h2 { margin-top:0; color:#93c5fd; font-size:1.1rem; }
small { color:var(--muted); font-weight:normal; }
.card { background:var(--card); border:1px solid #334155; border-radius:10px; padding:1.2rem 1.4rem; margin:1rem auto; max-width:760px; }
main { padding-bottom:3rem; }
label { display:block; margin:.6rem 0; color:var(--muted); font-size:.9rem; }
label.chk { color:var(--txt); }
input, select, textarea { width:100%; padding:.55rem .7rem; margin-top:.25rem; border-radius:6px; border:1px solid #475569; background:#0f172a; color:var(--txt); font-size:1rem; }
input[type=checkbox] { width:auto; margin-right:.5rem; }
label.chk { display:flex; align-items:center; }
button { background:var(--accent); color:#fff; border:0; border-radius:7px; padding:.6rem 1.1rem; font-size:.95rem; cursor:pointer; margin-top:.6rem; }
button:hover { filter:brightness(1.1); }
button.danger { background:var(--danger); }
button.link { background:none; color:var(--muted); text-decoration:underline; display:block; margin:2rem auto; }
textarea { min-height:200px; font-family:ui-monospace,monospace; font-size:.8rem; }
.hidden { display:none !important; }
.msg { font-size:.9rem; min-height:1.2rem; }
.msg.err { color:#fca5a5; } .msg.ok { color:#86efac; }
.hint { color:var(--muted); font-size:.85rem; }
.badge { display:inline-block; padding:.15rem .55rem; border-radius:999px; font-size:.78rem; margin-right:.4rem; }
.b-local { background:#065f46; } .b-external { background:#7c2d12; }
.tool { font-size:.85rem; padding:.2rem 0; border-bottom:1px solid #334155; }
.t-done { color:#86efac; } .t-error { color:#fca5a5; } .t-running { color:#fcd34d; } .t-killed { color:#f87171; }
code { background:#0f172a; padding:.1rem .35rem; border-radius:4px; }
a { color:#93c5fd; }
.spinner { display:inline-block; width:14px; height:14px; border:2px solid #475569; border-top-color:#93c5fd; border-radius:50%; animation:spin .8s linear infinite; vertical-align:middle; margin-right:.5rem; }
@keyframes spin { to { transform:rotate(360deg); } }
button:disabled { opacity:.45; cursor:not-allowed; filter:none; }
.activity { color:#fcd34d; font-weight:600; }
