/* ─── Python-песочница PyDep ─── */

.pg-body main {
    overflow-x: clip;
}

/* Заглушка для тач-устройств (телефоны и планшеты, включая iPad):
   песочница доступна только на компьютере/ноутбуке. Показ — по типу
   указателя (hover/pointer), а не по ширине экрана, иначе крупные планшеты
   проходят. JS-класс .pg-touch-device — фолбэк для iPad, который маскируется
   под Mac в User-Agent. */
.pg-mobile-gate { display: none; }
.pg-mobile-gate-on .pg-page { display: none !important; }
.pg-mobile-gate-on .pg-mobile-gate {
    display: flex; align-items: center; justify-content: center;
    min-height: calc(100vh - 220px); padding: 40px 18px;
}
.pg-mobile-gate__card {
    max-width: 420px; text-align: center;
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius-lg); padding: 36px 26px; box-shadow: var(--shadow);
}
.pg-mobile-gate__icon {
    width: 76px; height: 76px; margin: 0 auto 20px; border-radius: 22px;
    display: grid; place-items: center; font-size: 2.1rem;
    color: var(--on-brand); background: var(--brand); box-shadow: var(--shadow-glow);
}
.pg-mobile-gate__card h1 {
    font-size: 1.4rem; font-weight: 800; color: var(--heading); margin: 0 0 12px;
}
.pg-mobile-gate__card p {
    color: var(--text-muted); font-size: .95rem; line-height: 1.6; margin: 0 0 24px;
}
.pg-mobile-gate__actions {
    display: flex; flex-direction: column; gap: 10px;
}
.pg-mobile-gate__actions .btn { width: 100%; justify-content: center; }

/* Мгновенно (без вспышки) для тач-устройств с грубым указателем и без hover */
@media (hover: none) and (pointer: coarse) {
    .pg-page { display: none !important; }
    .pg-mobile-gate {
        display: flex; align-items: center; justify-content: center;
        min-height: calc(100vh - 220px); padding: 40px 18px;
    }
}

.pg-page {
    position: relative;
    padding: 32px 0 80px;
}

.pg-page::before {
    content: "";
    position: absolute;
    inset: -120px 0 auto;
    height: 420px;
    background:
        radial-gradient(42rem 22rem at 12% 0%, var(--brand-glow-strong, rgba(255, 176, 32, .14)), transparent 65%),
        radial-gradient(36rem 20rem at 88% 8%, rgba(84, 214, 180, .1), transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.pg-page .container {
    position: relative;
    z-index: 1;
}

/* Hero */
.pg-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px 40px;
    margin-bottom: 28px;
}

.pg-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    margin-bottom: 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 176, 32, .32);
    background: rgba(255, 176, 32, .08);
    color: var(--brand);
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.pg-hero h1 {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-size: clamp(2.4rem, 5vw, 3.4rem);
    line-height: 1;
    letter-spacing: -.03em;
    margin: 0 0 .55rem;
}

.pg-hero p {
    max-width: 34rem;
    margin: 0;
    color: var(--text-muted);
    font-size: 1.05rem;
    line-height: 1.55;
}

.pg-hero code {
    font-size: .92em;
    color: var(--heading);
}

.pg-hero__meta {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 16px 22px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
    background: var(--surface);
}

.pg-hero__stat-num {
    display: block;
    font-family: 'Bricolage Grotesque', sans-serif;
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--heading);
    line-height: 1;
}

.pg-hero__stat-lbl {
    display: block;
    margin-top: 4px;
    font-size: .75rem;
    color: var(--text-muted);
}

.pg-hero__stat-sep {
    width: 1px;
    align-self: stretch;
    background: var(--border);
}

/* Layout */
.pg-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 22px;
    align-items: start;
}

@media (max-width: 960px) {
    .pg-layout { grid-template-columns: 1fr; }
    .pg-hero__meta { width: 100%; }
}

/* Studio shell — токены: тёмная тема */
html[data-theme="dark"] .pg-studio,
html:not([data-theme="light"]) .pg-studio {
    --pg-shell: #111113;
    --pg-shell-inset: rgba(255, 255, 255, .04);
    --pg-glow: rgba(255, 176, 32, .12);
    --pg-chrome-border: rgba(255, 255, 255, .07);
    --pg-chrome-bg: rgba(255, 255, 255, .02);
    --pg-tab: #8a8478;
    --pg-tab-active: #e8e2d6;
    --pg-tab-active-bg: rgba(255, 255, 255, .06);
    --pg-tab-active-border: rgba(255, 255, 255, .08);
    --pg-status-bg: rgba(0, 0, 0, .25);
    --pg-status-border: rgba(255, 255, 255, .08);
    --pg-status-text: #a8a296;
    --pg-icon-border: rgba(255, 255, 255, .1);
    --pg-icon-bg: rgba(255, 255, 255, .04);
    --pg-icon-color: #a8a296;
    --pg-icon-hover: #fff;
    --pg-pane-label: #8a8478;
    --pg-pane-hint: #6e685b;
    --pg-pane-kbd-border: rgba(255, 255, 255, .1);
    --pg-pane-kbd-bg: rgba(0, 0, 0, .2);
    --pg-editor-bg: #0c0c0e;
    --pg-editor-text: #d6d0c2;
    --pg-gutter-bg: rgba(0, 0, 0, .22);
    --pg-gutter-border: rgba(255, 255, 255, .05);
    --pg-linenumber: #6e685b;
    --pg-output-bg: #0a0a0c;
    --pg-output-text: #d6d0c2;
    --pg-output-placeholder: #6e685b;
    --pg-out-stdout: #b6e08a;
    --pg-out-stderr: #fca5a5;
    --pg-out-muted: #8a8478;
    --pg-resizer-bg: rgba(255, 255, 255, .04);
    --pg-resizer-border: rgba(255, 255, 255, .05);
    --pg-foot-border: rgba(255, 255, 255, .06);
    --pg-foot-bg: rgba(0, 0, 0, .2);
    --pg-foot-text: #8a8478;
    --pg-foot-kbd-border: rgba(255, 255, 255, .1);
    --pg-foot-kbd-bg: rgba(255, 255, 255, .04);
    --pg-cm-keyword: #ffb020;
    --pg-cm-string: #b6e08a;
    --pg-cm-number: #79c0ff;
    --pg-cm-comment: #8a8478;
    --pg-cm-def: #54d6b4;
    --pg-cm-variable: #d6d0c2;
    --pg-cm-variable2: #ffa657;
    --pg-cm-builtin: #79c0ff;
    --pg-cm-operator: #ffb020;
    --pg-cm-meta: #d6d0c2;
    --pg-cm-atom: #79c0ff;
    --pg-cm-bracket: #d6d0c2;
    --pg-modal-input-bg: #0d1117;
    --pg-modal-input-text: #aff5b4;
    --pg-modal-input-placeholder: #6e685b;
}

/* Studio shell — токены: светлая тема */
html[data-theme="light"] .pg-studio {
    --pg-shell: #fffcf7;
    --pg-shell-inset: rgba(22, 20, 15, .04);
    --pg-glow: rgba(201, 133, 0, .1);
    --pg-chrome-border: rgba(22, 20, 15, .08);
    --pg-chrome-bg: rgba(22, 20, 15, .03);
    --pg-tab: #9a9384;
    --pg-tab-active: #16140f;
    --pg-tab-active-bg: #fff;
    --pg-tab-active-border: rgba(22, 20, 15, .1);
    --pg-status-bg: #f3efe6;
    --pg-status-border: rgba(22, 20, 15, .1);
    --pg-status-text: #6e685b;
    --pg-icon-border: rgba(22, 20, 15, .12);
    --pg-icon-bg: #fff;
    --pg-icon-color: #6e685b;
    --pg-icon-hover: #16140f;
    --pg-pane-label: #9a9384;
    --pg-pane-hint: #9a9384;
    --pg-pane-kbd-border: rgba(22, 20, 15, .12);
    --pg-pane-kbd-bg: #fff;
    --pg-editor-bg: #faf8f3;
    --pg-editor-text: #2b2720;
    --pg-gutter-bg: #f3efe6;
    --pg-gutter-border: rgba(22, 20, 15, .08);
    --pg-linenumber: #b8b0a2;
    --pg-output-bg: #f0ede5;
    --pg-output-text: #2b2720;
    --pg-output-placeholder: #9a9384;
    --pg-out-stdout: #2d6a3e;
    --pg-out-stderr: #b42318;
    --pg-out-muted: #9a9384;
    --pg-resizer-bg: #eae4d6;
    --pg-resizer-border: rgba(22, 20, 15, .08);
    --pg-foot-border: rgba(22, 20, 15, .08);
    --pg-foot-bg: #f3efe6;
    --pg-foot-text: #6e685b;
    --pg-foot-kbd-border: rgba(22, 20, 15, .12);
    --pg-foot-kbd-bg: #fff;
    --pg-cm-keyword: #b45309;
    --pg-cm-string: #3d7a28;
    --pg-cm-number: #0550ae;
    --pg-cm-comment: #9a9384;
    --pg-cm-def: #0d8a6a;
    --pg-cm-variable: #2b2720;
    --pg-cm-variable2: #9a3412;
    --pg-cm-builtin: #0550ae;
    --pg-cm-operator: #b45309;
    --pg-cm-meta: #6e685b;
    --pg-cm-atom: #0550ae;
    --pg-cm-bracket: #2b2720;
    --pg-modal-input-bg: #fff;
    --pg-modal-input-text: #2b2720;
    --pg-modal-input-placeholder: #9a9384;
}

.pg-studio {
    position: relative;
    border-radius: 18px;
    border: 1px solid var(--border-strong);
    background: var(--pg-shell);
    box-shadow: var(--shadow), 0 0 0 1px var(--pg-shell-inset) inset;
    overflow: hidden;
}

.pg-studio__glow {
    position: absolute;
    inset: -40% -20% auto;
    height: 55%;
    background: radial-gradient(ellipse at 50% 0%, var(--pg-glow), transparent 70%);
    pointer-events: none;
}

.pg-studio__chrome {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--pg-chrome-border);
    background: var(--pg-chrome-bg);
}

.pg-studio__dots {
    display: flex;
    gap: 7px;
    flex-shrink: 0;
}

.pg-studio__dots i {
    width: 11px;
    height: 11px;
    border-radius: 50%;
}

.pg-studio__dots i:nth-child(1) { background: #ff5f57; }
.pg-studio__dots i:nth-child(2) { background: #febc2e; }
.pg-studio__dots i:nth-child(3) { background: #28c840; }

.pg-studio__tabs {
    display: flex;
    gap: 6px;
    min-width: 0;
}

.pg-studio__tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 8px;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: .76rem;
    font-weight: 600;
    color: var(--pg-tab);
    white-space: nowrap;
}

.pg-studio__tab--active {
    color: var(--pg-tab-active);
    background: var(--pg-tab-active-bg);
    border: 1px solid var(--pg-tab-active-border);
}

.pg-studio__tab--ghost {
    opacity: .55;
}

.pg-studio__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    flex-shrink: 0;
}

.pg-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 11px;
    border-radius: 999px;
    border: 1px solid var(--pg-status-border);
    background: var(--pg-status-bg);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: .7rem;
    font-weight: 600;
    color: var(--pg-status-text);
}

.pg-status-pill__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #6b6560;
}

.pg-status-pill[data-kind="ok"] .pg-status-pill__dot {
    background: var(--accent-2);
    box-shadow: 0 0 8px rgba(84, 214, 180, .65);
}

.pg-status-pill[data-kind="loading"] .pg-status-pill__dot {
    background: var(--brand);
    animation: pg-pulse 1.2s ease-in-out infinite;
}

.pg-status-pill[data-kind="error"] .pg-status-pill__dot {
    background: #f87171;
}

@keyframes pg-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .45; transform: scale(.85); }
}

.pg-btn-icon {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--pg-icon-border);
    border-radius: 10px;
    background: var(--pg-icon-bg);
    color: var(--pg-icon-color);
    cursor: pointer;
    transition: color .2s, border-color .2s, background .2s;
}

.pg-btn-icon:hover {
    color: var(--pg-icon-hover);
    border-color: var(--border-strong);
    background: var(--pg-tab-active-bg);
}

.pg-run-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    border: none;
    border-radius: 11px;
    background: var(--grad-brand);
    color: var(--on-brand, #1a1407);
    font-size: .84rem;
    font-weight: 800;
    cursor: pointer;
    transition: transform .2s, box-shadow .2s, filter .2s;
    box-shadow: 0 10px 28px -10px rgba(255, 176, 32, .75);
}

.pg-run-btn:hover {
    transform: translateY(-1px);
    filter: brightness(1.05);
}

.pg-run-btn:disabled {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
}

.pg-run-btn i {
    font-size: 1rem;
}

/* Split panes */
.pg-studio__panes {
    display: grid;
    grid-template-columns: 1fr 5px 1fr;
    min-height: 460px;
}

@media (max-width: 768px) {
    .pg-studio__panes {
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 4px 0.85fr;
        min-height: 560px;
    }
}

.pg-pane {
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
}

.pg-pane__label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    border-bottom: 1px solid var(--pg-chrome-border);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--pg-pane-label);
}

.pg-pane__hint {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    color: var(--pg-pane-hint);
}

.pg-pane__hint kbd {
    padding: 1px 5px;
    border-radius: 4px;
    border: 1px solid var(--pg-pane-kbd-border);
    background: var(--pg-pane-kbd-bg);
    font-family: inherit;
    font-size: .65rem;
}

.pg-pane-resizer {
    background: var(--pg-resizer-bg);
    border-left: 1px solid var(--pg-resizer-border);
    border-right: 1px solid var(--pg-resizer-border);
}

@media (max-width: 768px) {
    .pg-pane-resizer {
        border-left: none;
        border-right: none;
        border-top: 1px solid var(--pg-resizer-border);
        border-bottom: 1px solid var(--pg-resizer-border);
    }
}

/* Editor */
.pg-editor-wrap {
    flex: 1;
    min-height: 0;
    background: var(--pg-editor-bg);
}

.pg-editor-wrap .CodeMirror {
    height: 100% !important;
    min-height: 220px;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: .88rem;
    line-height: 1.6;
    background: transparent !important;
    color: var(--pg-editor-text) !important;
}

.pg-studio .CodeMirror pre,
.pg-studio .CodeMirror-line {
    color: inherit;
}

.pg-studio .cm-s-default .cm-keyword { color: var(--pg-cm-keyword) !important; }
.pg-studio .cm-s-default .cm-string { color: var(--pg-cm-string) !important; }
.pg-studio .cm-s-default .cm-string-2 { color: var(--pg-cm-string) !important; }
.pg-studio .cm-s-default .cm-number { color: var(--pg-cm-number) !important; }
.pg-studio .cm-s-default .cm-comment { color: var(--pg-cm-comment) !important; font-style: italic; }
.pg-studio .cm-s-default .cm-def { color: var(--pg-cm-def) !important; }
.pg-studio .cm-s-default .cm-variable { color: var(--pg-cm-variable) !important; }
.pg-studio .cm-s-default .cm-variable-2 { color: var(--pg-cm-variable2) !important; }
.pg-studio .cm-s-default .cm-variable-3 { color: var(--pg-cm-variable2) !important; }
.pg-studio .cm-s-default .cm-builtin { color: var(--pg-cm-builtin) !important; }
.pg-studio .cm-s-default .cm-operator { color: var(--pg-cm-operator) !important; }
.pg-studio .cm-s-default .cm-meta { color: var(--pg-cm-meta) !important; }
.pg-studio .cm-s-default .cm-atom { color: var(--pg-cm-atom) !important; }
.pg-studio .cm-s-default .cm-bracket { color: var(--pg-cm-bracket) !important; }
.pg-studio .cm-s-default .cm-tag { color: var(--pg-cm-keyword) !important; }
.pg-studio .cm-s-default .cm-attribute { color: var(--pg-cm-def) !important; }
.pg-studio .cm-s-default .cm-qualifier { color: var(--pg-cm-meta) !important; }
.pg-studio .cm-s-default .cm-property { color: var(--pg-cm-variable2) !important; }

.pg-studio .CodeMirror-gutters {
    background: var(--pg-gutter-bg) !important;
    border-right: 1px solid var(--pg-gutter-border) !important;
}

.pg-studio .CodeMirror-linenumber {
    color: var(--pg-linenumber) !important;
    padding: 0 10px 0 4px !important;
}

.CodeMirror-cursor {
    border-left: 2px solid var(--brand) !important;
}

.CodeMirror-selected {
    background: rgba(255, 176, 32, .16) !important;
}

.CodeMirror-focused .CodeMirror-selected {
    background: rgba(255, 176, 32, .22) !important;
}

.pg-studio .CodeMirror-activeline-background {
    background: rgba(255, 176, 32, .06) !important;
}

html[data-theme="light"] .pg-studio .CodeMirror-activeline-background {
    background: rgba(201, 133, 0, .07) !important;
}

/* Terminal output */
.pg-pane--output {
    background: var(--pg-output-bg);
}

.pg-output {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 14px 16px;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: .86rem;
    line-height: 1.6;
    color: var(--pg-output-text) !important;
}

.pg-output__placeholder {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--pg-output-placeholder);
    font-size: .84rem;
}

.pg-output__placeholder i {
    color: var(--accent-2);
    opacity: .7;
}

.pg-out-line {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 4px;
    white-space: pre-wrap;
    word-break: break-word;
    animation: pg-line-in .22s ease;
}

@keyframes pg-line-in {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

.pg-out-line::before {
    flex-shrink: 0;
    width: 14px;
    text-align: center;
    font-weight: 700;
    opacity: .8;
}

.pg-out-line--stdout { color: var(--pg-out-stdout) !important; }
.pg-out-line--stdout::before { content: '›'; color: var(--accent-2); }

.pg-out-line--stderr { color: var(--pg-out-stderr) !important; }
.pg-out-line--stderr::before { content: '!'; color: #f87171; }

.pg-out-line--muted { color: var(--pg-out-muted) !important; font-style: italic; }
.pg-out-line--muted::before { content: '·'; }

.pg-studio__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-top: 1px solid var(--pg-foot-border);
    background: var(--pg-foot-bg);
    font-size: .75rem;
    color: var(--pg-foot-text);
}

.pg-studio__foot i {
    color: var(--accent-2);
    margin-right: 4px;
}

.pg-studio__foot kbd {
    padding: 1px 5px;
    border-radius: 4px;
    border: 1px solid var(--pg-foot-kbd-border);
    background: var(--pg-foot-kbd-bg);
    font-size: .68rem;
}

.pg-studio__foot-sep { opacity: .4; }

/* Sidebar */
.pg-side-card {
    padding: 18px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
    background: var(--surface);
    margin-bottom: 14px;
}

.pg-side-card--dim {
    background: var(--surface-2);
}

.pg-side-card__title {
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 4px;
    color: var(--heading);
}

.pg-side-card__subtitle {
    font-size: .88rem;
    font-weight: 700;
    margin: 0 0 10px;
    color: var(--heading);
}

.pg-side-card__lead {
    margin: 0 0 14px;
    font-size: .82rem;
    color: var(--text-muted);
}

.pg-examples {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pg-example-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px 13px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--text);
    text-align: left;
    cursor: pointer;
    transition: border-color .22s, background .22s, transform .22s, box-shadow .22s;
}

.pg-example-btn:hover {
    border-color: rgba(255, 176, 32, .4);
    background: var(--surface-3, var(--surface));
    transform: translateY(-2px);
    box-shadow: 0 8px 24px -16px rgba(255, 176, 32, .45);
}

.pg-example-btn__icon {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: rgba(255, 176, 32, .12);
    color: var(--brand);
    font-size: 1rem;
}

.pg-example-btn__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.pg-example-btn__body strong {
    font-size: .9rem;
    color: var(--heading);
}

.pg-example-btn__body small {
    font-size: .76rem;
    color: var(--text-muted);
}

.pg-limits-list {
    margin: 0;
    padding-left: 1.15rem;
    font-size: .82rem;
    color: var(--text-muted);
    line-height: 1.55;
}

.pg-limits-list li { margin-bottom: 4px; }

/* Modal — без изменений по стилю */
.pg-modal {
    position: fixed;
    inset: 0;
    z-index: 10070;
    display: grid;
    place-items: center;
    padding: 20px;
}

.pg-modal[hidden] { display: none !important; }

.pg-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .62);
    backdrop-filter: blur(6px);
}

.pg-modal__card {
    position: relative;
    width: min(100%, 440px);
    padding: 22px 24px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-strong);
    background: var(--surface-solid);
    box-shadow: var(--shadow), 0 0 60px -20px rgba(255, 176, 32, .25);
    animation: pg-modal-in .28s cubic-bezier(.22, .61, .36, 1);
    --pg-modal-input-bg: #0d1117;
    --pg-modal-input-text: #aff5b4;
    --pg-modal-input-placeholder: #484f58;
}

@keyframes pg-modal-in {
    from { opacity: 0; transform: translateY(12px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.pg-modal__head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    font-weight: 700;
    color: var(--heading);
    font-size: 1rem;
}

.pg-modal__head i { color: var(--brand); font-size: 1.15rem; }

.pg-modal__label {
    display: block;
    margin-bottom: 10px;
    font-size: .95rem;
    line-height: 1.45;
    color: var(--text);
    font-weight: 500;
}

.pg-modal__label:empty { display: none; }

.pg-modal__input {
    width: 100%;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid var(--border-strong);
    background: var(--pg-modal-input-bg, #0d1117);
    color: var(--pg-modal-input-text, #aff5b4);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: .95rem;
    outline: none;
    transition: border-color .2s, box-shadow .2s, background .2s, color .2s;
}

.pg-modal__input:focus {
    border-color: var(--brand);
    box-shadow: var(--ring);
}

.pg-modal__input::placeholder { color: var(--pg-modal-input-placeholder, #484f58); }

.pg-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

html[data-theme="light"] .pg-modal__card {
    --pg-modal-input-bg: #fff;
    --pg-modal-input-text: #2b2720;
    --pg-modal-input-placeholder: #9a9384;
}

html[data-theme="light"] .pg-run-btn {
    box-shadow: 0 10px 28px -10px var(--brand-shadow);
}

/* ───────────── Панель ввода (stdin) ───────────── */
.pg-stdin {
    border-top: 1px solid var(--pg-border, var(--border));
    background: var(--pg-editor-bg, rgba(255,255,255,.015));
}
.pg-stdin__summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    font-size: .82rem;
    color: var(--text-muted);
    cursor: pointer;
    user-select: none;
    list-style: none;
}
.pg-stdin__summary::-webkit-details-marker { display: none; }
.pg-stdin__summary i { color: var(--brand); }
.pg-stdin__summary code {
    color: var(--heading);
    background: var(--surface-2);
    padding: 1px 6px;
    border-radius: 6px;
    font-size: .82em;
}
.pg-stdin__hint { margin-left: auto; color: var(--text-dim); font-size: .76rem; }
.pg-stdin[open] .pg-stdin__summary { border-bottom: 1px dashed var(--pg-border, var(--border)); }
.pg-stdin__field {
    width: 100%;
    min-height: 64px;
    max-height: 160px;
    resize: vertical;
    border: none;
    outline: none;
    background: transparent;
    color: var(--text);
    padding: 12px 16px;
    font: 400 .88rem/1.6 ui-monospace, 'SF Mono', Menlo, monospace;
}
.pg-stdin__field::placeholder { color: var(--text-dim); }

/* спиннер на кнопке во время выполнения */
.pg-spin { display: inline-block; animation: pg-spin .8s linear infinite; }
@keyframes pg-spin { to { transform: rotate(360deg); } }

/* ───────────── Режим практики ───────────── */
.pg-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
    color: var(--brand); margin-bottom: 10px;
}

/* кнопка Проверить */
.pg-check-btn {
    display: inline-flex; align-items: center; gap: 8px;
    border: 1px solid var(--border-strong); background: var(--surface-2);
    color: var(--heading); border-radius: 12px; padding: 9px 16px;
    font-weight: 700; font-size: .9rem; cursor: pointer;
    transition: border-color .2s, background .2s, transform .15s;
}
.pg-check-btn:hover { border-color: #54D6B4; color: #54D6B4; transform: translateY(-1px); }
.pg-check-btn:disabled { opacity: .5; cursor: default; }
.pg-check-btn[hidden] { display: none !important; }

/* список заданий */
.pg-tasks-card[hidden], .pg-current-task[hidden] { display: none !important; }
.pg-side-card__title i { color: var(--brand); margin-right: 6px; }
.pg-tasks-list { display: flex; flex-direction: column; gap: 8px; }
.pg-task-item {
    display: flex; align-items: center; gap: 12px;
    padding: 11px 13px; border-radius: 12px; cursor: pointer;
    border: 1px solid var(--border); background: var(--surface-2);
    color: var(--text); text-align: left; transition: border-color .2s, background .2s;
}
.pg-task-item:hover { border-color: var(--border-strong); }
.pg-task-item.is-active { border-color: var(--brand); background: rgba(255,176,32,.10); }
.pg-task-item__num {
    width: 26px; height: 26px; flex: 0 0 26px; border-radius: 8px;
    display: grid; place-items: center; font-weight: 700; font-size: .82rem;
    background: var(--brand); color: var(--on-brand);
}
.pg-task-item__title { flex: 1; min-width: 0; font-weight: 600; }
.pg-task-item__check { color: #54D6B4; font-size: 1.05rem; }
.pg-task-item.is-solved .pg-task-item__num {
    background: rgba(52,211,153,.18); color: #34d399;
    box-shadow: inset 0 0 0 1px rgba(52,211,153,.4);
}
.pg-task-item.is-solved .pg-task-item__title { color: var(--text-muted); }

/* прогресс */
.pg-tasks-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pg-tasks-card__head .pg-side-card__title { margin: 0; }
.pg-progress-count {
    font-size: .78rem; font-weight: 700; color: var(--brand);
    background: rgba(255,176,32,.12); padding: 2px 9px; border-radius: 999px; white-space: nowrap;
}
.pg-progress {
    height: 6px; border-radius: 999px; background: var(--surface-3);
    overflow: hidden; margin: 12px 0 14px;
}
.pg-progress__bar {
    display: block; height: 100%; width: 0; border-radius: 999px;
    background: linear-gradient(90deg, var(--brand), #ffd27a);
    transition: width .5s cubic-bezier(.4,1.2,.4,1);
}
.pg-all-done {
    margin-top: 14px; padding: 16px 14px; border-radius: 14px; text-align: center;
    background: rgba(52,211,153,.12); border: 1px solid rgba(52,211,153,.3);
    display: flex; flex-direction: column; gap: 2px; animation: pgDonePop .4s ease;
}
.pg-all-done[hidden] { display: none !important; }
.pg-all-done i { font-size: 1.7rem; color: #fbbf24; margin-bottom: 4px; }
.pg-all-done strong { color: #6ee7b7; font-size: 1rem; }
.pg-all-done span { color: var(--text-muted); font-size: .84rem; }
@keyframes pgDonePop { from { opacity: 0; transform: scale(.92); } to { opacity: 1; transform: none; } }

/* кнопка «следующее задание» */
.pg-next-btn {
    margin-top: 14px; width: 100%; border: none; cursor: pointer;
    padding: 11px 16px; border-radius: 12px; font-weight: 700; font-size: .9rem;
    background: var(--brand); color: var(--on-brand);
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    transition: filter .2s, transform .2s;
}
.pg-next-btn[hidden] { display: none !important; }
.pg-next-btn:hover { filter: brightness(1.06); transform: translateY(-1px); }

/* конфетти */
.pg-confetti { position: fixed; inset: 0; pointer-events: none; z-index: 2000; overflow: hidden; }
.pg-confetti__bit {
    position: absolute; top: -14px; width: 9px; height: 14px; border-radius: 2px;
    opacity: .95; animation: pgConfettiFall linear forwards;
}
@keyframes pgConfettiFall {
    0% { transform: translateY(-10vh) rotate(0deg); opacity: 1; }
    100% { transform: translateY(108vh) rotate(540deg); opacity: .9; }
}
@media (prefers-reduced-motion: reduce) {
    .pg-confetti { display: none; }
    .pg-progress__bar { transition: none; }
}

/* текущее задание */
.pg-current-task__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.pg-current-task__badge {
    font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
    color: var(--brand);
}
.pg-current-task__title { font-size: 1.05rem; font-weight: 700; color: var(--heading); margin: 0 0 8px; }
.pg-current-task__statement { color: var(--text-muted); font-size: .92rem; line-height: 1.55; white-space: pre-wrap; }
.pg-btn-link {
    border: none; background: none; color: var(--text-dim); cursor: pointer;
    font-size: .78rem; display: inline-flex; align-items: center; gap: 4px; padding: 0;
}
.pg-btn-link:hover { color: var(--brand); }

/* результат проверки */
.pg-current-task__result { margin-top: 14px; padding: 12px 14px; border-radius: 12px; font-size: .9rem; font-weight: 600; }
.pg-current-task__result[hidden] { display: none !important; }
.pg-current-task__result.is-ok { background: rgba(52,211,153,.14); color: #6ee7b7; border: 1px solid rgba(52,211,153,.3); }
.pg-current-task__result.is-fail { background: rgba(248,113,113,.12); color: #fca5a5; border: 1px solid rgba(248,113,113,.28); }
.pg-current-task__result i { margin-right: 4px; }
.pg-diff { margin-top: 8px; font-weight: 500; }
.pg-diff span { display: block; font-size: .76rem; opacity: .8; margin-bottom: 2px; }
.pg-diff pre {
    margin: 0 0 4px; padding: 8px 10px; border-radius: 8px; white-space: pre-wrap;
    background: rgba(0,0,0,.25); color: var(--text); font: 400 .82rem/1.5 ui-monospace, monospace;
    max-height: 120px; overflow: auto;
}
