/* Shared widget styles. Anything every widget benefits from goes here:
   base reset, font stack, color tokens, "stale" utility. Widget-specific
   layout lives in each widget's own styles.css. */

:root {
    color-scheme: light dark;
    --widget-font:
        -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial,
        sans-serif;
    --widget-fg: #253746;
    --widget-muted: #555;
    --widget-bg: transparent;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    font-family: var(--widget-font);
    background: var(--widget-bg);
}

/* Visual cue that the displayed data is stale: the most recent refresh
   failed and we're showing the last known good value. Widgets toggle this
   class on their root element. */
.stale {
    opacity: 0.55;
    transition: opacity 0.3s ease;
}