/* Offline event demo chrome. The label stays visible on every demo screen. */
.demo-banner{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px 14px;margin:10px 0 4px;padding:10px 14px;border:1px solid color-mix(in srgb,var(--yellow) 55%,transparent);border-radius:14px;color:var(--text);background:color-mix(in srgb,var(--yellow) 14%,var(--surface))}
.demo-banner[hidden]{display:none}
.demo-pill{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:99px;color:#2a1d00;background:var(--yellow);font-size:.8rem;font-weight:850;white-space:nowrap}
.demo-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.demo-copy{margin:0;color:var(--secondary);font-size:.82rem;line-height:1.35}
.demo-actions{display:flex;gap:8px}
.demo-actions button{min-height:38px;padding:0 14px;white-space:nowrap}
.demo-status{grid-column:1/-1;margin:0;color:var(--text);font-size:.82rem;font-weight:700}
.demo-status:empty{display:none}
body.demo-active dialog[open]::before{content:"Demo • Simulated data · Everything shown is simulated, including every reading and card value · Changes stay on this device and don’t sync";position:sticky;top:0;z-index:5;display:block;padding:6px 20px;color:#2a1d00;background:var(--yellow);font-size:.74rem;font-weight:850;letter-spacing:.04em}
.demo-entry{display:grid;gap:8px;margin-top:18px;padding:14px;border:1px dashed color-mix(in srgb,var(--yellow) 60%,transparent);border-radius:14px}
.demo-entry strong{font-size:.95rem}
.demo-entry .field-help{margin:0}
.demo-entry .primary-button{width:100%}
.demo-settings{display:grid;gap:10px;margin:0 0 18px;padding:14px;border:1px solid color-mix(in srgb,var(--yellow) 45%,transparent);border-radius:14px}
.demo-settings h3{margin:0}
.demo-settings .field-help{margin:0}
.demo-settings .primary-button{margin-top:0}
.demo-banner>*{min-width:0}
@media(max-width:760px){
  .demo-banner{grid-template-columns:1fr;gap:8px;padding:10px 12px}
  .demo-pill{justify-self:start}
  .demo-actions button{flex:1;min-height:38px;padding:0 10px}
}
