/* The night inside the logo's ring is the day's deep colour (the inline header SVG reads --sky). */
html{--sky:var(--deep)}

/* The site takes the colour of the day's ruling graha (vara lord).
   weekday.js sets html[data-tint] to sun ... sat. Text and buttons stay ink;
   the colour shows in backgrounds, highlights and key numbers only. */
html[data-tint=sun]{--paper:#fdf6ee;--soft:#f7e7d4;--hl:#f5d3a8;--hl-ink:#0a0a0a;--glow:#f5d3a8;--strong:#a8501a;--hover:#f5d3a8;--hover-ink:#0a0a0a;--hover-mute:#75604c;--deep:#2f1c0f;--rule2:#ead8c2;--mute:#75604c}
html[data-tint=mon]{--paper:#f6f7f9;--soft:#e8ecf1;--hl:#dae2ec;--hl-ink:#0a0a0a;--glow:#dae2ec;--strong:#4a6280;--hover:#dae2ec;--hover-ink:#0a0a0a;--hover-mute:#5f6772;--deep:#1b2533;--rule2:#d9dee6;--mute:#5f6772}
html[data-tint=tue]{--paper:#fcf4f2;--soft:#f6e2de;--hl:#f2cbc3;--hl-ink:#0a0a0a;--glow:#f2cbc3;--strong:#a8362b;--hover:#f2cbc3;--hover-ink:#0a0a0a;--hover-mute:#77605c;--deep:#2f1512;--rule2:#ead5d0;--mute:#77605c}
html[data-tint=wed]{--paper:#f3f7f2;--soft:#e3ece0;--hl:#cfe3cb;--hl-ink:#0a0a0a;--glow:#cfe3cb;--strong:#3b6843;--hover:#cfe3cb;--hover-ink:#0a0a0a;--hover-mute:#5f6b60;--deep:#1c2a20;--rule2:#cfdccc;--mute:#5f6b60}
html[data-tint=thu]{--paper:#fbf7ea;--soft:#f3eacb;--hl:#efdd9c;--hl-ink:#0a0a0a;--glow:#efdd9c;--strong:#7f620b;--hover:#efdd9c;--hover-ink:#0a0a0a;--hover-mute:#6f6850;--deep:#2a230c;--rule2:#e5dcc0;--mute:#6f6850}
html[data-tint=fri]{--paper:#fcf5f8;--soft:#f5e3eb;--hl:#f0cfdd;--hl-ink:#0a0a0a;--glow:#f0cfdd;--strong:#963a62;--hover:#f0cfdd;--hover-ink:#0a0a0a;--hover-mute:#75606a;--deep:#2c1521;--rule2:#ead6df;--mute:#75606a}
html[data-tint=sat]{--paper:#f4f5fa;--soft:#e3e6f2;--hl:#cfd5ee;--hl-ink:#0a0a0a;--glow:#cfd5ee;--strong:#2f3f8f;--hover:#cfd5ee;--hover-ink:#0a0a0a;--hover-mute:#60657a;--deep:#151a36;--rule2:#d6d9e8;--mute:#60657a}

/* mock only: the bar used to preview each day's colour before approval */
.day-preview{position:fixed;right:16px;bottom:16px;z-index:999;display:flex;align-items:center;gap:6px;padding:8px 10px 8px 14px;background:#fff;color:#000;border:1px solid #000;border-radius:999px;font:500 11px/1 ui-monospace,Menlo,monospace;box-shadow:0 6px 24px rgba(0,0,0,.18)}
.day-preview span{margin-right:4px;letter-spacing:.06em;text-transform:uppercase}
.day-preview button{min-width:34px;height:26px;border-radius:13px;border:1px solid #000;cursor:pointer;font:500 10px/1 ui-monospace,Menlo,monospace;color:#000;text-transform:uppercase}
.day-preview button[aria-pressed=true]{outline:2px solid #000;outline-offset:2px}
@media (max-width:620px){.day-preview{left:8px;right:8px;justify-content:center;flex-wrap:wrap}}

/* the one-time "use your location" card (weekday.js) */
.location-prompt{position:fixed;left:16px;bottom:16px;z-index:998;max-width:380px;background:var(--paper);color:var(--ink);border:1px solid var(--ink);padding:16px 18px;box-shadow:0 10px 30px rgba(0,0,0,.14);font-size:15px;line-height:1.45}
.location-prompt div{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.location-prompt .btn{padding:8px 12px;font-size:11px}
@media (max-width:620px){.location-prompt{left:8px;right:8px;max-width:none}}