/* Shared XpaceOS + space identity for the common shell and inline twin. */
#topBar .xs-brand-wrap{display:inline-flex;align-items:center;gap:10px;min-width:0;flex:0 1 auto;white-space:nowrap;overflow:hidden}
#topBar .xs-brand{display:inline-flex;align-items:center;gap:8px;min-width:0;padding:0;margin:0;color:var(--xp-cyan);text-decoration:none;border-radius:4px;
  font:800 13px/1 var(--xs-font, 'Orbitron', 'Press Start 2P', ui-monospace, SFMono-Regular, Menlo, monospace);letter-spacing:.14em;text-transform:none;text-shadow:0 0 12px rgba(120,243,255,.35);background:none;border:0}
#topBar .xs-brand:hover{color:#fff}
#topBar .xs-section{color:var(--xp-muted);font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:none;overflow:hidden;text-overflow:ellipsis;min-width:0}
#topBar .xs-brand:focus-visible{outline:2px solid var(--xp-gold);outline-offset:2px}
@media (max-width:600px){#topBar .xs-brand{font-size:12px;letter-spacing:.1em}}
/* Native twin selectors: original nodes live in these two header popovers. */
#topBar:has(.topbar-picker){position:relative;z-index:600;overflow:visible}
#topBar .topbar-picker{position:relative;flex:0 1 auto;min-width:0;font:11px/1.3 monospace}
#topBar .topbar-picker summary{display:flex;align-items:center;gap:7px;list-style:none;cursor:pointer;white-space:nowrap;padding:6px 8px;border:1px solid #315766;border-radius:5px;background:#09151f;color:#dff8ff}
#topBar .topbar-picker summary::-webkit-details-marker{display:none}
#topBar .topbar-picker summary:focus-visible{outline:2px solid var(--xp-cyan);outline-offset:2px}
#topBar .topbar-picker[open] summary{border-color:#78f3ff}
#topBar .picker-label{font-size:9px;color:#91b9c7}
#topBar #xpaceActiveSpace{max-width:180px;overflow:hidden;text-overflow:ellipsis}
/* Tres combos (Carlos, 15-oct-2026): Xpacio y Local son <select> con la misma caja que Calidad. */
#topBar .topbar-combo{position:relative;display:flex;align-items:center;gap:7px;flex:0 1 auto;min-width:0;padding:0 8px;border:1px solid #315766;border-radius:5px;background:#09151f;color:#dff8ff;font:11px/1.3 monospace;white-space:nowrap;cursor:pointer}
#topBar .topbar-combo::after{content:"▾";position:absolute;right:8px;top:50%;transform:translateY(-50%);pointer-events:none}
#topBar .topbar-combo:focus-within{border-color:#78f3ff}
#topBar .topbar-combo select{-webkit-appearance:none;appearance:none;min-width:0;max-width:200px;margin:0;padding:6px 14px 6px 0;border:0;background:transparent;color:inherit;font:inherit;text-overflow:ellipsis;cursor:pointer}
#topBar .topbar-combo select:focus{outline:none}
#topBar .topbar-combo select:disabled{opacity:.55;cursor:default}
#topBar .topbar-combo option{background:#09151f;color:#dff8ff}
/* En la barra común de las páginas de un local (assets/xpace-combos.mjs) los combos dicen ya dónde estás: fuera el rótulo de sección. */
#topBar.xs-bar:has(.xpace-combos) .xs-section{display:none}
#topBar.xs-bar .xpace-combos .topbar-combo{height:30px;box-sizing:border-box}
#topBar.xs-bar .xpace-combos .topbar-combo:not([data-combo="local"]){flex:0 0 auto}
#topBar.xs-bar .xpace-combos .topbar-combo[data-combo="local"]{flex:0 1 auto;min-width:0}
#topBar.xs-bar .xpace-combos .topbar-combo[data-combo="local"] select{min-width:0;width:100%}
#topBar .topbar-picker>.expert-menu-group{position:absolute;top:calc(100% + 8px);left:0;width:270px;max-width:calc(100vw - 20px);max-height:calc(100dvh - 64px);overflow:auto;box-sizing:border-box;padding:14px;background:#07151ff7;border:1px solid #315766;border-radius:6px;box-shadow:0 12px 30px #0009;color:#dff8ff;white-space:normal}
#topBar .topbar-picker:not([open])>.expert-menu-group{display:none}
#topBar .topbar-picker h2{font:700 10px/1.4 monospace;letter-spacing:.08em;margin:0 0 10px;color:#78f3ff}
#topBar .topbar-picker select{width:100%;padding:7px;border:1px solid #416978;background:#09151f;color:#d9f6ff;font:11px monospace}
#topBar .topbar-picker button{height:auto;min-height:30px;border:1px solid #315766;border-radius:4px;font:11px/1.4 monospace;text-transform:none;padding:7px;white-space:normal}
#topBar #visualQualityOptions .visual-tier-controls{display:flex;flex-direction:column;gap:5px}
#topBar #visualQualityOptions button{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:2px;color:#d9f6ff;background:#10232e}
#topBar #visualQualityOptions small{font-size:9px;color:#91b9c7}
#topBar #visualQualityOptions button[aria-pressed=true]{border-color:#66d8ac;background:#12322d;box-shadow:inset 2px 0 #66d8ac}
#topBar #visualQualityOptions button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:680px){#topBar:has(.topbar-picker){gap:5px;padding:0 6px}#topBar .picker-label{display:none}#topBar .topbar-picker summary{gap:4px;padding:6px}#topBar #xpaceActiveSpace{max-width:100px}#topBar .topbar-combo{gap:4px;padding:0 6px}#topBar .topbar-combo select{max-width:96px}#topBar:has(.topbar-picker) #pfToggles{position:static;margin:0;padding:0;background:none}#topBar .topbar-picker>.expert-menu-group{position:fixed;top:48px;left:10px}#topBar .xs-brand{font-size:11px}}

#topBar .topbar-picker [hidden]{display:none!important}

#topBar .topbar-picker a{color:#9ae3e8}