/* ==========================================================================
   DocGen AI · Premium layer
   Подключается ПОСЛЕДНИМ поверх стилей страницы. Единые токены (цвет, тени,
   радиусы, типографика), кнопки, поля и карточки; мобильная оболочка
   кабинета — нижняя панель вкладок, форма первой, документы строками.
   Классы прежней вёрстки не переименовываются — на них опираются скрипты.
   ========================================================================== */

:root {
    /* палитра */
    --pm-bg: #f5f6f3;
    --pm-surface: #ffffff;
    --pm-surface-2: #f9faf8;
    --pm-line: rgba(16, 30, 23, 0.08);
    --pm-line-2: rgba(16, 30, 23, 0.14);
    --pm-ink: #0c1410;
    --pm-ink-2: #27312c;
    --pm-muted: #5c6862;
    --pm-faint: #8c9690;
    --pm-brand: #0b7d57;          /* контраст с белым 5,2 — проходит AA (у #059669 было 3,8) */
    --pm-brand-hover: #086646;
    --pm-brand-ink: #054a33;
    --pm-brand-soft: #e8f4ee;
    --pm-brand-ring: rgba(11, 125, 87, 0.20);
    --pm-brand-bright: #34d399;   /* на тёмном фоне */
    --pm-night: #0a110d;
    --pm-night-2: #101a15;
    --pm-danger: #c0362c;
    --pm-danger-soft: #fdeeec;

    /* форма */
    --pm-r-xs: 6px;
    --pm-r-sm: 9px;
    --pm-r: 12px;
    --pm-r-lg: 16px;
    --pm-r-xl: 22px;
    --pm-sh-1: 0 1px 2px rgba(16, 30, 23, 0.05);
    --pm-sh-2: 0 1px 2px rgba(16, 30, 23, 0.04), 0 6px 16px -8px rgba(16, 30, 23, 0.10);
    --pm-sh-3: 0 2px 6px rgba(16, 30, 23, 0.04), 0 20px 44px -18px rgba(16, 30, 23, 0.22);
    --pm-sh-4: 0 32px 80px -24px rgba(8, 14, 11, 0.40);
    --pm-ease: cubic-bezier(.2, .7, .2, 1);
    --pm-h: 42px;                 /* высота кнопок и полей */

    /* мобильная нижняя панель (кабинет) — 0 на компьютере */
    --pm-tabbar: 0px;
    --pm-safe-bottom: env(safe-area-inset-bottom, 0px);

    /* прежние переменные кабинета — на новую палитру */
    --emerald: var(--pm-brand);
    --emerald-deep: var(--pm-brand-hover);
    --emerald-darker: #06402c;
    --emerald-pale: var(--pm-brand-soft);
    --emerald-mist: #f1f8f4;
    --ink: var(--pm-ink);
    --ink-2: var(--pm-ink-2);
    --moss-1: var(--pm-bg);
    --moss-2: #eaede8;
    --moss-3: #dce1db;
    --gray-4: #a9b1ac;
    --gray-5: var(--pm-muted);
    --gray-6: var(--pm-ink-2);
}

/* --------------------------------------------------------------- база */
body {
    background: var(--pm-bg);
    color: var(--pm-ink);
    font-feature-settings: "ss01", "cv05";
}
::selection { background: rgba(11, 125, 87, 0.16); }
:focus-visible { outline: 2px solid var(--pm-brand); outline-offset: 2px; border-radius: 6px; }
button:focus:not(:focus-visible) { outline: none; }
.num, .wallet-num, .counter-pill, .price, [class*="balance"] b { font-variant-numeric: tabular-nums; }

/* тонкая полоса прокрутки в рабочей области */
.content, .docs-list, .agent-chat, .sidebar { scrollbar-width: thin; scrollbar-color: rgba(16, 30, 23, 0.18) transparent; }
.content::-webkit-scrollbar { width: 10px; }
.content::-webkit-scrollbar-thumb { background: rgba(16, 30, 23, 0.14); border-radius: 10px; border: 3px solid var(--pm-bg); }

/* ============================================================ КАБИНЕТ */

/* боковая панель */
.sidebar {
    background:
        radial-gradient(120% 60% at 0% 0%, rgba(52, 211, 153, 0.07), transparent 60%),
        linear-gradient(180deg, var(--pm-night-2), var(--pm-night));
    border-right: 1px solid rgba(255, 255, 255, 0.05);
    padding: 22px 14px 16px;
}
.sb-logo { margin-bottom: 26px; padding: 4px 8px; }
.logo-text { font-size: 16px; font-weight: 700; letter-spacing: -0.025em; }
.sb-label { font-size: 10.5px; letter-spacing: 0.14em; color: rgba(255, 255, 255, 0.32); margin: 18px 0 6px; padding: 0 10px; }
.sb-item {
    position: relative;
    padding: 9px 12px;
    font-size: 14px; font-weight: 500;
    color: rgba(255, 255, 255, 0.66);
    border-radius: 10px;
    transition: background .18s var(--pm-ease), color .18s var(--pm-ease);
}
.sb-item:hover { background: rgba(255, 255, 255, 0.045); color: #fff; }
.sb-item.active {
    background: linear-gradient(90deg, rgba(52, 211, 153, 0.14), rgba(52, 211, 153, 0.04));
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(52, 211, 153, 0.14);
}
.sb-item.active::before {
    content: ""; position: absolute; left: -14px; top: 9px; bottom: 9px; width: 3px;
    border-radius: 0 3px 3px 0; background: var(--pm-brand-bright);
    box-shadow: 0 0 12px rgba(52, 211, 153, 0.6);
}
.sb-item.active .ico { color: var(--pm-brand-bright); }
.sb-plan {
    background: linear-gradient(150deg, rgba(52, 211, 153, 0.11), rgba(255, 255, 255, 0.02));
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 16px;
}
.sb-plan-cta { height: 36px; border-radius: 10px; font-weight: 700; }
.sb-user { border-color: rgba(255, 255, 255, 0.06); border-radius: 12px; }

/* шапка */
.topbar {
    background: rgba(245, 246, 243, 0.78);
    -webkit-backdrop-filter: saturate(160%) blur(18px);
    backdrop-filter: saturate(160%) blur(18px);
    border-bottom: 1px solid var(--pm-line);
    padding: 14px 36px;
}
.crumb { font-size: 11px; letter-spacing: 0.08em; color: var(--pm-faint); }
.crumb-root { color: var(--pm-faint); }
.topbar h1 { font-size: 21px; font-weight: 700; letter-spacing: -0.028em; }
.icon-btn {
    width: 38px; height: 38px; border-radius: 11px;
    border: 1px solid var(--pm-line); box-shadow: var(--pm-sh-1);
    color: var(--pm-ink-2);
}
.icon-btn:hover { background: #fff; border-color: var(--pm-line-2); }
.wallet-chip {
    height: 38px;
    background: #fff !important;
    border: 1px solid var(--pm-line) !important;
    box-shadow: var(--pm-sh-1);
    border-radius: 999px;
}
.wallet-chip:hover { border-color: rgba(11, 125, 87, 0.35) !important; box-shadow: 0 0 0 4px var(--pm-brand-ring); }
.wallet-num { font-weight: 800; letter-spacing: -0.01em; }

.content { padding: 28px 36px 56px; }

/* карточки */
.card, .stat-card, .doc-card, .template-card, .rq-card, .gost-sub-card, .sub-card-mini,
.mytpl-card, .agent-empty-card, .help-card, .gost-preview-card, .faq-item {
    border-color: var(--pm-line) !important;
    box-shadow: var(--pm-sh-1);
}
.card { border-radius: var(--pm-r-lg); }
.card-head { padding: 18px 22px; border-bottom-color: var(--pm-line); }
.card-head h3 { font-size: 16px; letter-spacing: -0.02em; }
.card-head .ico-wrap { border-radius: 11px; }
.stat-card { border-radius: var(--pm-r-lg); }
.stat-card .num { letter-spacing: -0.035em; font-variant-numeric: tabular-nums; }
.stat-card.hero {
    background:
        radial-gradient(80% 90% at 100% 0%, rgba(52, 211, 153, 0.28), transparent 60%),
        linear-gradient(150deg, #0b3a2a 0%, var(--pm-night) 70%);
    box-shadow: var(--pm-sh-3);
}
.stat-card.hero::before { display: none; }
.template-card { border-radius: 14px; transition: border-color .18s var(--pm-ease), box-shadow .18s var(--pm-ease), transform .18s var(--pm-ease); }
.template-card:hover { background: #fff; border-color: rgba(11, 125, 87, 0.35) !important; box-shadow: var(--pm-sh-2); transform: translateY(-1px); }
.doc-card { border-radius: var(--pm-r-lg); transition: border-color .18s var(--pm-ease), box-shadow .18s var(--pm-ease), transform .18s var(--pm-ease); }
.doc-card:hover { border-color: rgba(11, 125, 87, 0.30) !important; box-shadow: var(--pm-sh-3); }
.doc-icon { border-radius: 11px; letter-spacing: 0.02em; }
.doc-icon.docx { background: #e7efff; color: #1e4fd1; }
.doc-icon.pdf { background: #fdebea; color: #b4261d; }
.doc-icon.xlsx { background: var(--pm-brand-soft); color: var(--pm-brand-ink); }
.tip-card { border-style: solid; border-color: rgba(11, 125, 87, 0.18); background: linear-gradient(150deg, #f1f8f4, #fff); }

/* кнопки: основная — изумрудная, второстепенная — белая с тонкой рамкой */
.gen-btn, .btn-emerald, .mytpl-use, .rq-btn, .brand-btn.primary, .help-contact-btn:not(.ghost) {
    background: linear-gradient(180deg, #0d8a60, var(--pm-brand)) !important;
    color: #fff !important;
    border: 1px solid rgba(5, 74, 51, 0.35) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.18) inset, 0 1px 2px rgba(5, 74, 51, 0.25), 0 6px 16px -8px rgba(11, 125, 87, 0.6);
    font-weight: 700;
    letter-spacing: -0.01em;
    transition: transform .15s var(--pm-ease), box-shadow .15s var(--pm-ease), filter .15s;
}
.gen-btn:hover, .btn-emerald:hover, .mytpl-use:hover, .rq-btn:hover, .brand-btn.primary:hover, .help-contact-btn:not(.ghost):hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.18) inset, 0 2px 4px rgba(5, 74, 51, 0.2), 0 12px 24px -10px rgba(11, 125, 87, 0.65);
}
.gen-btn:active, .btn-emerald:active, .mytpl-use:active, .rq-btn:active { transform: translateY(0); filter: brightness(.97); }
.gen-btn { border-radius: 14px; padding: 15px; font-size: 15px; }
.mytpl-use, .rq-btn { min-height: 38px; border-radius: 10px !important; }
.mytpl-use.ghost, .rq-btn.ghost, .brand-btn:not(.primary), .agent-tb-btn, .tool-btn, .page-btn {
    background: #fff !important;
    color: var(--pm-ink) !important;
    border: 1px solid var(--pm-line-2) !important;
    box-shadow: var(--pm-sh-1);
    filter: none;
}
.mytpl-use.ghost:hover, .rq-btn.ghost:hover, .brand-btn:not(.primary):hover, .agent-tb-btn:hover:not(:disabled), .tool-btn:hover, .page-btn:hover {
    background: var(--pm-surface-2) !important;
    border-color: rgba(16, 30, 23, 0.24) !important;
    transform: none;
}
.page-btn.active { background: var(--pm-ink) !important; color: #fff !important; border-color: var(--pm-ink) !important; }
.mytpl-del {
    width: 38px; height: 38px; padding: 0 !important; border-radius: 10px;
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--pm-faint) !important; background: transparent !important; border: 1px solid transparent !important;
    font-size: 0 !important;
}
.mytpl-del::before {
    content: ""; width: 16px; height: 16px; background: currentColor;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 6 5 6 21 6'/><path d='M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6'/><path d='M10 11v6M14 11v6'/></svg>") center / contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 6 5 6 21 6'/><path d='M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6'/><path d='M10 11v6M14 11v6'/></svg>") center / contain no-repeat;
}
.mytpl-del:hover { color: var(--pm-danger) !important; background: var(--pm-danger-soft) !important; }
.link-btn { color: var(--pm-brand); }
.link-btn:hover { color: var(--pm-brand-ink); }

/* поля ввода */
.text-input, .select-input, .dgf-input, .rq-field input, .rq-field select, .rq-field textarea, .search-wrap input {
    background: #fff !important;
    border: 1px solid var(--pm-line-2) !important;
    border-radius: 11px !important;
    box-shadow: 0 1px 1px rgba(16, 30, 23, 0.03) inset;
    font-size: 14.5px;
    transition: border-color .15s, box-shadow .15s;
}
.text-input, .select-input { min-height: var(--pm-h); }
.text-input::placeholder, .search-wrap input::placeholder, .prompt-textarea::placeholder { color: #a3aca7; }
.text-input:hover, .select-input:hover, .search-wrap input:hover { border-color: rgba(16, 30, 23, 0.24) !important; }
.text-input:focus, .select-input:focus, .dgf-input:focus, .rq-field input:focus, .rq-field select:focus,
.rq-field textarea:focus, .search-wrap input:focus {
    border-color: var(--pm-brand) !important;
    box-shadow: 0 0 0 4px var(--pm-brand-ring) !important;
    outline: none;
}
.field-block label, .prompt-label { font-size: 12.5px; font-weight: 650; color: var(--pm-ink-2); letter-spacing: -0.005em; }
.prompt-wrap {
    background: #fff; border: 1px solid var(--pm-line-2); border-radius: 16px;
    box-shadow: 0 1px 1px rgba(16, 30, 23, 0.03) inset;
}
.prompt-wrap:focus-within { border-color: var(--pm-brand); box-shadow: 0 0 0 4px var(--pm-brand-ring); }
.prompt-bottom { border-top-color: var(--pm-line); }
.tool-btn { border-radius: 999px !important; height: 32px; }
.tool-btn.on, .tool-chip.on { background: var(--pm-brand-soft) !important; border-color: rgba(11, 125, 87, 0.25) !important; color: var(--pm-brand-ink) !important; }

/* сегменты и вкладки */
.format-seg, .mini-tabs, .filter-tabs, .view-toggle, .gost-card-tabs, .brand-method-tabs {
    background: #eef1ec !important;
    border: 1px solid var(--pm-line) !important;
    border-radius: 12px !important;
    padding: 3px !important;
}
.format-opt.active, .mini-tab.active, .view-btn.active, .gost-tab.active {
    background: #fff !important; color: var(--pm-ink) !important;
    box-shadow: 0 1px 2px rgba(16, 30, 23, 0.08), 0 0 0 1px rgba(16, 30, 23, 0.05) !important;
}
.filter-tab.active { background: #fff !important; color: var(--pm-ink) !important; box-shadow: 0 1px 2px rgba(16, 30, 23, 0.08), 0 0 0 1px rgba(16, 30, 23, 0.05); }
.filter-tab.active .ct { background: var(--pm-brand-soft); color: var(--pm-brand-ink); }
.format-opt, .mini-tab, .filter-tab, .gost-tab { border-radius: 9px !important; }

/* действия у документов видны на сенсорных экранах (там нет наведения) */
@media (hover: none) {
    .doc-menu, .doc-actions, .doc-card-actions { opacity: 1 !important; }
}

/* ===================================================== ДИАЛОГИ */
.dgf-modal, .sign-modal > div, .dgf-dialog {
    border-radius: var(--pm-r-xl) !important;
    box-shadow: var(--pm-sh-4) !important;
}

/* ========================================== КАБИНЕТ · ПЛАНШЕТ И ТЕЛЕФОН */
.m-tabbar { display: none; }

@media (max-width: 1024px) {
    :root { --pm-tabbar: 64px; }
    .m-tabbar {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 150;
        display: grid; grid-template-columns: repeat(5, 1fr);
        height: calc(var(--pm-tabbar) + var(--pm-safe-bottom));
        padding: 6px 6px calc(6px + var(--pm-safe-bottom));
        background: rgba(255, 255, 255, 0.86);
        -webkit-backdrop-filter: saturate(180%) blur(20px);
        backdrop-filter: saturate(180%) blur(20px);
        border-top: 1px solid var(--pm-line);
        box-shadow: 0 -8px 24px -16px rgba(16, 30, 23, 0.25);
    }
    .m-tab {
        display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
        border-radius: 12px;
        font-size: 10.5px; font-weight: 650; letter-spacing: -0.005em;
        color: var(--pm-faint);
        -webkit-tap-highlight-color: transparent;
        transition: color .15s, background .15s;
    }
    .m-tab svg { width: 22px; height: 22px; stroke-width: 1.9; }
    .m-tab.active { color: var(--pm-brand); }
    .m-tab.active svg { stroke-width: 2.2; }
    .m-tab:active { background: rgba(16, 30, 23, 0.05); }

    .topbar .cab-burger { display: none !important; }
    .content { padding-bottom: calc(var(--pm-tabbar) + var(--pm-safe-bottom) + 28px); }
}

@media (max-width: 640px) {
    /* шапка в одну строку: название раздела и баланс */
    .topbar { padding: 10px 16px; min-height: 58px; }
    .topbar .crumb { display: none; }
    .topbar h1 { font-size: 19px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .topbar-left { flex: 1; }
    .wallet-chip { height: 36px; padding: 0 6px 0 10px !important; gap: 6px !important; }
    .wallet-chip .wallet-unit { display: none; }
    .topbar-right .icon-btn { display: none; }
    .content { padding: 16px 16px calc(var(--pm-tabbar) + var(--pm-safe-bottom) + 24px); }

    /* «Создать»: сначала форма, затем быстрые шаблоны; счётчики — в шапке (баланс) */
    .pane[data-pane="create"].active { display: flex; flex-direction: column; gap: 18px; }
    .pane[data-pane="create"] .stats-row { display: none; }
    .pane[data-pane="create"] .work-grid { order: 1; gap: 18px; }
    .pane[data-pane="create"] .templates { order: 2; margin-bottom: 0; }
    .templates-grid {
        display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory;
        margin: 0 -16px; padding: 2px 16px 6px; scrollbar-width: none;
    }
    .templates-grid::-webkit-scrollbar { display: none; }
    .templates-grid .template-card { flex: 0 0 78%; scroll-snap-align: start; }
    .card { border-radius: 18px; }
    .card-head { padding: 16px; }
    .card-body { padding: 16px; }
    .gen-btn { padding: 16px; font-size: 16px; }

    /* документы — компактные строки с видимыми действиями */
    .docs-grid { gap: 10px; }
    .docs-grid .doc-card {
        display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 12px; row-gap: 2px;
        align-items: center; padding: 14px; border-radius: 16px;
    }
    .docs-grid .doc-card:hover { transform: none; }
    .docs-grid .doc-card-head { display: contents; }
    .docs-grid .doc-card .doc-icon { grid-row: 1 / span 2; grid-column: 1; width: 40px; height: 40px; }
    .docs-grid .doc-card h4 { grid-column: 2; grid-row: 1; margin: 0; font-size: 14.5px; -webkit-line-clamp: 2; }
    .docs-grid .doc-card .meta { grid-column: 2; grid-row: 2; margin: 0; }
    .docs-grid .doc-card .doc-card-actions {
        grid-column: 1 / -1; grid-row: 3; display: flex; justify-content: flex-end; gap: 4px;
        margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--pm-line);
    }
    .docs-grid .doc-card .doc-menu { width: 38px; height: 38px; border-radius: 10px; color: var(--pm-muted); }

    /* мои шаблоны: действия одной аккуратной строкой */
    .mytpl-item { flex-direction: column; align-items: stretch !important; gap: 12px; }
    .mytpl-item > div:last-child { display: grid !important; grid-template-columns: 1fr 1fr auto; gap: 8px !important; }
    .mytpl-item > div:last-child .mytpl-use { width: 100%; }
}

@media (max-width: 380px) {
    .m-tab { font-size: 10px; }
    .templates-grid .template-card { flex-basis: 86%; }
}

/* мои шаблоны */
.mytpl-item { border-color: var(--pm-line) !important; border-radius: 14px !important; }
.mytpl-kind { border: 1px solid var(--pm-line-2); border-radius: 6px; padding: 1px 7px; margin-right: 6px; font-weight: 600; }

/* компактная сводка на «Создать»: форма запроса поднимается на первый экран */
@media (min-width: 641px) {
    .stats-row { gap: 12px; margin-bottom: 18px; }
    .stat-card { padding: 16px 18px; min-height: 0; }
    .stat-card .label { margin-bottom: 6px; font-size: 11px; }
    .stat-card .num { font-size: 28px; }
    .stat-card .sub { margin-top: 6px; font-size: 12px; }
    .stat-card .stat-icon { top: 14px; right: 14px; }
    .stat-card.hero { padding: 18px 20px; }
    .hero-card-text .greeting { font-size: 12.5px; }
    .hero-card-text h2 { font-size: 22px; }
    .hero-card-cta { margin-top: 12px; }
    .templates { margin-bottom: 18px; }
    .template-card { padding: 13px 14px; }
}
.prompt-bottom { flex-wrap: wrap; gap: 8px; }
.char-count { white-space: nowrap; margin-left: auto; }

@media (max-width: 640px) {
    .mytpl-item > div:last-child { grid-template-columns: 1fr 1fr 38px !important; }
    .mytpl-item > div:last-child .mytpl-use:first-child { grid-column: 1 / -1; }
}
@media (min-width: 641px) {
    .stat-card.hero .hero-card-cta { display: none; }
    .hero-card-text .greeting { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .hero-card-text h2 { font-size: 21px; line-height: 1.15; }
}

/* «Баланс»: карточка своей высоты, под ней — цены и пакеты */
.sub-grid { align-items: start; }
.sub-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.sub-current { border-radius: 20px; box-shadow: var(--pm-sh-3); }
.sub-current h2 { font-variant-numeric: tabular-nums; letter-spacing: -0.04em; }
.sub-price-list { padding: 6px 22px 10px; }
.sub-price-row {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 13px 0; border-bottom: 1px solid var(--pm-line);
}
.sub-price-row:last-child { border-bottom: 0; }
.sub-price-row b { display: block; font-size: 14px; font-weight: 650; letter-spacing: -0.01em; }
.sub-price-row span { display: block; font-size: 12.5px; color: var(--pm-muted); margin-top: 2px; }
.sub-price-row em {
    font-style: normal; white-space: nowrap; font-weight: 750; font-size: 13.5px;
    color: var(--pm-brand-ink); background: var(--pm-brand-soft); padding: 5px 10px; border-radius: 999px;
    font-variant-numeric: tabular-nums;
}
.sub-pack-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 16px 22px 20px; }
.sub-pack {
    display: flex; flex-direction: column; gap: 4px; padding: 14px; border-radius: 14px;
    border: 1px solid var(--pm-line); background: var(--pm-surface-2);
    transition: border-color .15s, box-shadow .15s, transform .15s;
}
.sub-pack:hover { border-color: rgba(11, 125, 87, 0.35); box-shadow: var(--pm-sh-2); transform: translateY(-1px); background: #fff; }
.sub-pack-rub { font-size: 18px; font-weight: 800; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.sub-pack-tok { font-size: 12.5px; color: var(--pm-muted); }
.sub-pack-bonus { align-self: flex-start; margin-top: 4px; font-size: 11.5px; font-weight: 750; color: var(--pm-brand-ink);
    background: var(--pm-brand-soft); padding: 2px 8px; border-radius: 999px; }
.sub-pack-bonus.muted { color: var(--pm-faint); background: transparent; padding-left: 0; }
/* email аккаунта — обычным текстом, без плашки */
#subAccountEmail { background: none !important; color: var(--pm-ink) !important; padding: 0 !important; font-family: inherit !important;
    font-style: normal !important; font-weight: 650; font-size: 13.5px; word-break: break-all; }
.card-payment { background: none !important; padding: 0 !important; border: 0 !important; margin: 4px 0 2px !important; }
@media (max-width: 640px) {
    .sub-pack-grid { grid-template-columns: 1fr 1fr; padding: 14px 16px 16px; }
    .sub-price-list { padding: 4px 16px 8px; }
}

/* агент на телефоне: без рекламного баннера над документом — баланс в шапке, пояснение в пустом состоянии */
@media (max-width: 640px) {
    .pane[data-pane="agent"] .agent-banner { display: none; }
}
/* Excel в агенте на телефоне — HTML-таблица с горизонтальной прокруткой */
.xh-mode { height: auto !important; max-height: none !important; overflow: visible !important; padding: 0 0 8px; }
.xh-name { font-size: 12px; font-weight: 700; color: var(--pm-muted); padding: 12px 14px 6px; text-transform: uppercase; letter-spacing: .06em; }
.xh-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; padding: 0 12px 6px; }
.xh-wrap table { border-collapse: collapse; font-size: 13px; background: #fff; }
.xh-wrap td { border: 1px solid #dfe4df; padding: 7px 10px; white-space: nowrap; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.xh-wrap td[data-t="n"] { text-align: right; font-variant-numeric: tabular-nums; }
.xh-wrap tr:first-child td { background: #f6f8f5; }

/* ===================================================== 02.10: доработки по скриншотам */

/* — «Создать документ» и стоимость под кнопкой — */
.gen-btn { gap: 10px; }
.gen-btn .kbd { margin-left: 4px; background: rgba(255, 255, 255, 0.16); font-family: inherit; font-weight: 700; }
.gen-cost {
    display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px;
    margin-top: 12px; font-size: 12.5px; line-height: 1.5; color: var(--pm-muted); text-align: center;
}
.gen-cost b { color: var(--pm-ink); font-weight: 750; }
.gen-cost a { color: var(--pm-brand); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.gen-cost-sep { color: var(--pm-faint); }
.gen-cost-coin, .wallet-ico {
    flex: none; width: 18px; height: 18px; border-radius: 50%;
    background:
        radial-gradient(circle at 30% 28%, rgba(255, 255, 255, 0.85) 0 2px, transparent 3px),
        conic-gradient(from 210deg, #34d399, #0b7d57, #0f9d6e, #6ee7b7, #34d399);
    box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, 0.35), 0 1px 2px rgba(5, 74, 51, 0.35);
}
.gen-cost.low .gen-cost-coin { background: conic-gradient(from 210deg, #fbbf24, #d97706, #f59e0b, #fde68a, #fbbf24); }
.gen-cost.low { color: #92400e; }

/* — счётчик токенов в шапке — */
.topbar-right .wallet-chip {
    height: 40px; padding: 4px 4px 4px 6px !important; gap: 8px !important;
    background: #fff !important; border: 1px solid var(--pm-line) !important; border-radius: 999px;
    box-shadow: 0 1px 2px rgba(16, 30, 23, 0.05), 0 6px 18px -10px rgba(11, 125, 87, 0.35);
    transform: none;
}
.topbar-right .wallet-chip:hover { border-color: rgba(11, 125, 87, 0.30) !important; box-shadow: 0 0 0 4px var(--pm-brand-ring); transform: none; }
.topbar-right .wallet-ico { width: 30px; height: 30px; color: transparent; display: inline-flex; }
.topbar-right .wallet-ico svg { display: none; }
.topbar-right .wallet-num {
    font-family: inherit; font-size: 16px; font-weight: 800; color: var(--pm-ink);
    letter-spacing: -0.03em; font-variant-numeric: tabular-nums;
}
.topbar-right .wallet-unit { font-size: 12px; font-weight: 600; color: var(--pm-muted); margin-left: -3px; }
.topbar-right .wallet-plus {
    width: 30px; height: 30px; margin-left: 2px; border-radius: 50%;
    background: var(--pm-brand-soft); color: var(--pm-brand);
    transition: background .15s, color .15s, transform .15s;
}
.topbar-right .wallet-plus svg { width: 13px; height: 13px; stroke-width: 3; }
.topbar-right .wallet-chip:hover .wallet-plus { background: var(--pm-brand); color: #fff; transform: rotate(90deg); }
.topbar-right .wallet-chip.low { border-color: #fcd34d !important; background: #fffdf5 !important; }
.topbar-right .wallet-chip.low .wallet-ico { background: radial-gradient(circle at 30% 28%, rgba(255, 255, 255, 0.85) 0 2px, transparent 3px),
    conic-gradient(from 210deg, #fbbf24, #d97706, #f59e0b, #fde68a, #fbbf24); }
.topbar-right .wallet-chip.low .wallet-num { color: #92400e; }
.topbar-right .wallet-chip.low .wallet-plus { background: #fef3c7; color: #b45309; }

/* — «Оформление»: две равные кнопки — */
.gost-foot { align-items: center; }
.gost-foot .st-reset {
    min-height: 44px; padding: 0 20px !important; border-radius: 12px;
    background: #fff; color: var(--pm-ink) !important; font-weight: 650;
    border: 1px solid var(--pm-line-2); box-shadow: var(--pm-sh-1);
}
.gost-foot .st-reset:hover { background: var(--pm-surface-2); border-color: rgba(16, 30, 23, 0.24); }
.gost-foot .btn-emerald { min-height: 44px; border-radius: 12px; padding: 0 26px !important; }

@media (max-width: 640px) {
    /* быстрые шаблоны — аккуратный список, без обрезанной ленты */
    .templates-grid { display: flex; flex-direction: column; gap: 8px; overflow: visible; margin: 0; padding: 0; }
    .templates-grid .template-card { flex: none; padding: 12px 14px; border-radius: 14px; }
    .templates-grid .template-card .ico { width: 36px; height: 36px; border-radius: 10px; }
    .templates .link-btn { margin-top: 4px; }

    /* поле запроса: подсказка мельче, инструменты — круглые иконки */
    .prompt-textarea { font-size: 16px; min-height: 140px; }
    .prompt-textarea::placeholder { font-size: 14px; line-height: 1.5; }
    .prompt-bottom { flex-wrap: nowrap; align-items: center; gap: 8px; }
    .prompt-tools { flex-wrap: nowrap; gap: 8px; align-items: center; min-width: 0; overflow-x: auto; scrollbar-width: none; }
    .prompt-tools::-webkit-scrollbar { display: none; }
    .prompt-tools .tool-label { display: none; }
    .prompt-tools .tool-btn { width: 38px; height: 38px; padding: 0 !important; justify-content: center; flex: none; }
    .prompt-tools .tool-btn svg { width: 17px; height: 17px; }
    .prompt-tools .tool-chip { height: 38px; flex: none; white-space: nowrap; font-size: 12.5px; border-radius: 999px; }
    .prompt-tools .dgf-mic.listening::before { margin-right: 0; }
    .char-count { font-size: 11px; color: var(--pm-faint); }

    /* стоимость под кнопкой — коротко */
    .gen-cost-more { display: none; }
    .gen-btn .kbd { display: none; }

    /* счётчик токенов на телефоне */
    .topbar-right .wallet-chip { height: 38px; padding: 3px 3px 3px 4px !important; gap: 7px !important; }
    .topbar-right .wallet-ico, .topbar-right .wallet-plus { width: 30px; height: 30px; }
    .topbar-right .wallet-num { font-size: 15px; }

    /* «Оформление»: кнопки поровну */
    .gost-foot { display: grid; grid-template-columns: 1fr 1.3fr; gap: 10px; padding: 14px 16px; }
    .gost-foot .st-reset, .gost-foot .btn-emerald { width: 100%; justify-content: center; padding: 0 12px !important; }
}

/* монета токенов: чёткий круг с ободком и белой «искрой» */
.gen-cost-coin, .topbar-right .wallet-ico {
    position: relative; display: inline-block; flex: none;
    background: linear-gradient(145deg, #3fd9a2 0%, #12a172 45%, #0a6e4c 100%) !important;
    box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, 0.45), inset 0 -2px 3px rgba(4, 50, 34, 0.35),
                0 1px 2px rgba(5, 74, 51, 0.30) !important;
}
.gen-cost-coin::after, .topbar-right .wallet-ico::after {
    content: ""; position: absolute; inset: 22%; background: #fff;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 1.5l2.6 7.9 7.9 2.6-7.9 2.6L12 22.5l-2.6-7.9L1.5 12l7.9-2.6z'/></svg>") center / contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 1.5l2.6 7.9 7.9 2.6-7.9 2.6L12 22.5l-2.6-7.9L1.5 12l7.9-2.6z'/></svg>") center / contain no-repeat;
}
.gen-cost.low .gen-cost-coin, .topbar-right .wallet-chip.low .wallet-ico {
    background: linear-gradient(145deg, #fcd34d 0%, #f59e0b 50%, #b45309 100%) !important;
}
.gen-cost { display: block; text-align: center; }
.gen-cost-coin { width: 16px; height: 16px; vertical-align: -3px; margin-right: 6px; }
.prompt-tools #attachBtn { order: 1; }
.prompt-tools .dgf-mic { order: 2; }
.prompt-tools .tool-chip { order: 3; }

/* ==========================================================================
   Окно генерации: ожидание (документ собирается, шаги, подсказки) → готово → ошибка
   ========================================================================== */
.dgm { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; padding: 24px;
       background: rgba(11, 20, 16, .55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-family: 'Manrope', sans-serif; }
.dgm-box { position: relative; width: 100%; max-width: 760px; max-height: 90vh; display: flex; flex-direction: column; overflow: hidden;
           background: #fff; border-radius: 22px; box-shadow: 0 40px 100px -24px rgba(0, 0, 0, .45); animation: dgmIn .35s cubic-bezier(.2, .8, .2, 1); }
.dgm-box.preview { max-width: 980px; height: min(92vh, 1040px); }
@keyframes dgmIn { from { opacity: 0; transform: translateY(14px) scale(.98); } }
.dgm-head { display: flex; align-items: center; gap: 14px; padding: 18px 20px 14px 22px; }
.dgm-ring { position: relative; flex: none; width: 44px; height: 44px; }
.dgm-ring > svg { width: 44px; height: 44px; transform: rotate(-90deg); }
.dgm-ring .tr { fill: none; stroke: #e8f4ee; stroke-width: 4; }
.dgm-ring .pr { fill: none; stroke: var(--pm-brand); stroke-width: 4; stroke-linecap: round; stroke-dasharray: 119.4; stroke-dashoffset: 119.4; transition: stroke-dashoffset .4s ease; }
.dgm-ring::after { content: ''; position: absolute; inset: 11px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #34d399, #0b7d57);
                   animation: dgmPulse 1.6s ease-in-out infinite; }
@keyframes dgmPulse { 50% { transform: scale(.72); opacity: .55; } }
.dgm-ok { position: absolute; inset: 7px; display: grid; place-items: center; border-radius: 50%; background: var(--pm-brand); color: #fff; opacity: 0; transform: scale(.4); transition: .35s cubic-bezier(.3, 1.6, .5, 1); }
.dgm-ok svg { width: 16px; height: 16px; }
.dgm-box.done .dgm-ring::after { display: none; }
.dgm-box.done .dgm-ok { opacity: 1; transform: none; }
.dgm-titles { flex: 1; min-width: 0; }
.dgm-title { font-size: 17px; font-weight: 800; letter-spacing: -.02em; color: var(--pm-ink); }
.dgm-status { margin-top: 3px; font-size: 13px; color: var(--pm-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dgm-timer { flex: none; padding: 5px 10px; border-radius: 999px; background: #f1f8f4; color: var(--pm-brand); font: 700 13px/1 'JetBrains Mono', monospace; }
.dgm-x { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #f3f5f2; color: #5c6862; cursor: pointer; transition: background .15s; }
.dgm-x:hover { background: #e8ece8; color: var(--pm-ink); }
.dgm-bar { height: 4px; margin: 0 22px; border-radius: 4px; background: #eef1ed; overflow: hidden; }
.dgm-bar > div { height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #34d399, #0b7d57); transition: width .35s ease; }
.dgm-content { flex: 1; min-height: 240px; overflow-y: auto; margin-top: 14px; border-top: 1px solid #eef1ed; }
.dgm-foot { padding: 16px 20px 18px; border-top: 1px solid #eef1ed; background: #fff; }

/* ожидание: документ собирается на глазах */
.dgw { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 26px; align-items: center; padding: 26px 28px 28px; min-height: 100%;
       background: radial-gradient(60% 80% at 20% 30%, rgba(52, 211, 153, .12), transparent 70%), linear-gradient(180deg, #fbfcfa, #f4f7f3); }
.dgw-stage { position: relative; height: 300px; perspective: 900px; display: grid; place-items: center; }
.dgw-page { position: relative; width: 196px; height: 268px; padding: 22px 20px; border-radius: 6px; background: #fff;
            box-shadow: 0 30px 50px -24px rgba(12, 20, 16, .45), 0 0 0 1px rgba(12, 20, 16, .06);
            transform: rotateY(-16deg) rotateX(8deg); animation: dgwFloat 5s ease-in-out infinite; }
@keyframes dgwFloat { 50% { transform: rotateY(-8deg) rotateX(4deg) translateY(-8px); } }
.dgw-page::after { content: ''; position: absolute; right: 0; top: 0; width: 22px; height: 22px; background: linear-gradient(225deg, #f1f4f0 50%, #e2e6e1 50%); border-bottom-left-radius: 5px; }
.dgw-fmt { position: absolute; left: 20px; top: 9px; padding: 2px 6px; border-radius: 4px; background: #2f6fde; color: #fff; font: 800 8.5px/1.3 'Manrope', sans-serif; letter-spacing: .04em; }
.dgw-fmt.pdf { background: #e5484d; } .dgw-fmt.xlsx { background: #16a34a; }
.dgw-page > i { display: block; height: 5px; width: var(--w, 100%); margin: 0 0 8px; border-radius: 3px; background: #dfe4e0; transform-origin: 0 50%;
                animation: dgwLine 6s cubic-bezier(.2, .8, .2, 1) infinite; animation-delay: calc(var(--i) * .2s); }
.dgw-page > i.t { width: 64%; height: 8px; margin: 8px auto 14px; background: #a9b2ad; }
.dgw-page > i.h { width: 44%; height: 6px; margin-top: 12px; background: #b9c2bc; }
.dgw-page > i.f { background: linear-gradient(90deg, #fde68a, #fcd34d); }
.dgw-page.xl > i:not(.t) { height: 9px; background: repeating-linear-gradient(90deg, #dfe4e0 0 30%, transparent 30% 34%); }
.dgw-page.xl > i.f { background: repeating-linear-gradient(90deg, #bbf7d0 0 30%, transparent 30% 34%); }
@keyframes dgwLine { 0% { transform: scaleX(0); opacity: 0; } 4% { opacity: 1; } 12%, 86% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(1); opacity: 0; } }
.dgw-stamp { position: absolute; right: 14px; bottom: 16px; padding: 4px 8px; border: 2px solid var(--pm-brand); border-radius: 7px; color: var(--pm-brand);
             font: 800 10.5px/1 'Manrope', sans-serif; letter-spacing: .06em; transform: rotate(-12deg); opacity: 0; animation: dgwStamp 6s ease-in-out infinite; animation-delay: 1.2s; }
@keyframes dgwStamp { 0%, 52% { opacity: 0; transform: rotate(-12deg) scale(2.2); } 58% { opacity: .95; transform: rotate(-12deg) scale(1); } 90% { opacity: .95; } 100% { opacity: 0; transform: rotate(-12deg) scale(1); } }
.dgw-chip { position: absolute; padding: 6px 10px; border-radius: 999px; background: #fff; color: var(--pm-ink); white-space: nowrap;
            font: 700 11.5px/1 'Manrope', sans-serif; box-shadow: 0 12px 24px -12px rgba(12, 20, 16, .4), 0 0 0 1px rgba(12, 20, 16, .06); animation: dgwChip 4.6s ease-in-out infinite; }
.dgw-chip.c1 { left: -6px; top: 4px; }
.dgw-chip.c2 { right: 2px; top: 118px; animation-delay: -1.5s; background: #0c1410; color: #d9f99d; }
.dgw-chip.c3 { left: 14px; bottom: 30px; animation-delay: -3s; }
@keyframes dgwChip { 50% { transform: translateY(-9px); } }
.dgw-side { min-width: 0; }
.dgw-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.dgw-steps li { display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 12px; font-size: 14.5px; font-weight: 600; color: #9aa39e; transition: background .25s, color .25s; }
.dgw-steps li i { position: relative; flex: none; width: 22px; height: 22px; border-radius: 50%; border: 2px solid #d5dbd6; transition: .25s; }
.dgw-steps li.now { background: #fff; color: var(--pm-ink); box-shadow: 0 10px 24px -14px rgba(12, 20, 16, .35), 0 0 0 1px rgba(11, 125, 87, .14); }
.dgw-steps li.now i { border-color: #d1fae5; border-top-color: var(--pm-brand); animation: dgSpin .8s linear infinite; }
.dgw-steps li.done { color: var(--pm-ink); }
.dgw-steps li.done i { border-color: var(--pm-brand); background-color: var(--pm-brand);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-position: center; background-size: 12px; background-repeat: no-repeat; }
@keyframes dgSpin { to { transform: rotate(360deg); } }
.dgw-tip { margin-top: 16px; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px dashed rgba(11, 125, 87, .3); font-size: 13.5px; line-height: 1.45; color: var(--pm-muted); }
.dgw-tip b { display: block; margin-bottom: 3px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--pm-brand); }
.dgw-tip span { display: block; }
.dgw-tip span.in { animation: dgwTip .5s ease; }
@keyframes dgwTip { from { opacity: 0; transform: translateY(6px); } }

/* готово: страницы целиком, кнопки по порядку */
.dgm-pages { position: relative; background: #e9edeb; }
.dgm-pages-in { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 16px 12px 22px; }
.dgm-pages-in img { display: block; width: 100%; max-width: 820px; height: auto; background: #fff; box-shadow: 0 6px 24px -6px rgba(11, 20, 16, .22); border-radius: 2px; }
.dgm-pages.fit-page .dgm-pages-in img { width: auto; max-width: 100%; height: var(--ph); }
.dgm-zoom { position: sticky; float: right; top: 12px; margin: 12px 14px -46px 0; z-index: 2; padding: 8px 13px; border: 0; border-radius: 999px; cursor: pointer;
            background: rgba(255, 255, 255, .92); color: var(--pm-ink); font: 700 12.5px/1 'Manrope', sans-serif; box-shadow: 0 8px 20px -10px rgba(12, 20, 16, .4); }
.dgm-zoom:hover { background: #fff; }
.dgm-main { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.dgm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 20px; border-radius: 13px; cursor: pointer;
           border: 1.5px solid #dce1db; background: #fff; color: var(--pm-ink); font: 700 14.5px/1 'Manrope', sans-serif; transition: transform .15s, border-color .15s, box-shadow .15s; }
.dgm-btn:hover { border-color: var(--pm-brand); transform: translateY(-1px); }
.dgm-btn.primary { border-color: transparent; background: linear-gradient(180deg, #0f9367, #0b7d57); color: #fff; box-shadow: 0 12px 24px -12px rgba(11, 125, 87, .85); }
.dgm-btn.primary:hover { box-shadow: 0 16px 30px -12px rgba(11, 125, 87, .95); }
.dgm-main .dgm-btn { flex: 0 1 260px; }
.dgm-next { margin-top: 14px; padding-top: 14px; border-top: 1px dashed #e3e7e2; }
.dgm-next-h { margin-bottom: 10px; text-align: center; font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--pm-faint); }
.dgm-next-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; }
.dgm-next-btn { display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 9px 12px; border: 1px solid #e3e7e2; border-radius: 13px; background: #fafbf9;
                text-align: left; cursor: pointer; font-family: inherit; transition: background .15s, border-color .15s, transform .15s; }
.dgm-next-btn:hover { background: #fff; border-color: rgba(11, 125, 87, .45); transform: translateY(-1px); }
.dgm-next-btn i { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: #e8f4ee; color: var(--pm-brand); }
.dgm-next-btn i svg { width: 16px; height: 16px; }
.dgm-next-btn span { min-width: 0; }
.dgm-next-btn b { display: block; font-size: 13.5px; font-weight: 700; line-height: 1.25; color: var(--pm-ink); }
.dgm-next-btn small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--pm-faint); }

/* ошибка генерации */
.dgm-err { display: flex; z-index: 10000; }
.dgm-ebox { position: relative; width: 100%; max-width: 430px; padding: 34px 28px 26px; border-radius: 22px; background: #fff; text-align: center;
            box-shadow: 0 40px 100px -24px rgba(0, 0, 0, .45); animation: dgmIn .3s cubic-bezier(.2, .8, .2, 1); }
.dgm-ebox .dgm-x { position: absolute; top: 14px; right: 14px; }
.dgm-eico { display: grid; place-items: center; width: 60px; height: 60px; margin: 0 auto 16px; border-radius: 50%; background: #fff7ed; color: #ea580c; border: 1px solid #fed7aa; }
.dgm-ebox h3 { margin: 0 0 8px; font-size: 21px; font-weight: 800; letter-spacing: -.02em; color: var(--pm-ink); }
.dgm-etext { margin: 0 0 14px; font-size: 14.5px; line-height: 1.55; color: var(--pm-muted); }
.dgm-ebadge { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 20px; padding: 6px 12px; border-radius: 999px; background: #e8f4ee; color: var(--pm-brand); font-size: 12.5px; font-weight: 700; }
.dgm-ebadge svg { width: 13px; height: 13px; }
.dgm-eact { display: grid; gap: 8px; }
.dgm-eact .dgm-btn { width: 100%; }

@media (max-width: 720px) {
    .dgm { padding: 10px; align-items: flex-end; }
    .dgm-box { max-height: 94vh; border-radius: 20px; }
    .dgm-box.preview { height: 94vh; }
    .dgm-head { padding: 14px 14px 12px 16px; gap: 11px; }
    .dgm-ring, .dgm-ring > svg { width: 38px; height: 38px; }
    .dgm-title { font-size: 16px; }
    .dgm-timer { font-size: 12px; padding: 4px 8px; }
    .dgm-bar { margin: 0 16px; }
    .dgw { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 18px 16px 20px; }
    .dgw-stage { height: 210px; }
    .dgw-page { width: 140px; height: 190px; padding: 16px 14px; }
    .dgw-page > i { height: 4px; margin-bottom: 6px; }
    .dgw-page > i.t { height: 6px; margin: 6px auto 10px; }
    .dgw-page > i.h { margin-top: 8px; }
    .dgw-chip { font-size: 10.5px; padding: 5px 8px; }
    .dgw-chip.c1 { left: 4%; top: 2px; } .dgw-chip.c2 { right: 6%; top: 84px; } .dgw-chip.c3 { left: 10%; bottom: 14px; }
    .dgw-steps li { padding: 7px 10px; font-size: 13.5px; }
    .dgw-tip { margin-top: 10px; font-size: 12.5px; }
    .dgm-foot { padding: 12px 14px 14px; }
    .dgm-main .dgm-btn { flex: 1 1 100%; }
    .dgm-next-grid { grid-template-columns: 1fr 1fr; gap: 6px; }
    .dgm-next-btn { min-height: 50px; padding: 8px 9px; gap: 8px; }
    .dgm-next-btn i { width: 28px; height: 28px; }
    .dgm-next-btn small { display: none; }
    .dgm-next-btn b { font-size: 12.5px; }
    .dgm-err { align-items: center; }
}
@media (prefers-reduced-motion: reduce) {
    .dgw-page, .dgw-chip, .dgw-page > i, .dgw-stamp, .dgm-ring::after { animation: none; }
    .dgw-stamp { opacity: .9; }
}

/* поле запроса на телефоне: плашка оформления не обрезается, счётчик символов не мешает */
@media (max-width: 640px) {
    .prompt-tools { overflow: hidden; flex: 1 1 auto; }
    .prompt-tools .tool-chip { flex: 0 1 auto; min-width: 0; overflow: hidden; }
    .prompt-tools .tool-chip > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .prompt-bottom .char-count { display: none; }
}

/* «Оформление» на узком телефоне: поля в одну колонку — «Times New Roman», «1,5 — полуторный» видны целиком */
@media (max-width: 420px) {
    .gost-sub-card .grid-2 { grid-template-columns: minmax(0, 1fr) !important; }
}

/* уведомления кабинета (вместо системных alert) */
.dg-toasts { position: fixed; left: 50%; bottom: calc(24px + var(--pm-tabbar, 0px) + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
             z-index: 100002; display: flex; flex-direction: column; gap: 8px; width: min(92vw, 460px); pointer-events: none; }
.dg-toast { display: flex; align-items: flex-start; gap: 10px; padding: 12px 10px 12px 14px; border-radius: 14px; pointer-events: auto;
            background: #0c1410; color: #f1f5f2; font: 600 14px/1.45 'Manrope', sans-serif; box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .55);
            animation: dgToastIn .28s cubic-bezier(.2, .8, .2, 1); transition: opacity .25s, transform .25s; }
.dg-toast.out { opacity: 0; transform: translateY(8px); }
.dg-toast i { flex: none; width: 20px; height: 20px; margin-top: 1px; border-radius: 50%; background: #f59e0b;
              -webkit-mask: radial-gradient(circle, #000 64%, transparent 66%); }
.dg-toast.ok i { background: #34d399; } .dg-toast.info i { background: #60a5fa; }
.dg-toast span { flex: 1; min-width: 0; }
.dg-toast button { flex: none; width: 26px; height: 26px; margin: -3px 0 0; border: 0; border-radius: 8px; background: transparent; color: #9aa39e;
                   font-size: 18px; line-height: 1; cursor: pointer; }
.dg-toast button:hover { background: rgba(255, 255, 255, .08); color: #fff; }
@keyframes dgToastIn { from { opacity: 0; transform: translateY(10px); } }

/* агент, Excel: «Таблица / С диаграммами» */
.adt-view { display: inline-flex; padding: 2px; gap: 2px; border-radius: 9px; background: #fff; border: 1px solid var(--moss-2, #e3e8e4); }
.adt-view[hidden] { display: none; }
.adt-view button { border: 0; background: transparent; padding: 4px 10px; border-radius: 7px; font-family: inherit; font-weight: 600; font-size: 12px; line-height: 1.2;
                   color: #5b665f; cursor: pointer; white-space: nowrap; }
.adt-view button.on { background: #0f5132; color: #fff; }
.adt-view button:not(.on):hover { background: #eef3ef; color: #14261c; }
@media (max-width: 640px) { .adt-view button { padding: 4px 8px; font-size: 11px; } }

/* «Мои шаблоны»: место под «По списку» у PDF — ровные столбцы кнопок; на телефоне не нужно */
.mytpl-ph { visibility: hidden; pointer-events: none; }
@media (max-width: 640px) { .mytpl-ph { display: none !important; } }
.mytpl-more { display: none !important; }
.mytpl-showall { display: block; width: 100%; margin-top: 4px; padding: 11px 14px; border-radius: 12px; border: 1px dashed #b9d3c3;
                 background: #f4faf6; color: #0f5132; font-family: inherit; font-weight: 700; font-size: 13.5px; line-height: 1.2; cursor: pointer; }
.mytpl-showall:hover { background: #e9f5ee; }

/* «Что дальше»: на ПК — аккуратные таблетки в строку, на телефоне — сетка в 2 колонки */
.dgm-next-btn em { flex: none; margin-left: auto; padding: 1px 7px; border-radius: 999px; background: #e8f4ee; color: var(--pm-brand);
                   font-family: inherit; font-weight: 800; font-size: 11px; line-height: 1.5; font-style: normal; }
@media (min-width: 641px) {
    .dgm-next-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
    .dgm-next-btn { min-height: 0; width: auto; padding: 6px 12px 6px 6px; border-radius: 999px; gap: 8px; }
    .dgm-next-btn i { width: 28px; height: 28px; border-radius: 999px; }
    .dgm-next-btn i svg { width: 15px; height: 15px; }
    .dgm-next-btn b { font-size: 13px; white-space: nowrap; }
    .dgm-next-btn small { display: none; }
    .dgm-next-btn em { margin-left: 2px; }
}

/* монета токена на кнопках: «3 ●» вместо «3 токена» */
.dg-coin {
    position: relative; display: inline-block; flex: none; width: 15px; height: 15px; border-radius: 50%;
    background: linear-gradient(145deg, #3fd9a2 0%, #12a172 45%, #0a6e4c 100%);
    box-shadow: inset 0 0 0 1.25px rgba(255, 255, 255, 0.45), inset 0 -1.5px 2px rgba(4, 50, 34, 0.35), 0 1px 1.5px rgba(5, 74, 51, 0.30);
}
.dg-coin::after {
    content: ""; position: absolute; inset: 17%; background: #fff;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 1.5l2.6 7.9 7.9 2.6-7.9 2.6L12 22.5l-2.6-7.9L1.5 12l7.9-2.6z'/></svg>") center / contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 1.5l2.6 7.9 7.9 2.6-7.9 2.6L12 22.5l-2.6-7.9L1.5 12l7.9-2.6z'/></svg>") center / contain no-repeat;
}
.dg-cost { display: inline-flex; align-items: center; gap: 4px; font-weight: 800; font-variant-numeric: tabular-nums;
           white-space: nowrap; line-height: 1; vertical-align: middle; }
/* на зелёной кнопке — светлая капсула, монета с белым ободком */
.dg-cost.inv { padding: 3px 3px 3px 8px; border-radius: 999px; background: rgba(255, 255, 255, 0.2); color: #fff; font-size: 12.5px; }
.dg-cost.inv .dg-coin { width: 16px; height: 16px; background: #fff; box-shadow: 0 1px 2px rgba(3, 40, 27, 0.25); }
.dg-cost.inv .dg-coin::after { background: #0b8a5f; }

/* «Что дальше», проверка договора, прайс — цена справа, без лишних слов */
.dgm-next-btn .dg-cost { margin-left: auto; padding: 3px 4px 3px 7px; border-radius: 999px; background: #e8f4ee; color: var(--pm-brand); font-size: 11.5px; }
@media (min-width: 641px) { .dgm-next-btn .dg-cost { margin-left: 2px; } }
/* у иконок кнопки свой стиль (.dgm-next-btn i) — монете возвращаем её вид */
.dgm-next-btn .dg-cost .dg-coin { display: inline-block; width: 14px; height: 14px; border-radius: 50%;
    background: linear-gradient(145deg, #3fd9a2 0%, #12a172 45%, #0a6e4c 100%); }
.agent-ws-quick [data-review] { display: inline-flex; align-items: center; gap: 6px; }
.agent-ws-quick [data-review] .dg-cost { font-size: 12px; color: #047857; }
.agent-ws-quick [data-review] .dg-coin { width: 13px; height: 13px; }
.dgf-rbtn { display: inline-flex; align-items: center; gap: 7px; }
.dgf-btn .dg-cost:not(.inv) { color: inherit; }
.sub-price-row em { white-space: nowrap; display: inline-flex; align-items: center; }
.sub-price-row em .dg-cost { font-size: inherit; }
.sub-price-row em .dg-coin { width: 14px; height: 14px; margin-left: 3px; }

/* ИИ-агент: единое поле ввода — текст, под ним цена, микрофон и круглая «Отправить» */
.agent-ws-input { display: block; padding: 10px 12px 12px; }
.agent-composer { flex: 1; min-width: 0; width: 100%; border: 1px solid var(--moss-2, #e3e8e4); border-radius: 16px; background: #fff;
                  transition: border-color .15s, box-shadow .15s; }
.agent-composer:focus-within { border-color: #0f9d6e; box-shadow: 0 0 0 3px rgba(16, 185, 129, .14); }
.agent-ws-input .agent-composer textarea { display: block; width: 100%; min-height: 46px; max-height: 140px; margin: 0;
    padding: 11px 14px 2px; border: 0 !important; border-radius: 16px 16px 0 0; box-shadow: none !important; outline: none;
    background: transparent; resize: none; font-family: inherit; font-size: 14px; line-height: 1.5; color: var(--pm-ink, #0b1410); }
.agent-composer-bar { display: flex; align-items: center; gap: 8px; padding: 2px 6px 6px 14px; }
.agent-composer-hint { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; overflow: hidden; white-space: nowrap;
                       font-size: 11.5px; color: #8a948f; }
.agent-composer-hint > span { display: inline-flex; align-items: center; gap: 4px; }
.agent-composer-hint .dg-cost { gap: 3px; font-weight: 700; color: #4b5650; }
.agent-composer-hint .dg-coin { width: 12px; height: 12px; }
.agent-composer-actions { flex: none; display: flex; align-items: center; gap: 4px; }
.agent-ws-input .agent-composer-actions button { width: 36px; height: 36px; padding: 0; border-radius: 50%; border: 0;
    display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transform: none; }
.agent-ws-input .agent-composer-actions .dgf-mic { background: transparent; color: #6b7570; box-shadow: none; }
.agent-ws-input .agent-composer-actions .dgf-mic:hover { background: #f1f4f2; color: #0b1410; }
.agent-ws-input .agent-composer-actions .dgf-mic.listening { background: #fff1f1; color: #dc2626; }
.agent-ws-input .agent-composer-actions .dgf-mic.listening::before { margin-right: 0; }
.agent-ws-input .agent-composer-actions #agentSendBtn { background: #0f8a5f; color: #fff; box-shadow: 0 4px 12px -4px rgba(15, 138, 95, .6); }
.agent-ws-input .agent-composer-actions #agentSendBtn:hover { background: #0b6e4c; }
.agent-ws-input .agent-composer-actions #agentSendBtn.is-stop { background: #dc2626; box-shadow: 0 4px 12px -4px rgba(220, 38, 38, .55); }
@media (max-width: 640px) {
    .agent-ws-input { padding: 8px 10px 10px; }
    .agent-ws-input .agent-composer textarea { font-size: 15px; padding: 10px 12px 2px; }
    .agent-composer-hint .ach-free { display: none; }
}

/* «Оформление»: настоящая страница документа */
.gost-preview-stage { position: relative; }
.gp-real { display: block; width: min(100%, 520px); margin: 0 auto; cursor: zoom-in; }
.gp-real img { display: block; width: 100%; height: auto; border-radius: 4px; background: #fff;
               box-shadow: 0 1px 2px rgba(12, 20, 16, .08), 0 18px 40px -22px rgba(12, 20, 16, .45); }
.gost-preview-stage.st-loading::after { content: "Обновляю…"; position: absolute; top: 12px; right: 12px; padding: 5px 11px 5px 26px;
    border-radius: 999px; background: rgba(255, 255, 255, .94); color: #0b7d57; font-size: 12px; font-weight: 700;
    box-shadow: 0 4px 14px -6px rgba(12, 20, 16, .35);
    background-image: radial-gradient(circle at 13px 50%, #34d399 0 4px, transparent 5px); animation: stPulse 1s ease-in-out infinite; }
@keyframes stPulse { 50% { opacity: .65; } }
@media (max-width: 640px) { .gp-real { width: 100%; } }