.solarplane-app{
  --sp-bg:#07111d;--sp-bg2:#0b1726;--sp-panel:#0f1d2e;--sp-panel2:#132338;--sp-line:#233952;--sp-text:#eaf3ff;--sp-muted:#91a7bf;
  --sp-cyan:#59d6e8;--sp-blue:#5b8cff;--sp-amber:#ffbf5b;--sp-green:#57d3a5;--sp-red:#ff7b7b;--sp-violet:#b48cff;
  --sp-shadow:0 18px 60px rgba(0,0,0,.22);--sp-radius:18px;
  color:var(--sp-text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  margin:1.4rem 0 2.2rem;background:radial-gradient(circle at 80% 0%,#10284a 0,transparent 28%),linear-gradient(180deg,var(--sp-bg) 0%,#081420 100%);
  border:1px solid rgba(145,167,191,.18);border-radius:22px;overflow:hidden;box-shadow:var(--sp-shadow)
}
.solarplane-app *{box-sizing:border-box}.solarplane-app button,.solarplane-app input,.solarplane-app select{font:inherit}.solarplane-app button{cursor:pointer}
.solarplane-app .sp-head{padding:18px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(7,17,29,.88)}
.solarplane-app .sp-brand{display:flex;gap:12px;align-items:center}.solarplane-app .sp-brand-mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(145deg,var(--sp-amber),#ff8f3d);display:grid;place-items:center;color:#1a1307;font-size:22px}.solarplane-app .sp-brand strong{display:block;font-size:17px}.solarplane-app .sp-brand span{display:block;font-size:12px;color:var(--sp-muted);margin-top:2px}.solarplane-app .source-pill{font-size:12px;color:#bad3ec;border:1px solid var(--sp-line);background:rgba(19,35,56,.7);padding:9px 12px;border-radius:999px}
.solarplane-app .sp-layout{display:grid;grid-template-columns:330px minmax(0,1fr)}.solarplane-app .control-panel{padding:22px;border-right:1px solid rgba(255,255,255,.07);background:rgba(10,24,39,.82)}
.solarplane-app .control-panel section{padding:0 0 22px;margin:0 0 22px;border-bottom:1px solid rgba(255,255,255,.07)}.solarplane-app .section-kicker,.solarplane-app .eyebrow{font-size:10px;letter-spacing:.16em;color:var(--sp-cyan);font-weight:800}.solarplane-app .control-panel h2{font-size:20px;line-height:1.18;margin:8px 0;color:var(--sp-text)}
.solarplane-app .muted,.solarplane-app .card-head p{color:var(--sp-muted);font-size:12px;line-height:1.55;margin:8px 0 0}.solarplane-app .two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.solarplane-app label{font-size:12px;font-weight:700;color:#bcd0e4;display:block}
.solarplane-app input[type=number],.solarplane-app select{width:100%;margin-top:7px;border:1px solid var(--sp-line);background:#0a1625;color:var(--sp-text);border-radius:10px;padding:10px 11px;outline:none}.solarplane-app input:focus,.solarplane-app select:focus,.solarplane-app button:focus-visible{outline:2px solid var(--sp-cyan);outline-offset:2px}
.solarplane-app .preset-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.solarplane-app .chip,.solarplane-app .dir,.solarplane-app .secondary{border:1px solid var(--sp-line);background:#0b1827;color:#b8cce0;border-radius:9px;padding:8px 10px}.solarplane-app .chip{font-size:11px}.solarplane-app .chip:hover,.solarplane-app .dir:hover,.solarplane-app .secondary:hover{border-color:#40668d;color:#fff}
.solarplane-app .range-head{display:flex;justify-content:space-between;align-items:center}.solarplane-app .range-head output{font-size:12px;color:#fff;background:#17324c;border:1px solid #284b69;border-radius:7px;padding:3px 7px}.solarplane-app .range{width:100%;accent-color:var(--sp-cyan);margin:11px 0 4px}.solarplane-app .range-labels{display:flex;justify-content:space-between;color:#68819a;font-size:10px}.solarplane-app .top-gap{margin-top:18px}.solarplane-app .compass-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:11px}.solarplane-app .dir.active{background:rgba(89,214,232,.13);border-color:var(--sp-cyan);color:var(--sp-cyan)}
.solarplane-app .primary{width:100%;border:0;border-radius:12px;padding:13px 14px;background:linear-gradient(135deg,#46c8dc,#5b8cff);color:#04101d;font-weight:900;box-shadow:0 12px 28px rgba(63,183,218,.20)}.solarplane-app .primary:hover{filter:brightness(1.08)}.solarplane-app .primary:disabled{opacity:.55;cursor:wait}.solarplane-app .status{font-size:11px;line-height:1.45;color:var(--sp-muted);padding:10px 2px}.solarplane-app .status.error{color:#ff9b9b}.solarplane-app .status.ok{color:#83e6c2}
.solarplane-app .workspace{padding:22px;min-width:0}.solarplane-app .map-card,.solarplane-app .chart-card,.solarplane-app .sp-metric-card{background:linear-gradient(180deg,rgba(19,35,56,.88),rgba(11,25,41,.9));border:1px solid rgba(145,167,191,.14);border-radius:var(--sp-radius);box-shadow:var(--sp-shadow)}.solarplane-app .map-card{overflow:hidden}.solarplane-app .card-head{padding:18px 20px 14px}.solarplane-app .card-head.split{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.solarplane-app .card-head h3,.solarplane-app .chart-card h3{margin:5px 0 0;font-size:17px;color:var(--sp-text)}.solarplane-app .coord-badge{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;border:1px solid var(--sp-line);border-radius:8px;padding:7px 9px;color:#cce2f7}.solarplane-app #map{height:290px;background:#0a1625}.solarplane-app .leaflet-container{font-family:inherit}.solarplane-app .leaflet-control-attribution{font-size:9px!important}
.solarplane-app .metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:14px 0}.solarplane-app .sp-metric-card{padding:16px 17px;min-width:0}.solarplane-app .sp-metric-card span{font-size:11px;color:var(--sp-muted);display:block}.solarplane-app .sp-metric-card strong{font-size:26px;line-height:1.1;margin:7px 0 3px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--sp-text)}.solarplane-app .sp-metric-card small{font-size:10px;color:#6f89a2}.solarplane-app .hero-metric{border-color:rgba(89,214,232,.32);background:linear-gradient(160deg,rgba(23,69,91,.72),rgba(11,25,41,.9))}.solarplane-app .hero-metric strong{color:var(--sp-cyan)}
.solarplane-app .chart-card{margin-bottom:14px;overflow:hidden}.solarplane-app .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.solarplane-app .grid-2 .chart-card{margin:0}.solarplane-app .plot{height:370px;width:100%}.solarplane-app .plot.tall{height:430px}.solarplane-app .plot.xl{height:520px}.solarplane-app .secondary{font-size:11px;white-space:nowrap}.solarplane-app .secondary:disabled{opacity:.35;cursor:not-allowed}.solarplane-app .small-select{width:auto;min-width:130px;margin:0;padding:7px 9px}.solarplane-app .inline-actions{display:flex;gap:8px;flex-wrap:wrap}
.solarplane-app .bottom-grid{margin-top:14px}.solarplane-app .method-card,.solarplane-app .data-card{padding:20px}.solarplane-app .method-card h3,.solarplane-app .data-card h3{margin:6px 0 16px}.solarplane-app .equation{font-family:"Times New Roman",serif;font-size:16px;background:#0a1625;border:1px solid var(--sp-line);border-radius:10px;padding:10px 12px;margin:8px 0;color:#dceeff}.solarplane-app .data-card dl{margin:0}.solarplane-app .data-card dl div{display:flex;justify-content:space-between;gap:18px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06)}.solarplane-app dt{color:var(--sp-muted);font-size:11px}.solarplane-app dd{margin:0;font-size:11px;text-align:right}.solarplane-app .full{width:100%;margin-top:15px}
.solarplane-method{margin:2rem 0}.solarplane-method .formula{padding:1rem 1.1rem;border-left:4px solid #0f766e;background:#f6faf9;border-radius:8px;margin:1rem 0;font-family:Georgia,serif;overflow-wrap:anywhere}.solarplane-method .source-note{font-size:.94rem;color:#4b5563}
@media(max-width:1100px){.solarplane-app .sp-layout{grid-template-columns:1fr}.solarplane-app .control-panel{border-right:0;border-bottom:1px solid rgba(255,255,255,.07);display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.solarplane-app .control-panel section{margin:0;padding:0;border:0}.solarplane-app .control-panel .primary,.solarplane-app .control-panel .status{grid-column:1/-1}.solarplane-app .metrics{grid-template-columns:repeat(2,1fr)}.solarplane-app .grid-2{grid-template-columns:1fr}}
@media(max-width:720px){.solarplane-app{border-radius:14px;margin-left:-4px;margin-right:-4px}.solarplane-app .sp-head{padding:12px 14px}.solarplane-app .source-pill{display:none}.solarplane-app .control-panel{display:block;padding:16px}.solarplane-app .control-panel section{padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid rgba(255,255,255,.07)}.solarplane-app .workspace{padding:12px}.solarplane-app .metrics{grid-template-columns:1fr 1fr;gap:10px}.solarplane-app .sp-metric-card strong{font-size:21px}.solarplane-app .card-head.split{display:block}.solarplane-app .card-head.split>.secondary,.solarplane-app .inline-actions,.solarplane-app .small-select{margin-top:10px}.solarplane-app .small-select{width:100%}.solarplane-app .plot{height:330px}.solarplane-app .plot.tall{height:380px}.solarplane-app .plot.xl{height:420px}.solarplane-app #map{height:240px}.solarplane-app .two-col{grid-template-columns:1fr}.solarplane-app .grid-2{grid-template-columns:1fr}}

/* v4.1 performance + clarity fix: tile-free vector world selector */
.solarplane-app #map{
  position:relative;
  height:auto;
  min-height:250px;
  aspect-ratio:1200 / 560;
  background:#0b2033 url('/assets/solar-world-map.svg') center/100% 100% no-repeat;
  cursor:crosshair;
  overflow:hidden;
  touch-action:manipulation;
  user-select:none;
  border-top:1px solid rgba(255,255,255,.05);
}
.solarplane-app #map:focus-visible{outline:3px solid var(--sp-cyan);outline-offset:-3px}
.solarplane-app .sp-map-marker{
  position:absolute;
  width:18px;height:18px;
  border:3px solid #fff;
  border-radius:50%;
  background:var(--sp-cyan);
  box-shadow:0 0 0 4px rgba(89,214,232,.22),0 3px 10px rgba(0,0,0,.4);
  transform:translate(-50%,-50%);
  pointer-events:none;
  z-index:2;
}
.solarplane-app .sp-map-marker::after{
  content:'';position:absolute;left:50%;top:50%;width:28px;height:2px;background:rgba(255,255,255,.65);transform:translate(-50%,-50%);z-index:-1
}
.solarplane-app .sp-map-marker::before{
  content:'';position:absolute;left:50%;top:50%;width:2px;height:28px;background:rgba(255,255,255,.65);transform:translate(-50%,-50%);z-index:-1
}
.solarplane-app .sp-map-hint{
  position:absolute;left:12px;bottom:10px;
  padding:6px 9px;border-radius:8px;
  background:rgba(5,17,29,.82);border:1px solid rgba(145,167,191,.24);
  color:#d5e5f3;font-size:10px;line-height:1.25;pointer-events:none
}
.solarplane-app .plot-placeholder{
  height:100%;min-height:220px;display:grid;place-items:center;
  color:#6f89a2;font-size:13px;text-align:center;padding:20px;
  background:linear-gradient(180deg,rgba(11,25,41,.35),rgba(11,25,41,.08));
}
.solarplane-app input[type=range]{touch-action:pan-y}
@media(max-width:720px){
  .solarplane-app #map{min-height:210px;aspect-ratio:auto}
  .solarplane-app .sp-map-hint{font-size:9px;right:10px}
}


/* v4.2 contrast, live metric refresh, and sun-panel animation */
.solarplane-app input[type=number],
.solarplane-app select{
  min-height:46px!important;
  border:1px solid #52708e!important;
  border-radius:8px!important;
  background:#0d2033!important;
  color:#f8fbff!important;
  -webkit-text-fill-color:#f8fbff!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)!important;
  font-weight:700!important;
  opacity:1!important;
}
.solarplane-app input[type=number]:focus,
.solarplane-app select:focus{
  background:#10283f!important;
  border-color:var(--sp-cyan)!important;
  outline:2px solid rgba(89,214,232,.36)!important;
  outline-offset:1px!important;
}
.solarplane-app select option{background:#fff!important;color:#102033!important;-webkit-text-fill-color:#102033!important;font-weight:600!important}
.solarplane-app label{color:#e1edf9!important}
.solarplane-app .range-labels{color:#9db3c9!important}
.solarplane-app .small-select{background:#10283f!important;color:#fff!important;border-color:#5d7895!important}
.solarplane-app .chip,.solarplane-app .dir,.solarplane-app .secondary{color:#e8f2fc!important;border-color:#3a5876!important}
.solarplane-app .dir.active{color:#071522!important;background:#69e4f3!important;border-color:#8af0fb!important;font-weight:900!important}
.solarplane-app .sp-metric-card{
  background:linear-gradient(180deg,#13263b,#0d1c2d)!important;
  border:1px solid #314b66!important;
  border-radius:12px!important;
  box-shadow:none!important;
}
.solarplane-app .sp-metric-card span{color:#c6d7e7!important;font-weight:700!important}
.solarplane-app .sp-metric-card strong{color:#ffffff!important;text-shadow:0 1px 0 rgba(0,0,0,.28)}
.solarplane-app .sp-metric-card small{color:#9fb5c9!important}
.solarplane-app .hero-metric{background:linear-gradient(155deg,#12384a,#102033)!important;border-color:#49bcd0!important}
.solarplane-app .hero-metric strong{color:#66e6f5!important}
.solarplane-app #metricGain.metric-positive{color:#70e3ac!important}
.solarplane-app #metricGain.metric-negative{color:#ff9f9f!important}
.solarplane-app .metric-updating{animation:spMetricPulse .34s ease}
@keyframes spMetricPulse{0%{opacity:.55;transform:translateY(1px)}100%{opacity:1;transform:none}}

.solarplane-app .sun-animation-card{margin-top:14px;overflow:hidden}
.solarplane-app .face-badge{align-self:flex-start;max-width:330px;padding:8px 11px;border:1px solid #45627f;border-radius:999px;background:#10243a;color:#eaf4ff;font-size:11px;font-weight:800;line-height:1.25;text-align:center}
.solarplane-app .face-badge.front{border-color:#3dbb8a;background:rgba(44,147,109,.16);color:#8ef0c5}
.solarplane-app .face-badge.back{border-color:#e66d6d;background:rgba(190,66,66,.15);color:#ffb0b0}
.solarplane-app .face-badge.night{border-color:#667b93;background:rgba(92,112,136,.14);color:#c4d2df}
.solarplane-app .sun-anim-controls{display:grid;grid-template-columns:minmax(160px,220px) minmax(280px,1fr) auto;gap:14px;align-items:end;padding:0 20px 16px}
.solarplane-app .sun-anim-controls label{margin:0}
.solarplane-app .anim-time-control>span{display:block;margin-bottom:7px;font-size:12px;font-weight:700;color:#e1edf9}
.solarplane-app .anim-time-row{display:grid;grid-template-columns:1fr 92px;gap:12px;align-items:center}
.solarplane-app #animHour{width:100%;accent-color:#ffd166;min-height:44px;margin:0}
.solarplane-app #animTimeOut{display:block;padding:8px 9px;border:1px solid #52708e;border-radius:8px;background:#0d2033;color:#fff;font:800 12px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;text-align:center}
.solarplane-app .anim-play{min-height:46px!important;padding:10px 16px!important;background:#173451!important;color:#fff!important;font-weight:900!important}
.solarplane-app .sun-anim-body{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:16px;padding:0 20px 20px;align-items:stretch}
.solarplane-app .sun-panel-svg{display:block;width:100%;height:auto;min-height:280px;border:1px solid #27435e;border-radius:14px;background:radial-gradient(circle at 72% 18%,rgba(255,209,102,.08),transparent 24%),linear-gradient(180deg,#0b1a2b,#081522)}
.solarplane-app .svg-section-title{fill:#65ddeb;font:800 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}
.solarplane-app .svg-note{fill:#9fb5c9;font:11px/1.2 Inter,system-ui,sans-serif}
.solarplane-app .compass-label{fill:#f4f8fc;font:800 13px/1 Inter,system-ui,sans-serif}
.solarplane-app .compass-ring{fill:none;stroke:#37536e;stroke-width:1.5}
.solarplane-app .compass-axis{stroke:#233c55;stroke-width:1}
.solarplane-app .origin-dot{fill:#d5e7f7}
.solarplane-app .panel-normal-line{stroke:#69e4f3;stroke-width:4;stroke-linecap:round}
.solarplane-app .panel-arrow{fill:#69e4f3}
.solarplane-app .panel-surface-line{stroke:#8be1ef;stroke-width:10;stroke-linecap:round}
.solarplane-app .horizon-line{stroke:#5a7188;stroke-width:2}
.solarplane-app .sun-direction-line{stroke:#ffd166;stroke-width:3;stroke-dasharray:8 6;stroke-linecap:round}
.solarplane-app .sun-dot{fill:#ffd166;stroke:#fff3c1;stroke-width:3;filter:drop-shadow(0 0 7px rgba(255,209,102,.6))}
.solarplane-app .sun-animation-card[data-face="back"] .sun-direction-line{stroke:#ff8383}
.solarplane-app .sun-animation-card[data-face="back"] .sun-dot{fill:#ff9b7a;stroke:#ffd2c6;filter:drop-shadow(0 0 6px rgba(255,123,123,.45))}
.solarplane-app .sun-animation-card[data-face="night"] .sun-direction-line{stroke:#647a90;opacity:.55}
.solarplane-app .sun-animation-card[data-face="night"] .sun-dot{fill:#70859a;stroke:#a9bac9;filter:none;opacity:.72}
.solarplane-app .sun-anim-readouts{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:start}
.solarplane-app .sun-anim-readouts>div{padding:12px;border:1px solid #2c4864;border-radius:10px;background:#0c1c2d}
.solarplane-app .sun-anim-readouts span{display:block;color:#a9bfd3;font-size:10px;font-weight:700;line-height:1.3}
.solarplane-app .sun-anim-readouts strong{display:block;margin-top:5px;color:#fff;font-size:16px;line-height:1.2}
.solarplane-app #animBeamState{font-size:13px}
.solarplane-app #animExplanation{grid-column:1/-1;margin:2px 0 0;padding:12px;border-left:3px solid #69e4f3;background:#0c1c2d;color:#c9d9e8;font-size:11px;line-height:1.5}
.solarplane-app .sun-animation-card[data-face="back"] #animExplanation{border-left-color:#ff8383}
.solarplane-app .sun-animation-card[data-face="night"] #animExplanation{border-left-color:#75899c}

@media(max-width:900px){
  .solarplane-app .sun-anim-controls{grid-template-columns:1fr 1fr}.solarplane-app .anim-play{grid-column:1/-1}
  .solarplane-app .sun-anim-body{grid-template-columns:1fr}.solarplane-app .sun-anim-readouts{grid-template-columns:repeat(4,1fr)}
  .solarplane-app #animExplanation{grid-column:1/-1}
}
@media(max-width:620px){
  .solarplane-app .sun-anim-controls{grid-template-columns:1fr;padding:0 14px 14px}.solarplane-app .anim-play{grid-column:auto}
  .solarplane-app .anim-time-row{grid-template-columns:1fr 86px}.solarplane-app .sun-anim-body{padding:0 14px 14px}
  .solarplane-app .sun-panel-svg{min-height:220px}.solarplane-app .sun-anim-readouts{grid-template-columns:1fr 1fr}
}
@media(prefers-reduced-motion:reduce){.solarplane-app .metric-updating{animation:none}}