/* Shared current-app visual layer. Load after legacy page styles.
 * Existing Events/Admin/Missions styles own those pages. No display, hidden,
 * open, checked, selected, modal-state or team-colour rules are replaced here.
 * Navigation, staging notices, image pixels, badge artwork and map UI are kept.
 */
:root {
  --app-bg: #090d0b;
  --app-surface: #131a16;
  --app-input: #0d1410;
  --app-border: #2b3730;
  --app-text: #f1f6f3;
  --app-muted: #a8b7ae;
  --app-accent: #00e676;
  --app-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

/* Remove only the identified decorative page backdrops, not functional media. */
html { background: var(--app-bg) !important; }
html::before, html::after { content: none !important; animation: none !important; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) {
  --accent: var(--app-accent);
  --accent-dark: #00c865;
  --glass-bg: var(--app-surface);
  --glass-border: var(--app-border);
  --glass: var(--app-surface);
  --glass-b: var(--app-border);
  --text: var(--app-text);
  --text-muted: var(--app-muted);
  --muted: var(--app-muted);
  --tile-bg: var(--app-input);
  --tile-border: var(--app-border);
  --divider: var(--app-border);
  --border: var(--app-border);
  --radius: 12px;
  --radius-s: 8px;
  --shadow: none;
  --blur: 0px;
  background: var(--app-bg) !important;
  color: var(--app-text);
  font-family: var(--app-font);
  font-size: 16px;
  line-height: 1.5;
  text-shadow: none;
  -webkit-font-smoothing: antialiased;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui))::before,
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui))::after {
  content: none !important;
  animation: none !important;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(#matrix, #bg-aces) {
  opacity: 0 !important;
  pointer-events: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) #bg-aces * {
  animation: none !important;
}

/* Page rhythm; each existing route retains its own width/layout model. */
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.container, .vouchers-page, .product-page, .redeem-page, .glass-card) {
  box-sizing: border-box;
  min-width: 0;
  margin-top: 32px;
  margin-bottom: 32px;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.container, .vouchers-page, .product-page, .redeem-page) {
  padding-left: 24px;
  padding-right: 24px;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(h1, h2, h3, h4, .page-head .title, .section-title) {
  font-family: var(--app-font);
  color: var(--app-text);
  line-height: 1.2;
  letter-spacing: 0;
  text-shadow: none;
  overflow-wrap: anywhere;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(h1, .page-head .title) {
  font-size: 28px;
  font-weight: 700;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) h2 { font-size: 20px; font-weight: 650; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(h3, .section-title) { font-size: 18px; font-weight: 650; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(p, li, dd) { overflow-wrap: anywhere; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.subtitle, .hint, .desc, .muted, .full-name, .rank-name, .xp-label, .stat-label) {
  font-family: var(--app-font);
  color: var(--app-muted);
  line-height: 1.5;
  text-shadow: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.hint, .rank-name, .xp-label, .stat-label) { font-size: 13px; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.page-head, .name-row) { min-width: 0; }

/* Flat surfaces. Only known panel classes are targeted; state/status chips,
 * user team colours, logo/avatar/banner containers and artwork are untouched. */
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.card, .glass, .glass-card, .setting-row, .notice, .voucher-row, .shop-item, .chat-log, .chat-box, .popup, .modal-content, .parchment, .wanted) {
  background: var(--app-surface);
  color: var(--app-text);
  border: 1px solid var(--app-border);
  border-radius: 12px;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  outline: 0;
  text-shadow: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.card, .parchment)::before,
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.card, .parchment)::after {
  content: none;
  animation: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.setting-row, .notice, .voucher-row, .shop-item):hover {
  background: #18231c;
  box-shadow: none;
  transform: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .notice.unread { border-color: #3d7655; }
/* The product link owns its single card border; its list item is not a panel. */
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.shop-item, .shop-item:hover) {
  background: transparent;
  border: 0;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .shop-item > a {
  background: var(--app-surface);
  border: 1px solid var(--app-border);
  border-radius: 12px;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .shop-item > a:hover {
  background: #18231c;
  border-color: #405448;
  transform: none;
  box-shadow: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.bubble, .chat-bubble) {
  background: #223127;
  color: var(--app-text);
  border-radius: 10px;
  box-shadow: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.msg.you .bubble, .chat-message.you .chat-bubble) { background: #173c28; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .parchment { margin: 0; border: 0; font-family: var(--app-font); }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .wanted :is(.w-title, .stat-val, .stat-label) {
  font-family: var(--app-font);
  color: var(--app-text);
  letter-spacing: 0;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .wanted .stat-label { color: var(--app-muted); }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .ww :is(.bio, .full-name, .rank-name, .xp-label, .section-title) { color: var(--app-text); }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .avatar-wrap {
  box-shadow: none;
  background: var(--app-input);
  border-color: var(--app-accent);
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .xp-line-bg { background: #22342a; border-color: var(--app-border); box-shadow: none; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .xp-line-fill { background: var(--app-accent); box-shadow: none; animation: none; }

/* Keep terminal controls in normal flow as their shared touch targets grow. */
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .ua-term .chrome-bar {
  box-sizing: border-box;
  height: auto;
  min-height: 44px;
  padding: 6px 10px;
  flex-wrap: wrap;
  row-gap: 6px;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .ua-term .chrome-bar > .dot { flex: 0 0 11px; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .ua-term .term-controls {
  min-width: 0;
  max-width: 100%;
  flex-wrap: wrap;
}

/* Native form styling without changing control type, checked state or layout. */
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(input, select, textarea):not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=submit]):not([type=button]):not(:where(#urban-nav *, #urban-topbar *, .leaflet-control *)) {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #3a4b40;
  border-radius: 8px;
  background: var(--app-input);
  color: var(--app-text);
  font: 400 14px/1.5 var(--app-font);
  box-shadow: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) textarea { resize: vertical; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(input, textarea)::placeholder { color: #9aada0; opacity: 1; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(input[type=checkbox], input[type=radio], input[type=range]) { accent-color: var(--app-accent); }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(input[type=checkbox], input[type=radio]) { flex-shrink: 0; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) label:not(:where(#urban-nav *, #urban-topbar *)) { font-family: var(--app-font); font-size: 14px; line-height: 1.5; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) input[type=file]::file-selector-button {
  min-height: 32px;
  margin-right: 10px;
  padding: 5px 10px;
  border: 1px solid #405448;
  border-radius: 5px;
  background: #213126;
  color: var(--app-text);
  font: 500 13px/1.4 var(--app-font);
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(button, input[type=submit], input[type=button], .btn, .inline-btn, .public-btn):not(:where(#urban-nav *, #urban-topbar *, .leaflet-control *, .cropper-container *)) {
  box-sizing: border-box;
  min-height: 44px;
  min-width: 44px;
  border-radius: 8px;
  font-family: var(--app-font);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.4;
  text-shadow: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(button[type=submit], input[type=submit], .btn, .inline-btn, .public-btn):not(:where(#urban-nav *, #urban-topbar *, .leaflet-control *, .danger, .delete, .reject, .remove-photo, .chip, [data-team-color], [style*="background"])) {
  background: var(--app-accent);
  border-color: var(--app-accent);
  color: #062312;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.btn.secondary, .inline-btn, .public-btn) {
  background: #17251d;
  color: var(--app-text);
  border: 1px solid #3a4b40;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(button, .btn, .inline-btn, .public-btn):hover:not(:disabled) {
  transform: none;
  box-shadow: none;
  filter: none;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(button, input, select, textarea):disabled { cursor: not-allowed; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(a, button, input, select, textarea, summary):focus-visible:not(:where(#urban-nav *, #urban-topbar *)) {
  outline: 2px solid var(--app-accent);
  outline-offset: 3px;
}

/* Keep actual table/list structures and their existing scroll containers. */
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) table {
  border-collapse: collapse;
  color: var(--app-text);
  font: 400 14px/1.5 var(--app-font);
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(th, td) { padding: 12px; border-bottom: 1px solid var(--app-border); }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) th { background: #17251d; color: var(--app-text); font-weight: 650; text-align: left; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.tabs, .section-nav) { gap: 8px; }
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.tabs button, .section-nav a) {
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--app-border);
  border-radius: 8px;
  background: #17251d;
  color: var(--app-muted);
  font: 600 14px/1.5 var(--app-font);
  box-sizing: border-box;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.tabs button.active, .section-nav a.active) {
  border-color: var(--app-accent);
  background: #183425;
  color: var(--app-accent);
}

/* Raising layers does not open them: their existing class/JS gates still own
 * display and visibility. Cropper's internal positioning remains untouched. */
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.modal, .popup-overlay, .lightbox, #lightbox-overlay, #avatarLightbox, #uploadOverlay, #scannerOverlay) {
  z-index: 20000;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.popup, .modal-content) {
  box-sizing: border-box;
  max-width: calc(100vw - 32px);
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  padding: 24px;
}
body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.modal .close, #lightbox-close) {
  min-width: 44px;
  min-height: 44px;
  font-size: 24px;
  color: var(--app-text);
}

@media (max-width: 600px) {
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.container, .vouchers-page, .product-page, .redeem-page, .glass-card) {
    margin-top: 24px;
    margin-bottom: 24px;
    padding-left: 16px;
    padding-right: 16px;
  }
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.container.card, .glass-card, .popup, .modal-content) { padding: 20px 16px; }
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .container.card:has(> .shop-list) {
    width: calc(100% - 32px);
    margin-left: auto;
    margin-right: auto;
  }
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .card.glass > .section { padding: 20px 16px 12px; }
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .setting-row { padding: 12px; }
  /* Keep mobile editing readable and prevent iOS focus zoom, including legacy
   * high-specificity input rules. This changes typography, never visibility. */
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(input, select, textarea):not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=range]):not(:where(#urban-nav *, #urban-topbar *, .leaflet-control *)) { font-size: 16px !important; }
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.popup, .modal-content) { max-width: calc(100vw - 24px); }
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .dm-icon { bottom: calc(var(--urban-nav-height, 76px) + 12px); }
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) .dm-popup { bottom: calc(var(--urban-nav-height, 76px) + 64px); max-width: calc(100vw - 24px); }
}
@media (prefers-reduced-motion: reduce) {
  body:not(:is(.event-ui,.admin-page,.ops-game-page,.shop-ui,.chat-ui,.friends-ui)) :is(.card, .glass, .notice, .voucher-row, .shop-item, .setting-row, button, input, a) {
    transition: none !important;
    scroll-behavior: auto !important;
  }
}