.construction-thought {
  position: fixed;
  z-index: 70;
  top: 47%;
  right: clamp(34px, 7vw, 118px);
  width: min(50vw, 820px);
  max-width: calc(100vw - 72px);
  padding: .36em .18em .44em .36em;
  color: rgba(255, 255, 255, .97);
  font-family: "I.MingCP", "Noto Serif TC", "Songti TC", "PMingLiU", serif;
  font-size: clamp(23px, 2.45vw, 40px);
  font-weight: 600;
  line-height: 1.82;
  letter-spacing: .16em;
  text-align: left;
  text-shadow:
    0 0 3px rgba(255, 255, 255, .84),
    0 0 10px rgba(244, 248, 255, .52),
    0 2px 8px rgba(0, 0, 0, .68);
  opacity: 0;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}

/* Narrative Ming text keeps only a faint white outer glow, never a dark shadow. */
.construction-thought,
.construction-warning-message {
  text-shadow:
    0 0 2px rgba(255, 255, 255, .55),
    0 0 .28em rgba(255, 255, 255, .32) !important;
}

/* Project-wide typography rule: text stays flat and shadow-free. */
*,
*::before,
*::after {
  text-shadow: none !important;
}

.construction-thought[hidden],
.construction-vision-flash[hidden],
.construction-blackout[hidden] { display: none; }

.construction-thought.is-visible { opacity: 1; }
.construction-thought.is-ready.is-dismissible {
  cursor: pointer;
  pointer-events: auto;
}
.construction-thought.is-ready.is-dismissible:focus-visible { outline: none; }
.construction-thought p { margin: 0; }

.construction-thought [data-thought-character] {
  display: inline-block;
  opacity: 0;
  filter: blur(4px);
  transform: translateY(.22em);
  animation: construction-thought-character .72s cubic-bezier(.2, .72, .25, 1) forwards;
  animation-delay: calc(.35s + var(--character-index) * .12s + var(--character-extra-delay, 0ms));
}

.construction-thought-link {
  margin: 0;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-decoration-line: underline;
  text-decoration-thickness: .055em;
  text-underline-offset: .18em;
  text-shadow: inherit;
  cursor: default;
  pointer-events: none;
  -webkit-tap-highlight-color: transparent;
}

.construction-thought.is-ready .construction-thought-link:not(:disabled) {
  cursor: pointer;
  pointer-events: auto;
}

.construction-thought.is-ready .construction-thought-link:hover {
  color: #fff;
  outline: none;
  text-shadow:
    0 0 4px rgba(255, 255, 255, 1),
    0 0 15px rgba(255, 255, 255, .82),
    0 2px 8px rgba(0, 0, 0, .68);
}

.construction-thought.is-ready .construction-thought-link:focus-visible {
  color: #fff;
  outline: 1px solid rgba(255, 255, 255, .68);
  outline-offset: .14em;
  text-shadow:
    0 0 4px rgba(255, 255, 255, 1),
    0 0 15px rgba(255, 255, 255, .82),
    0 2px 8px rgba(0, 0, 0, .68);
}

.construction-thought.is-dismissing {
  pointer-events: none;
  animation: construction-thought-dismiss .48s ease-in-out forwards;
}

.construction-thought--after {
  top: 53%;
  width: min(52vw, 860px);
}

.construction-vision-flash {
  position: fixed;
  z-index: 80;
  inset: 0;
  background: #fff;
  mix-blend-mode: difference;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--vision-duration, .6s) cubic-bezier(.45, 0, .55, 1);
  will-change: opacity;
}

.construction-vision-flash.is-active { pointer-events: auto; }
.construction-vision-flash.is-negative { opacity: 1; }

.construction-blackout {
  position: fixed;
  z-index: 90;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 8vw;
  background: #000;
  opacity: 0;
  pointer-events: none;
  transition: opacity 1s cubic-bezier(.4, 0, .2, 1);
}

.construction-blackout.is-visible {
  opacity: 1;
  pointer-events: auto;
}

.construction-blackout.is-returning {
  opacity: 0;
  transition-duration: 2s;
}

.construction-warning-message {
  max-width: 92vw;
  margin: 0;
  padding: .32em .5em .44em;
  border: 0;
  color: rgba(255, 255, 255, .98);
  background: transparent;
  font-family: "I.MingCP", "Noto Serif TC", "Songti TC", "PMingLiU", serif;
  font-size: clamp(42px, 8vw, 122px);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: .34em;
  text-align: center;
  text-indent: .34em;
  text-shadow: 0 0 5px rgba(255, 255, 255, .7), 0 0 24px rgba(255, 255, 255, .28);
  cursor: default;
  pointer-events: none;
  -webkit-tap-highlight-color: transparent;
}

.construction-warning-message [data-warning-character] {
  display: inline-block;
  opacity: 0;
  filter: blur(12px);
  transform: translateY(.28em) scale(.96);
}

.construction-warning-message.is-revealing [data-warning-character] {
  animation: construction-warning-character .84s cubic-bezier(.16, .75, .24, 1) forwards;
  animation-delay: calc(.2s + var(--warning-index) * .36s);
}

.construction-warning-message.is-ready:not(:disabled) {
  cursor: pointer;
  pointer-events: auto;
}

.construction-warning-message.is-ready:hover {
  outline: none;
  text-shadow: 0 0 7px #fff, 0 0 32px rgba(255, 255, 255, .42);
}

.construction-warning-message.is-ready:focus-visible {
  outline: 1px solid rgba(255, 255, 255, .58);
  outline-offset: .18em;
  text-shadow: 0 0 7px #fff, 0 0 32px rgba(255, 255, 255, .42);
}

.construction-warning-message.is-dismissing {
  pointer-events: none;
  animation: construction-warning-dismiss .45s ease-in forwards;
}

body.is-construction-vision-active .limited-panorama-shell { pointer-events: none; }

body.is-construction-vision-flashing .limited-panorama-shell {
  animation: construction-vision-shake .12s steps(2, end) infinite;
  transform-origin: 50% 50%;
  will-change: transform;
}

@keyframes construction-thought-character {
  to { opacity: 1; filter: blur(0); transform: translateY(0); }
}

@keyframes construction-thought-dismiss {
  from { opacity: 1; filter: blur(0); }
  to { opacity: 0; filter: blur(7px); transform: translateX(16px); }
}

@keyframes construction-warning-character {
  to { opacity: 1; filter: blur(0); transform: translateY(0) scale(1); }
}

@keyframes construction-warning-dismiss {
  from { opacity: 1; filter: blur(0); }
  to { opacity: 0; filter: blur(10px); transform: scale(1.035); }
}

@keyframes construction-vision-shake {
  0% { transform: translate(-2px, 1px) scale(1.008); }
  25% { transform: translate(2px, -1px) scale(1.008); }
  50% { transform: translate(-1px, -2px) scale(1.008); }
  75% { transform: translate(1px, 2px) scale(1.008); }
  100% { transform: translate(-2px, 1px) scale(1.008); }
}

@media (max-width: 720px) {
  .construction-thought {
    top: auto;
    right: 20px;
    bottom: clamp(88px, 18vh, 170px);
    width: min(86vw, 650px);
    max-width: calc(100vw - 40px);
    font-size: clamp(20px, 5.6vw, 30px);
    line-height: 1.72;
  }

  .construction-thought--after { bottom: clamp(92px, 21vh, 190px); }
  .construction-warning-message { font-size: clamp(38px, 12vw, 74px); letter-spacing: .2em; text-indent: .2em; }
}

@media (prefers-reduced-motion: reduce) {
  .construction-thought [data-thought-character],
  .construction-warning-message [data-warning-character] {
    opacity: 1;
    filter: none;
    transform: none;
    animation: none;
  }

  .construction-vision-flash { display: none; }
  body.is-construction-vision-flashing .limited-panorama-shell { animation: none; transform: none; }
  .construction-thought.is-dismissing,
  .construction-warning-message.is-dismissing { animation: none; opacity: 0; }
}
