:root{--bg: #0f1115;--panel: #1a1d24;--panel-2: #232733;--text: #e8eaed;--muted: #9aa0aa;--accent: #4f8cff;--accent-press: #3a72db;--error: #ff6b6b;--notice: #ffd166;--ok: #4ade80;--border: #2c313c;--radius: 10px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:15px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.screen{min-height:100%;padding:24px}.screen.center{display:grid;place-items:center}.card{width:100%;max-width:420px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;gap:14px}h1{margin:0;font-size:22px}.muted{color:var(--muted);margin:0}.field{display:flex;flex-direction:column;gap:6px}.field span{font-size:13px;color:var(--muted)}input,select{background:var(--panel-2);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:10px 12px;font:inherit}input:focus,select:focus{outline:none;border-color:var(--accent)}button{font:inherit;cursor:pointer;border-radius:8px;border:1px solid transparent;padding:10px 14px}button.primary{background:var(--accent);color:#fff}button.primary:hover{background:var(--accent-press)}button.primary:disabled{opacity:.6;cursor:default}button.link{background:none;color:var(--accent);border:none;padding:4px}.error{color:var(--error);margin:0}.notice{color:var(--notice);margin:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:900px;margin:0 auto 20px}.topbar h1{font-size:20px}.panel{max-width:900px;margin:0 auto 16px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:20px 24px}.panel h2{margin:0 0 12px;font-size:16px}.ok{color:var(--ok)}.kv{list-style:none;margin:0;padding:0;display:grid;gap:10px}.kv li{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid var(--border);padding-bottom:8px}.kv li:last-child{border-bottom:none;padding-bottom:0}.kv span{color:var(--muted)}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.panel-head h2{margin:0}.stats{max-width:900px;margin:0 auto 16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.stat{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px;display:flex;flex-direction:column;gap:4px}.stat-num{font-size:28px;font-weight:700}.stat-label{color:var(--muted);font-size:13px}button.secondary{background:var(--panel-2);color:var(--text);border:1px solid var(--border)}button.secondary:hover{border-color:var(--accent)}button.danger{background:transparent;color:var(--error);border:1px solid var(--error)}button.danger:hover{background:#ff6b6b1f}button:disabled{opacity:.5;cursor:default}.row{display:flex;gap:8px;margin-bottom:12px}.row input{flex:1}.props{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px}.props label{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;cursor:pointer}.prop-main{flex:1}.tag{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.tag.pending{color:var(--accent)}.tag.sent{color:var(--ok)}.tag.skipped{color:var(--notice)}.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.viewbar{max-width:900px;margin:0 auto 16px;padding:10px 0;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.seg{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden}.seg button{background:var(--panel);color:var(--muted);border:none;border-radius:0;padding:8px 14px}.seg button.seg-on{background:var(--accent);color:#fff}.viewas{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}.viewas select{padding:6px 10px}.preview-tag{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--notice);border:1px solid var(--notice);border-radius:6px;padding:2px 6px}.grid{width:100%;border-collapse:collapse;font-size:13px}.grid th,.grid td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--border);vertical-align:middle}.grid th{color:var(--muted);font-weight:600}.grid th.num,.grid td.num{text-align:right}.grid tbody tr:hover{background:var(--panel-2)}.grid button{padding:5px 10px;font-size:13px}.assign-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.assign-controls .qty{width:70px}.caps{display:flex;align-items:flex-end;gap:12px;margin-top:14px;flex-wrap:wrap}.caps .field{flex:1;min-width:160px}.caps input{width:100%}
