.wheel-frame{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  margin-bottom:var(--space-7);
}

.wheel-noscript-fallback{
  font-size:var(--text-sm);color:var(--text-secondary);
  padding:var(--space-4) var(--space-5);
  border-left:3px solid var(--accent);
  background:var(--bg-subtle);
  margin-top:var(--space-4);
}

.wheel-actions{
  display:flex;
  gap:var(--space-3);
  justify-content:flex-end;
  padding:var(--space-2) var(--space-3) 0;
  align-self:stretch;
}
@media (min-width:1080px){
  .wheel-actions{
    position:absolute;
    top:var(--space-2);
    right:var(--space-2);
    z-index:2;
    padding:0;
  }
}
.wheel-frame .wheel-action-btn{background:var(--bg)}
.wheel-action-btn{
  width:36px;height:36px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--border);
  background:transparent;
  color:var(--text-secondary);
  border-radius:50%;
  font-family:var(--font-display);
  cursor:pointer;
  transition:color var(--transition),border-color var(--transition);
  -webkit-tap-highlight-color:transparent;
}
@media (hover:hover){
  .wheel-action-btn:hover{color:var(--accent);border-color:var(--accent)}
}
.wheel-action-btn:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}
.wheel-action-btn--gear{font-family:'AstroSymbols','Segoe UI Symbol','Apple Symbols','Noto Sans Symbols2','Symbola',serif;font-variant-emoji:text;font-size:var(--text-base)}
.wheel-action-btn--hint{font-size:var(--text-lg);font-weight:600}
@media (pointer:coarse){
  .wheel-action-btn{min-width:44px;min-height:44px;width:44px;height:44px}
}

.wheel-glyph-tooltip{
  position:absolute;
  z-index:10;
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius-sm, 6px);
  padding:var(--space-2) var(--space-3);
  font-size:var(--text-sm);
  color:var(--text-primary);
  box-shadow:var(--shadow);
  pointer-events:none;
  white-space:nowrap;
  left:var(--tooltip-x, 0);
  top:var(--tooltip-y, 0);
  transform:translate(-50%, calc(-100% - 8px));
  opacity:0;
  transition:opacity 0.15s;
}
.wheel-glyph-tooltip.is-visible{opacity:1}
.wheel-glyph-tooltip[hidden]{display:none}
.wheel-glyph-tooltip--below{
  transform:translate(-50%, calc(100% + 8px));
}

.wheel-sheet{
  position:fixed;
  left:0;right:0;bottom:0;
  background:var(--bg-elevated);
  border-top:1px solid var(--border);
  box-shadow:var(--shadow-lg);
  padding:var(--space-5) var(--space-6) calc(var(--space-6) + env(safe-area-inset-bottom, 0px));
  transform:translateY(100%);
  transition:transform 0.25s cubic-bezier(0.4,0,0.2,1), visibility 0s linear 0.25s;
  z-index:1100;
  max-height:50vh;
  max-height:50dvh;
  overflow-y:auto;
  overscroll-behavior:contain;
  visibility:hidden;
  -webkit-tap-highlight-color:transparent;
}
.wheel-sheet.is-open{transform:translateY(0);visibility:visible;transition:transform 0.25s cubic-bezier(0.4,0,0.2,1), visibility 0s}
.wheel-sheet__handle{
  width:40px;height:4px;border-radius:2px;
  background:var(--border);
  margin:0 auto var(--space-3);
}
.wheel-sheet__close{
  position:absolute;
  top:var(--space-3);right:var(--space-3);
  width:36px;height:36px;
  background:transparent;
  border:none;
  font-size:var(--text-xl);
  color:var(--text-tertiary);
  cursor:pointer;
  border-radius:50%;
}
@media (hover:hover){
  .wheel-sheet__close:hover{color:var(--accent)}
}
.wheel-sheet__close:focus-visible{color:var(--accent);outline:2px solid var(--accent);outline-offset:2px}
.wheel-sheet__title{
  font-family:var(--font-display);
  font-size:var(--text-2xl);
  color:var(--text-primary);
  margin-bottom:var(--space-2);
  display:flex;align-items:baseline;gap:var(--space-3);
}
.wheel-sheet__glyph{
  font-family:'AstroSymbols','Segoe UI Symbol','Apple Symbols','Noto Sans Symbols2','Symbola',serif;
  font-variant-emoji:text;
  font-size:2rem;
  color:var(--accent);
}
.wheel-sheet__retro{
  font-style:italic;
  font-weight:600;
  color:var(--accent);
  font-size:var(--text-base);
}
.wheel-sheet__pos{
  font-family:var(--font-body);
  font-size:var(--text-base);
  color:var(--text-secondary);
  margin-bottom:var(--space-2);
}
.wheel-sheet__house{
  font-family:var(--font-body);
  font-size:var(--text-sm);
  color:var(--text-tertiary);
  letter-spacing:0.05em;
  text-transform:uppercase;
}
.wheel-sheet__legend{
  margin-top:var(--space-5);
}
.wheel-sheet__legend-group{margin-top:var(--space-4)}
.wheel-sheet__legend-title{
  font-family:var(--font-display);font-size:var(--text-base);font-weight:600;
  color:var(--text-primary);margin:0 0 var(--space-2);
}
.wheel-sheet__legend-list{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:var(--space-1) var(--space-3);
}
.wheel-sheet__legend-item{
  display:flex;align-items:baseline;gap:var(--space-2);
  font-size:var(--text-sm);color:var(--text-secondary);
}
.wheel-sheet__legend-sym{
  font-family:'AstroSymbols','Segoe UI Symbol','Apple Symbols','Noto Sans Symbols2','Symbola',serif;font-size:var(--text-lg);
  color:var(--accent);min-width:1.5em;text-align:center;
}
.wheel-sheet__note{
  margin-top:var(--space-4);font-size:var(--text-xs);
  color:var(--text-tertiary);font-style:italic;line-height:1.5;
}
@media (max-width:600px){
  .wheel-sheet__legend-list{grid-template-columns:1fr}
}
.wheel-sheet__overlay{
  position:fixed;inset:0;
  background:rgba(0,0,0,0.35);
  opacity:0;
  visibility:hidden;
  transition:opacity 0.25s,visibility 0.25s;
  z-index:1099;
}
.wheel-sheet__overlay.is-open{opacity:1;visibility:visible}

@media (min-width:601px){
  .wheel-sheet--popover{
    position:fixed;
    top:var(--popover-top, 80px);
    right:var(--popover-right, 24px);
    left:auto;
    bottom:auto;
    width:320px;
    max-height:min(60vh, 480px);
    border:1px solid var(--border);
    border-radius:var(--radius);
    box-shadow:var(--shadow-lg);
    transform:none;
    transition:none;
    padding:var(--space-5);
    z-index:50;
    overflow-y:auto;
  }
  .wheel-sheet--popover.is-open{transform:none;visibility:visible;transition:none}
  .wheel-sheet--popover:not(.is-open){visibility:hidden;pointer-events:none}
  .wheel-sheet--popover::before{
    content:'';
    position:absolute;
    top:-6px;
    right:14px;
    width:0;height:0;
    border-left:6px solid transparent;
    border-right:6px solid transparent;
    border-bottom:6px solid var(--bg-elevated);
    filter:drop-shadow(0 -1px 0 var(--border));
  }
  .wheel-sheet--popover-mode .wheel-sheet__overlay,
  .wheel-sheet--popover .wheel-sheet__handle{display:none}
  .wheel-sheet--popover-mode .wheel-sheet{transition:none !important}
  .wheel-sheet--popover.wheel-sheet--hint{
    width:420px;
    max-height:min(50vh, 400px);
    scrollbar-width:thin;
    scrollbar-color:var(--border) transparent;
  }
  .wheel-sheet--popover.wheel-sheet--hint::-webkit-scrollbar{width:6px}
  .wheel-sheet--popover.wheel-sheet--hint::-webkit-scrollbar-thumb{
    background:var(--border);
    border-radius:3px;
  }
  .wheel-sheet--popover.wheel-sheet--hint::-webkit-scrollbar-track{background:transparent}
  .wheel-sheet--popover.wheel-sheet--multi{
    width:480px;
    max-height:min(50vh, 480px);
    scrollbar-width:thin;
    scrollbar-color:var(--border) transparent;
  }
  .wheel-sheet--popover.wheel-sheet--multi::-webkit-scrollbar{width:6px}
  .wheel-sheet--popover.wheel-sheet--multi::-webkit-scrollbar-thumb{
    background:var(--border);
    border-radius:3px;
  }
  .wheel-sheet--popover.wheel-sheet--multi::-webkit-scrollbar-track{background:transparent}
}
.wheel-svg{
  width:100%;
  height:auto;
  display:block;

  --wh-stroke:    #bfb099;
  --wh-glyph:     #a0432e;
  --wh-cusp:      #a89880;
  --wh-anchor:    #8a7a68;
  --wh-conn:      #7d6f54;
  --wh-planet:    #2b1d12;
  --wh-planet-bg: #f5ecdc;

  --wh-sign-size: 32;
  --wh-planet-size: 28;
  --wh-house-size: 21;
  --wh-retro-size: 18;
  --wh-angle-label-size: 21;
  --wh-aspect-tight: 2;
  --wh-aspect-mid: 1.5;
  --wh-aspect-wide: 1;
  --wh-focus-stroke: 3;

  --wh-num: #4a3a2a;

  --wh-tick: #8a7a62;

  --wh-el-fire:  #c25a2a;
  --wh-el-earth: #5a7a32;
  --wh-el-air:   #a08222;
  --wh-el-water: #2a5078;

  --wh-fire:  rgba(194,90,42,0.13);
  --wh-earth: rgba(90,122,50,0.13);
  --wh-air:   rgba(160,130,34,0.13);
  --wh-water: rgba(42,80,120,0.13);
}
[data-theme="dark"] .wheel-svg{
  --wh-stroke:    #4a3e30;
  --wh-glyph:     #e08868;
  --wh-cusp:      #5a4e40;
  --wh-anchor:    #8a7860;
  --wh-conn:      #9b8a70;
  --wh-planet:    #e0d4c0;
  --wh-planet-bg: #1a1410;

  --wh-num: #d4c8b4;
  --wh-tick: #6a5e50;

  --wh-el-fire:  #e08840;
  --wh-el-earth: #92b865;
  --wh-el-air:   #d8b35a;
  --wh-el-water: #6a9bd0;

  --wh-fire:  rgba(224,136,64,0.15);
  --wh-earth: rgba(146,184,101,0.14);
  --wh-air:   rgba(216,179,90,0.14);
  --wh-water: rgba(106,155,208,0.15);
}

.wheel-svg text{
  font-variant-emoji:text;
  font-feature-settings:"liga" off;
  user-select:none;
}

.sign-fire{fill:var(--wh-fire)}
.sign-earth{fill:var(--wh-earth)}
.sign-air{fill:var(--wh-air)}
.sign-water{fill:var(--wh-water)}

.zodiac-divider{stroke:var(--wh-stroke);stroke-width:1.6;fill:none;vector-effect:non-scaling-stroke}
.zodiac-outer{stroke:var(--wh-stroke);stroke-width:1.4;fill:none;vector-effect:non-scaling-stroke}
.zodiac-inner{stroke:var(--wh-stroke);stroke-width:1.2;fill:none;vector-effect:non-scaling-stroke}

.tick-1{stroke:var(--wh-tick);stroke-width:0.6;opacity:0.45;vector-effect:non-scaling-stroke;display:none}
.tick-5{stroke:var(--wh-tick);stroke-width:1.2;vector-effect:non-scaling-stroke}
.tick-10{stroke:var(--wh-tick);stroke-width:2;vector-effect:non-scaling-stroke}

.sign-glyph--fire,
.cusp-sign-glyph.sign-glyph--fire   { color: var(--wh-el-fire); }
.sign-glyph--earth,
.cusp-sign-glyph.sign-glyph--earth  { color: var(--wh-el-earth); }
.sign-glyph--air,
.cusp-sign-glyph.sign-glyph--air    { color: var(--wh-el-air); }
.sign-glyph--water,
.cusp-sign-glyph.sign-glyph--water  { color: var(--wh-el-water); }

.sign-glyph-group{cursor:pointer;-webkit-tap-highlight-color:transparent}
@media (hover:hover){
  .sign-glyph-group:hover .sign-glyph{filter:brightness(0.85)}
}
.sign-glyph-group:focus{outline:none}
.sign-glyph-group:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}

.sign-glyph{
  color:var(--wh-glyph);
}
.zodiac-symbol-path{
  fill:currentColor;
  stroke:var(--zodiac-path-stroke, none);
  stroke-width:var(--zodiac-path-stroke-width, 0);
  stroke-linejoin:round;
  paint-order:stroke fill;
  vector-effect:non-scaling-stroke;
}

.house-cusp-line{stroke:var(--wh-cusp);stroke-width:0.7;opacity:0.6;vector-effect:non-scaling-stroke}
.house-cusp-line--angular{stroke:var(--text-secondary);stroke-width:1.8;opacity:0.85;vector-effect:non-scaling-stroke}

.axis-center{stroke:var(--text-secondary);stroke-width:1.0;opacity:0.5;vector-effect:non-scaling-stroke;fill:none}
.house-num{
  fill:var(--wh-num);
  font-family:var(--font-display);
  font-size:calc(var(--wh-house-size) * 1px);
  font-weight:400;
  font-style:italic;
  letter-spacing:0.05em;
  text-anchor:middle;
  dominant-baseline:central;
}

.cusp-sign{cursor:pointer;-webkit-tap-highlight-color:transparent}

.cusp-stack{display:none}
.cusp-collapse{display:inline}

@media (min-width:1025px){
  .cusp-sign:not(.is-collapsed-arc) .cusp-stack{display:inline}
  .cusp-sign:not(.is-collapsed-arc) .cusp-collapse{display:none}
}

.cusp-stack__deg,
.cusp-stack__deg-min{
  fill:var(--text-secondary);
  font-family:var(--font-wheel-label, 'Inter', system-ui, sans-serif);
  font-weight:500;
  font-size:clamp(10px, 0.85vw, 14px);
  font-feature-settings:"tnum" 1;
  text-anchor:middle;
  dominant-baseline:central;
}
.cusp-stack__name{
  fill:var(--accent);
  font-family:var(--font-wheel-label, 'Inter', system-ui, sans-serif);
  font-weight:600;
  font-size:clamp(11px, 1vw, 15px);
  letter-spacing:0.06em;
  text-anchor:middle;
  dominant-baseline:central;
}
.cusp-sign--angular .cusp-stack__deg,
.cusp-sign--angular .cusp-stack__deg-min{
  fill:var(--text-secondary);
  font-weight:600;
  font-size:clamp(12px, 1.05vw, 16px);
}
.cusp-stack__sign{
  color:var(--wh-glyph);
  --path-stroke-width:1.4;
}

.cusp-sign--angular .cusp-stack__deg-min,
.cusp-sign--angular .cusp-stack__name{
  paint-order:stroke fill;
  stroke:var(--bg);
  stroke-width:3px;
  stroke-linejoin:round;
}
@media (hover:hover){
  .cusp-sign--angular[data-tooltip]:hover{filter:none}
  .cusp-sign--angular[data-tooltip]:hover .cusp-stack__name{fill:var(--accent)}
}
.cusp-sign--angular .cusp-stack__sign{
  --zodiac-path-stroke:currentColor;
  --zodiac-path-stroke-width:0.8;
  filter: drop-shadow(0 0 0.8px var(--bg)) drop-shadow(0 0 0.8px var(--bg));
}
.cusp-sign:not(.cusp-sign--angular) .cusp-stack__sign{
  --zodiac-path-stroke:currentColor;
  --zodiac-path-stroke-width:0.5;
}
.cusp-sign-glyph{
  --path-stroke-width:1.4;
}

.cusp-sign-bg{fill:var(--wh-planet-bg);stroke:none}
.cusp-sign-glyph{color:var(--text-tertiary)}
.cusp-collapse__name{
  fill:var(--accent);
  font-family:var(--font-wheel-label, 'Inter', system-ui, sans-serif);
  font-weight:600;
  font-size:13px;
  letter-spacing:0.06em;
  text-anchor:middle;
  dominant-baseline:central;
}

@media (hover:hover){
  .cusp-sign:hover .cusp-sign-bg{fill:var(--bg-subtle)}
}
.cusp-sign:focus{outline:none}
.cusp-sign:focus-visible{
  outline:calc(var(--wh-focus-stroke) * 1px) solid var(--accent);
  outline-offset:2px;
  border-radius:4px;
}
.cusp-sign:focus-visible .cusp-sign-bg{
  stroke:var(--accent);
  stroke-width:calc(var(--wh-focus-stroke) * 1px);
  vector-effect:non-scaling-stroke;
}

.angle-label{
  fill:var(--accent);
  font-family:var(--font-wheel-label, 'Inter', system-ui, -apple-system, sans-serif);
  font-size:calc(var(--wh-angle-label-size) * 1px);
  font-weight:600;
  letter-spacing:0.12em;
  text-anchor:middle;
  dominant-baseline:central;
}
.angle-sublabel{
  fill:var(--text-secondary);
  font-family:var(--font-wheel-label, 'Inter', system-ui, sans-serif);
  font-size:calc(var(--wh-angle-sublabel-size, 14) * 1px);
  font-weight:500;
  font-feature-settings:"tnum" 1;
  dominant-baseline:central;
}
.angle-marker{stroke:var(--accent);stroke-width:1.8;opacity:0.85}

.planet-ring{stroke:var(--wh-stroke);stroke-width:0.8;fill:none;opacity:0.4}
.planet-anchor{stroke:var(--wh-anchor);stroke-width:1;opacity:0.7}
.planet-leader{stroke:var(--wh-conn);stroke-width:0.7;opacity:0.7;fill:none}
.planet-glyph{
  fill:var(--wh-planet);
  font-family:'AstroSymbols','Segoe UI Symbol','Apple Symbols','Noto Sans Symbols2','Symbola',serif;
  font-size:calc(var(--wh-planet-size) * 1px);
  font-weight:500;
  text-anchor:middle;
  dominant-baseline:central;
}

.planet-glyph--sun  { fill: #806020; }
.planet-glyph--moon { fill: #5a5a65; }
.planet-glyph--mer  { fill: #6a5520; }
.planet-glyph--ven  { fill: #3a6a4a; }
.planet-glyph--mar  { fill: #7a2020; }
.planet-glyph--jup  { fill: #523a7a; }
.planet-glyph--sat  { fill: #3a3a3a; }
.planet-glyph--ura  { fill: #2a6a6a; }
.planet-glyph--nep  { fill: #3a3a7a; }
.planet-glyph--plu  { fill: #5a2a3a; }
.planet-glyph--nnode{ fill: #5e4c3a; }
.planet-glyph--snode{ fill: #7a6a55; }
.planet-glyph--chi  { fill: #5e4c3a; }
.planet-glyph--lil  { fill: #4a4a55; }

[data-theme="dark"] .planet-glyph--sun  { fill: #d4a830; }
[data-theme="dark"] .planet-glyph--moon { fill: #b0b0c0; }
[data-theme="dark"] .planet-glyph--mer  { fill: #d4c440; }
[data-theme="dark"] .planet-glyph--ven  { fill: #5a9a8a; }
[data-theme="dark"] .planet-glyph--mar  { fill: #e84a4a; }
[data-theme="dark"] .planet-glyph--jup  { fill: #a070c0; }
[data-theme="dark"] .planet-glyph--sat  { fill: #908878; }
[data-theme="dark"] .planet-glyph--ura  { fill: #4ac0c0; }
[data-theme="dark"] .planet-glyph--nep  { fill: #7080d0; }
[data-theme="dark"] .planet-glyph--plu  { fill: #b070b0; }
[data-theme="dark"] .planet-glyph--nnode{ fill: #d4c8b4; }
[data-theme="dark"] .planet-glyph--snode{ fill: #b8a890; }
[data-theme="dark"] .planet-glyph--chi  { fill: #c9b08a; }
[data-theme="dark"] .planet-glyph--lil  { fill: #a0a0b0; }
.planet-retro{
  fill:var(--accent);
  font-family:var(--font-body);
  font-size:calc(var(--wh-retro-size) * 1px);
  font-style:italic;
  font-weight:700;
  text-anchor:middle;
  dominant-baseline:central;
}
.planet-bg{fill:var(--wh-planet-bg);stroke:none}

.aspect{fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke}
.aspect--harm{stroke:var(--aspect-harmonious);stroke-dasharray:4 3}
.aspect--tense{stroke:var(--aspect-tense)}
.aspect--neutral{stroke:var(--wh-conn);opacity:0.9;stroke-dasharray:1 4}

.aspect--w-tight{stroke-width:calc(var(--wh-aspect-tight) * 1px);opacity:0.9}
.aspect--w-mid{stroke-width:calc(var(--wh-aspect-mid) * 1px);opacity:0.65}
.aspect--w-wide{stroke-width:calc(var(--wh-aspect-wide) * 1px);opacity:0.45}

.angle-aspect{stroke-dasharray:6 4 !important;opacity:0.75}

.angle-marker,
.planet-anchor,
.planet-leader,
.house-cusp-line,
.house-cusp-line--angular,
.zodiac-divider,
.zodiac-outer,
.zodiac-inner,
.planet-ring{vector-effect:non-scaling-stroke}

[data-tooltip]{cursor:pointer;-webkit-tap-highlight-color:transparent}
@media (hover:hover){
  [data-tooltip]:hover{filter:brightness(0.85)}
}
.planet:focus{outline:none}
.planet:focus-visible .planet-bg{
  stroke:var(--accent);
  stroke-width:calc(var(--wh-focus-stroke) * 1px);
  vector-effect:non-scaling-stroke;
}

.wheel-svg[data-hide-element-fills] .tier-bg__fills{display:none}
.wheel-svg[data-hide-ticks-major] .tick-5,
.wheel-svg[data-hide-ticks-major] .tick-10{display:none}
.wheel-svg[data-hide-ticks-fine] .tick-1{display:none !important}
.wheel-svg[data-hide-houses-cusps] .house-cusp-line,
.wheel-svg[data-hide-houses-cusps] .house-cusp-line--angular{display:none}
.wheel-svg[data-hide-house-numbers] .house-num{display:none}
.wheel-svg[data-hide-cusp-labels-intermediate] .cusp-sign:not(.cusp-sign--angular){display:none}
.wheel-svg[data-hide-planets-nodes] #planet-nnode,
.wheel-svg[data-hide-planets-nodes] #planet-snode{display:none}
.wheel-svg[data-hide-planets-chiron-lilith] #planet-chi,
.wheel-svg[data-hide-planets-chiron-lilith] #planet-lil{display:none}
.wheel-svg[data-hide-planets-retro-marks] .planet-retro{display:none}
.wheel-svg[data-hide-aspects-harmonious] .aspect--harm{display:none}
.wheel-svg[data-hide-aspects-tense] .aspect--tense{display:none}
.wheel-svg[data-hide-aspects-conjunction] .aspect--neutral{display:none}
.wheel-svg[data-hide-aspects-angle] .angle-aspect{display:none}
.wheel-svg[data-hide-element-glyph-color] .sign-glyph,
.wheel-svg[data-hide-element-glyph-color] .cusp-stack__sign,
.wheel-svg[data-hide-element-glyph-color] .cusp-sign-glyph{color:var(--text-secondary) !important}

.gear-panel{display:grid;gap:var(--space-2);padding:var(--space-3) 0}
.gear-panel__row{
  display:flex;align-items:center;gap:var(--space-3);
  padding:var(--space-2);border-radius:var(--radius-sm);
}
@media (hover:hover){
  .gear-panel__row:hover{background:var(--bg-subtle)}
}
.gear-panel__row:focus-within{background:var(--bg-subtle)}
.gear-panel__row input{
  width:18px;height:18px;
  accent-color:var(--accent);
}
.gear-panel__row label{
  flex:1;font-size:var(--text-sm);color:var(--text-secondary);cursor:pointer;
}
.gear-panel__reset{
  margin-top:var(--space-3);padding:var(--space-3) var(--space-4);
  background:var(--bg-subtle);border:1px solid var(--border);
  color:var(--text-secondary);border-radius:var(--radius);
  cursor:pointer;width:100%;
}
@media (hover:hover){
  .gear-panel__reset:hover{color:var(--accent);border-color:var(--accent)}
}
.gear-panel__reset:focus-visible{color:var(--accent);border-color:var(--accent);outline:2px solid var(--accent);outline-offset:2px}

.wheel-sheet__section{
  padding:var(--space-4) 0;
}
.wheel-sheet__section + .wheel-sheet__section{
  border-top:1px solid var(--border-subtle);
}
.wheel-sheet__section:first-of-type{padding-top:0}
.wheel-sheet__section:last-of-type{padding-bottom:0}
.wheel-sheet__section-title{
  font-size:var(--text-lg);
  display:flex;
  align-items:baseline;
  gap:var(--space-2);
  margin:0 0 var(--space-1) 0;
}
.wheel-sheet__glyph--inline{
  font-size:1.5rem;
  font-family:'AstroSymbols','Segoe UI Symbol','Apple Symbols','Noto Sans Symbols2','Symbola',serif;
  font-variant-emoji:text;
  font-feature-settings:"liga" off;
  color:var(--accent);
}
.wheel-sheet__note{
  font-size:var(--text-xs);
  color:var(--text-tertiary);
  font-style:italic;
  line-height:1.4;
  margin:var(--space-1) 0 0 0;
}
.wheel-sheet__stellium{
  font-size:var(--text-sm);
  color:var(--accent);
  font-weight:600;
  margin:var(--space-1) 0 var(--space-3) 0;
  letter-spacing:0.02em;
}

.wheel-toast{
  position:fixed;
  bottom:calc(var(--space-6) + env(safe-area-inset-bottom, 0px));
  left:50%;
  transform:translateX(-50%);
  background:var(--text-primary);
  color:var(--bg);
  padding:var(--space-3) var(--space-5);
  border-radius:var(--radius);
  font-size:var(--text-sm);
  z-index:1200;
  box-shadow:var(--shadow-lg);
  opacity:0;
  transition:opacity 0.3s;
  pointer-events:none;
}
.wheel-toast.is-visible{opacity:1}
.wheel-toast[hidden]{display:block}

@media (max-width:600px){
  .wheel-svg{
    --wh-sign-size: 38;
    --wh-planet-size: 38;
    --wh-house-size: 28;
    --wh-retro-size: 26;
    --wh-angle-label-size: 28;
    --wh-angle-sublabel-size: 18;
    --wh-aspect-tight: 1.5;
    --wh-aspect-mid: 1.0;
    --wh-aspect-wide: 0.75;
    --wh-focus-stroke: 3;
  }
  .wheel-svg .cusp-collapse__name{font-size:14px}
  .wheel-svg .tick-1{display:none}
  .wheel-svg .tick-5{stroke-width:1.2}
  .wheel-svg .tick-10{stroke-width:1.8}
  .wheel-svg .angle-marker{stroke-width:2.4}
  .wheel-svg .house-cusp-line{stroke-width:1}
  .wheel-svg .house-cusp-line--angular{stroke-width:2}

  .wheel-svg .cusp-sign:not(.cusp-sign--angular) .cusp-stack,
  .wheel-svg .cusp-sign:not(.cusp-sign--angular) .cusp-collapse{display:none}

  .wheel-svg{
    --wh-fire:  rgba(194,90,42,0.17);
    --wh-earth: rgba(90,122,50,0.17);
    --wh-air:   rgba(160,130,34,0.17);
    --wh-water: rgba(42,80,120,0.17);
  }
  [data-theme="dark"] .wheel-svg{
    --wh-fire:  rgba(224,136,64,0.18);
    --wh-earth: rgba(146,184,101,0.17);
    --wh-air:   rgba(216,179,90,0.17);
    --wh-water: rgba(106,155,208,0.18);
  }

  .wheel-preset{
    min-height:44px;
    padding:var(--space-3) var(--space-5);
    font-size:var(--text-base);
  }
  .wheel-sheet__close{width:44px;height:44px}

  .gear-panel__row{padding:var(--space-3);min-height:44px}
  .gear-panel__row input{width:22px;height:22px}
  .gear-panel__row label{font-size:var(--text-base);padding:var(--space-2) 0}

  .wheel-sheet__handle{width:60px;height:6px}
}

.wheel-svg[data-hide-houses-cusps] .cusp-sign:not(.cusp-sign--angular){display:none}

@supports (r: 22px){
  @media (max-width:600px){
    .planet-bg{ r: 22px }
  }
}
