[data-ld-part="toggle-daylight"] {
  --_bg: var(--ld-bg, #f5ecd9);
  --_surface: var(--ld-surface, #8c9a62);
  --_fg: var(--ld-fg, #1b2146);
  --_muted: var(--ld-muted, #7f97b3);
  --_accent: var(--ld-accent, #efa02c);
  --_radius: var(--ld-radius, 9999px);
  --_font: var(--ld-font, system-ui, sans-serif);
  --_space: var(--ld-space, 8px);
  --_shadow: var(--ld-shadow, 0 8px 24px rgb(27 33 70 / .2));
  --_motion: var(--ld-motion, 200ms);

  position: relative;
  display: block;
  box-sizing: border-box;
  width: min(100%, calc((100vh - 64px) * 1.6439));
  aspect-ratio: 1.6439;
  font-family: var(--_font);
  color: var(--_fg);
}

[data-ld-part="toggle-daylight"] .probe { display: none; }
[data-ld-part="toggle-daylight"] .vh {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
[data-ld-part="toggle-daylight"] .scene {
  position: absolute; top: 0; left: 0;
  display: block; width: 100%; height: 100%;
  pointer-events: none;
  image-rendering: pixelated;
}
[data-ld-part="toggle-daylight"] .hit {
  position: absolute; top: 12.121%; left: 7.373%;
  width: 85.253%; height: 75.758%;
  margin: 0; padding: 0; border: 0;
  border-radius: var(--_radius);
  background: transparent;
  cursor: grab; touch-action: pan-y;
  user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent;
}
[data-ld-part="toggle-daylight"] .hit:active { cursor: grabbing; }
[data-ld-part="toggle-daylight"] .hit:focus { outline: none; }
[data-ld-part="toggle-daylight"] .hit:focus-visible {
  outline: 2px solid var(--_accent);
  outline-offset: calc(var(--_space) * .5);
  transition: outline-offset var(--_motion) ease;
}
@media (prefers-reduced-motion: reduce) {
  [data-ld-part="toggle-daylight"] .hit:focus-visible { transition: none; }
}
:root { --paper: #f5ecd9; --ink: #1b2146; --ink-soft: rgba(27,33,70,.62); --hair: rgba(27,33,70,.16); --accent: #efa02c; }
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif;
  -webkit-font-smoothing: antialiased;
  display: flex; flex-direction: column; min-height: 100%;
}
main { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; padding: 12px 24px 10px; min-height: 0; }
[data-ld-part="toggle-daylight"] { width: min(100%, calc((100vh - 146px) * 1.6439)); }
footer {
  flex: 0 0 auto; border-top: 1px solid var(--hair); padding: 14px 24px 16px;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 18px;
  font-size: 11px; line-height: 1.6; letter-spacing: .06em; color: var(--ink-soft);
}
footer .kicker { text-transform: uppercase; letter-spacing: .18em; font-size: 10px; color: rgba(27,33,70,.5); }
footer .name { font-weight: 600; color: var(--ink); }
footer .sep { color: var(--hair); }
@media (max-width: 640px) {
  main { padding: 12px 16px 10px; }
  [data-ld-part="toggle-daylight"] { width: min(100%, calc((100vh - 150px) * 1.6439)); }
  footer { font-size: 10px; padding: 12px 16px 14px; gap: 6px 12px; }
}