/* Healing Visualizer — Immersive Full-screen Mode */

body {
    background-color: #0f172a !important;
    margin: 0;
    padding: 0;
    overflow: hidden;
    touch-action: none;
}

#bgCanvas {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 0;
    filter: blur(40px);
    opacity: 0.6;
}

.healing-container {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 1;
}

#healingCanvas {
    display: block;
    background: transparent;
}

.ui-overlay {
    position: fixed;
    bottom: 80px;
    left: 0;
    width: 100%;
    text-align: center;
    z-index: 10;
    pointer-events: none;
    color: #22d3ee;
    font-family: 'Noto Sans KR', sans-serif;
    opacity: 0.8;
    animation: healing-pulse 3s infinite ease-in-out;
}

.audio-controls {
    position: fixed;
    top: 25px; right: 25px;
    z-index: 100;
    pointer-events: auto;
}

.btn-audio {
    background: rgba(34, 211, 238, 0.1);
    border: 1px solid rgba(34, 211, 238, 0.5);
    color: #22d3ee;
    padding: 10px 20px;
    border-radius: 40px;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 500;
    backdrop-filter: blur(10px);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.btn-audio.active {
    background: #22d3ee;
    color: #0f172a;
    box-shadow: 0 0 20px rgba(34, 211, 238, 0.4);
}

@keyframes healing-pulse {
    0%, 100% { opacity: 0.3; transform: scale(0.98); }
    50%       { opacity: 0.7; transform: scale(1); }
}

/* Hide standard page chrome */
.navbar, .main-footer, .ads-pc-wrapper { display: none !important; }

/* Mobile ad slot */
.ads-mobile-wrapper {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    width: 320px;
    height: 50px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.8);
    border-top: 1px solid rgba(34, 211, 238, 0.3);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.6);
}

main.container { max-width: none; padding: 0; margin: 0; }

/* Inline-style external (RFC-V2 finalisation) */
.healing-hint-toggle { margin-top: 8px; }
.healing-hint-panel  {
    text-align: left;
    margin-top: 8px;
    max-width: 500px;
}
