:root {
    --fill: 100%;
    --half-back: -50%;
    --days-week: 7;

    --view: 1328px;
    --rail-w: 8rem;
    --rail-top: calc(var(--topbar-h) + var(--space-four));

    --bg-warm: var(--warm-grey);
    --border-rule: var(--navy);
    --specialist-red: var(--subject-specialist-maths);

    --on-navy-muted: color-mix(in srgb, var(--on-navy) 62%, transparent);
    --on-navy-faint: color-mix(in srgb, var(--on-navy) 16%, transparent);
    --grid-line: color-mix(in srgb, var(--navy) 3%, transparent);
    --cog-stroke: color-mix(in srgb, var(--on-navy) 10%, transparent);
    --grid-cell: 32px;

    --radius-chip: 4px;

    --rule-accent: 2px;
    --edge-subject: 3px;
    --tick-w: 3px;
    --tick-h: 14px;
    --dot-sep: 3px;
    --sep-h: 18px;
    --logo-topbar: 19px;
    --logo-hero: 17px;
    --logo-foot: 15px;
    --logo-foot-fade: 0.7;
    --icon-btn: 34px;
    --icon-glyph: 16px;
    --avatar-chip: 32px;
    --kpi-size: 1.75rem;
    --kpi-floor: 1.75rem;
    --lh-flush: 1;
    --lh-hero: 1.06;
    --hero-measure: 22ch;
    --blurb-measure: 66ch;

    --s48: 64px;
    --axis-w: 48px;
    --col-min: 116px;
    --hour-h: 56px;
    --quiet-h: 24px;
    --meta-w: 104px;
    --mark-row: var(--space-seven);
    --dot-now: 8px;
    --dot-now-core: 3px;
    --dot-now-rise: -3px;

    --plate-aspect: 1.0986;
    --plate-h: calc(
        var(--fs-caption) * var(--lh-compact)
        + var(--space-four)
        + var(--fs-display-m) * var(--lh-hero)
        + var(--space-four)
        + var(--fs-small) * var(--lh-body));
    --plate-w: calc(var(--plate-h) * var(--plate-aspect));
    --plate-gap: var(--space-five);
    --plate-floor-h: var(--s48);
    --plate-floor-w: calc(var(--plate-floor-h) * var(--plate-aspect));
    --floor-gain: 1000;

    --cog-a: 460px;
    --cog-a-h: 372px;
    --cog-a-top: -176px;
    --cog-a-right: -120px;
    --cog-b: 176px;
    --cog-b-left: -52px;
    --cog-b-bottom: -58px;
    --hub-a: 352px 160px;
    --hub-b: 188px 306px;
    --hub-c: 472px 330px;
    --hub-d: 100px 100px;
    --spin-a: 150s;
    --spin-b: 92s;
    --spin-c: 63s;
    --spin-d: 118s;
    --turn-full: 360deg;
    --turn-back: -360deg;

    --tint-today: color-mix(in srgb, var(--navy) 4%, transparent);

    --e-entrance: cubic-bezier(0, 0, 0.2, 1);
    --t-reveal: 300ms;
    --t-stagger: 60ms;
    --reveal-drop: var(--space-two);
    --reveal-hidden: inset(0 100% 0 0);
    --reveal-shown: inset(0);
    --caret-h: 0.72em;
    --caret-gap: 0.12em;
    --caret-drop: 0.04em;
    --greeting-anim: greeting-write 620ms steps(12, end) both;
    --caret-anim: caret-retire 760ms steps(1, end) both;
    --turn-quarter: 90deg;
}

[data-theme="dark"] {
    --border-rule: hsl(216 34% 32%);
    --grid-line: color-mix(in srgb, var(--on-navy) 4%, transparent);
    --cog-stroke: color-mix(in srgb, var(--on-navy) 8%, transparent);
    --tint-today: color-mix(in srgb, var(--text-primary) 5%, transparent);
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --t-reveal: 0ms;
        --t-stagger: 0ms;
        --greeting-anim: none;
        --caret-anim: none;
    }
}