.transient-notice-region {
    --transient-gutter: var(--workspace-gap, clamp(0.75rem, 2.5vw, 1.25rem));
    --transient-gap-xs: var(--space-1, 0.25rem);
    --transient-gap-sm: var(--space-2, 0.5rem);
    --transient-gap-md: var(--space-3, 0.75rem);
    --transient-gap-lg: var(--space-4, 1rem);
    --transient-gold: var(--c-gold-light, #e5c66f);
    --transient-muted-gold: var(--c-gold-muted, #ad8334);
    --transient-text: var(--c-shell-text, #f1dfba);
    --transient-muted-text: var(--c-shell-muted, #c5ad7f);
    --transient-border-width: var(--border-fine, 1px);
    --transient-radius: var(--radius-control, 4px);
    position: sticky;
    z-index: 30;
    inset-block-start: var(--transient-gutter);
    height: 0;
    padding-inline: var(--transient-gutter);
    box-sizing: border-box;
    pointer-events: none;
}

.transient-notice-stack {
    width: min(25rem, 100%);
    display: grid;
    gap: var(--transient-gap-sm);
    margin-inline-start: auto;
}

.transient-notice {
    --transient-accent: var(--transient-muted-gold);
    min-width: 0;
    display: grid;
    gap: var(--transient-gap-xs);
    padding: var(--transient-gap-md) var(--transient-gap-lg);
    border: var(--transient-border-width) solid color-mix(in srgb, var(--transient-accent), var(--transient-gold) 32%);
    border-inline-start: 0.28rem solid var(--transient-accent);
    background:
        linear-gradient(125deg, rgb(24 49 73 / 0.98), rgb(5 14 23 / 0.99)),
        var(--texture-shell, linear-gradient(135deg, rgb(255 255 255 / 0.025), transparent)),
        #050e17;
    background-size: cover;
    box-shadow: var(--shadow-shell, 0 14px 32px rgb(0 0 0 / 0.38));
    color: var(--transient-text);
    overflow-wrap: anywhere;
    pointer-events: auto;
    transition:
        opacity var(--motion-fast, 120ms) var(--ease-standard, ease),
        transform var(--motion-fast, 120ms) var(--ease-standard, ease);
}

.transient-notice[hidden] { display: none; }

.transient-notice--success { --transient-accent: var(--c-success, #78a95b); }
.transient-notice--warning { --transient-accent: var(--c-warning, #c18a32); }
.transient-notice--error { --transient-accent: var(--c-danger, #b95348); }

.transient-notice.is-dismissing {
    opacity: 0;
    transform: translateX(0.75rem);
}

.transient-notice__heading {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: var(--transient-gap-md);
}

.transient-notice__eyebrow,
.transient-notice__title,
.transient-notice__body,
.transient-notice__detail {
    margin: 0;
}

.transient-notice__eyebrow {
    color: var(--transient-gold);
    font-family: var(--font-ui, system-ui, sans-serif);
    font-size: var(--text-xs, 0.75rem);
    font-weight: 850;
    letter-spacing: 0.12em;
    line-height: 1.3;
    text-transform: uppercase;
}

.transient-notice__dismiss {
    width: 2.625rem;
    min-height: 2.625rem;
    display: grid;
    place-items: center;
    margin: -0.35rem -0.35rem 0 0;
    padding: 0;
    border: var(--transient-border-width) solid rgb(241 210 115 / 0.38);
    border-radius: var(--transient-radius);
    background: rgb(5 14 23 / 0.3);
    color: var(--transient-text);
    cursor: pointer;
    font-size: 1.15rem;
    line-height: 1;
}

.transient-notice__dismiss:hover { background: rgb(241 210 115 / 0.13); }

.transient-notice__dismiss:focus-visible,
.transient-notice__action:focus-visible {
    outline: var(--border-strong, 2px) solid var(--focus-on-dark, #f1dfba);
    outline-offset: 0.16rem;
}

.transient-notice__title {
    color: var(--transient-text);
    font-size: var(--text-lg, 1.125rem);
    line-height: 1.2;
}

.transient-notice__body {
    color: var(--transient-text);
    font-size: var(--text-sm, 0.875rem);
    line-height: 1.45;
}

.transient-notice__detail {
    color: var(--transient-muted-text);
    font-size: var(--text-sm, 0.875rem);
    line-height: 1.4;
}

.transient-notice__action {
    width: fit-content;
    max-width: 100%;
    margin-block-start: var(--transient-gap-xs);
    color: var(--transient-gold);
    font-family: var(--font-ui, system-ui, sans-serif);
    font-size: var(--text-sm, 0.875rem);
    font-weight: 800;
    overflow-wrap: anywhere;
    text-underline-offset: 0.18em;
}

@media (max-width: 30rem) {
    .transient-notice-region {
        --transient-gutter: clamp(0.55rem, 2.5vw, 1rem);
    }

    .transient-notice {
        padding: var(--transient-gap-md);
    }
}

@media (prefers-reduced-motion: reduce) {
    .transient-notice { transition: none; }
}
.transient-notice__sections { max-height: min(40vh, 20rem); overflow-y: auto; min-width: 0; font-size: 0.875rem; }
.transient-notice__sections h3 { font-size: 0.9375rem; margin-block: 0.5rem 0.25rem; }
.transient-notice__sections p { margin-block: 0.25rem; }
.transient-notice__sections ul { margin-block: 0.25rem 0.5rem; padding-inline-start: 1.25rem; }
.transient-notice__sections:focus-visible { outline: 2px solid var(--transient-gold, #e5c66f); outline-offset: 2px; }