/* ════════════════════════════════════════════════════════════════════
   LA CAPA DE ARTE DEL MAPA AÉREO — lo poco que cambia en la interfaz

   El grano lo pone ahora el revelado, dentro del propio lienzo, con la
   luz de la escena (más en las sombras, menos en el papel). El velo
   blanco de wow.js encima sobraba: dos granos son bruma.

   Y las chapas y la ficha se apoyan en un vidrio esmerilado: sobre un
   relieve con sombras de verdad, un fondo plano flotaba.
   ════════════════════════════════════════════════════════════════════ */
.wow-grain { display: none !important; }

/* Los rótulos que se mueven con el mapa —chapas de finca y nombres de
   pueblo— se colocan SOLO con transform (ver project() en la página):
   left/top a cero y una capa propia para el compositor. Sin desenfoque de
   fondo en lo que se mueve: el navegador lo rehacía en cada fotograma. */
.tw-marker, .tw-town {
    left: 0;
    top: 0;
    will-change: transform;
}
.tw-marker .tag {
    box-shadow: 0 6px 18px -6px rgba(26, 26, 26, .32),
                inset 0 1px 0 rgba(255, 255, 255, .55);
}

.tw-hint {
    background: rgba(248, 245, 235, .62);
    -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
}
body.tw-night .tw-hint { background: rgba(14, 18, 28, .45); }

.tw-weather {
    background: rgba(248, 245, 235, .78);
    -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
}
body.tw-night .tw-weather {
    background: rgba(14, 18, 28, .6);
    color: rgba(232, 233, 226, .85);
    border-color: rgba(184, 151, 96, .4);
}

/* la fase de la luna de esta noche, encima de la cartela del tiempo */
.tw-luna {
    position: fixed;
    right: 44px;
    bottom: 182px;
    z-index: 20;
    pointer-events: none;
    padding: 7px 12px;
    border: 1px solid rgba(184, 151, 96, .4);
    background: rgba(14, 18, 28, .6);
    -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
    font-family: 'Quicksand', sans-serif;
    font-size: 9px;
    letter-spacing: .2em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(232, 233, 226, .85);
}
@media (max-width: 720px) { .tw-luna { display: none; } }