@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Space+Grotesk:wght@500;700&display=swap');

:root { --ink:#17231f; --muted:#6b7872; --paper:#f6f5ef; --panel:#fffef9; --line:#d9ded6; --accent:#d95f3f; --accent-dark:#a9422c; --mint:#dcebe1; --shadow:0 18px 50px rgba(23,35,31,.09); }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:radial-gradient(circle at 12% 0%, #e1eee3 0 18%, transparent 40%), linear-gradient(135deg,#f6f5ef,#edf2eb); font-family:'DM Sans',sans-serif; }
.shell { width:min(1120px,calc(100% - 32px)); margin:0 auto; padding:48px 0 72px; }
.login-panel { width:min(470px,100%); margin:10vh auto 0; padding:42px; background:var(--panel); border:1px solid var(--line); box-shadow:var(--shadow); }
.eyebrow { margin:0 0 10px; color:var(--accent-dark); font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
h1,h2 { margin:0; font-family:'Space Grotesk',sans-serif; letter-spacing:0; } h1 { font-size:clamp(2rem,5vw,3.8rem); line-height:1.03; } h2 { font-size:1.7rem; }
.muted { color:var(--muted); line-height:1.6; } .stack { display:grid; gap:16px; margin-top:28px; }
label { display:grid; gap:7px; color:var(--muted); font-size:.9rem; font-weight:500; } input,textarea,select { width:100%; border:1px solid var(--line); padding:13px 14px; color:var(--ink); background:#fff; font:inherit; } .entry-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:30px; padding:20px; background:var(--mint); border:1px solid var(--line); } .entry-form label:nth-last-of-type(1), .entry-form button { grid-column:span 2; }
button { border:0; padding:12px 18px; color:#fff; background:var(--accent); font:700 .9rem 'DM Sans',sans-serif; cursor:pointer; } button:hover { background:var(--accent-dark); } button.quiet { color:var(--ink); background:transparent; border:1px solid var(--line); } button.quiet:hover { background:var(--mint); }
.topbar { display:flex; align-items:end; justify-content:space-between; gap:20px; padding-bottom:34px; border-bottom:1px solid var(--line); }.topbar h1 { font-size:2.3rem; }
.tabs { display:flex; gap:24px; margin:26px 0 42px; border-bottom:1px solid var(--line); }.tabs button { padding:0 0 13px; color:var(--muted); background:transparent; border-bottom:3px solid transparent; }.tabs button.active { color:var(--ink); border-color:var(--accent); }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:22px; }.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; }.card,.row { background:var(--panel); border:1px solid var(--line); }.card { padding:22px; min-height:140px; }.card h3 { margin:8px 0; font-family:'Space Grotesk',sans-serif; }.card p { margin:0; color:var(--muted); }.cost-total { display:flex; justify-content:space-between; gap:12px; margin:22px 0 12px; padding-top:12px; border-top:1px solid var(--line); font-size:.85rem; color:var(--muted); }.cost-total strong { color:var(--ink); }.summary-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:18px; }.summary-grid span { color:var(--muted); font-size:.78rem; }.summary-grid strong { display:block; margin-top:2px; color:var(--ink); font-size:.85rem; }.document-list { display:grid; gap:7px; }.document-list div { display:flex; justify-content:space-between; gap:10px; font-size:.82rem; }.document-list span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.list { display:grid; gap:10px; }.row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 18px; }.row strong { display:block; }.row small { color:var(--muted); }.actions { display:flex; gap:8px; flex-wrap:wrap; }.notice,.error { padding:12px 14px; color:#7e2d20; background:#f9e1d9; }.notice { margin-bottom:24px; }.error { margin:0; }[hidden] { display:none !important; }
@media (max-width:640px) { .shell { width:min(100% - 22px,1120px); padding-top:24px; }.login-panel { padding:28px 22px; margin-top:5vh; }.topbar,.section-heading { align-items:start; flex-direction:column; }.tabs { gap:18px; overflow:auto; }.row { align-items:start; flex-direction:column; } }