:root {
  --bg: #050505;
  --surface: #0d0d0f;
  --surface-soft: #141414;
  --surface-light: #1b1b1e;
  --gold: #f5c84c;
  --gold-deep: #c49a2c;
  --muted: #a0a0a0;
  --text: #ffffff;
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0; min-height: 100vh; color: var(--text);
  font-family: "Manrope", "Segoe UI", Arial, sans-serif;
  background: radial-gradient(ellipse at 50% 18%, rgba(111,86,24,.13), transparent 40%), linear-gradient(145deg,#0b0b0c 0%,#030303 70%);
}
.shell { min-height:100vh; padding:18px 20px 10px; display:flex; flex-direction:column; }
.dashboard-header {
  min-height:94px; display:grid; grid-template-columns:1.1fr .7fr 1fr; align-items:center;
  padding:14px 32px; border:1px solid rgba(196,154,44,.42); border-radius:16px;
  background:linear-gradient(100deg,rgba(20,20,20,.97),rgba(7,7,7,.97));
  box-shadow:inset 0 0 34px rgba(196,154,44,.05),0 8px 24px rgba(0,0,0,.38); row-gap:12px;
}
.dashboard-header h1 { margin:0; font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif; font-size:52px; font-weight:400; line-height:1; letter-spacing:2px; text-shadow:0 3px 1px #5e5a50,0 7px 14px #000; }
.month { justify-self:center; display:flex; align-items:center; gap:14px; color:var(--gold); font-size:22px; letter-spacing:.5px; text-transform:uppercase; }
.calendar-icon { width:25px; height:25px; border:2px solid var(--gold); border-radius:4px; position:relative; }
.calendar-icon::before { content:""; position:absolute; left:3px; right:3px; top:6px; border-top:2px solid var(--gold); }
.calendar-icon::after { content:"··"; position:absolute; left:5px; top:5px; font-weight:900; letter-spacing:5px; }
.header-status { justify-self:end; display:flex; align-items:center; gap:42px; }
.sync { border:1px solid rgba(196,154,44,.65); border-radius:10px; padding:12px 18px; color:var(--gold); background:#121006; font:700 14px/1 "Manrope",sans-serif; white-space:nowrap; cursor:pointer; }
.sync i { display:inline-block; width:11px; height:11px; margin-right:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 12px rgba(245,200,76,.9); }
.sync:hover:not(:disabled){border-color:var(--gold);background:#211b08}.sync:disabled{cursor:wait;opacity:.82}.sync.refreshing i{animation:refresh-pulse .8s ease-in-out infinite alternate}@keyframes refresh-pulse{to{transform:scale(1.45);opacity:.45}}
.time-wrap{display:flex;flex-direction:column}.time-wrap b{color:var(--gold);font-size:38px;line-height:1;letter-spacing:1px}.time-wrap span{margin-top:5px;color:#aa985e;font-size:11px;letter-spacing:.8px}
.city-totals{grid-column:1/-1;width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.city-total{min-width:0;min-height:62px;padding:10px 14px;display:grid;grid-template-columns:auto auto minmax(130px,1fr);align-items:center;gap:16px;border:1px solid rgba(196,154,44,.42);border-radius:11px;background:linear-gradient(110deg,rgba(24,21,12,.92),rgba(8,8,8,.88))}
.city-total-heading{display:flex;flex-direction:column}.city-total-heading b{font-size:17px;line-height:1.2}.city-total-heading span{margin-top:2px;color:#8c7a43;font-size:9px;font-weight:700;letter-spacing:.8px}.city-plan{color:#fff;font-size:22px;line-height:1.2;white-space:nowrap}.city-performance{min-width:0}.city-performance>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px}.city-performance span{overflow:hidden;color:#a0a0a0;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.city-performance em{color:var(--gold);font-size:16px;font-style:normal;font-weight:800;white-space:nowrap}.city-progress{height:6px;margin-top:5px;overflow:hidden;border-radius:3px;background:#1b1b1e}.city-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--gold),#ffc94d);box-shadow:0 0 10px rgba(245,200,76,.25)}
.board{flex:1;min-height:0;margin-top:16px;padding:18px 20px;border:1px solid rgba(196,154,44,.32);border-radius:16px;background:rgba(5,5,5,.35)}
.cards-grid{height:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-content:center}
.manager-card{position:relative;min-width:0;height:220px;padding:24px;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--gold-deep);border-radius:16px;background:linear-gradient(145deg,#141414 0%,#0d0d0f 100%);box-shadow:0 8px 24px rgba(0,0,0,.4),0 0 20px rgba(196,154,44,.15);isolation:isolate}
.manager-card::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 12% 15%,rgba(245,200,76,.07),transparent 34%),repeating-linear-gradient(135deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px)}
.manager-card::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background:linear-gradient(115deg,rgba(245,200,76,.08),transparent 27%,transparent 78%,rgba(0,0,0,.15))}
.card-layout{min-height:0;flex:1;display:flex;align-items:stretch;gap:20px}.card-rank{width:clamp(72px,7vw,118px);flex:0 0 clamp(72px,7vw,118px);display:flex;align-items:center;justify-content:center;border-right:1px solid var(--gold-deep);color:#2a2a2a;font-size:clamp(82px,7vw,128px);line-height:1;text-shadow:0 1px 0 rgba(255,255,255,.015)}
.card-rank span{display:block;font-family:"Oswald","Arial Narrow",sans-serif;font-weight:300;letter-spacing:-5px;transform:scaleX(.82) scaleY(1.28)}.card-content{min-width:0;flex:1;display:flex;flex-direction:column}
.card-header h3{margin:0;overflow:hidden;color:#fff;font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif;font-size:clamp(32px,2.55vw,44px);font-weight:400;line-height:1.18;letter-spacing:.5px;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;text-shadow:none}.card-header span{display:block;margin-top:2px;color:var(--gold);font-size:18px;font-weight:500;line-height:1.4}
.card-divider{height:1px;margin:10px 0 11px;background:linear-gradient(90deg,var(--gold-deep),rgba(196,154,44,.18))}.card-body{min-height:0;display:flex;align-items:center;justify-content:space-between;gap:16px}.card-totals{min-width:0}
.card-amount{overflow:hidden;color:#fff;font-size:clamp(25px,2vw,36px);font-weight:700;line-height:1.22;letter-spacing:0;text-overflow:ellipsis;white-space:nowrap}.card-plan{margin-top:1px;overflow:hidden;color:var(--muted);font-size:15px;font-weight:400;line-height:1.5;text-overflow:ellipsis;white-space:nowrap}
.card-percent-box{min-width:96px;padding:9px 12px;display:flex;flex:0 0 auto;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(196,154,44,.8);border-radius:13px;background:rgba(7,7,7,.45)}.card-percent-box strong{color:var(--gold);font-size:28px;font-weight:800;line-height:1.14}.card-percent-box span{margin-top:3px;color:var(--gold);font-size:11px;font-weight:500;line-height:1.4}
.card-progress{height:8px;margin-top:16px;flex:0 0 8px;overflow:hidden;border-radius:4px;background:var(--surface-light);box-shadow:inset 0 1px 3px rgba(0,0,0,.7)}.card-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--gold) 0%,#ffc94d 100%);box-shadow:0 0 12px rgba(245,200,76,.25)}
.card-error{position:absolute;right:24px;bottom:9px;color:#d88676;font-size:10px;font-style:normal}.loading{grid-column:1/-1;display:grid;place-items:center;min-height:220px;color:#9b8750;font-size:18px}footer{padding-top:7px;color:#756535;font-size:13px;letter-spacing:.4px;text-align:center}
