#adventure-layer {
    position: absolute; 
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5000; 
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-family: 'Courier New', monospace;
}

body.adventure-mode #input-box {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    padding: 8px !important;
    z-index: 6000 !important; 
    
    position: absolute !important; 
    bottom: 50px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    
    width: 300px !important;
    background: rgba(0, 0, 0, 0.9) !important;
    border: 2px solid var(--accent) !important;
    box-shadow: 0 0 30px rgba(0, 217, 255, 0.4) !important;
}

/* Disable input visual when disabled */
body.adventure-mode #input-box:disabled {
    opacity: 0.5 !important;
    border-color: #444 !important;
    cursor: not-allowed;
}

body.adventure-mode #input-box:focus {
    outline: none;
    border-color: #fff !important;
}

body.adventure-mode #hud-stats,
body.adventure-mode #timer,
body.adventure-mode #word-display,
body.adventure-mode #combo-container,
body.adventure-mode #hud-commands {
    opacity: 0 !important;
    pointer-events: none !important;
}

#adv-grid {
    display: grid;
    width: 500px;
    height: 500px;
    gap: 4px;
    background: #111;
    border: 2px solid #333;
    padding: 10px;
    box-shadow: 0 0 50px rgba(0, 217, 255, 0.1);
    position: relative;
    z-index: 5001;
    margin-bottom: 70px;
}

/* GENERAL TILE STYLE */
.adv-tile {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    background: #1a1a1a;
    border: 1px solid #333;
    color: #666;
    box-shadow: inset 0 0 5px rgba(0,0,0,0.5);
    cursor: default;
    user-select: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.adv-tile.adv-void {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    pointer-events: none;
}

/* FOG OF WAR */
.adv-tile.adv-fog {
    background: #0a0a0a !important;
    border-color: #222 !important;
    color: transparent !important; 
    text-shadow: none !important;
    box-shadow: none !important;
}
.adv-tile.adv-fog::after {
    content: '';
    display: block;
    width: 20%;
    height: 20%;
    background: #151515;
    border-radius: 50%;
}

/* SMOOTH PLAYER SPRITE */
#adv-player-sprite {
    position: absolute;
    top: 0; 
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--accent);
    color: #000;
    font-size: 1.5rem;
    font-weight: bold;
    box-shadow: 0 0 25px var(--accent);
    z-index: 20;
    transition: transform 0.15s ease-out, width 0.15s ease-out, height 0.15s ease-out;
    pointer-events: none;
}

/* PHASING EFFECT */
#adv-player-sprite.adv-player-phasing {
    background: #bd00ff !important;
    box-shadow: 0 0 30px #bd00ff !important;
    color: #fff !important;
    animation: phase-pulse 0.5s infinite alternate;
}

@keyframes phase-pulse {
    from { filter: brightness(1); }
    to { filter: brightness(1.5); }
}

/* TILE TYPES */
.adv-enemy { 
    color: #ff3366; 
    border-color: #ff3366; 
    box-shadow: inset 0 0 10px rgba(255, 51, 102, 0.2);
    animation: adv-pulse 1s infinite; 
}

.adv-loot { 
    color: #ffd700; 
    border-color: #ffd700;
    box-shadow: inset 0 0 10px rgba(255, 215, 0, 0.2);
    text-shadow: 0 0 5px #ffd700; 
}

.adv-treasure {
    color: #fff;
    background: #554400;
    border-color: #ffd700;
    box-shadow: 0 0 15px #ffd700;
    text-shadow: 0 0 5px #fff;
}

.adv-exit { 
    border: 2px solid #fff; 
    color: #fff; 
    background: #333;
    box-shadow: 0 0 10px rgba(255,255,255,0.3);
}

.adv-elite {
    color: #ff0055;
    text-shadow: 0 0 5px #ff0055;
    font-weight: bold;
}

.adv-heal {
    color: #00ff00;
    text-shadow: 0 0 5px #00ff00;
}

.adv-wormhole-spin {
    color: #00d9ff;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: spin 3s infinite linear;
    text-shadow: 0 0 8px #00d9ff;
}

@keyframes spin { 
    from { transform: rotate(0deg); } 
    to { transform: rotate(360deg); } 
}

/* LOCKED TILE */
.adv-locked {
    border: 2px dashed #ff3300;
    color: #ff3300;
    background: #220500;
    font-weight: bold;
    text-shadow: 0 0 5px #f00;
}
/* When cleared, it looks like an open door (darker) */
.adv-tile.adv-locked.adv-cleared {
    border: 1px solid #444;
    color: #444;
    background: #080808;
    border-style: solid;
    text-shadow: none;
}

/* CLEARED ROOMS */
.adv-cleared {
    background: #080808; 
    color: #222; 
    border-color: #222; 
}

#adv-header { margin-bottom: 8px; text-align: center; z-index: 5001; position: absolute; top: 110px; left: 20px; }
#adv-header h2 { color: var(--accent); margin: 0; font-size: 2rem; letter-spacing: 4px; }
.adv-cmd-hint { color: #666; font-size: 0.9rem; width: 500px; padding: 8px; text-align: center; font-size: 1.3rem; border: 2px solid var(--accent);}

body.steam-deck-mode.adventure-mode .adv-cmd-hint { position: absolute; width: 380px; top: 0; padding: 6px; font-size: 1.2rem;}

/* --- HEART SYSTEM STYLING --- */
#adv-lives {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    height: 40px;
}

.adv-heart-svg {
    width: 28px;
    height: 28px;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* FULL HEART */
.heart-full {
    fill: #ff3366;
    filter: drop-shadow(0 0 8px rgba(255, 51, 102, 0.8));
    animation: heart-beat 2s infinite ease-in-out;
}

/* EMPTY HEART */
.heart-empty {
    fill: #1a0505;
    stroke: #4a1111;
    stroke-width: 2px;
    transform: scale(0.85);
    filter: drop-shadow(0 0 2px rgba(0,0,0,0.8));
}

@keyframes heart-beat {
    0% { transform: scale(1); }
    5% { transform: scale(1.1); }
    10% { transform: scale(1); }
    15% { transform: scale(1.1); }
    50% { transform: scale(1); }
    100% { transform: scale(1); }
}

/* Combat Overlay - Transitions managed by JS */
#adv-encounter-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.95);
    z-index: 5002;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    will-change: transform, opacity;
}

#adv-target-word {
    font-size: 4rem; color: #fff; letter-spacing: 5px; margin-bottom: 30px;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.8);
}

#adv-timer-container { width: 400px; height: 8px; background: #220000; border: 1px solid #ff3366; }
#adv-timer-bar { width: 100%; height: 100%; background: #ff3366; transition: width 0.02s linear; }

@keyframes adv-pulse {
    0% { opacity: 0.6; } 50% { opacity: 1; } 100% { opacity: 0.6; }
}

#adventure-layer {
    transform-origin: center center;
}

.adventure-enter-anim {
    animation: sector-boot 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes sector-boot {
    0% {
        opacity: 0;
        transform: scale(1.1) perspective(500px) rotateX(10deg);
        filter: brightness(2) blur(5px);
    }
    30% {
        opacity: 1;
        filter: brightness(1.5) blur(0px);
    }
    100% {
        transform: scale(1) perspective(500px) rotateX(0deg);
        filter: brightness(1);
    }
}

#adventure-reward-screen {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 10, 20, 0.98);
    z-index: 5000;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(5px);
}

#adv-reward-container {
    display: flex;
    gap: 30px;
}

/* Rarity Colors */
.rarity-common { border-color: #aaa; }
.rarity-common .adv-reward-rarity { color: #aaa; }

.rarity-uncommon { border-color: #2ed573; }
.rarity-uncommon .adv-reward-rarity { color: #2ed573; }

.rarity-rare { border-color: #00d9ff; }
.rarity-rare .adv-reward-rarity { color: #00d9ff; }

.rarity-epic { border-color: #bd00ff; }
.rarity-epic .adv-reward-rarity { color: #bd00ff; }

.rarity-legendary { border-color: #ffd700; }
.rarity-legendary .adv-reward-rarity { color: #ffd700; }