/* Release indicator (sidebar footer and the phone More menu). Uses the Enterprise Hybrid tokens; the sidebar is navy in every theme. */
.verbox { margin: 0 0 10px; font-size: 11.5px; line-height: 1.35; color: #A9C3D5; min-width: 0; }
.verbox .verprod { display: block; font-size: 11px; letter-spacing: .02em; color: #7F9DB2; font-weight: 700; }
.verbox .verline { display: block; margin-top: 2px; color: #BCD2E1; }
.verbox button.vertoggle { all: unset; box-sizing: border-box; display: grid; gap: 3px; width: 100%; padding: 8px 10px; border-radius: var(--r-sm); background: rgba(255, 255, 255, .05); cursor: pointer; position: relative; }
.verbox button.vertoggle:hover { background: rgba(255, 255, 255, .10); }
.verbox button.vertoggle:focus-visible { outline: 2px solid var(--cyan); outline-offset: 1px; }
.verbox .verrel { color: #E3EDF4; font-size: 12.5px; }
.verbox .verrel b { font-weight: 700; color: #fff; }
.verbox .verenv { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.verbox .verbuild { color: #A9C3D5; font-variant-numeric: tabular-nums; }
.verbox .verflag { font-size: 10.5px; font-weight: 800; letter-spacing: .07em; padding: 1px 7px; border-radius: 999px; border: 1px solid; }
.verbox .verflag.staging { background: #FFF1D6; color: #6B4300; border-color: #EBCB7A; }
.verbox .verflag.production { background: #FCE6E9; color: #8F1F2E; border-color: #E8A5AE; }
.verbox .verflag.local { background: #E3F4EC; color: #14532D; border-color: #9BD3B8; }
.verbox .verchev { position: absolute; right: 10px; top: 8px; color: #7F9DB2; font-size: 11px; }
.verbox .verdetail { margin-top: 6px; padding: 8px 10px; border-radius: var(--r-sm); background: rgba(0, 0, 0, .22); }
.verbox .verdetail dl { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 3px 10px; }
.verbox .verdetail dt { color: #7F9DB2; }
.verbox .verdetail dd { margin: 0; color: #E3EDF4; overflow-wrap: anywhere; }
.verbox .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 10.5px; }
.verbox .verstale { margin-top: 6px; color: #FFE7A8; }
.verbox .verstale button, .updtoast button { all: unset; cursor: pointer; text-decoration: underline; font-weight: 700; }
.verbox .verstale button:focus-visible, .updtoast button:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
/* compact sidebar: only the environment and build stay visible */
body.navmini .verbox .verprod, body.navmini .verbox .verrel, body.navmini .verbox .verbuild, body.navmini .verbox .verchev, body.navmini .verbox .verdetail, body.navmini .verbox .verline { display: none; }
body.navmini .verbox button.vertoggle { padding: 6px 0; justify-items: center; background: none; }
body.navmini .verbox .verflag { font-size: 9px; padding: 1px 4px; letter-spacing: 0; }
@media (max-width: 1100px) and (min-width: 721px) { .verbox .verprod, .verbox .verrel, .verbox .verbuild, .verbox .verchev, .verbox .verdetail, .verbox .verline { display: none; } .verbox button.vertoggle { padding: 6px 0; justify-items: center; background: none; } .verbox .verflag { font-size: 9px; padding: 1px 4px; letter-spacing: 0; } }
/* discreet update notice */
.updtoast { position: fixed; right: 16px; bottom: 16px; z-index: 60; display: flex; align-items: center; gap: 10px; max-width: calc(100vw - 32px); padding: 9px 12px; border-radius: var(--r-md); background: var(--card); color: var(--ink); border: 1px solid var(--line); box-shadow: 0 6px 20px rgba(16, 42, 67, .18); font-size: 13px; }
.updtoast button { color: var(--navy-700); }
:root[data-theme="dark"] .updtoast button { color: var(--cyan); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .updtoast button { color: var(--cyan); } }
.updtoast .x { text-decoration: none; font-size: 16px; line-height: 1; color: var(--muted); }
@media (max-width: 720px) { .updtoast { bottom: calc(68px + env(safe-area-inset-bottom, 0px)); right: 12px; left: 12px; } }
