/* главный стенд — как в комиксе */
#pitching_card {
    align-items: center;border-bottom: 1px solid #1e1a1a;
    background: #ffffff03;
    border-top: 1px solid #1e1a1a;
}
.title_pitch {
    color: white;margin: 3px 0 9px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.title_pitch h2 {text-align: center;color:#999999}
.title_pitch h2 span {
    color:white;
    font-family: cursive;
}
#pitching_lc, #pitching_legion, #pitching_abzu {
    cursor:pointer;
    width: max-content;
    background: #00000026;
    padding: 0 9px;
    margin-bottom: 6px;
    border-radius: 6px;
    letter-spacing: 1.5px;
}
.pitching-footer-button {
    padding:4px 12px;background: #000;color:white;
}
.comic-stage {
            position: relative;
            width: 720px;
            max-width: 94%;
            background: #000;
            border-radius: 40px 40px 24px 24px;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15), 0 8px 16px rgba(0, 0, 0, 0.06);
            padding: 9px;
            transition: all 0.2s;
            border: 2px solid #eaeef3;
}

        /* оператор (значок + подпись) */
.operator-area {
            display: flex;
            align-items: center;
            margin: 20px 0 0 0;
}

.operator-avatar {
            background: #1e2b3c;
            width: 100px;
            height: 100px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 48px;
            font-weight: 600;
            transition: transform 0.2s ease;
            letter-spacing: 2px;
            user-select: none;
            border: 3px solid #facc15;
}

.operator-label {
            margin-top: 15px;
            font-weight: 700;
            font-size: 1.2rem;
            font-family: cursive;
            color: #ffffff;
            padding: 2px 8px 6px 9px;
            border-radius: 40px;
            letter-spacing: 0.5px;
            filter: drop-shadow(0 0 10px #555);
}

        /* контейнер диалога — как облако с уголком (внизу) */
.dialog-bubble {
            position: relative;
            background: #f8fafc;
            border-radius: 28px 28px 28px 8px;
            padding: 28px 30px 32px;
            margin-top: 6px;
            border: 2px solid #cbd5e1;
            box-shadow: 0 6px 0 #85a77e, 0 18px 28px -8px rgba(0, 0, 0, 0.2);
            min-height: 140px;
            transition: all 0.1s;
}

        /* уголок (треугольник) как в комиксах — снизу слева */
.dialog-bubble::after {
            content: '';
            position: absolute;
            bottom: -18px;
            left: 32px;
            width: 0;
            height: 0;
            border-left: 18px solid transparent;
            border-right: 18px solid transparent;
            border-top: 22px solid #f8fafc;
            filter: drop-shadow(0 4px 2px rgba(0,0,0,0.05));
            z-index: 2;
}

        /* дополнительная тень для уголка (имитация границы) */
.dialog-bubble::before {
            content: '';
            position: absolute;
            bottom: -22px;
            left: 28px;
            width: 0;
            height: 0;
            border-left: 22px solid transparent;
            border-right: 22px solid transparent;
            border-top: 26px solid #cbd5e1;
            z-index: 0;
}

        /* текст в диалоге */
.dialog-text {
            font-size: 1.3rem;
            line-height: 1.6;
            color: #0f172a;
            word-break: break-word;
            /*white-space: pre-wrap; красная строка*/
            min-height: 4.2rem;
            font-weight: 500;
            letter-spacing: 0.01em;
}

        /* курсор печати (мигающая черта) */
.cursor-blink {
            display: inline-block;
            width: 3px;
            height: 1.4rem;
            background: #1e293b;
            margin-left: 4px;
            vertical-align: text-bottom;
            animation: blink 0.9s step-end infinite;
            border-radius: 2px;
}

@keyframes blink {
            0%, 100% { opacity: 1; }
            50% { opacity: 0; }
}

        /* пульт управления (подсказка) */
.control-panel {
            display: flex;
            flex: 1;
            margin-left: 15px;
            flex-wrap: wrap;
            justify-content: space-between;
            align-items: center;
            gap: 9px 12px;
            background: #eef2f6;
            padding: 16px 20px;
            border-radius: 30px;
            border: 1px solid #d1d9e6;
}

.adminBlock {
            display:flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
}

#textStart {
            font-size: 20px;
            font-family: monospace;
            margin-top: 9px;
            font-weight: bold;
            letter-spacing: 1px;
}

#statusText {
            font-family: cursive;
            font-size: 18px;
            letter-spacing: 3px;
}

#blockStatus {
           /* flex:1;*/
            display:flex;
            justify-content: center;
            align-items: center;
            width: max-content;
}

.control-panel button {
            color: white;
            font-weight: 600;
            padding: 6px 15px;
            margin: 3px;
            border-radius: 40px;
            font-size: 21px;
            cursor: pointer;
            transition: all 0.08s linear;
            letter-spacing: 0.3px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
}

.control-panel button:active {
            transform: translateY(3px);
            box-shadow: 0 0px 0 #0f172a;
}

.control-panel button:disabled {
            opacity: 0.5;
            transform: translateY(2px);
            box-shadow: 0 1px 0 #0f172a;
            pointer-events: none;
}

.status-badge {
            background: #d9e2ef;
            padding: 6px 18px;
            border-radius: 30px;
            font-size: 0.9rem;
            font-weight: 500;
            color: #1e293b;
            display: flex;
            align-items: center;
            gap: 8px;
}

.status-badge span {
            display: inline-block;
            width: 10px;
            height: 10px;
            border-radius: 10px;
            background: #116601;
            transition: background 0.2s;
}

.status-badge span.idle {
            background: #94a3b8;
}

.pitching-legs{
    display: flex;
    justify-content: center;
    align-items: center;flex: 1;
    border-left: 3px dotted white;
    border-right: 3px dotted white;
    width: 47%;
    margin: 3px;
}

/* адаптив */
@media (max-width: 500px) {
            .comic-stage { padding: 24px 16px 28px; }
            .dialog-text { font-size: 1.1rem; }
            .operator-avatar { width: 76px; height: 76px; font-size: 36px; }
            .control-panel { flex-direction: column; align-items: stretch; }
            .control-panel button { justify-content: center; }
}