/* ===========================================================
   AI-генератор персонажа «за смертных» — Chronicles of Darkness
   Шаги: описание -> концепты -> редактируемый лист -> PNG
   =========================================================== */

.chargen{max-width:1180px;margin:0 auto;padding:10px 16px 60px;}
.chargen__head{text-align:center;margin:8px 0 26px;}
.chargen__title{font-family:var(--second-family,Georgia,serif);color:var(--ink,#f2f5f7);
    font-size:34px;letter-spacing:.02em;margin:0 0 10px;}
.chargen__lead{color:var(--text,#c7d0d7);line-height:1.7;max-width:760px;margin:0 auto;font-size:16px;}

/* шаги-обёртки */
.cg-step{display:none;}
.cg-step.is-active{display:block;animation:cgFade .25s ease;}
@keyframes cgFade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

/* ---------- общий вид панелей ---------- */
.cg-panel{background:var(--surface,#19222b);border:1px solid var(--border,#293137);
    border-radius:12px;padding:24px 26px;box-shadow:0 12px 34px rgba(0,0,0,.32);}
.cg-h{font-family:var(--second-family,Georgia,serif);color:#6BA1B5;font-size:13px;letter-spacing:.08em;
    text-transform:uppercase;margin:0 0 8px;}

/* ---------- ШАГ 1: форма ---------- */
.cg-field{margin-bottom:20px;}
.cg-label{display:block;margin-bottom:8px;font-family:var(--second-family,Georgia,serif);
    font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted,#9aa4ac);}
.cg-textarea{width:100%;box-sizing:border-box;min-height:120px;resize:vertical;padding:13px 15px;
    background:var(--surface-3,#0e1720);color:var(--ink,#f2f5f7);border:1px solid var(--border,#293137);
    border-radius:8px;font-family:var(--font-body,Georgia,serif);font-size:16px;line-height:1.6;}
.cg-textarea:focus{outline:none;border-color:var(--gold,#d8a400);box-shadow:0 0 0 2px rgba(216,164,0,.16);}
.cg-textarea::placeholder{color:var(--text-faint,#6f7882);}

.cg-budgets{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-top:6px;}
.cg-budget{background:var(--surface-3,#0e1720);border:1px solid var(--border,#293137);border-radius:8px;padding:12px 14px;}
.cg-budget__lbl{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted,#9aa4ac);margin-bottom:8px;display:block;}
.cg-budget__row{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.cg-budget input{width:46px;text-align:center;padding:7px 4px;background:#141d26;color:var(--ink,#f2f5f7);
    border:1px solid var(--border,#293137);border-radius:6px;font-size:15px;font-family:var(--font-body,Georgia,serif);}
.cg-budget input:focus{outline:none;border-color:var(--gold,#d8a400);}
.cg-budget__hint{font-size:11px;color:var(--text-faint,#6f7882);margin-top:7px;line-height:1.4;}

.cg-rules{margin-top:18px;font-size:12.5px;line-height:1.7;color:var(--text-faint,#6f7882);border-top:1px dashed #2a343d;padding-top:14px;}

/* ---------- кнопки ---------- */
.cg-btn{display:inline-flex;align-items:center;gap:9px;cursor:pointer;border:none;border-radius:8px;
    font-family:var(--second-family,Georgia,serif);font-size:15px;letter-spacing:.03em;padding:13px 30px;
    transition:background-color .15s ease,opacity .15s ease,border-color .15s ease;}
.cg-btn--primary{color:#0e1720;background:var(--gold,#d8a400);}
.cg-btn--primary:hover{background:var(--gold-soft,#e3c77a);}
.cg-btn--ghost{color:var(--gold-soft,#e3c77a);background:transparent;border:1px solid #3a4751;}
.cg-btn--ghost:hover{background:#0e1720;border-color:var(--gold,#d8a400);color:var(--gold,#d8a400);}
.cg-btn:disabled{opacity:.55;cursor:default;}
.cg-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px;align-items:center;}

/* ---------- статус/загрузка ---------- */
.cg-status{margin:14px 0 0;font-size:14px;line-height:1.5;min-height:1em;}
.cg-status.is-error{color:var(--accent-bright,#c25b5b);}
.cg-spinner{display:inline-block;width:18px;height:18px;border:2px solid rgba(216,164,0,.3);
    border-top-color:var(--gold,#d8a400);border-radius:50%;animation:cgSpin .7s linear infinite;vertical-align:-3px;margin-right:8px;}
@keyframes cgSpin{to{transform:rotate(360deg);}}
.cg-loading{text-align:center;padding:40px 0;color:var(--text-muted,#9aa4ac);font-size:16px;}

/* ---------- ШАГ 2: концепты ---------- */
.cg-concepts{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-bottom:4px;}
.cg-concept{display:flex;flex-direction:column;background:var(--surface,#19222b);border:1px solid var(--border,#293137);
    border-radius:12px;padding:20px 20px 18px;cursor:pointer;transition:border-color .15s ease,transform .12s ease,box-shadow .15s ease;}
.cg-concept:hover{border-color:#3c5e74;transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.34);}
.cg-concept.is-chosen{border-color:var(--gold,#d8a400);box-shadow:0 0 0 2px rgba(216,164,0,.25);}
.cg-concept__name{font-family:var(--second-family,Georgia,serif);color:var(--ink,#f2f5f7);font-size:19px;line-height:1.25;margin:0 0 10px;}
.cg-concept__sum{color:var(--text,#c7d0d7);font-size:14.5px;line-height:1.6;margin:0 0 14px;flex:1;}
.cg-concept__vv{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.cg-tag{font-size:11.5px;letter-spacing:.03em;padding:3px 10px;border-radius:20px;border:1px solid #33404a;color:var(--text-muted,#9aa4ac);}
.cg-tag b{color:var(--gold-soft,#e3c77a);font-weight:600;}
.cg-concept__hook{color:var(--text-muted,#9aa4ac);font-size:13px;line-height:1.55;font-style:italic;border-top:1px solid #232d35;padding-top:10px;}
.cg-concept__pick{margin-top:14px;text-align:center;font-family:var(--second-family,Georgia,serif);
    font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--gold,#d8a400);}

/* =====================================================================
   ЛИСТ ПЕРСОНАЖА (раскладка как в PDF: атрибуты-сетка, навыки|другие черты)
   ===================================================================== */
.cg-sheet{position:relative;background:#10171e;border:1px solid #3a4a55;border-radius:14px;padding:30px 32px;
    box-shadow:0 16px 44px rgba(0,0,0,.45);}
/* тонкая внутренняя золотистая рамка */
.cg-sheet::after{content:"";position:absolute;inset:7px;border:1px solid rgba(216,164,0,.22);border-radius:9px;pointer-events:none;}
/* декоративные уголки-скобки (чистый CSS, рендерятся в PNG) */
.cg-corner{position:absolute;width:16px;height:16px;border-color:var(--gold,#d8a400);opacity:.9;pointer-events:none;z-index:5;}
.cg-corner--tl{top:5px;left:5px;border-top:2px solid;border-left:2px solid;}
.cg-corner--tr{top:5px;right:5px;border-top:2px solid;border-right:2px solid;}
.cg-corner--bl{bottom:5px;left:5px;border-bottom:2px solid;border-left:2px solid;}
.cg-corner--br{bottom:5px;right:5px;border-bottom:2px solid;border-right:2px solid;}
.cg-sheet__title{text-align:center;font-family:var(--second-family,Georgia,serif);
    color:var(--gold-soft,#e3c77a);font-size:26px;letter-spacing:.06em;text-transform:uppercase;margin:0 0 4px;}
.cg-sheet__sub{text-align:center;color:var(--text-faint,#6f7882);font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin:0 0 20px;}

/* верх: идентичность */
.cg-identity{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 26px;margin-bottom:22px;}
.cg-id{display:flex;align-items:baseline;gap:8px;}
.cg-id__lbl{flex:none;font-size:13px;color:var(--text-muted,#9aa4ac);font-style:italic;min-width:96px;}
.cg-inp{flex:1;min-width:0;background:transparent;border:none;border-bottom:1px solid #33404a;
    color:var(--ink,#f2f5f7);font-family:var(--font-body,Georgia,serif);font-size:15px;padding:3px 2px;}
.cg-inp:focus{outline:none;border-bottom-color:var(--gold,#d8a400);}

/* заголовок секции с линиями по бокам */
.cg-band{display:flex;align-items:center;gap:14px;margin:6px 0 14px;}
.cg-band::before,.cg-band::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,#33404a,transparent);}
.cg-band__t{font-family:var(--second-family,Georgia,serif);color:var(--ink,#f2f5f7);font-size:17px;
    letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;}

/* АТРИБУТЫ — 3 строки (Мощь/Искусность/Сопротивление) × 3 колонки */
.cg-attrs{display:grid;grid-template-columns:auto 1fr 1fr 1fr;gap:9px 18px;align-items:center;margin-bottom:8px;}
.cg-attrs__cap{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted,#9aa4ac);text-align:right;font-style:italic;}
.cg-trait{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.cg-trait__n{font-size:14px;color:var(--ink,#f2f5f7);}
.cg-trait--untr .cg-trait__n{color:var(--text,#c7d0d7);}

/* точки */
.cg-dots{display:inline-flex;gap:4px;flex:none;}
.cg-dot{width:13px;height:13px;border-radius:50%;border:1.5px solid #5a6b78;box-sizing:border-box;cursor:pointer;
    transition:background-color .1s ease,border-color .1s ease;}
.cg-dot.is-on{background:var(--gold,#d8a400);border-color:var(--gold,#d8a400);}
.cg-dot:hover{border-color:var(--gold-soft,#e3c77a);}
.cg-dots--ro .cg-dot{cursor:default;}

/* две колонки: НАВЫКИ | ДРУГИЕ ЧЕРТЫ */
.cg-main{display:grid;grid-template-columns:2fr 3fr;gap:26px;margin-top:18px;}
/* Здоровье / Воля / Рассудок в один ряд */
.cg-row3{display:flex;gap:14px;align-items:flex-start;}
.cg-row3>.cg-box{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;}
.cg-row3 .cg-box__h{text-align:center;}
@media(max-width:560px){.cg-row3{flex-wrap:wrap;}.cg-row3>.cg-box{flex:1 1 30%;}}
@media(max-width:860px){.cg-main{grid-template-columns:1fr;}}

.cg-skillgrp{margin-bottom:18px;}
.cg-skillgrp__h{font-family:var(--second-family,Georgia,serif);color:var(--gold-soft,#e3c77a);font-size:14px;
    letter-spacing:.04em;text-align:center;margin:0 0 4px;}
.cg-skillgrp__note{text-align:center;font-size:11px;color:var(--text-faint,#6f7882);font-style:italic;margin-bottom:8px;}
.cg-skill{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:3px 0;border-bottom:1px dotted #232d35;}
.cg-skill__n{font-size:13.5px;color:var(--ink,#f2f5f7);}
.cg-skill__spec{display:block;font-size:11px;color:#6BA1B5;font-style:italic;}

/* блоки правой колонки */
.cg-box{margin-bottom:18px;}
.cg-box__h{font-family:var(--second-family,Georgia,serif);color:var(--gold-soft,#e3c77a);font-size:14px;
    letter-spacing:.04em;text-align:center;margin:0 0 8px;}
.cg-merit{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:3px 0;border-bottom:1px dotted #232d35;}
.cg-merit__n{font-size:13.5px;color:var(--ink,#f2f5f7);}
.cg-merit__n a{color:var(--ink,#f2f5f7);text-decoration:none;border-bottom:1px dotted #4a5b66;}
.cg-merit__n a:hover{color:var(--gold-soft,#e3c77a);}
.cg-merit__rm{cursor:pointer;color:#6f7882;font-size:15px;line-height:1;padding:0 4px;}
.cg-merit__rm:hover{color:var(--accent-bright,#c25b5b);}

/* боксы здоровья / трек воли-рассудка */
.cg-track{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;}
.cg-hbox{width:15px;height:15px;border:1.5px solid #5a6b78;border-radius:3px;box-sizing:border-box;}
.cg-num{display:inline-block;min-width:24px;text-align:center;color:var(--gold-soft,#e3c77a);font-size:16px;font-weight:600;}

/* производные */
.cg-derived{display:grid;grid-template-columns:repeat(3,1fr);gap:6px 16px;margin-top:6px;}
@media(max-width:560px){.cg-derived{grid-template-columns:1fr 1fr;}}
.cg-drow{display:flex;align-items:baseline;justify-content:space-between;gap:8px;border-bottom:1px dotted #232d35;padding:3px 0;}
.cg-drow__l{font-size:12.5px;color:var(--text-muted,#9aa4ac);}
.cg-drow__v{font-size:14px;color:var(--ink,#f2f5f7);font-weight:600;}
.cg-drow__v input{width:40px;background:transparent;border:none;border-bottom:1px solid #33404a;color:var(--ink,#f2f5f7);text-align:center;font-size:14px;}
.cg-drow__v input:focus{outline:none;border-bottom-color:var(--gold,#d8a400);}

/* списки строк (стремления, состояния) */
.cg-lines .cg-inp{width:100%;display:block;margin-bottom:4px;}

/* таблицы оружие/снаряжение */
.cg-tbl{width:100%;border-collapse:collapse;font-size:12.5px;margin-top:4px;}
.cg-tbl th{font-size:10.5px;letter-spacing:.03em;text-transform:uppercase;color:var(--text-muted,#9aa4ac);font-weight:400;text-align:left;padding:3px 5px;border-bottom:1px solid #33404a;}
.cg-tbl td{padding:1px 4px;border-bottom:1px dotted #232d35;}
.cg-tbl input{width:100%;background:transparent;border:none;color:var(--ink,#f2f5f7);font-size:12.5px;padding:4px 2px;}
.cg-tbl input:focus{outline:none;background:#0e1720;}

/* счётчики бюджета */
.cg-counters{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:4px 0 20px;}
.cg-counter{font-size:12px;letter-spacing:.03em;padding:5px 12px;border-radius:20px;border:1px solid #33404a;color:var(--text-muted,#9aa4ac);}
.cg-counter b{color:var(--ink,#f2f5f7);}
.cg-counter.is-ok{border-color:#2e5a3a;color:#7fc99a;}
.cg-counter.is-bad{border-color:#5e2f38;color:var(--accent-bright,#c25b5b);}

/* rationale */
.cg-rationale{margin-top:18px;background:#0e1720;border:1px solid #233139;border-radius:8px;padding:14px 16px;
    color:var(--text,#c7d0d7);font-size:13.5px;line-height:1.65;}
.cg-rationale b{color:#6BA1B5;}

/* пообъектные пояснения нейросети */
.cg-reasons{margin-top:16px;background:#0e1720;border:1px solid #233139;border-radius:8px;padding:14px 16px;}
.cg-reasons__h{font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:#6BA1B5;margin-bottom:10px;}
.cg-reasons__sec{margin-bottom:12px;}
.cg-reasons__sec:last-child{margin-bottom:0;}
.cg-reasons__t{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted,#9aa4ac);margin-bottom:5px;border-bottom:1px solid #232d35;padding-bottom:3px;}
.cg-reason{font-size:13px;line-height:1.55;color:var(--text,#c7d0d7);margin:3px 0;}
.cg-reason__n b{color:var(--ink,#f2f5f7);}

.cg-sheet-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:24px;}

/* ---------- Лист 2: биография ---------- */
.cg-bio{margin-top:30px;}
.cg-bio__sheet{margin-top:0;}
.cg-bio__ta{width:100%;min-height:42px;resize:vertical;overflow:hidden;background:#0e1720;border:1px solid #2b3640;border-radius:8px;
    color:var(--ink,#f2f5f7);font-size:13.5px;line-height:1.55;padding:8px 10px;font-family:inherit;box-sizing:border-box;}
.cg-bio__ta:focus{outline:none;border-color:var(--gold,#d8a400);}
.cg-bio__demo{display:grid;grid-template-columns:repeat(3,1fr);gap:6px 16px;margin-bottom:10px;}
@media(max-width:560px){.cg-bio__demo{grid-template-columns:1fr 1fr;}}
.cg-bio__cols2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media(max-width:560px){.cg-bio__cols2{grid-template-columns:1fr;}}
.cg-bio__rec{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:6px;}
.cg-bio__rec .cg-inp{flex:1;min-width:90px;}
.cg-bio__line{display:flex;gap:6px;align-items:center;margin-bottom:5px;}
.cg-bio__line .cg-inp{flex:1;}

/* во время рендера в картинку — только анкета: прячем пояснения ИИ и служебные элементы */
.cg-sheet.is-exporting .cg-dot{cursor:default;}
.cg-sheet.is-exporting .cg-merit__rm,
.cg-sheet.is-exporting .cg-rationale,
.cg-sheet.is-exporting .cg-reasons,
.cg-sheet.is-exporting .cg-mini,
.cg-sheet.is-exporting .cg-btn--ghost{display:none !important;}

/* кнопка-мини (↻ пересчёт здоровья) */
.cg-mini{background:transparent;border:1px solid #33404a;color:var(--text-muted,#9aa4ac);border-radius:5px;
    font-size:12px;line-height:1;padding:3px 7px;margin-left:6px;cursor:pointer;}
.cg-mini:hover{border-color:var(--gold,#d8a400);color:var(--ink,#f2f5f7);}

/* здоровье */
.cg-health__inp{width:56px;}
.cg-health__hint{display:block;font-size:11px;color:var(--text-muted,#9aa4ac);margin:2px 0 6px;}

/* специализации */
.cg-spec__row{display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.cg-spec__sel{max-width:160px;}