/* index.php */
html,
body { margin: 0; height: 100%; overflow: hidden; background: #dde8ec; }
canvas { display: block; width: 100vw; height: 100vh; touch-action: none; }
#loader { position: fixed; inset: 0; z-index: 10; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; background: #dde8ec; transition: opacity .8s ease; }
#loader.done { opacity: 0; pointer-events: none; }
#loader .logo img { display: block; height: 48px; width: auto; }
#loader .bar { width: 220px; height: 2px; background: rgba(0, 0, 0, .1); border-radius: 2px; overflow: hidden; }
#loader .bar i { display: block; height: 100%; width: 0%; background: #1b1d1c; transition: width .2s ease; }
#loader .pct { color: #5d625f; font: 13px/1 'Pretendard Variable', -apple-system, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.marker { position: fixed; left: 0; top: 0; width: 44px; height: 44px; padding: 0; border: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.marker[hidden] { display: none; }
.marker::before { content: ''; position: absolute; inset: 14px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 3px rgba(20, 40, 60, .55), 0 2px 6px rgba(0, 0, 0, .4); transition: transform .15s; }
.marker:hover::before,
.marker:focus-visible::before { transform: scale(1.25); }
.marker:focus { outline: none; }
.marker:focus-visible { outline: 2px solid #fff; outline-offset: -2px; border-radius: 50%; }
.marker .pulse { position: absolute; inset: 14px; border-radius: 50%; border: 2px solid #fff; animation: marker-pulse 1.8s ease-out infinite; pointer-events: none; }
@keyframes marker-pulse {
  from { transform: scale(1); opacity: .9; }
  to { transform: scale(2.8); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .marker .pulse { animation: none; opacity: 0; }
}
.marker::after { content: attr(data-label); position: absolute; left: 50%; bottom: 100%; transform: translateX(-50%); padding: 5px 9px; border-radius: 6px; background: rgba(20, 30, 40, .85); color: #fff; font: 12px/1 'Pretendard Variable', -apple-system, system-ui, sans-serif; white-space: nowrap; opacity: 0; transition: opacity .15s; pointer-events: none; }
.marker:hover::after,
.marker:focus-visible::after { opacity: 1; }