html, body { margin: 0; height: 100%; overflow: hidden; background:#020712; color:#eee; }
    #leftPanels {
      position: absolute;
      left: 12px;
      top: 48px;
      display: flex;
      flex-direction: column;
      gap: 10px;
      width: 260px;
      pointer-events: auto;
      z-index: 10;
    }
    #datesPanel {
      position: relative;
      width: 100%;
      box-sizing: border-box;
      background: rgba(0,0,0,0.6);
      padding: 10px 12px;
      border: 1px solid #2a89ff;
      border-radius: 8px;
      font-family: Arial, sans-serif;
      font-size: 13px;
      color: #e6e6e6;
      line-height: 1.5;
    }
    #datesPanel h3 {
      margin: 0 0 6px;
      font-size: 14px;
      color: #9dc5ff;
    }
    #datesPanel details {
      border: 1px solid rgba(42,137,255,0.35);
      border-radius: 8px;
      padding: 6px 8px;
      background: rgba(17,24,38,0.35);
    }
    #datesPanel details + details { margin-top: 6px; }
    #datesPanel summary {
      cursor: pointer;
      color: #cfdcff;
      font-weight: 600;
      text-align: start;
    }
    #datesPanel .date-desc {
      font-size: 12px;
      color: #a7b6d1;
      margin-top: 6px;
    }
    #datesPanel .date-list {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin-top: 6px;
    }
    #datesPanel .date-jump {
      width: 100%;
      text-align: start;
      padding: 6px 8px;
      background: #2a89ff;
      color: #fff;
      border: none;
      border-radius: 6px;
      cursor: pointer;
      font-size: 12px;
    }
    #datesPanel .date-jump:hover { background: #3b9dff; }
    html[dir="rtl"] #infoPanel ul {
      margin: 6px 0 0 0;
      padding-right: 16px;
      padding-left: 0;
      list-style-position: inside;
    }
    .segment-group button { opacity: 0.7; }
    .segment-group button.active {
      background: linear-gradient(135deg, #ffd166, #ff9f1c);
      color: #1a1a1a;
      border: 2px solid #ffe0a6;
      box-shadow: 0 0 0 3px rgba(255,209,102,0.35), 0 10px 18px rgba(0,0,0,0.55);
      opacity: 1;
      font-weight: 700;
      transform: translateY(-1px);
    }
    .floating-btn {
      position: fixed;
      z-index: 12;
      padding: 6px 10px;
      background: rgba(0,0,0,0.7);
      border: 1px solid #2a89ff;
      color: #e6e6e6;
      border-radius: 8px;
      font-family: Arial, sans-serif;
      font-size: 12px;
      cursor: pointer;
      white-space: nowrap;
      max-width: 140px;
      text-align: center;
    }
    #toggleInfoBtn { left: 12px; top: 12px; }
    #toggleControlsBtn { right: 12px; bottom: 12px; }
    #langSwitcher {
      position: fixed;
      left: 50%;
      transform: translateX(-50%);
      top: 8px;
      z-index: 13;
      padding: 6px 10px;
      background: rgba(0,0,0,0.7);
      border: 1px solid #2a89ff;
      border-radius: 8px;
      font-family: Arial, sans-serif;
      font-size: 12px;
      color: #cfdcff;
      white-space: nowrap;
    }
    #langSwitcher a {
      color: #9dc5ff;
      text-decoration: none;
      font-weight: 600;
    }
    #langSwitcher a.active {
      color: #fff;
      cursor: default;
      text-decoration: none;
    }
    #langSwitcher a:hover { text-decoration: underline; }
    @media (min-width: 901px) {
      #toggleControlsBtn { right: 12px; top: 12px; bottom: auto; }
      .mobile-carousel-btn { display: none !important; }
    }
    @media (max-width: 900px) {
      #sidePanels {
        position: fixed;
        left: 8px;
        right: 8px;
        bottom: 8px;
        top: auto;
        width: auto;
        max-height: 50vh;
        overflow-y: auto;
        gap: 8px;
        pointer-events: auto;
      }
      #controls, #dataPanel {
        width: 100%;
      }
      #desktopHint { display: none; }
      #leftPanels {
        left: 8px;
        right: 8px;
        top: 48px;
        width: auto;
        max-height: 55vh;
        overflow-y: auto;
      }
      .seasons-page #leftPanels { width: auto; }
    }
    #infoPanel {
      position: relative;
      width: 100%;
      box-sizing: border-box;
      background: rgba(0,0,0,0.6);
      padding: 10px 12px;
      border: 1px solid #2a89ff;
      border-radius: 8px;
      font-family: Arial, sans-serif;
      font-size: 13px;
      color: #e6e6e6;
      line-height: 1.5;
    }
    #infoPanel h2 {
      margin: 0 0 6px;
      font-size: 15px;
      color: #9dc5ff;
    }
    #infoPanel ul {
      margin: 6px 0 0 16px;
      padding: 0;
    }
    #infoPanel li { margin-bottom: 4px; }
    #dataPanel {
      background: rgba(0,0,0,0.6);
      padding: 10px 12px;
      border: 1px solid #2a89ff;
      border-radius: 8px;
      font-family: Arial, sans-serif;
      font-size: 13px;
      color: #e6e6e6;
      line-height: 1.5;
      width: 100%;
      box-sizing: border-box;
    }
    #dataPanel h3 {
      margin: 0 0 6px;
      font-size: 14px;
      color: #9dc5ff;
    }
    footer {
      position: absolute;
      left: 12px;
      bottom: 12px;
      padding: 6px 10px;
      background: rgba(0,0,0,0.65);
      border: 1px solid #2a89ff;
      border-radius: 6px;
      font-family: Arial, sans-serif;
      font-size: 12px;
      color: #cfdcff;
    }
    html[dir="rtl"] footer {
      left: 12px;
      right: auto;
      text-align: left;
      direction: ltr;
    }
    footer a {
      color: #8fb5ff;
      text-decoration: none;
    }
    footer a:hover { text-decoration: underline; }
    .sr-only{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
    .tour-card {
      margin-top: 6px;
      padding: 8px;
      border: 1px solid rgba(42,137,255,0.35);
      border-radius: 8px;
      background: rgba(10,16,26,0.55);
      font-size: 14px;
      color: #dce6ff;
      line-height: 1.4;
    }
    .tour-step-title {
      font-weight: bold;
      color: #9dc5ff;
      margin-bottom: 4px;
      font-size: 16px;
    }
    .tour-step-body { margin-bottom: 6px; }
    .tour-progress { font-size: 12px; color: #8aa2d3; margin-bottom: 6px; }
    .tour-alert { color: #ffbb66; font-size: 13px; margin-top: 6px; }
    #tourSection button {
      padding: 6px 10px;
      background: #2a89ff;
      color: #fff;
      border: 1px solid #2a89ff;
      border-radius: 4px;
      cursor: pointer;
    }
    #tourSection button:hover { background: #3b9dff; }
    #tourSection button:disabled {
      background: #1b2a40;
      color: #7fa3de;
      border-color: #253754;
      cursor: not-allowed;
      opacity: 0.65;
    }
    #tourSection button:disabled:hover { background: #1b2a40; }
    #tourSection button.tour-secondary {
      background: #1c2536;
      border: 1px solid #3b4b63;
      color: #dce6ff;
    }
    #tourSection button.tour-secondary:disabled {
      background: #101725;
      border-color: #24324a;
      color: #6d83ad;
    }
    #tourSection button.tour-secondary:hover { background: #24314a; }
    .faq-block { margin-top: 8px; font-size: 12px; color: #cfdcff; }
    .faq-block h4 { margin: 6px 0 4px; font-size: 13px; color: #9dc5ff; }
    .faq-block .qa { margin-bottom: 6px; }
    .faq-block .qa strong { display: block; color: #dce6ff; }
    .subpoint-legend {
      display: flex;
      flex-wrap: wrap;
      gap: 10px 14px;
      font-size: 12px;
      color: #cfdcff;
      margin-bottom: 6px;
    }
    .subpoint-legend-item { display: flex; align-items: center; gap: 6px; }
    .subpoint-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      display: inline-block;
      box-shadow: 0 0 6px rgba(0,0,0,0.4);
    }
    .subpoint-dot-sun { background: #ffdd55; }
    .subpoint-dot-moon { background: #55ddff; }
    .mobile-scene-footer { display: none; }
    .earth-main .page-layout {
      position: relative;
      width: 100%;
      height: 100%;
    }
    .earth-main .page-layout > #scene {
      position: absolute;
      inset: 0;
    }
    .seasons-page .page-layout {
      position: relative;
      width: 100%;
      height: 100%;
    }
    .seasons-page .page-layout > #scene {
      position: absolute;
      inset: 0;
    }
    .panel-scroll {
      display: flex;
      flex-direction: column;
      gap: 10px;
      width: 100%;
      box-sizing: border-box;
    }
    .page-layout { width: 100%; height: 100%; }
    .mobile-tabs {
      display: none;
      position: fixed;
      left: 50%;
      bottom: 12px;
      transform: translateX(-50%);
      z-index: 14;
      gap: 6px;
      padding: 6px 8px;
      background: rgba(0,0,0,0.7);
      border: 1px solid #2a89ff;
      border-radius: 999px;
      font-family: Arial, sans-serif;
      font-size: 12px;
    }
    .mobile-tabs button {
      background: rgba(17,24,38,0.6);
      border: 1px solid rgba(110,160,220,0.6);
      color: #dbe7ff;
      border-radius: 999px;
      padding: 4px 10px;
      cursor: pointer;
      font-size: 12px;
    }
    .mobile-tabs button:hover { background: rgba(42,137,255,0.35); }
    .mobile-carousel-btn {
      display: none;
      position: fixed;
      top: 50%;
      transform: translateY(-50%);
      z-index: 14;
      width: 34px;
      height: 34px;
      border-radius: 50%;
      border: 1px solid #2a89ff;
      background: rgba(0,0,0,0.7);
      color: #e6e6e6;
      font-size: 18px;
      cursor: pointer;
      align-items: center;
      justify-content: center;
      padding: 0;
    }
    .mobile-carousel-prev { left: 8px; }
    .mobile-carousel-next { right: 8px; }
    .mobile-carousel-btn:hover { background: rgba(42,137,255,0.35); }
    .seasons-page #leftPanels { width: 520px; }
    .analemma-page #controls { display: none; }
    .analemma-page #useTypedPoiBtn { display: none; }
    .analemma-page #startTourBtn { display: none; }
    .analemma-page { --analemma-left: 50vw; }
    .analemma-page #scene { margin-left: var(--analemma-left); width: calc(100vw - var(--analemma-left)); height: 100vh; }
    .analemma-page #leftPanels { width: calc(var(--analemma-left) - 24px); }
    .analemma-page .topic-select { left: calc(var(--analemma-left) + (100vw - var(--analemma-left)) / 2); }
    .analemma-breakdown { background: rgba(0,0,0,0.6); width: 100%; box-sizing: border-box; padding: 12px; }
    .analemma-controls-bar {
      display: grid;
      gap: 12px;
      grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    }
    .analemma-control-block {
      background: rgba(10,16,26,0.55);
      border: 1px solid rgba(42,137,255,0.35);
      border-radius: 8px;
      padding: 10px 12px;
      font-size: 12px;
      color: #e6e6e6;
    }
    .analemma-control-block label,
    .analemma-control-label { display: block; margin-bottom: 6px; font-size: 13px; color: #9dc5ff; }
    .analemma-controls-bar input {
      width: 100%;
      background: #111826;
      border: 1px solid #2a89ff;
      border-radius: 4px;
      padding: 4px;
      color: #e6e6e6;
    }
    .analemma-control-buttons button {
      padding: 6px 10px;
      background: #2a89ff;
      color: #fff;
      border: none;
      border-radius: 4px;
      cursor: pointer;
    }
    .analemma-control-buttons button:hover { background: #3b9dff; }
    .analemma-controls-bar #resetNowBtn { display: none; }
    .analemma-cards { display: grid; gap: 20px; margin-top: 14px; }
    .analemma-tabs {
      display: flex;
      gap: 8px;
      margin-top: 12px;
    }
    .analemma-tab {
      padding: 6px 12px;
      background: rgba(18,30,52,0.9);
      color: #dbe7ff;
      border: 1px solid rgba(110,160,220,0.6);
      border-radius: 999px;
      font-size: 12px;
      cursor: pointer;
    }
    .analemma-tab.active {
      background: #2a89ff;
      border-color: #2a89ff;
      color: #fff;
    }
    .analemma-tab-panels { margin-top: 12px; }
    .analemma-tab-panel { display: none; padding: 0; }
    .analemma-tab-panel.active { display: block; }
    .analemma-card {
        border: 1px solid rgba(42,137,255,0.35);
        border-radius: 10px;
        padding: 16px;
        background: rgba(10,16,26,0.55);
        font-size: 12px;
        color: #e6e6e6;
        line-height: 1.5;
        display: flex;
        flex-direction: column;
        min-height: 280px;
      }
    .analemma-card.is-collapsed { min-height: 0; }
    .analemma-card.analemma-card-compact { min-height: 0; }
    .analemma-card-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        cursor: pointer;
      }
    .analemma-card-content { margin-top: 6px; }
    .analemma-card-content[hidden] { display: none; }
    .analemma-card-title { margin: 0; font-size: 19px; color: #dce6ff; }
    .analemma-card-lede { margin: 0 0 12px; font-size: 13px; color: #cfdcff; }
    .analemma-card-subtitle {
        margin: 12px 0 6px;
        font-size: 13px;
        color: #9dc5ff;
        letter-spacing: 0.08em;
        text-transform: uppercase;
      }
    .analemma-card-intro:empty { display: none; }
    .analemma-card-spacer { height: 0; }
    .analemma-mini-charts {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
        align-items: stretch;
        justify-items: start;
        width: 100%;
      }
    .analemma-mini-block {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        gap: 6px;
        height: 100%;
        min-height: 0;
        width: 100%;
      }
    .analemma-mini-label {
        font-size: 13px;
        color: #9dc5ff;
        letter-spacing: 0.08em;
        text-transform: uppercase;
      }
    html[dir="rtl"] .analemma-mini-label {
        letter-spacing: 0.02em;
        text-transform: none;
      }
    .analemma-mini-row {
        display: block;
        min-height: 0;
      }
    .analemma-mini-frame {
        position: relative;
        width: 100%;
        height: 100%;
        min-height: 175px;
      }
    .analemma-mini-note {
        position: absolute;
        right: 8px;
        bottom: 8px;
        font-size: 10px;
        color: #cfdcff;
        line-height: 1.4;
        background: rgba(8,12,18,0.65);
        border: 1px solid rgba(120,170,255,0.35);
        border-radius: 6px;
        padding: 6px 8px;
      }
    html[dir="rtl"] .analemma-mini-note {
        right: auto;
        left: 8px;
        text-align: right;
      }
    .analemma-mini-chart {
        width: 100%;
        height: 100%;
        display: block;
        border-radius: 8px;
        border: 1px solid rgba(42,137,255,0.25);
        background: rgba(8,12,18,0.75);
        box-shadow: inset 0 0 12px rgba(255,255,255,0.05);
        flex: 1;
        min-height: 175px;
      }
    .analemma-mini-chart.analemma-mini-chart-curved {
        border: none;
        background: transparent;
        box-shadow: none;
      }
    .analemma-card-toggle {
        padding: 4px 10px;
        background: rgba(18,30,52,0.9);
        color: #dbe7ff;
        border: 1px solid rgba(110,160,220,0.6);
        border-radius: 999px;
        font-size: 13px;
        cursor: pointer;
      }
    html[dir="rtl"] .analemma-card-toggle {
        font-size: 14px;
      }
    .analemma-card-toggle:hover { background: rgba(42,137,255,0.35); }
    .analemma-card-toggle:focus-visible {
        outline: 2px solid rgba(120,200,255,0.8);
        outline-offset: 2px;
      }
    .analemma-card-body { display: grid; gap: 12px; flex: 1; }
    .analemma-card-body-split { grid-template-columns: minmax(0, 2.1fr) minmax(180px, 1fr); align-items: start; }
    .analemma-card-chart canvas {
      width: 100%;
      height: auto;
      display: block;
      border: 1px solid rgba(42,137,255,0.25);
      border-radius: 6px;
      background: rgba(10,16,26,0.4);
    }
    .analemma-legend { display: flex; flex-wrap: wrap; gap: 10px 14px; font-size: 12px; color: #9dc5ff; margin-bottom: 8px; }
    .analemma-legend-set[hidden] { display: none; }
    .analemma-legend-item { display: inline-flex; align-items: center; gap: 6px; }
    .analemma-swatch {
      width: 14px;
      height: 4px;
      border-radius: 2px;
      background: var(--swatch, #9dc5ff);
      display: inline-block;
    }
    .analemma-key-row {
      margin-top: 10px;
      padding-top: 8px;
      border-top: 1px solid rgba(42,137,255,0.2);
      display: flex;
      justify-content: space-between;
      font-size: 13px;
      gap: 8px;
    }
    .analemma-key-label { color: #9dc5ff; }
    .analemma-key-value { color: #e6e6e6; font-weight: 600; }
    .analemma-details { margin-top: 8px; font-size: 12px; color: #cfdcff; }
    .analemma-details summary { cursor: pointer; color: #9dc5ff; }
    .analemma-details ul { margin: 6px 0 0 16px; padding: 0; }
    .analemma-tooltip {
      position: fixed;
      z-index: 80;
      background: rgba(8,12,20,0.92);
      border: 1px solid rgba(42,137,255,0.35);
      border-radius: 6px;
      padding: 8px 10px;
      font-size: 12px;
      color: #e6e6e6;
      pointer-events: none;
      opacity: 0;
      transition: opacity 0.12s ease;
      max-width: 240px;
    }
    .analemma-tooltip.show { opacity: 1; }
    .analemma-inset-embed {
      padding: 0;
      border: 1px solid rgba(42,137,255,0.35);
      border-radius: 16px;
      background: rgba(10,16,26,0.55);
      width: 100%;
      margin: 0;
      box-sizing: border-box;
    }
    .analemma-inset-caption {
      padding: 12px 16px 16px;
      color: #cfdcff;
      font-size: 12px;
      line-height: 1.5;
    }
    .analemma-inset-embed canvas {
      width: 100%;
      height: auto;
      display: block;
      border-radius: 14px;
      background: rgba(8,12,18,0.8);
      box-shadow: 0 18px 35px rgba(0,0,0,0.45);
    }
    .analemma-combined-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(220px, 1fr);
      gap: 14px;
      align-items: stretch;
    }
    .analemma-combined-sidebar {
      background: rgba(6,12,24,0.85);
      border: 1px solid rgba(42,137,255,0.35);
      border-radius: 16px;
      padding: 16px;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }
    .analemma-combined-chart {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .analemma-combined-chart-heading {
      font-size: 14px;
      color: #bcd7ff;
      letter-spacing: 0.02em;
    }
    .analemma-combined-chart-legend {
      display: flex;
      gap: 10px;
      font-size: 11px;
      color: #cfdcff;
    }
    .analemma-combined-chart-legend span {
      display: inline-flex;
      align-items: center;
      gap: 4px;
    }
    .analemma-combined-chart-legend .swatch {
      width: 10px;
      height: 10px;
      border-radius: 2px;
      display: inline-block;
    }
    .analemma-combined-chart canvas {
      width: 100%;
      height: 220px;
      border-radius: 14px;
      background: rgba(8,12,18,0.8);
      box-shadow: inset 0 0 12px rgba(255,255,255,0.05);
    }
    .analemma-combined-inspector {
      background: rgba(12,18,32,0.85);
      border-radius: 12px;
      border: 1px solid rgba(105,140,255,0.4);
      padding: 16px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .analemma-inspector-heading {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      gap: 12px;
      font-size: 14px;
      color: #9dc5ff;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .analemma-inspector-caption {
      font-size: 12px;
      color: #cfdcff;
      letter-spacing: 0.14em;
    }
    .analemma-inspector-value {
      font-size: 26px;
      font-weight: 600;
      color: #ffda76;
      letter-spacing: 0.02em;
    }
    .analemma-inspector-diff {
      font-size: 16px;
      color: #cfdcff;
      margin-left: 8px;
      font-weight: 500;
    }
    html[dir="rtl"] .analemma-inspector-value {
      text-align: right;
    }
    html[dir="rtl"] .analemma-inspector-diff {
      display: block;
      margin: 6px 0 0;
      margin-left: 0;
      direction: rtl;
      unicode-bidi: isolate;
    }
    .analemma-inspector-detail {
      font-size: 14px;
      color: #cfdcff;
      line-height: 1.4;
    }
    .analemma-inspector-row {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      justify-content: space-between;
    }
    .analemma-inspector-chip {
      background: rgba(8,12,18,0.7);
      border: 1px solid rgba(255,255,255,0.18);
      border-radius: 999px;
      padding: 10px 16px;
      font-size: 14px;
      color: #e6e6e6;
    }
    #analemmaInspectorCombined {
      white-space: pre-line;
    }
    @media (max-width: 900px) {
      .analemma-page #scene { margin-left: 0; width: 100vw; }
      .analemma-page #leftPanels { width: auto; }
    .analemma-controls-bar { grid-template-columns: 1fr; }
    .analemma-card-body-split { grid-template-columns: 1fr; }
    .analemma-combined-grid { grid-template-columns: 1fr; }
    .analemma-inset-embed { width: 100%; margin-left: 0; }
  }
    @media (max-width: 900px) {
      .earth-main .page-layout {
        display: block;
        position: fixed;
        inset: 0;
        width: 100vw;
        height: 100vh;
        overflow: hidden;
      }
      .earth-main .page-layout > #leftPanels,
      .earth-main .page-layout > #scene,
      .earth-main .page-layout > #sidePanels {
        width: 100vw;
        height: 100vh;
      }
      .earth-main #leftPanels,
      .earth-main #scene,
      .earth-main #sidePanels { display: none; }
      .earth-main[data-active-slide="leftPanels"] #leftPanels,
      .earth-main[data-active-slide="scene"] #scene,
      .earth-main[data-active-slide="sidePanels"] #sidePanels { display: block; }
      .earth-main .page-layout > #scene {
        position: relative;
        inset: auto;
      }
      .earth-main #leftPanels,
      .earth-main #sidePanels {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        max-height: none;
        overflow: hidden;
        padding: 0;
        box-sizing: border-box;
        min-height: 0;
        height: 100vh;
        max-height: 100vh;
        overflow-x: hidden;
      }
      .earth-main #leftPanels .panel-scroll,
      .earth-main #sidePanels .panel-scroll {
        position: absolute;
        inset: 0;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 64px 12px 96px;
        box-sizing: border-box;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
      }
      .earth-main #leftPanels { width: 100vw; }
      .earth-main #sidePanels { gap: 8px; }
      .earth-main #controls,
      .earth-main #dataPanel { width: 100%; }
      .earth-main #scene { width: 100%; height: 100%; position: relative; overflow: hidden; }
      .earth-main #scene canvas {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
      }
      .earth-main .mobile-carousel-btn { display: inline-flex; }
      .earth-main #toggleInfoBtn,
      .earth-main #toggleControlsBtn { display: none; }
      .earth-main .topic-select {
        position: fixed;
        top: 44px;
        left: 50%;
        transform: translateX(-50%);
        margin: 0;
        z-index: 61;
      }
      .earth-main #langSwitcher,
      .earth-main .topic-select { display: none; }
      .earth-main[data-active-slide="scene"] #langSwitcher,
      .earth-main[data-active-slide="scene"] .topic-select { display: flex; }
      .earth-main footer { display: none; }
      .earth-main .mobile-scene-footer {
        display: block;
        position: absolute;
        left: 12px;
        bottom: 12px;
        padding: 6px 10px;
        background: rgba(0,0,0,0.65);
        border: 1px solid #2a89ff;
        border-radius: 6px;
        font-family: Arial, sans-serif;
        font-size: 12px;
        color: #cfdcff;
        z-index: 10;
      }
      .earth-main .mobile-scene-footer a {
        color: #8fb5ff;
        text-decoration: none;
      }
      .earth-main .mobile-scene-footer a:hover { text-decoration: underline; }
      .seasons-page .page-layout {
        display: block;
        position: fixed;
        inset: 0;
        width: 100vw;
        height: 100vh;
        overflow: hidden;
      }
      .seasons-page .page-layout > #leftPanels,
      .seasons-page .page-layout > #scene,
      .seasons-page .page-layout > #sidePanels {
        width: 100vw;
        height: 100vh;
      }
      .seasons-page #leftPanels,
      .seasons-page #scene,
      .seasons-page #sidePanels { display: none; }
      .seasons-page[data-active-slide="leftPanels"] #leftPanels,
      .seasons-page[data-active-slide="scene"] #scene,
      .seasons-page[data-active-slide="sidePanels"] #sidePanels { display: block; }
      .seasons-page .page-layout > #scene {
        position: relative;
        inset: auto;
      }
      .seasons-page #leftPanels,
      .seasons-page #sidePanels {
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        max-height: none;
        overflow: hidden;
        padding: 0;
        box-sizing: border-box;
        min-height: 0;
        height: 100vh;
        max-height: 100vh;
        overflow-x: hidden;
      }
      .seasons-page #leftPanels .panel-scroll,
      .seasons-page #sidePanels .panel-scroll {
        position: absolute;
        inset: 0;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 64px 12px 96px;
        box-sizing: border-box;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
      }
      .seasons-page #leftPanels { width: 100vw; }
      .seasons-page #sidePanels { gap: 8px; }
      .seasons-page #controls,
      .seasons-page #dataPanel { width: 100%; }
      .seasons-page #scene { width: 100%; height: 100%; position: relative; overflow: hidden; }
      .seasons-page #scene canvas {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
      }
      .seasons-page .mobile-tabs { display: none; }
      .seasons-page .mobile-carousel-btn { display: inline-flex; }
      .seasons-page #toggleInfoBtn,
      .seasons-page #toggleControlsBtn { display: none; }
      .seasons-page .topic-select {
        position: fixed;
        top: 44px;
        left: 50%;
        transform: translateX(-50%);
        margin: 0;
        z-index: 61;
      }
      .seasons-page #langSwitcher,
      .seasons-page .topic-select { display: none; }
      .seasons-page[data-active-slide="scene"] #langSwitcher,
      .seasons-page[data-active-slide="scene"] .topic-select { display: flex; }
      .seasons-page footer { display: none; }
      .seasons-page .mobile-scene-footer {
        display: block;
        position: absolute;
        left: 12px;
        bottom: 12px;
        padding: 6px 10px;
        background: rgba(0,0,0,0.65);
        border: 1px solid #2a89ff;
        border-radius: 6px;
        font-family: Arial, sans-serif;
        font-size: 12px;
        color: #cfdcff;
        z-index: 10;
      }
      .seasons-page .mobile-scene-footer a {
        color: #8fb5ff;
        text-decoration: none;
      }
      .seasons-page .mobile-scene-footer a:hover { text-decoration: underline; }
    }
    @media (max-height: 780px) {
      .analemma-breakdown { padding: 10px; }
      .analemma-controls-bar { gap: 10px; }
      .analemma-control-block { padding: 8px 10px; }
      .analemma-cards { gap: 10px; margin-top: 10px; }
      .analemma-card { padding: 12px; }
      .analemma-card-title { font-size: 17px; }
      .analemma-card-lede { font-size: 12px; margin-bottom: 8px; }
      .analemma-key-row { font-size: 12px; }
    }