/* ─────────────────────────────────────────────
   DEMO CREDIT — fixed left-edge label
   Subtle vertical pill crediting Quantiz.
─────────────────────────────────────────────  */
.demo-credit {
  position:fixed;
  left:8px;
  top:50%;
  z-index:90;
  writing-mode:vertical-rl;
  transform:translateY(-50%) rotate(180deg);
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:600;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:var(--ink);
  background:rgba(255,255,255,.78);
  -webkit-backdrop-filter:blur(8px) saturate(1.2);
  backdrop-filter:blur(8px) saturate(1.2);
  border:1px solid var(--line);
  border-radius:7px;
  padding:11px 5px;
  box-shadow: 0 2px 10px rgba(21,21,26,.06);
  text-decoration:none;
  white-space:nowrap;
  opacity:.72;
  transition:opacity .2s, background .2s, border-color .2s;
  display:inline-flex;
  align-items:center;
  gap:9px;
  pointer-events:auto;
}
.demo-credit:hover,
.demo-credit:focus-visible {
  opacity:1;
  background:var(--white);
  border-color:var(--ink);
  outline:none;
}
.demo-credit:focus-visible {
  box-shadow: 0 0 0 2px var(--orange);
}
.demo-credit-dot {
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--orange);
  flex-shrink:0;
  box-shadow: 0 0 0 1.5px var(--ink);
}
.demo-credit-brand {
  color:var(--orange-d);
  font-weight:700;
}

/* Mobile — switch to compact horizontal pill at bottom-left,
   well clear of chat launcher (bottom-right) */
@media (max-width:640px) {
  .demo-credit {
    writing-mode:horizontal-tb;
    transform:none;
    top:auto;
    bottom:14px;
    left:14px;
    font-size:9px;
    letter-spacing:1.2px;
    padding:6px 9px 6px 8px;
    border-radius:999px;
    opacity:.78;
    max-width:calc(100vw - 28px);
    white-space:nowrap;
  }
  .demo-credit-dot { width:5px; height:5px }
  .demo-credit-ext { display:none }
}

/* Very small viewport — keep visible but trim */
@media (max-width:380px) {
  .demo-credit {
    font-size:8.5px;
    letter-spacing:1px;
    padding:5px 8px 5px 7px;
    gap:6px;
  }
}

/* Hide gracefully if very short viewport (would overflow chat launcher area) */
@media (max-height:520px) {
  .demo-credit { display:none }
}

/* Print: hide */
@media print { .demo-credit { display:none } }