/* HUD overlap fixes (audit U01) and "not available yet" markers (audit U03). Loaded after every other stylesheet.
   Positions that depend on measured sizes are set by js/game/hudfix.js; this file only holds the static part. */

/* ---------- U01: unfolded menu row (landscape / desktop) never runs over the player frame: it wraps to a second line */
@media (orientation: landscape), (min-width: 721px) {
  #menuRow.full { flex-wrap: wrap; justify-content: flex-end; row-gap: 2px;
    max-width: calc(100vw / var(--hz, 1) - var(--hw, 300px) - var(--mmw, 156px) - var(--gap, 6px) * 4 - var(--safe-l, 0px) - var(--safe-r, 0px) - 8px); }
}
/* unfolded menu column on a short portrait phone: second column to the left (max-height from hudfix.js) */
#menuRow.full.fx-wrap { flex-wrap: wrap-reverse; align-content: flex-start; }

/* ---------- U01: update bar / announcement in a narrow free gap (hudfix.js): the bar may wrap */
#netTop.fx-narrow { width: auto; }
#netTop.fx-narrow .upd-banner { flex-wrap: wrap !important; width: auto; justify-content: center; }
#netTop.fx-narrow .net-ann-t { -webkit-line-clamp: 4; }

/* ---------- U01: MVP notice on a portrait phone: over the play area instead of over the minimap / gold panel / quest dock */
@media (orientation: portrait) and (max-width: 720px) { .mvpbanner { top: 44%; max-width: 80vw; padding-left: 20px; padding-right: 20px; } }

/* ---------- U03: features that are not in service yet say so (no sample data shown as if it were live) */
.soon-box { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 12px; text-align: center; }
.soon-box p { margin: 0; font-size: 14px; line-height: 1.5; } .soon-box p small { font-size: 12px; color: var(--muted, #a9a6d2); }
.soon-box .soon-en { font-size: 12px; color: var(--muted, #a9a6d2); }
.soon-badge { display: inline-block; padding: 3px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600; letter-spacing: .2px; white-space: nowrap;
  color: #2a1a04; background: linear-gradient(180deg, #ffe39a, #e0a83e); border: 1px solid #8a5a16; box-shadow: 0 1px 0 rgba(0, 0, 0, .5); }
.cl-soon { margin: 4px 0 2px; padding: 3px 8px; border-radius: 8px; font-size: 12px; text-align: center; color: #ffe39a; background: rgba(224, 178, 82, .14); border: 1px dashed rgba(224, 178, 82, .55); }
.nameplate .np-guild[hidden] { display: none !important; }

/* ---------- U01: wide portrait phones (431-720 px, HUD scaled up by --hz): the open chat box was 74vw x hz = wider than
   the screen and ran under AUTO / off the right edge. Same 74 % of the screen at every scale. */
@media (orientation: portrait) and (min-width: 431px) and (max-width: 720px) { #chat { max-width: calc(74vw / var(--hz, 1)); } }