.sim-stage { position: relative; width: 100%; height: calc(100vh - 64px); margin-top: 64px; min-height: 540px; background: #0a1622; }
    #sim-map { position: absolute; inset: 0; }
    .sim-panel { position: absolute; top: 1rem; left: 1rem; z-index: 5; width: 304px; max-width: calc(100% - 2rem); background: rgba(10,22,34,0.9); backdrop-filter: blur(10px); border: 1px solid rgba(0,148,191,0.3); border-radius: 12px; padding: 1rem 1.15rem; color: #fff; max-height: calc(100% - 2rem); overflow-y: auto; }
    .sim-top { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
    .sim-panel .brand { font-family: var(--serif); font-size: 1.2rem; line-height: 1.2; }
    .sim-panel .brand b { color: #0094BF; font-weight: 400; }
    .sim-panel .brand .brand-sub { display: block; font-style: italic; }
    .live-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #ff4d4d; margin-right: 0.35rem; box-shadow: 0 0 0 0 rgba(255,77,77,0.6); animation: livepulse 1.8s infinite; vertical-align: middle; }
    @keyframes livepulse { 0% { box-shadow: 0 0 0 0 rgba(255,77,77,0.55); } 70% { box-shadow: 0 0 0 7px rgba(255,77,77,0); } 100% { box-shadow: 0 0 0 0 rgba(255,77,77,0); } }
    .units { display: inline-flex; border: 1px solid rgba(255,255,255,0.25); border-radius: 6px; overflow: hidden; }
    .units button { background: transparent; color: rgba(255,255,255,0.7); border: none; padding: 0.2rem 0.55rem; font-size: 0.72rem; font-weight: 700; cursor: pointer; }
    .units button.on { background: var(--teal); color: #fff; }
    .sim-top-actions { display: flex; align-items: center; gap: 0.35rem; flex: 0 0 auto; }
    .units { flex: 0 0 auto; }
    .sim-collapse { background: transparent; border: none; color: rgba(255,255,255,0.72); font-size: 0.9rem; line-height: 1; cursor: pointer; padding: 0.25rem 0.4rem; border-radius: 6px; flex: 0 0 auto; }
    .sim-collapse:hover { background: rgba(255,255,255,0.14); color: #fff; }
    .sim-reopen { position: absolute; top: 1rem; left: 1rem; z-index: 6; display: none; align-items: center; gap: 0.4rem; background: rgba(10,22,34,0.9); backdrop-filter: blur(10px); border: 1px solid rgba(0,148,191,0.3); border-radius: 10px; padding: 0.5rem 0.85rem; color: #fff; font-family: var(--serif); font-size: 1rem; cursor: pointer; }
    .sim-reopen b { color: #0094BF; font-weight: 400; }
    /* Collapse/reopen carets: an inline SVG chevron (currentColor stroke) rather than a
       Unicode triangle, so it stays crisp and perfectly symmetric at any size with no
       font-fallback risk. The collapse (up) one is the same chevron flipped 180°. */
    .sim-collapse .sim-caret, .sim-reopen .sim-caret { display: inline-block; width: 1.2rem; height: 1.2rem; vertical-align: middle; color: rgba(255,255,255,0.75); }
    .sim-collapse .sim-caret { transform: rotate(180deg); }
    /* Collapsed reopen pill mirrors the panel header: SimStorm™ over the tracker name. */
    .sim-reopen .reopen-brand { display: block; line-height: 1.15; }
    .sim-reopen .brand-sub { display: block; font-style: italic; }
    .sim-stage.panel-collapsed .sim-panel { display: none; }
    .sim-stage.panel-collapsed .sim-reopen { display: inline-flex; }
    .sim-panel select { width: 100%; margin-top: 0.85rem; background: #102a47; color: #fff; border: 1px solid rgba(255,255,255,0.25); border-radius: 7px; padding: 0.5rem 0.6rem; font-family: var(--sans); font-size: 0.92rem; }
    #sim-info { font-size: 0.85rem; color: rgba(255,255,255,0.72); margin-top: 0.75rem; }
    #sim-info .nm { font-family: var(--serif); font-size: 1.35rem; color: #fff; line-height: 1.2; }
    #sim-info .cls { font-weight: 700; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; margin: 0.15rem 0 0.6rem; }
    #sim-info .line { line-height: 1.75; }
    #sim-info .line b { color: #fff; font-weight: 600; }
    #sim-info .adv { margin-top: 0.65rem; color: rgba(255,255,255,0.6); font-size: 0.77rem; }
    #sim-info .adv button { background: transparent; border: 1px solid rgba(255,255,255,0.25); color: rgba(255,255,255,0.8); border-radius: 5px; font-size: 0.7rem; padding: 0.1rem 0.4rem; cursor: pointer; margin-left: 0.3rem; }
    .sim-panel .hint { font-size: 0.79rem; color: rgba(255,255,255,0.72); line-height: 1.5; margin: 0.7rem 0 0; }
    .sim-panel .hint a { color: #34c3e8; }
    .sim-official { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.6rem; }
    .sim-official a { font-size: 0.75rem; font-weight: 600; color: #eaf6ff; text-decoration: none; background: rgba(0,148,191,0.22); border: 1px solid rgba(0,148,191,0.4); border-radius: 7px; padding: 0.32rem 0.55rem; }
    .sim-official a:hover { background: rgba(0,148,191,0.4); }
    .sim-legend { display: flex; flex-wrap: wrap; gap: 0.45rem 0.85rem; margin-top: 0.85rem; }
    .sim-legend span { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.73rem; color: rgba(255,255,255,0.85); }
    .sim-legend i { width: 11px; height: 11px; border-radius: 50%; border: 1.5px solid #0b1d33; }
    .empty { text-align: center; padding: 0.4rem 0.2rem; color: #cfe9ff; }
    .empty .big { font-size: 1.8rem; }
    .empty p { font-size: 0.85rem; line-height: 1.55; margin: 0.5rem 0; color: rgba(255,255,255,0.82); }
    .empty a { color: #34c3e8; }

/* Keep the map unobstructed: the tracker uses the main workspace's panel frame. */
.sim-stage { display: flex; height: calc(100dvh - 64px); min-height: 440px; }
#sim-map { left: 352px; }
.sim-panel { position: relative; top: auto; left: auto; width: 352px; max-width: none; flex: 0 0 352px; max-height: none; height: 100%; border: 0; border-right: 1px solid #2b4353; border-radius: 0; background: #0d1e2b; padding: 24px 20px; backdrop-filter: none; }
.sim-stage.panel-collapsed #sim-map { left: 0; }
.sim-panel .brand { font-family: var(--sans); font-weight: 600; font-size: 22px; }
.sim-panel .brand .brand-sub { font-size: 15px; color: #a7c5d5; font-style: normal; margin-top: 7px; }
.live-dot { width: 6px; height: 6px; background: #56c5b1; animation: none; box-shadow: none; }
.feed-stale .live-dot { background: #ffc16a; }
.feed-toolbar { display: flex; align-items: flex-start; gap: 10px; margin: 22px 0 12px; font-size: 12px; color: #9ab9c9; line-height: 1.5; }
#feed-status { flex: 1; }
.feed-stale #feed-status, .product-note { color: #ffd097; }
.feed-toolbar button, .map-actions button { border: 1px solid #3a5b6c; border-radius: 6px; background: #173444; color: #d9edf5; font: 600 13px var(--sans); padding: 7px 10px; cursor: pointer; }
button:disabled { opacity: .5; cursor: wait; }
.filter-row { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.filter-row label { font-size: 13px; color: #a9c4d3; }
.sim-panel select { font-size: 14px; background: #112b3b; border-color: #365364; margin-top: 6px; }
#sim-storm { margin-top: 13px; }
#sim-info { padding: 19px 0; margin-top: 12px; border-top: 1px solid #294352; border-bottom: 1px solid #294352; font-size: 14px; }
#sim-info .nm { font-family: var(--sans); font-size: 30px; font-weight: 600; letter-spacing: -.5px; }
#sim-info .cls { font-size: 12px; line-height: 1.6; margin-bottom: 14px; }
#sim-info .line { line-height: 1.9; }
#sim-info .adv { font-size: 13px; line-height: 1.5; }
.sim-panel .hint { font-size: 13px; color: #9eb9c8; line-height: 1.6; }
.sim-official a { font-size: 13px; }
.map-actions { display: flex; gap: 12px; align-items: center; margin: 16px 0; font-size: 13px; color: #bed6e2; }
.map-actions label { display: flex; align-items: center; gap: 3px; }
input { accent-color: #35c6e8; }
.track-key { display: flex; flex-wrap: wrap; gap: 8px 15px; font-size: 12px; color: #bed6e2; padding-top: 14px; }
.sim-legend span { font-size: 12px; }
.empty { text-align: left; padding: 0; }
.units button { font-size: 13px; padding: 5px 8px; }
button:focus-visible, select:focus-visible, a:focus-visible, input:focus-visible { outline: 2px solid #58d1e1; outline-offset: 3px; }
[hidden] { display: none !important; }
@media(max-width: 760px) { .sim-stage { flex-direction: column; } .sim-panel { width: 100%; height: 42%; flex: 0 0 42%; border-right: 0; border-bottom: 1px solid #294352; padding: 16px 20px; } #sim-map { left: 0; top: 42%; } .sim-stage.panel-collapsed #sim-map { top: 0; } .sim-reopen { top: 12px; left: 12px; } }
@media(prefers-reduced-motion: reduce) { .live-dot { animation: none; } }