/* The news (js/ui/news.js; the owner's 'news lands on the thing it's about', 2026-10-25). Engine's file. Nothing here takes
   a tap (pointer-events: none), and nothing waits to be tapped away. */
/* (a) a change floating off its HUD counter: a gain rises into it, a loss falls from it */
.news-float { position: fixed; z-index: 70; translate: -50% 0; pointer-events: none; white-space: nowrap; font-family: var(--pix); font-size: 16px;
  line-height: 1; padding: 1px 4px; color: #a8d890; text-shadow: 1px 1px 0 var(--ink), -1px 1px 0 var(--ink), 1px -1px 0 var(--ink), -1px -1px 0 var(--ink);
  opacity: 0; animation: news-up 1s cubic-bezier(.2, .8, .3, 1) both; }
.news-float.bad { color: #ef7a7a; animation-name: news-down; }
@keyframes news-up { 0% { opacity: 0; transform: translateY(22px); } 25% { opacity: 1; } 70% { opacity: 1; } 100% { opacity: 0; transform: translateY(0); } }
@keyframes news-down { 0% { opacity: 0; transform: translateY(0); } 15% { opacity: 1; } 70% { opacity: 1; } 100% { opacity: 0; transform: translateY(24px); } }
/* (b) a floor's arrival, a Gate's crossing, a True Name: a card over the map's top that fades */
.news-card { position: fixed; left: 50%; translate: -50% 0; z-index: 40; pointer-events: none; box-sizing: border-box; width: max-content;
  max-width: min(320px, calc(100vw - 32px)); padding: 8px 14px 9px; text-align: center; background: rgba(10, 12, 18, .82); border: 2px solid rgba(182, 220, 248, .35);
  box-shadow: 0 2px 0 var(--ink); color: var(--bone); animation: news-in .4s ease both; }
.news-card.news-out { animation: news-off .6s ease both; }
.news-card .news-title { font-family: var(--pix); font-size: 20px; line-height: 1.1; color: #b6dcf8; }
.news-card .news-text { margin-top: 4px; font-family: var(--read); font-size: 14px; line-height: 1.35; }
.news-card.news-intro .news-title, .news-card.news-name .news-title { color: #d4b060; }
@keyframes news-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes news-off { from { opacity: 1; } to { opacity: 0; } }
/* (c) a first-time gloss at the top of the panel it's about */
#panel > .news-intro { position: relative; z-index: 2; box-sizing: border-box; margin: 2px auto 8px; max-width: min(32em, 100%); padding: 5px 9px; text-align: center;
  font-family: var(--read); font-size: 14px; line-height: 1.35; color: var(--bone); background: rgba(14, 13, 10, .9); border: 1px solid rgba(212, 176, 96, .5);
  box-shadow: 0 2px 0 var(--ink); }
#panel > .news-intro .news-new { font-family: var(--pix); font-weight: 400; color: #d4b060; margin-right: 2px; }
@media (prefers-reduced-motion: reduce) { .news-float, .news-card, .news-card.news-out { animation-duration: .01s; } }