/* La Tour — ton de la page (rouge de l'Avant-garde), panneau de l'ancienne Tour et
   salle Daito. */

.tour {
  --vanguard: #e06a45;
  --vanguard-hi: #f2a37f;
  --city: #9cc8ea;
  --page-accent: var(--vanguard);
  --page-accent-hi: var(--vanguard-hi);
}
.tour ::selection { background: rgba(224, 106, 69, .35); }

/* ---------- Héros ---------- */
.tour .hero-title span:last-child { margin-top: .18em; font-size: .36em; font-weight: 500; letter-spacing: .3em; color: var(--vanguard-hi); }
.tour .hero-status { border-left-color: var(--vanguard); transition: border-color .3s; }
.tour a.hero-status:hover { border-left-color: #fff; }
.tour .hero-status.is-here .status-value { color: var(--exotic); }

/* ---------- L'ancienne Tour ---------- */
.old-tower { margin: clamp(48px, 6vw, 80px) 0 0; }

/* ---------- Salle Daito ---------- */
.daito { width: min(620px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; overflow: auto; color: var(--ink); background: #0a0d14; border: 1px solid var(--line-strong); box-shadow: 0 40px 100px -20px #000; }
.daito::backdrop { background: rgba(3, 5, 11, .82); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.daito .close { position: absolute; top: 10px; right: 10px; z-index: 2; width: 40px; height: 40px; cursor: pointer; background: rgba(6, 10, 22, .7); border: 1px solid var(--line-strong); color: #fff; font-size: 1.3rem; }
.daito .close:hover { background: #fff; color: var(--night); }
.daito-screens { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 34px 26px 26px; background: linear-gradient(180deg, #11151f, #0a0d14); border-bottom: 1px solid var(--line); }
.daito-screens span {
  display: grid; place-items: center; aspect-ratio: 4 / 3; border: 1px solid rgba(255, 90, 90, .35);
  background: radial-gradient(ellipse at 50% 40%, rgba(255, 70, 70, .22), rgba(255, 70, 70, .04) 70%), #150b0d;
  font-size: clamp(1rem, 3vw, 1.5rem); font-weight: 800; letter-spacing: .08em; text-transform: lowercase; color: #ff6f6f;
  text-shadow: 0 0 14px rgba(255, 80, 80, .7); animation: daito-flicker 5s steps(1) infinite;
}
.daito-screens span:nth-child(2) { animation-delay: -1.7s; }
.daito-screens span:nth-child(3) { animation-delay: -3.1s; }
@keyframes daito-flicker { 0%, 92%, 100% { opacity: 1; } 93% { opacity: .55; } 95% { opacity: .9; } 96% { opacity: .5; } }
.daito-body { padding: 22px 26px 28px; }
.daito-body h2 { margin: 6px 0 10px; font-size: clamp(1.5rem, 3.4vw, 2rem); font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.daito-body > p:not(.tag) { margin: 0 0 18px; color: #cdd3e6; }
.daito-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.daito-scan { min-height: 1.5em; margin: 16px 0 0 !important; font-family: var(--font-lore); font-style: italic; font-size: 1.15rem; line-height: 1.4; color: var(--pearl) !important; }
.daito-archie { display: flex; align-items: center; gap: 14px; margin: 16px 0 0; padding: 12px 14px; border: 1px solid var(--line); background: rgba(255, 255, 255, .03); }
.daito-archie svg { flex: none; padding: 8px; border: 1px solid rgba(255, 255, 255, .3); background: #1a1f30; color: var(--city); }
.daito-archie figcaption { font-size: .92rem; color: var(--ink); }
.daito-archie.petted svg { animation: archie-wag .5s ease-in-out 4; }
@keyframes archie-wag { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-8deg); } 75% { transform: rotate(8deg); } }
