.analytics-consent {
    position: fixed;
    z-index: 10000;
    bottom: 16px;
    left: 16px;
    right: 16px;
    max-width: 600px;
    margin: 0 auto; /* with left and right set, this centres it */
    max-height: calc(100dvh - 32px);
    overflow: auto;
    padding: 20px;
    border: 1px solid #485267;
    border-radius: 16px;
    background: #141923;
    color: #f5f7fa;
    box-shadow: 0 8px 40px #0006;
    font: 14px/1.6 -apple-system, BlinkMacSystemFont, sans-serif;
}
.analytics-consent[hidden] { display: none; }
.analytics-consent p { margin: 0 0 16px; color: inherit; font: inherit; }
.analytics-consent a { color: #a8cbff; text-decoration: underline; }
.analytics-consent > div { display: flex; gap: 12px; flex-wrap: wrap; }
.analytics-consent button {
    flex: 1;
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid #71829c;
    border-radius: 8px;
    background: #232f43;
    color: #fff;
    font: inherit;
    cursor: pointer;
}
/* Phones: the banner stays until a choice is made, so it takes as little of the screen as it can. */
@media (max-width: 559px) {
    .analytics-consent {
        bottom: calc(10px + env(safe-area-inset-bottom, 0px));
        left: 10px;
        right: 10px;
        padding: 14px 16px 16px;
        font-size: 13px;
        line-height: 1.5;
    }
    .analytics-consent p { margin-bottom: 12px; }
    .analytics-consent > div { gap: 10px; }
    .analytics-consent button { padding: 8px 10px; }
}
.analytics-settings {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
/* Same look as the footer links it sits beside. */
footer .footer-col .analytics-settings { font-size: 13.5px; color: var(--text-secondary, #A8ADB8); margin-bottom: 13px; }
footer .footer-links .analytics-settings { color: var(--text-secondary, #A8ADB8); }
/* Legal pages: with a fourth entry the row of links wraps as whole items, not word by word. */
footer .footer-links { flex-wrap: wrap; row-gap: 6px; }
footer .footer-links > * { white-space: nowrap; }
footer .analytics-settings:hover { color: var(--text, #F0F2F5); }
.analytics-consent button:focus-visible, .analytics-settings:focus-visible {
    outline: 2px solid #a8cbff;
    outline-offset: 3px;
}