*, *::before, *::after{ box-sizing:border-box; }
html, body{ margin:0; padding:0; }

:root{
  --ink:#0B0A08; --panel:#16130E; --panel-2:#1E1A12;
  --ivory:#F3EEE2; --ivory-dim:#B9B2A2;
  --gold:#C9A24B; --gold-bright:#E4C77A; --gold-dim:#6B5A2E;
  --font-display:'Bebas Neue','Segoe UI',Arial,sans-serif;
  --font-body:'DM Sans',Verdana,sans-serif;
}

html, body{ background:var(--ink); color:var(--ivory); font-family:var(--font-body); font-size:16px; line-height:1.6; }
h1,h2{ font-family:var(--font-display); letter-spacing:2px; text-transform:uppercase; font-weight:400; margin:0 0 6px 0; }
h1{ font-size:30px; }
h2{ font-size:18px; color:var(--gold); letter-spacing:1.5px; margin-top:0; }
label{ display:block; font-size:13px; letter-spacing:1px; color:var(--ivory-dim); margin-bottom:4px; }
input, select, textarea{
  width:100%; background:var(--panel-2); border:1px solid var(--gold-dim); color:var(--ivory);
  padding:9px 10px; font-family:var(--font-body); font-size:15px; border-radius:2px;
}
textarea{ resize:vertical; min-height:56px; }
.wrap{ max-width:900px; margin:0 auto; padding:40px 20px 80px 20px; }
.card{ background:var(--panel); border:1px solid var(--gold-dim); padding:24px; margin-bottom:20px; }
.field{ margin-bottom:16px; }
.row{ display:flex; gap:16px; flex-wrap:wrap; }
.row > .field{ flex:1; min-width:200px; }

.positions-head, .position-row{
  display:grid; grid-template-columns: 3fr 1fr 1fr 1fr auto; gap:10px; align-items:center;
}
.positions-head{ font-size:12px; letter-spacing:1px; color:var(--ivory-dim); margin-bottom:6px; }
.position-row{ margin-bottom:8px; }
.position-row .line-total{ color:var(--gold); font-family:var(--font-display); letter-spacing:1px; }
.remove-row{ background:transparent; border:1px solid var(--gold-dim); color:var(--ivory-dim); cursor:pointer; padding:6px 10px; }
.remove-row:hover{ border-color:var(--gold); color:var(--gold); }

.btn{
  display:inline-block; font-family:var(--font-display); letter-spacing:2px; font-size:14px;
  color:var(--ink); background:var(--gold); border:1px solid var(--gold); padding:11px 22px; cursor:pointer;
}
.btn:hover{ background:var(--gold-bright); border-color:var(--gold-bright); }
.btn-outline{ background:transparent; color:var(--gold); }
.btn-outline:hover{ background:var(--gold); color:var(--ink); }

.sum-line{ display:flex; justify-content:flex-end; gap:16px; align-items:baseline; margin-top:10px; }
.sum-line .amount{ font-family:var(--font-display); font-size:26px; color:var(--gold); letter-spacing:1px; }

.checkbox-row{ display:flex; gap:24px; flex-wrap:wrap; }
.checkbox-row label{ display:flex; align-items:center; gap:8px; color:var(--ivory); font-size:15px; }
.checkbox-row input{ width:auto; }

.note{ font-size:12px; color:var(--ivory-dim); margin-top:6px; }
.status{ font-size:13px; margin-top:10px; min-height:18px; }
.status.ok{ color:var(--gold); }
.status.err{ color:#e08a6b; }