/* Public home announcements: isolated tokens keep each theme's global reset out. */
.ydy-announcement {
    --announcement-template-surface: rgba(255, 255, 255, .44);
    --announcement-glass-surface: rgba(255, 255, 255, .36);
    --announcement-text: #172033;
    --announcement-accent: #f2bfd2;
    --announcement-on-accent: #5d2c44;
    --announcement-focus: #a43c6a;
    --announcement-edge: rgba(255, 255, 255, .45);
    box-sizing: border-box;
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: none;
    flex-direction: column;
    width: calc(100% - 32px);
    max-width: 480px;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--announcement-edge);
    border-radius: 20px;
    background: var(--announcement-template-surface);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    color: var(--announcement-text);
    font: 16px/1.65 -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
    text-align: left;
    text-shadow: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .50), 0 10px 32px rgba(17, 32, 51, .10);
    color-scheme: light;
}
.ydy-announcement *, .ydy-announcement *::before, .ydy-announcement *::after { box-sizing: border-box; }
.ydy-announcement[open] { display: flex; }
.ydy-announcement[hidden], .ydy-announcement-backdrop[hidden] { display: none !important; }
.ydy-announcement::backdrop, .ydy-announcement-backdrop { background: rgba(0, 0, 0, .06); }
.ydy-announcement-backdrop { position: fixed; inset: 0; z-index: 2147483647; touch-action: none; }
.ydy-announcement.ydy-announcement-fallback { inset: auto; left: 50%; top: 50%; margin: 0; transform: translate(-50%, -50%); }
.ydy-announcement[data-template="anime"] {
    --announcement-accent: #b33470; --announcement-on-accent: #fff;
    --announcement-focus: var(--announcement-accent);
}
.ydy-announcement[data-template="starry"] {
    --announcement-accent: #2862a3; --announcement-on-accent: #fff;
    --announcement-focus: var(--announcement-accent);
}
.ydy-announcement[data-template="newyork"] {
    --announcement-accent: #90671f; --announcement-on-accent: #fff;
    --announcement-focus: var(--announcement-accent);
}
.ydy-announcement[data-template="jxb"] {
    --announcement-accent: #57549a; --announcement-on-accent: #fff;
    --announcement-focus: var(--announcement-accent);
}
.ydy-announcement[data-template="sww"] {
    --announcement-accent: #216b95; --announcement-on-accent: #fff;
    --announcement-focus: var(--announcement-accent);
}
.ydy-announcement[data-template="uk"] {
    --announcement-accent: #1d4a68; --announcement-on-accent: #fff;
    --announcement-focus: var(--announcement-accent);
}
.ydy-announcement[data-template="xinsui"] {
    --announcement-accent: #7d4f91; --announcement-on-accent: #fff;
    --announcement-focus: var(--announcement-accent);
}
.ydy-announcement[data-template="youyu"] {
    --announcement-accent: #725090; --announcement-on-accent: #fff;
    --announcement-focus: var(--announcement-accent);
}
.ydy-announcement[data-style="glass"] { background: var(--announcement-glass-surface); border-radius: 24px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 10px 32px rgba(17, 32, 51, .10); }
.ydy-announcement[data-style="glass"]::before {
    content: ''; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
    background: linear-gradient(125deg, rgba(255, 255, 255, .12), transparent 38%, transparent 75%, rgba(255, 255, 255, .03));
}
.ydy-announcement-header { position: relative; display: flex; align-items: flex-start; gap: 12px; flex: 0 1 auto; min-height: 0; max-height: 160px; max-height: min(30vh, 160px); max-height: min(30dvh, 160px); padding: 24px 24px 16px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.ydy-announcement-mark { display: flex; align-items: center; justify-content: center; flex: 0 0 28px; width: 28px; height: 28px; color: var(--announcement-accent); }
.ydy-announcement-mark svg { display: block; width: 24px; height: 24px; }
.ydy-announcement-title { margin: 0; min-width: 0; color: inherit; font: inherit; font-size: 19px; font-weight: 650; line-height: 1.45; overflow-wrap: anywhere; white-space: pre-wrap; }
.ydy-announcement-message { position: relative; flex: 1 1 auto; min-height: 0; margin: 0; padding: 0 24px 4px; overflow-y: auto; overscroll-behavior: contain; white-space: pre-wrap; overflow-wrap: anywhere; color: inherit; font: inherit; scrollbar-width: thin; }
/* The 16px edge fade ends before the existing 20/24px text padding. The
   background belongs to each scroll box, so scrolled text keeps its .32 veil. */
.ydy-announcement-header, .ydy-announcement-message {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .32) 16px, rgba(255, 255, 255, .32) calc(100% - 16px), rgba(255, 255, 255, 0));
    border-radius: 12px;
}
.ydy-announcement-footer { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: flex-end; flex: 0 0 auto; width: 100%; margin: 0; padding: 16px 24px 20px; font: inherit; color: inherit; }
.ydy-announcement-confirm {
    position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: center;
    min-width: 88px; min-height: 44px; max-width: 100%; margin: 0; padding: 4px 22px;
    border: 0; border-radius: 8px; background: transparent; color: var(--announcement-on-accent);
    font: inherit; font-size: 14px; font-weight: 600; line-height: 1.5; text-align: center;
    overflow-wrap: anywhere; cursor: pointer; touch-action: manipulation;
}
.ydy-announcement-confirm::before { content: ''; position: absolute; z-index: -1; inset: 6px 0; border-radius: 8px; background: var(--announcement-accent); transition: filter .12s ease; }
.ydy-announcement-confirm:hover::before { filter: brightness(1.06); }
.ydy-announcement-confirm:active::before { filter: brightness(.92); }
.ydy-announcement-confirm:focus-visible, .ydy-announcement-message:focus-visible, .ydy-announcement-header:focus-visible { outline: 2px solid var(--announcement-focus); outline-offset: -3px; }
@media (max-width: 480px) {
    .ydy-announcement-header { padding: 20px 20px 14px; }
    .ydy-announcement-message { padding-left: 20px; padding-right: 20px; }
    .ydy-announcement-footer { padding: 14px 20px 18px; }
}
@media (max-width: 767px), (max-width: 991px) and (max-height: 500px) {
    .ydy-announcement-confirm::before { top: 2px; bottom: 2px; }
}
@media (prefers-reduced-motion: reduce) { .ydy-announcement *, .ydy-announcement *::before { transition: none !important; scroll-behavior: auto !important; } }