/* Shared adaptation layer: original concept tokens and existing form contracts. */
html{font-size:16px;scroll-padding-top:110px}body.era-theme{margin:0;background:var(--bg-page);color:var(--text-body);font-family:var(--font-sans),sans-serif;font-size:1rem;line-height:1.65;overflow-x:hidden}
.era-theme h1,.era-theme h2,.era-theme h3,.era-theme h4,.era-theme h5{font-family:inherit;color:var(--text-primary);line-height:1.18}.era-theme a{color:inherit}.era-theme a:hover{color:var(--c-orange);text-decoration:none}.era-theme a:focus-visible,.era-theme button:focus-visible,.era-theme input:focus-visible,.era-theme select:focus-visible{outline:2px solid var(--c-orange);outline-offset:4px}
.era-cart{position:absolute;right:24px;bottom:-45px;z-index:10;background:var(--bg-page)}.era-stage{padding:7px 20px;background:#20190c;border-bottom:1px solid #7b571f;color:#f6d6a6;font-size:.8rem;text-align:center}.era-content{padding-block:72px 96px;min-height:65vh}.era-content h1{font-size:clamp(2rem,4vw,3.3rem);margin:0 0 32px;font-weight:600;letter-spacing:-.035em}.era-content h2{font-size:clamp(1.25rem,2vw,1.75rem);margin:0 0 20px}.era-content h3{font-size:1.2rem}
.era-catalog-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:40px}.era-filter{align-self:start;position:sticky;top:25px;background:var(--bg-surface);border:1px solid var(--line);border-radius:16px;padding:24px;max-height:calc(100vh - 50px);overflow:auto}.era-filter h2{font-size:1.1rem}.era-filter label{font-weight:400;font-size:.9rem}.era-filter .btn{width:100%}.era-catalog-content{min-width:0}.era-category-nav{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.era-category-nav a{border:1px solid var(--line-strong);border-radius:30px;padding:10px 16px;font-size:.9rem}
.era-content .news-block,.era-content .thumbnail,.era-content .panel,.era-content .well,.era-content .modern-card{background:var(--bg-surface);border:1px solid var(--line);border-radius:18px;padding:28px;color:var(--text-body);box-shadow:none;margin-bottom:24px}.era-content .news-block .news-block{padding:18px}.era-content .news-middle .news-block{height:100%}.era-content .news-middle>.row{display:flex;flex-wrap:wrap;margin-bottom:24px}.era-content .news-middle>.row>div{margin-bottom:20px}.era-content .news-block-inner h2{font-size:1.35rem}.era-content .news-block-inner p{color:var(--text-secondary)}.era-content .news-block img,.era-content article img{max-width:100%;height:auto;border-radius:12px}.era-content .news-block iframe{max-width:100%}.era-content .caption{color:inherit;padding:0}.era-content .two-news .row,.era-content .four-news .row{display:flex;flex-wrap:wrap}.era-content .new-card{padding-block:20px}.era-content .news-title h3{font-size:1.2rem}
.era-theme .era-content .btn,.era-theme .era-filter .btn{border-radius:10px;padding:12px 20px;font:500 .95rem/1.35 var(--font-sans),sans-serif;white-space:normal;transition:background .2s,border .2s}.era-theme .btn-primary,.era-theme input[type=submit]{background:var(--g-brand);border:1px solid #b57e30;color:#0b0d11}.era-theme .btn-default{background:var(--bg-elevated);border:1px solid var(--line-strong);color:var(--text-primary)}.era-theme .btn-danger{background:var(--c-dark-red);border:1px solid var(--c-red)}.era-theme .btn-success{background:var(--c-dark-green);border:1px solid var(--c-green)}.era-theme .form-control,.era-theme .era-content input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),.era-theme .era-content textarea,.era-theme .era-content select{background:var(--bg-field);border:1px solid var(--line-strong);border-radius:9px;color:var(--text-primary);font:inherit;min-height:46px;padding:10px 14px;max-width:100%;box-shadow:none}.era-theme .form-control::placeholder{color:#9ba0a8}.era-theme input[type=checkbox],.era-theme input[type=radio]{accent-color:var(--c-orange)}.era-theme label{font-weight:500;color:var(--text-body)}
.era-theme .table{color:var(--text-body);display:block;overflow:auto;width:100%}.era-theme .table>thead>tr>th,.era-theme .table>tbody>tr>td{border-color:var(--line);padding:16px}.era-theme .table-striped>tbody>tr:nth-of-type(odd){background:var(--bg-elevated)}.era-theme .table-hover>tbody>tr:hover{background:var(--bg-surface-hover)}.era-theme .table th,.era-theme .table thead{color:var(--text-primary)}.era-theme .pagination>li>a,.era-theme .pagination>li>span{background:var(--bg-elevated);border-color:var(--line-strong);color:var(--text-body)}.era-theme .pagination>.active>a{background:var(--c-orange);color:#0b0d11}.era-theme .alert{border-radius:12px;background:#182131;border-color:#294262;color:#c1d8ff}.era-theme .alert-danger{background:#301d1e;border-color:#753738;color:#ffc5c0}.era-theme .alert-success{background:#152c22;border-color:#315d44;color:#b2ebc0}.era-theme .modal-content{background:var(--bg-elevated);color:var(--text-body);border:1px solid var(--line-strong)}.era-theme .modal-header,.era-theme .modal-footer{border-color:var(--line)}.era-theme .close{color:white;opacity:.8}.era-theme .account-menu{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px}.era-theme .account-menu a{display:block;padding:8px 0;font-size:.9rem}.era-theme .account-menu a.underline{color:var(--c-orange)}.era-theme .cabinet{min-width:0}.era-theme .required{color:var(--c-orange)}
.era-theme .post>a{display:block}.era-theme .post__title{font-size:1.2rem;margin:20px 0 12px}.era-theme .post__cover img{width:100%;height:100%;object-fit:cover}.era-theme .post__meta{font-size:.8rem}.era-theme .indicator__name{color:var(--text-secondary);font-size:.9rem}.era-theme .indicator__value{font-size:1.75rem;color:var(--text-primary)}.era-theme .section .btn{white-space:normal}.era-theme .news-block pre{background:var(--bg-elevated);color:var(--text-body);border-color:var(--line)}.era-theme .news-block blockquote{border-color:var(--c-orange)}.era-theme .site-footer{margin-top:0}.era-theme .site-footer__bottom .text-sm{max-width:540px}.era-theme .era-content p{overflow-wrap:anywhere}.era-theme .era-content .graphic-top{display:none}.era-theme .no-results{padding:32px}
@media(max-width:1100px){.era-catalog-layout{grid-template-columns:220px minmax(0,1fr);gap:24px}.era-content .news-block{padding:20px}.era-cart{display:none}}
@media(max-width:767px){.era-catalog-layout{grid-template-columns:1fr}.era-filter{position:static;max-height:none}.era-content{padding-block:36px 56px}.era-content .news-middle>.row{display:block}.era-content .news-middle>.row>div{width:100%}.era-theme .account-menu{display:grid;grid-template-columns:1fr 1fr}.era-theme .era-content .col-md-2,.era-theme .era-content .col-md-10{width:100%;float:none}.era-stage{font-size:.75rem}.era-theme .hero-card__stats{font-size:.9rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Editorial hierarchy from ERA catalog/article V3.1, using the primary concept's palette. */
.era-editorial-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:30px}.era-content-card{display:flex;flex-direction:column;background:var(--bg-surface);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:border-color .2s}.era-content-card:hover{border-color:var(--line-accent)}.era-content-card--lead{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.era-card-cover{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--bg-elevated)}.era-content-card--lead .era-card-cover{aspect-ratio:auto;min-height:320px}.era-card-cover picture,.era-card-cover img{display:block;width:100%;height:100%;object-fit:cover}.era-card-body{padding:24px;display:flex;flex-direction:column;align-items:start}.era-content-card .era-card-body h2{font-size:1.4rem;line-height:1.3;margin:18px 0 14px}.era-content-card--lead .era-card-body h2{font-size:clamp(1.5rem,2.6vw,2.1rem)}.era-card-body>p{font-size:1rem;line-height:1.6;color:var(--text-secondary);margin-bottom:24px}.era-card-meta{display:flex;gap:12px;flex-wrap:wrap;font-size:.8rem;color:var(--text-secondary)}.era-card-meta>span{color:var(--c-orange)}.era-text-link{display:block;margin-top:auto;padding-top:12px;color:var(--c-orange)!important;font-weight:500;font-size:.95rem}.era-video-label{position:absolute;left:18px;bottom:18px;padding:6px 12px;border-radius:20px;background:var(--c-orange);color:var(--bg-page);font-size:.9rem}.era-category-nav [aria-current=page]{background:var(--c-orange);border-color:var(--c-orange);color:var(--bg-page)}.era-pagination{margin-top:36px;text-align:center}.era-breadcrumb{display:flex;gap:12px;color:var(--text-secondary);font-size:.9rem;margin-bottom:32px}.era-article-layout{display:grid;grid-template-columns:minmax(0,860px) minmax(240px,310px);gap:32px;align-items:start}.era-reading{min-width:0}.era-reading>.article{padding:clamp(24px,4vw,48px)}.era-reading .article h1{font-size:clamp(2rem,3.6vw,3.6rem);line-height:1.1}.era-reading .article p{font-size:1.1rem;line-height:1.8}.era-reading .article h2{font-size:1.8rem;margin:40px 0 20px}.era-reading .article-category{font-size:.9rem;color:var(--c-orange)}.era-article-rail{position:sticky;top:24px;display:grid;gap:18px}.era-railbox{padding:24px;border:1px solid var(--line);border-radius:16px;background:var(--bg-surface)}.era-railbox h2{font-size:1.25rem}.era-railbox p{font-size:.95rem}.era-access{border-color:var(--line-accent);background:linear-gradient(150deg,#211b13,var(--bg-surface))}#era-toc a{display:block;padding:12px 0;border-bottom:1px solid var(--line);font-size:.9rem;color:var(--text-secondary)}.era-reading .tag-menu{display:flex;flex-wrap:wrap;gap:8px;padding:0;list-style:none}.era-reading .tag-menu a{display:block;border:1px solid var(--line-strong);border-radius:20px;padding:7px 12px;font-size:.85rem}.era-theme .era-reading [hidden],.era-theme .era-article-rail [hidden]{display:none!important}
@media(max-width:1050px){.era-article-layout{grid-template-columns:minmax(0,1fr) 250px;gap:24px}.era-content-card--lead{display:flex}.era-content-card--lead .era-card-cover{aspect-ratio:16/9;min-height:0}}
@media(max-width:767px){.era-editorial-grid,.era-article-layout{grid-template-columns:1fr}.era-content-card--lead{grid-column:auto}.era-card-body{padding:22px}.era-article-rail{position:static}.era-reading .article h1{font-size:2.2rem}}
/* Shared navigation stays available on narrow screens. */
.era-theme .era-cart{position:static;display:inline-flex;align-items:center;gap:4px;padding:10px;background:transparent}.era-mobile-cart{display:none}.era-theme .nav-link[aria-current=page]{color:var(--c-orange)}
@media(max-width:1199px){.era-theme .era-mobile-cart{display:block}}
@media(max-width:500px){.era-theme .era-cart{display:none}}

/* ==========================================================================
   Внутренние страницы RU/EN: кабинет, авторизация, подписки, корзина.
   Слой только оформительский: имена, action/method, id, hidden-поля,
   data-атрибуты и ветки доступа в шаблонах не менялись.
   ========================================================================== */

/* --- Заголовки унаследованных страниц --- */
.era-theme .era-content .news-middle-title,.era-theme .era-content h1.news-middle-title{font-size:clamp(2rem,4vw,3.3rem);margin:0 0 28px;font-weight:600;letter-spacing:-.035em}
.era-theme .era-catalog-head{margin-bottom:8px}.era-theme .era-catalog-head .eyebrow{color:var(--c-orange);text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;margin:0 0 10px}
.era-theme .era-content .pages{margin-top:32px}

/* --- Кабинет: боковая навигация и рабочая область --- */
.era-theme .era-content .div-account-menu>.news-block{position:sticky;top:24px;padding:22px}
.era-theme .account-menu li{margin:0}
.era-theme .account-menu a{border-radius:9px;padding:9px 12px;color:var(--text-body);transition:background .18s,color .18s}
.era-theme .account-menu a:hover{background:var(--bg-elevated);color:var(--text-primary)}
.era-theme .account-menu a.underline{background:var(--bg-elevated);color:var(--c-orange);text-decoration:none;box-shadow:inset 2px 0 0 var(--c-orange)}
.era-theme .cabinet>.news-block{padding:clamp(20px,3vw,32px)}
.era-theme .era-content .cabinet h2:first-child{margin-top:0}
.era-theme .era-content .nowrap{white-space:nowrap}

/* Наследованные инлайновые цвета сумм в таблицах операций. */
.era-theme .era-content [style*="color: red"],.era-theme .era-content [style*="color:red"]{color:var(--c-red)!important}
.era-theme .era-content [style*="color: green"],.era-theme .era-content [style*="color:green"]{color:var(--c-green)!important}
.era-theme .era-content [style*="#046ED8"],.era-theme .era-content [style*="#046ed8"]{color:var(--c-blue)!important}

/* --- Формы: вход, регистрация, восстановление пароля, подтверждение почты --- */
.era-theme .era-content form p{margin:0 0 16px}
.era-theme .era-content form label{display:inline-block;margin-bottom:6px}
.era-theme .era-content .remember-me:empty{display:none}
.era-theme .era-content .g-recaptcha{max-width:100%;overflow-x:auto;margin-bottom:16px}
.era-theme .era-content #appleid-signin{color-scheme:light}
.era-theme .era-content input[type=submit],.era-theme .era-content button[type=submit]{cursor:pointer}
.era-theme .era-content input[readonly]{background:var(--bg-field-disabled,#0f0f0f);color:var(--text-secondary);cursor:not-allowed}
.era-theme .era-content .required{color:var(--c-orange)}

/* --- Дисклеймер статьи: снимаем светлую инлайновую подложку --- */
.era-theme .era-content #disclaimer{background:var(--bg-elevated)!important;border:1px solid var(--line)!important;border-left:3px solid var(--c-orange)!important;border-radius:12px;padding:16px 18px!important;color:var(--text-body)}
.era-theme .era-content #disclaimer a{color:var(--c-orange)}

/* --- Подписки и покупка --- */
.era-theme .era-content .content-men{display:flex;flex-wrap:wrap;align-items:stretch}
.era-theme .era-content .content-men>[class*=col-]{display:flex;margin-bottom:24px}
.era-theme .era-content .content-men .thumbnail,.era-theme .era-content .content-men .news-block{width:100%;margin-bottom:0;display:flex;flex-direction:column}
.era-theme .era-content .caption{display:flex;flex-direction:column;flex:1}
.era-theme .era-content .caption>.buy-group:last-of-type,.era-theme .era-content .caption>.row:last-of-type{margin-top:auto}
.era-theme .era-content .price{font-size:1.6rem;font-weight:600;color:var(--c-orange);margin:0;text-align:right}
.era-theme .era-content .buy-group{margin-block:14px 0;align-items:center}
.era-theme .era-content .buy-div{display:flex;align-items:center;justify-content:flex-end}
.era-theme .era-content .input-group.cnt{display:flex;max-width:150px}
.era-theme .era-content .input-group.cnt .btn{padding:10px 14px;border-radius:9px}
.era-theme .era-content .prod-count{text-align:center;max-width:64px}
.era-theme .era-content .buy,.era-theme .era-content .buy2,.era-theme .era-content .button-one-buy{margin-top:10px}
.era-theme .era-content .button-one-buy{background:var(--bg-elevated);border:1px solid var(--line-strong);color:var(--text-primary)}
.era-theme .era-content .center{text-align:center}

/* --- Корзина и оплата --- */
.era-theme .era-content .basket{position:relative}
.era-theme .era-content .order-fields>[class*=col-]{margin-bottom:14px}
.era-theme .era-content .payment .era-payment-option{border-color:var(--line-strong)!important;background:var(--bg-elevated);color:var(--text-body)}
.era-theme .era-content .payment .era-payment-option:hover{border-color:var(--line-accent)!important}
.era-theme .era-content .payment .era-payment-title{color:var(--text-primary)}
.era-theme .era-content .payment .era-payment-description{color:var(--text-secondary)}
.era-theme .era-content .product-list table{width:100%}
.era-theme .era-content .delivery-fields{margin-block:12px}

/* --- Сегментированный фильтр (исполненные прогнозы) --- */
.era-segmented{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 8px}
.era-segmented label{display:inline-flex;align-items:center;gap:8px;margin:0;padding:9px 15px;border:1px solid var(--line-strong);border-radius:30px;font-size:.9rem;cursor:pointer}
.era-segmented label:has(input:checked){border-color:var(--c-orange);color:var(--c-orange)}

/* --- Фильтр каталога --- */
.era-theme .era-filter .filter-h2{font-size:1.05rem;margin-bottom:14px}
.era-theme .era-filter .poisk{display:flex;margin-bottom:18px}
.era-theme .era-filter .poisk .form-control{border-radius:9px 0 0 9px}
.era-theme .era-filter .poisk .btn{border-radius:0 9px 9px 0}
.era-theme .era-filter .filter-group .row{display:flex;align-items:center;gap:10px;margin:0 0 10px}
.era-theme .era-filter .filter-group .row>div{width:auto;float:none;padding:0}
.era-theme .era-filter .filter-group .row>div:first-child{flex:1}
.era-theme .era-filter .hide-filter{display:none}
.era-theme .era-filter label{margin:0}

/* --- Анкета профиля риска на сайте (перекрываем светлую инлайновую тему) --- */
.era-theme .rp-hero{background:linear-gradient(150deg,#1a1206,var(--bg-elevated));color:var(--text-primary);border-bottom:1px solid var(--line)}
.era-theme .rp-hero p{color:var(--text-secondary)}
.era-theme .rp-card{background:var(--bg-surface);border:1px solid var(--line);box-shadow:none;color:var(--text-body)}
.era-theme .rp-num{background:var(--c-orange);color:var(--bg-page)}
.era-theme .rp-legal{background:#20190c;border:1px solid #7b571f;color:#f6d6a6}
.era-theme .rp-check{border-color:var(--line-strong)}
.era-theme .rp-question{background:var(--bg-elevated);border-color:var(--line)}
.era-theme .rp-question select,.era-theme .rp-question input[type=number]{background:var(--bg-field);border-color:var(--line-strong);color:var(--text-primary)}
.era-theme .rp-result{background:var(--bg-elevated);border-color:var(--line-accent)}
.era-theme .rp-result strong{color:var(--c-orange)}
.era-theme .rp-result small,.era-theme .rp-help{color:var(--text-secondary)}
.era-theme .rp-loss button{background:var(--bg-field);border-color:var(--line-strong);color:var(--text-body)}
.era-theme .rp-loss button.active{background:var(--c-orange);border-color:var(--c-orange);color:var(--bg-page)}
.era-theme .rp-error{background:#301d1e;border-color:#753738;color:#ffc5c0}
.era-theme .rp-submit{background:var(--g-brand);color:#0b0d11}
.era-theme .rp-submit:hover{background:var(--c-orange)}
.era-theme .rp-note{color:var(--text-secondary)}
.era-theme .rp-existing{background:var(--bg-elevated);border-color:var(--line-strong);color:var(--text-body)}

/* --- Мобильные экраны внутренних страниц --- */
@media(max-width:991px){
.era-theme .era-content .div-account-menu>.news-block{position:static}
.era-theme .era-content .content-men>[class*=col-]{width:100%;float:none}
}
@media(max-width:767px){
.era-theme .era-content .buy-group{display:block}
.era-theme .era-content .buy-div{justify-content:flex-start;margin-top:10px}
.era-theme .era-content .price{text-align:left}
.era-theme .era-content .row>[class*=col-]{float:none;width:100%}
.era-theme .era-content table{font-size:.9rem}
.era-theme .rp-hero{margin-inline:0;padding:26px 18px 40px}
.era-theme .rp-page{padding-inline:0}
}

/* --------------------------------------------------------------------------
   Временный светлый остров для ещё не перерисованных страниц
   (/erant-lodge, анкета ложи, /developers). Их собственные <style> задают
   тёмный текст и рассчитывают на светлый фон страницы; на тёмной теме
   заголовки вне карточек становились нечитаемыми. Обёртка возвращает им
   исходный контекст, пока эти страницы не переведены в тёмную палитру.
   -------------------------------------------------------------------------- */
/* Partner and developer pages share the main theme; printed certificates stay light. */
.era-theme .era-content .era-special-page{--primary-color:var(--c-orange);--primary-dark:#c78024;--primary-light:#261e13;background:var(--bg-page);color:var(--text-body);border:1px solid var(--line);border-radius:18px;padding:clamp(16px,3vw,32px);overflow-x:auto;color-scheme:dark;font-family:var(--font-sans),sans-serif}
.era-theme .era-special-page :is(h1,h2,h3,h4,.section-title,.guild-title,.step-title,.cat-name,.fs-title,.form-label,.success-title,.lu-title){color:var(--text-primary)}
.era-theme .era-special-page :is(.guild-desc,.guild-features li,.section-sub,.step-desc,.stat-label,.cat-count,.fs-sub,.success-desc,.form-hint,.lu-hint,.step-card p,.schema-step p,.apply-section p,.pb-label){color:var(--text-secondary)}
.era-theme .era-special-page :is(.guild-side,.step-card,.stat-block,.cat-card,.form-section,.guarantee-card,.application-form,.progress-bar,.toast,.schema-icon){background:var(--bg-surface);color:var(--text-body);border-color:var(--line-strong);box-shadow:none}
.era-theme .era-special-page :is(.guarantees,.apply-section,.logo-preview,.partners-map,.map-picker){background:var(--bg-elevated);border-color:var(--line-strong)}
.era-theme .era-special-page :is(.guild-hero,.hero){background:linear-gradient(135deg,#2d2111,var(--bg-page));color:var(--text-primary)}
.era-theme .era-special-page :is(.guild-badge,.section-badge,.fs-icon,.guild-features li .feat-icon,.logo-btn,.step-number){background:#281e10;border-color:var(--line-accent);color:var(--c-orange)}
.era-theme .era-special-page :is(.guild-title span,.stat-number){background:var(--g-brand);background-clip:text;-webkit-background-clip:text}
.era-theme .era-special-page :is(.step-num,.pb-step.active .pb-num,.pb-step.done .pb-num){background:var(--c-orange);border-color:var(--c-orange);color:var(--bg-page)}
.era-theme .era-special-page .pb-num{background:var(--bg-field);border-color:var(--line-strong);color:var(--text-secondary)}
.era-theme .era-special-page :is(.pb-step.active .pb-label,.pb-step.done .pb-label){color:var(--c-orange)}
.era-theme .era-special-page .pb-step:not(:last-child)::after{background:var(--line-strong)}
.era-theme .era-special-page :is(.pb-step.active,.pb-step.done):not(:last-child)::after{background:var(--c-orange)}
.era-theme .era-special-page :is(input,select,textarea,.form-input,.form-select,.form-textarea){color:var(--text-primary);background:var(--bg-field);border-color:var(--line-strong)}
.era-theme .era-special-page :is(label,.logo-upload-text .lu-title){color:var(--text-body)}
.era-theme .era-special-page :is(.btn-guild,.btn-next,.btn-download-pdf,.cta-button,.cta-button-one){background:var(--g-brand);color:var(--bg-page);border-color:var(--line-accent)}
.era-theme .era-special-page .btn-back{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--line-strong)}
.era-theme .era-special-page .pdf-preview{background:#fff;color:#111827;color-scheme:light}
.era-theme .era-special-page .pdf-preview :is(h1,h2,h3,h4,.pdf-partner-name){color:#111827}
.era-theme .era-special-page .pdf-preview .pdf-qr{background:#fff}
@media(max-width:767px){.era-theme .era-special-page .container{padding-inline:12px}.era-theme .era-special-page .hero{padding-inline:16px}.era-theme .era-special-page .hero h1{font-size:clamp(1.8rem,8vw,2.6rem)}}

/* Subscription catalogue: one product per row, consistent price/action column. */
.era-subscriptions{max-width:1180px;margin-inline:auto}
.era-plans-section{margin-top:48px}
.era-theme .era-content .era-plans-heading{font-size:1.15rem;color:var(--text-secondary);margin-bottom:18px;font-weight:500}
.era-plans-list{display:grid;gap:20px}
.era-plan{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:36px;padding:32px;background:var(--bg-surface);border:1px solid var(--line);border-radius:18px}
.era-plan__description{min-width:0}
.era-theme .era-content .era-plan h2{font-size:1.45rem;line-height:1.3;margin:0 0 18px}
.era-plan__description p{margin:0 0 14px}
.era-plan__description p:empty{display:none}
.era-plan__description p:last-child{margin-bottom:0}
.era-plan__description a{color:var(--c-orange)}
.era-plan__purchase{min-width:0;border-left:1px solid var(--line);padding-left:28px;align-self:start}
.era-theme .era-content .era-plan__term{font-size:.8rem;color:var(--text-secondary);margin:0 0 10px}
.era-theme .era-content .era-plan__purchase .row{margin:12px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.era-theme .era-content .era-plan__purchase .row::before,.era-theme .era-content .era-plan__purchase .row::after{display:none}
.era-theme .era-content .era-plan__purchase .row>[class*=col-]{padding:0;width:100%;float:none}
.era-theme .era-content .era-plan__purchase .row:has(.cnt){display:grid;grid-template-columns:132px minmax(0,1fr);align-items:center;gap:10px;margin-top:0}
.era-theme .era-content .era-plan .input-group.cnt{display:grid;grid-template-columns:38px 56px 38px;width:132px;max-width:none}
.era-theme .era-content .era-plan .input-group-btn{display:block;width:auto;font-size:inherit}
.era-theme .era-content .era-plan .cnt .btn{width:38px;height:46px;padding:0;min-width:0;font-size:1.2rem;margin:0;border-radius:8px}
.era-theme .era-content .era-plan .prod-count{width:56px;min-width:0;max-width:none;padding:8px 0;appearance:textfield;-moz-appearance:textfield}
.era-plan .prod-count::-webkit-inner-spin-button,.era-plan .prod-count::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.era-theme .era-content .era-plan .buy-div{margin:0;justify-content:flex-end}
.era-theme .era-content .era-plan .price{font-size:1.3rem;white-space:nowrap;text-align:right}
.era-theme .era-content .era-plan .buy,.era-theme .era-content .era-plan .buy2,.era-theme .era-content .era-plan .button-one-buy{margin-top:0;display:block}
.era-theme .era-content .era-plan .buy2{background:transparent;color:var(--text-primary);border-color:var(--line-strong)}
.era-theme .era-content .era-plan__purchase h3{font-size:.8rem;line-height:1.5;margin:8px 0;color:var(--text-secondary)}
.era-plan-note{margin-top:28px;padding:28px;border:1px solid var(--line);border-radius:18px}
.era-plan-note .center{text-align:left!important}
.era-theme .era-content .era-plan-note h2{font-size:1.3rem;color:var(--text-primary)!important}
@media(max-width:900px){.era-plan{grid-template-columns:minmax(0,1fr);gap:24px;padding:24px}.era-plan__purchase{border-left:0;border-top:1px solid var(--line);padding:20px 0 0}.era-plan__purchase>.row,.era-plan__purchase>div:not(.row){max-width:360px}.era-plans-section{margin-top:32px}}
@media(max-width:400px){.era-plan{padding:18px}.era-theme .era-content .era-plan__purchase .row:has(.cnt){grid-template-columns:1fr}.era-theme .era-content .era-plan .buy-div{justify-content:flex-start}.era-theme .era-content .era-plan .price{text-align:left}}
.era-theme .era-content .era-plan .social{display:flex;flex-wrap:wrap;gap:10px;width:100%;text-align:left}
.era-theme .era-content .era-plan .social h3{width:100%;margin:4px 0}
.era-theme .era-content .era-plan .social a{display:inline-flex;width:32px;height:32px;flex:0 0 32px;border:0;padding:0}
.era-theme .era-content .era-plan .social img{display:block;width:32px;height:32px;max-width:32px;border-radius:0;object-fit:contain}
.era-theme .era-content .era-plan .social{aspect-ratio:auto;height:auto;min-height:0;padding:0;border:0;border-radius:0;background:none;justify-content:flex-start;align-items:center}


/* ===== оформление портфельного сервиса ===== */
/* ==========================================================================
   E.R.A. — тема защищённого портфеля (ru/en).
   Только оформление. PHP-логика, JS/API-контракты, CSRF, авторизация,
   имена полей и структура форм шаблонов не затрагиваются.

   Подключение: один <link rel="stylesheet"> в <head> оболочки приложения
   ПОСЛЕ собственных стилей, и класс era-portfolio на <body> (или на
   обёртке, которая уже добавлена в шаблонах). Заголовки безопасности,
   CSP и авторизацию менять не требуется — это статический CSS с того же
   origin, без @import, без внешних шрифтов и без url() к чужим доменам.

   Селекторы намеренно записаны с удвоенным классом (.era-portfolio.era-portfolio),
   чтобы гарантированно перекрывать инлайновые <style> шаблонов и
   существующие правила html.dark-theme, не прибегая к !important.
   ========================================================================== */

.era-portfolio {
  --pf-page:        #0B0D11;
  --pf-surface:     #0C0E12;
  --pf-surface-2:   #101319;
  --pf-elevated:    #0C1015;
  --pf-field:       #191919;
  --pf-line:        #1D1F22;
  --pf-line-strong: #3D4044;
  --pf-accent:      #EC9E2D;
  --pf-accent-soft: rgb(236 158 45 / .40);
  --pf-accent-grad: linear-gradient(135deg, #ECA948 0%, #D98219 100%);
  --pf-text:        #FFFFFF;
  --pf-body:        #BFC3C7;
  --pf-muted:       #B5B6B7;
  --pf-dim:         #626365;
  --pf-green:       #68C978;
  --pf-red:         #E75447;
  --pf-blue:        #ABCDF9;
  --pf-yellow:      #EDDB76;
  --pf-warn-bg:     #20190C;
  --pf-warn-line:   #7B571F;
  --pf-warn-text:   #F6D6A6;
  --pf-ok-bg:       #152C22;
  --pf-ok-line:     #315D44;
  --pf-ok-text:     #B2EBC0;
  --pf-err-bg:      #301D1E;
  --pf-err-line:    #753738;
  --pf-err-text:    #FFC5C0;
  --pf-info-bg:     #182131;
  --pf-info-line:   #294262;
  --pf-info-text:   #C1D8FF;
  --pf-font:        'Onest', 'Inter', 'Segoe UI', system-ui, sans-serif;

  background: var(--pf-page);
  color: var(--pf-body);
  font-family: var(--pf-font);
}

/* Фон страницы, если класс поставлен на <body> оболочки. */
body.era-portfolio { background: var(--pf-page); color: var(--pf-body); min-height: 100vh; }

.era-portfolio.era-portfolio h1,
.era-portfolio.era-portfolio h2,
.era-portfolio.era-portfolio h3,
.era-portfolio.era-portfolio h4 { color: var(--pf-text); font-family: inherit; }
.era-portfolio.era-portfolio a { color: var(--pf-accent); }
.era-portfolio.era-portfolio a:hover { color: #F5C06A; }
.era-portfolio.era-portfolio :focus-visible { outline: 2px solid var(--pf-accent); outline-offset: 3px; }
.era-portfolio.era-portfolio hr { border-color: var(--pf-line); }

/* --- Шапка и полотно --- */
.era-portfolio.era-portfolio .hero {
  background: linear-gradient(150deg, #1A1206 0%, #0C0E12 55%, #0B0D11 100%);
  border-bottom: 1px solid var(--pf-line);
  color: var(--pf-text);
}
.era-portfolio.era-portfolio .hero p { color: var(--pf-muted); }
.era-portfolio.era-portfolio .hero-step {
  background: rgb(236 158 45 / .12);
  border: 1px solid var(--pf-accent-soft);
  color: var(--pf-accent);
}
.era-portfolio.era-portfolio .page { background: transparent; }

/* --- Поверхности: карточки, панели, секции --- */
.era-portfolio.era-portfolio .card,
.era-portfolio.era-portfolio .panel,
.era-portfolio.era-portfolio .summary-card,
.era-portfolio.era-portfolio .risk-block,
.era-portfolio.era-portfolio .v2-section-card,
.era-portfolio.era-portfolio .v2-metric,
.era-portfolio.era-portfolio .tips-card,
.era-portfolio.era-portfolio .confirm-box,
.era-portfolio.era-portfolio .position-chart-card,
.era-portfolio.era-portfolio .risk-edit-panel,
.era-portfolio.era-portfolio .rw-item,
.era-portfolio.era-portfolio .rp-opt,
.era-portfolio.era-portfolio .portfolio-command-center,
.era-portfolio.era-portfolio .portfolio-v2-panel,
.era-portfolio.era-portfolio .advanced-entry,
.era-portfolio.era-portfolio .portfolio-number-help,
.era-portfolio.era-portfolio .portfolio-footer-disclosure,
.era-portfolio.era-portfolio .portfolio-delete-disclosure,
.era-portfolio.era-portfolio .forecast-scenario,
.era-portfolio.era-portfolio .forecast-info,
.era-portfolio.era-portfolio .stats-row,
.era-portfolio.era-portfolio .asset-table,
.era-portfolio.era-portfolio .v2-history,
.era-portfolio.era-portfolio .position-chart-host,
.era-portfolio.era-portfolio .profile-bar,
.era-portfolio.era-portfolio .valuation-chart,
.era-portfolio.era-portfolio .rw-header,
.era-portfolio.era-portfolio .stat {
  background: var(--pf-surface);
  border-color: var(--pf-line);
  color: var(--pf-body);
  box-shadow: none;
}
.era-portfolio.era-portfolio .card:hover,
.era-portfolio.era-portfolio .risk-block:hover,
.era-portfolio.era-portfolio .rw-item:hover { background: var(--pf-surface-2); border-color: var(--pf-line-strong); }

.era-portfolio.era-portfolio .card-icon,
.era-portfolio.era-portfolio .chart-icon,
.era-portfolio.era-portfolio .cfm-header-icon,
.era-portfolio.era-portfolio .rb-icon {
  background: var(--pf-elevated);
  border-color: var(--pf-line-strong);
  color: var(--pf-accent);
}
.era-portfolio.era-portfolio .rb-icon.cons { color: var(--pf-blue); }
.era-portfolio.era-portfolio .rb-icon.mod  { color: var(--pf-yellow); }
.era-portfolio.era-portfolio .rb-icon.aggr { color: var(--pf-red); }
.era-portfolio.era-portfolio .rb-icon.loss { color: var(--pf-accent); }
.era-portfolio.era-portfolio .rb-icon.none { color: var(--pf-dim); }

/* --- Типографика внутри карточек --- */
.era-portfolio.era-portfolio .card-title,
.era-portfolio.era-portfolio .chart-title,
.era-portfolio.era-portfolio .rep-title,
.era-portfolio.era-portfolio .v2-section-title,
.era-portfolio.era-portfolio .portfolio-command-title,
.era-portfolio.era-portfolio .tips-title,
.era-portfolio.era-portfolio .ph-title,
.era-portfolio.era-portfolio .cfm-header-title,
.era-portfolio.era-portfolio .sc-value,
.era-portfolio.era-portfolio .stat-val,
.era-portfolio.era-portfolio .rb-value,
.era-portfolio.era-portfolio .cfm-val { color: var(--pf-text); }

.era-portfolio.era-portfolio .card-subtitle,
.era-portfolio.era-portfolio .chart-sub,
.era-portfolio.era-portfolio .sc-label,
.era-portfolio.era-portfolio .stat-lbl,
.era-portfolio.era-portfolio .rb-label,
.era-portfolio.era-portfolio .rb-desc,
.era-portfolio.era-portfolio .rb-hint,
.era-portfolio.era-portfolio .footer-note,
.era-portfolio.era-portfolio .empty-hint,
.era-portfolio.era-portfolio .asset-meta,
.era-portfolio.era-portfolio .asset-exposure,
.era-portfolio.era-portfolio .rl-group-label,
.era-portfolio.era-portfolio .rp-opt-desc,
.era-portfolio.era-portfolio .rw-header-note,
.era-portfolio.era-portfolio .position-chart-note,
.era-portfolio.era-portfolio .position-chart-loading,
.era-portfolio.era-portfolio .table-label,
.era-portfolio.era-portfolio .portfolio-visible-count,
.era-portfolio.era-portfolio .instrument-search-status,
.era-portfolio.era-portfolio .advanced-entry-note,
.era-portfolio.era-portfolio .cfm-header-sub,
.era-portfolio.era-portfolio .cfm-question,
.era-portfolio.era-portfolio .portfolio-command-copy,
.era-portfolio.era-portfolio .field-label,
.era-portfolio.era-portfolio .muted,
.era-portfolio.era-portfolio .help-block,
.era-portfolio.era-portfolio .tips-list li { color: var(--pf-muted); }
.era-portfolio.era-portfolio .tips-list li::before { color: var(--pf-accent); }

/* Смысловые цвета. */
.era-portfolio.era-portfolio .blue,
.era-portfolio.era-portfolio .sc-value.blue,
.era-portfolio.era-portfolio .stat-val.blue,
.era-portfolio.era-portfolio .rb-value.blue { color: var(--pf-blue); }
.era-portfolio.era-portfolio .green,
.era-portfolio.era-portfolio .rb-value.green,
.era-portfolio.era-portfolio .positive,
.era-portfolio.era-portfolio .position-result.positive strong { color: var(--pf-green); }
.era-portfolio.era-portfolio .red,
.era-portfolio.era-portfolio .rb-value.red,
.era-portfolio.era-portfolio .negative,
.era-portfolio.era-portfolio .position-result.negative strong { color: var(--pf-red); }
.era-portfolio.era-portfolio .gold,
.era-portfolio.era-portfolio .sc-value.gold { color: var(--pf-yellow); }
.era-portfolio.era-portfolio .pos-long  { background: rgb(104 201 120 / .12); color: var(--pf-green); border-color: rgb(104 201 120 / .35); }
.era-portfolio.era-portfolio .pos-short { background: rgb(231 84 71 / .12);  color: var(--pf-red);   border-color: rgb(231 84 71 / .35); }
.era-portfolio.era-portfolio .cls-badge,
.era-portfolio.era-portfolio .pos-badge { border-color: var(--pf-line-strong); color: var(--pf-body); }

/* Состояния и уведомления. */
.era-portfolio.era-portfolio .gold-method,
.era-portfolio.era-portfolio .v2-callout.warn,
.era-portfolio.era-portfolio .data-badge.stale,
.era-portfolio.era-portfolio .data-badge.issue,
.era-portfolio.era-portfolio .forecast-locked,
.era-portfolio.era-portfolio .risk-warnings {
  background: var(--pf-warn-bg); border-color: var(--pf-warn-line); color: var(--pf-warn-text);
}
.era-portfolio.era-portfolio .gold-method .gold-stale { color: var(--pf-accent); }
.era-portfolio.era-portfolio .data-badge.synced { background: var(--pf-ok-bg); border-color: var(--pf-ok-line); color: var(--pf-ok-text); }
.era-portfolio.era-portfolio .data-badge { background: var(--pf-elevated); border-color: var(--pf-line-strong); color: var(--pf-body); }
.era-portfolio.era-portfolio .v2-callout { background: var(--pf-info-bg); border-color: var(--pf-info-line); color: var(--pf-info-text); }
.era-portfolio.era-portfolio .alert,
.era-portfolio.era-portfolio .field-error,
.era-portfolio.era-portfolio .error { background: var(--pf-err-bg); border-color: var(--pf-err-line); color: var(--pf-err-text); }

/* Индикаторы заполнения. */
.era-portfolio.era-portfolio .fill-blue   { background: var(--pf-blue); }
.era-portfolio.era-portfolio .fill-amber  { background: var(--pf-yellow); }
.era-portfolio.era-portfolio .fill-orange { background: var(--pf-accent); }
.era-portfolio.era-portfolio .rw-bar,
.era-portfolio.era-portfolio .rp-bench-track { background: var(--pf-elevated); border-color: var(--pf-line); }
.era-portfolio.era-portfolio .rw-bar-fill,
.era-portfolio.era-portfolio .rp-bench-fill { background: var(--pf-accent-grad); }
.era-portfolio.era-portfolio .valuation-chart polyline { stroke: var(--pf-accent); }

/* --- Поля ввода --- */
.era-portfolio.era-portfolio input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),
.era-portfolio.era-portfolio select,
.era-portfolio.era-portfolio textarea,
.era-portfolio.era-portfolio .form-control,
.era-portfolio.era-portfolio .field-input,
.era-portfolio.era-portfolio .field-select,
.era-portfolio.era-portfolio .history-filter,
.era-portfolio.era-portfolio .portfolio-control,
.era-portfolio.era-portfolio .forecast-ticker-search {
  background: var(--pf-field);
  border: 1px solid var(--pf-line-strong);
  border-radius: 9px;
  color: var(--pf-text);
}
.era-portfolio.era-portfolio input::placeholder,
.era-portfolio.era-portfolio textarea::placeholder { color: #8A8E93; }
.era-portfolio.era-portfolio .field-input:focus,
.era-portfolio.era-portfolio .field-select:focus,
.era-portfolio.era-portfolio .portfolio-control:focus { border-color: var(--pf-accent); box-shadow: none; }
.era-portfolio.era-portfolio input[type=checkbox],
.era-portfolio.era-portfolio input[type=radio] { accent-color: var(--pf-accent); }
.era-portfolio.era-portfolio option { background: var(--pf-field); color: var(--pf-text); }

/* --- Кнопки --- */
.era-portfolio.era-portfolio .btn-add,
.era-portfolio.era-portfolio .rep-save,
.era-portfolio.era-portfolio .cfm-btn.ok,
.era-portfolio.era-portfolio input[type=submit],
.era-portfolio.era-portfolio .button:not(.secondary),
.era-portfolio.era-portfolio .rp-submit {
  background: var(--pf-accent-grad);
  border: 1px solid #B57E30;
  color: #0B0D11;
}
.era-portfolio.era-portfolio .btn-add:hover,
.era-portfolio.era-portfolio .rep-save:hover,
.era-portfolio.era-portfolio .cfm-btn.ok:hover,
.era-portfolio.era-portfolio .rp-submit:hover { background: var(--pf-accent); }
.era-portfolio.era-portfolio .cfm-btn.cancel,
.era-portfolio.era-portfolio .portfolio-reset,
.era-portfolio.era-portfolio .position-chart-link,
.era-portfolio.era-portfolio .position-chart-close,
.era-portfolio.era-portfolio .rep-close,
.era-portfolio.era-portfolio .asset-chart-toggle,
.era-portfolio.era-portfolio .sortable-label,
.era-portfolio.era-portfolio .v2-action,
.era-portfolio.era-portfolio .button.secondary,
.era-portfolio.era-portfolio .table-count {
  background: var(--pf-elevated);
  border: 1px solid var(--pf-line-strong);
  color: var(--pf-body);
}
.era-portfolio.era-portfolio .cfm-btn.cancel:hover,
.era-portfolio.era-portfolio .asset-chart-toggle:hover,
.era-portfolio.era-portfolio .asset-chart-toggle.active,
.era-portfolio.era-portfolio .sortable-label:hover,
.era-portfolio.era-portfolio .position-chart-link:hover,
.era-portfolio.era-portfolio .position-chart-close:hover,
.era-portfolio.era-portfolio .rep-close:hover { background: var(--pf-surface-2); color: var(--pf-text); border-color: var(--pf-accent-soft); }
.era-portfolio.era-portfolio .btn-clear-portfolio,
.era-portfolio.era-portfolio .btn-delete-portfolio,
.era-portfolio.era-portfolio .asset-delete,
.era-portfolio.era-portfolio .del-btn {
  background: #2A1618; border: 1px solid var(--pf-err-line); color: var(--pf-err-text);
}
.era-portfolio.era-portfolio .btn-clear-portfolio:hover,
.era-portfolio.era-portfolio .btn-delete-portfolio:hover,
.era-portfolio.era-portfolio .asset-delete:hover,
.era-portfolio.era-portfolio .del-btn:hover { background: #3B2228; }
.era-portfolio.era-portfolio .asset-delete:disabled,
.era-portfolio.era-portfolio .btn-clear-portfolio:disabled { background: var(--pf-elevated); border-color: var(--pf-line); color: var(--pf-dim); }
.era-portfolio.era-portfolio .btn-link,
.era-portfolio.era-portfolio .portfolio-footer-summary,
.era-portfolio.era-portfolio .instrument-review-link { color: var(--pf-accent); }

/* Раскрывающиеся блоки и подвал раздела. */
.era-portfolio.era-portfolio .portfolio-footer-content,
.era-portfolio.era-portfolio .portfolio-delete-disclosure .portfolio-footer-content,
.era-portfolio.era-portfolio .portfolio-v2-body,
.era-portfolio.era-portfolio .advanced-entry-body,
.era-portfolio.era-portfolio .tips-body { border-color: var(--pf-line); color: var(--pf-body); }
.era-portfolio.era-portfolio .portfolio-delete-zone p { color: var(--pf-muted); }

/* Раскрытые сценарии прогноза и чипы лимитов. */
.era-portfolio.era-portfolio .forecast-scenario-body { background: var(--pf-elevated); border-color: var(--pf-line); color: var(--pf-body); }
.era-portfolio.era-portfolio .forecast-scenario-body a { color: var(--pf-accent); }
.era-portfolio.era-portfolio .rl-pill { background: var(--pf-elevated); border-color: var(--pf-line-strong); color: var(--pf-body); }
.era-portfolio.era-portfolio .rl-pill.selected,
.era-portfolio.era-portfolio .rl-pill.active { background: var(--pf-accent); border-color: var(--pf-accent); color: #0B0D11; }

/* Чипы командного центра. */
.era-portfolio.era-portfolio .portfolio-command-chip { background: var(--pf-elevated); border-color: var(--pf-line-strong); color: var(--pf-body); }
.era-portfolio.era-portfolio .portfolio-command-chip strong { color: var(--pf-text); }
.era-portfolio.era-portfolio .portfolio-command-chip.alert { background: var(--pf-warn-bg); border-color: var(--pf-warn-line); color: var(--pf-warn-text); }

/* Таблица позиций. */
.era-portfolio.era-portfolio .asset-table th { background: var(--pf-elevated); color: var(--pf-text); border-color: var(--pf-line); }
.era-portfolio.era-portfolio .asset-table td { border-color: var(--pf-line); color: var(--pf-body); }
.era-portfolio.era-portfolio .asset-table tr:hover td { background: var(--pf-surface-2); }
.era-portfolio.era-portfolio .asset-weight { color: var(--pf-muted); }
.era-portfolio.era-portfolio .v2-history th,
.era-portfolio.era-portfolio .v2-history td { border-color: var(--pf-line); color: var(--pf-body); }

/* Подсказки поиска инструмента (portfolio_form.php). */
.era-portfolio.era-portfolio .portfolio-instrument-results,
.era-portfolio.era-portfolio .instrument-results { background: var(--pf-elevated); border-color: var(--pf-line-strong); }
.era-portfolio.era-portfolio .portfolio-instrument-result,
.era-portfolio.era-portfolio .instrument-result { border-bottom-color: var(--pf-line); color: var(--pf-body); }
.era-portfolio.era-portfolio .portfolio-instrument-result:hover,
.era-portfolio.era-portfolio .portfolio-instrument-result:focus,
.era-portfolio.era-portfolio .instrument-result.selected { background: var(--pf-surface-2); color: var(--pf-text); }
.era-portfolio.era-portfolio .portfolio-instrument-result small { color: var(--pf-muted); }

/* Модальные подтверждения и тосты. */
.era-portfolio.era-portfolio .confirm-overlay { background: rgb(11 13 17 / .78); }
.era-portfolio.era-portfolio .cfm-header { background: var(--pf-elevated); border-bottom: 1px solid var(--pf-line); color: var(--pf-text); }
.era-portfolio.era-portfolio .cfm-val.old { color: var(--pf-muted); }
.era-portfolio.era-portfolio .cfm-val.new { color: var(--pf-accent); }
.era-portfolio.era-portfolio .cfm-arrow { color: var(--pf-dim); }
.era-portfolio.era-portfolio .toast { background: var(--pf-elevated); border: 1px solid var(--pf-line-strong); color: var(--pf-text); }

/* --- Анкета профиля риска --- */
.era-portfolio.era-portfolio .rp-hero { background: linear-gradient(150deg, #1A1206, #0C0E12); color: var(--pf-text); border-bottom: 1px solid var(--pf-line); }
.era-portfolio.era-portfolio .rp-hero p { color: var(--pf-muted); }
.era-portfolio.era-portfolio .rp-card { background: var(--pf-surface); border-color: var(--pf-line); box-shadow: none; color: var(--pf-body); }
.era-portfolio.era-portfolio .rp-num { background: var(--pf-accent); color: #0B0D11; }
.era-portfolio.era-portfolio .rp-legal { background: var(--pf-warn-bg); border-color: var(--pf-warn-line); color: var(--pf-warn-text); }
.era-portfolio.era-portfolio .rp-check { border-color: var(--pf-line-strong); }
.era-portfolio.era-portfolio .rp-question { background: var(--pf-elevated); border-color: var(--pf-line); }
.era-portfolio.era-portfolio .rp-question select,
.era-portfolio.era-portfolio .rp-question input[type=number] { background: var(--pf-field); border-color: var(--pf-line-strong); color: var(--pf-text); }
.era-portfolio.era-portfolio .rp-result { background: var(--pf-elevated); border-color: var(--pf-accent-soft); }
.era-portfolio.era-portfolio .rp-result strong { color: var(--pf-accent); }
.era-portfolio.era-portfolio .rp-result small,
.era-portfolio.era-portfolio .rp-help,
.era-portfolio.era-portfolio .rp-note { color: var(--pf-muted); }
.era-portfolio.era-portfolio .rp-loss button { background: var(--pf-field); border-color: var(--pf-line-strong); color: var(--pf-body); }
.era-portfolio.era-portfolio .rp-loss button.active { background: var(--pf-accent); border-color: var(--pf-accent); color: #0B0D11; }
.era-portfolio.era-portfolio .rp-error { background: var(--pf-err-bg); border-color: var(--pf-err-line); color: var(--pf-err-text); }
.era-portfolio.era-portfolio .rp-existing { background: var(--pf-elevated); border-color: var(--pf-line-strong); color: var(--pf-body); }

/* --- Брокерские настройки --- */
.era-portfolio.era-portfolio .broker-panel { background: var(--pf-surface); border-color: var(--pf-line); color: var(--pf-body); box-shadow: none; }
.era-portfolio.era-portfolio .broker-title { color: var(--pf-text); }
.era-portfolio.era-portfolio .broker-sub,
.era-portfolio.era-portfolio .broker-meta,
.era-portfolio.era-portfolio .broker-consent,
.era-portfolio.era-portfolio .broker-status,
.era-portfolio.era-portfolio .broker-legal,
.era-portfolio.era-portfolio .broker-option p { color: var(--pf-muted); }
.era-portfolio.era-portfolio .broker-option { background: var(--pf-elevated); border-color: var(--pf-line); }
.era-portfolio.era-portfolio .broker-badge { background: var(--pf-ok-bg); color: var(--pf-ok-text); }
.era-portfolio.era-portfolio .broker-badge.off { background: var(--pf-elevated); color: var(--pf-muted); }
.era-portfolio.era-portfolio .broker-notice.success { background: var(--pf-ok-bg); border-color: var(--pf-ok-line); color: var(--pf-ok-text); }
.era-portfolio.era-portfolio .broker-notice.error { background: var(--pf-err-bg); border-color: var(--pf-err-line); color: var(--pf-err-text); }
.era-portfolio.era-portfolio .broker-plan { background: var(--pf-elevated); border-color: var(--pf-line-strong); color: var(--pf-body); }
.era-portfolio.era-portfolio .broker-plan.active { background: var(--pf-ok-bg); border-color: var(--pf-ok-line); color: var(--pf-ok-text); }
.era-portfolio.era-portfolio .broker-plan.test { background: var(--pf-warn-bg); border-color: var(--pf-warn-line); color: var(--pf-warn-text); }
.era-portfolio.era-portfolio .broker-btn { background: var(--pf-accent-grad); color: #0B0D11 !important; border: 1px solid #B57E30; }
.era-portfolio.era-portfolio .broker-btn.secondary { background: var(--pf-elevated); color: var(--pf-accent) !important; border-color: var(--pf-line-strong); }
.era-portfolio.era-portfolio .broker-btn.danger { background: #2A1618; color: var(--pf-err-text) !important; border-color: var(--pf-err-line); }
.era-portfolio.era-portfolio .broker-btn:disabled { background: var(--pf-elevated); color: var(--pf-dim) !important; border-color: var(--pf-line); }
.era-portfolio.era-portfolio .broker-list { border-top-color: var(--pf-line); }
.era-portfolio.era-portfolio .broker-row { background: var(--pf-elevated); border-color: var(--pf-line); }
.era-portfolio.era-portfolio .broker-row.processing { background: var(--pf-warn-bg); border-color: var(--pf-warn-line); }
.era-portfolio.era-portfolio .broker-processing { color: var(--pf-warn-text); }
.era-portfolio.era-portfolio .broker-name { color: var(--pf-text); }
.era-portfolio.era-portfolio .broker-help-open { color: var(--pf-accent); }
.era-portfolio.era-portfolio .broker-shortfall { background: var(--pf-warn-bg); border-color: var(--pf-warn-line); color: var(--pf-warn-text); }
.era-portfolio.era-portfolio .broker-price { background: var(--pf-elevated); border-color: var(--pf-accent-soft); color: var(--pf-body); }
.era-portfolio.era-portfolio .broker-price-label { color: var(--pf-accent); }
.era-portfolio.era-portfolio .broker-price small { color: var(--pf-muted); }
.era-portfolio.era-portfolio .broker-service-balance { background: var(--pf-elevated); border-color: var(--pf-line-strong); color: var(--pf-body); }
.era-portfolio.era-portfolio .broker-service-balance-label { color: var(--pf-accent); }
.era-portfolio.era-portfolio .broker-service-balance-value { color: var(--pf-text); }
.era-portfolio.era-portfolio .broker-service-balance-note { color: var(--pf-muted); }
.era-portfolio.era-portfolio .broker-help-dialog { background: var(--pf-elevated); border-color: var(--pf-line-strong); color: var(--pf-body); }
.era-portfolio.era-portfolio .broker-help-dialog::backdrop { background: rgb(11 13 17 / .78); }
.era-portfolio.era-portfolio .broker-help-close { background: var(--pf-field); color: var(--pf-text); }
.era-portfolio.era-portfolio .broker-help-note { background: var(--pf-info-bg); border-color: var(--pf-info-line); color: var(--pf-info-text); }

/* --- Список портфелей владельца --- */
.era-portfolio.era-portfolio .search-form .row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.era-portfolio.era-portfolio .search-form input[type=email] { min-width: 240px; flex: 1; min-height: 44px; padding: 10px 14px; }
.era-portfolio.era-portfolio .search-form button { min-height: 44px; padding: 10px 18px; border-radius: 9px; cursor: pointer; }

/* --- Мобильные экраны --- */
@media (max-width: 767px) {
  .era-portfolio.era-portfolio { overflow-x: hidden; }
  .era-portfolio.era-portfolio .asset-table,
  .era-portfolio.era-portfolio .v2-history { display: block; overflow-x: auto; }
  .era-portfolio.era-portfolio .search-form .row { flex-direction: column; align-items: stretch; }
  .era-portfolio.era-portfolio .search-form input[type=email] { min-width: 0; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .era-portfolio.era-portfolio *,
  .era-portfolio.era-portfolio *::before,
  .era-portfolio.era-portfolio *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

@font-face{font-family:Onest;font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/onest-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF;}

@font-face{font-family:Onest;font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/onest-cyrillic-400-normal.woff2) format('woff2');unicode-range:U+0400-052F;}

@font-face{font-family:Onest;font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/onest-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF;}

@font-face{font-family:Onest;font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/onest-cyrillic-500-normal.woff2) format('woff2');unicode-range:U+0400-052F;}

@font-face{font-family:Onest;font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/onest-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF;}

@font-face{font-family:Onest;font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/onest-cyrillic-600-normal.woff2) format('woff2');unicode-range:U+0400-052F;}

@font-face{font-family:Onest;font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/onest-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF;}

@font-face{font-family:Onest;font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/onest-cyrillic-700-normal.woff2) format('woff2');unicode-range:U+0400-052F;}


/* ==========================================================================
   Дополнения к страницам предпросмотра
   ========================================================================== */

/* Подложка внутренних страниц: та же карта, что на главной, но приглушённая */
body.era-inner::before {
  content: '';
  position: absolute;
  inset: 5rem 0 auto;
  z-index: -1;
  height: 1100px;
  pointer-events: none;
  background: url('../assets/img/hero-bg-1280.webp') center top / cover no-repeat;
  opacity: 0.30;
  -webkit-mask-image: linear-gradient(#000 0%, #000 35%, transparent 100%);
          mask-image: linear-gradient(#000 0%, #000 35%, transparent 100%);
}
[data-theme='light'] body.era-inner::before { opacity: 0.15; filter: grayscale(0.6); }

body.era-theme { isolation: isolate; }

/* Метка на месте PHP-подстановки — видно, куда придут данные */
.php-slot {
  display: inline-block;
  padding: 0 0.4em;
  border: 1px dashed var(--line-accent);
  border-radius: var(--r-xs);
  color: var(--text-accent);
  font-size: 0.92em;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  white-space: nowrap;
}

.era-preview-note {
  margin: 0 0 clamp(1.5rem, 3vw, 2.5rem);
  padding: 0.875rem 1.125rem;
  background-color: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  color: var(--text-secondary);
}

/* Оглавление */
.era-index { display: grid; gap: clamp(1.5rem, 3vw, 2.5rem); }
@media (min-width: 768px)  { .era-index { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1200px) { .era-index { grid-template-columns: repeat(3, 1fr); } }
.era-index-group {
  padding: clamp(1.25rem, 2vw, 1.75rem);
  background-color: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.era-index-list { display: grid; gap: 0.75rem; margin-block-start: 1.25rem; }


/* ==========================================================================
   Боковая колонка каталога и карточки тарифов
   ========================================================================== */

.era-catalog-side { display: grid; gap: 1.25rem; align-content: start; }

.era-side-nav {
  display: grid;
  gap: 0.125rem;
  padding: 1rem;
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.era-side-title {
  margin: 0 0 0.5rem;
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-chip);
  text-transform: uppercase;
  color: var(--text-muted);
}
.era-side-nav a {
  padding: 0.5rem 0.625rem;
  border-radius: var(--r-sm);
  font-size: var(--fs-body);
  color: var(--text-secondary);
}
.era-side-nav a:hover { background: var(--bg-surface-hover); color: var(--text-primary); }
.era-side-nav a[aria-current='page'] {
  background: var(--chip-bg);
  color: var(--text-primary);
  font-weight: var(--fw-medium);
}

.era-plan__count { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.era-plan__count .form-control { width: 5rem; text-align: center; }
.era-plan__count .price { margin: 0 0 0 auto; font-weight: var(--fw-semi); color: var(--text-primary); }

.era-plan-note {
  margin-block-start: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(1rem, 2vw, 1.5rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  color: var(--text-secondary);
}
.era-plan-note h2 { font-size: var(--fs-h4); margin-block-end: 0.75rem; }

/* Карта: чтобы холст был виден до загрузки данных */
.era-map-canvas { min-height: clamp(260px, 42vw, 560px); }


/* ==========================================================================
   Возврат документного ритма
   base.css обнуляет margin у p, h*, ul и ol ради контроля на главной.
   Вёрстка страниц из пакета рассчитана на браузерные значения, поэтому
   внутри .era-content возвращаем их — но только здесь.
   ========================================================================== */

.era-content p,
.era-content ul,
.era-content ol,
.era-content dl,
.era-content table,
.era-content blockquote { margin-block: 0 1em; }

.era-content ul,
.era-content ol { padding-inline-start: 1.5em; list-style: revert; }
.era-content li { margin-block-end: 0.4em; }

.era-content h1 { margin-block: 0 0.7em; }
.era-content h2 { margin-block: 1.6em 0.6em; }
.era-content h3,
.era-content h4,
.era-content h5 { margin-block: 1.4em 0.5em; }
.era-content :is(h1, h2, h3, h4, h5):first-child { margin-block-start: 0; }

.era-content form { margin-block: 0 1.25rem; }
.era-content label { display: inline-block; margin-block-end: 0.4em; }
.era-content .form-control { margin-block-end: 0.75rem; }
.era-content .btn { margin-block-end: 0.75rem; margin-inline-end: 0.5rem; }
.era-content .btn:last-child { margin-inline-end: 0; }
.era-content hr { margin-block: 1.5rem; border: 0; border-top: 1px solid var(--line); }

/* Колонки покупки: у моей разметки нет .row из бутстрапа, на который
   рассчитаны стили пакета, поэтому раскладку задаём сами. */
.era-plan__purchase { display: grid; gap: 0.75rem; align-content: start; }
.era-plan__purchase .btn { margin: 0; width: 100%; text-align: center; }
.era-plan__term { margin: 0; font-size: var(--fs-sm); color: var(--text-secondary); }
.era-plan__count { margin: 0; }
.era-plan__count .btn { width: auto; }

/* ==========================================================================
   Каталог: боковая колонка, фильтры, лента
   Собрано из двух вариантов: двухколоночная схема оставлена (всё на виду),
   из прототипа взяты бейджи доступа, теги инструментов и фильтр горизонта.
   Расчёт на аудиторию 45+: крупнее кегль, зоны нажатия от 44px,
   состояние фильтров всегда видно.
   ========================================================================== */

.era-catalog-head { max-width: 62ch; margin-block-end: clamp(1.5rem, 3vw, 2.5rem); }
.era-catalog-lead {
  margin-block-start: 0.75rem;
  font-size: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
  color: var(--text-secondary);
}

.era-catalog-layout { display: grid; gap: clamp(1.5rem, 3vw, 2.5rem); align-items: start; }
@media (min-width: 1024px) {
  .era-catalog-layout { grid-template-columns: 17.5rem minmax(0, 1fr); }
}

/* ---------- фильтры ---------- */

.era-filters {
  display: grid;
  gap: 0.875rem;
  margin-block-end: clamp(1.5rem, 3vw, 2.25rem);
  padding: clamp(1rem, 2vw, 1.375rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.era-segment { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; }
.era-segment__label {
  flex: 0 0 5.5rem;
  font-size: var(--fs-sm);
  color: var(--text-muted);
}

/* Сегменты вместо выпадающих списков: выбранное видно без открытия */
.era-seg { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.era-seg button {
  min-height: 2.75rem;            /* зона нажатия */
  padding: 0.5rem 1rem;
  background: transparent;
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  font-size: var(--fs-body);
  color: var(--text-secondary);
  transition: background-color var(--t-fast) var(--ease),
              border-color var(--t-fast) var(--ease),
              color var(--t-fast) var(--ease);
}
.era-seg button:hover { border-color: var(--line-strong); color: var(--text-primary); }
.era-seg button[aria-pressed='true'] {
  background: var(--chip-bg);
  border-color: var(--chip-line);
  color: var(--text-primary);
  font-weight: var(--fw-medium);
}
.era-filters__count { margin: 0; font-size: var(--fs-sm); color: var(--text-muted); }

/* ---------- лента ---------- */

.era-feed { display: grid; gap: clamp(1rem, 2vw, 1.5rem); }
@media (min-width: 768px) { .era-feed { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.era-post {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  transition: border-color var(--t-base) var(--ease);
}
.era-post:hover { border-color: var(--line-strong); }

/* Первая карточка — то самое «главное на сегодня» из прототипа.
   Отдельной секции для неё не нужно: это просто первый элемент ленты. */
@media (min-width: 768px) {
  .era-post--lead { grid-column: 1 / -1; flex-direction: row; }
  .era-post--lead .era-post__cover { flex: 0 0 42%; }
  .era-post--lead .era-post__title { font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); }
}

.era-post__cover { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--bg-elevated); }
.era-post__cover img { width: 100%; height: 100%; object-fit: cover; }
.era-post--lead .era-post__cover { aspect-ratio: auto; }

.era-post__body {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: clamp(1rem, 2vw, 1.5rem);
}

.era-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0; }
.era-badge {
  padding: 0.25rem 0.625rem;
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--r-xs);
  font-size: var(--fs-sm);
  color: var(--text-secondary);
  white-space: nowrap;
}
/* Доступ показываем до перехода, а не после него */
.era-badge--free { border-color: rgb(39 116 60 / 0.45); color: var(--text-success); }
.era-badge--paid { border-color: var(--line-accent); color: var(--text-accent); }
.era-post__date { margin-inline-start: auto; font-size: var(--fs-sm); color: var(--text-muted); }

.era-post__title { margin: 0; font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); line-height: 1.3; }
.era-post__title a { color: var(--text-primary); }
.era-post__title a:hover { color: var(--text-accent); }

.era-post__text {
  margin: 0;
  font-size: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);   /* 16 → 17: аудитория 45+ */
  color: var(--text-body);
}

.era-tags { display: flex; flex-wrap: wrap; gap: 0.375rem; margin: 0; }
.era-tag {
  padding: 0.1875rem 0.5rem;
  border: 1px solid var(--line);
  border-radius: var(--r-xs);
  font-size: var(--fs-sm);
  color: var(--text-muted);
}

.era-post__more {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.75rem;
  margin-block-start: auto;
  color: var(--text-accent);
}
.era-post__more svg { width: 1rem; height: 1rem; }
.era-post__more:hover { text-decoration: underline; }

.era-feed__empty {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--bg-surface);
  border: 1px dashed var(--line-strong);
  border-radius: var(--r-lg);
  text-align: center;
  color: var(--text-secondary);
}

/* ---------- читают сейчас ---------- */

.era-popular ol { margin: 0.75rem 0 0; padding-inline-start: 1.25rem; }
.era-popular li { margin-block-end: 0.5rem; }
.era-popular a { color: var(--text-secondary); font-size: var(--fs-body); }
.era-popular a:hover { color: var(--text-accent); }

/* ==========================================================================
   Личный кабинет
   Сверху строка состояния — четыре главные цифры считываются за секунду,
   ниже две колонки. В эскизе всё было свалено в левую колонку, из-за чего
   она превращалась в простыню, а справа оставались пустые прямоугольники.
   ========================================================================== */

.dash-head {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 1.25rem;
  margin-block-end: clamp(1.25rem, 2.5vw, 2rem);
}
.dash-head h1 { margin-block: 0.25rem 0; }
.dash-head__sub { margin: 0.5rem 0 0; color: var(--text-secondary); max-width: 52ch; }
.dash-head__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }

/* ---------- строка состояния ---------- */

.dash-status {
  display: grid;
  gap: clamp(0.75rem, 1.5vw, 1rem);
  margin-block-end: clamp(1.5rem, 3vw, 2.5rem);
}
@media (min-width: 640px)  { .dash-status { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .dash-status { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.dash-tile {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: clamp(1rem, 2vw, 1.375rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.dash-tile--accent { border-color: var(--line-accent); }
.dash-tile__label { margin: 0; font-size: var(--fs-sm); color: var(--text-muted); }
.dash-tile__value {
  margin: 0;
  font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2rem);
  font-weight: var(--fw-semi);
  line-height: 1.1;
}
.dash-tile--accent .dash-tile__value { color: var(--text-accent); }
.dash-tile__note { margin: 0; font-size: var(--fs-sm); color: var(--text-secondary); }
.dash-tile__link {
  display: inline-flex; align-items: center; gap: 0.5rem;
  min-height: 2.75rem; margin-block-start: auto;
  color: var(--text-accent);
}
.dash-tile__link svg { width: 1rem; height: 1rem; }
.dash-tile__link:hover { text-decoration: underline; }

/* ---------- две колонки ---------- */

.dash-layout { display: grid; gap: clamp(1rem, 2vw, 1.5rem); align-items: start; }
@media (min-width: 1200px) {
  .dash-layout { grid-template-columns: minmax(0, 1fr) 21rem; }
}
.dash-main, .dash-rail { display: grid; gap: clamp(1rem, 2vw, 1.5rem); }

.dash-card {
  padding: clamp(1rem, 2vw, 1.5rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.dash-card h2 { margin: 0; font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); }
.dash-card__head {
  display: flex; flex-wrap: wrap; align-items: baseline;
  justify-content: space-between; gap: 0.75rem;
  margin-block-end: 1.125rem;
}
.dash-card__sub { margin: 0 0 0.625rem; font-size: var(--fs-sm); color: var(--text-muted); }
.dash-card__foot {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem;
  margin-block-start: 1.25rem;
}
.dash-card--lodge, .dash-card--support { display: grid; gap: 0.75rem; }
.dash-card--lodge p, .dash-card--support p { margin: 0; color: var(--text-secondary); }
.dash-card--lodge .btn, .dash-card--support .btn { justify-self: start; }

/* ---------- кризисометр ---------- */

.dash-meter { display: grid; gap: clamp(1rem, 2vw, 1.75rem); align-items: center; }
@media (min-width: 768px) { .dash-meter { grid-template-columns: 13rem minmax(0, 1fr); } }
.gauge--sm { width: min(100%, 13rem); }
.gauge--sm .gauge__value { font-size: 2.75rem; }
.gauge--sm .gauge__readout { top: 46%; }

.dash-inds { display: grid; gap: 0.625rem; }
@media (min-width: 640px) { .dash-inds { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.dash-ind {
  display: grid; gap: 0.125rem;
  padding: 0.625rem 0.875rem;
  background: var(--bg-elevated);
  border-radius: var(--r-sm);
}
.dash-ind__name { font-size: var(--fs-sm); color: var(--text-muted); }
.dash-ind__value { font-weight: var(--fw-semi); }
.dash-ind__delta { font-size: var(--fs-sm); }
.dash-ind__delta--up   { color: var(--text-danger); }
.dash-ind__delta--down { color: var(--text-success); }
.dash-ind__delta--flat { color: var(--text-muted); }

/* ---------- портфель ---------- */

.dash-portfolio { display: grid; gap: clamp(1rem, 2vw, 1.75rem); }
@media (min-width: 768px) { .dash-portfolio { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.dash-facts { display: grid; gap: 0.5rem; margin: 0; }
.dash-facts > div {
  display: flex; justify-content: space-between; gap: 1rem;
  padding-block-end: 0.5rem;
  border-bottom: 1px solid var(--line);
}
.dash-facts dt { color: var(--text-secondary); font-size: var(--fs-sm); }
.dash-facts dd { margin: 0; font-weight: var(--fw-medium); }
.dash-facts--rows > div:last-child { border-bottom: 0; }

.dash-assets { display: grid; gap: 0.5rem; align-content: start; }
.dash-asset { display: grid; grid-template-columns: 7rem 1fr 3rem; align-items: center; gap: 0.75rem; }
.dash-asset__name { font-size: var(--fs-sm); color: var(--text-secondary); }
.dash-asset__bar { height: 8px; background: var(--bg-elevated); border-radius: 4px; overflow: hidden; }
.dash-asset__bar i { display: block; height: 100%; background: var(--g-btn); border-radius: 4px; }
.dash-asset__value { font-size: var(--fs-sm); text-align: end; font-variant-numeric: tabular-nums; }

/* ---------- разделы ---------- */

.dash-sections { display: grid; gap: 0.5rem; }
@media (min-width: 640px)  { .dash-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .dash-sections { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.dash-section {
  display: flex; align-items: center; gap: 0.625rem;
  min-height: 2.75rem;
  padding: 0.625rem 0.875rem;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--text-primary);
}
.dash-section:hover { border-color: var(--line-strong); background: var(--bg-surface-hover); }
.dash-section__name { flex: 1 1 auto; }
.dash-section__count { font-variant-numeric: tabular-nums; color: var(--text-muted); font-size: var(--fs-sm); }
.dash-section__new {
  padding: 0.125rem 0.5rem;
  background: var(--chip-bg);
  border-radius: var(--r-xs);
  font-size: var(--fs-sm);
  color: var(--text-accent);
  white-space: nowrap;
}

/* ---------- правая колонка ---------- */

.dash-balance {
  margin: 0.5rem 0 1rem;
  font-size: clamp(2rem, 1.6rem + 1.4vw, 2.75rem);
  font-weight: var(--fw-semi);
  line-height: 1;
}
.dash-balance span { font-size: 0.5em; color: var(--text-muted); }

.dash-subs { display: grid; gap: 0.625rem; }
.dash-sub {
  display: grid; grid-template-columns: 1fr auto; gap: 0.125rem 0.75rem;
  padding-block-end: 0.625rem;
  border-bottom: 1px solid var(--line);
}
.dash-sub:last-child { border-bottom: 0; padding-block-end: 0; }
.dash-sub__name { font-size: var(--fs-body); }
.dash-sub__price { font-weight: var(--fw-medium); white-space: nowrap; }
.dash-sub__till { grid-column: 1 / -1; font-size: var(--fs-sm); color: var(--text-muted); }

.dash-tools { display: grid; gap: 0.5rem; }
.dash-tool {
  display: grid; gap: 0.125rem;
  min-height: 2.75rem;
  padding: 0.625rem 0.875rem;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
}
.dash-tool:hover { border-color: var(--line-strong); background: var(--bg-surface-hover); }
.dash-tool__name { color: var(--text-primary); }
.dash-tool__note { font-size: var(--fs-sm); color: var(--text-muted); }

/* Лента в кабинете короче: карточки в одну колонку без ведущей */
.dash-feed { grid-template-columns: 1fr; }
@media (min-width: 1024px) { .dash-feed { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.dash-feed .era-post__cover { aspect-ratio: 2 / 1; }

.site-user { display: flex; align-items: center; gap: 0.75rem; white-space: nowrap; }
.site-user__name { font-size: var(--fs-sm); font-weight: var(--fw-medium); }
.site-user__exit { font-size: var(--fs-sm); color: var(--text-muted); }
.site-user__exit:hover { color: var(--text-accent); }

/* ==========================================================================
   Общая левая колонка внутренних страниц
   Состав един для всех разделов: поиск сверху, блок раздела, экосистема,
   кризисометр, инструменты, читают сейчас, действия, консультант.
   Меняется только блок раздела.
   ========================================================================== */

.page-rail { display: grid; gap: clamp(0.75rem, 1.5vw, 1rem); align-content: start; }

.rail-block {
  padding: clamp(0.875rem, 1.6vw, 1.125rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.rail-title {
  margin: 0 0 0.75rem;
  font-size: var(--fs-xs);
  font-weight: var(--fw-semi);
  letter-spacing: var(--ls-chip);
  text-transform: uppercase;
  color: var(--text-muted);
}

/* ---------- поиск ---------- */

.rail-search { display: flex; gap: 0.5rem; margin: 0; }
.rail-search input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  background: var(--bg-field);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--text-primary);
  font-size: var(--fs-body);
}
.rail-search input::placeholder { color: var(--text-muted); }
.rail-search input:focus { outline: none; border-color: var(--line-accent-hover); }
.rail-search button {
  display: grid; place-items: center;
  flex: none;
  width: 2.75rem; height: 2.75rem;
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--text-secondary);
}
.rail-search button:hover { border-color: var(--line-strong); color: var(--text-primary); }
.rail-search svg { width: 1.125rem; height: 1.125rem; }

/* ---------- экосистема и список раздела ---------- */

.eco-list, .side-nav { display: grid; gap: 0.125rem; }
.eco-link, .side-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 2.5rem;
  padding: 0.5rem 0.625rem;
  border-radius: var(--r-sm);
  font-size: var(--fs-body);
  color: var(--text-secondary);
}
.eco-link span, .side-link span {
  flex: none;
  font-size: var(--fs-sm);
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}
.eco-link:hover, .side-link:hover { background: var(--bg-surface-hover); color: var(--text-primary); }
.eco-link.is-active, .side-link.is-active {
  background: var(--chip-bg);
  color: var(--text-primary);
  font-weight: var(--fw-medium);
}
.eco-link.is-active span, .side-link.is-active span { color: var(--text-accent); }

/* ---------- кризисометр в колонке ---------- */

.crisis-widget { display: flex; align-items: center; gap: 0.875rem; }

/* Кольцо через conic-gradient: одно значение в --v, обе темы берут
   цвета из токенов, картинка не нужна. */
.crisis-gauge {
  position: relative;
  display: grid;
  place-items: center;
  flex: none;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: conic-gradient(var(--c-orange) calc(var(--v, 0) * 1%), var(--gauge-track) 0);
}
.crisis-gauge::before {
  content: '';
  position: absolute;
  inset: 5px;
  background: var(--bg-surface);
  border-radius: 50%;
}
.crisis-gauge span {
  position: relative;
  font-size: 1.25rem;
  font-weight: var(--fw-semi);
  color: var(--text-accent);
  font-variant-numeric: tabular-nums;
}
.crisis-text strong { display: block; font-size: var(--fs-body); }
.crisis-text p { margin: 0.25rem 0 0; font-size: var(--fs-sm); color: var(--text-muted); }

/* ---------- читают сейчас ---------- */

.brief-list { display: grid; gap: 0.25rem; }
.brief-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 2.75rem;
  padding: 0.5rem 0.625rem;
  border-radius: var(--r-sm);
  transition: background-color var(--t-fast) var(--ease);
}
.brief-link:hover { background: var(--bg-surface-hover); }
.brief-num {
  flex: none;
  width: 1.75rem;
  font-size: var(--fs-sm);
  font-weight: var(--fw-semi);
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}
.brief-link:hover .brief-num { color: var(--text-accent); }
.brief-body { display: grid; gap: 0.125rem; min-width: 0; }
.brief-body b { font-weight: var(--fw-medium); color: var(--text-primary); }
.brief-body span {
  font-size: var(--fs-sm);
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---------- действия и консультант ---------- */

.rail-actions, .rail-support { display: grid; gap: 0.5rem; }
.rail-actions .btn, .rail-support .btn { width: 100%; }
.rail-support p { margin: 0 0 0.25rem; font-size: var(--fs-sm); color: var(--text-secondary); }

/* ---------- каталог: колонка слева ---------- */

@media (min-width: 1024px) {
  .era-catalog-layout { grid-template-columns: 17.5rem minmax(0, 1fr); }
}

/* ---------- кабинет: колонка слева ---------- */

@media (min-width: 1200px) {
  .dash-layout { grid-template-columns: 21rem minmax(0, 1fr); }
}
.dash-rail .rail-block { background: var(--bg-surface); }
.dash-rail-title {
  margin: 0 0 0.75rem;
  font-size: var(--fs-xs);
  font-weight: var(--fw-semi);
  letter-spacing: var(--ls-chip);
  text-transform: uppercase;
  color: var(--text-muted);
}


/* ==========================================================================
   Поправки к раскладке колонок
   ========================================================================== */

/* В era-theme.css из пакета стоит @media(max-width:1100px) с первой
   колонкой 220px. Моё правило начиналось с 1024, поэтому в диапазоне
   768–1023 оставалась двухколоночная сетка с вдвое более узкой колонкой,
   и её содержимое вылезало на соседнюю. Перебиваем явно: до 1024 — одна
   колонка, с 1024 — две. */
@media (max-width: 63.99em) {
  .era-catalog-layout { grid-template-columns: 1fr; }
}

/* min-width: auto у элемента сетки равен его min-content, поэтому длинные
   подписи вроде «доказательства» распирали колонку наружу. */
.page-rail,
.dash-rail,
.dash-main,
.era-catalog-content { min-width: 0; }

.eco-link, .side-link, .dash-tool, .brief-link { min-width: 0; }
.eco-link, .side-link { flex-wrap: wrap; }

/* .era-catalog-side — старая колонка каталога, её больше нет в разметке.
   Липкость .page-rail и .dash-rail задаётся ниже, в медиазапросе. */
.era-catalog-side { position: static; }

/* ==========================================================================
   Тарифы и услуги
   Структура из прототипа v4: три входа по сценарию, темы, разовый доступ,
   услуги, таблица сравнения.
   ========================================================================== */

.plan-section { margin-block-end: clamp(2.5rem, 5vw, 4rem); }
.plan-section h2 { margin-block: 0.5rem 1rem; font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); }
.plan-section__lead { margin-block-end: 1.5rem; color: var(--text-secondary); max-width: 62ch; }

/* ---------- три входа ---------- */

.plan-tiers { display: grid; gap: clamp(0.875rem, 1.8vw, 1.25rem); align-items: stretch; }
@media (min-width: 900px) { .plan-tiers { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.plan-tier {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  padding: clamp(1.125rem, 2vw, 1.625rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
/* Средний — основной выбор, поэтому выделен рамкой, а не размером:
   разная высота карточек мешает сравнивать списки построчно. */
.plan-tier--featured { border-color: var(--line-accent); box-shadow: 0 0 0 1px var(--line-accent); }

.plan-tier__badge {
  margin: 0;
  font-size: var(--fs-sm);
  letter-spacing: var(--ls-chip);
  text-transform: uppercase;
  color: var(--text-muted);
}
.plan-tier--featured .plan-tier__badge { color: var(--text-accent); }
.plan-tier__name { margin: 0; font-size: clamp(1.125rem, 1rem + 0.5vw, 1.375rem); }
.plan-tier__desc { margin: 0; font-size: var(--fs-body); color: var(--text-secondary); }
.plan-tier__price {
  margin: 0.375rem 0 0;
  font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.25rem);
  font-weight: var(--fw-semi);
  line-height: 1.1;
}
.plan-tier__price span { font-size: 0.42em; font-weight: var(--fw-regular); color: var(--text-muted); }

.plan-tier__list { display: grid; gap: 0.5rem; margin: 0.75rem 0 1.25rem; padding: 0; list-style: none; }
.plan-tier__list li {
  position: relative;
  padding-inline-start: 1.5rem;
  font-size: var(--fs-body);
  color: var(--text-body);
}
.plan-tier__list li::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 0.5em;
  width: 0.6rem; height: 0.34rem;
  border-inline-start: 2px solid var(--text-accent);
  border-block-end: 2px solid var(--text-accent);
  rotate: -45deg;
}
.plan-tier .btn { margin-block-start: auto; width: 100%; }

/* ---------- смысл Premium ---------- */

.plan-sense {
  padding: clamp(1.25rem, 2.5vw, 2rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.plan-sense > p { max-width: 68ch; color: var(--text-secondary); }
.plan-stats { display: grid; gap: 1rem; margin-block-start: 1.5rem; }
@media (min-width: 640px) { .plan-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.plan-stat { display: grid; gap: 0.25rem; }
.plan-stat strong {
  font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2rem);
  line-height: 1;
  color: var(--text-accent);
}
.plan-stat span { font-size: var(--fs-sm); color: var(--text-muted); }

/* ---------- темы и услуги ---------- */

.plan-topics, .plan-services { display: grid; gap: clamp(0.875rem, 1.8vw, 1.25rem); }
@media (min-width: 640px) { .plan-topics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .plan-services { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.plan-topic, .plan-service {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  padding: clamp(1rem, 2vw, 1.375rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.plan-topic:hover, .plan-service:hover { border-color: var(--line-strong); }
.plan-topic__head, .plan-service__head {
  display: flex; flex-wrap: wrap; align-items: baseline;
  justify-content: space-between; gap: 0.5rem 1rem;
}
.plan-topic__head h3, .plan-service__head h3 { margin: 0; font-size: var(--fs-h4); }
.plan-topic__price {
  margin: 0;
  font-size: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  font-weight: var(--fw-semi);
  white-space: nowrap;
}
.plan-topic__price span { font-size: 0.6em; font-weight: var(--fw-regular); color: var(--text-muted); }
.plan-topic p, .plan-service p { margin: 0; color: var(--text-body); }
.plan-topic__once { font-size: var(--fs-sm); color: var(--text-muted); }
.plan-topic .era-text-link, .plan-service .btn { margin-block-start: auto; }
.plan-topic .era-text-link svg, .plan-service .btn svg { width: 1rem; height: 1rem; }

/* ---------- разовый доступ ---------- */

.plan-single {
  display: grid; gap: clamp(1rem, 2vw, 1.75rem); align-items: center;
  padding: clamp(1.25rem, 2.5vw, 2rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
@media (min-width: 768px) { .plan-single { grid-template-columns: minmax(0, 1fr) auto; } }
.plan-single h3 { margin: 0 0 0.5rem; font-size: var(--fs-h4); }
.plan-single p { margin: 0; color: var(--text-body); max-width: 62ch; }
.plan-single__buy { display: grid; gap: 0.75rem; justify-items: start; }

/* ---------- сравнение ---------- */

.plan-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-lg); }
.plan-table { width: 100%; border-collapse: collapse; min-width: 34rem; }
.plan-table th, .plan-table td {
  padding: 0.75rem 1rem;
  text-align: start;
  font-size: var(--fs-body);
  border-block-end: 1px solid var(--line);
}
.plan-table thead th {
  background: var(--bg-elevated);
  font-size: var(--fs-sm);
  letter-spacing: var(--ls-chip);
  text-transform: uppercase;
  color: var(--text-muted);
  white-space: nowrap;
}
.plan-table tbody th { font-weight: var(--fw-medium); color: var(--text-primary); }
.plan-table td { color: var(--text-body); }
.plan-table tbody tr:last-child th, .plan-table tbody tr:last-child td { border-block-end: 0; }
.plan-table tbody td:last-child { color: var(--text-primary); font-weight: var(--fw-medium); }


/* ==========================================================================
   Переполнение колонки кнопками
   У .btn стоит white-space: nowrap и отступы до 2.75rem с каждой стороны.
   «Написать консультанту» требует ~318px при колонке 280, а min-width: auto
   у элемента сетки равен min-content — трек растягивался под кнопку, и
   колонка выезжала под соседнюю. Внутри колонок кнопка компактнее и умеет
   переносить текст.
   ========================================================================== */

.page-rail .rail-block,
.dash-rail .rail-block,
.dash-rail .dash-card { min-width: 0; }

.page-rail .btn,
.dash-rail .btn {
  --btn-px: 1rem;
  white-space: normal;
  text-align: center;
  min-width: 0;
}

.page-rail .rail-block *,
.dash-rail .rail-block * { overflow-wrap: anywhere; }

/* Длинный статус в «Читают сейчас» обрезаем многоточием, а не растягиваем */
.brief-body { min-width: 0; }
.brief-body span { overflow-wrap: normal; }

/* ==========================================================================
   Страница материала
   Из прототипа v4: открытая часть сценария показывает ценность до пейвола.
   ========================================================================== */

.crumbs {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
  margin-block-end: 1rem;
  font-size: var(--fs-sm);
  color: var(--text-muted);
}
.crumbs a { color: var(--text-secondary); }
.crumbs a:hover { color: var(--text-accent); }
.crumbs > * + *::before { content: '/'; margin-inline-end: 0.5rem; color: var(--line-strong); }

.article-head { margin-block-end: clamp(1.5rem, 3vw, 2.5rem); }
.article-head h1 { margin-block: 0.875rem 0; max-width: 24ch; }
.article-lead {
  margin-block: 0.875rem 0;
  max-width: 62ch;
  font-size: clamp(1.0625rem, 1rem + 0.4vw, 1.25rem);
  color: var(--text-secondary);
}
.article-facts {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
  margin-block: 1.125rem 0;
}
.article-status {
  padding: 0.1875rem 0.625rem;
  background: var(--chip-bg);
  border-radius: var(--r-xs);
  font-size: var(--fs-sm);
  color: var(--text-success);
}
.article-read { font-size: var(--fs-sm); color: var(--text-muted); }
.era-badge--partial { border-color: var(--chip-line); color: var(--text-info); }

/* ---------- основные выводы ---------- */

.takeaways {
  padding: clamp(1.125rem, 2.2vw, 1.75rem);
  margin-block-end: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-inline-start: 3px solid var(--line-accent);
  border-radius: var(--r-lg);
}
.takeaways__lead {
  margin-block: 0.5rem 1rem;
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
  font-weight: var(--fw-medium);
  max-width: 62ch;
}
.takeaways__list { display: grid; gap: 0.625rem; margin: 0; padding: 0; list-style: none; }
.takeaways__list li {
  position: relative;
  padding-inline-start: 1.375rem;
  color: var(--text-body);
}
.takeaways__list li::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 0.6em;
  width: 0.375rem; height: 0.375rem;
  background: var(--text-accent);
  border-radius: 50%;
}

/* ---------- тело материала ---------- */

.article-body { max-width: 68ch; }
.article-body h2 { margin-block: 2rem 0.875rem; font-size: clamp(1.25rem, 1rem + 1vw, 1.625rem); }
.article-body h2:first-child { margin-block-start: 0; }
.article-body p { color: var(--text-body); }

.scenarios { display: grid; gap: 0.75rem; margin-block: 1rem 0; max-width: none; }
@media (min-width: 768px) { .scenarios { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.scenario {
  padding: 1rem;
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.scenario__name {
  margin: 0 0 0.375rem;
  font-size: var(--fs-sm);
  letter-spacing: var(--ls-chip);
  text-transform: uppercase;
}
.scenario p { margin: 0; font-size: var(--fs-body); color: var(--text-body); }
.scenario--base .scenario__name { color: var(--text-success); }
.scenario--risk .scenario__name { color: var(--text-danger); }
.scenario--up   .scenario__name { color: var(--text-accent); }

/* ---------- пейвол ---------- */

.paywall {
  position: relative;
  margin-block: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(1.25rem, 2.5vw, 2rem);
  background: var(--bg-surface);
  border: 1px solid var(--line-accent);
  border-radius: var(--r-lg);
}
/* Мягкий переход сверху: видно, что текст не оборван, а закрыт */
.paywall::before {
  content: '';
  position: absolute;
  inset-inline: 0;
  inset-block-start: -3rem;
  height: 3rem;
  pointer-events: none;
  background: linear-gradient(180deg, rgb(0 0 0 / 0), var(--bg-page));
}
.paywall h2 { margin-block: 0.5rem 0.75rem; font-size: clamp(1.125rem, 1rem + 0.8vw, 1.5rem); max-width: 40ch; }
.paywall > p { margin: 0; max-width: 62ch; color: var(--text-secondary); }
.paywall__actions {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem;
  margin-block-start: 1.25rem;
}
.paywall__actions svg { width: 1rem; height: 1rem; }

/* ---------- история прогноза ---------- */

.article-history h2 { margin-block: 0.5rem 1.25rem; font-size: clamp(1.125rem, 1rem + 0.8vw, 1.5rem); }
.timeline { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.timeline__item {
  position: relative;
  padding: 0 0 1.25rem 1.75rem;
  border-inline-start: 2px solid var(--line);
}
.timeline__item:last-child { border-inline-start-color: transparent; padding-block-end: 0; }
.timeline__item::before {
  content: '';
  position: absolute;
  inset-inline-start: -0.45rem;
  inset-block-start: 0.3rem;
  width: 0.75rem; height: 0.75rem;
  background: var(--bg-page);
  border: 2px solid var(--line-strong);
  border-radius: 50%;
}
.timeline__item.is-current::before { border-color: var(--text-accent); background: var(--text-accent); }
.timeline__item time { font-size: var(--fs-sm); color: var(--text-muted); }
.timeline__item strong { display: block; margin-block: 0.125rem 0.25rem; }
.timeline__item p { margin: 0; color: var(--text-body); }
.article-note {
  margin-block-start: 1.25rem;
  font-size: var(--fs-sm);
  color: var(--text-muted);
}

/* ---------- открыто до оплаты ---------- */

.open-list { display: grid; gap: 0.375rem; }
.open-row {
  display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
  font-size: var(--fs-body);
  color: var(--text-secondary);
}
.open-mark {
  flex: none;
  padding: 0.0625rem 0.5rem;
  border-radius: var(--r-xs);
  font-size: var(--fs-sm);
  color: var(--text-success);
  background: var(--bg-elevated);
}
.open-mark--paid { color: var(--text-accent); }

/* ==========================================================================
   Визуальная система внутренних страниц (адаптация прототипа v4)
   Ключевое: весь текст лежит на подложке, надзаголовки акцентного цвета,
   бейджи и акцентные панели покрашены, колонка прокручивается отдельно.
   Всё через токены, поэтому обе темы работают из одного набора правил.
   ========================================================================== */

/* Плотнее радиус и тень — из прототипа, «рабочий стол», а не лендинг */
.era-content {
  --r-card: 10px;
  font-size: 1.0625rem;          /* 17px: в прототипе так, и читается лучше */
}

.rail-block, .dash-card, .dash-tile, .era-post, .plan-tier, .plan-topic,
.plan-service, .plan-single, .plan-sense, .takeaways, .paywall, .era-plan-note,
.plan-table-wrap, .article-body, .article-history, .next-card, .era-feed__empty {
  border-radius: var(--r-card, 10px);
}

/* ---------- надзаголовки внутри карточек ---------- */

/* .eyebrow — это ярлык-коробка с главной. Внутри карточек нужен другой
   приём: короткая акцентная подпись, как в прототипе. */
.panel-eyebrow {
  margin: 0 0 0.625rem;
  font-size: 0.75rem;
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-chip);
  text-transform: uppercase;
  color: var(--text-accent);
}
.rail-title { color: var(--text-accent); font-weight: var(--fw-bold); }

/* ---------- независимая прокрутка колонки ---------- */

@media (min-width: 1024px) {
  .page-rail, .dash-rail {
    position: sticky;
    /* Высоту шапки меряет JS: на внутренних страницах у неё height: auto,
       и фиксированное число давало то щель, то перекрытие. */
    top: calc(var(--header-h, 5rem) + 0.75rem);
    max-height: calc(100vh - var(--header-h, 5rem) - 1.5rem);

    /* Крутить колонку можно и самому. Как только это происходит,
       синхронизация отключается — иначе она отматывала бы обратно. */
    overflow: auto;
    scrollbar-width: thin;
  }
}

/* ---------- цветные бейджи ---------- */

.era-badge--free {
  background: var(--bg-success);
  border-color: var(--line-success);
  color: var(--text-success);
}
.era-badge--paid {
  background: var(--bg-warm);
  border-color: var(--line-warm);
  color: var(--text-accent);
}
.era-badge--partial {
  background: var(--bg-info);
  border-color: var(--line-info);
  color: var(--text-info);
}
.era-tag { background: var(--bg-soft); }

/* ---------- акцентные панели ---------- */

.paywall, .plan-tier--featured, .next-card--accent, .dash-tile--accent {
  background: var(--bg-warm);
  border-color: var(--line-warm);
}
.paywall::before { background: linear-gradient(180deg, rgb(0 0 0 / 0), var(--bg-page)); }

/* ---------- текст материала на подложке ---------- */

.article-body {
  max-width: none;
  padding: clamp(1.125rem, 2.4vw, 1.75rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
}
.article-body > * { max-width: 68ch; }
.article-body .scenarios { max-width: none; }
.article-body p { font-size: 1.0625rem; margin-block: 0.625rem; }
.article-history {
  padding: clamp(1.125rem, 2.4vw, 1.75rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
}
.crumbs { padding-block-end: 0; }

.scenario--base { background: var(--bg-success); border-color: var(--line-success); }
.scenario--risk { background: var(--bg-danger);  border-color: var(--line-danger); }
.scenario--up   { background: var(--bg-warm);    border-color: var(--line-warm); }

/* ---------- график динамики ---------- */

.chart-panel {
  display: grid;
  grid-template-columns: repeat(20, 1fr);
  align-items: end;
  gap: 5px;
  min-height: clamp(9rem, 18vw, 14rem);
  margin-block: 1.25rem 0;
  padding: 1rem;
  background: var(--bg-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-card, 10px);
}
.chart-panel i {
  display: block;
  min-height: 16px;
  border-radius: 4px 4px 0 0;
  background: linear-gradient(180deg, #FFC96B, #D88718);
}
.chart-caption { margin-block-start: 0.625rem; font-size: var(--fs-sm); color: var(--text-muted); }

/* ---------- следующие действия ---------- */

.next-actions { margin-block-start: clamp(1.5rem, 3vw, 2.5rem); }
.next-actions__head {
  display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between;
  gap: 1rem; margin-block-end: 1.125rem;
}
.next-actions__head h2 { margin: 0.25rem 0 0; font-size: clamp(1.25rem, 1rem + 1vw, 1.625rem); }
.next-actions__note { margin: 0; max-width: 38ch; color: var(--text-secondary); font-size: var(--fs-body); }
.next-grid { display: grid; gap: 0.75rem; }
@media (min-width: 768px) { .next-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.next-card {
  display: grid; gap: 0.5rem; align-content: start;
  padding: clamp(1rem, 2vw, 1.25rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
}
.next-card h3 { margin: 0; font-size: var(--fs-h4); line-height: 1.25; }
.next-card p { margin: 0; color: var(--text-body); font-size: var(--fs-body); }
.next-card .era-text-link { margin-block-start: 0.25rem; font-weight: var(--fw-medium); }

/* ---------- мелочи ---------- */

.era-catalog-content > .plan-section > .panel-eyebrow { margin-block-start: 0; }
.takeaways { border-inline-start-width: 3px; }


/* ==========================================================================
   Возврат к фирменной типографике
   Аудит показал пять расхождений с главной. Заголовки были главным:
   там разряженный капс с градиентом, а era-theme.css из пакета задаёт
   сжатый строчный с letter-spacing: -.035em — прямо противоположный приём.
   ========================================================================== */

.era-content h1,
.era-content .plan-section > h2,
.era-content .paywall > h2,
.era-content .article-history > h2,
.era-content .next-actions__head h2,
.era-content .article-body h2,
.era-content .takeaways + .article-body h2 {
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  text-wrap: balance;
}

/* Градиент-перелив, как у заголовков секций на главной */
.era-content h1,
.era-content .plan-section > h2,
.era-content .next-actions__head h2 {
  background-image: var(--g-heading);
  -webkit-background-clip: text;
          background-clip: text;
  color: transparent;
}

/* Радиус как на главной: 16 у карточек, 10 у мелких элементов.
   10 из прототипа делал страницы визуально чужими. */
.era-content { --r-card: var(--r-lg); }
.era-badge, .era-tag, .open-mark, .dash-ind, .scenario,
.dash-section, .dash-tool, .eco-link, .side-link, .brief-link,
.rail-search input, .rail-search button { border-radius: var(--r-sm); }

/* Ярлык-коробка — фирменная деталь, вернулась на уровень секций.
   .panel-eyebrow остаётся только внутри карточек. */
.era-content .eyebrow { margin-block-end: 0.875rem; }

.panel-eyebrow {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-chip);
}

/* Кегль: 17px оставляем только прозе материала, остальное — как на главной */
.era-content { font-size: var(--fs-body); }
.article-body p, .article-body li { font-size: 1.0625rem; }

/* ==========================================================================
   Карта активов
   ========================================================================== */

.era-map-header { max-width: 62ch; margin-block-end: clamp(1.25rem, 2.5vw, 2rem); }
.era-map-header p { margin-block-start: 0.75rem; color: var(--text-secondary); }

.era-map-panel {
  padding: clamp(1rem, 2.2vw, 1.5rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-card, 16px);
}
.era-map-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.75rem;
  margin-block-end: 1.25rem;
}
.era-map-country { display: grid; gap: 0.375rem; flex: 1 1 16rem; min-width: 0; }
.era-map-country label { font-size: var(--fs-sm); color: var(--text-muted); }
.era-map-country select {
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  background: var(--bg-field);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--text-primary);
  font: inherit;
}
.era-map-note { margin-block-start: 1rem; font-size: var(--fs-sm); color: var(--text-muted); }
.era-map-canvas {
  min-height: clamp(260px, 42vw, 560px);
  background: var(--bg-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
}

/* ==========================================================================
   Каталог: компактная карточка материала
   В каталоге изображения — в основном логотипы компаний 110×110. Большая
   обложка под ними ничего не сообщает, зато вытесняет заголовок и анонс.
   Поэтому миниатюра 88px, а место отдано тексту и меткам.
   ========================================================================== */

/* Шире макет: по бокам всё равно остаются поля контейнера */
.era-content { --container: 120rem; }

.era-feed {
  display: grid;
  gap: clamp(0.875rem, 1.4vw, 1.25rem);
  grid-template-columns: 1fr;
}
@media (min-width: 700px)  { .era-feed { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1500px) { .era-feed { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.post-card {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
  padding: clamp(1rem, 1.6vw, 1.25rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-card, var(--r-lg));
  transition: border-color var(--t-base) var(--ease);
}
.post-card:hover { border-color: var(--line-strong); }

/* метки над заголовком */
.post-card__top { display: flex; flex-wrap: wrap; gap: 0.375rem; margin: 0; }

.post-card__main { display: flex; gap: 0.875rem; align-items: start; min-width: 0; }

.post-card__thumb {
  flex: none;
  display: block;
  width: 5.5rem;
  height: 5.5rem;
  overflow: hidden;
  background: var(--bg-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
}
.post-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
/* Логотипы вписываем целиком: кадрировать их нельзя */
.post-card__thumb--logo img { object-fit: contain; padding: 0.5rem; }

.post-card__body { min-width: 0; display: grid; gap: 0.375rem; }

.post-card__title {
  margin: 0;
  font-size: 1rem;
  line-height: 1.3;
  font-weight: var(--fw-semi);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  /* три строки максимум: карточки в ряду остаются одной высоты */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.post-card__title a { color: var(--text-primary); }
.post-card__title a:hover { color: var(--text-accent); }

.post-card__text {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: 1.5;
  color: var(--text-body);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* метки под заголовком */
.post-card__foot {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
  margin: 0; padding-block-start: 0.125rem;
}
.post-card__meta {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-size: var(--fs-sm); color: var(--text-muted);
}
.post-card__dot { width: 3px; height: 3px; border-radius: 50%; background: currentColor; }
.post-card__foot .era-tags { gap: 0.3125rem; }

.post-card__more {
  display: inline-flex; align-items: center; gap: 0.5rem;
  min-height: 2.5rem;
  margin-block-start: auto;
  padding-block-start: 0.5rem;
  border-block-start: 1px solid var(--line);
  font-size: var(--fs-sm);
  color: var(--text-accent);
}
.post-card__more svg { width: 0.875rem; height: 0.875rem; }
.post-card__more:hover { text-decoration: underline; }

/* Заголовок страницы переехал в правую колонку, на место фильтра */
.era-catalog-content > .era-catalog-head { margin-block-end: clamp(1.25rem, 2.4vw, 1.75rem); }

/* В ленте кабинета — та же карточка, но в три колонки сразу */
.dash-feed { grid-template-columns: 1fr; }
@media (min-width: 900px) { .dash-feed { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ==========================================================================
   Каталог: сетка и карточка материала
   Картинка намеренно небольшая — на боевом сайте это в основном логотипы
   компаний, крупная подача им ничего не добавляет. Плитка 4:3: логотипы
   в неё ложатся не вытягиваясь, фотографии читаются как миниатюра.
   ========================================================================== */

/* Ширина макета до 1920: по бокам всё равно остаются поля */
/* В era-theme.css из пакета у контейнера max-width: 1440px — он и держал
   ширину, а не наш токен. Перебиваем обоих. */
.era-content .container {
  --container: 120rem;
  max-width: none;
  width: min(100% - 2 * var(--gutter), var(--container));
  padding-inline: 0;
}
@media (min-width: 1024px) {
  .era-catalog-layout { grid-template-columns: 20rem minmax(0, 1fr); }
}

.era-feed { display: grid; gap: clamp(0.75rem, 1.4vw, 1.125rem); }
@media (min-width: 700px)  { .era-feed { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1400px) { .era-feed { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.pcard {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: clamp(0.75rem, 1.3vw, 1rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-card, 16px);
  transition: border-color var(--t-base) var(--ease);
}
.pcard:hover { border-color: var(--line-strong); }


.pcard__top { display: flex; flex-wrap: wrap; gap: 0.375rem; margin: 0; }

.pcard__title { margin: 0; font-size: 1.0625rem; line-height: 1.3; }
.pcard__title a { color: var(--text-primary); }
.pcard:hover .pcard__title a { color: var(--text-accent); }

.pcard__rubric {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--text-muted);
}
.pcard__label {
  padding: 0.1875rem 0.5rem;
  background: var(--bg-info);
  border: 1px solid var(--line-info);
  border-radius: var(--r-sm);
  color: var(--text-info);
}

.pcard__text {
  margin: 0;
  font-size: var(--fs-body);
  color: var(--text-body);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pcard__foot {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem;
  margin: auto 0 0;
}
.pcard__more {
  display: inline-flex; align-items: center; gap: 0.375rem;
  margin-inline-start: auto;
  font-size: var(--fs-body);
  color: var(--text-accent);
  white-space: nowrap;
}
.pcard__more svg { width: 0.9375rem; height: 0.9375rem; }
.pcard__more:hover { text-decoration: underline; }

/* Заголовок страницы теперь внутри правой колонки */
.era-catalog-content > .era-catalog-head { margin-block-end: clamp(1.25rem, 2.4vw, 1.75rem); }


/* Колонка начинается вровень с контентом: у .rail-title сбрасываем
   документный ритм, который добавлял ей нижний, а первому блоку — верхний
   отступ. */
.page-rail > :first-child, .dash-rail > :first-child { margin-block-start: 0; }
.era-content .rail-title, .era-content .dash-rail-title { margin-block: 0 0.625rem; }
.era-content .rail-block p:last-child,
.era-content .rail-block nav,
.era-content .rail-block .dash-tools { margin-block-end: 0; }


/* ==========================================================================
   Правки по обратной связи
   ========================================================================== */

/* 1. Верхний отступ страницы. В era-theme.css их два: 72px и 36px,
   побеждал первый. Ставим свой, спокойный. */
.era-content { padding-block: 2.25rem 3.5rem; }


/* 3. Документный ритм не должен доходить до внутренностей карточек:
   он добавлял по 1em под каждым <p>, отсюда провалы над заголовком
   и внизу. Отступы внутри задаёт сам компонент через gap. */
.era-content :is(.pcard, .rail-block, .dash-card, .dash-tile, .next-card,
                 .plan-tier, .plan-topic, .plan-service, .scenario,
                 .era-post, .review) :is(p, h2, h3, h4, ul, ol, dl) {
  margin: 0;
}
.pcard { gap: 0.625rem; }
.pcard__foot { padding-block-start: 0.125rem; }


/* ==========================================================================
   Картинка карточки: коробка во всю ширину, высота 200
   Приводим картинку к высоте 200: влезла по ширине — центрируем по
   горизонтали, не влезла — заполняем ширину и центрируем по вертикали.
   Ровно это и делает object-fit: contain, поэтому без JS.
   ========================================================================== */


/* Без лейблов типа и доступа — остались рубрика и дата */
.pcard__top { display: none; }

/* ==========================================================================
   Картинка карточки: без полей
   Всегда заполняет высоту 200px. Шире коробки — обрезается поровну с двух
   сторон, уже — по бокам остаётся фон карточки. Сверху и снизу полей нет
   никогда, поэтому object-fit не годится: contain оставлял бы их у широких
   картинок. Вместо него img c height: 100% и width: auto — пропорции держит
   сама картинка, а лишнее срезает overflow контейнера.
   ========================================================================== */

.pcard { --pcard-pad: clamp(0.75rem, 1.3vw, 1rem); padding: var(--pcard-pad); }

.pcard__media {
  /* Был grid + place-items:center. У элемента грида с align-items:center
     высота строки авто, и height:100% у картинки разрешался циклически —
     то есть в auto. Квадратная обложка выходила во всю ширину, высотой
     во всю себя, и её резал overflow. Блок с заданной высотой убирает
     цикл: 100% считается от 12.5rem. */
  display: block;
  width: auto;
  height: 12.5rem;
  overflow: hidden;

  /* выходим за внутренние поля карточки: сверху и по бокам вровень с краем */
  margin: calc(-1 * var(--pcard-pad)) calc(-1 * var(--pcard-pad)) 0.375rem;
  /* Своего скругления у картинки нет. Верхние углы ей задаёт карточка:
     у неё overflow: hidden, и она сама обрезает всё по своему радиусу.
     Так углы совпадают точно, без подгонки на минус пиксель. */
  border-radius: 0;
}
.pcard__media img {
  display: block;
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: contain;       /* обложки материалов — в основном логотипы
                                на белом, кадрировать их нечем и незачем */
  object-position: center;
}

/* Отдельного правила для логотипов нет намеренно: любое исключение
   возвращает вертикальные поля, от которых и уходили. Картинка карточки
   готовится под одну пропорцию на стороне контента. */

/* Две колонки начинаются с 480, одна — только ниже */
@media (min-width: 480px)  { .era-feed { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1400px) { .era-feed { grid-template-columns: repeat(3, minmax(0, 1fr)); } }


/* Карточка обрезает содержимое по своему радиусу — этим и скругляются
   верхние углы картинки, а низ остаётся прямым. */
.pcard { overflow: hidden; }


/* ==========================================================================
   Шапка внутренних страниц
   18.09.2026: правила пакета по шапке удалены целиком, а не перебиты.
   Их было девять — position:relative, height:auto, z-index:30, свои
   min-height, padding, gap, своё мобильное меню .era-is-open. Они
   описывали чужую шапку, которой у нас больше нет, и из-за z-index:30
   мегаменю пряталось под прилипшей колонкой.
   Шапка теперь одна на все страницы и живёт только в era.css.
   Широкий контейнер оставлен контенту: селектор ниже сужен до
   .era-content .container, шапку и подвал он больше не трогает.
   ========================================================================== */




/* ==========================================================================
   Картинка карточки: перебиваем правило пакета
   В era-theme.css есть .era-content article img{border-radius:12px;
   height:auto;max-width:100%}. Карточка — это <article>, и по
   специфичности (0,1,2) это правило било мой .pcard__media img (0,1,1).
   Переопределялось не только скругление, но и вся логика размеров:
   height: auto вместо 100% и max-width: 100% вместо none. Отсюда и
   вписанная с полями картинка вместо заполняющей высоту.
   ========================================================================== */

.era-content .pcard__media img {
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: contain;
  object-position: center;
  border-radius: 0;
}


/* ==========================================================================
   Правки по обратной связи: статья и кнопки
   ========================================================================== */

/* Золотая кнопка: текст тёмный в обеих темах. Белым он становился из-за
   правил пакета на ссылки внутри .era-content — там специфичность выше,
   чем у .btn--primary. */
.era-content .btn--primary,
.era-content a.btn--primary { color: var(--c-black-1); }

/* Текст статьи занимает всю ширину блока. Ограничение в 68ch переносило
   строки заметно раньше края подложки. */
.article-body > *,
.paywall > p,
.era-content .article-body p { max-width: none; }

/* Ссылки-стрелки в карточках переносились на вторую строку и выглядели
   криво — там теперь обычные кнопки. */
.next-card .btn { justify-self: start; margin-block-start: auto; }

/* ==========================================================================
   Тарифы: две карточки в ряд
   Раньше было три входа, теперь шесть направлений — в три колонки карточки
   становятся узкими, а список возможностей в них нечитаемым.
   ========================================================================== */

@media (min-width: 700px) {
  .plan-tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  .plan-tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.plan-tier__once {
  margin: 0.5rem 0 0;
  font-size: var(--fs-sm);
  color: var(--text-muted);
  text-align: center;
}
.plan-tier .btn { margin-block-start: auto; }
.plan-tier__once + * { margin-block-start: 0; }

/* ==========================================================================
   Тарифы: сетка, списки, кнопки
   ========================================================================== */

/* Две карточки в ряд, с 1440 — три */
@media (min-width: 700px)  { .plan-tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1440px) { .plan-tiers { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Маркеры списка: блок возврата документного ритма ставил ul обратно
   list-style: revert, и рядом с галочкой появлялся ещё и кружок.
   Селектор с .era-content — иначе он перебивает по специфичности. */
.era-content .plan-tier__list {
  margin: 0.75rem 0 1.25rem;
  padding-inline-start: 0;
  list-style: none;
}
.era-content .plan-tier__list li { margin: 0; }

.plan-tier__buy { display: grid; gap: 0.5rem; margin-block-start: auto; }
.plan-tier__buy .btn { width: 100%; }


/* ==========================================================================
   Переход к разделу по якорю из левой колонки
   ========================================================================== */

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Иначе заголовок раздела уезжает под липкую шапку */
.era-content [id] { scroll-margin-block-start: calc(var(--header-h, 5rem) + 1.25rem); }

/* ==========================================================================
   Тёмная тема внутренних страниц: подложки светлее фона
   На главной карточка почти сливается с фоном намеренно — так снято
   с макета, и держат её рамки. На внутренних страницах карточек намного
   больше, и такая подача превращает страницу в сплошное полотно.
   Поднимаем поверхности только внутри .era-content, главную не трогаем.
   ========================================================================== */

.era-content {
  --bg-surface:        #14181F;
  --bg-surface-hover:  #1A2029;
  --bg-elevated:       #1A2029;
  --bg-soft:           #171C24;
  --line:              #262C36;
  --line-strong:       #3A4250;
}

/* Светлая схема перебивает по специфичности (0,2,0) против (0,1,0) */
[data-theme='light'] .era-content {
  --bg-surface:        #FFFFFF;
  --bg-surface-hover:  #F0F3F7;
  --bg-elevated:       #EDF0F4;
  --bg-soft:           #F7F9FC;
  --line:              #D9DFE6;
  --line-strong:       #A5B0BD;
}

/* ==========================================================================
   Тарифы: максимум две карточки в ряд
   ========================================================================== */

@media (min-width: 700px)  { .plan-tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1440px) { .plan-tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Подсветка текущего раздела в левой колонке */
.side-link.is-current {
  background: var(--chip-bg);
  color: var(--text-primary);
  font-weight: var(--fw-medium);
}
.side-link.is-current span { color: var(--text-accent); }

/* ==========================================================================
   Правки по обратной связи
   ========================================================================== */

/* Консультации — до трёх карточек в ряд: состав там короче, чем у тарифов */
@media (min-width: 1100px) {
  .plan-tiers--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Левая колонка: растёт с шириной экрана, но не шире 400 */
@media (min-width: 1024px) {
  .era-catalog-layout { grid-template-columns: clamp(18rem, 22vw, 25rem) minmax(0, 1fr); }
}
@media (min-width: 1200px) {
  .dash-layout { grid-template-columns: clamp(18rem, 22vw, 25rem) minmax(0, 1fr); }
}

/* Блоки левой колонки остаются тёмными, как на главной. Подложки подняли
   ради основного контента — там карточек много и они сливались в полотно.
   В колонке блоков мало, и приглушённая подача читается спокойнее. */
.era-content .page-rail,
.era-content .dash-rail {
  --bg-surface:        #0C0E12;
  --bg-surface-hover:  #101319;
  --bg-elevated:       var(--c-black-2);
  --bg-soft:           #101318;
  --line:              #1D1F22;
  --line-strong:       var(--c-grey);
}
[data-theme='light'] .era-content .page-rail,
[data-theme='light'] .era-content .dash-rail {
  --bg-surface:        #FFFFFF;
  --bg-surface-hover:  #F0F3F7;
  --bg-elevated:       #EDF0F4;
  --bg-soft:           #F7F9FC;
  --line:              #D9DFE6;
  --line-strong:       #A5B0BD;
}

/* Плитка с истекающей подпиской: тёплая рамка и подложка, срок жирным.
   Красным не делаем — подписка не сломалась, её просто пора продлить. */
.dash-tile--warn {
  background: var(--bg-warm);
  border-color: var(--line-warm);
}
.dash-tile--warn .dash-tile__label { color: var(--text-accent); }
.dash-tile--warn .dash-tile__note b { color: var(--text-accent); font-weight: var(--fw-semi); }

/* ==========================================================================
   Фильтр в левой колонке (боевой, из news_filter)
   ========================================================================== */

.rail-filter { display: grid; gap: 0.75rem; margin: 0; }
.rail-field { display: grid; gap: 0.25rem; }
.rail-field > span { font-size: var(--fs-sm); color: var(--text-muted); }
.rail-filter input[type='date'] {
  min-height: 2.75rem;
  padding: 0.5rem 0.75rem;
  background: var(--bg-field);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--text-primary);
  font: inherit;
  width: 100%;
}
.rail-check {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.25rem;
  font-size: var(--fs-body);
  color: var(--text-secondary);
  cursor: pointer;
}
.rail-check input { flex: none; width: 1.125rem; height: 1.125rem; accent-color: var(--c-orange); }
.rail-check i { font-style: normal; color: var(--text-accent); }
.rail-subtitle {
  margin: 0.375rem 0 0;
  font-size: var(--fs-sm);
  color: var(--text-muted);
}
.rail-filter__actions { display: grid; gap: 0.5rem; margin-block-start: 0.25rem; }
.rail-filter__actions .btn { width: 100%; }
.rail-filter__actions .sf-reset { justify-self: center; }


/* ==========================================================================
   Страницы каталога
   Functions::get_pagination отдаёт бутстрапный <ul class="pagination">.
   Помощник общий, его трогать не стали — приводим вид снаружи.
   ========================================================================== */

.era-pagination { margin-block-start: clamp(1.5rem, 3vw, 2.5rem); }
.era-pagination ul.pagination {
  display: flex; flex-wrap: wrap; gap: 0.375rem;
  margin: 0; padding: 0; list-style: none;
}
.era-pagination li { min-width: 0; }
.era-pagination a,
.era-pagination span,
.era-pagination li > * {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.75rem; min-height: 2.75rem;
  padding-inline: 0.75rem;
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--text-primary);
  font-size: var(--fs-body);
  transition: border-color var(--t-base) var(--ease), color var(--t-base) var(--ease);
}
.era-pagination a:hover { border-color: var(--line-accent-hover); color: var(--text-accent); }
.era-pagination li.active > *,
.era-pagination [aria-current="page"] {
  border-color: transparent;
  background-image: var(--g-btn);
  color: #000;
}

/* Рубрика карточки — ссылка, а не просто плашка */
.pcard__label { transition: border-color var(--t-base) var(--ease); }
a.pcard__label:hover { border-color: var(--line-accent-hover); color: var(--text-accent); }


/* ==========================================================================
   Блок «поделиться» из Functions::create_social_buttons
   Он отдаёт <div class="social" align="center">, а .social в era.css —
   это круглая плашка соцсети с главной: aspect-ratio 1 и border-radius 50%.
   Отсюда исполинский круг под статьёй. Помощник общий, его не трогаем —
   разводим по тегу: на главной .social это <a>, здесь <div>.
   ========================================================================== */

.era-theme div.social {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  aspect-ratio: auto;
  width: auto;
  min-width: 0;
  padding: clamp(0.875rem, 1.5vw, 1.25rem);
  margin-block-start: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  text-align: start;
}
.era-theme div.social h3 {
  flex: 1 1 100%;
  margin: 0;
  font-size: var(--fs-body);
  font-weight: var(--fw-semi);
  letter-spacing: var(--ls-chip);
  text-transform: uppercase;
  color: var(--text-primary);
}
.era-theme div.social a { display: inline-flex; }
.era-theme div.social img,
.era-theme div.social svg { width: 2rem; height: 2rem; }

/* Обложка материала */
.article-cover { margin: 0 0 clamp(1rem, 2vw, 1.5rem); }
.article-cover img {
  width: 100%;
  max-height: 22rem;
  object-fit: contain;
  object-position: center;
  border-radius: var(--r-lg);
}


/* ==========================================================================
   Лайтбокс материала (модуль в era.js)
   ========================================================================== */

.article-body img.is-zoomable,
.article-cover img.is-zoomable { cursor: zoom-in; }

.lightbox {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal, 300);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(0.5rem, 2vw, 1.5rem);
  padding: clamp(1rem, 4vw, 3rem);
  background: rgb(0 0 0 / .88);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--t-base) var(--ease), visibility var(--t-base) var(--ease);
}
.lightbox.is-open { opacity: 1; visibility: visible; }
.is-lightbox-open { overflow: hidden; }

.lightbox__frame { grid-column: 2; margin: 0; display: grid; gap: 0.75rem; justify-items: center; }
.lightbox__frame img {
  max-width: 100%;
  max-height: 82vh;
  width: auto;
  height: auto;
  border-radius: var(--r-md);
}
.lightbox__cap { font-size: var(--fs-sm); color: var(--text-secondary); text-align: center; }

.lightbox__nav,
.lightbox__close {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  background: rgb(255 255 255 / .08);
  border: 1px solid rgb(255 255 255 / .18);
  border-radius: var(--r-pill);
  color: #fff;
  font-size: 1.5rem;
  line-height: 1;
  transition: background-color var(--t-base) var(--ease);
}
.lightbox__nav:hover,
.lightbox__close:hover { background: rgb(255 255 255 / .2); }
.lightbox__close { position: absolute; inset-block-start: 1rem; inset-inline-end: 1rem; }
.lightbox__nav[hidden] { display: none; }

@media (max-width: 47.99em) {
  .lightbox { grid-template-columns: 1fr; }
  .lightbox__frame { grid-column: 1; }
  .lightbox__nav--prev { position: absolute; inset-inline-start: 0.75rem; }
  .lightbox__nav--next { position: absolute; inset-inline-end: 0.75rem; }
}
@media (prefers-reduced-motion: reduce) { .lightbox { transition: none; } }


/* ==========================================================================
   Карточка каталога: подложка под вписанную обложку
   С object-fit: contain квадратный логотип оставляет по бокам пустоту.
   Подложка и небольшое поле превращают её в рамку, а не в дыру.
   ========================================================================== */

/* Белая подложка: обложки материалов почти всегда логотип на белом,
   с ней вписанная картинка сливается с полем, а не сидит в серой рамке. */
.pcard__media { background: #fff; }
.era-content .pcard__media img, .pcard__media img { padding: 0.5rem; }

.era-catalog-lead { margin: 0.5rem 0 0; color: var(--text-secondary); max-width: 72ch; }


/* ==========================================================================
   «О нас»
   Содержание из прототипа v7, компоненты наши: держать рядом вторую
   систему классов ради одной страницы дороже, чем собрать её из своих.
   ========================================================================== */

.about-note {
  padding: clamp(1rem, 1.8vw, 1.5rem);
  margin-block-end: clamp(2rem, 4vw, 3.5rem);
  background: var(--bg-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.about-note h2 { margin-block-end: 0.5rem; font-size: var(--fs-h4); }
.about-note p { margin: 0 0 0.625rem; color: var(--text-body); max-width: 72ch; }
.about-note p:last-child { margin-block-end: 0; }

.about-grid {
  display: grid;
  gap: clamp(0.875rem, 1.6vw, 1.25rem);
  grid-template-columns: 1fr;
}
@media (min-width: 40em) { .about-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 62em) { .about-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.about-card {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
  padding: clamp(1rem, 1.6vw, 1.375rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  transition: border-color var(--t-base) var(--ease);
}
a.about-card:hover { border-color: var(--line-accent-hover); }
.about-card h3 {
  margin: 0;
  font-size: var(--fs-h4);
  font-weight: var(--fw-semi);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
}
a.about-card:hover h3 { color: var(--text-accent); }
.about-card p { margin: 0; font-size: var(--fs-body); }

.about-avatar {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  background: var(--bg-elevated);
  border: 1px solid var(--line-accent);
  border-radius: 50%;
  font-weight: var(--fw-bold);
  color: var(--text-accent);
}

.about-steps { display: grid; gap: 0.625rem; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.about-step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 0.875rem;
  padding: clamp(0.875rem, 1.4vw, 1.125rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.about-step__num {
  font-size: var(--fs-sm);
  font-variant-numeric: tabular-nums;
  color: var(--text-info);
}
.about-step p { margin: 0; color: var(--text-body); }

.about-kpis {
  display: grid;
  gap: clamp(0.75rem, 1.4vw, 1rem);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 62em) { .about-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.about-kpi {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
  padding: clamp(0.875rem, 1.4vw, 1.125rem);
  background: var(--bg-warm);
  border: 1px solid var(--line-warm);
  border-radius: var(--r-md);
  transition: border-color var(--t-base) var(--ease);
}
.about-kpi:hover { border-color: var(--line-accent-hover); }
.about-kpi strong {
  font-size: var(--fs-h4);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  color: var(--text-accent);
}
.about-kpi span { font-size: var(--fs-sm); }


/* ==========================================================================
   Кабинет: колонка и обзор
   ========================================================================== */

.rail-balance {
  margin: 0 0 0.75rem;
  font-size: clamp(1.5rem, 1.2rem + 1vw, 1.875rem);
  font-weight: var(--fw-semi);
  line-height: 1;
  color: var(--text-accent);
}
.rail-balance span { font-size: 0.55em; color: var(--text-muted); font-weight: var(--fw-regular); }
.rail-block .btn { --btn-px: 1rem; white-space: normal; width: 100%; }

.dash-topup { display: grid; gap: 0.75rem; }
.dash-topup .btn { --btn-px: 1rem; white-space: normal; }

.era-table-wrap { overflow-x: auto; }
.era-table { width: 100%; border-collapse: collapse; min-width: 24rem; }
.era-table th, .era-table td {
  padding: 0.625rem 0.75rem;
  text-align: start;
  border-block-end: 1px solid var(--line);
  font-size: var(--fs-body);
}
.era-table thead th {
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  letter-spacing: var(--ls-chip);
  text-transform: uppercase;
  color: var(--text-muted);
}
.era-table tbody td { color: var(--text-body); }
.era-table tbody tr:last-child td { border-block-end: 0; }

/* Кабинет живёт в large_page, своей .era-content там нет — поля задаём тут */
.container--wide > .era-catalog-layout { padding-block: clamp(1.5rem, 3vw, 2.5rem); }

/* Обзор кабинета: рельса и основная колонка меняются местами на узком */
.dash-layout > .dash-rail { min-width: 0; }
@media (max-width: 61.99em) {
  .dash-layout { grid-template-columns: 1fr; }
  .dash-layout > .dash-rail { order: 2; }
}
.dash-card > .era-feed { margin: 0; }
.dash-sub__name a { color: inherit; }
.dash-sub__name a:hover { color: var(--text-accent); }


/* ==========================================================================
   Обзор кабинета в одну колонку и страница подписок
   ========================================================================== */

.dash-main--wide { grid-template-columns: 1fr; }
.dash-status--pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Внутренние списки карточек разворачиваем горизонтально: в одну колонку
   узкие строки выглядели обрывками таблицы. */
@media (min-width: 48em) {
  .dash-sections--row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dash-subs--row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.625rem 1.25rem; }
  .dash-feed--row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 75em) {
  .dash-sections--row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dash-subs--row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dash-feed--row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.dash-subs--row { display: grid; }
.dash-sub__price a { color: var(--text-accent); }
.dash-sub__price a[style] { color: var(--text-danger) !important; }

/* Полосы распределения капитала растут, когда блок появляется в кадре */
.dash-asset__bar i { width: 0; transition: width .9s var(--ease-reveal); }
.js .dash-assets.reveal .dash-asset__bar i { width: 0; }
.js .dash-assets.reveal.is-visible .dash-asset__bar i,
.no-js .dash-asset__bar i { width: var(--w, 0%); }
@media (prefers-reduced-motion: reduce) {
  .dash-asset__bar i { transition: none; }
}

.sub-list { display: grid; gap: 0.625rem; }
.sub-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.25rem;
  padding: clamp(0.875rem, 1.4vw, 1.125rem);
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.sub-row--on { border-color: var(--line-accent); }
.sub-row__main { min-width: 0; flex: 1 1 18rem; }
.sub-row__name { margin: 0 0 0.25rem; font-size: var(--fs-body); font-weight: var(--fw-semi); }
.sub-row__name a { color: inherit; }
.sub-row__name a:hover { color: var(--text-accent); }
.sub-row__meta { margin: 0; font-size: var(--fs-sm); color: var(--text-secondary); }
.sub-row__meta b { color: var(--text-primary); font-weight: var(--fw-medium); }
.sub-row__meta a { color: var(--text-accent); }
.sub-row__state {
  margin: 0;
  padding: 0.25rem 0.625rem;
  border: 1px solid var(--line);
  border-radius: var(--r-xs);
  font-size: var(--fs-sm);
  color: var(--text-muted);
  white-space: nowrap;
}
.sub-row--on .sub-row__state { border-color: var(--line-accent); color: var(--text-accent); }

.sub-notes { display: grid; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.sub-notes li {
  position: relative;
  padding-inline-start: 1.125rem;
  color: var(--text-body);
  font-size: var(--fs-body);
}
.sub-notes li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 0.6em;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--text-accent);
}

/* ==========================================================================
   Избранное
   ========================================================================== */

.fav-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.5rem;
  padding: 0.375rem 0.75rem;
  background: transparent;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--text-muted);
  font-size: var(--fs-sm);
  transition: color var(--t-base) var(--ease), border-color var(--t-base) var(--ease);
}
.fav-btn svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; }
.fav-btn:hover { border-color: var(--line-accent-hover); color: var(--text-accent); }
.fav-btn.is-on { border-color: var(--line-accent); color: var(--text-accent); }
.fav-btn.is-on svg { fill: currentColor; }
.fav-btn--icon { padding: 0.375rem; min-height: 2.25rem; }
.fav-btn--icon .fav-btn__text { display: none; }
.pcard__foot .fav-btn--icon { order: -1; }

.article-head .fav-btn { align-self: start; margin-block-start: 0.5rem; }
.dash-fav-link { width: 2.5rem; height: 2.5rem; }
.dash-card__count {
  display: inline-block;
  margin-inline-start: 0.5rem;
  padding: 0.125rem 0.5rem;
  background: var(--chip-bg);
  border-radius: var(--r-xs);
  font-size: var(--fs-sm);
  color: var(--text-accent);
  vertical-align: middle;
}


/* ==========================================================================
   Корзина
   ========================================================================== */

.basket-list { display: grid; gap: 0.625rem; }
.basket-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  align-items: center;
  gap: 0.75rem 1rem;
  padding: clamp(0.75rem, 1.4vw, 1rem);
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
@media (max-width: 40em) {
  .basket-row { grid-template-columns: minmax(0, 1fr) auto; }
  .basket-row__name { grid-column: 1 / -1; }
}
.basket-row__name { margin: 0; font-size: var(--fs-body); min-width: 0; }
.basket-row__price { margin: 0; font-weight: var(--fw-semi); white-space: nowrap; font-variant-numeric: tabular-nums; }
.basket-row__cnt { display: inline-flex; align-items: center; gap: 0.375rem; }
.basket-row__cnt .prod-count {
  width: 3.25rem; min-height: 2rem; padding: 0.25rem; text-align: center;
  font-variant-numeric: tabular-nums;
}
.basket-row__cnt .icon-btn { font-size: 1.125rem; line-height: 1; }
.basket-row__del {
  display: grid; place-items: center;
  width: 2rem; height: 2rem;
  border-radius: var(--r-sm);
  color: var(--text-muted);
  font-size: 1.25rem; line-height: 1;
}
.basket-row__del:hover { color: var(--text-danger); background: var(--bg-danger); }
.basket-total {
  display: flex; justify-content: flex-end; align-items: baseline; gap: 0.75rem;
  margin: 1.25rem 0 0;
  font-size: var(--fs-sm); letter-spacing: var(--ls-chip); text-transform: uppercase;
  color: var(--text-muted);
}
.basket-total span {
  font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem);
  font-weight: var(--fw-bold); letter-spacing: 0; text-transform: none;
  color: var(--text-primary);
}
.basket-fields { display: grid; gap: 1rem; }
@media (min-width: 40em) { .basket-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.basket-captcha { margin-block-start: 1rem; }

.pay-list { display: grid; gap: 0.625rem; }
.pay-list > div {
  display: flex; align-items: center; gap: 0.75rem;
  padding: clamp(0.75rem, 1.4vw, 1rem);
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.pay-list label { display: flex; align-items: center; gap: 0.75rem; flex: 1 1 auto; cursor: pointer; }
.pay-list img { max-height: 2rem; width: auto; }
.pay-list input[type="radio"] { width: 1.125rem; height: 1.125rem; accent-color: var(--c-orange); }

/* ==========================================================================
   Вход и регистрация
   ========================================================================== */

.auth-head { margin-block-end: clamp(1.5rem, 3vw, 2.5rem); }
.auth-head h1 { margin-block: 0.25rem 0; }
.auth-grid { display: grid; gap: clamp(1rem, 2vw, 1.5rem); align-items: start; }
@media (min-width: 62em) { .auth-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.auth-card {
  display: grid; gap: 0.875rem;
  padding: clamp(1.25rem, 2.2vw, 1.75rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.auth-card h2 { margin: 0 0 0.25rem; font-size: var(--fs-h4); letter-spacing: var(--ls-caps); text-transform: uppercase; }
.auth-card form { display: grid; gap: 0.875rem; }
.auth-req { color: var(--text-accent); }
.auth-links { margin: 0; font-size: var(--fs-sm); }
.auth-note {
  margin: 0 0 1rem; padding: 0.75rem 1rem;
  border: 1px solid var(--line); border-radius: var(--r-md); font-size: var(--fs-body);
}
.auth-note--ok  { background: var(--bg-success); border-color: var(--line-success); color: var(--text-success); }
.auth-note--bad { background: var(--bg-danger);  border-color: var(--line-danger);  color: var(--text-danger); }
.auth-sep { display: flex; align-items: center; gap: 0.75rem; margin: 0.25rem 0; color: var(--text-muted); font-size: var(--fs-sm); }
.auth-sep::before, .auth-sep::after { content: ""; flex: 1 1 0; height: 1px; background: var(--line); }
.auth-oauth { display: grid; gap: 0.625rem; justify-items: start; }
.auth-google {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.625rem;
  width: 12.5rem; min-height: 3.125rem;
  background: #fff; border: 1px solid #ccc; border-radius: var(--r-sm);
  color: #1f1f1f; font-size: var(--fs-sm);
}
.auth-google:hover { border-color: var(--c-orange); }
.auth-agree { display: grid; gap: 0.5rem; margin: 0; padding: 0; border: 0; }
.auth-agree label { display: flex; align-items: start; gap: 0.5rem; font-size: var(--fs-sm); color: var(--text-body); }
.auth-agree input { margin-block-start: 0.15rem; width: 1rem; height: 1rem; accent-color: var(--c-orange); }
.auth-agree a { color: var(--text-accent); }

/* ==========================================================================
   База знаний
   ========================================================================== */

.kb-grid { display: grid; gap: clamp(0.75rem, 1.4vw, 1rem); grid-template-columns: 1fr; }
@media (min-width: 48em) { .kb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 75em) { .kb-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.kb-card {
  display: flex; align-items: center; gap: 0.875rem; min-width: 0;
  padding: clamp(0.875rem, 1.4vw, 1.125rem);
  background: var(--bg-surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  transition: border-color var(--t-base) var(--ease);
}
.kb-card:hover { border-color: var(--line-accent-hover); }
.kb-card__play {
  position: relative; flex: none;
  width: 2.5rem; height: 2.5rem;
  background: var(--bg-elevated);
  border: 1px solid var(--line-accent);
  border-radius: 50%;
}
.kb-card__play::after {
  content: ""; position: absolute; inset-block-start: 50%; inset-inline-start: 56%;
  transform: translate(-50%, -50%);
  border-style: solid; border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent var(--c-orange);
}
.kb-card__body { display: grid; gap: 0.25rem; min-width: 0; }
.kb-card__title { font-size: var(--fs-body); color: var(--text-primary); }
.kb-card:hover .kb-card__title { color: var(--text-accent); }


/* ==========================================================================
   Узкие страницы: корзина, вход
   large_page и empty_page дают контейнер во всю ширину макета — для формы
   из двух полей это выглядит пустым полем с кнопкой посередине.
   ========================================================================== */

.page-narrow {
  width: min(100%, 60rem);
  margin-inline: auto;
  padding-block: clamp(1.5rem, 3vw, 2.5rem);
}

/* Опросник профиля риска: своя вёрстка, но в наших полях и без баннера
   во всю ширину экрана. */
.risk-page { width: min(100%, 68rem); margin-inline: auto; padding-block: clamp(1.5rem, 3vw, 2.5rem); }
.risk-page .hero { margin-inline: 0; border-radius: var(--r-lg); }
.risk-page .card,
.risk-page .loss-card,
.risk-page .profile-card { border-radius: var(--r-lg); }
.risk-page .auth-note { margin-block-end: 1rem; }
