/* Observatory V192: a peripheral chart field and engraved instrument binding.
   The drawn chart is decoration, never labelled as measured scientific data. */
body[data-world-family='observatory'] {
  --obs-upper: var(--obs-upper-day);
  --obs-side: var(--obs-side-day);
  --obs-lower: var(--obs-lower-day);
  --obs-engraving: .78;
  --ui-control-radius: 4px;
}
body[data-world-family='observatory'][data-theme='dark'] {
  --obs-upper: var(--obs-upper-night);
  --obs-side: var(--obs-side-night);
  --obs-lower: var(--obs-lower-night);
  --obs-engraving: 1;
}
body[data-world-family='observatory'] .editor-scroll {
  background-image: linear-gradient(90deg, color-mix(in srgb, var(--nw-ink) 5%, transparent) 1px, transparent 1px), linear-gradient(color-mix(in srgb, var(--nw-ink) 4%, transparent) 1px, transparent 1px);
  background-size: 144px 144px;
}
body[data-world-family='observatory'][data-world-motif='constellation-study'] .editor-scroll {
  background-image: radial-gradient(ellipse at 8% 12%, color-mix(in srgb, var(--nw-accent) 17%, transparent), transparent 46%), linear-gradient(112deg, transparent 34%, color-mix(in srgb, var(--nw-ink) 5%, transparent) 34.1%, transparent 34.25%);
  background-size: 100% 100%;
}
body[data-world-family='observatory'][data-world-motif='solar-observatory'] .editor-scroll {
  background-image: repeating-linear-gradient(90deg, transparent 0 3px, color-mix(in srgb, var(--nw-ink) 3%, transparent) 3px 4px), radial-gradient(ellipse at 90% 4%, color-mix(in srgb, #b68146 19%, transparent), transparent 54%);
  background-size: auto;
}
body[data-world-family='observatory'] .ink-stage { margin-top: 98px; margin-bottom: 110px; }
body[data-world-family='observatory'] .world-surround {
  /* Authored chart extends outside the real paper rectangle. The hole protects
     all user objects regardless of board dimensions or the selected paper. */
  clip-path: polygon(evenodd, -500px -500px, calc(100% + 500px) -500px, calc(100% + 500px) calc(100% + 500px), -500px calc(100% + 500px), -500px -500px, 0 0, 0 100%, 100% 100%, 100% 0, 0 0);
}
body[data-world-family='observatory'] .world-surround-upper {
  left: -40px; right: -40px; top: -94px; height: 112px;
  background: var(--obs-upper) center bottom / 100% 100% no-repeat;
  opacity: var(--obs-engraving);
}
body[data-world-family='observatory'] :is(.world-surround-left,.world-surround-right) {
  top: 30px; bottom: 20px; width: 64px;
  background: var(--obs-side) left top / 64px 576px repeat-y;
  opacity: var(--obs-engraving);
}
body[data-world-family='observatory'] .world-surround-left { left: -68px; }
body[data-world-family='observatory'] .world-surround-right { right: -68px; transform: rotate(180deg); }
body[data-world-family='observatory'] .world-surround-lower {
  left: -40px; right: -40px; bottom: -86px; height: 100px;
  background: var(--obs-lower) center bottom / 100% 100% no-repeat;
  transform: rotate(180deg);
  opacity: var(--obs-engraving);
}
body[data-world-family='observatory'][data-theme='dark'] .world-surround :is(.world-surround-upper,.world-surround-left,.world-surround-right,.world-surround-lower) {
  filter: drop-shadow(0 0 2px rgb(175 218 255 / .30));
}
body[data-world-family='observatory'][data-theme='dark'] .theme-frame {
  filter: drop-shadow(0 1px 1px rgb(0 0 0 / .32)) drop-shadow(0 -1px 2px rgb(176 207 225 / .16));
}
body[data-world-family='observatory'] .note-editor {
  background-image: var(--wr-margin);
  background-size: 32px 160px;
  background-repeat: repeat-y;
  background-position: 3px 0;
}
body[data-world-family='observatory'][data-paper='blank'] .note-editor {
  background-image: var(--wr-edge), var(--wr-margin);
  background-size: 128px 128px, 32px 160px;
  background-repeat: no-repeat, repeat-y;
  background-position: right bottom, 3px 0;
}
body[data-world-family='observatory'][data-paper='ruled'] .note-editor {
  background-image: var(--wr-margin), linear-gradient(90deg, transparent 53px, color-mix(in srgb, var(--world-rule) 50%, transparent) 53px 54px, transparent 54px), repeating-linear-gradient(180deg, transparent 0 31px, color-mix(in srgb, var(--world-rule) 36%, transparent) 31px 32px);
  background-size: 32px 160px, 100% 100%, 100% 32px;
  background-repeat: repeat-y, no-repeat, repeat;
  background-position: 3px 26px, 0 0, 0 26px;
}
body[data-world-family='observatory'][data-paper='dots'] .note-editor {
  background-image: var(--wr-dots), var(--wr-margin);
  background-size: 24px 24px, 32px 160px;
  background-repeat: repeat, repeat-y;
  background-position: 0 0, 3px 0;
}
body[data-world-family='observatory'][data-paper='grid'] .note-editor {
  background-image: var(--wr-margin), linear-gradient(180deg, color-mix(in srgb, var(--world-rule) 20%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--world-rule) 20%, transparent) 1px, transparent 1px), linear-gradient(180deg, color-mix(in srgb, var(--world-rule) 38%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--world-rule) 38%, transparent) 1px, transparent 1px);
  background-size: 32px 160px, 24px 24px, 24px 24px, 120px 120px, 120px 120px;
  background-position: 3px 0, 0 0, 0 0, 0 0, 0 0;
  background-repeat: repeat-y, repeat, repeat, repeat, repeat;
}
body[data-world-family='observatory'][data-paper='chalkboard'] .note-editor {
  background-image: var(--wr-edge), radial-gradient(ellipse at 100% 100%, rgb(219 230 241 / .055), transparent 40%);
  background-size: 150px 150px, 100% 100%;
  background-position: right bottom, 0 0;
  background-repeat: no-repeat;
}
body[data-world-family='observatory'] .theme-material-grain { opacity: .16; }
body[data-world-family='observatory'][data-paper='chalkboard'] .theme-material-grain { opacity: .34; }
@container world-desk (max-width: 700px) {
  body[data-world-family='observatory'] .ink-stage { margin-top: 63px; margin-bottom: 79px; }
  body[data-world-family='observatory'] .world-surround-upper { top: -50px; left: -18px; right: -18px; height: 76px; background-size: 525px 76px; background-position: left bottom; }
  body[data-world-family='observatory'][data-world-motif='solar-observatory'] .world-surround-upper { background-position: right bottom; }
  body[data-world-family='observatory'] :is(.world-surround-left,.world-surround-right) { width: 30px; background-size: 46px 414px; }
  body[data-world-family='observatory'] .world-surround-left { left: -35px; background-position: right top; }
  body[data-world-family='observatory'] .world-surround-right { right: -35px; background-position: right top; }
  body[data-world-family='observatory'] .world-surround-lower { left: -18px; right: -18px; bottom: -57px; height: 63px; background-size: 550px 66px; background-position: left bottom; }
}
@media (max-width: 820px), (hover: none) and (pointer: coarse) {
  body[data-world-family='observatory'][data-paper='ruled'] .note-editor { background-position: 0 18px, 0 0, 0 18px; }
  body[data-world-family='observatory'] .note-editor { background-position-x: 0; }
}
@media print {
  body[data-world-family='observatory'] .world-surround { display: none !important; }
  body[data-world-family='observatory'] .note-editor { background-image: none !important; }
}
/* Generated V192 asset bindings. */
body[data-world-family='observatory'][data-world-motif='lunar-atlas'] {
  --world-rail-top: url('assets/world-rework/observatory/lunar-atlas/rail-top.svg');
  --world-rail-bottom: url('assets/world-rework/observatory/lunar-atlas/rail-bottom.svg');
  --world-rail-left: url('assets/world-rework/observatory/lunar-atlas/rail-left.svg');
  --world-rail-right: url('assets/world-rework/observatory/lunar-atlas/rail-right.svg');
  --world-corner-tl: url('assets/world-rework/observatory/lunar-atlas/corner-tl.svg');
  --world-corner-tr: url('assets/world-rework/observatory/lunar-atlas/corner-tr.svg');
  --world-corner-br: url('assets/world-rework/observatory/lunar-atlas/corner-br.svg');
  --world-corner-bl: url('assets/world-rework/observatory/lunar-atlas/corner-bl.svg');
  --wr-dots: url('assets/world-rework/observatory/lunar-atlas/dots.svg');
  --wr-margin: url('assets/world-rework/observatory/lunar-atlas/margin.svg');
  --wr-edge: url('assets/world-rework/observatory/lunar-atlas/blank-edge.svg');
  --obs-upper-day: url('assets/world-rework/observatory/lunar-atlas/upper-day.svg');
  --obs-upper-night: url('assets/world-rework/observatory/lunar-atlas/upper-night.svg');
  --obs-side-day: url('assets/world-rework/observatory/lunar-atlas/side-day.svg');
  --obs-side-night: url('assets/world-rework/observatory/lunar-atlas/side-night.svg');
  --obs-lower-day: url('assets/world-rework/observatory/lunar-atlas/lower-day.svg');
  --obs-lower-night: url('assets/world-rework/observatory/lunar-atlas/lower-night.svg');
}
body[data-world-family='observatory'][data-world-motif='constellation-study'] {
  --world-rail-top: url('assets/world-rework/observatory/constellation-study/rail-top.svg');
  --world-rail-bottom: url('assets/world-rework/observatory/constellation-study/rail-bottom.svg');
  --world-rail-left: url('assets/world-rework/observatory/constellation-study/rail-left.svg');
  --world-rail-right: url('assets/world-rework/observatory/constellation-study/rail-right.svg');
  --world-corner-tl: url('assets/world-rework/observatory/constellation-study/corner-tl.svg');
  --world-corner-tr: url('assets/world-rework/observatory/constellation-study/corner-tr.svg');
  --world-corner-br: url('assets/world-rework/observatory/constellation-study/corner-br.svg');
  --world-corner-bl: url('assets/world-rework/observatory/constellation-study/corner-bl.svg');
  --wr-dots: url('assets/world-rework/observatory/constellation-study/dots.svg');
  --wr-margin: url('assets/world-rework/observatory/constellation-study/margin.svg');
  --wr-edge: url('assets/world-rework/observatory/constellation-study/blank-edge.svg');
  --obs-upper-day: url('assets/world-rework/observatory/constellation-study/upper-day.svg');
  --obs-upper-night: url('assets/world-rework/observatory/constellation-study/upper-night.svg');
  --obs-side-day: url('assets/world-rework/observatory/constellation-study/side-day.svg');
  --obs-side-night: url('assets/world-rework/observatory/constellation-study/side-night.svg');
  --obs-lower-day: url('assets/world-rework/observatory/constellation-study/lower-day.svg');
  --obs-lower-night: url('assets/world-rework/observatory/constellation-study/lower-night.svg');
}
body[data-world-family='observatory'][data-world-motif='solar-observatory'] {
  --world-rail-top: url('assets/world-rework/observatory/solar-observatory/rail-top.svg');
  --world-rail-bottom: url('assets/world-rework/observatory/solar-observatory/rail-bottom.svg');
  --world-rail-left: url('assets/world-rework/observatory/solar-observatory/rail-left.svg');
  --world-rail-right: url('assets/world-rework/observatory/solar-observatory/rail-right.svg');
  --world-corner-tl: url('assets/world-rework/observatory/solar-observatory/corner-tl.svg');
  --world-corner-tr: url('assets/world-rework/observatory/solar-observatory/corner-tr.svg');
  --world-corner-br: url('assets/world-rework/observatory/solar-observatory/corner-br.svg');
  --world-corner-bl: url('assets/world-rework/observatory/solar-observatory/corner-bl.svg');
  --wr-dots: url('assets/world-rework/observatory/solar-observatory/dots.svg');
  --wr-margin: url('assets/world-rework/observatory/solar-observatory/margin.svg');
  --wr-edge: url('assets/world-rework/observatory/solar-observatory/blank-edge.svg');
  --obs-upper-day: url('assets/world-rework/observatory/solar-observatory/upper-day.svg');
  --obs-upper-night: url('assets/world-rework/observatory/solar-observatory/upper-night.svg');
  --obs-side-day: url('assets/world-rework/observatory/solar-observatory/side-day.svg');
  --obs-side-night: url('assets/world-rework/observatory/solar-observatory/side-night.svg');
  --obs-lower-day: url('assets/world-rework/observatory/solar-observatory/lower-day.svg');
  --obs-lower-night: url('assets/world-rework/observatory/solar-observatory/lower-night.svg');
}

/* Small material grip; board resize interaction remains shared. */
body[data-world-family="observatory"] .board-resize-handle {
  background: url("assets/handles/observatory.svg") center / contain no-repeat;
}

/* Star-only overlay aligns with the existing SVG; chart lines never animate. */
@media screen and (prefers-reduced-motion: no-preference) and (forced-colors: none) {
  @keyframes observatory-star-twinkle {
    0%, 100% { opacity: .3; }
    50% { opacity: 1; }
  }
  body[data-world-family='observatory'][data-theme='dark']:not([data-readability='high']) .world-surround-upper::after {
    content: '';
    position: absolute;
    pointer-events: none;
    left: 50%;
    bottom: 0;
    width: min(100%, calc(112px * 840 / 122));
    aspect-ratio: 840 / 122;
    transform: translateX(-50%);
    background: #e5f5ff;
    mask-image: var(--obs-twinkle-mask);
    filter: drop-shadow(0 0 3px #bddfff);
    animation: observatory-star-twinkle 6s ease-in-out infinite;
  }
  body[data-world-family='observatory'][data-world-motif='lunar-atlas'] {
    --obs-twinkle-mask: radial-gradient(circle at 54.04762% 55.73770%, #000 0 1px, transparent 4px), radial-gradient(circle at 68.92857% 19.67213%, #000 0 1px, transparent 4px), radial-gradient(circle at 89.88095% 59.01639%, #000 0 1px, transparent 4px);
  }
  body[data-world-family='observatory'][data-world-motif='constellation-study'] {
    --obs-twinkle-mask: radial-gradient(circle at 5.95238% 54.91803%, #000 0 1px, transparent 4px), radial-gradient(circle at 26.30952% 18.03279%, #000 0 1px, transparent 4px), radial-gradient(circle at 77.38095% 22.13115%, #000 0 1px, transparent 4px);
  }
  body[data-world-family='observatory'][data-world-motif='solar-observatory'] {
    --obs-twinkle-mask: radial-gradient(circle at 5.23810% 45.08197%, #000 0 1px, transparent 4px), radial-gradient(circle at 23.33333% 20.49180%, #000 0 1px, transparent 4px), radial-gradient(circle at 29.28571% 45.90164%, #000 0 1px, transparent 4px);
  }
}