/* Konsola w stylu Fallouta, karta informacyjna i efekty alarmu */

[hidden] { display: none !important; }

.crt {
    --crt: #33ff99;
    /* między HUD (góra) a panelem muzyki (dół); czcionka rośnie z wysokością ekranu */
    position: absolute;
    top: 135px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 15;
    width: min(94vw, 880px);
    max-height: calc(100dvh - 135px - 115px);
    overflow: auto;
    padding: 18px 22px;
    background-color: rgba(2, 14, 8, 0.9);
    /* linie jak na starym monitorze kineskopowym */
    background-image: repeating-linear-gradient(to bottom, transparent 0 2px, rgba(0, 0, 0, 0.28) 2px 3px);
    border: 1px solid rgba(51, 255, 153, 0.35);
    border-radius: 6px;
    box-shadow: 0 0 40px rgba(51, 255, 153, 0.15), inset 0 0 70px rgba(0, 0, 0, 0.7);
    color: var(--crt);
    font-family: 'VT323', monospace;
    font-size: clamp(0.78rem, 2.3vh, 1.2rem);
    line-height: 1.28;
    text-shadow: 0 0 6px rgba(51, 255, 153, 0.55);
    text-transform: none;
    letter-spacing: 0;
    animation: crtWlacz 0.45s ease-out, crtMigotanie 5s infinite;
}

.crt-head { margin-bottom: 14px; }
.crt-status { margin-top: 10px; }
.crt-blocks { letter-spacing: 2px; }

.crt-body { display: flex; gap: 28px; }
.crt-dump { display: flex; gap: 22px; }
.crt-row { white-space: pre; }
.crt-addr { opacity: 0.6; }

.crt-word,
.crt-trick,
.crt-btn,
.lang-toggle {
    font: inherit;
    color: inherit;
    background: none;
    border: 0;
    padding: 0;
    margin: 0;
    letter-spacing: inherit;
    text-shadow: inherit;
    cursor: pointer;
}

.crt-word:hover,
.crt-word:focus-visible,
.crt-trick:hover,
.crt-trick:focus-visible,
.crt-btn:hover,
.crt-btn:focus-visible {
    background: var(--crt);
    color: #021a0c;
    text-shadow: none;
    outline: none;
}

.crt-word:disabled,
.crt-trick:disabled {
    cursor: default;
    background: none;
    color: inherit;
    text-shadow: inherit;
}
.crt-word.is-used { opacity: 0.4; }

.crt-log {
    flex: 1;
    min-width: 170px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    word-break: break-word;
}
.crt-cursor::after {
    content: '\2588';
    margin-left: 2px;
    animation: pulse 1s infinite;
}

.crt-foot { margin-top: 16px; }

/* Blokada terminala */
.crt-lock {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 20px;
    text-align: center;
    background: rgba(24, 0, 0, 0.93);
    color: #ff5c5c;
    text-shadow: 0 0 8px rgba(255, 80, 80, 0.7);
}
.crt-lock-title { font-size: 1.6em; letter-spacing: 0.15em; }
.crt-lock-count { margin-top: 12px; font-size: 1.2em; }

/* Karta informacyjna */
.dossier { width: min(94vw, 680px); }
.dossier-title { font-size: 1.25em; letter-spacing: 0.1em; }
.dossier-clearance { margin-top: 4px; opacity: 0.7; }
.dossier-rows {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 4px 18px;
    margin: 16px 0;
}
.dossier-rows dt { opacity: 0.65; }
.dossier-rows dd { margin: 0; }
.dossier-text { margin: 0 0 12px; line-height: 1.55; }
.dossier-end { margin-top: 16px; opacity: 0.65; }

.dossier-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; }

/* Akta poziomu 2: bursztynowy monitor "ściśle tajne" */
.crt.amber {
    --crt: #ffb347;
    border-color: rgba(255, 179, 71, 0.4);
    box-shadow: 0 0 40px rgba(255, 179, 71, 0.15), inset 0 0 70px rgba(0, 0, 0, 0.7);
    background-color: rgba(16, 9, 2, 0.92);
    text-shadow: 0 0 6px rgba(255, 179, 71, 0.5);
}
.crt.amber .crt-btn:hover,
.crt.amber .crt-btn:focus-visible { color: #1a0f00; }

.legend { margin-top: 14px; }
.legend-name { margin-bottom: 4px; letter-spacing: 0.08em; opacity: 0.85; }
.operator {
    margin-top: 20px;
    padding-top: 14px;
    border-top: 1px dashed rgba(255, 179, 71, 0.35);
}
.operator-reached { margin: 4px 0 10px; opacity: 0.75; }
.operator-lines { margin: 6px 0 12px; line-height: 1.55; }
.operator-link { display: inline-block; text-decoration: none; }
.operator-instr { margin-top: 14px; padding: 12px 14px; border: 1px dashed rgba(255, 179, 71, 0.4); }
.operator-step { margin: 3px 0; line-height: 1.5; }
.operator-motto { margin-top: 10px; font-style: italic; letter-spacing: 0.08em; color: #fff4e0; }
.operator-code { margin: 12px 0; }
.operator-code dd { color: #fff4e0; letter-spacing: 0.06em; }
.operator-optional { margin: 14px 0 10px; opacity: 0.8; }
/* Kanał operatora = transmisja na żywo: zielony (jak terminal i SYSTEM: ONLINE) na tle bursztynowych akt */
.crt.amber .operator {
    --crt: #33ff99;
    color: #33ff99;
    text-shadow: 0 0 6px rgba(51, 255, 153, 0.55);
    border-top-color: rgba(51, 255, 153, 0.45);
}
.crt.amber .operator .crt-btn:hover,
.crt.amber .operator .crt-btn:focus-visible { color: #021a0c; }
.crt.amber .operator .legend-name { opacity: 1; }
.crt.amber .operator-instr { border-color: rgba(51, 255, 153, 0.45); }
.crt.amber .operator-code dd { color: #eafff4; }
/* Przycisk połączenia pulsuje jak dioda "połączenie dostępne" */
.operator [data-action="connect"] { animation: pulse 1.8s infinite; }
.operator [data-action="connect"]:hover,
.operator [data-action="connect"]:disabled { animation: none; }
/* "Ogień nie gaśnie." zostaje w kolorze płomienia */
.crt.amber .operator-motto { color: #ffb347; text-shadow: 0 0 6px rgba(255, 179, 71, 0.6); }
@media (prefers-reduced-motion: reduce) { .operator [data-action="connect"] { animation: none; } }


body.dossier-open .intro { opacity: 0; transition: opacity 0.6s ease; }

/* Przycisk ponownego otwarcia terminala w trybie gościa */
.intro-retry {
    margin-top: 22px;
    pointer-events: auto;
    font-family: 'VT323', monospace;
    font-size: 1.1rem;
    color: #33ff99;
    background: none;
    border: 0;
    cursor: pointer;
    text-shadow: 0 0 6px rgba(51, 255, 153, 0.55);
}
.intro-retry:hover,
.intro-retry:focus-visible { background: #33ff99; color: #021a0c; text-shadow: none; outline: none; }

/* Przełącznik języka w HUD */
.lang-toggle span { opacity: 0.45; }
.lang-toggle span.on { opacity: 1; color: #00ffcc; }

/* Alarm po nieudanym włamaniu */
body.alarm .overlay {
    background: radial-gradient(circle at center, rgba(255, 0, 0, 0.12) 0%, rgba(90, 0, 0, 0.65) 90%);
    animation: alarmPuls 0.5s 5;
}
body.alarm .station-data { color: #ff6b6b; border-color: rgba(255, 90, 90, 0.6); }
body.alarm .status-dot { background: #ff3b3b; box-shadow: 0 0 10px #ff3b3b; }
body.alarm .crt { border-color: #ff4d4d; }

@keyframes crtWlacz {
    from { opacity: 0; transform: translateX(-50%) scaleY(0.02); filter: brightness(3); }
    to { opacity: 1; transform: translateX(-50%) scaleY(1); filter: brightness(1); }
}
@keyframes crtMigotanie {
    0%, 96%, 100% { opacity: 1; }
    97% { opacity: 0.86; }
    98% { opacity: 1; }
    99% { opacity: 0.92; }
}
@keyframes alarmPuls {
    50% { opacity: 0.55; }
}

@media (max-width: 1024px) {
    .crt { max-height: calc(100dvh - 135px - 155px); }
}

@media (max-width: 700px) {
    .crt { top: 105px; font-size: min(1.05rem, calc((94vw - 24px) / 19.5)); padding: 12px; max-height: calc(100dvh - 105px - 155px); }
    .crt-body { flex-direction: column; gap: 12px; }
    .crt-dump { gap: 10px; }
    .crt-log { min-height: 3.2em; }
    .dossier { font-size: 1.1rem; }
    .dossier-rows { grid-template-columns: 1fr; gap: 0; }
    .dossier-rows dd { margin-bottom: 6px; }
}

@media (prefers-reduced-motion: reduce) {
    .crt { animation: none; }
    body.alarm .overlay { animation: none; }
}
