/* _content/Home/Components/Account/Login.razor.rz.scp.css */
.login[b-1030anze7r] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: var(--h-space-4);
    background:
        radial-gradient(900px 480px at 80% -10%, rgba(232, 177, 76, 0.14), transparent 60%),
        radial-gradient(800px 520px at 6% 8%, rgba(95, 168, 211, 0.12), transparent 55%),
        linear-gradient(168deg, var(--h-ink-700) 0%, var(--h-ink-800) 48%, var(--h-ink-900) 100%);
}

.login__card[b-1030anze7r] {
    width: 100%;
    max-width: 25rem;
    padding: clamp(1.75rem, 4vw, 2.5rem);
    background: var(--h-surface);
    backdrop-filter: blur(10px);
    border: 1px solid var(--h-border);
    box-shadow: var(--h-shadow-lg);
    border-radius: var(--h-radius-xl);
}

.login__brand[b-1030anze7r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: var(--h-space-6);
}

.login__mark[b-1030anze7r] {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    margin-bottom: var(--h-space-3);
    border-radius: var(--h-radius-lg);
    background: linear-gradient(140deg, var(--h-green), var(--h-sky));
    color: var(--h-ink-900);
    font-family: var(--h-font-display);
    font-size: 1.5rem;
    font-weight: var(--h-weight-bold);
}

.login__title[b-1030anze7r] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-2xl);
    font-weight: var(--h-weight-bold);
    letter-spacing: -0.01em;
    color: var(--h-text);
    line-height: var(--h-leading-tight);
}

.login__subtitle[b-1030anze7r] {
    margin: 0.125rem 0 0;
    color: var(--h-text-faint);
    font-size: var(--h-text-xs);
    font-weight: var(--h-weight-medium);
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

.login__error[b-1030anze7r] { margin-bottom: var(--h-space-4); }

.login__form[b-1030anze7r] { display: block; }

.login__submit[b-1030anze7r] {
    width: 100%;
    padding: 0.7rem 1rem;
    margin-top: var(--h-space-2);
    font-size: var(--h-text-md);
}

@media (max-width: 420px) {
    .login__card[b-1030anze7r] { padding: 1.5rem 1.25rem; }
}
/* _content/Home/Components/Admin/UserEditor.razor.rz.scp.css */
.editor[b-xs26o33gsx] {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - var(--h-appbar-height) - 3rem);
    background: var(--h-surface-solid);
    border: 1px solid var(--h-border-strong);
    border-radius: var(--h-radius-lg);
    box-shadow: var(--h-shadow-md);
    overflow: hidden;
}

.editor__head[b-xs26o33gsx] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-4);
    border-bottom: 1px solid var(--h-border);
}

.editor__title[b-xs26o33gsx] {
    flex: 1;
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-semi);
    color: var(--h-text);
}

.editor__msg[b-xs26o33gsx] { margin: var(--h-space-3) var(--h-space-4) 0; }

.editor__body[b-xs26o33gsx] { padding: var(--h-space-4); overflow-y: auto; flex: 1; scrollbar-width: thin; }

.editor__section[b-xs26o33gsx] { padding-bottom: var(--h-space-5); margin-bottom: var(--h-space-5); border-bottom: 1px solid var(--h-border); }
.editor__section:last-child[b-xs26o33gsx] { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }

.editor__section-title[b-xs26o33gsx] {
    margin: 0 0 var(--h-space-3);
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.editor__section--danger .editor__section-title[b-xs26o33gsx] { color: var(--h-danger); }
.editor__danger-hint[b-xs26o33gsx] { margin-top: 0; margin-bottom: var(--h-space-3); }

/* Avatar */
.editor__avatar[b-xs26o33gsx] { display: flex; align-items: center; gap: var(--h-space-4); }
.editor__avatar-actions[b-xs26o33gsx] { display: flex; flex-wrap: wrap; align-items: center; gap: var(--h-space-2); }

.editor__upload[b-xs26o33gsx] { position: relative; overflow: hidden; cursor: pointer; }

/* Native file input is hidden but still receives the click, keeping keyboard access. */
.editor__file[b-xs26o33gsx] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    font-size: 0;
}

.editor__avatar-actions .h-hint[b-xs26o33gsx] { flex: 1 1 100%; margin-top: 0; }

/* Colour */
.editor__colour[b-xs26o33gsx] { display: flex; align-items: center; gap: var(--h-space-2); }

.editor__swatch[b-xs26o33gsx] {
    flex: 0 0 auto;
    width: 2.75rem;
    height: 2.4rem;
    padding: 2px;
    border: 1px solid var(--h-border-strong);
    border-radius: var(--h-radius-md);
    background: var(--h-surface-sunk);
    cursor: pointer;
}

.editor__check[b-xs26o33gsx] {
    display: inline-flex;
    align-items: center;
    gap: var(--h-space-2);
    color: var(--h-text);
    font-size: var(--h-text-md);
    cursor: pointer;
}

.editor__check input[b-xs26o33gsx] { width: 1rem; height: 1rem; accent-color: var(--h-accent); cursor: pointer; }

.editor__empty[b-xs26o33gsx] { color: var(--h-text-faint); font-size: var(--h-text-sm); font-style: italic; margin: 0 0 var(--h-space-3); }

/* Feeds */
.feeds[b-xs26o33gsx] { list-style: none; margin: 0 0 var(--h-space-4); padding: 0; display: flex; flex-direction: column; gap: var(--h-space-2); }

.feed[b-xs26o33gsx] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-3);
    background: var(--h-surface-sunk);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-md);
}

.feed__main[b-xs26o33gsx] { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; flex: 1; }

.feed__name[b-xs26o33gsx] { color: var(--h-text); font-size: var(--h-text-md); font-weight: var(--h-weight-medium); }

.feed__url[b-xs26o33gsx] {
    color: var(--h-text-faint);
    font-family: var(--h-font-mono);
    font-size: var(--h-text-2xs);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.feed__status[b-xs26o33gsx] { font-size: var(--h-text-xs); color: var(--h-text-dim); }
.feed__status--ok[b-xs26o33gsx] { color: var(--h-success); }
.feed__status--bad[b-xs26o33gsx] { color: var(--h-danger); }
.feed__status--off[b-xs26o33gsx] { color: var(--h-text-faint); }

.feed__error[b-xs26o33gsx] {
    color: var(--h-danger);
    font-size: var(--h-text-2xs);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.feed__actions[b-xs26o33gsx] { display: flex; gap: var(--h-space-1); flex-wrap: wrap; }
.feed__remove[b-xs26o33gsx] { color: var(--h-danger); }

.feed__add[b-xs26o33gsx] {
    padding: var(--h-space-3);
    background: var(--h-surface-sunk);
    border: 1px dashed var(--h-border-strong);
    border-radius: var(--h-radius-md);
}

.feed__add .h-field:last-of-type[b-xs26o33gsx] { margin-bottom: var(--h-space-3); }

@media (max-width: 900px) {
    .editor[b-xs26o33gsx] {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1300;
        max-height: 88vh;
        border-radius: var(--h-radius-xl) var(--h-radius-xl) 0 0;
        border-bottom: 0;
        box-shadow: var(--h-shadow-lg);
    }

    .editor__body[b-xs26o33gsx] { padding-bottom: calc(var(--h-space-4) + env(safe-area-inset-bottom)); }
}
/* _content/Home/Components/Calendar/AgendaList.razor.rz.scp.css */
.agenda[b-btent24et7] {
    display: none;
    flex-direction: column;
    gap: var(--h-space-4);
}

/* The agenda is the mobile presentation; the month grid handles wider screens. */
@media (max-width: 900px) {
    .agenda[b-btent24et7] { display: flex; }
}

.agenda__empty[b-btent24et7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-7) var(--h-space-4);
    text-align: center;
    background: var(--h-surface);
    border: 1px dashed var(--h-border-strong);
    border-radius: var(--h-radius-lg);
}

.agenda__empty-title[b-btent24et7] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    color: var(--h-text);
}

.agenda__empty-detail[b-btent24et7] { margin: 0 0 var(--h-space-2); color: var(--h-text-dim); font-size: var(--h-text-sm); }

.agenda__day[b-btent24et7] { display: flex; flex-direction: column; gap: var(--h-space-2); }

.agenda__head[b-btent24et7] {
    display: flex;
    align-items: baseline;
    gap: var(--h-space-2);
    padding-bottom: var(--h-space-1);
    border-bottom: 1px solid var(--h-border);
}

.agenda__date[b-btent24et7] { display: flex; align-items: baseline; gap: 0.35rem; }

.agenda__dow[b-btent24et7] {
    font-family: var(--h-font-body);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--h-text-faint);
}

.agenda__dom[b-btent24et7] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-xl);
    font-weight: var(--h-weight-bold);
    color: var(--h-text);
    line-height: 1;
}

.agenda__day--today .agenda__dom[b-btent24et7],
.agenda__day--today .agenda__dow[b-btent24et7] { color: var(--h-info); }

.agenda__month[b-btent24et7] { color: var(--h-text-dim); font-size: var(--h-text-sm); }

.agenda__today[b-btent24et7] {
    padding: 0.1rem 0.45rem;
    border-radius: var(--h-radius-pill);
    background: var(--h-today-wash);
    color: var(--h-info);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.agenda__add[b-btent24et7] {
    margin-left: auto;
    width: 1.75rem;
    height: 1.75rem;
    display: grid;
    place-items: center;
    border: 1px solid var(--h-border-strong);
    border-radius: var(--h-radius-md);
    background: transparent;
    color: var(--h-text-dim);
    font-size: var(--h-text-md);
    line-height: 1;
    cursor: pointer;
}

.agenda__add:hover[b-btent24et7] { background: var(--h-surface-hover); color: var(--h-text); }

/* Folds the days already gone this month, so the list opens on today. */
.agenda__earlier[b-btent24et7] {
    align-self: stretch;
    justify-content: center;
    border: 1px dashed var(--h-border-strong);
    color: var(--h-text-dim);
    font-size: var(--h-text-sm);
}

/* Today with no events still gets its section, so there is always a "today" to land on. */
.agenda__none[b-btent24et7] {
    margin: 0;
    padding: var(--h-space-2) var(--h-space-3);
    color: var(--h-text-faint);
    font-size: var(--h-text-sm);
}

.agenda__list[b-btent24et7] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--h-space-1); }

.row[b-btent24et7] {
    display: flex;
    align-items: stretch;
    gap: var(--h-space-3);
    width: 100%;
    padding: var(--h-space-2) var(--h-space-3);
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-md);
    color: var(--h-text);
    text-align: left;
    cursor: pointer;
    /* Comfortable touch target on a phone. */
    min-height: 3rem;
    transition: background var(--h-duration-fast) var(--h-ease);
}

.row:hover[b-btent24et7], .row:active[b-btent24et7] { background: var(--h-surface-hover); }

.row__bar[b-btent24et7] {
    flex: 0 0 auto;
    width: 3px;
    border-radius: var(--h-radius-pill);
    background: var(--person);
}

.row__body[b-btent24et7] { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; flex: 1; }

.row__title[b-btent24et7] {
    font-size: var(--h-text-md);
    font-weight: var(--h-weight-medium);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.row__meta[b-btent24et7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    color: var(--h-text-faint);
    font-size: var(--h-text-xs);
}

.row__time[b-btent24et7] { font-family: var(--h-font-mono); color: var(--h-text-dim); }

.row__owner[b-btent24et7] {
    color: var(--person);
    font-weight: var(--h-weight-medium);
}

.row__where[b-btent24et7] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.row__feed[b-btent24et7] { flex: 0 0 auto; align-self: center; font-size: 0.75rem; opacity: 0.6; }
/* _content/Home/Components/Calendar/CalendarDayView.razor.rz.scp.css */
.cell[b-zbltuxq5x9] {
    display: flex;
    flex-direction: column;
    min-height: 7.5rem;
    padding: var(--h-space-1);
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-md);
    overflow: hidden;
    transition: border-color var(--h-duration-fast) var(--h-ease);
}

.cell:hover[b-zbltuxq5x9] { border-color: var(--h-border-strong); }

.cell--outside[b-zbltuxq5x9] { background: transparent; }
.cell--outside .cell__num[b-zbltuxq5x9] { color: var(--h-outside-month); }

.cell--today[b-zbltuxq5x9] {
    background: var(--h-today-wash);
    border-color: var(--h-info);
}

.cell__head[b-zbltuxq5x9] {
    display: flex;
    align-items: center;
    gap: var(--h-space-1);
    padding: 0 var(--h-space-1) var(--h-space-1);
}

.cell__num[b-zbltuxq5x9] {
    font-family: var(--h-font-mono);
    font-size: var(--h-text-xs);
    font-weight: var(--h-weight-semi);
    color: var(--h-text-dim);
    line-height: 1;
}

.cell--today .cell__num[b-zbltuxq5x9] { color: var(--h-info); }

.cell__month[b-zbltuxq5x9] {
    font-size: var(--h-text-2xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--h-text-faint);
}

.cell__add[b-zbltuxq5x9] {
    margin-left: auto;
    width: 1.15rem;
    height: 1.15rem;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: var(--h-radius-sm);
    background: transparent;
    color: var(--h-text-faint);
    font-size: var(--h-text-sm);
    line-height: 1;
    cursor: pointer;
    opacity: 0;
    transition: opacity var(--h-duration-fast) var(--h-ease);
}

.cell:hover .cell__add[b-zbltuxq5x9],
.cell__add:focus-visible[b-zbltuxq5x9] { opacity: 1; }
.cell__add:hover[b-zbltuxq5x9] { background: var(--h-surface-hover); color: var(--h-text); }

.cell__events[b-zbltuxq5x9] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow-y: auto;
    flex: 1;
    scrollbar-width: thin;
}

.chip[b-zbltuxq5x9] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    width: 100%;
    padding: 0.2rem 0.35rem;
    border: 0;
    border-radius: var(--h-radius-sm);
    background: transparent;
    color: var(--h-text);
    font-family: var(--h-font-body);
    font-size: var(--h-text-2xs);
    text-align: left;
    cursor: pointer;
    transition: background var(--h-duration-fast) var(--h-ease);
}

.chip:hover[b-zbltuxq5x9] { background: var(--h-surface-hover); }

.chip--allday[b-zbltuxq5x9] {
    background: color-mix(in srgb, var(--person) 22%, transparent);
}

.chip--allday:hover[b-zbltuxq5x9] {
    background: color-mix(in srgb, var(--person) 34%, transparent);
}

.chip__dot[b-zbltuxq5x9] {
    flex: 0 0 auto;
    width: 3px;
    height: 0.85rem;
    border-radius: var(--h-radius-pill);
    background: var(--person);
}

.chip__time[b-zbltuxq5x9] {
    flex: 0 0 auto;
    font-family: var(--h-font-mono);
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
}

.chip__title[b-zbltuxq5x9] {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chip__badge[b-zbltuxq5x9] { flex: 0 0 auto; font-size: 0.7rem; }
/* _content/Home/Components/Calendar/EventPanel.razor.rz.scp.css */
.panel[b-kn8w3dbu3b] {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - var(--h-appbar-height) - 3rem);
    background: var(--h-surface-solid);
    border: 1px solid var(--h-border-strong);
    border-radius: var(--h-radius-lg);
    box-shadow: var(--h-shadow-md);
    overflow: hidden;
}

.panel__head[b-kn8w3dbu3b] {
    display: flex;
    align-items: flex-start;
    gap: var(--h-space-2);
    padding: var(--h-space-4);
    border-bottom: 1px solid var(--h-border);
}

.panel__heading[b-kn8w3dbu3b] { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; flex: 1; }

.panel__title[b-kn8w3dbu3b] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-semi);
    color: var(--h-text);
    line-height: var(--h-leading-tight);
}

.panel__badge[b-kn8w3dbu3b] {
    align-self: flex-start;
    padding: 0.15rem 0.5rem;
    border-radius: var(--h-radius-pill);
    background: color-mix(in srgb, var(--person) 20%, transparent);
    color: var(--person);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.03em;
}

.panel__error[b-kn8w3dbu3b], .panel__note[b-kn8w3dbu3b] { margin: var(--h-space-3) var(--h-space-4) 0; }

.panel__body[b-kn8w3dbu3b] {
    padding: var(--h-space-4);
    overflow-y: auto;
    flex: 1;
    scrollbar-width: thin;
}

.panel__row[b-kn8w3dbu3b] { display: grid; grid-template-columns: 1fr auto; gap: var(--h-space-3); }
.panel__row .h-field[b-kn8w3dbu3b] { margin-bottom: var(--h-space-4); }

.panel__check[b-kn8w3dbu3b] {
    display: inline-flex;
    align-items: center;
    gap: var(--h-space-2);
    color: var(--h-text);
    font-size: var(--h-text-md);
    cursor: pointer;
}

.panel__check input[b-kn8w3dbu3b] { width: 1rem; height: 1rem; accent-color: var(--h-accent); cursor: pointer; }

.panel__foot[b-kn8w3dbu3b] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-3) var(--h-space-4);
    border-top: 1px solid var(--h-border);
    background: var(--h-surface-sunk);
}

.panel__spacer[b-kn8w3dbu3b] { flex: 1; }

.panel__spinner[b-kn8w3dbu3b] { width: 14px; height: 14px; border-width: 2px; }

/* ---- Read-only view ---- */

.view__title[b-kn8w3dbu3b] {
    margin: 0 0 var(--h-space-2);
    font-family: var(--h-font-display);
    font-size: var(--h-text-xl);
    font-weight: var(--h-weight-bold);
    color: var(--h-text);
    line-height: var(--h-leading-tight);
}

.view__when[b-kn8w3dbu3b] { display: flex; flex-direction: column; gap: 0.2rem; margin-bottom: var(--h-space-4); }

.view__when-main[b-kn8w3dbu3b] {
    color: var(--h-text-dim);
    font-family: var(--h-font-mono);
    font-size: var(--h-text-sm);
}

.view__repeat[b-kn8w3dbu3b] { color: var(--h-text-faint); font-size: var(--h-text-xs); }

.view__facts[b-kn8w3dbu3b] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--h-space-2) var(--h-space-4);
    margin: 0 0 var(--h-space-5);
}

.view__facts dt[b-kn8w3dbu3b] {
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding-top: 0.15rem;
}

.view__facts dd[b-kn8w3dbu3b] { margin: 0; color: var(--h-text); font-size: var(--h-text-md); }

.view__person[b-kn8w3dbu3b] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--person);
    font-weight: var(--h-weight-medium);
}

.view__person[b-kn8w3dbu3b]::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: var(--h-radius-pill);
    background: var(--person);
}

.view__block[b-kn8w3dbu3b] { margin-bottom: var(--h-space-4); }

.view__block-title[b-kn8w3dbu3b] {
    margin: 0 0 var(--h-space-1);
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.view__text[b-kn8w3dbu3b] {
    margin: 0;
    color: var(--h-text);
    font-size: var(--h-text-md);
    line-height: var(--h-leading-normal);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.view__empty[b-kn8w3dbu3b] { margin: 0; color: var(--h-text-faint); font-size: var(--h-text-sm); font-style: italic; }

/* ---- Mobile: bottom sheet ---- */
@media (max-width: 900px) {
    .panel[b-kn8w3dbu3b] {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1300;
        max-height: 85vh;
        border-radius: var(--h-radius-xl) var(--h-radius-xl) 0 0;
        border-bottom: 0;
        box-shadow: var(--h-shadow-lg);
        animation: panel-rise-b-kn8w3dbu3b var(--h-duration-base) var(--h-ease);
    }

    .panel__foot[b-kn8w3dbu3b] { padding-bottom: calc(var(--h-space-3) + env(safe-area-inset-bottom)); }
}

@keyframes panel-rise-b-kn8w3dbu3b {
    from { transform: translateY(12%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .panel[b-kn8w3dbu3b] { animation: none; }
}
/* _content/Home/Components/Calendar/MonthGrid.razor.rz.scp.css */
.grid[b-c76tka20xc] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-2);
}

.grid__head[b-c76tka20xc] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: var(--h-space-2);
}

.grid__day[b-c76tka20xc] {
    padding: var(--h-space-1) var(--h-space-2);
    color: var(--h-text-faint);
    font-family: var(--h-font-body);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-align: center;
}

.grid__day abbr[b-c76tka20xc] { text-decoration: none; border: 0; }

.grid__body[b-c76tka20xc] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    grid-auto-rows: minmax(7.5rem, 1fr);
    gap: var(--h-space-2);
}

/* Below the tablet breakpoint the agenda list takes over entirely. */
@media (max-width: 900px) {
    .grid[b-c76tka20xc] { display: none; }
}
/* _content/Home/Components/Layout/MainLayout.razor.rz.scp.css */
/* Application shell.
 *
 * Desktop-first, matching the rest of the app: the drawer is pinned at 901px and above and
 * becomes an off-canvas sheet below. 900px is the breakpoint the calendar and admin pages
 * already use, so the whole app shifts at one width.
 *
 * The app bar deliberately sits above the drawer in the stacking order (--h-z-appbar over
 * --h-z-drawer). That keeps the drawer clipped beneath it, matching the old MudDrawer
 * ClipMode.Always behaviour, and keeps the user switcher's dropdown — which is a child of
 * the app bar's stacking context — painting above the drawer.
 */

/* ---- App bar ---- */

.shell__bar[b-z52mcuyb1e] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: var(--h-z-appbar);
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    height: var(--h-appbar-height);
    padding: 0 var(--h-space-3);
    background: var(--h-ink-800);
    border-bottom: 1px solid var(--h-border);
    box-shadow: var(--h-shadow-sm);
    color: var(--h-text);
    font-family: var(--h-font-body);
}

[data-theme="light"] .shell__bar[b-z52mcuyb1e] { background: var(--h-bg-raised); }

.shell__spacer[b-z52mcuyb1e] { flex: 1 1 auto; }

/* ---- Brand ---- */

.shell__brand[b-z52mcuyb1e] {
    display: inline-flex;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-1);
    border-radius: var(--h-radius-md);
    color: var(--h-text);
    text-decoration: none;
    white-space: nowrap;
    /* Rapid taps are the NevBday easter egg (shell.js); don't let them double-tap zoom. */
    touch-action: manipulation;
}

.shell__brand:focus-visible[b-z52mcuyb1e] { outline: 2px solid var(--h-focus); outline-offset: 2px; }

.shell__brand-mark[b-z52mcuyb1e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    border-radius: var(--h-radius-sm);
    background: var(--h-accent);
    /* Inherited by the inline mark's fill="currentColor". */
    color: var(--h-text-on-accent);
}

/* The glyph carries its own 28% margin inside the 512 viewBox, so it fills the
   square rather than being inset again here. */
.shell__brand-mark svg[b-z52mcuyb1e] {
    display: block;
    width: 100%;
    height: 100%;
}

.shell__brand-name[b-z52mcuyb1e] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-bold);
    letter-spacing: -0.02em;
    line-height: 1;
}

.shell__sep[b-z52mcuyb1e] { color: var(--h-text-faint); font-size: var(--h-text-lg); }

.shell__page[b-z52mcuyb1e] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-medium);
    letter-spacing: -0.01em;
    line-height: 1;
    color: var(--h-text-dim);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.shell__status[b-z52mcuyb1e] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
}

/* ---- Drawer ---- */

.shell__drawer[b-z52mcuyb1e] {
    position: fixed;
    top: var(--h-appbar-height);
    bottom: 0;
    left: 0;
    z-index: var(--h-z-drawer);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: var(--h-drawer-width);
    background: var(--h-ink-700);
    border-right: 1px solid var(--h-border);
    overflow-y: auto;
    scrollbar-width: thin;
    /* Off-canvas by default; the desktop query below pins it open. */
    transform: translateX(-100%);
    transition: transform var(--h-duration-base) var(--h-ease);
}

[data-theme="light"] .shell__drawer[b-z52mcuyb1e] { background: var(--h-bg-raised); }

.shell__drawer--open[b-z52mcuyb1e] { transform: translateX(0); }

.shell__drawer-foot[b-z52mcuyb1e] {
    padding: var(--h-space-3);
    border-top: 1px solid var(--h-border);
    /* Clears the home indicator when the drawer is a full-height sheet on a phone. */
    padding-bottom: calc(var(--h-space-3) + env(safe-area-inset-bottom));
}

.shell__scrim[b-z52mcuyb1e] {
    position: fixed;
    inset: 0;
    z-index: var(--h-z-drawer-scrim);
    background: rgba(0, 0, 0, 0.5);
    animation: shell-fade-b-z52mcuyb1e var(--h-duration-base) var(--h-ease);
}

/* ---- Content ---- */

.shell__main[b-z52mcuyb1e] {
    /* The app bar is fixed, so the content needs its height back as padding. Pages size
       themselves with calc(100vh - var(--h-appbar-height)) and stay correct. */
    padding-top: var(--h-appbar-height);
    min-width: 0;
    transition: margin-left var(--h-duration-base) var(--h-ease);
}

/* ---- Desktop: drawer pinned unless collapsed ---- */

@media (min-width: 901px) {
    /* Pinned open by default. --closed is only ever set by an explicit toggle, so the first
       paint never depends on interop having run. */
    .shell__drawer[b-z52mcuyb1e] { transform: translateX(0); }
    .shell__drawer--closed[b-z52mcuyb1e] { transform: translateX(-100%); }

    .shell__main[b-z52mcuyb1e] { margin-left: var(--h-drawer-width); }
    .shell__main--full[b-z52mcuyb1e] { margin-left: 0; }

    /* The drawer sits beside the content here, so there is nothing to dim. */
    .shell__scrim[b-z52mcuyb1e] { display: none; }
}

/* ---- Phone ---- */

@media (max-width: 600px) {
    .shell__bar[b-z52mcuyb1e] { padding: 0 var(--h-space-2); gap: var(--h-space-1); }

    /* The page name is the useful label on a phone, where the drawer is hidden and cannot
       show which section is active. The wordmark goes rather than the page name. */
    .shell__brand-name[b-z52mcuyb1e],
    .shell__sep[b-z52mcuyb1e] { display: none; }

    .shell__drawer[b-z52mcuyb1e] { width: min(84vw, var(--h-drawer-width)); }
}

@keyframes shell-fade-b-z52mcuyb1e {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .shell__drawer[b-z52mcuyb1e],
    .shell__main[b-z52mcuyb1e] { transition: none; }
    .shell__scrim[b-z52mcuyb1e] { animation: none; }
}
/* _content/Home/Components/Layout/NavMenu.razor.rz.scp.css */
.nav[b-1vnk796rec] {
    padding: var(--h-space-3);
}

.nav__list[b-1vnk796rec] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-1);
    margin: 0;
    padding: 0;
    list-style: none;
}

.nav__row[b-1vnk796rec] { margin: 0; }

/* NavLink renders its own anchor, which does not receive this component's isolation
   attribute, so the anchor rules have to reach through ::deep from .nav__list. */
.nav__list[b-1vnk796rec]  .nav__item {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    /* Extra left padding leaves room for the active accent bar without the row shifting. */
    padding: 0.55rem 0.7rem 0.55rem 0.85rem;
    border: 1px solid transparent;
    border-radius: var(--h-radius-md);
    color: var(--h-text-dim);
    font-family: var(--h-font-body);
    font-size: var(--h-text-md);
    font-weight: var(--h-weight-medium);
    text-decoration: none;
    /* Comfortable to tap on the shared tablet. */
    min-height: 2.75rem;
    position: relative;
    transition: background var(--h-duration-fast) var(--h-ease),
                color var(--h-duration-fast) var(--h-ease);
}

.nav__list[b-1vnk796rec]  .nav__item:hover {
    background: var(--h-surface-hover);
    color: var(--h-text);
}

.nav__list[b-1vnk796rec]  .nav__item:focus-visible {
    outline: 2px solid var(--h-focus);
    outline-offset: -2px;
}

/* NavLink adds .active itself. Matches the .card--active / .person--on treatment used on
   the calendar and admin pages: accent wash, accent text, left accent bar. */
.nav__list[b-1vnk796rec]  .nav__item.active {
    background: color-mix(in srgb, var(--h-accent) 14%, transparent);
    border-color: color-mix(in srgb, var(--h-accent) 40%, transparent);
    color: var(--h-text);
    font-weight: var(--h-weight-semi);
}

.nav__list[b-1vnk796rec]  .nav__item.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 1.35rem;
    border-radius: 0 var(--h-radius-pill) var(--h-radius-pill) 0;
    background: var(--h-accent);
}

.nav__glyph[b-1vnk796rec] {
    flex: 0 0 auto;
    width: 1.35rem;
    font-size: var(--h-text-lg);
    line-height: 1;
    text-align: center;
    opacity: 0.85;
}

.nav__label[b-1vnk796rec] { line-height: 1; }
/* _content/Home/Components/Molecules/AdminPassPrompt.razor.rz.scp.css */
.ap__row[b-iuxof58e8n] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
}

.ap__input[b-iuxof58e8n] { min-width: 0; }

.ap__peek[b-iuxof58e8n] {
    flex: 0 0 auto;
    font-size: var(--h-text-xs);
}
/* _content/Home/Components/Molecules/CalendarGlance.razor.rz.scp.css */
.cg[b-14n3s4puz1] {
    display: inline-flex;
    align-items: center;
    gap: var(--h-space-2);
    padding: 0.25rem 0.5rem 0.25rem 0.6rem;
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-pill);
    background: var(--h-surface-sunk);
    color: var(--h-text);
    text-decoration: none;
    white-space: nowrap;
    transition: background var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease);
}

.cg:hover[b-14n3s4puz1] {
    background: var(--h-surface-hover);
    border-color: var(--h-border-strong);
}

.cg:focus-visible[b-14n3s4puz1] { outline: 2px solid var(--h-focus); outline-offset: 2px; }

.cg__glyph[b-14n3s4puz1] {
    font-size: var(--h-text-md);
    line-height: 1;
    color: var(--h-text-dim);
}

.cg__badge[b-14n3s4puz1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.3rem;
    height: 1.3rem;
    padding: 0 0.35rem;
    border-radius: var(--h-radius-pill);
    background: var(--h-info);
    color: var(--h-text-on-accent);
    font-family: var(--h-font-mono);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-bold);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

/* A quiet day should read as calm, not as an alert. */
.cg__badge--empty[b-14n3s4puz1] {
    background: transparent;
    border: 1px solid var(--h-border-strong);
    color: var(--h-text-faint);
    font-weight: var(--h-weight-medium);
}

.cg__badge--fail[b-14n3s4puz1] {
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--h-warning) 45%, transparent);
    color: var(--h-warning);
}

@media (max-width: 600px) {
    .cg[b-14n3s4puz1] {
        padding: 0.25rem 0.35rem;
        border-color: transparent;
        background: transparent;
    }
}
/* _content/Home/Components/Molecules/MqttStatus.razor.rz.scp.css */
.mq[b-54rg608y3v] {
    display: inline-flex;
    align-items: center;
    gap: var(--h-space-2);
    padding: 0.25rem 0.6rem;
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-pill);
    background: var(--h-surface-sunk);
    font-family: var(--h-font-body);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.mq__dot[b-54rg608y3v] {
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-radius: var(--h-radius-pill);
}

.mq--on[b-54rg608y3v] { color: var(--h-text-dim); }
.mq--on .mq__dot[b-54rg608y3v] { background: var(--h-success); }

/* Offline is the state worth noticing, so it gets the full accent treatment. */
.mq--off[b-54rg608y3v] {
    color: var(--h-danger);
    border-color: color-mix(in srgb, var(--h-danger) 45%, transparent);
    background: color-mix(in srgb, var(--h-danger) 12%, transparent);
}

.mq--off .mq__dot[b-54rg608y3v] {
    background: var(--h-danger);
    animation: mq-pulse-b-54rg608y3v 1.8s var(--h-ease) infinite;
}

@keyframes mq-pulse-b-54rg608y3v {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}

/* Below the tablet breakpoint the dot carries the meaning on its own. */
@media (max-width: 900px) {
    .mq[b-54rg608y3v] {
        padding: 0.25rem;
        border-color: transparent;
        background: transparent;
    }

    .mq__label[b-54rg608y3v] { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .mq--off .mq__dot[b-54rg608y3v] { animation: none; }
}
/* _content/Home/Components/Molecules/ThemeToggle.razor.rz.scp.css */
/* Sits in the drawer footer, so it fills the width and reads as a row rather
   than a floating pill. */
.tt[b-fli9x4xpag] {
    width: 100%;
    justify-content: flex-start;
    gap: var(--h-space-3);
}

.tt__glyph[b-fli9x4xpag] {
    width: 1.25rem;
    font-size: var(--h-text-md);
    line-height: 1;
    text-align: center;
}

.tt__label[b-fli9x4xpag] { line-height: 1; }
/* _content/Home/Components/Molecules/UserSwitcher.razor.rz.scp.css */
.sw[b-8hg292v4b6] { position: relative; display: inline-flex; }

.sw__trigger[b-8hg292v4b6] {
    display: inline-flex;
    align-items: center;
    gap: var(--h-space-2);
    padding: 0.25rem 0.5rem 0.25rem 0.25rem;
    border: 1px solid transparent;
    border-radius: var(--h-radius-pill);
    background: transparent;
    color: inherit;
    font-family: var(--h-font-body);
    font-size: var(--h-text-sm);
    font-weight: var(--h-weight-medium);
    cursor: pointer;
    transition: background var(--h-duration-fast) var(--h-ease);
}

.sw__trigger:hover[b-8hg292v4b6] { background: rgba(255, 255, 255, 0.12); }

.sw__name[b-8hg292v4b6] { white-space: nowrap; }
.sw__chev[b-8hg292v4b6] { font-size: 0.6rem; opacity: 0.7; }

/* Sits above the app bar's stacking context. */
.sw__scrim[b-8hg292v4b6] {
    position: fixed;
    inset: 0;
    z-index: 1400;
    background: transparent;
}

.sw__panel[b-8hg292v4b6] {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    z-index: 1401;
    width: 19rem;
    max-height: 80vh;
    overflow-y: auto;
    padding: var(--h-space-4);
    background: var(--h-surface-solid);
    border: 1px solid var(--h-border-strong);
    border-radius: var(--h-radius-lg);
    box-shadow: var(--h-shadow-lg);
    color: var(--h-text);
    text-align: left;
    scrollbar-width: thin;
}

.sw__error[b-8hg292v4b6] { margin-bottom: var(--h-space-3); }

.sw__label[b-8hg292v4b6] { margin: 0 0 var(--h-space-3); color: var(--h-text-dim); font-size: var(--h-text-sm); }
.sw__label strong[b-8hg292v4b6] { color: var(--h-text); font-weight: var(--h-weight-semi); }

.sw__label--section[b-8hg292v4b6] {
    margin-bottom: var(--h-space-2);
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.sw__form[b-8hg292v4b6] { margin: 0; }

.sw__people[b-8hg292v4b6] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-1);
    margin-bottom: var(--h-space-3);
}

.sw__person[b-8hg292v4b6] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    width: 100%;
    padding: 0.35rem 0.5rem;
    border: 1px solid transparent;
    border-radius: var(--h-radius-md);
    background: transparent;
    color: var(--h-text);
    font-family: var(--h-font-body);
    font-size: var(--h-text-md);
    text-align: left;
    cursor: pointer;
    /* Comfortable to tap on the shared tablet. */
    min-height: 2.5rem;
    transition: background var(--h-duration-fast) var(--h-ease);
}

.sw__person:hover[b-8hg292v4b6] { background: var(--h-surface-hover); }

.sw__person--on[b-8hg292v4b6] {
    background: color-mix(in srgb, var(--person) 16%, transparent);
    border-color: color-mix(in srgb, var(--person) 55%, transparent);
}

.sw__person-name[b-8hg292v4b6] { flex: 1; }

.sw__admin[b-8hg292v4b6] {
    padding: 0.1rem 0.4rem;
    border-radius: var(--h-radius-pill);
    background: color-mix(in srgb, var(--h-gold) 22%, transparent);
    color: var(--h-gold);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.sw__field[b-8hg292v4b6] { margin-bottom: var(--h-space-3); }

.sw__submit[b-8hg292v4b6] { width: 100%; }

.sw__divider[b-8hg292v4b6] { height: 1px; margin: var(--h-space-4) 0; background: var(--h-border); }

.sw__signout[b-8hg292v4b6] { width: 100%; color: var(--h-text-dim); }
.sw__signout:hover[b-8hg292v4b6] { color: var(--h-text); }

.sw__note[b-8hg292v4b6] { margin: 0; color: var(--h-text-faint); font-size: var(--h-text-xs); }

/* On a phone the dropdown becomes a near-full-width sheet under the app bar. */
@media (max-width: 600px) {
    .sw__name[b-8hg292v4b6] { display: none; }

    .sw__panel[b-8hg292v4b6] {
        position: fixed;
        top: calc(var(--h-appbar-height) + 0.5rem);
        left: var(--h-space-3);
        right: var(--h-space-3);
        width: auto;
    }
}
/* _content/Home/Components/Molecules/Weather/CurrentPanel.razor.rz.scp.css */
.cp[b-4esfykmdkk] {
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-xl);
    padding: clamp(18px, 2.4vw, 26px);
    display: flex;
    flex-direction: column;
    gap: 18px;
    backdrop-filter: blur(8px);
}

.cp__head[b-4esfykmdkk] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.cp__name[b-4esfykmdkk] {
    margin: 0;
    font-family: var(--h-font-display);
    font-weight: 800;
    font-stretch: 125%;
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    line-height: 1.02;
    letter-spacing: -0.01em;
}

.cp__region[b-4esfykmdkk] {
    font-size: 0.82rem;
    color: var(--h-text-dim);
}

.cp__now-pill[b-4esfykmdkk] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    padding: 5px 11px;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--band);
    background: color-mix(in srgb, var(--band) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--band) 40%, transparent);
}

.cp__now-dot[b-4esfykmdkk] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--band);
}

.cp__read[b-4esfykmdkk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    flex-wrap: wrap;
}

.cp__cond[b-4esfykmdkk] {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 4px;
}

.cp__emoji[b-4esfykmdkk] { font-size: 1.5rem; }
.cp__cond-text[b-4esfykmdkk] { font-size: 0.92rem; color: var(--h-text-dim); }

.cp__temp[b-4esfykmdkk] {
    font-family: var(--h-font-mono);
    font-size: clamp(3.2rem, 7vw, 4.6rem);
    font-weight: 500;
    line-height: 0.95;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
}

.cp__deg[b-4esfykmdkk] {
    font-size: 0.4em;
    color: var(--h-text-dim);
    margin-left: 4px;
}

.cp__feels[b-4esfykmdkk] {
    font-family: var(--h-font-mono);
    font-size: 0.9rem;
    color: var(--h-text-dim);
    margin-top: 2px;
}

/* Compass */
.cp__compass[b-4esfykmdkk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.cp__dial[b-4esfykmdkk] { width: 132px; height: 132px; }

.cp__dial-ring[b-4esfykmdkk] {
    fill: none;
    stroke: var(--h-border-strong);
    stroke-width: 1;
}

.cp__dial-ring--inner[b-4esfykmdkk] { stroke: var(--h-border); }

.cp__dial-card[b-4esfykmdkk] {
    fill: var(--h-text-faint);
    font-family: var(--h-font-mono);
    font-size: 11px;
    text-anchor: middle;
    dominant-baseline: middle;
}

.cp__needle[b-4esfykmdkk] { fill: var(--h-coral); }
.cp__needle-tail[b-4esfykmdkk] { fill: var(--h-text-faint); }
.cp__hub[b-4esfykmdkk] { fill: var(--h-text); }

.cp__wind-read[b-4esfykmdkk] {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin-top: -2px;
}

.cp__wind-val[b-4esfykmdkk] {
    font-family: var(--h-font-mono);
    font-size: 1.5rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.cp__wind-unit[b-4esfykmdkk] { font-size: 0.74rem; color: var(--h-text-dim); }

.cp__wind-gust[b-4esfykmdkk] {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 0.72rem;
    color: var(--h-text-faint);
    font-family: var(--h-font-mono);
}

/* Stats */
.cp__stats[b-4esfykmdkk] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    border-top: 1px solid var(--h-border);
    padding-top: 16px;
}

.cp__stat[b-4esfykmdkk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cp__stat-label[b-4esfykmdkk] {
    font-size: 0.66rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--h-text-faint);
}

.cp__stat-val[b-4esfykmdkk] {
    font-family: var(--h-font-mono);
    font-size: 1.18rem;
    font-variant-numeric: tabular-nums;
}

.cp__stat-val small[b-4esfykmdkk] { font-size: 0.6em; color: var(--h-text-dim); }

.cp__stat-sub[b-4esfykmdkk] { font-size: 0.7rem; color: var(--h-text-dim); }

.cp__sun[b-4esfykmdkk] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: var(--h-font-mono);
    font-size: 0.82rem;
    color: var(--h-text-dim);
}

.cp__sun-sep[b-4esfykmdkk] {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, var(--h-gold), transparent);
    opacity: 0.5;
}

@media (max-width: 420px) {
    .cp__stats[b-4esfykmdkk] { grid-template-columns: repeat(2, 1fr); }
}
/* _content/Home/Components/Molecules/Weather/DailyOutlook.razor.rz.scp.css */
.do[b-qcna5xn33z] {
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-xl);
    padding: clamp(16px, 2.2vw, 24px);
    backdrop-filter: blur(8px);
}

.do__head[b-qcna5xn33z] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 12px;
}

.do__eyebrow[b-qcna5xn33z] {
    font-size: 0.68rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--h-gold);
}

.do__hint[b-qcna5xn33z] {
    font-size: 0.72rem;
    color: var(--h-text-faint);
}

.do__rows[b-qcna5xn33z] {
    display: flex;
    flex-direction: column;
}

.do__row[b-qcna5xn33z] {
    display: grid;
    grid-template-columns: 54px 30px 130px 1fr 64px 64px;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 11px 12px;
    border: 1px solid transparent;
    border-radius: 12px;
    background: transparent;
    color: var(--h-text);
    font-family: var(--h-font-body);
    text-align: left;
    cursor: pointer;
    transition: background 0.14s ease, border-color 0.14s ease;
}

.do__row + .do__row[b-qcna5xn33z] { margin-top: 2px; }

.do__row:hover[b-qcna5xn33z] { background: var(--h-surface-sunk); }

.do__row--active[b-qcna5xn33z] {
    background: var(--h-surface-sunk);
    border-color: color-mix(in srgb, var(--h-accent) 40%, transparent);
}

.do__day[b-qcna5xn33z] {
    font-weight: 600;
    font-size: 0.9rem;
}

.do__icon[b-qcna5xn33z] { font-size: 1.15rem; text-align: center; }

.do__play[b-qcna5xn33z] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.do__dot[b-qcna5xn33z] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 9px currentColor;
}

.do__play-label[b-qcna5xn33z] {
    font-size: 0.82rem;
    color: var(--h-text-dim);
}

.do__temps[b-qcna5xn33z] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.do__lo[b-qcna5xn33z] { color: var(--h-sky); }
.do__hi[b-qcna5xn33z] { color: var(--h-gold); }

.do__lo[b-qcna5xn33z], .do__hi[b-qcna5xn33z] {
    font-family: var(--h-font-mono);
    font-size: 0.84rem;
    font-variant-numeric: tabular-nums;
    width: 30px;
    text-align: center;
    flex-shrink: 0;
}

.do__bar[b-qcna5xn33z] {
    position: relative;
    flex: 1;
    height: 5px;
    border-radius: 999px;
    background: var(--h-border);
}

.do__bar-fill[b-qcna5xn33z] {
    position: absolute;
    top: 0;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--h-sky), var(--h-gold));
}

.do__wind[b-qcna5xn33z], .do__precip[b-qcna5xn33z] {
    font-family: var(--h-font-mono);
    font-size: 0.78rem;
    color: var(--h-text-dim);
    text-align: right;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 680px) {
    .do__row[b-qcna5xn33z] {
        grid-template-columns: 46px 26px 1fr auto;
        row-gap: 8px;
    }
    .do__play[b-qcna5xn33z] { grid-column: 1 / -1; order: 5; }
    .do__temps[b-qcna5xn33z] { grid-column: 1 / -1; order: 4; }
    .do__wind[b-qcna5xn33z] { order: 2; }
    .do__precip[b-qcna5xn33z] { order: 3; }
}
/* _content/Home/Components/Molecules/Weather/GolfRead.razor.rz.scp.css */
.gr[b-3vfs4hs36z] {
    display: flex;
    align-items: center;
    gap: clamp(16px, 3vw, 40px);
    flex-wrap: wrap;
    background: var(--h-surface-sunk);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-xl);
    padding: 16px clamp(18px, 2.4vw, 26px);
}

.gr__headline[b-3vfs4hs36z] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.gr__flag[b-3vfs4hs36z] {
    font-size: 1.3rem;
    filter: drop-shadow(0 0 8px color-mix(in srgb, var(--c) 60%, transparent));
}

.gr__headline-text[b-3vfs4hs36z] {
    font-family: var(--h-font-display);
    font-weight: 700;
    font-size: clamp(1rem, 1.6vw, 1.2rem);
}

.gr__signals[b-3vfs4hs36z] {
    display: flex;
    align-items: center;
    gap: clamp(16px, 3vw, 36px);
    flex-wrap: wrap;
    margin-left: auto;
}

.gr__signal[b-3vfs4hs36z] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 84px;
}

.gr__label[b-3vfs4hs36z] {
    font-size: 0.66rem;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--h-text-faint);
}

.gr__dots[b-3vfs4hs36z] { display: inline-flex; gap: 5px; }

.gr__dot[b-3vfs4hs36z] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--h-border-strong);
}

.gr__dot--on[b-3vfs4hs36z] { background: var(--h-accent); }

.gr__value[b-3vfs4hs36z] {
    font-family: var(--h-font-mono);
    font-size: 1.15rem;
    font-variant-numeric: tabular-nums;
}

.gr__sub[b-3vfs4hs36z] {
    font-family: var(--h-font-mono);
    font-size: 0.72rem;
    color: var(--h-text-dim);
}

@media (max-width: 720px) {
    .gr__signals[b-3vfs4hs36z] { margin-left: 0; width: 100%; justify-content: space-between; gap: 14px; }
    .gr__signal[b-3vfs4hs36z] { min-width: 70px; }
}
/* _content/Home/Components/Molecules/Weather/HourlyPanel.razor.rz.scp.css */
.hp[b-k3tlzewsws] {
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-xl);
    padding: clamp(18px, 2.4vw, 26px);
    display: flex;
    flex-direction: column;
    gap: 14px;
    backdrop-filter: blur(8px);
}

.hp__head[b-k3tlzewsws] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.hp__eyebrow[b-k3tlzewsws] {
    font-size: 0.68rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--h-gold);
}

.hp__title[b-k3tlzewsws] {
    margin: 4px 0 0;
    font-family: var(--h-font-display);
    font-weight: 700;
    font-size: clamp(1.1rem, 1.8vw, 1.4rem);
}

.hp__tabs[b-k3tlzewsws] {
    display: inline-flex;
    border: 1px solid var(--h-border-strong);
    border-radius: 999px;
    overflow: hidden;
    flex-shrink: 0;
}

.hp__tab[b-k3tlzewsws] {
    padding: 6px 15px;
    border: none;
    background: transparent;
    color: var(--h-text-dim);
    font-family: var(--h-font-body);
    font-size: 0.82rem;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

/* Was an inverted fill (background: --h-text), which collapses to dark-on-dark
   once --h-text flips. Tint + full text colour survives both themes. */
.hp__tab--active[b-k3tlzewsws] {
    background: color-mix(in srgb, var(--h-accent) 20%, transparent);
    color: var(--h-text);
    font-weight: 600;
}

/* Chart */
.hp__chart[b-k3tlzewsws] {
    position: relative;
    padding-right: 38px;
}

.hp__svg[b-k3tlzewsws] {
    width: 100%;
    height: 200px;
    display: block;
    overflow: visible;
}

.hp__grid[b-k3tlzewsws] {
    stroke: var(--h-border);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

.hp__line[b-k3tlzewsws] {
    fill: none;
    stroke: var(--line);
    stroke-width: 2.5;
    stroke-linejoin: round;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

.hp__line--secondary[b-k3tlzewsws] {
    stroke-width: 1.5;
    stroke-dasharray: 4 4;
    opacity: 0.65;
}

.hp__now[b-k3tlzewsws] {
    stroke: var(--h-sky);
    stroke-width: 1.5;
    stroke-dasharray: 3 3;
    vector-effect: non-scaling-stroke;
}

.hp__yaxis[b-k3tlzewsws] {
    position: absolute;
    top: 0;
    right: 0;
    height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 8px 0;
    font-family: var(--h-font-mono);
    font-size: 0.7rem;
    color: var(--h-text-faint);
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.hp__legend[b-k3tlzewsws] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.74rem;
    color: var(--h-text-dim);
}

.hp__legend-solid[b-k3tlzewsws],
.hp__legend-dash[b-k3tlzewsws] {
    width: 18px;
    height: 0;
    border-top: 2px solid var(--line);
}

.hp__legend-dash[b-k3tlzewsws] {
    border-top-style: dashed;
    opacity: 0.7;
    margin-left: 8px;
}

/* Hour strip */
.hp__strip[b-k3tlzewsws] {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding: 6px 2px 10px;
    scrollbar-width: thin;
    scrollbar-color: var(--h-border-strong) transparent;
}

.hp__strip[b-k3tlzewsws]::-webkit-scrollbar { height: 6px; }
.hp__strip[b-k3tlzewsws]::-webkit-scrollbar-thumb { background: var(--h-border-strong); border-radius: 999px; }

.hp__cell[b-k3tlzewsws] {
    flex: 0 0 auto;
    width: 58px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 8px 4px;
    border-radius: 11px;
    background: var(--h-surface-sunk);
    border: 1px solid transparent;
}

.hp__cell.is-now[b-k3tlzewsws] {
    border-color: var(--h-sky);
    background: var(--h-today-wash);
}

.hp__cell.is-past[b-k3tlzewsws] { opacity: 0.4; }

.hp__cell-time[b-k3tlzewsws] {
    font-family: var(--h-font-mono);
    font-size: 0.7rem;
    color: var(--h-text-dim);
}

.hp__cell.is-now .hp__cell-time[b-k3tlzewsws] { color: var(--h-sky); }

.hp__cell-emoji[b-k3tlzewsws] { font-size: 1.05rem; }

.hp__cell-val[b-k3tlzewsws] {
    font-family: var(--h-font-mono);
    font-size: 0.92rem;
    font-variant-numeric: tabular-nums;
}

.hp__cell-bar[b-k3tlzewsws] {
    width: 22px;
    height: 4px;
    border-radius: 999px;
    background: var(--band);
}

.hp__empty[b-k3tlzewsws] { color: var(--h-text-dim); font-size: 0.9rem; }

@media (max-width: 520px) {
    .hp__svg[b-k3tlzewsws] { height: 168px; }
    .hp__yaxis[b-k3tlzewsws] { height: 168px; }
}
/* _content/Home/Components/Molecules/Weather/LocationBar.razor.rz.scp.css */
.lb[b-z5mmt4a8fh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.lb__locs[b-z5mmt4a8fh] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.lb__chip[b-z5mmt4a8fh] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid var(--h-border);
    background: var(--h-surface-sunk);
    color: var(--h-text-dim);
    font-family: var(--h-font-body);
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.lb__chip:hover[b-z5mmt4a8fh] {
    color: var(--h-text);
    border-color: var(--h-border-strong);
}

/* Tinted rather than filled: an accent fill needs an ink colour that flips with
   the theme, and the accent green is too light to carry white text. Matches
   .person--on on the calendar. */
.lb__chip--active[b-z5mmt4a8fh] {
    color: var(--h-text);
    background: color-mix(in srgb, var(--h-accent) 16%, transparent);
    border-color: color-mix(in srgb, var(--h-accent) 55%, transparent);
    font-weight: 600;
}

.lb__home[b-z5mmt4a8fh] {
    font-size: 0.95rem;
    line-height: 1;
}

.lb__chip-x[b-z5mmt4a8fh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    font-size: 0.95rem;
    line-height: 1;
    color: inherit;
    opacity: 0.55;
}

.lb__chip-x:hover[b-z5mmt4a8fh] {
    opacity: 1;
    background: color-mix(in srgb, var(--h-coral) 20%, transparent);
    color: var(--h-coral);
}

.lb__right[b-z5mmt4a8fh] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.lb__search[b-z5mmt4a8fh] {
    position: relative;
    display: flex;
    align-items: center;
}

.lb__search-icon[b-z5mmt4a8fh] {
    position: absolute;
    left: 12px;
    font-size: 1rem;
    color: var(--h-text-faint);
    pointer-events: none;
}

.lb__input[b-z5mmt4a8fh] {
    width: 210px;
    max-width: 46vw;
    padding: 9px 12px 9px 32px;
    border-radius: 999px;
    border: 1px solid var(--h-border);
    background: var(--h-surface-sunk);
    color: var(--h-text);
    font-family: var(--h-font-body);
    font-size: 0.88rem;
    transition: border-color 0.15s ease, width 0.2s ease;
}

.lb__input[b-z5mmt4a8fh]::placeholder { color: var(--h-text-faint); }

.lb__input:focus[b-z5mmt4a8fh] {
    outline: none;
    border-color: var(--h-accent);
    width: 250px;
}

.lb__results[b-z5mmt4a8fh] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    left: 0;
    z-index: 20;
    margin: 0;
    padding: 6px;
    list-style: none;
    border-radius: 14px;
    border: 1px solid var(--h-border-strong);
    /* Opaque: this dropdown overlaps page content, so it cannot use the
       translucent surface token. */
    background: var(--h-surface-solid);
    box-shadow: var(--h-shadow-lg);
}

.lb__result[b-z5mmt4a8fh] {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 8px 12px;
    border: none;
    border-radius: 9px;
    background: transparent;
    text-align: left;
    cursor: pointer;
    color: var(--h-text);
    font-family: var(--h-font-body);
}

.lb__result:hover[b-z5mmt4a8fh] { background: color-mix(in srgb, var(--h-accent) 14%, transparent); }

.lb__result--muted[b-z5mmt4a8fh] {
    color: var(--h-text-faint);
    font-size: 0.86rem;
    cursor: default;
}

.lb__result-name[b-z5mmt4a8fh] { font-size: 0.92rem; font-weight: 500; }
.lb__result-sub[b-z5mmt4a8fh] { font-size: 0.76rem; color: var(--h-text-dim); }

.lb__meta[b-z5mmt4a8fh] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lb__updated[b-z5mmt4a8fh] {
    font-family: var(--h-font-mono);
    font-size: 0.74rem;
    color: var(--h-text-dim);
    font-variant-numeric: tabular-nums;
}

.lb__persist[b-z5mmt4a8fh] {
    font-size: 0.66rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 999px;
    border: 1px solid var(--h-border);
    color: var(--h-text-faint);
}

.lb__persist--on[b-z5mmt4a8fh] {
    color: var(--h-accent);
    border-color: color-mix(in srgb, var(--h-accent) 35%, transparent);
}

.lb__refresh[b-z5mmt4a8fh] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid var(--h-border);
    background: var(--h-surface-sunk);
    color: var(--h-text);
    font-size: 1.05rem;
    cursor: pointer;
    transition: transform 0.4s ease, border-color 0.15s ease, color 0.15s ease;
}

.lb__refresh:hover[b-z5mmt4a8fh] {
    border-color: var(--h-accent);
    color: var(--h-accent);
    transform: rotate(90deg);
}

button:focus-visible[b-z5mmt4a8fh],
.lb__input:focus-visible[b-z5mmt4a8fh] {
    outline: 2px solid var(--h-focus);
    outline-offset: 2px;
}

@media (max-width: 640px) {
    .lb__right[b-z5mmt4a8fh] { width: 100%; justify-content: space-between; }
    .lb__input[b-z5mmt4a8fh] { width: 100%; max-width: none; flex: 1; }
    .lb__search[b-z5mmt4a8fh] { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .lb__refresh:hover[b-z5mmt4a8fh] { transform: none; }
}
/* _content/Home/Components/Molecules/Weather/RoundWindow.razor.rz.scp.css */
.rw[b-8oeok4ik48] {
    background:
        radial-gradient(620px 200px at 18% 0%, color-mix(in srgb, var(--h-accent) 10%, transparent), transparent 70%),
        var(--h-surface);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-xl);
    padding: clamp(18px, 2.4vw, 26px);
    display: flex;
    flex-direction: column;
    gap: 18px;
    backdrop-filter: blur(8px);
}

.rw__head[b-8oeok4ik48] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.rw__eyebrow[b-8oeok4ik48] {
    font-size: 0.68rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--h-gold);
}

.rw__title[b-8oeok4ik48] {
    margin: 4px 0 0;
    font-family: var(--h-font-display);
    font-weight: 800;
    font-stretch: 110%;
    font-size: clamp(1.25rem, 2vw, 1.65rem);
    line-height: 1.05;
}

.rw__day[b-8oeok4ik48] { color: var(--h-text-dim); font-weight: 600; }

.rw__holes[b-8oeok4ik48] {
    display: inline-flex;
    border: 1px solid var(--h-border-strong);
    border-radius: 999px;
    overflow: hidden;
    flex-shrink: 0;
}

.rw__hole[b-8oeok4ik48] {
    padding: 6px 16px;
    border: none;
    background: transparent;
    color: var(--h-text-dim);
    font-family: var(--h-font-mono);
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

/* .rw__hole has no border of its own (the group carries it), so the active
   state reads through the tint and text colour alone. */
.rw__hole--active[b-8oeok4ik48] {
    background: color-mix(in srgb, var(--h-accent) 20%, transparent);
    color: var(--h-text);
    font-weight: 600;
}

/* Callout */
.rw__verdict[b-8oeok4ik48] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 9px;
}

.rw__verdict-label[b-8oeok4ik48] {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--h-text-faint);
}

.rw__verdict-time[b-8oeok4ik48] {
    font-family: var(--h-font-display);
    font-weight: 800;
    font-size: clamp(1.5rem, 3vw, 2.1rem);
    letter-spacing: -0.01em;
}

.rw__verdict--none .rw__verdict-time[b-8oeok4ik48] {
    font-size: clamp(1.1rem, 2.2vw, 1.4rem);
    color: var(--h-coral);
}

.rw__verdict-arrow[b-8oeok4ik48] { color: var(--h-text-faint); }

.rw__verdict-finish[b-8oeok4ik48] { font-size: 0.95rem; color: var(--h-text-dim); }

.rw__verdict-band[b-8oeok4ik48] {
    margin-left: auto;
    padding: 4px 11px;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--c);
    background: color-mix(in srgb, var(--c) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--c) 38%, transparent);
}

.rw__sub[b-8oeok4ik48] {
    margin: 6px 0 0;
    font-family: var(--h-font-mono);
    font-size: 0.78rem;
    color: var(--h-text-faint);
}

/* Ribbon chart: three aligned flex rows */
.rw__chart[b-8oeok4ik48] { display: flex; flex-direction: column; gap: 4px; }
.rw__row[b-8oeok4ik48] { display: flex; gap: 3px; }
.rw__row > *[b-8oeok4ik48] { flex: 1 1 0; min-width: 0; }

.rw__row--mark[b-8oeok4ik48] { height: 20px; align-items: flex-end; }

.rw__mark[b-8oeok4ik48] {
    position: relative;
    height: 100%;
}

.rw__mark.is-win[b-8oeok4ik48] {
    border-bottom: 2px solid var(--h-accent);
}

.rw__mark-label[b-8oeok4ik48],
.rw__now-label[b-8oeok4ik48] {
    position: absolute;
    bottom: 4px;
    left: 0;
    font-family: var(--h-font-mono);
    font-size: 0.64rem;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.rw__mark-label[b-8oeok4ik48] { color: var(--h-accent); }

.rw__mark.is-now[b-8oeok4ik48] { border-bottom: 2px solid var(--h-sky); }
.rw__now-label[b-8oeok4ik48] { color: var(--h-sky); right: 0; left: auto; }

.rw__seg[b-8oeok4ik48] {
    height: 26px;
    border-radius: 4px;
    background: var(--c);
    transition: transform 0.12s ease, filter 0.12s ease;
}

.rw__row--seg[b-8oeok4ik48] { height: 26px; }

.rw__seg:hover[b-8oeok4ik48] {
    transform: translateY(-2px);
    filter: brightness(1.12);
    cursor: help;
}

.rw__seg.is-past[b-8oeok4ik48] { opacity: 0.28; }

.rw__tick[b-8oeok4ik48] {
    font-family: var(--h-font-mono);
    font-size: 0.62rem;
    color: var(--h-text-faint);
    text-align: center;
    white-space: nowrap;
    overflow: visible;
}

/* Legend */
.rw__legend[b-8oeok4ik48] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0;
    padding: 12px 0 0;
    list-style: none;
    border-top: 1px solid var(--h-border);
}

.rw__legend li[b-8oeok4ik48] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.74rem;
    color: var(--h-text-dim);
}

.rw__swatch[b-8oeok4ik48] {
    width: 11px;
    height: 11px;
    border-radius: 3px;
}

.rw__empty[b-8oeok4ik48] {
    color: var(--h-text-dim);
    font-size: 0.9rem;
}

@media (max-width: 520px) {
    .rw__seg[b-8oeok4ik48] { height: 30px; }
    .rw__tick[b-8oeok4ik48] { font-size: 0.55rem; }
}

@media (prefers-reduced-motion: reduce) {
    .rw__seg[b-8oeok4ik48] { transition: none; }
}
/* _content/Home/Components/Molecules/WeatherGlance.razor.rz.scp.css */
.wg[b-bba89878u3] {
    display: inline-flex;
    align-items: center;
    gap: var(--h-space-2);
    padding: 0.25rem 0.6rem;
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-pill);
    background: var(--h-surface-sunk);
    color: var(--h-text);
    text-decoration: none;
    white-space: nowrap;
    transition: background var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease);
}

.wg:hover[b-bba89878u3] {
    background: var(--h-surface-hover);
    border-color: var(--h-border-strong);
}

.wg:focus-visible[b-bba89878u3] {
    outline: 2px solid var(--h-focus);
    outline-offset: 2px;
}

.wg__emoji[b-bba89878u3] { font-size: var(--h-text-md); line-height: 1; }

/* Tabular figures so the header does not jitter as the temperature ticks over. */
.wg__temp[b-bba89878u3] {
    font-family: var(--h-font-mono);
    font-size: var(--h-text-sm);
    font-weight: var(--h-weight-semi);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.wg__deg[b-bba89878u3] { color: var(--h-text-faint); }

/* On a phone the emoji alone is enough of a cue next to the temperature. */
@media (max-width: 600px) {
    .wg[b-bba89878u3] {
        padding: 0.25rem 0.4rem;
        border-color: transparent;
        background: transparent;
    }
}
/* _content/Home/Components/NodeComponents/BulbComponent.razor.rz.scp.css */
/* The .node shell is repeated in DimmerComponent and PlugComponent rather than shared
   through a parent's ::deep, so each card stays self-contained and can be dropped on any
   page. Same trade-off the Weather molecules make. */

.node[b-v9eyx1xt5t] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-3);
    padding: var(--h-space-4);
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-left: 3px solid var(--h-border-strong);
    border-radius: var(--h-radius-lg);
    box-shadow: var(--h-shadow-sm);
    color: var(--h-text);
    font-family: var(--h-font-body);
    transition: border-color var(--h-duration-fast) var(--h-ease);
}

.node--on[b-v9eyx1xt5t] {
    border-left-color: var(--h-gold);
    border-color: color-mix(in srgb, var(--h-gold) 30%, transparent);
}

.node__head[b-v9eyx1xt5t] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
}

.node__icon[b-v9eyx1xt5t] {
    flex: 0 0 auto;
    width: 1.6rem;
    color: var(--h-text-faint);
    font-size: var(--h-text-lg);
    line-height: 1;
    text-align: center;
}

/* Warm accent for bulbs: it reads as "lit" in a way the green does not. */
.node--on .node__icon[b-v9eyx1xt5t] { color: var(--h-gold); }

.node__id[b-v9eyx1xt5t] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    flex: 1;
}

.node__name[b-v9eyx1xt5t] {
    font-size: var(--h-text-md);
    font-weight: var(--h-weight-semi);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.node__meta[b-v9eyx1xt5t] {
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.node__power[b-v9eyx1xt5t] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    /* Comfortable to tap on the shared tablet. */
    width: 2.75rem;
    height: 2.75rem;
    border: 1px solid var(--h-border-strong);
    border-radius: var(--h-radius-pill);
    background: var(--h-surface-sunk);
    color: var(--h-text-faint);
    font-size: var(--h-text-lg);
    line-height: 1;
    cursor: pointer;
    transition: background var(--h-duration-fast) var(--h-ease),
                color var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease);
}

.node__power:hover[b-v9eyx1xt5t] { color: var(--h-text); background: var(--h-surface-hover); }

.node__power:focus-visible[b-v9eyx1xt5t] { outline: 2px solid var(--h-focus); outline-offset: 2px; }

.node--on .node__power[b-v9eyx1xt5t] {
    border-color: transparent;
    background: var(--h-gold);
    color: var(--h-text-on-accent);
}

.node__body[b-v9eyx1xt5t] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
}

.node__level[b-v9eyx1xt5t] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    flex: 1;
    min-width: 0;
}

.node__pct[b-v9eyx1xt5t] {
    flex: 0 0 auto;
    min-width: 3.2rem;
    color: var(--h-text-dim);
    font-family: var(--h-font-mono);
    font-size: var(--h-text-sm);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.node__set[b-v9eyx1xt5t] { flex: 0 0 auto; }

@media (prefers-reduced-motion: reduce) {
    .node[b-v9eyx1xt5t],
    .node__power[b-v9eyx1xt5t] { transition: none; }
}
/* _content/Home/Components/NodeComponents/DimmerComponent.razor.rz.scp.css */
/* The .node shell is repeated in BulbComponent and PlugComponent rather than shared through
   a parent's ::deep, so each card stays self-contained and can be dropped on any page. Same
   trade-off the Weather molecules make. */

.node[b-wg78xl49wt] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-3);
    padding: var(--h-space-4);
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-left: 3px solid var(--h-border-strong);
    border-radius: var(--h-radius-lg);
    box-shadow: var(--h-shadow-sm);
    color: var(--h-text);
    font-family: var(--h-font-body);
    transition: border-color var(--h-duration-fast) var(--h-ease);
}

.node--on[b-wg78xl49wt] {
    border-left-color: var(--h-accent);
    border-color: color-mix(in srgb, var(--h-accent) 30%, transparent);
}

.node__head[b-wg78xl49wt] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
}

.node__icon[b-wg78xl49wt] {
    flex: 0 0 auto;
    width: 1.6rem;
    color: var(--h-text-faint);
    font-size: var(--h-text-lg);
    line-height: 1;
    text-align: center;
}

.node--on .node__icon[b-wg78xl49wt] { color: var(--h-accent); }

.node__id[b-wg78xl49wt] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    flex: 1;
}

.node__name[b-wg78xl49wt] {
    font-size: var(--h-text-md);
    font-weight: var(--h-weight-semi);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.node__meta[b-wg78xl49wt] {
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.node__power[b-wg78xl49wt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    /* Comfortable to tap on the shared tablet. */
    width: 2.75rem;
    height: 2.75rem;
    border: 1px solid var(--h-border-strong);
    border-radius: var(--h-radius-pill);
    background: var(--h-surface-sunk);
    color: var(--h-text-faint);
    font-size: var(--h-text-lg);
    line-height: 1;
    cursor: pointer;
    transition: background var(--h-duration-fast) var(--h-ease),
                color var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease);
}

.node__power:hover[b-wg78xl49wt] { color: var(--h-text); background: var(--h-surface-hover); }

.node__power:focus-visible[b-wg78xl49wt] { outline: 2px solid var(--h-focus); outline-offset: 2px; }

.node--on .node__power[b-wg78xl49wt] {
    border-color: transparent;
    background: var(--h-accent);
    color: var(--h-text-on-accent);
}

.node__body[b-wg78xl49wt] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
}

/* ---- Dimmer level ---- */

.node__level[b-wg78xl49wt] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    flex: 1;
    min-width: 0;
}

.node__pct[b-wg78xl49wt] {
    flex: 0 0 auto;
    min-width: 3.2rem;
    color: var(--h-text-dim);
    font-family: var(--h-font-mono);
    font-size: var(--h-text-sm);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.node__unit[b-wg78xl49wt] { color: var(--h-text-faint); }

.node__set[b-wg78xl49wt] { flex: 0 0 auto; }

@media (prefers-reduced-motion: reduce) {
    .node[b-wg78xl49wt],
    .node__power[b-wg78xl49wt] { transition: none; }
}
/* _content/Home/Components/NodeComponents/MineCraftServerComponent.razor.rz.scp.css */
/* The .node shell is repeated across the device cards rather than shared through a parent's
   ::deep, so each card stays self-contained and can be dropped on any page. */

.node[b-yemgu0ac31] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-3);
    padding: var(--h-space-4);
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-left: 3px solid var(--h-border-strong);
    border-radius: var(--h-radius-lg);
    box-shadow: var(--h-shadow-sm);
    color: var(--h-text);
    font-family: var(--h-font-body);
    transition: border-color var(--h-duration-fast) var(--h-ease);
}

.node--on[b-yemgu0ac31] {
    border-left-color: var(--h-accent);
    border-color: color-mix(in srgb, var(--h-accent) 30%, transparent);
}

.node__head[b-yemgu0ac31] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
}

/* Servers have no icon of their own, so the initial stands in — same device as the scene card. */
.node__mark[b-yemgu0ac31] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    border-radius: var(--h-radius-md);
    background: var(--h-surface-sunk);
    color: var(--h-text-dim);
    font-family: var(--h-font-display);
    font-size: var(--h-text-md);
    font-weight: var(--h-weight-bold);
    line-height: 1;
}

.node--on .node__mark[b-yemgu0ac31] {
    background: var(--h-accent);
    color: var(--h-text-on-accent);
}

.node__id[b-yemgu0ac31] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    flex: 1;
}

.node__name[b-yemgu0ac31] {
    font-size: var(--h-text-md);
    font-weight: var(--h-weight-semi);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.node__meta[b-yemgu0ac31] {
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.node--on .node__meta[b-yemgu0ac31] { color: var(--h-accent); }

.node__power[b-yemgu0ac31] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    /* Comfortable to tap on the shared tablet. */
    width: 2.75rem;
    height: 2.75rem;
    border: 1px solid var(--h-border-strong);
    border-radius: var(--h-radius-pill);
    background: var(--h-surface-sunk);
    color: var(--h-text-faint);
    font-size: var(--h-text-lg);
    line-height: 1;
    cursor: pointer;
    transition: background var(--h-duration-fast) var(--h-ease),
                color var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease);
}

.node__power:hover:not(:disabled)[b-yemgu0ac31] { color: var(--h-text); background: var(--h-surface-hover); }

.node__power:focus-visible[b-yemgu0ac31] { outline: 2px solid var(--h-focus); outline-offset: 2px; }

.node__power:disabled[b-yemgu0ac31] { cursor: progress; opacity: 0.7; }

.node--on .node__power[b-yemgu0ac31] {
    border-color: transparent;
    background: var(--h-accent);
    color: var(--h-text-on-accent);
}

/* Shrunk to sit inside the power button while a start or stop is in flight. */
.node__spinner[b-yemgu0ac31] {
    width: 16px;
    height: 16px;
    border-width: 2px;
}

.mc__error[b-yemgu0ac31] { font-size: var(--h-text-xs); }

@media (prefers-reduced-motion: reduce) {
    .node[b-yemgu0ac31],
    .node__power[b-yemgu0ac31] { transition: none; }
}
/* _content/Home/Components/NodeComponents/PlugComponent.razor.rz.scp.css */
/* The .node shell is repeated in DimmerComponent and BulbComponent rather than shared
   through a parent's ::deep, so each card stays self-contained and can be dropped on any
   page. Same trade-off the Weather molecules make. */

.node[b-gwvv0ug683] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-3);
    padding: var(--h-space-4);
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-left: 3px solid var(--h-border-strong);
    border-radius: var(--h-radius-lg);
    box-shadow: var(--h-shadow-sm);
    color: var(--h-text);
    font-family: var(--h-font-body);
    transition: border-color var(--h-duration-fast) var(--h-ease);
}

.node--on[b-gwvv0ug683] {
    border-left-color: var(--h-accent);
    border-color: color-mix(in srgb, var(--h-accent) 30%, transparent);
}

.node__head[b-gwvv0ug683] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
}

.node__icon[b-gwvv0ug683] {
    flex: 0 0 auto;
    width: 1.6rem;
    color: var(--h-text-faint);
    font-size: var(--h-text-lg);
    line-height: 1;
    text-align: center;
}

.node--on .node__icon[b-gwvv0ug683] { color: var(--h-accent); }

.node__id[b-gwvv0ug683] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    flex: 1;
}

.node__name[b-gwvv0ug683] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    font-size: var(--h-text-md);
    font-weight: var(--h-weight-semi);
    line-height: 1.2;
    min-width: 0;
}

.node__meta[b-gwvv0ug683] {
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.node__power[b-gwvv0ug683] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    /* Comfortable to tap on the shared tablet. */
    width: 2.75rem;
    height: 2.75rem;
    border: 1px solid var(--h-border-strong);
    border-radius: var(--h-radius-pill);
    background: var(--h-surface-sunk);
    color: var(--h-text-faint);
    font-size: var(--h-text-lg);
    line-height: 1;
    cursor: pointer;
    transition: background var(--h-duration-fast) var(--h-ease),
                color var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease);
}

.node__power:hover[b-gwvv0ug683] { color: var(--h-text); background: var(--h-surface-hover); }

.node__power:focus-visible[b-gwvv0ug683] { outline: 2px solid var(--h-focus); outline-offset: 2px; }

.node--on .node__power[b-gwvv0ug683] {
    border-color: transparent;
    background: var(--h-accent);
    color: var(--h-text-on-accent);
}

/* ---- Plug specifics ---- */

.plug__lock[b-gwvv0ug683] {
    flex: 0 0 auto;
    padding: 0.1rem 0.4rem;
    border-radius: var(--h-radius-pill);
    background: color-mix(in srgb, var(--h-gold) 22%, transparent);
    color: var(--h-gold);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.plug__stats[b-gwvv0ug683] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--h-space-2);
    padding-top: var(--h-space-3);
    border-top: 1px solid var(--h-border);
}

.plug__stat[b-gwvv0ug683] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.plug__stat-label[b-gwvv0ug683] {
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

/* Tabular figures so the four readouts do not jitter as live values tick over. */
.plug__stat-val[b-gwvv0ug683] {
    color: var(--h-text);
    font-family: var(--h-font-mono);
    font-size: var(--h-text-sm);
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.plug__stat-val small[b-gwvv0ug683] {
    margin-left: 0.1rem;
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
}

.plug__link[b-gwvv0ug683] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
}

.plug__link-label[b-gwvv0ug683] {
    flex: 0 0 auto;
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.plug__link-track[b-gwvv0ug683] {
    flex: 1;
    height: 4px;
    min-width: 0;
    border-radius: var(--h-radius-pill);
    background: var(--h-surface-sunk);
    overflow: hidden;
}

.plug__link-fill[b-gwvv0ug683] {
    height: 100%;
    border-radius: var(--h-radius-pill);
    transition: width var(--h-duration-base) var(--h-ease);
}

.plug__link-fill--weak[b-gwvv0ug683] { background: var(--h-danger); }
.plug__link-fill--fair[b-gwvv0ug683] { background: var(--h-warning); }
.plug__link-fill--good[b-gwvv0ug683] { background: var(--h-info); }
.plug__link-fill--strong[b-gwvv0ug683] { background: var(--h-success); }

.plug__link-val[b-gwvv0ug683] {
    flex: 0 0 auto;
    min-width: 2.6rem;
    color: var(--h-text-dim);
    font-family: var(--h-font-mono);
    font-size: var(--h-text-2xs);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.plug__link-unit[b-gwvv0ug683] { color: var(--h-text-faint); }

/* Four metering columns are too tight on a phone. */
@media (max-width: 420px) {
    .plug__stats[b-gwvv0ug683] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
    .node[b-gwvv0ug683],
    .node__power[b-gwvv0ug683],
    .plug__link-fill[b-gwvv0ug683] { transition: none; }
}
/* _content/Home/Components/NodeComponents/SceneComponent.razor.rz.scp.css */
.scene[b-4bf5lsixtl] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    width: 100%;
    padding: var(--h-space-3);
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-left: 3px solid var(--h-border-strong);
    border-radius: var(--h-radius-lg);
    box-shadow: var(--h-shadow-sm);
    color: var(--h-text);
    font-family: var(--h-font-body);
    text-align: left;
    cursor: pointer;
    /* Comfortable to tap on the shared tablet. */
    min-height: 3.5rem;
    transition: background var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease);
}

.scene:hover[b-4bf5lsixtl] { background: var(--h-surface-hover); }

.scene:focus-visible[b-4bf5lsixtl] { outline: 2px solid var(--h-focus); outline-offset: 2px; }

.scene--on[b-4bf5lsixtl] {
    border-color: color-mix(in srgb, var(--h-accent) 45%, transparent);
    border-left-color: var(--h-accent);
    background: color-mix(in srgb, var(--h-accent) 12%, transparent);
}

.scene__mark[b-4bf5lsixtl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    border-radius: var(--h-radius-md);
    background: var(--h-surface-sunk);
    color: var(--h-text-dim);
    font-family: var(--h-font-display);
    font-size: var(--h-text-md);
    font-weight: var(--h-weight-bold);
    line-height: 1;
}

.scene--on .scene__mark[b-4bf5lsixtl] {
    background: var(--h-accent);
    color: var(--h-text-on-accent);
}

.scene__body[b-4bf5lsixtl] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    flex: 1;
}

.scene__name[b-4bf5lsixtl] {
    font-size: var(--h-text-md);
    font-weight: var(--h-weight-semi);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.scene__meta[b-4bf5lsixtl] {
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.scene__state[b-4bf5lsixtl] {
    flex: 0 0 auto;
    padding: 0.2rem 0.55rem;
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-pill);
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.scene--on .scene__state[b-4bf5lsixtl] {
    border-color: color-mix(in srgb, var(--h-accent) 45%, transparent);
    background: color-mix(in srgb, var(--h-accent) 16%, transparent);
    color: var(--h-accent);
}

@media (prefers-reduced-motion: reduce) {
    .scene[b-4bf5lsixtl] { transition: none; }
}
/* _content/Home/Components/Pages/Admin/UsersPage.razor.rz.scp.css */
.admin[b-4jg2z3telv] {
    min-height: calc(100vh - var(--h-appbar-height));
    padding: clamp(0.75rem, 2.2vw, 1.75rem);
    background: linear-gradient(168deg, var(--h-ink-700) 0%, var(--h-ink-800) 52%, var(--h-ink-900) 100%);
    background-attachment: fixed;
    color: var(--h-text);
    font-family: var(--h-font-body);
}

/* The dark gradient above is decorative; light mode drops to the flat surface. */
[data-theme="light"] .admin[b-4jg2z3telv] { background: var(--h-bg); }

.admin__bar[b-4jg2z3telv] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    flex-wrap: wrap;
    margin-bottom: var(--h-space-5);
}

.admin__title[b-4jg2z3telv] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-2xl);
    font-weight: var(--h-weight-bold);
    letter-spacing: -0.02em;
    line-height: 1;
}

.admin__subtitle[b-4jg2z3telv] { margin: 0.35rem 0 0; color: var(--h-text-dim); font-size: var(--h-text-sm); }

.admin__spacer[b-4jg2z3telv] { flex: 1 1 auto; }

.admin__state[b-4jg2z3telv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-7) var(--h-space-4);
    text-align: center;
    color: var(--h-text-dim);
}

.admin__state-title[b-4jg2z3telv] { font-family: var(--h-font-display); font-size: var(--h-text-lg); color: var(--h-text); }
.admin__state-detail[b-4jg2z3telv] { font-size: var(--h-text-sm); max-width: 30rem; }

.admin__empty[b-4jg2z3telv] { color: var(--h-text-faint); font-style: italic; }

.admin__main[b-4jg2z3telv] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--h-space-4);
    align-items: start;
}

.admin__main--with-panel[b-4jg2z3telv] { grid-template-columns: minmax(0, 1fr) var(--h-panel-width); }

.admin__list[b-4jg2z3telv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    gap: var(--h-space-3);
    align-content: start;
}

.admin__panel[b-4jg2z3telv] { position: sticky; top: calc(var(--h-appbar-height) + 1rem); }

.admin__scrim[b-4jg2z3telv] { display: none; }

.admin__toggle[b-4jg2z3telv] {
    grid-column: 1 / -1;
    display: inline-flex;
    align-items: center;
    gap: var(--h-space-2);
    color: var(--h-text-dim);
    font-size: var(--h-text-sm);
    cursor: pointer;
}

.admin__toggle input[b-4jg2z3telv] { width: 1rem; height: 1rem; accent-color: var(--h-accent); cursor: pointer; }

/* ---- Person card ---- */

.card[b-4jg2z3telv] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    padding: var(--h-space-3);
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-left: 3px solid var(--person);
    border-radius: var(--h-radius-lg);
    color: var(--h-text);
    text-align: left;
    cursor: pointer;
    transition: background var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease);
}

.card:hover[b-4jg2z3telv] { background: var(--h-surface-hover); }

.card--active[b-4jg2z3telv] {
    border-color: color-mix(in srgb, var(--person) 60%, transparent);
    border-left-color: var(--person);
    background: color-mix(in srgb, var(--person) 12%, transparent);
}

.card--off[b-4jg2z3telv] { opacity: 0.55; }

.card__body[b-4jg2z3telv] { display: flex; flex-direction: column; gap: 0.25rem; min-width: 0; flex: 1; }

.card__name[b-4jg2z3telv] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    flex-wrap: wrap;
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-semi);
}

.card__tag[b-4jg2z3telv] {
    padding: 0.1rem 0.4rem;
    border-radius: var(--h-radius-pill);
    background: var(--h-surface-sunk);
    color: var(--h-text-faint);
    font-family: var(--h-font-body);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.card__tag--admin[b-4jg2z3telv] { background: color-mix(in srgb, var(--h-gold) 22%, transparent); color: var(--h-gold); }
.card__tag--off[b-4jg2z3telv] { background: color-mix(in srgb, var(--h-rose) 20%, transparent); color: var(--h-rose); }

.card__meta[b-4jg2z3telv] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.15rem 0.75rem;
    color: var(--h-text-faint);
    font-size: var(--h-text-xs);
}

.card__meta span[b-4jg2z3telv] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }

@media (max-width: 900px) {
    .admin__main[b-4jg2z3telv],
    .admin__main--with-panel[b-4jg2z3telv] { grid-template-columns: minmax(0, 1fr); }

    .admin__panel[b-4jg2z3telv] { position: static; }

    .admin__scrim[b-4jg2z3telv] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1200;
        background: rgba(0, 0, 0, 0.5);
    }
}
/* _content/Home/Components/Pages/AiChatPage.razor.rz.scp.css */
/* ── Anton: local assistant chat ──────────────────────────────────────────────
   The transcript is injected as a MarkupString, so its elements never receive
   this stylesheet's b-* scope attribute. Every rule that targets rendered
   markdown therefore goes through ::deep, which moves the scope up to the
   nearest element the component actually rendered. */

.anton[b-eysgg46ono] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-3);
    /* The shell gives back the fixed app bar's height, so this fills the viewport
       exactly and lets the transcript own the only scrollbar. */
    height: calc(100vh - var(--h-appbar-height));
    padding: clamp(0.75rem, 2.2vw, 1.75rem);
    background:
        radial-gradient(1100px 500px at 82% -10%, rgba(232, 177, 76, 0.10), transparent 60%),
        radial-gradient(900px 560px at 4% 4%, rgba(95, 168, 211, 0.10), transparent 55%),
        linear-gradient(168deg, var(--h-ink-700) 0%, var(--h-ink-800) 52%, var(--h-ink-900) 100%);
    background-attachment: fixed;
    color: var(--h-text);
    font-family: var(--h-font-body);
    overflow: hidden;
}

/* The dark gradient above is decorative; light mode drops to the flat surface. */
[data-theme="light"] .anton[b-eysgg46ono] { background: var(--h-bg); }

/* ---- Top bar ---- */

.anton__bar[b-eysgg46ono] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    flex-wrap: wrap;
    flex: 0 0 auto;
}

.anton__title-group[b-eysgg46ono] { display: flex; align-items: baseline; gap: var(--h-space-2); }

.anton__title[b-eysgg46ono] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-2xl);
    font-weight: var(--h-weight-bold);
    letter-spacing: -0.02em;
    line-height: 1;
    color: var(--h-text);
}

.anton__model[b-eysgg46ono] {
    font-family: var(--h-font-mono);
    font-size: var(--h-text-xs);
    color: var(--h-text-faint);
}

.anton__spacer[b-eysgg46ono] { flex: 1 1 auto; }

/* ---- Error ---- */

.anton__error[b-eysgg46ono] { flex: 0 0 auto; align-items: center; }
.anton__error > span:first-child[b-eysgg46ono] { flex: 1 1 auto; }
.anton__error-x[b-eysgg46ono] { flex: 0 0 auto; margin: -0.2rem -0.35rem -0.2rem 0; }

/* ---- Transcript ---- */

.anton__scroll[b-eysgg46ono] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: var(--h-space-2) var(--h-space-1);
    display: flex;
    flex-direction: column;
    gap: var(--h-space-3);
}

.anton__empty[b-eysgg46ono] {
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-7) var(--h-space-4);
    text-align: center;
    color: var(--h-text-dim);
}

.anton__empty-glyph[b-eysgg46ono] {
    font-size: 2rem;
    line-height: 1;
    color: var(--h-accent);
    opacity: 0.7;
}

.anton__empty-title[b-eysgg46ono] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-semi);
    color: var(--h-text);
}

.anton__empty-detail[b-eysgg46ono] { margin: 0; font-size: var(--h-text-sm); max-width: 28rem; }

/* ---- Messages ---- */

.msg[b-eysgg46ono] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-2);
    max-width: min(52rem, 100%);
    padding: var(--h-space-3) var(--h-space-4);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-lg);
    background: var(--h-surface);
    box-shadow: var(--h-shadow-sm);
}

/* Author is carried by alignment and the accent edge, not by colour alone. */
.msg--user[b-eysgg46ono] {
    align-self: flex-end;
    border-left: 3px solid var(--h-accent);
}

.msg--anton[b-eysgg46ono] {
    align-self: flex-start;
    border-left: 3px solid var(--h-sky);
}

.msg__meta[b-eysgg46ono] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    font-size: var(--h-text-xs);
    color: var(--h-text-faint);
}

.msg__who[b-eysgg46ono] {
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--h-text-dim);
}

.msg__time[b-eysgg46ono] { font-family: var(--h-font-mono); font-variant-numeric: tabular-nums; }

.msg__copy[b-eysgg46ono] {
    margin-left: auto;
    padding: 0.15rem 0.5rem;
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-pill);
    background: transparent;
    color: var(--h-text-faint);
    font-family: var(--h-font-body);
    font-size: var(--h-text-2xs);
    cursor: pointer;
    transition: color var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease);
}

.msg__copy:hover[b-eysgg46ono] { color: var(--h-text); border-color: var(--h-border-strong); }

.msg__body[b-eysgg46ono] { font-size: var(--h-text-md); line-height: var(--h-leading-normal); }

/* User text is not markdown-rendered, so newlines must be preserved here. */
.msg__body--plain[b-eysgg46ono] { white-space: pre-wrap; word-break: break-word; }

/* ---- Typing indicator ---- */

.msg__thinking[b-eysgg46ono] { display: flex; align-items: center; gap: 5px; padding: var(--h-space-1) 0; }

.msg__dot[b-eysgg46ono] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--h-text-faint);
    animation: anton-pulse-b-eysgg46ono 1.2s var(--h-ease) infinite;
}

.msg__dot:nth-child(2)[b-eysgg46ono] { animation-delay: 0.15s; }
.msg__dot:nth-child(3)[b-eysgg46ono] { animation-delay: 0.3s; }

@keyframes anton-pulse-b-eysgg46ono {
    0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
    30%           { opacity: 1;   transform: translateY(-3px); }
}

/* ---- Composer ---- */

.anton__composer[b-eysgg46ono] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-end;
    gap: var(--h-space-2);
    padding: var(--h-space-3);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-lg);
    background: var(--h-surface);
    box-shadow: var(--h-shadow-md);
}

.anton__input[b-eysgg46ono] {
    flex: 1 1 auto;
    min-height: 44px;
    max-height: 40vh;
    overflow-y: auto;
    resize: none;
    line-height: var(--h-leading-normal);
}

.anton__send[b-eysgg46ono] { flex: 0 0 auto; min-height: 44px; }

.anton__send-spinner[b-eysgg46ono] {
    width: 14px;
    height: 14px;
    border-width: 2px;
    border-top-color: var(--h-text-on-accent);
}

/* ---- Rendered markdown (MarkupString — hence ::deep) ---- */

.markdown-content[b-eysgg46ono] { word-break: break-word; }

.markdown-content[b-eysgg46ono]  > *:first-child { margin-top: 0; }
.markdown-content[b-eysgg46ono]  > *:last-child { margin-bottom: 0; }

.markdown-content[b-eysgg46ono]  p { margin: 0 0 var(--h-space-3); }

.markdown-content[b-eysgg46ono]  h1,
.markdown-content[b-eysgg46ono]  h2,
.markdown-content[b-eysgg46ono]  h3,
.markdown-content[b-eysgg46ono]  h4 {
    margin: var(--h-space-4) 0 var(--h-space-2);
    font-family: var(--h-font-display);
    font-weight: var(--h-weight-semi);
    line-height: var(--h-leading-tight);
}

.markdown-content[b-eysgg46ono]  h1 { font-size: var(--h-text-xl); }
.markdown-content[b-eysgg46ono]  h2 { font-size: var(--h-text-lg); }
.markdown-content[b-eysgg46ono]  h3,
.markdown-content[b-eysgg46ono]  h4 { font-size: var(--h-text-md); }

.markdown-content[b-eysgg46ono]  ul,
.markdown-content[b-eysgg46ono]  ol { margin: 0 0 var(--h-space-3); padding-left: var(--h-space-5); }

.markdown-content[b-eysgg46ono]  li { margin-bottom: var(--h-space-1); }

.markdown-content[b-eysgg46ono]  a { color: var(--h-info); text-decoration: underline; }

.markdown-content[b-eysgg46ono]  blockquote {
    margin: 0 0 var(--h-space-3);
    padding: var(--h-space-1) var(--h-space-3);
    border-left: 3px solid var(--h-border-strong);
    color: var(--h-text-dim);
}

.markdown-content[b-eysgg46ono]  hr {
    margin: var(--h-space-4) 0;
    border: 0;
    border-top: 1px solid var(--h-border);
}

.markdown-content[b-eysgg46ono]  table {
    width: 100%;
    margin: 0 0 var(--h-space-3);
    border-collapse: collapse;
    font-size: var(--h-text-sm);
}

.markdown-content[b-eysgg46ono]  th,
.markdown-content[b-eysgg46ono]  td {
    padding: var(--h-space-2);
    border: 1px solid var(--h-border);
    text-align: left;
}

.markdown-content[b-eysgg46ono]  th { background: var(--h-surface-sunk); font-weight: var(--h-weight-semi); }

/* Inline code only — the :not(pre) guard keeps block code on its own rules. */
.markdown-content[b-eysgg46ono]  :not(pre) > code {
    padding: 0.1rem 0.35rem;
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-sm);
    background: var(--h-surface-sunk);
    font-family: var(--h-font-mono);
    font-size: 0.92em;
}

/* ---- Code blocks (also MarkupString) ---- */

.markdown-content[b-eysgg46ono]  .code-block-wrapper {
    margin: 0 0 var(--h-space-3);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-md);
    background: var(--h-surface-sunk);
    overflow: hidden;
}

.markdown-content[b-eysgg46ono]  .code-block-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--h-space-2);
    padding: var(--h-space-1) var(--h-space-2);
    border-bottom: 1px solid var(--h-border);
}

.markdown-content[b-eysgg46ono]  .code-block-lang {
    font-family: var(--h-font-mono);
    font-size: var(--h-text-2xs);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--h-text-faint);
}

.markdown-content[b-eysgg46ono]  .copy-code-button {
    padding: 0.15rem 0.5rem;
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-pill);
    background: transparent;
    color: var(--h-text-faint);
    font-family: var(--h-font-body);
    font-size: var(--h-text-2xs);
    cursor: pointer;
}

.markdown-content[b-eysgg46ono]  .copy-code-button:hover:not(:disabled) {
    color: var(--h-text);
    border-color: var(--h-border-strong);
}

.markdown-content[b-eysgg46ono]  .copy-code-button:disabled { color: var(--h-accent); cursor: default; }

.markdown-content[b-eysgg46ono]  .code-block-wrapper pre {
    margin: 0;
    padding: var(--h-space-3);
    overflow-x: auto;
}

.markdown-content[b-eysgg46ono]  .code-block-wrapper pre code {
    display: block;
    white-space: pre;
    border: 0;
    padding: 0;
    background: transparent;
    font-family: var(--h-font-mono);
    font-size: var(--h-text-sm);
    line-height: 1.55;
}

/* ---- Mobile ---- */

@media (max-width: 600px) {
    .msg[b-eysgg46ono] { max-width: 100%; }
    .anton__composer[b-eysgg46ono] { padding: var(--h-space-2); }
    .anton__send span:last-child[b-eysgg46ono] { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .msg__dot[b-eysgg46ono] { animation: none; opacity: 0.6; }
}
/* _content/Home/Components/Pages/CalendarPage.razor.rz.scp.css */
.cal[b-i5ry4kaz58] {
    min-height: calc(100vh - var(--h-appbar-height));
    padding: clamp(0.75rem, 2.2vw, 1.75rem);
    background:
        radial-gradient(1100px 500px at 82% -10%, rgba(232, 177, 76, 0.10), transparent 60%),
        radial-gradient(900px 560px at 4% 4%, rgba(95, 168, 211, 0.10), transparent 55%),
        linear-gradient(168deg, var(--h-ink-700) 0%, var(--h-ink-800) 52%, var(--h-ink-900) 100%);
    background-attachment: fixed;
    color: var(--h-text);
    font-family: var(--h-font-body);
}

/* The dark gradient above is decorative; light mode drops to the flat surface. */
[data-theme="light"] .cal[b-i5ry4kaz58] { background: var(--h-bg); }

/* ---- Top bar ---- */

.cal__bar[b-i5ry4kaz58] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    flex-wrap: wrap;
    margin-bottom: var(--h-space-4);
}

.cal__title-group[b-i5ry4kaz58] { display: flex; align-items: baseline; gap: var(--h-space-2); }

.cal__title[b-i5ry4kaz58] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-2xl);
    font-weight: var(--h-weight-bold);
    letter-spacing: -0.02em;
    line-height: 1;
    color: var(--h-text);
}

.cal__year[b-i5ry4kaz58] {
    font-family: var(--h-font-mono);
    font-size: var(--h-text-md);
    color: var(--h-text-faint);
}

.cal__nav[b-i5ry4kaz58] { display: flex; align-items: center; gap: var(--h-space-1); }

.cal__spacer[b-i5ry4kaz58] { flex: 1 1 auto; }

/* ---- Person filter ---- */

.cal__people[b-i5ry4kaz58] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    flex-wrap: wrap;
    margin-bottom: var(--h-space-4);
    padding-bottom: var(--h-space-3);
    border-bottom: 1px solid var(--h-border);
}

.person[b-i5ry4kaz58] {
    display: inline-flex;
    align-items: center;
    gap: var(--h-space-2);
    padding: 0.25rem 0.65rem 0.25rem 0.25rem;
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-pill);
    background: transparent;
    color: var(--h-text-faint);
    font-family: var(--h-font-body);
    font-size: var(--h-text-sm);
    font-weight: var(--h-weight-medium);
    cursor: pointer;
    /* Dimmed until active, so the colour reads as "included". */
    opacity: 0.5;
    transition: opacity var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease),
                background var(--h-duration-fast) var(--h-ease);
}

.person:hover[b-i5ry4kaz58] { opacity: 0.8; }

.person--on[b-i5ry4kaz58] {
    opacity: 1;
    color: var(--h-text);
    border-color: color-mix(in srgb, var(--person) 55%, transparent);
    background: color-mix(in srgb, var(--person) 14%, transparent);
}

.person__name[b-i5ry4kaz58] { line-height: 1; }

.cal__reset[b-i5ry4kaz58] { margin-left: var(--h-space-1); font-size: var(--h-text-xs); }

/* ---- States ---- */

.cal__state[b-i5ry4kaz58] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-7) var(--h-space-4);
    text-align: center;
    color: var(--h-text-dim);
}

.cal__state--error[b-i5ry4kaz58] { color: var(--h-text); }

.cal__state-title[b-i5ry4kaz58] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-semi);
}

.cal__state-detail[b-i5ry4kaz58] { color: var(--h-text-dim); font-size: var(--h-text-sm); max-width: 30rem; }

/* ---- Main layout ---- */

.cal__main[b-i5ry4kaz58] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--h-space-4);
    align-items: start;
}

.cal__main--with-panel[b-i5ry4kaz58] {
    grid-template-columns: minmax(0, 1fr) var(--h-panel-width);
}

.cal__views[b-i5ry4kaz58] { min-width: 0; }

.cal__panel[b-i5ry4kaz58] { position: sticky; top: calc(var(--h-appbar-height) + 1rem); }

.cal__scrim[b-i5ry4kaz58] { display: none; }

/* ---- Mobile ---- */

@media (max-width: 900px) {
    .cal__main[b-i5ry4kaz58],
    .cal__main--with-panel[b-i5ry4kaz58] {
        grid-template-columns: minmax(0, 1fr);
    }

    /* The panel is a fixed bottom sheet at this width, so it leaves the grid flow. */
    .cal__panel[b-i5ry4kaz58] { position: static; }

    .cal__scrim[b-i5ry4kaz58] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1200;
        background: rgba(0, 0, 0, 0.5);
        animation: cal-fade-b-i5ry4kaz58 var(--h-duration-base) var(--h-ease);
    }

    .cal__bar[b-i5ry4kaz58] { gap: var(--h-space-2); }
    .cal__title[b-i5ry4kaz58] { font-size: var(--h-text-xl); }
}

@media (max-width: 560px) {
    .cal__bar > .h-btn--primary[b-i5ry4kaz58] { flex: 1 1 100%; justify-content: center; }
    .person__name[b-i5ry4kaz58] { display: none; }
    .person[b-i5ry4kaz58] { padding: 0.25rem; }
}

@keyframes cal-fade-b-i5ry4kaz58 {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .cal__scrim[b-i5ry4kaz58] { animation: none; }
}
/* _content/Home/Components/Pages/ControlPage.razor.rz.scp.css */
.ctl[b-2w7yf6vuw8] {
    min-height: calc(100vh - var(--h-appbar-height));
    padding: clamp(0.75rem, 2.2vw, 1.75rem);
    background:
        radial-gradient(1100px 500px at 82% -10%, rgba(95, 184, 122, 0.10), transparent 60%),
        radial-gradient(900px 560px at 4% 4%, rgba(95, 168, 211, 0.10), transparent 55%),
        linear-gradient(168deg, var(--h-ink-700) 0%, var(--h-ink-800) 52%, var(--h-ink-900) 100%);
    background-attachment: fixed;
    color: var(--h-text);
    font-family: var(--h-font-body);
}

[data-theme="light"] .ctl[b-2w7yf6vuw8] { background: var(--h-bg); }

/* ---- Top bar ---- */

.ctl__bar[b-2w7yf6vuw8] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    flex-wrap: wrap;
    margin-bottom: var(--h-space-5);
}

.ctl__title-group[b-2w7yf6vuw8] { display: flex; align-items: baseline; gap: var(--h-space-3); }

.ctl__title[b-2w7yf6vuw8] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-2xl);
    font-weight: var(--h-weight-bold);
    letter-spacing: -0.02em;
    line-height: 1;
}

.ctl__count[b-2w7yf6vuw8] {
    font-family: var(--h-font-mono);
    font-size: var(--h-text-sm);
    color: var(--h-text-faint);
}

/* ---- Sections ---- */

.ctl__section[b-2w7yf6vuw8] { margin-bottom: var(--h-space-6); }

.ctl__section-title[b-2w7yf6vuw8] {
    margin: 0 0 var(--h-space-3);
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

/* auto-fill rather than a breakpoint ladder: the cards decide how many fit. */
.ctl__grid[b-2w7yf6vuw8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    gap: var(--h-space-3);
    align-items: start;
}

/* ---- Empty state ---- */

.ctl__state[b-2w7yf6vuw8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-7) var(--h-space-4);
    text-align: center;
    color: var(--h-text-dim);
}

.ctl__state-title[b-2w7yf6vuw8] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-semi);
    color: var(--h-text);
}

.ctl__state-detail[b-2w7yf6vuw8] { font-size: var(--h-text-sm); max-width: 30rem; }

@media (max-width: 900px) {
    .ctl__title[b-2w7yf6vuw8] { font-size: var(--h-text-xl); }
}

/* One card per row on a phone: the plug's four metering columns need the width. */
@media (max-width: 520px) {
    .ctl__grid[b-2w7yf6vuw8] { grid-template-columns: minmax(0, 1fr); }
}
/* _content/Home/Components/Pages/HomePage.razor.rz.scp.css */
.hp[b-aiohcbdagi] {
    min-height: calc(100vh - var(--h-appbar-height));
    padding: clamp(0.75rem, 2.2vw, 1.75rem);
    background:
        radial-gradient(1100px 500px at 82% -10%, rgba(232, 177, 76, 0.10), transparent 60%),
        radial-gradient(900px 560px at 4% 4%, rgba(95, 168, 211, 0.10), transparent 55%),
        linear-gradient(168deg, var(--h-ink-700) 0%, var(--h-ink-800) 52%, var(--h-ink-900) 100%);
    background-attachment: fixed;
    color: var(--h-text);
    font-family: var(--h-font-body);
}

[data-theme="light"] .hp[b-aiohcbdagi] { background: var(--h-bg); }

/* ---- Greeting ---- */

.hp__bar[b-aiohcbdagi] {
    display: flex;
    align-items: baseline;
    gap: var(--h-space-3);
    flex-wrap: wrap;
    margin-bottom: var(--h-space-5);
}

.hp__title[b-aiohcbdagi] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-2xl);
    font-weight: var(--h-weight-bold);
    letter-spacing: -0.02em;
    line-height: 1;
}

.hp__date[b-aiohcbdagi] {
    font-family: var(--h-font-mono);
    font-size: var(--h-text-sm);
    color: var(--h-text-faint);
}

/* ---- Cards ---- */

.hp__grid[b-aiohcbdagi] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
    gap: var(--h-space-4);
    align-items: start;
}

/* Weather and the agenda carry the most content, so they get the room when it exists. */
.hp__card--weather[b-aiohcbdagi],
.hp__card--agenda[b-aiohcbdagi] { grid-column: span 2; }

.hp__card[b-aiohcbdagi] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-3);
    padding: var(--h-space-4);
    background: var(--h-surface);
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-lg);
    box-shadow: var(--h-shadow-sm);
    backdrop-filter: blur(8px);
    min-width: 0;
}

.hp__card-head[b-aiohcbdagi] {
    display: flex;
    align-items: baseline;
    gap: var(--h-space-3);
}

.hp__card-title[b-aiohcbdagi] {
    margin: 0;
    flex: 1;
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    font-weight: var(--h-weight-semi);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.hp__more[b-aiohcbdagi] {
    color: var(--h-text-dim);
    font-size: var(--h-text-xs);
    text-decoration: none;
    white-space: nowrap;
}

.hp__more:hover[b-aiohcbdagi] { color: var(--h-text); }
.hp__more:focus-visible[b-aiohcbdagi] { outline: 2px solid var(--h-focus); outline-offset: 2px; }

.hp__muted[b-aiohcbdagi] { margin: 0; color: var(--h-text-faint); font-size: var(--h-text-sm); }

/* ---- Weather ---- */

.hp__wx[b-aiohcbdagi] {
    display: flex;
    align-items: center;
    gap: var(--h-space-4);
}

.hp__wx-emoji[b-aiohcbdagi] { font-size: 2.75rem; line-height: 1; }

.hp__wx-read[b-aiohcbdagi] { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }

.hp__wx-temp[b-aiohcbdagi] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-3xl);
    font-weight: var(--h-weight-bold);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.hp__deg[b-aiohcbdagi] { color: var(--h-text-faint); }

.hp__wx-cond[b-aiohcbdagi] { font-size: var(--h-text-md); color: var(--h-text-dim); }

.hp__stats[b-aiohcbdagi] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--h-space-2);
    padding-top: var(--h-space-3);
    border-top: 1px solid var(--h-border);
}

.hp__stat[b-aiohcbdagi] { display: flex; flex-direction: column; gap: 0.15rem; }

.hp__stat-label[b-aiohcbdagi] {
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.hp__stat-val[b-aiohcbdagi] {
    font-family: var(--h-font-mono);
    font-size: var(--h-text-md);
    font-variant-numeric: tabular-nums;
}

.hp__stat-val small[b-aiohcbdagi] { color: var(--h-text-faint); font-size: var(--h-text-2xs); }

.hp__sun[b-aiohcbdagi] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    color: var(--h-text-dim);
    font-size: var(--h-text-xs);
}

.hp__sun-sep[b-aiohcbdagi] {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, var(--h-gold), transparent);
    opacity: 0.5;
}

/* ---- Agenda ---- */

.hp__events[b-aiohcbdagi] {
    display: flex;
    flex-direction: column;
    gap: var(--h-space-1);
    margin: 0;
    padding: 0;
    list-style: none;
}

.hp__event[b-aiohcbdagi] {
    display: flex;
    align-items: baseline;
    gap: var(--h-space-3);
    padding: 0.4rem 0.5rem;
    border-left: 3px solid var(--person, var(--h-slate));
    border-radius: 0 var(--h-radius-sm) var(--h-radius-sm) 0;
    background: color-mix(in srgb, var(--person, var(--h-slate)) 10%, transparent);
    min-width: 0;
}

.hp__event-time[b-aiohcbdagi] {
    flex: 0 0 auto;
    min-width: 4.5rem;
    color: var(--h-text-dim);
    font-family: var(--h-font-mono);
    font-size: var(--h-text-2xs);
    font-variant-numeric: tabular-nums;
}

.hp__event-body[b-aiohcbdagi] { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }

.hp__event-title[b-aiohcbdagi] {
    font-size: var(--h-text-sm);
    font-weight: var(--h-weight-medium);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hp__event-owner[b-aiohcbdagi] {
    color: var(--h-text-faint);
    font-size: var(--h-text-2xs);
}

.hp__loading[b-aiohcbdagi] {
    display: flex;
    align-items: center;
    gap: var(--h-space-2);
    color: var(--h-text-dim);
    font-size: var(--h-text-sm);
}

.hp__empty[b-aiohcbdagi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--h-space-1);
    padding: var(--h-space-5) var(--h-space-3);
    text-align: center;
}

.hp__empty-mark[b-aiohcbdagi] { color: var(--h-accent); font-size: var(--h-text-xl); line-height: 1; }

.hp__empty-title[b-aiohcbdagi] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-semi);
}

/* ---- Scenes ---- */

.hp__scene-now[b-aiohcbdagi] { margin: 0; }

.hp__scene-name[b-aiohcbdagi] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-xl);
    font-weight: var(--h-weight-bold);
    letter-spacing: -0.01em;
}

.hp__scene-row[b-aiohcbdagi] { display: flex; flex-wrap: wrap; gap: var(--h-space-2); }

.hp__scene[b-aiohcbdagi] {
    padding: 0.3rem 0.7rem;
    border: 1px solid var(--h-border);
    border-radius: var(--h-radius-pill);
    background: transparent;
    color: var(--h-text-dim);
    font-family: var(--h-font-body);
    font-size: var(--h-text-xs);
    font-weight: var(--h-weight-medium);
    cursor: pointer;
    transition: background var(--h-duration-fast) var(--h-ease),
                border-color var(--h-duration-fast) var(--h-ease),
                color var(--h-duration-fast) var(--h-ease);
}

.hp__scene:hover[b-aiohcbdagi] { background: var(--h-surface-hover); color: var(--h-text); }
.hp__scene:focus-visible[b-aiohcbdagi] { outline: 2px solid var(--h-focus); outline-offset: 2px; }

.hp__scene--on[b-aiohcbdagi] {
    border-color: color-mix(in srgb, var(--h-accent) 50%, transparent);
    background: color-mix(in srgb, var(--h-accent) 16%, transparent);
    color: var(--h-accent);
}

/* ---- What's on ---- */

.hp__count[b-aiohcbdagi] { display: flex; align-items: baseline; gap: var(--h-space-2); }

.hp__count-val[b-aiohcbdagi] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-3xl);
    font-weight: var(--h-weight-bold);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

/* ---- Responsive ---- */

@media (max-width: 900px) {
    .hp__title[b-aiohcbdagi] { font-size: var(--h-text-xl); }

    /* Below the tablet breakpoint there is rarely room for two columns, so the wide cards
       stop trying to span and everything stacks evenly. */
    .hp__card--weather[b-aiohcbdagi],
    .hp__card--agenda[b-aiohcbdagi] { grid-column: auto; }
}

@media (max-width: 520px) {
    .hp__grid[b-aiohcbdagi] { grid-template-columns: minmax(0, 1fr); }
    .hp__wx-emoji[b-aiohcbdagi] { font-size: 2.25rem; }
}

@media (prefers-reduced-motion: reduce) {
    .hp__scene[b-aiohcbdagi] { transition: none; }
}
/* _content/Home/Components/Pages/MinecraftPage.razor.rz.scp.css */
.mc[b-j14ny22sfv] {
    min-height: calc(100vh - var(--h-appbar-height));
    padding: clamp(0.75rem, 2.2vw, 1.75rem);
    background:
        radial-gradient(1100px 500px at 82% -10%, rgba(95, 184, 122, 0.10), transparent 60%),
        radial-gradient(900px 560px at 4% 4%, rgba(199, 125, 187, 0.08), transparent 55%),
        linear-gradient(168deg, var(--h-ink-700) 0%, var(--h-ink-800) 52%, var(--h-ink-900) 100%);
    background-attachment: fixed;
    color: var(--h-text);
    font-family: var(--h-font-body);
}

[data-theme="light"] .mc[b-j14ny22sfv] { background: var(--h-bg); }

.mc__bar[b-j14ny22sfv] {
    display: flex;
    align-items: center;
    gap: var(--h-space-3);
    flex-wrap: wrap;
    margin-bottom: var(--h-space-5);
}

.mc__title-group[b-j14ny22sfv] { display: flex; align-items: baseline; gap: var(--h-space-3); }

.mc__title[b-j14ny22sfv] {
    margin: 0;
    font-family: var(--h-font-display);
    font-size: var(--h-text-2xl);
    font-weight: var(--h-weight-bold);
    letter-spacing: -0.02em;
    line-height: 1;
}

.mc__count[b-j14ny22sfv] {
    font-family: var(--h-font-mono);
    font-size: var(--h-text-sm);
    color: var(--h-text-faint);
}

.mc__spacer[b-j14ny22sfv] { flex: 1 1 auto; }

.mc__grid[b-j14ny22sfv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    gap: var(--h-space-3);
    align-items: start;
}

.mc__state[b-j14ny22sfv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--h-space-2);
    padding: var(--h-space-7) var(--h-space-4);
    text-align: center;
    color: var(--h-text-dim);
}

.mc__state--error[b-j14ny22sfv] { color: var(--h-text); }

.mc__state-title[b-j14ny22sfv] {
    font-family: var(--h-font-display);
    font-size: var(--h-text-lg);
    font-weight: var(--h-weight-semi);
    color: var(--h-text);
}

.mc__state-detail[b-j14ny22sfv] { font-size: var(--h-text-sm); max-width: 30rem; }

.mc__state-detail code[b-j14ny22sfv] {
    padding: 0.1rem 0.3rem;
    border-radius: var(--h-radius-sm);
    background: var(--h-surface-sunk);
    font-family: var(--h-font-mono);
    font-size: var(--h-text-xs);
}

@media (max-width: 900px) {
    .mc__title[b-j14ny22sfv] { font-size: var(--h-text-xl); }
}

@media (max-width: 520px) {
    .mc__grid[b-j14ny22sfv] { grid-template-columns: minmax(0, 1fr); }
}
/* _content/Home/Components/Pages/WeatherPage.razor.rz.scp.css */
/* ── Weather page: "links at dawn" atmosphere, drawn from the shared tokens ── */
.wx[b-jaaui6mr01] {
    min-height: calc(100vh - var(--h-appbar-height));
    color: var(--h-text);
    font-family: var(--h-font-body);
    background:
        radial-gradient(1200px 520px at 78% -8%, rgba(232, 177, 76, 0.16), transparent 60%),
        radial-gradient(1000px 600px at 8% 6%, rgba(95, 168, 211, 0.12), transparent 55%),
        linear-gradient(168deg, var(--h-ink-700) 0%, var(--h-ink-800) 46%, var(--h-ink-900) 100%);
    background-attachment: fixed;
}

/* The dark gradient above is decorative; light mode drops to the flat surface. */
[data-theme="light"] .wx[b-jaaui6mr01] { background: var(--h-bg); }

.wx__inner[b-jaaui6mr01] {
    max-width: 1180px;
    margin: 0 auto;
    padding: clamp(16px, 3vw, 36px) clamp(14px, 3vw, 32px) 64px;
    display: flex;
    flex-direction: column;
    gap: clamp(14px, 2vw, 22px);
}

/* Hero row: live "now" beside the signature round window */
.wx__grid[b-jaaui6mr01] {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.35fr);
    gap: clamp(14px, 2vw, 22px);
    align-items: stretch;
}

@media (max-width: 880px) {
    .wx__grid[b-jaaui6mr01] {
        grid-template-columns: 1fr;
    }
}

/* ── States ── */
.wx__state[b-jaaui6mr01] {
    margin-top: 14vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
    color: var(--h-text-dim);
}

.wx__state-title[b-jaaui6mr01] {
    font-family: var(--h-font-display);
    font-size: 1.4rem;
    font-weight: var(--h-weight-bold);
    color: var(--h-text);
}

.wx__state-detail[b-jaaui6mr01] {
    font-size: 0.92rem;
    max-width: 420px;
}

.wx__state--error .wx__state-title[b-jaaui6mr01] {
    color: var(--h-coral);
}

.wx__retry[b-jaaui6mr01] {
    margin-top: 6px;
    padding: 9px 20px;
    border-radius: var(--h-radius-pill);
    border: 1px solid var(--h-border-strong);
    background: var(--h-surface);
    color: var(--h-text);
    font-family: var(--h-font-body);
    font-size: 0.88rem;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.wx__retry:hover[b-jaaui6mr01] {
    background: color-mix(in srgb, var(--h-accent) 16%, transparent);
    border-color: var(--h-accent);
}

.wx__spinner[b-jaaui6mr01] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 3px solid var(--h-border-strong);
    border-top-color: var(--h-accent);
    animation: wx-spin-b-jaaui6mr01 0.9s linear infinite;
}

@keyframes wx-spin-b-jaaui6mr01 {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .wx__spinner[b-jaaui6mr01] { animation-duration: 2.4s; }
}
/* _content/Home/Components/Public/NevBday.razor.rz.scp.css */
/* Nev's birthday word jumble.
   Theme: space (backdrop, rocket), LEGO (bricks, studs, baseplate), Minecraft (pixel type,
   block title drawn on the canvas) and hockey (shots, the goal horn, the scoreboard). */

.nev[b-g4kly3hlkv] {
    --space-0: #04060f;
    --space-1: #0b1030;
    --space-2: #1d1150;
    --plate: #1f7a3d;
    --plate-dark: #145a2b;
    --ink: #f7f5ff;
    --ink-dim: #b9b6dc;
    --goal-red: #e3000b;
    --led-amber: #ffb21f;
    --led-green: #3dff7a;
    --pixel: 'Press Start 2P', 'Courier New', monospace;
    --body: 'Inter', 'Segoe UI', system-ui, sans-serif;

    position: fixed;
    inset: 0;
    overflow: hidden;
    color: var(--ink);
    font-family: var(--body);
    background:
        radial-gradient(ellipse 80% 60% at 20% 10%, rgba(91, 52, 196, .35), transparent 60%),
        radial-gradient(ellipse 70% 50% at 90% 80%, rgba(20, 120, 170, .28), transparent 65%),
        linear-gradient(180deg, var(--space-0), var(--space-1) 45%, var(--space-2));
    -webkit-tap-highlight-color: transparent;
}

.nev *[b-g4kly3hlkv],
.nev *[b-g4kly3hlkv]::before,
.nev *[b-g4kly3hlkv]::after {
    box-sizing: border-box;
}

.nev__stage[b-g4kly3hlkv] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
}

/* A blocky planet and moon, so even the backdrop looks built rather than painted. */
.nev__planet[b-g4kly3hlkv] {
    position: absolute;
    right: -90px;
    bottom: -110px;
    width: 340px;
    height: 340px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 30% 28%, rgba(255, 255, 255, .25), transparent 32%),
        repeating-linear-gradient(0deg, transparent 0 22px, rgba(0, 0, 0, .12) 22px 44px),
        linear-gradient(140deg, #ff8a3d, #c4361b 55%, #5a1220);
    box-shadow: 0 0 80px rgba(255, 120, 60, .35), inset -40px -30px 80px rgba(0, 0, 0, .55);
    opacity: .85;
    z-index: 0;
    pointer-events: none;
}

.nev__moon[b-g4kly3hlkv] {
    position: absolute;
    left: 5%;
    top: 46%;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 35% 40%, rgba(0, 0, 0, .18) 0 5px, transparent 6px),
        radial-gradient(circle at 65% 65%, rgba(0, 0, 0, .15) 0 7px, transparent 8px),
        #dcdbe8;
    box-shadow: 0 0 30px rgba(220, 220, 255, .35), inset -8px -6px 14px rgba(0, 0, 0, .35);
    z-index: 0;
    pointer-events: none;
}

.nev__mute[b-g4kly3hlkv] {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 30;
    width: 44px;
    height: 44px;
    border: 2px solid rgba(255, 255, 255, .25);
    border-radius: 10px;
    background: rgba(10, 12, 40, .6);
    color: var(--ink);
    font-size: 20px;
    cursor: pointer;
    touch-action: manipulation;
}

.nev__mute[b-g4kly3hlkv]::before {
    content: '\1F50A';
}

.nev__mute.is-muted[b-g4kly3hlkv]::before {
    content: '\1F507';
}

/* ---------------------------------------------------------------- Puzzle */

.jumble[b-g4kly3hlkv] {
    position: relative;
    z-index: 1;
    height: 100%;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    padding: 28px 16px 24px;
    max-width: 980px;
    margin: 0 auto;
}

.jumble__head[b-g4kly3hlkv] {
    text-align: center;
}

/* Centre the puzzle vertically when there is room; auto margins (unlike justify-content)
   never push content out of reach above the scroll area on a short screen. */
.jumble > :first-child[b-g4kly3hlkv] {
    margin-top: auto;
}

.jumble > :last-child[b-g4kly3hlkv] {
    margin-bottom: auto;
}

.jumble__eyebrow[b-g4kly3hlkv] {
    margin: 0 0 10px;
    font-family: var(--pixel);
    font-size: 11px;
    letter-spacing: .12em;
    color: var(--led-amber);
    text-transform: uppercase;
}

.jumble__title[b-g4kly3hlkv] {
    margin: 0;
    font-family: var(--pixel);
    font-weight: 400;
    font-size: clamp(18px, 4.4vw, 38px);
    line-height: 1.35;
    color: #fff;
    text-shadow: 3px 3px 0 #0055bf, 6px 6px 0 rgba(0, 0, 0, .45);
}

/* Routes' FocusOnNavigate focuses the h1 for screen readers; no ring for a programmatic focus. */
.nev h1:focus[b-g4kly3hlkv] {
    outline: none;
}

.jumble__sub[b-g4kly3hlkv] {
    margin: 12px 0 0;
    font-size: clamp(15px, 2.2vw, 19px);
    color: var(--ink-dim);
}

.jumble__sub strong[b-g4kly3hlkv] {
    color: #fff;
}

.jumble__stat[b-g4kly3hlkv] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 12px;
    border: 2px solid #2b2f55;
    border-radius: 8px;
    background: #05060d;
    font-family: var(--pixel);
    font-size: 10px;
    color: var(--ink-dim);
    text-transform: uppercase;
}

.jumble__stat b[b-g4kly3hlkv] {
    font-weight: 400;
    font-size: 16px;
    color: var(--led-amber);
    text-shadow: 0 0 8px rgba(255, 178, 31, .7);
}

.jumble__hint[b-g4kly3hlkv] {
    min-height: 1.4em;
    margin: -4px 0 0;
    font-weight: 600;
    color: var(--led-amber);
    text-align: center;
}

.jumble__clue[b-g4kly3hlkv] {
    margin: -10px 0 0;
    padding: 6px 14px;
    border: 2px solid rgba(245, 197, 24, .55);
    border-radius: 999px;
    background: rgba(245, 197, 24, .12);
    font-weight: 600;
    color: #ffe680;
}

.jumble__clue b[b-g4kly3hlkv] {
    font-family: var(--pixel);
    color: #fff;
}

/* LEGO baseplate the letter bricks snap onto. */
.plate[b-g4kly3hlkv] {
    display: grid;
    grid-template-columns: repeat(var(--n), minmax(0, 1fr));
    gap: 10px;
    width: min(100%, calc(var(--n) * 68px));
    padding: 18px 14px 14px;
    border-radius: 10px;
    background:
        radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .16) 0 4px, rgba(0, 0, 0, .25) 5px, transparent 6px) 0 0 / 16px 16px,
        var(--plate);
    box-shadow: inset 0 -5px 0 var(--plate-dark), 0 10px 30px rgba(0, 0, 0, .5);
}

.plate.is-shaking[b-g4kly3hlkv] {
    animation: plate-shake-b-g4kly3hlkv .5s cubic-bezier(.36, .07, .19, .97);
}

.slot[b-g4kly3hlkv] {
    aspect-ratio: 1 / 1.05;
    width: 100%;
    font-size: clamp(16px, 3.4vw, 28px);
}

.slot--empty[b-g4kly3hlkv] {
    border-radius: 6px;
    border: 3px dashed rgba(255, 255, 255, .35);
    background: rgba(0, 0, 0, .18);
}

.slot--next[b-g4kly3hlkv] {
    border-color: #fff;
    animation: slot-pulse-b-g4kly3hlkv 1.1s ease-in-out infinite;
}

.plate .brick[b-g4kly3hlkv] {
    animation: brick-snap-b-g4kly3hlkv .32s cubic-bezier(.2, 1.6, .4, 1) both;
}

/* Generic LEGO brick: colour from --c, two studs on top, chunky press-down depth. */
.brick[b-g4kly3hlkv] {
    --c: #e3000b;
    --t: #fff;
    position: relative;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: var(--c);
    color: var(--t);
    font-family: var(--pixel);
    line-height: 1;
    text-shadow: 2px 2px 0 rgba(0, 0, 0, .3);
    cursor: pointer;
    touch-action: manipulation;
    user-select: none;
    box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, .35),
        inset 0 -5px 0 rgba(0, 0, 0, .25),
        0 4px 0 rgba(0, 0, 0, .4);
    transition: transform .06s, box-shadow .06s;
}

.brick[b-g4kly3hlkv]::before,
.brick[b-g4kly3hlkv]::after {
    content: '';
    position: absolute;
    top: -6px;
    width: 30%;
    height: 7px;
    border-radius: 4px 4px 1px 1px;
    background: var(--c);
    box-shadow: inset 0 2px 0 rgba(255, 255, 255, .4), inset 0 -2px 0 rgba(0, 0, 0, .2);
}

.brick[b-g4kly3hlkv]::before {
    left: 12%;
}

.brick[b-g4kly3hlkv]::after {
    right: 12%;
}

.brick:active:not(:disabled)[b-g4kly3hlkv] {
    transform: translateY(3px);
    box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, .35),
        inset 0 -3px 0 rgba(0, 0, 0, .25),
        0 1px 0 rgba(0, 0, 0, .4);
}

.brick:focus-visible[b-g4kly3hlkv],
.act:focus-visible[b-g4kly3hlkv],
.nev__mute:focus-visible[b-g4kly3hlkv] {
    outline: 3px solid #fff;
    outline-offset: 3px;
}

.brick--c0[b-g4kly3hlkv] { --c: #e3000b; }
.brick--c1[b-g4kly3hlkv] { --c: #ffd500; --t: #3a2a00; }
.brick--c2[b-g4kly3hlkv] { --c: #0055bf; }
.brick--c3[b-g4kly3hlkv] { --c: #00852b; }
.brick--c4[b-g4kly3hlkv] { --c: #fe8a18; --t: #3d1d00; }
.brick--c5[b-g4kly3hlkv] { --c: #36aede; --t: #062a3a; }
.brick--c6[b-g4kly3hlkv] { --c: #a5ca18; --t: #243000; }
.brick--c7[b-g4kly3hlkv] { --c: #c870a0; }

/* The locked first-letter hint: gold, glowing, and not removable. */
.brick--hint[b-g4kly3hlkv] {
    --c: #f5c518;
    --t: #3a2a00;
    cursor: default;
    outline: 3px solid #fff3b0;
    outline-offset: 2px;
}

.plate .brick--hint[b-g4kly3hlkv] {
    animation: brick-snap-b-g4kly3hlkv .32s cubic-bezier(.2, 1.6, .4, 1) both, hint-glow-b-g4kly3hlkv 1.2s ease-in-out .4s 4;
}

.brick--c1[b-g4kly3hlkv], .brick--c4[b-g4kly3hlkv], .brick--c5[b-g4kly3hlkv], .brick--c6[b-g4kly3hlkv], .brick--hint[b-g4kly3hlkv] {
    text-shadow: 1px 1px 0 rgba(255, 255, 255, .35);
}

.keys[b-g4kly3hlkv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    width: min(100%, 760px);
    margin-top: 6px;
}

.keys__row[b-g4kly3hlkv] {
    display: flex;
    justify-content: center;
    gap: 8px;
    width: 100%;
}

.key[b-g4kly3hlkv] {
    flex: 0 1 72px;
    min-width: 0;
    height: clamp(46px, 9vw, 72px);
    font-size: clamp(14px, 2.8vw, 22px);
}

.key:disabled[b-g4kly3hlkv] {
    opacity: .55;
    cursor: default;
}

.jumble__actions[b-g4kly3hlkv] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-top: 6px;
}

.act[b-g4kly3hlkv] {
    min-height: 52px;
    padding: 0 18px;
    border-radius: 10px;
    font-family: var(--pixel);
    font-size: 13px;
    cursor: pointer;
    touch-action: manipulation;
    transition: transform .06s;
}

.act:active:not(:disabled)[b-g4kly3hlkv] {
    transform: translateY(3px);
}

.act:disabled[b-g4kly3hlkv] {
    opacity: .55;
    cursor: default;
}

.act--ghost[b-g4kly3hlkv] {
    border: 2px solid rgba(255, 255, 255, .3);
    background: rgba(10, 12, 40, .55);
    color: var(--ink);
}

/* The one primary action: goal-light red, like the lamp behind the net. */
.act--shoot[b-g4kly3hlkv] {
    min-height: 60px;
    padding: 0 26px;
    border: 0;
    font-size: 15px;
    color: #fff;
    background: linear-gradient(180deg, #ff2a2a, var(--goal-red));
    box-shadow: inset 0 2px 0 rgba(255, 255, 255, .35), inset 0 -5px 0 rgba(0, 0, 0, .25), 0 5px 0 #6d0005, 0 0 26px rgba(227, 0, 11, .45);
    text-shadow: 2px 2px 0 rgba(0, 0, 0, .3);
}

/* ---------------------------------------------------------------- Denied overlay */

.denied[b-g4kly3hlkv] {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 16px;
    background: radial-gradient(circle, rgba(60, 0, 0, .78), rgba(0, 0, 0, .92));
    animation: denied-in-b-g4kly3hlkv .25s ease-out both;
    cursor: pointer;
}

.denied__gif[b-g4kly3hlkv] {
    width: min(86vw, 480px, 62vh);
    aspect-ratio: 1;
    border-radius: 14px;
    box-shadow: 0 0 0 4px rgba(255, 60, 60, .5), 0 20px 60px rgba(0, 0, 0, .7);
    animation: denied-pop-b-g4kly3hlkv .4s cubic-bezier(.2, 1.5, .4, 1) both;
}

.denied__tap[b-g4kly3hlkv] {
    margin: 0;
    font-family: var(--pixel);
    font-size: 11px;
    color: rgba(255, 255, 255, .7);
}

/* ---------------------------------------------------------------- Reveal */

.reveal[b-g4kly3hlkv] {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 64px 16px 20px;
    gap: 14px;
}

.reveal.is-shaking[b-g4kly3hlkv] {
    animation: screen-shake-b-g4kly3hlkv .12s linear infinite;
}

.reveal__granted[b-g4kly3hlkv] {
    position: absolute;
    top: 42%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 16px 22px;
    border: 3px solid #1d9b4a;
    border-radius: 10px;
    background: #031a0b;
    font-family: var(--pixel);
    font-size: clamp(16px, 4vw, 30px);
    white-space: nowrap;
    color: var(--led-green);
    text-shadow: 0 0 12px rgba(61, 255, 122, .8);
    box-shadow: 0 0 40px rgba(61, 255, 122, .35);
    opacity: 0;
    pointer-events: none;
}

.reveal.is-granted .reveal__granted[b-g4kly3hlkv] {
    animation: granted-b-g4kly3hlkv .45s cubic-bezier(.2, 1.6, .4, 1) both, blink-b-g4kly3hlkv .3s .5s steps(2) 3;
}

.reveal.is-launch .reveal__granted[b-g4kly3hlkv] {
    animation: fade-out-b-g4kly3hlkv .3s both;
}

.reveal__rocket[b-g4kly3hlkv] {
    position: absolute;
    left: 50%;
    bottom: -230px;
    width: clamp(80px, 14vw, 120px);
    transform: translateX(-50%);
    filter: drop-shadow(0 0 18px rgba(255, 180, 60, .45));
    pointer-events: none;
}

.reveal.is-launch .reveal__rocket[b-g4kly3hlkv] {
    animation: rocket-launch-b-g4kly3hlkv 2.5s cubic-bezier(.55, 0, .75, .3) both;
}

.reveal.is-title .reveal__rocket[b-g4kly3hlkv] {
    visibility: hidden;
}

.reveal__flame[b-g4kly3hlkv] {
    fill: #ffb02e;
    transform-origin: 50% 160px;
    animation: flicker-b-g4kly3hlkv .08s ease-in-out infinite alternate;
}

.reveal__flame--core[b-g4kly3hlkv] {
    fill: #fff6c2;
}

.reveal__flash[b-g4kly3hlkv] {
    position: absolute;
    inset: 0;
    background: #fff;
    opacity: 0;
    pointer-events: none;
    z-index: 5;
}

.reveal.is-title .reveal__flash[b-g4kly3hlkv] {
    animation: flash-b-g4kly3hlkv .7s ease-out both;
}

/* Rotating goal lamps, like the ones behind a hockey net. */
.reveal__lamp[b-g4kly3hlkv] {
    position: absolute;
    top: 14px;
    width: 46px;
    height: 46px;
    border-radius: 50% 50% 8px 8px;
    background: #4a0004;
    box-shadow: inset 0 -6px 0 rgba(0, 0, 0, .4);
    opacity: 0;
}

.reveal__lamp--left[b-g4kly3hlkv] {
    left: 14px;
}

.reveal__lamp--right[b-g4kly3hlkv] {
    right: 70px;
}

.reveal__lamp[b-g4kly3hlkv]::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 520px;
    height: 520px;
    margin: -260px 0 0 -260px;
    border-radius: 50%;
    background: conic-gradient(from 0deg, rgba(255, 30, 30, .45), transparent 14%, transparent 50%, rgba(255, 30, 30, .45) 50%, transparent 64%);
    opacity: 0;
    pointer-events: none;
}

.reveal.is-score .reveal__lamp[b-g4kly3hlkv] {
    opacity: 1;
    background: radial-gradient(circle at 50% 40%, #ff9a9a, var(--goal-red) 55%, #7a0008);
    animation: lamp-pulse-b-g4kly3hlkv .5s ease-in-out 6 alternate;
}

.reveal.is-score .reveal__lamp[b-g4kly3hlkv]::after {
    animation: beacon-b-g4kly3hlkv 3s linear both;
}

/* The canvas paints the block title over this box. The real text stays for screen readers,
   and for the no-JS fallback where it is the only title there is. */
.reveal__title[b-g4kly3hlkv] {
    flex: 1 1 auto;
    width: 100%;
    max-width: 1100px;
    min-height: 150px;
    max-height: 46vh;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-family: var(--pixel);
    font-weight: 400;
    font-size: clamp(22px, 6vw, 56px);
    line-height: 1.4;
    text-align: center;
    color: #ffd500;
    text-shadow: 4px 4px 0 #e3000b, 8px 8px 0 rgba(0, 0, 0, .5);
}

.reveal__name[b-g4kly3hlkv] {
    font-size: 1.5em;
    color: #fff;
    text-shadow: 4px 4px 0 #0055bf, 8px 8px 0 rgba(0, 0, 0, .5);
}

/* Invisible but still read out; the canvas title is what people see. */
.reveal__title > span[b-g4kly3hlkv] {
    opacity: 0;
}

/* Arena jumbotron holding the final clue. */
.board[b-g4kly3hlkv] {
    position: relative;
    width: min(100%, 760px);
    padding: 16px 18px 20px;
    border: 4px solid #2a2d3e;
    border-radius: 14px;
    background:
        radial-gradient(circle, rgba(255, 255, 255, .05) 1px, transparent 1.5px) 0 0 / 5px 5px,
        #07080f;
    box-shadow: 0 0 0 4px #11131f, 0 18px 50px rgba(0, 0, 0, .6), inset 0 0 40px rgba(0, 0, 0, .8);
    font-family: var(--pixel);
    text-align: center;
    opacity: 0;
    transform: translateY(40px);
}

.reveal.is-score .board[b-g4kly3hlkv] {
    animation: board-in-b-g4kly3hlkv .7s cubic-bezier(.2, 1.3, .4, 1) .2s both;
}

.board__goal[b-g4kly3hlkv] {
    font-size: clamp(22px, 6vw, 40px);
    color: #ff2b2b;
    text-shadow: 0 0 14px rgba(255, 40, 40, .9);
    letter-spacing: .1em;
}

.reveal.is-score .board__goal[b-g4kly3hlkv] {
    animation: blink-b-g4kly3hlkv .35s .9s steps(2) 6;
}

.board__teams[b-g4kly3hlkv] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: end;
    gap: 10px;
    margin: 14px 0 16px;
    padding: 12px 0;
    border-top: 2px solid #1c1f30;
    border-bottom: 2px solid #1c1f30;
}

.board__team[b-g4kly3hlkv],
.board__period[b-g4kly3hlkv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.board__label[b-g4kly3hlkv] {
    margin: 0;
    font-size: 9px;
    color: #7c80a8;
    text-transform: uppercase;
    letter-spacing: .12em;
}

.board__label--clue[b-g4kly3hlkv] {
    margin-bottom: 12px;
    font-size: 10px;
}

.board__name[b-g4kly3hlkv] {
    font-size: clamp(13px, 2.6vw, 18px);
    color: #fff;
}

.board__score[b-g4kly3hlkv] {
    min-width: 2.2em;
    padding: 8px 6px;
    border-radius: 6px;
    background: #020203;
    font-size: clamp(22px, 5vw, 34px);
    color: var(--led-amber);
    text-shadow: 0 0 10px rgba(255, 178, 31, .8);
}

.board__digits[b-g4kly3hlkv] {
    padding: 6px 8px;
    border-radius: 6px;
    background: #020203;
    font-size: clamp(11px, 2.2vw, 15px);
    color: var(--led-green);
    text-shadow: 0 0 8px rgba(61, 255, 122, .7);
}

.board__clue[b-g4kly3hlkv] {
    margin: 0;
    font-size: clamp(13px, 2.6vw, 20px);
    line-height: 1.75;
    color: var(--led-amber);
    text-shadow: 0 0 8px rgba(255, 178, 31, .65);
}

.board__word[b-g4kly3hlkv] {
    white-space: nowrap;
}

.board__ch[b-g4kly3hlkv] {
    opacity: 0;
}

.reveal.is-score .board__ch[b-g4kly3hlkv] {
    animation: led-on-b-g4kly3hlkv .01s calc(1.1s + var(--i) * 45ms) both;
}

.reveal__footer[b-g4kly3hlkv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    opacity: 0;
}

.reveal.is-score .reveal__footer[b-g4kly3hlkv] {
    animation: fade-in-b-g4kly3hlkv .6s 5.5s both;
}

.reveal__tap[b-g4kly3hlkv] {
    margin: 0;
    font-family: var(--pixel);
    font-size: 9px;
    color: var(--ink-dim);
}

/* No effects module: skip the show and simply land on the finished screen. The rule only
   matches until nevBday.js adds .js-on, which happens long before the delay runs out. */
.reveal:not(.js-on) .reveal__title > span[b-g4kly3hlkv],
.reveal:not(.js-on) .board[b-g4kly3hlkv],
.reveal:not(.js-on) .reveal__footer[b-g4kly3hlkv] {
    animation: fade-in-b-g4kly3hlkv .6s 1.2s both;
}

.reveal:not(.js-on) .board[b-g4kly3hlkv] {
    transform: none;
}

.reveal:not(.js-on) .board__ch[b-g4kly3hlkv] {
    opacity: 1;
}

/* ---------------------------------------------------------------- Narrow screens */

@media (max-width: 640px) {
    .plate[b-g4kly3hlkv] {
        grid-template-columns: repeat(var(--n-narrow), minmax(0, 1fr));
        width: min(100%, calc(var(--n-narrow) * 60px));
        gap: 12px 8px;
        padding: 16px 10px 12px;
    }

    .slot[b-g4kly3hlkv] {
        font-size: clamp(15px, 5vw, 24px);
    }

    .keys[b-g4kly3hlkv] {
        gap: 12px;
    }

    .keys__row[b-g4kly3hlkv] {
        gap: 5px;
    }

    .brick[b-g4kly3hlkv]::before,
    .brick[b-g4kly3hlkv]::after {
        top: -5px;
        height: 6px;
    }

    .act[b-g4kly3hlkv] {
        font-size: 11px;
        padding: 0 14px;
    }

    .act--shoot[b-g4kly3hlkv] {
        flex-basis: 100%;
        font-size: 13px;
    }

    .nev__moon[b-g4kly3hlkv] {
        display: none;
    }

    .nev__planet[b-g4kly3hlkv] {
        width: 220px;
        height: 220px;
        right: -80px;
        bottom: -90px;
    }

    .reveal__lamp[b-g4kly3hlkv] {
        width: 34px;
        height: 34px;
    }

    .reveal__lamp--right[b-g4kly3hlkv] {
        right: 64px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nev *[b-g4kly3hlkv],
    .nev *[b-g4kly3hlkv]::before,
    .nev *[b-g4kly3hlkv]::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        animation-delay: 0s !important;
        transition: none !important;
    }
}

/* ---------------------------------------------------------------- Keyframes */

@keyframes brick-snap-b-g4kly3hlkv {
    0% { transform: translateY(-34px) scale(1.15); opacity: 0; }
    100% { transform: none; opacity: 1; }
}

@keyframes hint-glow-b-g4kly3hlkv {
    50% { box-shadow: 0 0 22px 6px rgba(255, 220, 80, .85), 0 4px 0 rgba(0, 0, 0, .4); }
}

@keyframes slot-pulse-b-g4kly3hlkv {
    50% { background: rgba(255, 255, 255, .16); box-shadow: 0 0 16px rgba(255, 255, 255, .45); }
}

@keyframes plate-shake-b-g4kly3hlkv {
    10%, 90% { transform: translateX(-3px); }
    20%, 80% { transform: translateX(6px); }
    30%, 50%, 70% { transform: translateX(-10px); }
    40%, 60% { transform: translateX(10px); }
}

@keyframes denied-in-b-g4kly3hlkv {
    from { opacity: 0; }
}

@keyframes denied-pop-b-g4kly3hlkv {
    from { transform: scale(.6) rotate(-4deg); opacity: 0; }
}

@keyframes granted-b-g4kly3hlkv {
    from { transform: translate(-50%, -50%) scale(.3); opacity: 0; }
    to { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}

@keyframes blink-b-g4kly3hlkv {
    50% { opacity: .15; }
}

@keyframes fade-out-b-g4kly3hlkv {
    from { opacity: 1; transform: translate(-50%, -50%); }
    to { opacity: 0; transform: translate(-50%, -50%) scale(1.4); }
}

@keyframes fade-in-b-g4kly3hlkv {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes rocket-launch-b-g4kly3hlkv {
    0% { transform: translate(-50%, 0); }
    12% { transform: translate(calc(-50% - 2px), -60px); }
    100% { transform: translate(-50%, -140vh); }
}

@keyframes flicker-b-g4kly3hlkv {
    from { transform: scaleY(.85) scaleX(.95); }
    to { transform: scaleY(1.15) scaleX(1.05); }
}

@keyframes flash-b-g4kly3hlkv {
    0% { opacity: 0; }
    12% { opacity: .95; }
    100% { opacity: 0; }
}

@keyframes screen-shake-b-g4kly3hlkv {
    0% { transform: translate(0, 0); }
    25% { transform: translate(-3px, 2px); }
    50% { transform: translate(3px, -2px); }
    75% { transform: translate(-2px, -3px); }
    100% { transform: translate(2px, 3px); }
}

@keyframes lamp-pulse-b-g4kly3hlkv {
    to { filter: brightness(1.6); box-shadow: 0 0 40px 10px rgba(255, 30, 30, .7); }
}

@keyframes beacon-b-g4kly3hlkv {
    0% { opacity: 1; transform: rotate(0deg); }
    85% { opacity: 1; }
    100% { opacity: 0; transform: rotate(1080deg); }
}

@keyframes board-in-b-g4kly3hlkv {
    from { opacity: 0; transform: translateY(40px) scale(.95); }
    to { opacity: 1; transform: none; }
}

@keyframes led-on-b-g4kly3hlkv {
    from { opacity: 0; }
    to { opacity: 1; }
}
