@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --bg:#f6f3ee;
  --surface:#ffffff;
  --surface-2:#efe9e0;
  --border:#ddd4c6;
  --text:#231f1a;
  --text-dim:#6d6255;
  --accent:#c62f28;
  --accent-2:#dd6a34;
  --accent-tint:#f8ddd8;
  --good:#2e7d4f;
  --good-tint:#dcefe2;
  --bad:#b23b3b;
  --bad-tint:#f8dede;
  --shadow: 0 1px 2px rgba(35,31,26,.06), 0 6px 20px -8px rgba(35,31,26,.18);
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#18140f;
    --surface:#221c16;
    --surface-2:#2a2219;
    --border:#3c3226;
    --text:#f3ece1;
    --text-dim:#ab9c88;
    --accent:#ff7259;
    --accent-2:#ffab6f;
    --accent-tint:#3c221c;
    --good:#63c48a;
    --good-tint:#1d3327;
    --bad:#e37b7b;
    --bad-tint:#3a1e1e;
    --shadow: 0 1px 2px rgba(0,0,0,.3), 0 10px 26px -10px rgba(0,0,0,.55);
  }
}

*{box-sizing:border-box;}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:'IBM Plex Sans', system-ui, sans-serif;
  min-height:100vh;
}
h1,h2,h3{font-family:'Oswald', system-ui, sans-serif; text-transform:uppercase; letter-spacing:.02em; margin:0;}
a{color:var(--accent);}
.num{font-family:'IBM Plex Mono', ui-monospace, monospace; font-variant-numeric:tabular-nums;}

.center-screen{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;}

.brand{display:flex; align-items:center; gap:12px; margin-bottom:22px;}
.flame{
  width:40px;height:40px;
  display:flex;align-items:center;justify-content:center; flex:none;
}
.flame img{width:100%;height:100%;object-fit:contain;}
.brand-text .company{font-size:11px; letter-spacing:.08em; color:var(--text-dim); font-weight:500; text-transform:uppercase;}
.brand-text h1{font-size:20px;}

.card{
  background:var(--surface); border:1px solid var(--border); border-radius:14px;
  box-shadow:var(--shadow); padding:28px; width:100%;
}
.card.narrow{max-width:380px;}
.card.wide{max-width:900px;}

.field{display:flex; flex-direction:column; gap:6px; margin-bottom:16px;}
.field label{font-size:12.5px; color:var(--text-dim); font-weight:500;}
.field input, .field select{
  padding:10px 12px; border-radius:9px; border:1px solid var(--border);
  background:var(--surface-2); color:var(--text); font-family:'IBM Plex Sans',sans-serif; font-size:14px;
}
.field input:focus, .field select:focus{outline:2px solid var(--accent); outline-offset:1px;}

button, .btn{
  font-family:'IBM Plex Sans',sans-serif; font-weight:600; font-size:14px;
  background:var(--accent); color:#fff; border:none; border-radius:9px;
  padding:11px 18px; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:6px;
}
button:hover, .btn:hover{background:var(--accent-2);}
.btn.secondary{background:var(--surface-2); color:var(--text); border:1px solid var(--border);}
.btn.secondary:hover{border-color:var(--accent); color:var(--accent); background:var(--surface-2);}
.btn.danger{background:var(--bad);}

.alert{padding:11px 14px; border-radius:9px; font-size:13.5px; margin-bottom:16px;}
.alert.error{background:var(--bad-tint); color:var(--bad);}
.alert.success{background:var(--good-tint); color:var(--good);}

.top-bar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px 24px; border-bottom:1px solid var(--border); background:var(--surface); flex-wrap:wrap;
}
.top-bar .who{font-size:13px; color:var(--text-dim);}
.top-bar .who strong{color:var(--text);}
.wrap{max-width:1000px; margin:0 auto; padding:28px 20px 60px;}

.grid-cards{display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr)); gap:16px; margin-top:20px;}
.tile{
  background:var(--surface); border:1px solid var(--border); border-radius:14px; box-shadow:var(--shadow);
  padding:22px; text-decoration:none; color:var(--text); display:flex; flex-direction:column; gap:8px;
}
.tile:hover{border-color:var(--accent);}
.tile .tile-title{font-family:'Oswald',sans-serif; text-transform:uppercase; font-size:15px;}
.tile .tile-sub{font-size:12.5px; color:var(--text-dim);}

table.list{width:100%; border-collapse:collapse; margin-top:14px; font-size:13.5px;}
table.list th{text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-dim); padding:8px 10px; border-bottom:1px solid var(--border);}
table.list td{padding:9px 10px; border-bottom:1px dashed var(--border);}
.pill{display:inline-flex; padding:3px 9px; border-radius:100px; font-size:11px; font-family:'IBM Plex Mono',monospace;}
.pill.admin{background:var(--accent-tint); color:var(--accent);}
.pill.estimator{background:var(--surface-2); color:var(--text-dim);}
.pill.active{background:var(--good-tint); color:var(--good);}
.pill.inactive{background:var(--bad-tint); color:var(--bad);}

form.inline{display:inline;}
.section-title{margin:30px 0 6px;}
.hint{font-size:12px; color:var(--text-dim); margin-top:-8px; margin-bottom:16px;}