:root{--bg: #0f1116;--panel: #171a21;--panel-2: #1e222b;--border: #2a2f3a;--text: #e6e9ef;--muted: #8b93a3;--accent: #6d5efc;--accent-2: #8b7bff;--ok: #2ec16b;--warn: #e0a63c;--err: #e5484d;--radius: 12px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}button{font:inherit;cursor:pointer;border:1px solid var(--border);background:var(--panel-2);color:var(--text);padding:9px 16px;border-radius:9px;transition:background .15s,border-color .15s,opacity .15s}button:hover{background:#262b36}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.primary:hover{background:var(--accent-2)}button.danger{border-color:#4a2a2d;color:#ff9ea1}button.danger:hover{background:#2a1c1e}button.ghost{background:transparent}input,textarea,select{font:inherit;width:100%;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:9px;padding:9px 12px}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent)}textarea{resize:vertical;min-height:90px}label{display:block;font-size:13px;color:var(--muted);margin:0 0 5px}.app{max-width:1080px;margin:0 auto;padding:0 20px 60px}.topbar{display:flex;align-items:center;gap:18px;padding:16px 0;border-bottom:1px solid var(--border);margin-bottom:22px;position:sticky;top:0;background:var(--bg);z-index:5}.brand{font-weight:700;font-size:18px;letter-spacing:.2px}.brand span{color:var(--accent-2)}.nav{display:flex;gap:6px;margin-left:6px}.nav button{padding:7px 14px;background:transparent;border-color:transparent;color:var(--muted)}.nav button.active{color:var(--text);background:var(--panel);border-color:var(--border)}.spacer{flex:1}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:20px;margin-bottom:18px}.card h2{margin:0 0 4px;font-size:16px}.card .hint{color:var(--muted);font-size:13px;margin:0 0 16px}.row{display:flex;gap:14px;flex-wrap:wrap}.row>*{flex:1;min-width:160px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}.clip-card{background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.clip-card video,.clip-card img{width:100%;aspect-ratio:9/16;object-fit:cover;background:#000;display:block}.clip-card .meta{padding:10px 12px}.clip-card .meta .title{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.clip-card .meta .sub{font-size:12px;color:var(--muted)}.clip-card .actions{display:flex;gap:8px;padding:0 12px 12px}.clip-card .actions button{flex:1;padding:7px;font-size:13px}.badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:600}.badge.queued{background:#22262f;color:var(--muted)}.badge.creating,.badge.processing,.badge.publishing{background:#2a2610;color:var(--warn)}.badge.published{background:#10251a;color:var(--ok)}.badge.error{background:#2a1315;color:var(--err)}.badge.canceled{background:#22262f;color:var(--muted)}.alert{border-radius:9px;padding:11px 14px;font-size:14px;margin-bottom:14px}.alert.err{background:#2a1315;color:#ff9ea1;border:1px solid #4a2a2d}.alert.ok{background:#10251a;color:#7ee2a8;border:1px solid #1d3a2a}.alert.info{background:#14203a;color:#9fc0ff;border:1px solid #24345a}.jobs-table{width:100%;border-collapse:collapse}.jobs-table th,.jobs-table td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--border);font-size:13px;vertical-align:middle}.jobs-table th{color:var(--muted);font-weight:600}.jobs-table img{width:40px;aspect-ratio:9/16;object-fit:cover;border-radius:6px}.login-wrap{min-height:100vh;display:grid;place-items:center}.login-card{width:340px}.muted{color:var(--muted)}.stack>*+*{margin-top:12px}.flex{display:flex;align-items:center;gap:10px}.right{margin-left:auto}a{color:var(--accent-2)}code{background:var(--panel-2);padding:1px 6px;border-radius:5px;font-size:13px}.checkbox{display:flex;align-items:center;gap:8px}.checkbox input{width:auto}progress{width:100%;height:8px}