:root{ --bg:#0b1220; --panel:#0f172a; --text:#e5e7eb; --muted:#93a0b4; --line:#1f2937; }
*{ box-sizing:border-box } html,body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,Arial}
.bar{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#0c1322;border-bottom:1px solid #1e293b;gap:8px;flex-wrap:wrap}
.container{max-width:1100px;margin:16px auto;padding:0 12px;display:grid;grid-template-columns:1fr;gap:16px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px}
h1,h2{margin:0 0 12px 0}
input,button,select{background:#0c1425;color:var(--text);border:1px solid #243047;border-radius:10px;padding:8px 10px}
button{cursor:pointer}
.list{list-style:none;padding:0;margin:8px 0 0 0}
.list li{padding:6px 0;border-bottom:1px dashed #1e293b}
.row-pdf{display:flex;justify-content:space-between;align-items:center;gap:8px}
.btn-del{background:#231a1a;border-color:#492b2b;color:#f4b2b2;padding:4px 8px;border-radius:8px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
fieldset{border:1px solid #1e293b;border-radius:12px;margin:10px 0;padding:10px}
legend{color:var(--muted)}
.row{display:grid;grid-template-columns:80px 1fr 140px 32px;gap:6px;margin:6px 0}
.actions{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.preview{width:100%;height:70vh;background:#0c1322;border:1px solid #1e293b;border-radius:12px}
@media(max-width:768px){.grid{grid-template-columns:1fr}.row{grid-template-columns:80px 1fr 120px 32px}.preview{height:60vh}}