/* Шрифты и сброс для веб-приложения RenderFox. Всё оформление – инлайном
   в самих страницах; здесь только то, что инлайном не выражается. */
@font-face{font-family:'Geist';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/geist-cyrillic.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Geist';font-style:normal;font-weight:100 900;font-display:block;
  src:url(fonts/geist-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Geist';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/geist-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/geistmono-cyrillic.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:100 900;font-display:block;
  src:url(fonts/geistmono-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(fonts/geistmono-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --rf-paper:#FCEBDE;
  --rf-ink:#311D1C;
  --rf-flame:#EA6029;
  --rf-surface:#FFF8F0;
  --rf-night:#231413;
  --rf-line:rgba(49,29,28,.18);
  --rf-line-strong:rgba(49,29,28,.34);
  --rf-shadow-sm:0 1px 2px rgba(49,29,28,.05),0 5px 14px rgba(49,29,28,.045);
  --rf-shadow-md:0 10px 28px rgba(49,29,28,.10);
  --rf-shadow-accent:0 8px 22px rgba(234,96,41,.22);
}
html{background:#FCEBDE;scroll-behavior:smooth;-webkit-text-size-adjust:100%;color-scheme:light}
body{margin:0;min-width:320px;background:#FCEBDE;color:#311D1C;font-family:"Geist","Geist Mono",system-ui,sans-serif;font-weight:420;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;text-wrap:pretty;overflow-x:hidden}

/* Переходов между документами средствами браузера здесь нет и быть не должно.
   На настоящем трекпаде они давали воспроизводимый застой ввода на несколько
   сотен миллисекунд уже ПОСЛЕ того, как новая страница появилась и начала
   прокручиваться; подробности и запрет — в AGENTS.md. Первый кадр держится
   правильным не снимком старого документа, а тем, что сервер отдаёт приватную
   страницу уже с данными. */
header{position:relative;z-index:80;backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important}
header:not([data-homeheader]){background:rgba(252,235,222,.92)!important;border-bottom-color:rgba(49,29,28,.13)!important}
[data-homeheader][data-on-paper]{background:rgba(252,235,222,.92)!important;border-bottom-color:rgba(49,29,28,.13)!important}

/* У межстраничного перехода нет честного процента: браузер загружает новый
   документ целиком, а API страницы может ответить независимо. Поэтому это
   тонкий неопределённый индикатор, а не выдуманная шкала 0–100. Он включается
   на исходящей странице по клику и ничего не блокирует: рисуется в ::before,
   не участвует в попадании указателя и не меняет высоту шапки. */
html[data-nav-loading] body::before{
  content:"";position:fixed;z-index:2147483647;top:0;left:0;width:100%;height:3px;
  transform:scaleX(.18);transform-origin:left center;pointer-events:none;
  background:linear-gradient(90deg,#C4441C 0%,#EA6029 58%,#FF9B71 100%);
  box-shadow:0 0 10px rgba(234,96,41,.62);
  animation:rf-nav-progress 8s cubic-bezier(.12,.72,.18,1) forwards;
}
/* Быстрый переход не должен выглядеть как загрузка, оборванная на 8%.
   Начало заметно сразу, за первые ~300 мс полоса проходит большую часть
   пути, а уход документа переводит её в честное завершённое состояние. */
@keyframes rf-nav-progress{0%{transform:scaleX(.18)}4%{transform:scaleX(.62)}14%{transform:scaleX(.76)}100%{transform:scaleX(.94)}}
html[data-nav-loading][data-nav-complete] body::before{animation:none;transform:scaleX(1)}
[data-headerwrap]{width:100%;max-width:1560px;margin:0 auto;padding-left:clamp(20px,3vw,46px);padding-right:clamp(20px,3vw,46px)}
[data-app]>main[data-wrap]{width:100%;min-width:0}
[data-app]:has(>footer){display:flex;min-height:100dvh;flex-direction:column}
[data-app]:has(>footer)>main{flex:1 0 auto}
[data-app]:has(>footer)>footer{margin-top:auto}
.rf-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
*,*::before,*::after{box-sizing:border-box}
a{color:#EA6029;text-decoration:none}
a:hover{color:#311D1C}
[data-homelink]>span>span{color:var(--rf-flame)!important}
::selection{background:#EA6029;color:#FCEBDE}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid rgba(234,96,41,.32);outline-offset:3px;border-radius:5px}

/* Полосы прокрутки внутренних панелей. Ползунок не должен наезжать на
   содержимое, поэтому там, где скроллится панель настроек, ей даётся
   scrollbar-gutter – место под полосу резервируется всегда. */
[data-scroll]{scrollbar-width:thin;scrollbar-color:rgba(49,29,28,.22) transparent}
[data-scroll]::-webkit-scrollbar{width:8px;height:8px}
[data-scroll]::-webkit-scrollbar-thumb{background:rgba(49,29,28,.2);border-radius:4px;border:2px solid transparent;background-clip:content-box}
[data-scroll]::-webkit-scrollbar-thumb:hover{background:rgba(49,29,28,.34);background-clip:content-box}
[data-scroll]::-webkit-scrollbar-track{background:transparent}
[data-gutter]{scrollbar-gutter:stable}

/* Общие ключевые кадры: используются на нескольких страницах. */
@keyframes rf-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes rf-load{0%{transform:translateX(-105%)}100%{transform:translateX(275%)}}
@keyframes rf-spin{to{transform:rotate(360deg)}}
/* Отказ действия: элемент вздрагивает. Страницы входа объявляют эти кадры у
   себя, здесь они нужны остальным – профилю в первую очередь. */
@keyframes rf-shake{0%,100%{transform:none}20%{transform:translateX(-6px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
@keyframes rf-pulse{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes rf-bar{0%{width:4%}100%{width:96%}}
@keyframes rf-dots{0%,100%{opacity:.25}50%{opacity:1}}
/* Стена превью: сдвиг ровно на половину удвоенного списка. Карточки внутри
   колонки разделены margin-bottom, а не gap, – тогда точка склейки совпадает
   с началом второй копии и цикл не «откатывается». */
@keyframes rf-wall{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,-50%,0)}}
[data-rise]{animation:rf-up .5s cubic-bezier(.22,.61,.36,1) both;overflow-anchor:none}
summary::-webkit-details-marker{display:none}
details summary{list-style:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

/* Изначально скрытые узлы. Инлайновый display:none рантайм вычищает, чтобы
   элементы оставались видимы в редакторе, поэтому скрытие живёт правилами:
   их инлайн не перебивает, а JS по-прежнему показывает узел, выставив
   display напрямую. */
[data-when],[data-usermenu],[data-modellist],[data-lb],[data-nav],[data-listview],[data-selmenu],[data-panel]{display:none}
[data-nav][data-open="1"]{display:flex!important}

/* Выпадающий список в нашем оформлении: системный <select> в этой типографике
   выглядит чужеродно, поэтому кнопка + меню. */
[data-seltrigger]{display:flex;align-items:center;gap:10px;width:100%;padding:11px 13px;border:1px solid rgba(49,29,28,.26);border-radius:12px;background:#FFF8F0;font-size:.9rem;font-weight:600;text-align:left;cursor:pointer;transition:border-color .16s ease}
[data-seltrigger]:hover{border-color:rgba(49,29,28,.5)}
[data-seltrigger][aria-expanded="true"]{border-color:#311D1C}
[data-seltrigger] [data-selvalue]{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
[data-seltrigger] [data-selchev]{flex:0 0 auto;color:#EA6029;font-size:.7rem;transition:transform .18s ease}
[data-seltrigger][aria-expanded="true"] [data-selchev]{transform:rotate(180deg)}
[data-selmenu]{position:absolute;z-index:70;left:0;right:0;flex-direction:column;gap:1px;max-height:min(52vh,320px);overflow-y:auto;padding:6px;border:1px solid #311D1C;border-radius:13px;background:#FFF8F0;box-shadow:0 14px 34px rgba(49,29,28,.2)}
[data-selopt]{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:9px 11px;border:0;border-radius:9px;background:transparent;font-size:.88rem;font-weight:560;text-align:left;cursor:pointer;color:#311D1C}
[data-selopt]:hover{background:rgba(49,29,28,.07)}
[data-selopt][data-on]{background:rgba(234,96,41,.16);font-weight:700}

/* Вкладки страниц баланса и профиля. */
[data-tab]{padding:9px 15px;border:1px solid transparent;border-radius:11px;background:transparent;font-size:.88rem;font-weight:620;color:#311D1C;cursor:pointer;white-space:nowrap;transition:background-color .16s ease}
[data-tab]:hover{background:rgba(49,29,28,.07)}
[data-tab][data-on]{background:#FFF8F0;border-color:rgba(49,29,28,.3);font-weight:730;box-shadow:0 1px 0 rgba(49,29,28,.08)}
[data-panel][data-panel]{flex-direction:column}

/* Узкая шапка: ниже 430px текстовая кнопка «Войти» скрывается – она есть
   в меню-бургере, а в строке остаётся только главное действие. */
@container (max-width:430px){[data-hidenarrow]{display:none!important}}

/* Современная глубина без комиксного «сдвинутого» контура. Эти правила
   намеренно не меняют фирменные цвета – только поведение поверхностей. */
button,a,input,textarea,select{transition-timing-function:cubic-bezier(.22,.61,.36,1)}
[data-field]{border-width:1px!important;box-shadow:var(--rf-shadow-sm)!important}
[data-field]:focus{border-color:#EA6029!important;box-shadow:0 0 0 3px rgba(234,96,41,.16)!important}
[data-prim],[data-run],[data-send],[data-go],[data-when="guest"][href="signup.html"]{
  border-width:1px!important;box-shadow:var(--rf-shadow-accent)!important;
}
/* Неактивная кнопка не подсвечивается и не отбрасывает тень действия. */
[data-run]:disabled{box-shadow:none!important}
[data-prim]:hover:not(:disabled),[data-run]:hover:not(:disabled),[data-send]:hover:not(:disabled),[data-go]:hover:not(:disabled),[data-when="guest"][href="signup.html"]:hover{
  background:#F37847!important;border-color:#F37847!important;box-shadow:0 11px 26px rgba(234,96,41,.25)!important;
}
[data-prim]:active:not(:disabled),[data-run]:active:not(:disabled),[data-send]:active:not(:disabled),[data-go]:active:not(:disabled),[data-when="guest"][href="signup.html"]:active{
  box-shadow:0 3px 10px rgba(234,96,41,.18)!important;
}
[data-soc]{border-width:1px!important;box-shadow:var(--rf-shadow-sm)!important}
[data-soc]:hover{transform:translateY(-1px)!important;box-shadow:var(--rf-shadow-md)!important}
[data-card],[data-tile]{box-shadow:0 1px 2px rgba(49,29,28,.035)}
[data-card]:hover,[data-tile]:hover{border-color:rgba(49,29,28,.36)!important;box-shadow:var(--rf-shadow-md)!important}
[data-usermenu],[data-selmenu]{border-color:var(--rf-line)!important;box-shadow:var(--rf-shadow-md)!important}
[data-usermenu]>a,[data-usermenu]>button[data-logout]{border-radius:9px!important;transition:background-color .15s ease,color .15s ease!important}
[data-usermenu]>a:hover{background:rgba(49,29,28,.075)!important;color:#311D1C!important}
[data-usermenu]>button[data-logout]:hover{background:rgba(196,68,28,.09)!important;color:#A63C1A!important}

/* Меню аккаунта живёт в top layer браузера. Так рабочие пространства со
   своим overflow и stacking context не могут нарисоваться поверх него. */
[data-usermenu][popover]{max-width:calc(100vw - 24px);margin:0}
[data-usermenu][popover]:popover-open{display:flex!important}

/* Анимация открытия/закрытия: меню раскрывается из кнопки
   (transform+opacity от верхней кромки), а элемент остаётся в
   top layer на время перехода: display/overlay через allow-discrete.
   Вход — @starting-style, выход — возврат в базовое состояние;
   выход короче входа. Только в браузерах с :popover-open:
   fallback-путь (display:none) не должен терять видимость.
   Reduced-motion обслуживает глобальное правило выше (*{
   transition:none!important}): меню показывается мгновенно, как
   остальные переходы сайта. */
@supports selector(:popover-open){
  [data-usermenu][popover]{opacity:0;transform:translateY(-6px) scale(.97);transform-origin:50% 0;transition-property:opacity,transform,display,overlay;transition-duration:.13s;transition-timing-function:ease;transition-behavior:allow-discrete}
  [data-usermenu][popover]:popover-open{opacity:1;transform:none;transition-duration:.2s;transition-timing-function:cubic-bezier(0.16,1,0.3,1),cubic-bezier(0.16,1,0.3,1),ease,ease}
  @starting-style{[data-usermenu][popover]:popover-open{opacity:0;transform:translateY(-6px) scale(.97)}}
}

/* Общая карточка аккаунта строится центральным скриптом поверх старой
   разметки всех страниц. Так имя и публичный ID имеют один вид во всём сайте,
   а сами страницы не расходятся при следующей правке шапки. */
[data-usermenu]{width:min(286px,calc(100vw - 24px))!important;padding:8px!important}
[data-menuaccount]{display:flex;flex-direction:column;gap:7px;margin:0 0 7px;padding:10px 10px 12px;border-bottom:1px solid rgba(49,29,28,.13)}
[data-menuaccountname]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.95rem;font-weight:770;letter-spacing:-.015em;color:#311D1C}
[data-menuidrow]{display:flex;align-items:center;gap:7px;min-width:0;color:rgba(49,29,28,.72);font:600 .72rem/1.35 'Geist Mono',monospace}
[data-menuidrow] span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
[data-menucopy]{display:grid;place-items:center;width:25px;height:25px;flex:0 0 auto;padding:0;border:0;border-radius:7px;background:transparent;color:rgba(49,29,28,.62);cursor:pointer}
[data-menucopy] svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.25}
[data-menucopy]:hover{background:rgba(49,29,28,.075);color:#311D1C}

/* Неподтверждённая почта — одно глобальное уведомление перед шапкой, а не
   ещё одна карточка внутри каждой страницы. Оно остаётся компактным и не
   забирает у продукта всю верхнюю часть экрана. */
[data-emailnotice]{position:relative;z-index:82;border-bottom:1px solid rgba(252,235,222,.16);background:#311D1C;color:#FCEBDE}
[data-emailnotice][hidden]{display:none!important}
/* Между всеми элементами один интервал: иконка, текст, перекладина,
   пояснение, кнопка и крестик. */
[data-emailnoticeinner]{display:flex;align-items:center;justify-content:center;gap:14px;max-width:1480px;min-height:34px;margin:0 auto;padding:4px clamp(14px,2.2vw,32px);box-sizing:border-box}
[data-emailnoticeicon]{display:grid;place-items:center;width:20px;height:20px;flex:0 0 auto;border-radius:6px;background:rgba(234,96,41,.2);color:#FF9B71}
[data-emailnoticeicon] svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
[data-emailnoticecopy]{margin:0;font-size:.76rem;line-height:1.35;color:#FFF8F0;font-weight:720;white-space:nowrap}
[data-emailnoticedivider]{width:1px;height:13px;flex:0 0 auto;background:rgba(252,235,222,.24)}
[data-emailnoticehint]{margin:0;font-size:.76rem;line-height:1.35;color:rgba(252,235,222,.62);white-space:nowrap}
[data-emailnoticeaction]{display:inline-flex;align-items:center;min-height:25px;padding:3px 9px;border:1px solid rgba(255,155,113,.5);border-radius:8px;color:#FF9B71;font-size:.72rem;font-weight:720;white-space:nowrap}
[data-emailnoticeaction]:hover{border-color:#EA6029;background:#EA6029;color:#311D1C}
[data-emailnoticedismiss]{display:grid;place-items:center;width:24px;height:24px;flex:0 0 auto;padding:0;border:0;border-radius:7px;background:transparent;color:rgba(252,235,222,.62);cursor:pointer}
[data-emailnoticedismiss]:hover{background:rgba(252,235,222,.1);color:#FFF8F0}
[data-emailnoticedismiss] svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}

@media(max-width:620px){
  /* Та же центрированная композиция, с переносом только основного текста. */
  [data-emailnoticeinner]{justify-content:center;gap:6px;min-height:44px;padding:4px 0}
  /* Уравновесить 32px невидимой части target справа от SVG крестика. */
  [data-emailnoticeinner]{padding-inline-start:calc(44px - 12px)}
  [data-emailnoticecopy]{min-width:0;flex:0 1 auto;white-space:normal;text-align:center;text-wrap:balance;font-size:.72rem;line-height:1.3;text-box:trim-both cap alphabetic}
  [data-emailnoticehint],[data-emailnoticedivider]{display:none}
  [data-emailnoticeicon]{display:grid}
  /* Рамка высотой 26px внутри полноценной области нажатия 44px. */
  [data-emailnoticeaction]{position:relative;isolation:isolate;display:inline-flex;justify-content:center;flex:0 0 auto;height:44px;min-height:44px;box-sizing:border-box;margin:0;padding:0 4px;border:0;background:transparent;font-size:.72rem}
  [data-emailnoticeaction]::before{content:"";position:absolute;z-index:-1;inset:9px 0;border:1px solid rgba(255,155,113,.5);border-radius:8px}
  [data-emailnoticeaction]:hover{background:transparent;color:#311D1C}
  [data-emailnoticeaction]:hover::before{border-color:#EA6029;background:#EA6029}
  [data-emailnoticedismiss]{width:44px;height:44px;margin:0}
  [data-emailnoticedismiss] svg{justify-self:start}
}

/* Профиль в шапке обозначается постоянной пиктограммой, а не меняющейся
   буквой почты. Оранжевая поверхность продолжает систему основных действий. */
[data-usertoggle]{background:#EA6029!important;border-color:#EA6029!important;color:#fff!important;box-shadow:0 5px 14px rgba(234,96,41,.2)}
/* Наведение — только там, где есть курсор: на сенсорном экране :hover
   остаётся после касания и выглядел как залипшее нажатие. */
@media (hover:hover){[data-usertoggle][data-usertoggle]:hover{background:#F37847!important;border-color:#F37847!important;box-shadow:0 11px 26px rgba(234,96,41,.25)!important}}
[data-usertoggle][data-usertoggle]:active{box-shadow:0 3px 10px rgba(234,96,41,.18)!important}
/* Кольцо фокуса — только клавиатурное; фокус после клика мышью кольца не даёт. */
[data-usertoggle]:focus:not(:focus-visible){outline:none}
[data-usertoggle] [data-initial]{display:block;width:18px;height:18px;font-size:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23fff' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='10' cy='6.5' r='3.1'/%3E%3Cpath d='M4.2 16.4c.6-3.2 2.5-4.8 5.8-4.8s5.2 1.6 5.8 4.8'/%3E%3C/svg%3E") center/18px 18px no-repeat}

/* Все интерактивные состояния шапки принадлежат общей оболочке, а не
   отдельной странице. Ghost-кнопки следуют Ember Hover Rule; тёмный вариант
   home-шапки переопределяет цвет текста и фон ниже. */
header [data-navtoggle]:hover,
header [data-headerwrap] a[href="/login"]:hover{border-color:#EA6029!important;background:rgba(49,29,28,.055)!important;color:#311D1C!important}
header [data-headerwrap] a[href="/signup"]:hover{background:#F37847!important;border-color:#F37847!important;color:#311D1C!important;box-shadow:0 11px 26px rgba(234,96,41,.25)!important}
header [data-headerwrap] a[title^="История"]:hover{background:rgba(49,29,28,.06)!important;color:#311D1C!important}
/* The guest login is a quiet outlined control in the paper header. */
header [data-headerwrap] a[href="/login"]{box-shadow:none!important;transform:none!important;translate:none!important;transition:background-color .15s ease-out,border-color .15s ease-out,color .15s ease-out}
:is(header:not([data-homeheader]),[data-homeheader][data-on-paper]) [data-headerwrap] a[href="/login"]:is(:hover,:focus-visible){border-color:#EA6029!important;background:rgba(49,29,28,.04)!important;color:#311D1C!important}

/* /home: тёмная шапка над hero, обычная оболочка над остальной страницей. */
[data-homeheader]{transition:background-color .18s ease-out,border-color .18s ease-out,color .18s ease-out}
[data-homeheader] :is([data-homelink],[data-navlink],[data-navtoggle],a[href="/login"]){transition:background-color .18s ease-out,border-color .18s ease-out,color .18s ease-out}
[data-homeheader]:not([data-on-paper]){background:#311D1C!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border-bottom-color:transparent!important;color:#FCEBDE}
[data-homeheader]:not([data-on-paper]) :is([data-homelink],[data-navlink]){color:#FCEBDE!important}
[data-homeheader]:not([data-on-paper]) [data-navlink]:hover{background:rgba(252,235,222,.08)!important;color:#FCEBDE!important}
[data-homeheader]:not([data-on-paper]) :is([data-navtoggle],[data-headerwrap] a[href="/login"]){border-color:rgba(252,235,222,.32)!important;color:#FCEBDE!important}
[data-homeheader]:not([data-on-paper]) :is([data-navtoggle],[data-headerwrap] a[href="/login"]):hover{background:rgba(252,235,222,.08)!important;border-color:#F37847!important;color:#FCEBDE!important}
[data-homeheader]:not([data-on-paper]) [data-navtoggle]>span{background:#FCEBDE!important;box-shadow:0 -5px 0 #FCEBDE,0 5px 0 #FCEBDE!important}
[data-homeheader]:not([data-on-paper]) [data-nav]{border-top-color:rgba(252,235,222,.16)!important}
[data-homeheader]:not([data-on-paper]) [data-when="auth"][data-show="flex"]{background:#311D1C!important;border-color:rgba(252,235,222,.32)!important}
[data-homeheader]:not([data-on-paper]) [data-headerwrap] a[href="/balance"]{color:#FCEBDE!important}
[data-homeheader]:not([data-on-paper]) [data-headerwrap] a[href="/balance"]:hover{background:rgba(252,235,222,.08)!important;color:#FCEBDE!important}

/* Нарисованный плюс центрируется геометрически и не зависит от метрик шрифта. */
a[aria-label="Пополнить баланс"]{position:relative;display:block!important;width:32px!important;min-width:32px;padding:0!important;font-size:0!important;line-height:0!important}
a[aria-label="Пополнить баланс"]::before{content:"";position:absolute;left:50%;top:50%;width:10px;height:10px;transform:translate(-50%,-50%);background:linear-gradient(currentColor,currentColor) center/10px 1.35px no-repeat,linear-gradient(currentColor,currentColor) center/1.35px 10px no-repeat}
a[aria-label="Пополнить баланс"]:hover{background:#EA6029!important;color:#311D1C!important}

/* Глобальный поиск моделей в авторизованной шапке. Каталог подгружается
   только при первом использовании; панель результатов живёт в top layer. */
html[data-session="auth"] [data-headerwrap]:has([data-globalmodelsearch])>div:last-child{margin-left:0!important}
[data-globalmodelsearch]{position:relative;align-items:center;width:clamp(176px,16vw,250px);min-width:0;margin-left:auto}
[data-globalmodelmobile]{display:none!important;align-items:center;gap:10px;padding:11px 12px;border-radius:11px;color:#311D1C;font-size:.94rem;font-weight:680}
[data-globalmodelmobile] svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
[data-globalmodelmobile] span:last-child{margin-left:auto;color:#A54120;transition:transform .17s ease}
[data-globalmodelmobile]:hover,[data-globalmodelmobile]:focus-visible{background:rgba(234,96,41,.1);color:#311D1C}
[data-globalmodelmobile]:hover span:last-child,[data-globalmodelmobile]:focus-visible span:last-child{transform:translateX(2px)}
[data-globalmodelform]{position:relative;display:flex;align-items:center;width:100%}
[data-globalmodelform]>svg{position:absolute;left:10px;width:15px;height:15px;fill:none;stroke:rgba(49,29,28,.52);stroke-width:1.7;stroke-linecap:round;pointer-events:none}
/* Поверхность контролов шапки — одна на группу баланса и поиск: Warm Surface
   без прозрачности и тот же контур. Полупрозрачный фон поиска смешивался с
   размытой шапкой и давал отдельный, «чужой» оттенок. */
:root{--rf-header-control-surface:#FFF8F0;--rf-header-control-line:rgba(49,29,28,.34);--rf-header-control-line-hover:rgba(49,29,28,.5)}
[data-globalmodelinput]{width:100%;height:34px;padding:7px 11px 7px 32px;border:1px solid var(--rf-header-control-line);border-radius:10px;background:var(--rf-header-control-surface);color:#311D1C;font-size:12px;outline:0;transition:border-color .15s ease,box-shadow .15s ease}
[data-globalmodelinput]::placeholder{color:rgba(49,29,28,.52)}
[data-globalmodelinput]:hover{border-color:var(--rf-header-control-line-hover)}
[data-globalmodelinput]:focus{border-color:#EA6029;background:var(--rf-header-control-surface);box-shadow:0 0 0 3px rgba(234,96,41,.12)}
[data-globalmodelinput]::-webkit-search-cancel-button{-webkit-appearance:none;width:16px;height:16px;margin:0;cursor:pointer;border-radius:5px;background:linear-gradient(45deg,transparent 45%,#A9431E 46% 54%,transparent 55%),linear-gradient(-45deg,transparent 45%,#A9431E 46% 54%,transparent 55%);opacity:.72}
[data-globalmodelinput]::-webkit-search-cancel-button:hover{background-color:rgba(234,96,41,.1);opacity:1}
[data-globalmodelresults]{display:none;inset:auto;margin:0;padding:7px;border:1px solid rgba(49,29,28,.2);border-radius:12px;background:#FFF8F0;color:#311D1C;box-shadow:0 18px 48px rgba(49,29,28,.2)}
[data-globalmodelresults][popover]:popover-open{display:block}
[data-globalmodelhead]{padding:6px 8px 7px;color:rgba(49,29,28,.48);font:690 9px/1.2 'Geist Mono',monospace;letter-spacing:.1em;text-transform:uppercase}
[data-globalmodelresult]{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:9px;min-height:48px;padding:7px 8px;border-radius:8px;color:#311D1C}
[data-globalmodelresult]:hover,[data-globalmodelresult]:focus-visible{background:rgba(234,96,41,.11);color:#311D1C;outline:none}
[data-globalmodelresult] img{width:26px;height:26px;object-fit:contain}
[data-globalmodelresult]>span:nth-child(2){display:flex;min-width:0;flex-direction:column;gap:2px}
[data-globalmodelresult] strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:750}
[data-globalmodelresult] small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(49,29,28,.5);font:560 9px/1.3 'Geist Mono',monospace}
[data-globalmodelresult]>span:last-child{color:#EA6029;font-size:13px;transition:transform .15s ease}
[data-globalmodelresult]:hover>span:last-child{transform:translateX(2px)}
[data-globalmodelall]{display:flex;align-items:center;justify-content:center;min-height:35px;margin-top:5px;border-top:1px solid rgba(49,29,28,.11);color:#A9431E;font-size:11px;font-weight:720}
[data-globalmodelall]:hover{color:#311D1C}
[data-globalmodelempty]{margin:4px 8px 8px;color:rgba(49,29,28,.58);font-size:11px;line-height:1.45}
@media(max-width:1120px){
  [data-globalmodelsearch][data-globalmodelsearch]{display:none!important}
  html[data-session="auth"] [data-nav][data-open="1"] [data-globalmodelmobile]{display:flex!important}
}

@media(prefers-reduced-motion:reduce){
  html[data-nav-loading] body::before{animation:none;transform:scaleX(.72)}
  html[data-nav-loading][data-nav-complete] body::before{transform:scaleX(1)}
  [data-rise]{animation:none!important}
}

/* Состояние сессии до ответа сервера неизвестно. Разметка несёт обе половины
   шапки – гостевую и для вошедшего, – и без этого правила обе видны сразу,
   а через мгновение одна исчезает. Человек успевает прочитать «Войти», уже
   будучи внутри.

   Укрытие снимает rf-app.js, проставляя на корне data-session. Правило
   действует только пока отметки нет, поэтому инлайновые стили, которыми
   потом распоряжается RF.paint, с ним не спорят. */
html:not([data-session]) [data-when] { display: none !important; }
/* Когда ответ известен, лишняя половина убирается тем же правилом, а не
   ожиданием запроса: сервер сообщает состояние отметкой в cookie, и верная
   половина видна с первого кадра. Без этого баланс и аватар пропадали и
   появлялись на каждом переходе между страницами. */
html[data-session="guest"] [data-when="auth"],
html[data-session="auth"] [data-when="guest"] { display: none !important; }

/* И показывается верная половина — тоже правилом, а не ожиданием ответа.
   Без этого укрытие снималось только из RF.paint, а тот показывает узлы,
   когда пришёл ответ `/api/auth/me`. Отметка о сессии стояла с первого кадра
   и убирала лишнюю половину, но нужная всё равно ждала сеть: баланс, кнопка
   пополнения и аватар появлялись через мгновение после того, как страница
   уже нарисована. Человек видит это как вспышку в шапке на каждом переходе.

   Способ отображения элемент несёт при себе (`data-show`), потому что он
   разный: строка баланса — flex, меню профиля — block, кнопки входа —
   inline-flex. Инлайновые стили, которые RF.paint выставит позже, этим
   правилам не противоречат: значение то же самое. */
html[data-session="auth"] [data-when="auth"][data-show="flex"],
html[data-session="guest"] [data-when="guest"][data-show="flex"] { display: flex; }
html[data-session="auth"] [data-when="auth"][data-show="block"],
html[data-session="guest"] [data-when="guest"][data-show="block"] { display: block; }
html[data-session="auth"] [data-when="auth"][data-show="inline-flex"],
html[data-session="guest"] [data-when="guest"][data-show="inline-flex"] { display: inline-flex; }

/* Место под баланс занято до того, как придёт само число: иначе шапка
   перестраивается, когда оно приходит. */
[data-bal] {
  display: inline-block;
  min-width: 0;
  font-family: 'Geist Mono', monospace;
  /* Цифры одинаковой ширины: значение не дёргает шапку, когда меняется. */
  font-variant-numeric: tabular-nums;
}

/* Шапка получает окончательную высоту сразу, а не дорастает до неё.
   Покадровая съёмка показывала 0 -> 51 -> 53 -> 55 точек: сначала страницы
   нет вовсе, потом появляется шапка без значений, и она подрастает, когда
   значения приходят. Человек видит это как «шапка была меньше и выросла».

   Место под содержимое отводится заранее, поэтому приход баланса и аватара
   ничего не сдвигает. */
/* Высота шапки задана и не зависит от содержимого. Покадровая съёмка
   показывала 0 -> 51 -> 53 -> 55 точек: страница собирается, подменяется
   шрифт, приходит баланс – и каждый раз шапка меняет высоту. Человек видит
   это как «шапка была меньше и выросла».

   Отведённое место не подменяет собой данные: значения по-прежнему приходят с
   сервера, меняется только то, что их появление ничего не двигает. */
header { min-height: 55px; box-sizing: border-box; }
header [data-headerwrap] { min-height: 39px; }
/* В исходной разметке у wrap по 9px вертикального padding. Border-box
   включает их в итоговые 54px, ещё 1px занимает нижняя линия header. */
header [data-headerwrap]{height:54px;min-height:54px;box-sizing:border-box}
[data-bal]::before { content: ""; display: inline-block; width: 0; height: 1em; }
[data-bal] + span { opacity: .68 !important; }
header [data-bal] + span { font-size: .72rem !important; }
header [data-homelink] > span > span { color: #EA6029 !important; }

/* Активный маршрут во всех вариантах шапки получает один и тот же спокойный
   тональный фон; дополнительного декоративного маркера ему не требуется. */
header [data-navlist] [data-navlink]{position:relative}
header [data-navlist] [data-navlink][aria-current="page"]{background:rgba(234,96,41,.14)!important;font-weight:730!important}
header [data-nav]>[data-navlink]{position:relative;padding:11px 12px!important;border-radius:11px!important;background:transparent!important;color:#311D1C;font-size:.94rem!important;font-weight:650!important}
header [data-nav]>[data-navlink][aria-current="page"]{background:rgba(234,96,41,.13)!important;font-weight:730!important}

/* Общая геометрия интерактивных элементов удерживает высоту шапки на 55px;
   увеличенные hit-area включаются только там, где нужен coarse pointer. */
header [data-homelink]{min-width:36px;min-height:36px;box-sizing:border-box;justify-content:center}
header :is([data-usertoggle],[data-navtoggle]){min-width:36px;min-height:36px;box-sizing:border-box}
header a[aria-label="Пополнить баланс"]{width:34px!important;min-width:34px!important;min-height:34px;box-sizing:border-box}
@media(pointer:coarse){
  header :is([data-homelink],[data-usertoggle],[data-navtoggle]){min-width:44px;min-height:44px}
  header a[aria-label="Пополнить баланс"]{width:44px!important;min-width:44px!important;min-height:44px}
  header a[href="/balance"],header a[href="/login"],header a[href="/signup"]{min-height:44px!important}
  [data-menucopy]{width:44px;height:44px;border-radius:9px}
  [data-emailnoticeaction]{min-height:44px}
  [data-emailnoticedismiss]{width:44px;height:44px}
  [data-sitefooter] a{min-height:44px!important;padding-block:10px!important}
  [data-selopt]{min-height:44px}
}
@media (max-width: 520px) {
  /* На узком экране четыре блока шапки должны помещаться без обрезания
     бургера. Меняется только внешний воздух, общая ширина и ритм остаются
     едиными для всех страниц. */
  [data-headerwrap] { padding-left: 12px; padding-right: 12px; }
}

/* На ширине 320–400 px четыре обязательных действия шапки не помещаются
   рядом с полным названием. Знак остаётся видимым, а название остаётся
   доступным скринридеру: мы освобождаем место, а не прячем действие. */
@media (max-width: 400px) {
  header [data-headerwrap] { gap: 7px !important; }
  header [data-homelink] { gap: 0 !important; }
  header [data-homelink] > span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
  header [data-headerwrap] > div:last-child { gap: 7px !important; min-width: 0; }
}

/* Единая страховка для всех существующих модалок. Их собственные размеры и
   оформление не меняются, но длинный шаг всегда остаётся внутри viewport. */
[role="dialog"][aria-modal="true"],
[role="alertdialog"][aria-modal="true"] {
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* Единый футер: правовые документы остаются в центре, а поддержка выглядит
   обычной ссылкой того же уровня, без отдельной декоративной кнопки. */
[data-sitefooter]{margin-top:auto;border-top:1px solid rgba(49,29,28,.16)}
[data-sitefooter]>[data-wrap]{display:grid;width:100%;max-width:1560px!important;margin:0 auto!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px 20px;padding-top:12px;padding-right:clamp(16px,3vw,46px)!important;padding-bottom:calc(12px + env(safe-area-inset-bottom));padding-left:clamp(16px,3vw,46px)!important;font-family:'Geist Mono',monospace;font-size:.72rem;color:rgba(49,29,28,.7)}
[data-footercopy]{justify-self:start;margin:0}
[data-footerlinks]{display:flex;flex-wrap:wrap;justify-content:center;gap:5px 16px}
[data-sitefooter] a{min-height:24px;padding:3px 0;color:rgba(49,29,28,.7);text-decoration:none;text-decoration-thickness:1px;text-underline-offset:4px}
[data-sitefooter] a:is(:hover,:focus-visible){color:#9B3B18;text-decoration:underline}
[data-footerlink]{display:inline-flex;align-items:center;gap:5px;justify-self:end}
[data-footerarrow]{display:block;width:9px;height:9px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;transform:rotate(45deg);transition:transform .16s ease}
[data-footerlink]:hover [data-footerarrow],[data-footerlink]:focus-visible [data-footerarrow]{transform:translateX(2px) rotate(45deg)}
@container (max-width:720px){
  [data-sitefooter]>[data-wrap]{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"copy support" "legal legal";gap:0 14px;padding-top:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom));font-size:.72rem;text-align:left}
  [data-footercopy]{grid-area:copy;justify-self:start}
  [data-footerlinks]{grid-area:legal;justify-self:start;justify-content:flex-start;gap:0 12px}
  [data-footerlink]{grid-area:support;justify-self:end}
}

/* Phone-only shell refinement: one reading order, evenly sized menu rows. */
@media(max-width:620px){
  [data-sitefooter]>[data-wrap]{grid-template-columns:minmax(0,1fr);grid-template-areas:"legal" "support" "copy";gap:0;padding-top:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
  [data-footerlinks]{width:100%;flex-direction:column;align-items:flex-start;gap:0;font-family:'Geist',system-ui,sans-serif;font-size:.75rem}
  [data-sitefooter] a{display:inline-flex;align-items:center;min-height:44px;padding-block:10px}
  [data-footerlink]{justify-self:start;font-family:'Geist',system-ui,sans-serif;font-size:.75rem}
  [data-footercopy]{margin-top:8px;font-size:.72rem}
  html[data-session="auth"] [data-nav][data-open="1"] [data-globalmodelmobile]{display:none!important}
  header [data-nav]>[data-navlink][data-when="guest"][href="/login"]{border:0!important;margin-top:0!important}
  [data-usermenu]>a,[data-usermenu]>button[data-logout]{display:flex;align-items:center;min-height:44px!important;height:44px;flex:0 0 auto;padding-block:0!important}
  [data-usermenu]>a[href="/balance"]{align-self:stretch}
  [data-menuaccount]{gap:2px;margin-bottom:4px;padding:6px 10px 8px}
  [data-menuidrow]{gap:6px}
  [data-menucopy]{position:relative;width:27px;height:27px;min-width:27px;min-height:27px;border-radius:7px}
  [data-menucopy]::before{content:"";position:absolute;inset:-8.5px}
}

/* Полноэкранный просмотр изображения результата (assets/viewers.js,
   RFViewers.openFull). Один на весь сайт: Студия, История, чат и Помощник на
   главной открывают картинку здесь, а скачивание — только отдельной кнопкой. */
[data-rv-full]{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:100%;max-width:none;margin:0;border:0;color:inherit;background:rgba(35,20,19,.9);padding:20px;overscroll-behavior:contain}
/* Общая страховка модалок (max-height: 100dvh - 32px) просмотру не нужна:
   он и есть весь экран, и иначе внизу оставалась полоса страницы. */
[data-rv-full][aria-modal]{max-height:none;overflow:hidden}
[data-rv-full][data-zoom][aria-modal]{overflow:auto}
[data-rv-full]::backdrop{background:transparent}
[data-rv-full][hidden],[data-rv-full]:not([open]):is(dialog){display:none}
html:has([data-rv-full][open]){overflow:hidden}
[data-rv-full] img{max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-in}
[data-rv-full][data-zoom]{overflow:auto;align-items:flex-start;justify-content:flex-start}
[data-rv-full][data-zoom] img{max-width:none;max-height:none;cursor:zoom-out}
[data-rv-close]{position:fixed;top:14px;right:16px;display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,248,240,.4);border-radius:12px;background:rgba(35,20,19,.6);color:#FFF8F0;font-size:1.25rem;line-height:1;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}
[data-rv-close]:hover{background:rgba(35,20,19,.85);border-color:rgba(255,248,240,.7)}
[data-rv-close]:focus-visible{outline:3px solid rgba(243,120,71,.7);outline-offset:2px}

/* Кнопки страниц (Phase 2.7.1). Одно семейство на сайт, без вариантов для
   отдельной страницы. Основная — рецепт «Сгенерировать» Студии: Ember-заливка
   и Ember-обводка, тёмные чернила текста (4.6:1), при наведении Bright Ember и
   основная тень, без движения (The Solid Ember Hover Rule). Спокойная — Raised
   Surface с обводкой чернил 18%, при наведении Ember-обводка и лёгкий тон.
   На тёмной поверхности (`.rf-on-dark`) основная без цветной тени, спокойная —
   прозрачная с обводкой бумаги. */
.rf-btn,.rf-btn-quiet{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 22px;border-radius:11px;font:inherit;font-size:.95rem;font-weight:760;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s ease-out,border-color .15s ease-out,box-shadow .15s ease-out,color .15s ease-out}
.rf-btn{border:1px solid #EA6029;background:#EA6029;color:#311D1C;box-shadow:0 5px 14px rgba(234,96,41,.2)}
.rf-btn:hover{border-color:#F37847;background:#F37847;color:#311D1C;box-shadow:0 11px 26px rgba(234,96,41,.25)}
.rf-btn:active{border-color:#F37847;background:#F37847;box-shadow:0 3px 10px rgba(234,96,41,.18)}
.rf-btn-quiet{border:1px solid rgba(49,29,28,.18);background:#FFFDF9;color:#311D1C;font-weight:700}
.rf-btn-quiet:hover{border-color:#EA6029;background:#FFFDF9 linear-gradient(rgba(49,29,28,.04),rgba(49,29,28,.04));color:#311D1C}
.rf-btn:focus-visible,.rf-btn-quiet:focus-visible{outline:3px solid rgba(234,96,41,.32);outline-offset:3px}
.rf-btn:disabled,.rf-btn[aria-disabled=true]{border-color:rgba(49,29,28,.12);background:rgba(49,29,28,.06);color:rgba(49,29,28,.42);box-shadow:none;cursor:default}
.rf-btn svg,.rf-btn-quiet svg{width:16px;height:16px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s ease-out}
@media(hover:hover){.rf-btn:hover svg{transform:translateX(2px)}}
.rf-on-dark .rf-btn,.rf-on-dark .rf-btn:hover,.rf-on-dark .rf-btn:active{box-shadow:none}
.rf-on-dark .rf-btn-quiet{border-color:rgba(252,235,222,.32);background:transparent;color:#FCEBDE}
.rf-on-dark .rf-btn-quiet:hover{border-color:#F37847;background:rgba(252,235,222,.06);color:#FCEBDE}
@media(prefers-reduced-motion:reduce){.rf-btn,.rf-btn-quiet,.rf-btn svg{transition:none}}

/* Local mobile/tablet acceptance: inputs keep their legible size on iOS;
   dialog steps scroll inside the visible viewport, including the keyboard. */
@media (max-width:1100px) and (pointer:coarse){
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),textarea,select{font-size:16px!important}
  [role=dialog][aria-modal=true],[role=alertdialog][aria-modal=true]{max-height:calc(var(--rf-viewport-height,100dvh) - 32px)}
  [data-rv-full]{padding:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom));height:var(--rf-viewport-height,100dvh)}
}
@media (max-width:1100px){
  [data-nav]{max-height:calc(var(--rf-viewport-height,100dvh) - 70px);overflow-y:auto;overscroll-behavior:contain}
}

@media(max-width:1079px){html[data-session="auth"] [data-headerwrap]:has([data-globalmodelsearch])>div:last-child{margin-left:auto!important}}
