.tabs { display: flex; gap: 8px; padding: 18px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.tabs button { background: var(--surface); color: var(--text); border: 1px solid var(--line); }
.tabs button.on { border-color: var(--primary); color: var(--accent); }
.tab { padding: 20px 0; }
.row { display: flex; gap: 10px; align-items: center; margin-bottom: 14px; flex-wrap: wrap; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; margin-bottom: 12px; }
.card input, .card textarea, .card select, .wiz-steps input, .wiz-steps textarea, .wiz-steps select {
    display: block; width: 100%; margin: 8px 0; padding: 10px 12px; border-radius: 8px;
    border: 1px solid var(--line); background: #0a0a0c; color: var(--text); font-size: 15px;
}
.muted { color: var(--muted); }
.small { font-size: 13px; }
.wiz-steps { list-style: none; display: grid; gap: 12px; padding: 0; }
.wiz-steps li { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; }
.wiz-state { font-size: 13px; color: var(--accent); margin-left: 8px; }
.clip-card video { width: 100%; max-width: 300px; border-radius: 10px; background: #000; }
.matrix { font-size: 13px; color: var(--muted); margin: 6px 0; }
.matrix .ok { color: var(--accent); }
.matrix .bad { color: #ff6b6b; }
.modal { position: fixed; inset: 0; background: rgba(0,0,0,0.7); display: flex; align-items: center; justify-content: center; padding: 20px; }
.modal-card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 24px; max-width: 560px; width: 100%; max-height: 90vh; overflow: auto; }
.tier { border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; margin: 8px 0; }
.tier.default { border-color: var(--primary); }
.tier b { color: var(--accent); }
.brand a { color: inherit; text-decoration: none; }
label.check { display: inline-flex; gap: 6px; align-items: center; margin-right: 12px; font-size: 14px; }