/* Shanghai additions to the shared venue console; geometry and seat data stay in core.js. */
html.i18n-pending body { visibility: hidden; }
#scene { position: relative; isolation: isolate; }
.topbar { align-items: flex-start; }
.actions { flex-wrap: nowrap; max-width: none; }
.exit-venue { display: inline-flex; align-items: center; padding: 0 14px; text-decoration: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.venue-tools[popover] { position: fixed; z-index: 10; max-height: min(62dvh, 660px); }
.venue-tools[popover]:popover-open {
  grid-template-columns: 1.1fr 1fr 1fr 1fr;
  grid-template-areas:
    "header header header header"
    "seating stage lighting chase"
    "seating audience lighting chase"
    "venue performance glow glow"
    "language help gyro gyro";
}
.venue-tools-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.venue-tools-header-actions { display: flex; margin-left: auto; }
.venue-tools button, .venue-tools select { border-radius: 11px; }
.tool-group, .language-picker { display: grid; align-content: start; gap: 8px; }
.control-seating { grid-area: seating; border-left: 0; }
.control-venue { grid-area: venue; border-left: 0; }
.control-chase-colors { grid-area: chase; }
.control-stage, .control-performance { border-left: 1px solid var(--venue-ui-line); }
.venue-tools .field { gap: 5px; margin: 0 0 8px; color: var(--venue-ui-muted); }
.venue-tools .field select { min-height: 40px; }
.venue-tools .note { margin: 0; font-size: 11px; line-height: 1.5; }
#locate { min-height: 40px; border-color: rgba(105, 199, 194, .55) !important; }
.performance-switcher { min-width: 0; }
.performance-switcher summary { display: flex; align-items: center; padding: 0 10px; list-style: none; }
.performance-switcher summary::-webkit-details-marker { display: none; }
.performance-switcher-controls { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 7px; }
.performance-switcher-controls label { min-width: 0; max-width: 100%; }
.performance-switcher select { width: 100%; max-width: 100%; padding-inline: 8px; }
#performance-current { color: var(--venue-ui-muted); font-size: 11px; line-height: 1.4; }
#performance-current:empty { display: none; }
#performance-status { font-size: 12px; color: #ffb9b9; }
.audience-modes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.audience-modes button { min-width: 0; padding-inline: 4px; font-size: 12px; white-space: normal; }
.stage-switcher { display: grid; grid-template-columns: 36px minmax(0, 1fr) 36px; align-items: center; gap: 4px; }
.stage-switcher button { padding: 0; font-size: 24px; }
.stage-switcher strong { text-align: center; }
.lighting-controls, .chase-colors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.lighting-controls button, .venue-display-controls button { min-width: 0; padding-inline: 6px; font-size: 12px; white-space: normal; }
.venue-display-controls { display: grid; grid-template-columns: 1fr; gap: 6px; }
.venue-display-controls button[aria-pressed="true"] { border-color: rgba(105, 199, 194, .7) !important; background: var(--venue-ui-accent-soft) !important; color: #c9fffb !important; }
.chase-colors label { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-width: 0; min-height: 38px; padding: 4px 7px; border: 1px solid var(--venue-ui-line); border-radius: 11px; color: var(--venue-ui-muted); font-size: 11px; }
.chase-colors input { flex-shrink: 0; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }
.chase-colors input::-webkit-color-swatch-wrapper { padding: 2px; }
.chase-colors input::-webkit-color-swatch { border: 1px solid rgba(255, 255, 255, .55); border-radius: 50%; }
#chase-colors-reset { grid-column: 1 / -1; min-height: 38px; }
#glowstick-ui { display: grid; gap: 8px; }
#glowstick-toggle, #glowstick-theme-save, #gyroscope-toggle { width: 100%; }
#friend-status, #gyroscope-status, #glowstick-hint, #glowstick-theme-status { font-size: 12px; line-height: 1.4; }
.glowstick-swatch { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--glow-color); box-shadow: 0 0 8px var(--glow-color); }
#glowstick-actions { position: fixed; z-index: 4; left: 50%; bottom: max(92px, calc(env(safe-area-inset-bottom) + 92px)); display: flex; gap: 8px; margin: 0; transform: translateX(-50%); pointer-events: auto; }
#glowstick-actions button { width: 56px; height: 56px; min-width: 56px; min-height: 56px; border-radius: 50%; padding: 5px; font-size: 12px; line-height: 1.05; backdrop-filter: blur(14px); }
#friend-card { position: absolute; z-index: 5; display: grid; gap: 5px; width: min(264px, calc(100% - 24px)); padding: 12px 14px; border-radius: 14px; pointer-events: none; }
#friend-card strong { font-size: 15px; }
#friend-card span { font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
@media (max-width: 980px) {
  .venue-tools[popover]:popover-open {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "header header"
      "seating venue"
      "stage audience"
      "lighting chase"
      "language performance"
      "glow glow"
      "help gyro";
  }
  .control-seating, .control-stage, .control-lighting, .control-language, .control-glowstick, .control-help { border-left: 0; }
  .control-venue, .control-audience, .control-chase-colors, .control-performance, .control-gyro { border-left: 1px solid var(--venue-ui-line); }
}
@media (max-width: 768px) {
  .venue-tools[popover] { max-height: min(82dvh, 760px); }
  .venue-tools[popover]:popover-open {
    grid-template-areas:
      "header header"
      "language performance"
      "seating seating"
      "venue venue"
      "stage gyro"
      "audience audience"
      "lighting lighting"
      "chase chase"
      "glow glow"
      "help help";
  }
  .actions button, .actions a { min-height: 44px; }
  .control-venue, .control-audience, .control-lighting, .control-chase-colors { border-left: 0; }
  .venue-tools .note { font-size: 10px; }
  .venue-display-controls, .lighting-controls { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .chase-colors { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #seat-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
  #seat-form .field { margin: 0; }
  #locate { grid-column: 1 / -1; }
  #glowstick-actions { bottom: max(150px, calc(env(safe-area-inset-bottom) + 150px)); }
  #selection { left: max(8px, env(safe-area-inset-left)); right: max(8px, env(safe-area-inset-right)); bottom: max(8px, env(safe-area-inset-bottom)); width: auto !important; max-width: none; transform: none; }
  .selection-actions { flex-shrink: 1; }
}

#stage-status { margin: 0; color: #ffb9b9; font-size: 11px; line-height: 1.4; }
#stage-status:empty { display: none; }

#streamers-status { position: fixed; z-index: 6; top: max(108px, calc(env(safe-area-inset-top) + 96px)); left: 50%; transform: translateX(-50%); width: max-content; max-width: calc(100% - 24px); padding: 10px 16px; border-radius: 12px; font-size: 13px; text-align: center; pointer-events: none; }