/* Server announcement banner (roadmap item 98, src/announcement-banner.js). Centre top, below the top HUD row
   (--announce-top is measured from #adventure-navigation / #target-frame by the script). z-index 1001: above the entry/lobby
   shell (#loading.entry-shell is 1000, its iframe would swallow the clicks); it never shares a spot with the bottom-right
   game-update notice. Only the buttons take clicks. */
.announcement-banner{position:fixed;z-index:1001;top:calc(var(--announce-top,10px) + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);
 width:var(--announce-width,min(560px,calc(100vw - 32px)));max-width:calc(100vw - 32px);box-sizing:border-box;display:flex;align-items:center;gap:8px;
 padding:5px 6px 5px 12px;border:1px solid #d9bd73;border-radius:12px;background:linear-gradient(180deg,rgba(43,70,48,.94),rgba(30,52,36,.94));
 color:#fff4d6;font:600 14px/1.35 'Nunito Sans','Noto Sans Thai',Tahoma,sans-serif;box-shadow:0 6px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,236,180,.22);
 pointer-events:none;text-shadow:0 1px 1px rgba(0,0,0,.45)}
.announcement-banner[hidden]{display:none}
.announcement-banner button{pointer-events:auto}
.announcement-banner[data-tone="event"]{border-color:#e8c45e;background:linear-gradient(180deg,rgba(86,62,24,.95),rgba(60,42,16,.95))}
.announcement-banner[data-tone="warning"]{border-color:#f0a35a;background:linear-gradient(180deg,rgba(110,46,30,.95),rgba(80,30,20,.95))}
.announcement-banner.announcement-local{border-style:dashed}
.announcement-icon{flex:0 0 auto;font-size:16px;line-height:1}
.announcement-label{flex:0 0 auto;padding:1px 7px;border-radius:999px;background:rgba(255,226,150,.18);color:#ffe3a1;font-size:11px;font-weight:800;letter-spacing:.2px}
.announcement-viewport{flex:1 1 auto;min-width:0;overflow:hidden}
.announcement-text{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;word-break:break-word}
.announcement-banner[data-style="ticker"] .announcement-text{display:inline-block;white-space:nowrap;-webkit-line-clamp:unset;overflow:visible;padding-left:100%;
 animation:announcement-ticker var(--ticker-seconds,14s) linear infinite}
@keyframes announcement-ticker{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){
 .announcement-banner[data-style="ticker"] .announcement-text{animation:none;padding-left:0;white-space:normal;display:-webkit-box;-webkit-line-clamp:2}
}
.announcement-count{flex:0 0 auto;font-size:11px;color:#f1dca6;opacity:.9}
.announcement-count[hidden]{display:none}
.announcement-action{flex:0 0 auto;min-height:30px;padding:3px 10px;border-radius:9px;background:#e7c46b;color:#3a2a10;font-weight:800;font-size:12px}
.announcement-action[hidden]{display:none}
.announcement-dismiss{flex:0 0 auto;width:38px;height:38px;margin:-4px -2px -4px 0;border-radius:10px;background:transparent;color:#ffe9b8;font-size:22px;line-height:1}
.announcement-dismiss:hover,.announcement-dismiss:focus-visible{background:rgba(255,236,180,.16)}
/* Narrow screens and touch: a little smaller; still never wider than the screen minus 16 px a side. */
@media (max-width:600px),(pointer:coarse) and (max-height:500px){
 .announcement-banner{font-size:12.5px;gap:6px;padding:3px 4px 3px 9px}
 .announcement-label{display:none}
}
/* Photo mode (item 88) hides the HUD: the banner too. */
body.photo-mode .announcement-banner{visibility:hidden}