:root{--bg:#0b0f14;--fg:#e6f2ff;--muted:#9bb4c9;--accent:#0ea5e9;--border:rgba(255,255,255,.12);--danger:#ef4444;--ok:#10b981;--warn:#f59e0b}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Inter,Roboto,Arial,sans-serif;line-height:1.6}
.container{max-width:1150px;margin:0 auto;padding:22px}
.header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.title-wrap h1{margin:0}
.muted{color:var(--muted)}
.small{font-size:12px}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;color:inherit;text-decoration:none;border:1px solid var(--border);padding:8px 12px;border-radius:12px;background:rgba(255,255,255,.03);cursor:pointer}
.btn:hover{background:rgba(255,255,255,.06)}
.btn.primary{border-color:rgba(14,165,233,.35);background:rgba(14,165,233,.12)}
.btn.danger{border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.1)}
.input,select{background:rgba(255,255,255,.04);border:1px solid var(--border);color:var(--fg);border-radius:12px;padding:10px 12px}
.toolbar{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:12px 0}
.toolbar .left,.toolbar .right{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tabs{display:flex;gap:8px;margin:6px 0 14px}
.tab{border:1px solid var(--border);background:rgba(255,255,255,.03);padding:8px 12px;border-radius:12px;cursor:pointer}
.tab.on{background:rgba(255,255,255,.08)}
.panel{display:none}
.panel.show{display:block}
.grid{width:100%;border-collapse:separate;border-spacing:0}
.grid thead th{position:sticky;top:0;background:rgba(255,255,255,.04);text-align:left;padding:10px;border-bottom:1px solid var(--border)}
.grid tbody td,.grid tfoot th{padding:10px;border-bottom:1px solid var(--border);vertical-align:middle}
.grid.tight thead th,.grid.tight tbody td{padding:8px}
.num{text-align:right}
.badge{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:999px;padding:2px 8px;font-size:12px}
/* Drawer */
.drawer{position:fixed;inset:0;display:none;background:rgba(0,0,0,.4);backdrop-filter:saturate(120%) blur(2px);z-index:50}
.drawer[aria-hidden="false"]{display:block}
.drawer-card{position:absolute;right:0;top:0;bottom:0;width:640px;max-width:100%;background:#0e1319;border-left:1px solid var(--border);padding:12px 14px 18px;overflow:auto}
.drawer-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.icon{background:transparent;border:1px solid var(--border);border-radius:10px;color:inherit;padding:6px 10px;cursor:pointer}
.form label{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.form input,.form select,.form textarea{background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:10px;color:var(--fg);padding:10px}
.form-actions{display:flex;gap:8px;margin-top:6px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.lines{margin:10px 0;border:1px solid var(--border);border-radius:12px;padding:8px}
.lines-head{display:grid;grid-template-columns:1fr 140px 140px 40px;gap:8px;padding:6px 8px;border-bottom:1px solid var(--border);color:var(--muted);font-size:12px}
.line{display:grid;grid-template-columns:1fr 140px 140px 40px;gap:8px;padding:6px 8px}
.line select,.line input{width:100%}
.totals{display:flex;gap:14px;align-items:center;margin-top:6px}
@media (max-width:760px){.grid-2{grid-template-columns:1fr} .drawer-card{width:100%} .lines-head,.line{grid-template-columns:1fr 90px 90px 40px}}