/* Celestial Dial — base styles (ported from the CelestialDial design helmet block) */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
html, body { margin: 0; padding: 0; }
body {
  background: #221A2E;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: #805FBF; color: #fff; }

@keyframes asterTwinkle {
  0%, 100% { opacity: .2; transform: scale(.85); }
  50%      { opacity: .95; transform: scale(1); }
}

/* Responsive layout (design's data-r breakpoints) */
@media (max-width: 880px) {
  [data-r="hero"]    { grid-template-columns: 1fr !important; gap: 34px !important; padding: 48px 24px 56px !important; }
  [data-r="hero-h1"] { font-size: 40px !important; }
  [data-r="phone"]   { margin: 0 auto !important; }
  [data-r="dial"]    { grid-template-columns: 1fr !important; gap: 34px !important; justify-items: center !important; text-align: center !important; padding: 60px 24px !important; }
  [data-r="grid3"]   { grid-template-columns: 1fr !important; }
  [data-r="ai3"]     { grid-template-columns: 1fr !important; gap: 18px !important; }
  [data-r="ai-line"] { display: none !important; }
  [data-r="feature"] { grid-template-columns: 1fr !important; justify-items: center !important; text-align: center !important; gap: 22px !important; padding: 32px 26px !important; }
  [data-r="why"]     { grid-template-columns: 1fr !important; gap: 34px !important; padding: 60px 24px !important; }
  [data-r="foot4"]   { grid-template-columns: 1fr 1fr !important; gap: 26px !important; }
  [data-r="navlinks"]{ display: none !important; }
  [data-r="big"]     { font-size: 31px !important; }
  [data-r="big-cta"] { font-size: 33px !important; }
}
@media (max-width: 400px) {
  [data-r="phone"] { transform: scale(.84); transform-origin: top center; }
}

/* Tweaks panel (emdash-style live editor) */
.tweaks-toggle {
  position: fixed; bottom: 18px; right: 18px; z-index: 100;
  width: 44px; height: 44px; border-radius: 50%; border: none; cursor: pointer;
  background: #221A2E; color: #805FBF; font-size: 20px; line-height: 44px;
  box-shadow: 0 6px 18px rgba(28,20,40,.4);
}
.tweaks-panel {
  position: fixed; bottom: 72px; right: 18px; z-index: 100;
  width: 232px; background: #FCF9F2; color: #221A2E;
  border: 1px solid rgba(34,26,46,.12); border-radius: 14px;
  padding: 16px; box-shadow: 0 20px 50px -20px rgba(28,20,40,.5);
  font-family: 'Hanken Grotesk', system-ui, sans-serif;
}
.tweaks-panel h4 { margin: 0 0 12px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: #8A8194; }
.tweaks-panel .swatches { display: flex; gap: 8px; margin-bottom: 16px; }
.tweaks-panel .swatch { width: 28px; height: 28px; border-radius: 50%; cursor: pointer; border: 2px solid transparent; }
.tweaks-panel .swatch.active { border-color: #221A2E; }
.tweaks-panel label { display: flex; align-items: center; justify-content: space-between; font-size: 14px; font-weight: 500; }