#smoke {
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  transform: none !important;
  pointer-events: none !important;
}

.wrap {
  position: relative;
  z-index: 1;
}

body > .foot {
  position: fixed !important;
  z-index: 20 !important;
  right: 0;
  bottom: max(18px, env(safe-area-inset-bottom));
  left: 0;
}

/* Auth dialogs must always be positioned against the viewport. */
body > .login-modal {
  position: fixed !important;
}

.smoke-settings {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1000;
  width: 286px;
  max-height: min(72vh, 680px);
  overflow: auto;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 15px;
  background: rgba(8,8,11,.74);
  backdrop-filter: blur(18px);
  color: rgba(255,255,255,.68);
  font: 12px/1.3 Inter, ui-sans-serif, sans-serif;
  transition: width .22s ease, border-radius .22s ease, background .22s ease;
}
.smoke-settings:not([open]) {
  width: 44px;
  height: 44px;
  overflow: hidden;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.smoke-settings summary { display: grid; place-items: center; min-height: 48px; padding: 10px 14px; cursor: pointer; list-style: none; color: rgba(255,255,255,.82); }
.smoke-settings summary::-webkit-details-marker { display: none; }
.smoke-settings[open] summary::after { content: 'SMOKE CONTROLS'; color: rgba(255,255,255,.82); font-size: 11px; letter-spacing: .16em; }
.smoke-settings[open] .smoke-icon { display: none; }
.smoke-icon { display: block; width: 31px; height: 31px; overflow: visible; filter: drop-shadow(0 0 6px rgba(255,255,255,.1)); }
.smoke-icon path { fill: none; stroke: rgba(244,244,246,.86); stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; }
.smoke-control-list { padding: 4px 14px 14px; border-top: 1px solid rgba(255,255,255,.09); }
.smoke-group { margin: 14px 0 2px; color: rgba(255,255,255,.34); font-size: 9px; letter-spacing: .18em; text-transform: uppercase; }
.smoke-control { display: grid; grid-template-columns: 78px 1fr 34px; align-items: center; gap: 8px; margin-top: 10px; }
.smoke-control output { text-align: right; color: rgba(255,255,255,.48); font-variant-numeric: tabular-nums; }
.smoke-control input { width: 100%; accent-color: #d8d5de; }
.smoke-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 16px; }
.smoke-actions button { height: 34px; border: 1px solid rgba(255,255,255,.09); border-radius: 9px; background: rgba(255,255,255,.04); color: rgba(255,255,255,.72); cursor: pointer; }
@media (max-width: 760px) {
  .smoke-settings { right: 14px; bottom: max(14px, env(safe-area-inset-bottom)); }
  .smoke-settings[open] { width: min(286px, calc(100vw - 28px)); max-height: min(60svh, 620px); }
}