:root {
    --ink: #0b0f4f;
    --ink-2: #242b78;
    --orange: #3346c8;
    --orange-dark: #202f99;
    --cream: #f1f3ff;
    --paper: #fafbff;
    --line: #dfe3f4;
    --muted: #66708c;
    --shadow: 0 18px 50px rgba(11, 15, 79, .12);
}

body { background: var(--paper); }
.site-header { border-color: rgba(11, 15, 79, .09); background: rgba(250, 251, 255, .95); }
.brand { gap: 10px; font-size: 13px; letter-spacing: .08em; }
.brand-logo { width: 42px; height: 42px; flex: 0 0 42px; object-fit: contain; }
.brand.inverse .brand-logo { padding: 5px; border-radius: 11px; background: #fff; }
.hero-visual { background: #cbd4ff; }
.hero-visual::after { background: linear-gradient(90deg, rgba(241, 243, 255, .24), transparent 34%); }
.value-strip, .location { background: #0b0f4f; }
.value-strip b, .value-strip small, .location p { color: #cbd4ff; }
.option-list label:has(input:checked) { background: #f2f4ff; }
.product-options legend small { background: #e4e8ff; }
.story-section, .page-shell { background: #f1f3ff; }
.tracking-page { background: linear-gradient(180deg, #0b0f4f 0, #0b0f4f 360px, #f1f3ff 360px); }
.payment-callout, .kds-note { background: #eef1ff; }
footer { background: #070a36; color: #aeb8e8; }
.brand.inverse small, footer .brand small { color: #cbd4ff; }
.login-visual { background-image: linear-gradient(0deg, rgba(7, 10, 54, .84), rgba(11, 15, 79, .2)), url('https://images.unsplash.com/photo-1556910103-1c02745aae4d?auto=format&fit=crop&w=1400&q=90'); }
.login-visual span { color: #cbd4ff; }
.admin-body { background: #f5f6fc; }
.admin-sidebar { background: #0b0f4f; color: #b7c0ed; }
.admin-sidebar nav a.active { background: #202a72; }
.admin-sidebar nav > span, .admin-user small { color: #8794d8; }
.admin-user { border-color: #333d8f; }
.admin-user > span { background: #3346c8; }
.metric-icon.green, .metric-icon.orange, .metric-icon.blue, .metric-icon.cream { background: #e7eaff; color: #2636a4; }
.bar-col i { background: #7180dc; }
.bar-col:last-child i { background: #0b0f4f; }
.promo-ticket { background: linear-gradient(145deg, #0b0f4f, #25349f); }
.fresh-card > span, .eta b { color: #3346c8; }
.open-card i, .live-indicator i { background: #5368d9; box-shadow: 0 0 0 4px #e1e6ff; }
.eyebrow.light { color: #cbd4ff; }

@media (max-width: 800px) {
    .brand { font-size: 11px; }
    .brand-logo { width: 36px; height: 36px; flex-basis: 36px; }
}
