:root{--bg:#0d1017;--card:#151b28;--stroke:#2a3448;--text:#e8eefc;--muted:#a5b1cc;--brand:#30c38f;--danger:#ff6b6b}
*{box-sizing:border-box}body.admin{margin:0;background:linear-gradient(180deg,#0f1422,#0d1017);color:var(--text);font:14px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
a{color:inherit;text-decoration:none}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--stroke);backdrop-filter:saturate(160%) blur(8px)}
.brand{font-weight:800}
.wrap{width:min(1200px,92vw);margin:22px auto}
.card{background:var(--card);border:1px solid var(--stroke);border-radius:14px;box-shadow:0 10px 30px #0007;padding:18px}
.login{width:min(420px,92vw);margin:10vh auto;text-align:center}
.alert{background:#3a1e1e;border:1px solid #6b3a3a;color:#ffd1d1;padding:10px;border-radius:10px;margin:10px 0}
.btn{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--stroke);border-radius:10px;padding:8px 12px;background:var(--card)}
.btn:hover{border-color:#ffffff2a}
.btn--primary{background:linear-gradient(180deg,var(--brand),#24966c);border:none;color:#061712}
.btn.sm{padding:6px 10px}
.btn.danger{border-color:#7a3a3a;background:#361d1d;color:#ffd1d1}

.table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--stroke);border-radius:12px;overflow:hidden}
.table th,.table td{padding:10px;border-bottom:1px solid var(--stroke)}
.table th{background:#0f1422;text-align:left}
.row{margin-top:12px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
label{display:grid;gap:6px}
input,textarea,select{padding:10px 12px;border:1px solid var(--stroke);border-radius:10px;background:#0f1422;color:var(--text)}
textarea{resize:vertical}
.order{width:70px}
.form{background:var(--card);border:1px solid var(--stroke);border-radius:14px;padding:16px}
.actions{display:flex;gap:8px}

.editor-grid{display:grid;grid-template-columns:1fr 420px;gap:16px;align-items:start}
@media (max-width:1000px){.editor-grid{grid-template-columns:1fr}}

.preview-pane{position:sticky;top:18px}
.preview-pane h3{margin:0 0 10px 0}
.preview-card-wrap{border:1px dashed var(--stroke);border-radius:14px;padding:12px;background:#0b0f1a}
.preview-card-wrap .card{margin:0}

.hint{color:var(--muted);margin:6px 0 0}
.row-inline{display:flex;gap:8px;align-items:center}