/* Modified 2026-11-01: Reserve the existing announcement row for the birthday countdown. */
body.test-shell.choi-countdown-visible { --app-header-height: 152px; }
.test-shell.choi-countdown-visible .app-header { height: 122px; top: 30px; }
#choi-countdown {
    position: fixed; inset: 0 0 auto; height: 30px; z-index: 100;
    box-sizing: border-box; padding: 6px 18px; overflow: hidden;
    background: #142337; color: #f1e8cf; border-bottom: 1px solid #9d8755;
    font: 13px/17px Arial, sans-serif; font-variant-numeric: tabular-nums;
    text-align: center; white-space: nowrap; text-overflow: ellipsis;
}
#choi-countdown[hidden] { display: none; }
/* Modified 2026-11-01: Place a compact photo card controlled by the shared effects toggle at the bottom right. */
.holiday-scene.holiday-choi-birthday {
    /* Modified 2026-11-01: Use shared corner offsets without movement animations. */
    --choi-gap: 18px;
    box-sizing: border-box;
    inset: auto var(--choi-gap) var(--choi-gap) auto; width: 200px; height: auto;
    transition: none;
    z-index: 90; border: 1px solid #9d8755; border-radius: 7px;
    background: #142337; color: #f1e8cf; box-shadow: 0 4px 18px #0004;
    pointer-events: auto !important; font: 12px/1.35 Arial, sans-serif;
}
.holiday-choi-birthday .choi-heading {
    display: flex; gap: 7px; align-items: center; padding: 8px;
}
/* Modified 2026-11-01: Keep the caption flexible instead of squeezing it into a narrow column. */
.holiday-choi-birthday .choi-heading > span { flex: 1; min-width: 0; width: auto; }
.holiday-choi-birthday .choi-heading b { color: #f1e8cf; font-size: 11px; }
.holiday-choi-birthday .choi-heading small { display: block; font-size: 9px; }
.holiday-choi-birthday img.choi-portrait {
    width: 28px; height: 36px; flex-shrink: 0; object-fit: cover;
}
/* Modified 2026-11-01: Keep slides visible without a separate collapse control. */
.holiday-choi-birthday .choi-slides { position: relative; height: 250px; background: #111; }
.holiday-choi-birthday .choi-slides img {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;
    opacity: 0; transition: opacity 1s ease;
}
.holiday-choi-birthday .choi-slides img.is-active { opacity: 1; }
.holiday-scene.holiday-choi-birthday[hidden] { display: none; }
/* Modified 2026-11-01: Keep the reminder compact on phones and omit it from printouts. */
@media (max-width: 767px) {
    .holiday-scene.holiday-choi-birthday { --choi-gap: 8px; width: 180px; }
    .holiday-choi-birthday .choi-slides { height: 220px; }
    #choi-countdown { padding-inline: 6px; font-size: 10px; }
}
@media print { #choi-countdown { display: none !important; } }
/* Modified 2026-11-01: Provide alternate corners below the header for mouse avoidance. */
.holiday-scene.holiday-choi-birthday[data-corner="bottom-left"] {
    inset: auto auto var(--choi-gap) var(--choi-gap);
}
.holiday-scene.holiday-choi-birthday[data-corner="top-right"] {
    inset: calc(var(--app-header-height, 122px) + var(--choi-gap)) var(--choi-gap) auto auto;
}
.holiday-scene.holiday-choi-birthday[data-corner="top-left"] {
    inset: calc(var(--app-header-height, 122px) + var(--choi-gap)) auto auto var(--choi-gap);
}
