/* 跑馬燈：公告與活動橫幅從右往左跑一次就消失；詳情在右邊的小圖示（點開才看） */
#marquee { position:fixed; left:50%; top:calc(58px + env(safe-area-inset-top)); transform:translateX(-50%); width:min(760px, calc(100vw - 24px)); height:28px; z-index:30; display:flex; align-items:center; gap:6px; pointer-events:none; }
#marquee[hidden] { display:none; }
#marquee .mq-track { flex:1; min-width:0; height:100%; overflow:hidden; border-radius:999px; position:relative; display:flex; align-items:center; background:transparent; }
#marquee .mq-track.run { background:linear-gradient(90deg, rgba(255,111,138,.88), rgba(255,176,32,.88)); box-shadow:0 2px 8px var(--shadow, rgba(0,0,0,.2)); }
#marquee .mq-text { position:absolute; left:0; top:0; height:100%; display:flex; align-items:center; white-space:nowrap; font-size:14px; font-weight:800; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.35); will-change:transform; }
#marquee .mq-ic { pointer-events:auto; flex:none; width:28px; height:28px; padding:0; border-radius:50%; font-size:15px; line-height:26px; text-align:center; background:rgba(255,250,240,.9); border:1px solid var(--line, #ddd); cursor:pointer; }
#marquee .mq-ic[hidden] { display:none; }
.mq-list { display:flex; flex-direction:column; gap:8px; max-height:50vh; overflow-y:auto; }
.mq-card { background:#fff8e6; border:1px solid #f2d9a0; border-radius:12px; padding:8px 12px; }
.mq-card b { display:block; font-size:15px; } .mq-card p { margin:4px 0 0; font-size:13px; } .mq-card small { opacity:.7; }
/* 手機：細細一條、半透明、貼在最上緣，不擋視角 */
body.touch #marquee { top:calc(2px + env(safe-area-inset-top)); left:0; right:0; transform:none; width:auto; height:18px; padding:0 6px; opacity:.82; }
body.touch #marquee .mq-text { font-size:11px; }
body.touch #marquee .mq-ic { width:20px; height:18px; font-size:11px; line-height:16px; }