/* Wymuszone ukrycie nagłówka, które nadpisuje .guest-nav-active z header.css */
.main-header.guest-nav-active,
.main-header { 
    display: none !important; 
}

/* Upewniamy się, że gra podjeżdża na samą górę */
#game-wrapper { 
    top: 0 !important; 
    height: 100svh !important; 
}
/* AGRESYWNY RESET */
body, html { margin: 0 !important; padding: 0 !important; overflow: hidden !important; }
.container { max-width: 100% !important; padding: 0 !important; margin: 0 !important; }
footer, .site-footer, #main-footer, .footer, #mobile-floating-bell, .floating-bell-wrapper { 
    display: none !important; 
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

#game-wrapper {
    cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" fill="%234a3b32"/></svg>') 12 12, auto;
}

#game-wrapper {
    --noir-dark: #1f1913; --noir-wood: #3e3129; --noir-paper: #f4ebd8; 
    --noir-paper-dark: #e6d5b8; --noir-accent: #8b2626; --noir-ink: #1a1a1a;
    --highlight: #ffeaa7;
    
    position: fixed; top: 60px; left: 0; right: 0; bottom: 0; z-index: 50;
    background: radial-gradient(circle at center, #4a3b32 0%, #1f1913 100%);
    display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
    overflow: hidden; color: var(--noir-ink); user-select: none;
    font-family: 'Courier New', Courier, monospace; 
}

.card-controls-bar {
    width: 100%; display: flex; justify-content: center !important; align-items: center;
    padding: 10px 20px; background: var(--noir-paper-dark); 
    border-bottom: 2px dashed #b8a581; box-sizing: border-box; 
    border-radius: 5px 5px 0 0; position: relative !important; min-height: 56px;
}
.control-btn {
    background: var(--noir-paper); border: 2px solid var(--noir-wood); color: var(--noir-wood);
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    padding: 6px; border-radius: 50%; box-shadow: inset 0 0 5px rgba(0,0,0,0.1), 0 2px 5px rgba(0,0,0,0.3);
    transition: all 0.2s; width: 36px; height: 36px; margin: 0;
}
.control-btn:hover { background: var(--noir-wood); color: var(--noir-paper); transform: scale(1.1); }
.control-btn.muted { color: #999; border-color: #999; }
.btn-exit { border-color: var(--noir-accent); color: var(--noir-accent); position: absolute !important; left: 15px !important; top: 50%; transform: translateY(-50%); margin: 0; }
.btn-exit:hover { background: var(--noir-accent); color: var(--noir-paper); transform: translateY(-50%) scale(1.1); }
.volume-group { display: flex; align-items: center; gap: 10px; }
.vol-slider { width: 80px; accent-color: var(--noir-wood); cursor: pointer; }

#game-wrapper .overlay-screen { 
    position: absolute; inset: 0; background: rgba(0,0,0,0.8); 
    display: flex; align-items: center; justify-content: center; 
    z-index: 1000; padding: 15px; backdrop-filter: blur(5px); 
    overflow-y: auto;
}

#game-wrapper .menu-card { 
    background: #d4b572; 
    border-radius: 5px 20px 5px 5px; 
    box-shadow: 10px 15px 30px rgba(0,0,0,0.8), inset 0 0 50px rgba(139, 69, 19, 0.2); 
    display: flex; flex-direction: column; max-width: 800px; width: 100%; 
    border: 1px solid #b89a56; position: relative;
    max-height: 95vh;
}

#game-wrapper .menu-card::before {
    content: 'AKTA SPRAWY'; position: absolute; top: -30px; left: 20px;
    background: #d4b572; padding: 5px 20px; border-radius: 10px 10px 0 0; font-weight: bold;
    border: 1px solid #b89a56; border-bottom: none; box-shadow: inset 0 10px 10px -10px rgba(0,0,0,0.2);
}

#game-wrapper .card-content { display: flex; flex-direction: row; width: 100%; flex: 1; background: var(--noir-paper); margin: 10px; border-radius: 2px; box-shadow: inset 0 0 15px rgba(0,0,0,0.1); width: calc(100% - 20px); overflow-y: auto; }
#game-wrapper .menu-left { 
    padding: 30px; 
    flex: 1.2; 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    text-align: center; 
    /* NOWE: Pozwala na scrollowanie, zapobiega ucinaniu */
    overflow-y: auto; 
    min-height: 0;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}
/* NOWE: Ukrywa pasek scrolla w Chrome/Safari/Edge zachowując funkcję scrollowania */
#game-wrapper .menu-left::-webkit-scrollbar { 
    display: none; 
}#game-wrapper .menu-right { padding: 30px; flex: 0.8; border-left: 2px solid #dcd0b8; transition: opacity 0.3s;}

#game-wrapper .menu-left h1 { font-size: 2.2rem; margin:0 0 10px 0; color: var(--noir-dark); text-transform: uppercase; font-weight: 900; letter-spacing: -1px; text-decoration: underline; text-decoration-style: double;}
#game-wrapper .menu-left p { font-size: 1rem; color: #555; margin-bottom: 20px; font-weight: bold; max-width: 350px;}

/* MODE SELECTOR */
.mode-selector { display: flex; gap: 10px; margin-bottom: 20px; width: 100%; max-width: 350px; background: var(--noir-paper-dark); padding: 5px; border-radius: 5px; border: 1px solid #b8a581;}
.mode-btn { flex: 1; padding: 10px 5px; font-size: 0.9rem; font-weight: bold; border-radius: 3px; border: none; background: transparent; cursor: pointer; color: var(--noir-wood); transition: 0.2s; font-family: 'Courier New', monospace;}
.mode-btn.active { background: var(--noir-wood); color: var(--noir-paper); box-shadow: 0 2px 10px rgba(0,0,0,0.2); }
.group-naming-area { display: none; flex-direction: column; gap: 10px; width: 100%; max-width: 300px; margin-bottom: 20px; }
.group-input-wrapper { display: flex; align-items: center; background: #fff; border: 2px solid #b8a581; padding: 5px 15px; }
.group-input-wrapper i { margin-right: 10px; font-style: normal; font-weight: 900; font-size: 1.2rem;}
.group-name-input { border: none; background: transparent; outline: none; font-size: 1.1rem; font-weight: bold; width: 100%; color: var(--noir-ink); text-align: center; font-family: 'Courier New', monospace;}

#game-wrapper .time-selector { margin-bottom: 20px; width: 100%; max-width: 300px;}
#game-wrapper .time-selector p { margin: 0 0 8px 0; font-size: 0.85rem; font-weight: bold; color: var(--noir-wood);}
#game-wrapper .time-btns { display: flex; gap: 8px; justify-content: center; width: 100%;}
#game-wrapper .t-btn { flex: 1; padding: 10px 0; font-size: 1.1rem; font-weight: bold; border-radius: 3px; background: var(--noir-paper-dark); color: var(--noir-wood); border: 2px solid #b8a581; cursor: pointer; transition: 0.2s; font-family: 'Courier New', monospace;}
#game-wrapper .t-btn.active { background: var(--noir-wood); color: var(--noir-paper); border-color: var(--noir-dark); transform: scale(1.05); }

#game-wrapper .player-profile-wrapper { display: flex; align-items: center; background: #fff; border: 2px solid #b8a581; padding: 5px; width: 100%; max-width: 300px; margin: 0 auto 20px auto; }
#game-wrapper .avatar-circle { width: 40px; height: 40px; border-radius: 50%; background: #eee; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; overflow: hidden; margin-right: 12px; border: 1px solid #ccc; }
#game-wrapper .name-input { border: none; background: transparent; outline: none; font-size: 1.1rem; font-weight: bold; color: var(--noir-ink); width: 100%; font-family: 'Courier New', monospace; text-align: center;}

#game-wrapper .btn-start { 
    width: 100%; max-width: 250px; padding: 15px; font-size: 1.3rem; font-weight: 900; 
    background: transparent; color: var(--noir-accent); 
    border: 4px solid var(--noir-accent); border-radius: 5px; 
    cursor: pointer; text-transform: uppercase; transition: 0.2s;
    font-family: 'Courier New', monospace; letter-spacing: 2px; transform: rotate(-2deg);
}
#game-wrapper .btn-start:hover { background: var(--noir-accent); color: white; transform: rotate(0deg) scale(1.05); }

/* Instructions in Menu */
.menu-instructions { text-align: left; background: rgba(255,255,255,0.5); padding: 20px; border-radius: 5px; border: 1px solid #dcd0b8; }
.menu-instructions h3 { color: var(--noir-accent); margin-top: 0; margin-bottom: 10px; font-weight: 900; text-transform: uppercase;}
.menu-instructions ul { padding-left: 20px; margin: 0; color: #555; font-size: 0.9rem; font-weight: bold;}
.menu-instructions li { margin-bottom: 8px;}

/* Hall of fame */
#game-wrapper .hof-title { font-size: 1.2rem; margin-top:0; margin-bottom: 15px; font-weight: 900; text-align: center; text-transform: uppercase; border-bottom: 1px solid #ccc; padding-bottom: 5px;}
#game-wrapper .hof-list { list-style: none; padding: 0; margin: 0; flex-grow: 1; overflow-y: auto; max-height: 250px; padding-right: 5px; scroll-behavior: smooth; }
#game-wrapper .hof-item { display: flex; justify-content: space-between; padding: 8px 12px; background: rgba(255,255,255,0.5); border-radius: 5px; margin-bottom: 5px; font-weight: bold; font-size: 0.95rem; border: 1px solid #dcd0b8; transition: all 0.3s ease; }
#game-wrapper .hof-item span:nth-child(2) { color: var(--noir-paper); background: var(--noir-wood); padding: 2px 8px; border-radius: 4px; }
#game-wrapper .hof-item.rank-0 { background: linear-gradient(135deg, #dfc686, #d4b572); border-color: #b89a56; transform: scale(1.02); margin-bottom: 10px; box-shadow: 0 4px 10px rgba(0,0,0,0.15);}
#game-wrapper .hof-item.current-player-score { border-color: var(--noir-accent); background: rgba(139, 38, 38, 0.1); transform: scale(1.03); box-shadow: 0 4px 10px rgba(0,0,0,0.1); z-index: 10; position: relative; font-weight: 900; }
#game-wrapper .hof-empty { text-align: center; color: #777; font-style: italic; padding: 10px; }

/* EKRAN ODLICZANIA */
#game-wrapper #countdown-screen { flex-direction: column; background: rgba(31, 25, 19, 0.9); padding-top: 0; align-items: center !important; justify-content: center !important; }
#game-wrapper #count-name-info { text-align: center; font-size: 1.5rem; color: #e6d5b8; margin-bottom: 20px; font-weight: bold;}
#game-wrapper #count-number { font-size: clamp(3rem, 18vw, 12rem); color: #fff; margin: 0; line-height: 1; font-weight: bold; text-shadow: 5px 5px 0px var(--noir-accent); font-family: 'Impact', sans-serif; text-align: center; z-index: 10;}
@keyframes popScale { 0% { transform: scale(0.5); opacity: 0; } 50% { transform: scale(1.2); opacity: 1; } 100% { transform: scale(1); opacity: 1; } }

/* ZMIANA: Poprawione skalowanie nazw drużyn - nie będą wylewać się poza ekran */
.vs-container { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 100vw; gap: 10px; margin-bottom: 30px; position: relative; padding: 0 15px; box-sizing: border-box; }
.vs-team { font-family: 'Courier New', Courier, monospace; font-size: clamp(1.1rem, 5vw, 2.5rem); font-weight: 900; text-transform: uppercase; text-shadow: 2px 2px 0px rgba(0,0,0,0.8); z-index: 5; color: #fff; flex: 1; text-align: center; word-wrap: break-word; white-space: normal; line-height: 1.2; }
.vs-team-a { animation: slideInLeft 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; transform: translateX(-150%); }
.vs-team-b { animation: slideInRight 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; transform: translateX(150%); }
.vs-badge { font-size: clamp(2rem, 8vw, 4rem); color: var(--noir-accent); text-shadow: 2px 2px 0 #000; animation: popVs 0.5s 0.3s forwards, pulseVs 1s 0.8s infinite alternate; transform: scale(0); opacity: 0; font-family: 'Impact', sans-serif; z-index: 10; margin: 0 5px; flex-shrink: 0;}
@keyframes slideInLeft { to { transform: translateX(0); } }
@keyframes slideInRight { to { transform: translateX(0); } }
@keyframes popVs { 50% { transform: scale(1.5) rotate(-10deg); opacity: 1; } 100% { transform: scale(1) rotate(0deg); opacity: 1; } }
@keyframes pulseVs { from { text-shadow: 2px 2px 0 #000; transform: scale(1); } to { text-shadow: 4px 4px 0 var(--noir-paper), 6px 6px 0 #000; transform: scale(1.1); } }

/* LAYOUTS */
#game-wrapper .game-inner { 
    display: flex; flex-direction: column; align-items: center; justify-content: stretch; 
    width: 100%; max-width: 800px; padding: 15px 10px; flex: 1; position: relative;
    overflow: hidden; box-sizing: border-box;
}
#game-wrapper .game-inner.mirror-layout { max-width: 100%; flex-direction: column; align-items: center; gap: 0; padding: 0; }

/* SOLO HEADER */
#game-wrapper .dossier-header { 
    width: 100%; display: flex; justify-content: space-between; align-items: center; 
    padding: 10px 20px; background: var(--noir-paper); 
    box-shadow: 0 4px 6px rgba(0,0,0,0.3); border-left: 5px solid var(--noir-accent);
    margin-bottom: 10px; box-sizing: border-box; position: relative; z-index: 10; margin-top: 10px;
}
#game-wrapper .stat-box { font-size: 1.2rem; font-weight: 900; display: flex; align-items: center; gap: 10px;}
#game-wrapper .stat-box span { color: var(--noir-accent); font-size: 1.5rem; }

#game-wrapper .time-bar-container { width: 100%; height: 6px; background: #e2e8f0; margin-bottom: 10px; border-radius: 3px; overflow: hidden; box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);}
#game-wrapper .time-bar-fill { height: 100%; background: var(--noir-wood); width: 100%; transition: width 1s linear, background-color 0.3s; }

/* TEAM HUD BAR */
.hud-bar-wrapper { width: 100%; padding: 1rem; box-sizing: border-box; z-index: 100; position: relative; background: var(--noir-dark); border-bottom: 2px dashed #b8a581;}
.hud-bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; width: 100%; max-width: 1200px; margin: 0 auto; background: var(--noir-paper); border-radius: 5px; padding: 10px 20px; box-shadow: 0 5px 15px rgba(0,0,0,0.5); border: 2px solid var(--noir-wood); box-sizing: border-box; }
.hud-left { justify-self: start; display: flex; align-items: center; }
.hud-center { justify-self: center; display: flex; align-items: center; }
.hud-right { justify-self: end; display: flex; align-items: center; }
.timer-box { font-size: 1.6rem; font-weight: 900; color: var(--noir-ink); display: flex; align-items: center; justify-content: center; gap: 10px; }

.mirror-panels-container { display: flex; width: 100%; max-width: 1600px; gap: 20px; align-items: stretch; flex: 1; padding: 1rem; box-sizing: border-box; }

/* MIRROR PANELS */
.mirror-panel { flex: 1; display: flex; flex-direction: column; gap: 10px; background: var(--noir-paper); padding: 20px; border-radius: 5px; box-shadow: 2px 2px 10px rgba(0,0,0,0.4); border: 1px solid #dcd0b8; position: relative; overflow: hidden;}

.mirror-header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 10px; border-bottom: 2px solid var(--noir-wood); margin-bottom: 10px;}
.team-identity { display: flex; align-items: center; gap: 10px; }
.team-emoji { font-size: 2.5rem; }
.mirror-team-name { font-size: 1.5rem; font-weight: 900; display: flex; flex-wrap: wrap; text-transform: uppercase; color: var(--noir-ink);}
.mirror-score { font-size: 3rem; font-weight: 900; line-height: 1; font-family: 'Impact', sans-serif; display: inline-block; transition: color 0.3s; color: var(--noir-ink);}

#panel-a .mirror-team-name, #panel-a .mirror-score { color: #0284c7; } /* Noir Blue */
#panel-b .mirror-team-name, #panel-b .mirror-score { color: #b91c1c; } /* Noir Red */

/* CASE FILE */
#game-wrapper .case-file-container {
    width: 100%; background: var(--noir-paper); flex: 1; min-height: 0; margin-bottom: 5px;
    padding: 25px 25px 25px 35px; box-sizing: border-box; position: relative;
    box-shadow: 2px 2px 10px rgba(0,0,0,0.4); border: 1px solid #dcd0b8;
    display: flex; flex-direction: column; overflow-y: auto;
}

#game-wrapper .case-file-container::before {
    content: ''; position: absolute; top: -15px; left: 10px; width: 30px; height: 60px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 50'%3E%3Cpath d='M10,48 C4.5,48 2,44 2,38 L2,12 C2,7 4.5,4 8,4 C11.5,4 14,7 14,12 L14,35 C14,38 12.5,40 10,40 C7.5,40 6,38 6,35 L6,15' fill='none' stroke='%23777' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat; z-index: 10;
}
/* Hide paper clip in mirror layout as it looks messy */
.mirror-panel .case-file-container::before { display: none; }
.mirror-panel .case-file-container { padding: 15px; box-shadow: none; border: none; background: transparent;}

#game-wrapper .case-label { font-size: 0.9rem; font-weight: bold; color: #777; border-bottom: 1px solid #ccc; padding-bottom: 5px; margin-bottom: 15px; text-transform: uppercase;}

#game-wrapper .case-text { font-size: 1.5rem; line-height: 1.8; flex: 1; font-weight: bold; color: var(--noir-ink); }

.inv-word { display: inline-block; padding: 0 2px; margin: 0 1px; border-radius: 2px; transition: 0.2s; border-bottom: 1px solid transparent; cursor: pointer; }
.inv-word:hover { background: rgba(255, 234, 167, 0.4); border-bottom: 1px dashed #b8a581; }
.inv-word.investigating { background: var(--highlight); color: var(--noir-ink); box-shadow: 0 0 0 2px var(--highlight); }
.inv-word.solved { background: transparent; color: #2e7d32; text-decoration: underline; text-decoration-style: wavy; pointer-events: none;}

.normal-word { 
    display: inline; 
    cursor: pointer; 
    -webkit-tap-highlight-color: transparent !important; /* Zabija miganie na iOS i Androidzie */
    outline: none !important;
    background: transparent !important;
}
.typewriter-cursor::after { content: '|'; animation: blink 1s step-end infinite; }
@keyframes blink { 50% { opacity: 0; } }

#game-wrapper .investigation-area {
    width: 100%; background: var(--noir-wood); padding: 15px; box-sizing: border-box;
    border-radius: 5px; box-shadow: 0 -5px 15px rgba(0,0,0,0.5);
    transform: translateY(150%); transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: absolute; bottom: 0; left: 0; right: 0; z-index: 100;
}
#game-wrapper .investigation-area.active { transform: translateY(0); }

#game-wrapper .question-text { font-size: 1.1rem; font-weight: bold; color: var(--noir-paper); margin-bottom: 15px; text-align: center; text-transform: uppercase; }
#game-wrapper .question-text span { color: var(--highlight); background: rgba(255,255,255,0.1); padding: 2px 5px;}
#game-wrapper .answers-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

#game-wrapper .answer-btn { background: var(--noir-paper); border: 2px solid var(--noir-paper-dark); padding: 12px; font-size: 1rem; font-family: 'Courier New', monospace; font-weight: bold; cursor: pointer; transition: all 0.2s; text-align: center; color: var(--noir-ink); border-radius: 3px; }
#game-wrapper .answer-btn:hover { background: #fff; transform: translateY(-2px); box-shadow: 0 5px 10px rgba(0,0,0,0.3); }
#game-wrapper .answer-btn.correct { background: #e6f4ea; border-color: #2e7d32; color: #1b5e20; }
#game-wrapper .answer-btn.wrong { background: #fce8e6; border-color: #c62828; color: #b71c1c; }

#game-wrapper .feedback-stamp { position: absolute; top: 30%; left: 50%; transform: translate(-50%, -50%) rotate(-15deg); font-size: 4rem; font-weight: 900; border: 5px solid; padding: 10px 20px; text-transform: uppercase; border-radius: 10px; opacity: 0; pointer-events: none; z-index: 100; font-family: 'Impact', sans-serif; }
.stamp-correct { color: #2e7d32; border-color: #2e7d32; animation: stampAnim 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }
.stamp-wrong { color: #c62828; border-color: #c62828; animation: stampAnim 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }

@keyframes stampAnim { 0% { transform: translate(-50%, -50%) scale(3) rotate(-30deg); opacity: 0; } 50% { transform: translate(-50%, -50%) scale(0.9) rotate(-10deg); opacity: 1; } 100% { transform: translate(-50%, -50%) scale(1) rotate(-15deg); opacity: 1; } }

.floating-penalty { position: absolute; font-size: 2rem; font-weight: 900; color: #ef4444; pointer-events: none; animation: floatUpPenalty 1s ease-out forwards; z-index: 999; text-shadow: 2px 2px 0 #000; font-family: 'Impact', sans-serif;}
.floating-bonus { position: absolute; font-size: 2rem; font-weight: 900; color: #10b981; pointer-events: none; animation: floatUpPenalty 1s ease-out forwards; z-index: 999; text-shadow: 2px 2px 0 #000; font-family: 'Impact', sans-serif;}
@keyframes floatUpPenalty { 0% { opacity: 1; transform: translateY(0) scale(1); } 100% { opacity: 0; transform: translateY(-50px) scale(1.5); } }

@keyframes shakeScreen { 0%, 100% { transform: translateX(0); filter: sepia(0); } 20%, 60% { transform: translateX(-10px); filter: sepia(1) hue-rotate(-50deg) saturate(3); } 40%, 80% { transform: translateX(10px); } }
.shake-screen { animation: shakeScreen 0.4s ease-in-out; }
.shake-box { animation: shakeBox 0.4s ease-in-out; }
@keyframes shakeBox { 0%, 100% { transform: translateX(0); } 20%, 60% { transform: translateX(-10px); } 40%, 80% { transform: translateX(10px); } }

/* Score Swell Animation */
.score-swell-up { animation: swellUp 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275); color: #10b981 !important; }
.score-swell-down { animation: swellDown 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275); color: #ef4444 !important; }
@keyframes swellUp { 0% { transform: scale(1); } 50% { transform: scale(1.8); text-shadow: 0 0 20px rgba(16,185,129,0.8); } 100% { transform: scale(1); } }
@keyframes swellDown { 0% { transform: scale(1); } 50% { transform: scale(0.6); text-shadow: 0 0 20px rgba(239,68,68,0.8); } 100% { transform: scale(1); } }

/* STAMP - WATERMARK STYLE */
.case-closed-stamp {
    position: absolute; top: 50%; left: 50%; 
    transform: translate(-50%, -50%) scale(3) rotate(-15deg);
    color: rgba(139, 38, 38, 0.15); border: 8px solid rgba(139, 38, 38, 0.15);
    padding: 20px 40px; font-size: clamp(3rem, 6vw, 5rem); font-family: 'Courier New', Courier, monospace;
    font-weight: 900; text-transform: uppercase; z-index: 1; opacity: 0; pointer-events: none;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    text-shadow: none; box-shadow: inset 0 0 0 2px rgba(139, 38, 38, 0.15), 0 0 0 2px rgba(139, 38, 38, 0.15);
    white-space: nowrap;
}
.case-closed-stamp.show { transform: translate(-50%, -50%) scale(1) rotate(-15deg); opacity: 1; }

/* =========================================================================
   BLOKADA OBROTU - TYLKO W TRYBIE DRUŻYNOWYM ORAZ TYLKO W TRAKCIE GRY
   ========================================================================= */

/* Podstawowy wygląd nakładki (ukryty domyślnie) */
#ios-rotate-warning {
    display: none; 
    position: fixed; inset: 0; background: var(--noir-dark); color: var(--noir-paper);
    z-index: 999999; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; padding: 20px; font-family: 'Courier New', monospace;
}

/* Wymuszenie obrotu - pokazuje się TYLKO gdy na tagu body wiszą OBIE klasy naraz */
@media screen and (orientation: portrait) and (max-width: 768px) {
    body.team-mode-active.game-playing #ios-rotate-warning { 
        display: flex !important; 
    }
}

/* Całkowite wyłączenie tego starego komunikatu, który psuł interfejs w oryginalnym kodzie */
#mobile-portrait-error { 
    display: none !important; 
}

/* WIDOK DLA SMARTFONÓW */
@media (max-width: 768px) {
    #game-wrapper { top: 0 !important; bottom: 80px !important; height: calc(100svh - 80px) !important; position: fixed !important; }
    .card-controls-bar { padding: 8px 10px; min-height: 45px; }
    .vol-slider { width: 50px; }
    .control-btn { width: 30px; height: 30px; padding: 5px; }
    .btn-exit { left: 10px !important; }
    
    #game-wrapper .overlay-screen { padding: 10px; align-items: flex-start; overflow-y: auto; }
    #game-wrapper #countdown-screen { align-items: center !important; }
    
    #game-wrapper .menu-card { margin: auto; border-radius: 5px; max-height: none; width: 100%; }
    #game-wrapper .menu-card::before { display: none; }
    #game-wrapper .card-content { flex-direction: column; margin: 0; width: 100%; overflow: visible; }
    #game-wrapper .menu-left { padding: 15px; }
    #game-wrapper .menu-right { padding: 15px; border-left: none; border-top: 2px dashed #ccc;}
    
    #game-wrapper .game-inner { padding: 5px; box-sizing: border-box; justify-content: flex-start;}
    #game-wrapper .game-inner.mirror-layout { display: none; } /* Hide mirror on mobile portrait */
    #mobile-portrait-error { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: white; gap: 20px; padding: 30px; height: 100svh;}

    #game-wrapper .dossier-header { padding: 8px 15px; margin-bottom: 5px; margin-top: 5px;}
    #game-wrapper .time-bar-container { margin-bottom: 5px; }
    
    #game-wrapper .case-file-container { padding: 15px 15px 15px 25px; margin-bottom: 0; }
    #game-wrapper .case-file-container::before { left: 5px; transform: scale(0.8); }
    
    #game-wrapper .investigation-area { padding: 10px; }
    #game-wrapper .answers-grid { grid-template-columns: repeat(2, 1fr); gap: 5px; } 
    #game-wrapper .question-text { font-size: 0.85rem; margin-bottom: 8px; padding: 10px; }
    #game-wrapper .answer-btn { padding: 8px; font-size: 0.85rem; }
    
    #final-score { font-size: 3rem !important; margin-bottom: 10px !important; text-align: center; width: 100%;}
    .case-closed-stamp { font-size: 2.5rem; padding: 10px 20px; border-width: 5px; }
}
@media (min-width: 769px) { #mobile-portrait-error { display: none !important; } }

/* =========================================================================
   🛠️ DYNAMICZNE DOPASOWANIE DO ROZDZIELCZOŚCI (RESPONSIVE FIX)
   ========================================================================= */

@media (min-width: 769px) and (max-height: 850px) {
    .card-controls-bar { min-height: 45px !important; padding: 5px 15px !important; }
    .control-btn { width: 30px !important; height: 30px !important; padding: 5px !important; }
    .control-btn svg { width: 18px; height: 18px; }

    #game-wrapper .menu-left, #game-wrapper .menu-right { padding: 20px !important; }
    #game-wrapper .menu-left h1 { font-size: 1.8rem !important; margin-bottom: 5px !important; }
    #game-wrapper .menu-left p { font-size: 0.9rem !important; margin-bottom: 10px !important; }
    #game-wrapper .time-selector, #game-wrapper .player-profile-wrapper { margin-bottom: 10px !important; }
    #game-wrapper .btn-start { padding: 10px !important; font-size: 1.1rem !important; }

    #game-wrapper .dossier-header { padding: 5px 15px !important; margin-bottom: 5px !important; margin-top: 5px !important; }
    #game-wrapper .stat-box { font-size: 1rem !important; }
    #game-wrapper .stat-box span { font-size: 1.2rem !important; }
    #game-wrapper .case-file-container { padding: 15px 15px 15px 30px !important; margin-bottom: 0 !important; }
    #game-wrapper .case-label { margin-bottom: 5px !important; font-size: 0.8rem !important; }
    
    .hud-bar-wrapper { padding: 0.5rem !important; }
    .hud-bar { padding: 5px 15px !important; }
    .timer-box { font-size: 1.2rem !important; }
    .mirror-panels-container { padding: 0.5rem !important; gap: 10px !important; }
    .mirror-panel { padding: 10px !important; gap: 5px !important; }
    .mirror-header { padding-bottom: 5px !important; margin-bottom: 5px !important; }
    .mirror-team-name { font-size: 1.2rem !important; }
    .mirror-score { font-size: 2.2rem !important; }
    
    #game-wrapper .investigation-area { padding: 10px !important; }
    #game-wrapper .question-text { font-size: 0.95rem !important; margin-bottom: 10px !important; }
    #game-wrapper .answer-btn { padding: 8px !important; font-size: 0.9rem !important; }
}

@media (min-width: 769px) and (max-height: 650px) {
    #game-wrapper .menu-card::before { display: none !important; }
    #game-wrapper .menu-card { max-height: 98vh !important; }
    #game-wrapper .case-file-container::before { transform: scale(0.6); left: 0; top: -15px; }
    #game-wrapper .answers-grid { gap: 5px !important; }
    #game-wrapper .answer-btn { padding: 5px !important; font-size: 0.85rem !important; }
}

@media (min-width: 1400px) and (min-height: 900px) {
    #game-wrapper .game-inner:not(.mirror-layout) { max-width: 1000px !important; }
    #game-wrapper .answer-btn { font-size: 1.2rem !important; padding: 15px !important; }
    #game-wrapper .question-text { font-size: 1.3rem !important; }
    .mirror-panels-container { max-width: 1800px !important; }
    .mirror-team-name { font-size: 2rem !important; }
    .mirror-score { font-size: 4rem !important; }
}

/* 🚀 OSTATECZNA NAPRAWA SKALOWANIA I ELIMINACJA SCROLLBARÓW (1280x800 itd) */
@media (min-width: 769px) {
    /* Ograniczenie szerokości TYLKO DLA MENU/EKRANÓW KOŃCOWYCH - nie dla kart akt sprawy! */
    #start-screen .menu-card, 
    #end-screen .menu-card {
        max-width: 800px !important; /* Przywracamy bazową szerokość, by nie rozjeżdżało się jak na screenie */
    }

    #game-wrapper .case-file-container {
        flex: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        padding: 2vh 3vw !important;
    }

    /* Blokada scrollbarów na ekranie końcowym */
    #end-screen .card-content {
        overflow: hidden !important; 
    }
    
    #end-screen .menu-left {
        overflow: hidden !important;
        position: relative;
    }

    .case-closed-stamp {
        font-size: clamp(2rem, 8vh, 5rem) !important;
        white-space: nowrap;
        pointer-events: none;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) rotate(-15deg) !important;
        box-shadow: none !important;
    }
}

@media (min-width: 769px) and (max-height: 850px) {
    #game-wrapper .menu-left h1 { font-size: 1.6rem !important; }
    #game-wrapper .btn-start { padding: 8px !important; }
    .mirror-panel { gap: 8px !important; }
}

/* =========================================================================
   🚑 POPRAWKA DOPASOWANIA DŁUGIEGO TEKSTU (TEXT FIT & OVERFLOW)
   ========================================================================= */

#game-wrapper .case-text {
    display: block !important; 
    white-space: normal !important; 
    word-wrap: break-word !important; 
    margin: 0 !important; 
    line-height: 1.6 !important; 
    font-size: clamp(0.95rem, 4vh, 1.6rem) !important; 
    
    /* NOWOŚĆ: Niewidzialna poduszka, która pozwala przewinąć tekst ponad ciemny panel! */
    padding-bottom: 220px !important; 
}

/* 4. W trybie pojedynku (gdzie karty są węższe) czcionka jest jeszcze mniejsza */
.mirror-layout .case-text {
    font-size: clamp(0.85rem, 1.8vh, 1.25rem) !important;
}

/* 5. Gwarancja czytelności od samego początku i pasek przewijania w skrajnych sytuacjach */
#game-wrapper .case-file-container {
    justify-content: flex-start !important; 
    overflow-y: auto !important; 
    padding: 15px 20px !important; /* Nieco mniejsze marginesy wewnętrzne = więcej miejsca dla liter */
}

/* 6. Elegancki pasek przewijania (dopasowany do teczki detektywa) */
#game-wrapper .case-file-container::-webkit-scrollbar {
    width: 6px;
}
#game-wrapper .case-file-container::-webkit-scrollbar-track {
    background: transparent;
}
#game-wrapper .case-file-container::-webkit-scrollbar-thumb {
    background: #d4b572;
    border-radius: 10px;
}
#game-wrapper .case-file-container::-webkit-scrollbar-thumb:hover {
    background: var(--noir-accent);
}

@media (max-width: 768px) {
    #game-wrapper .case-text { 
        font-size: 1.1rem !important; 
        line-height: 1.4 !important; 
    } 
}
/* =========================================================================
   🛡️ TARCZA ANTY-WYPYCHANIOWA (FLEXBOX NESTED SCROLL FIX)
   ========================================================================= */

/* Zmuszamy wszystkie kontenery w hierarchii, by respektowały granice ekranu 
   i pozwalały wewnętrznej karcie na przewijanie (scroll) */
#game-wrapper .game-inner,
.mirror-panels-container,
.mirror-panel {
    min-height: 0 !important; 
}

/* Zabezpieczenie dla głównego kontenera w trybie pojedynku */
.mirror-panels-container {
    max-height: 100% !important;
}

/* W trybie Solo również upewniamy się, że wewnętrzny wrapper nie rośnie w nieskończoność */
#game-wrapper .game-inner:not(.mirror-layout) {
    max-height: calc(100vh - 60px) !important;
}
/* ==========================================================
   ABSOLUTNY KAMUFLAŻ POSZLAK (Tryb Hardcore)
   ========================================================== */

/* 1. Resetujemy wygląd i ukrywamy kursor "rączki" */
.case-text span, 
.case-text .absurd-word, 
.case-text .suspect-word {
    cursor: text !important; /* Myszka zostaje zwykłym kursorem tekstu! */
    display: inline !important; 
    border: none !important; 
    background: transparent !important; 
    box-shadow: none !important;
    text-decoration: none !important;
    padding: 0 !important; 
    margin: 0 !important;
    color: inherit; 
    border-radius: 0 !important;
}

/* 2. ZERO reakcji na najechanie myszką i kliknięcie */
.case-text span:hover,
.case-text .absurd-word:hover,
.case-text span:active,
.case-text .absurd-word:active {
    background-color: transparent !important;
    color: inherit;
}

/* 3. Zostawiamy tylko zielony kolor po poprawnym odgadnięciu */
.case-text span[style*="color"],
.case-text span.corrected,
.case-text span.success {
    font-weight: 900 !important;
}
/* ==========================================================
   PODŚWIETLENIE KLIKNIĘTEJ FRAZY
   ========================================================== */
.case-text span.active-suspect {
    background-color: #38bdf8 !important; /* Wyraźny niebieski kolor z Twojego motywu */
    color: #0f172a !important; /* Ciemny tekst dla kontrastu */
    font-weight: 900 !important;
    border-radius: 4px !important;
    padding: 2px 4px !important;
    box-shadow: 0 0 10px rgba(56, 189, 248, 0.5) !important;
    transition: all 0.2s ease;
}
/* ==========================================================
   PODŚWIETLENIE WYBRANEJ FRAZY (AKTYWNE ŚLEDZTWO)
   ========================================================== */
.case-text span.investigating {
    background-color: #3e3129 !important; /* Ciemny brąz pasujący do dolnego panelu */
    color: #f4ebd8 !important; /* Jasny beż tekstu */
    font-weight: bold !important;
    border-radius: 4px !important;
    padding: 0 4px !important;
    box-shadow: 0 0 0 2px rgba(62, 49, 41, 0.3) !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}