* {
    all: unset;
    font-family: "JetBrainsMono Nerd Font", "Noto Sans", sans-serif;
    font-size: 14px;
}

.widget-window {
    background: transparent;
}

.panel-scroll {
    border: 1px solid alpha(@ags_fg, 0.16);
    border-radius: 16px;
    background: @ags_bg;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.48);
}

.panel {
    padding: 16px;
    color: @ags_fg;
}

.header {
    min-height: 42px;
}

.title {
    font-size: 22px;
    font-weight: 800;
}

.subtitle,
.card-subtitle {
    color: @ags_muted;
    font-size: 12px;
}

.icon-button {
    min-width: 36px;
    min-height: 36px;
    border-radius: 8px;
    color: @ags_fg;
    background: alpha(@ags_panel, 0.64);
}

.icon-button:hover,
.icon-button:focus {
    background: alpha(@ags_accent, 0.28);
}

.close {
    color: @ags_accent;
}

.card {
    padding: 14px;
    border: 1px solid alpha(@ags_fg, 0.10);
    border-radius: 12px;
    background: alpha(@ags_panel, 0.62);
}

.card-title {
    font-size: 16px;
    font-weight: 800;
}

.metric {
    min-height: 45px;
}

.metric-name {
    color: @ags_fg;
    font-weight: 700;
}

.metric-value {
    color: @ags_accent;
    font-weight: 800;
}

.progress {
    min-height: 8px;
    border-radius: 999px;
    background: alpha(@ags_bg_soft, 0.70);
}

.progress-fill {
    min-height: 8px;
    border-radius: 999px;
    background: @ags_accent;
}

.meta-row {
    color: @ags_muted;
    font-size: 12px;
}

.sparkline {
    color: @ags_accent_2;
    font-size: 18px;
}

.calendar-grid {
    min-width: 280px;
}

.weekday,
.day {
    min-width: 34px;
    min-height: 30px;
    border-radius: 8px;
}

.weekday {
    color: @ags_muted;
    font-size: 12px;
    font-weight: 800;
}

.day {
    background: alpha(@ags_bg_soft, 0.42);
}

.day.today {
    color: @ags_bg;
    background: @ags_accent;
    font-weight: 900;
}

.day.muted {
    background: transparent;
}

.weather-main {
    font-size: 19px;
    font-weight: 800;
    color: @ags_accent_2;
}