/* ===================================================================== deshablon-panels.css - панели обменника: ОДИН ведущий приём вместо трёх. Подключается последним, поэтому правила ниже побеждают по каскаду. Дата 25.08.2026. ЧТО БЫЛО НАЙДЕНО ЗАМЕРОМ (живая страница, headless-Chrome, 1440x900). Каждая панель сайта держалась СРАЗУ НА ТРЁХ приёмах одновременно: .card / .svc / .guard / .qcard рамка 1px белого .09 + тень 18px + плёнка .03 .faq__item рамка 1px белого .09 + тень 18px + плёнка .03 .flow__item рамка 1px белого .17 + тень 24px + плёнка .055 .calc рамка 1px белого .14 + тень 22px + свой градиент .geo__map рамка 1px белого .10 + тень 60px + карта Три приёма разом и есть подпись генератора: ни один не ведёт, каждый работает вполсилы. Рамка .09 на тёмном полотне физически не видна (это 23 уровня яркости над фоном), плёнка .03 не читается как смена тона, а тень при этом кричит. Отсюда «квадратное»: панель опознаётся только по прямому углу, потому что край ей никто не нарисовал. ЧТО СДЕЛАНО. Ведущим назначен БЕЛЫЙ ХАЙРЛАЙН - ровно как в эталоне apolloproduction.studio (src/index.css, .al-card около строки 2770). Фактические значения эталона сняты и перенесены сюда как есть: --al-line rgba(255,255,255,0.24) -> --dp-line --al-inset rgba(255,255,255,0.12) -> --dp-rim --al-shadow 0 10px 30px -14px rgba(0,0,0,.72) -> --dp-seat --al-shadow-hover 0 18px 46px -16px rgba(0,0,0,.80) -> --dp-seat-hi --al-line-hover rgba(255,255,255,0.46) -> --dp-line-hi (взято .42) Два других приёма НЕ убраны, а переведены в подчинённые: тень получает вылет -14px, то есть поджимается внутрь и читается посадкой панели на полотно, а не вторым ореолом вокруг неё; подложка перестаёт быть равномерной плёнкой и становится направленной, гаснущей вправо в ноль, - это свет, а не граница. ПОЧЕМУ ИМЕННО .24, А НЕ ЯРЧЕ. Порог, по которому рамку засчитывают «определённым краем» в паре с широкой тенью, начинается с .28. Эталон стоит на .24 - под порогом. Значит канонная белая линия агентства остаётся видимой, а признак генератора не появляется. ГЕОМЕТРИЮ СОСЕДЕЙ НЕ ТРОГАЮ: скругления кнопок 14/16/18px, радиус панели помощника 20px, перелив pb-glint и свечение .aai-fab. Отступы не меняются нигде: все девять находок «тесный отступ» оказались ложными, замер приложен в отчёте. ===================================================================== */ :root { /* Единственный источник правды по панелям. Правишь тут - меняется везде. */ --dp-line: rgba(255, 255, 255, .24); /* ведущий приём: кант панели */ --dp-line-hi: rgba(255, 255, 255, .42); /* он же под курсором */ --dp-rim: rgba(255, 255, 255, .12); /* стеклянная кромка сверху */ --dp-rim-hi: rgba(255, 255, 255, .16); --dp-seat: 0 10px 30px -14px rgba(0, 0, 0, .72); --dp-seat-hi: 0 18px 46px -16px rgba(0, 0, 0, .80); /* Направленный свет вместо равномерной плёнки: слева плотнее, к правому краю гаснет в прозрачность. Средняя светлота близка к прежним .03, поэтому контраст текста не падает, а край панели справа становится чище - там просто полотно, без второй границы из подложки. */ --dp-wash: linear-gradient(90deg, rgba(255, 255, 255, .075) 0%, rgba(255, 255, 255, .038) 34%, rgba(255, 255, 255, .011) 72%, rgba(255, 255, 255, 0) 100%); --dp-wash-hi: linear-gradient(90deg, rgba(255, 255, 255, .115) 0%, rgba(255, 255, 255, .058) 34%, rgba(255, 255, 255, .018) 72%, rgba(255, 255, 255, 0) 100%); } /* --------------------------------------------------------------------- 1. Статичные карточки. Здесь тройная укладка была полной, поэтому правится и кант, и тень, и подложка. Фон задан сокращённой записью background намеренно: она обнуляет background-color, иначе прежняя плёнка .03 сложилась бы с новым градиентом и панель уехала бы в серость, от которой уходим. --------------------------------------------------------------------- */ .card, .svc, .guard, .qcard { border: 1px solid var(--dp-line); background: var(--dp-wash); box-shadow: inset 0 1px 0 var(--dp-rim), var(--dp-seat); /* Переход только по краске (цвет и тень) - ни размеров, ни положения, поэтому к закону о движении на transform/opacity это не относится. */ transition: border-color .2s ease, box-shadow .3s ease, background-image .3s ease; } /* Наведение обязано вести ту же линию. Без этой пары был бы провал: в покое кант стал .24, а прежний hover ставил --z3-line-hi = .165, то есть панель под курсором ТУСКНЕЛА бы. Проверено замером до правки. */ .card:hover, .svc:hover, .guard:hover, .qcard:hover, .card:focus-within, .svc:focus-within, .guard:focus-within, .qcard:focus-visible { border-color: var(--dp-line-hi); background: var(--dp-wash-hi); box-shadow: inset 0 1px 0 var(--dp-rim-hi), var(--dp-seat-hi); } /* --------------------------------------------------------------------- 2. Аккордеоны: шаги сделки и вопросы. Подъёма у них нет и не надо - они раскрываются, а не всплывают. Правится кант и посадка; подложку закрытого состояния тоже переводим на направленный свет, а РАСКРЫТОЕ состояние оставляем зоне-владельцу: .flow__item.is-open и details[open] помечают «этот открыт» своим фоном, и перебивать этот сигнал нельзя. Кант при этом держим единым в обоих состояниях - иначе открытая панель осталась бы с тусклой рамкой .17 среди закрытых с .24. --------------------------------------------------------------------- */ .flow__item, .faq__item { border: 1px solid var(--dp-line); box-shadow: inset 0 1px 0 var(--dp-rim), var(--dp-seat); transition: border-color .2s ease, box-shadow .3s ease; } .flow__item { background: var(--dp-wash); } .faq__item { background: var(--dp-wash); } /* Совпадение по весу селектора с правилами открытого состояния плюс более поздняя загрузка файла - кант выигрывает, фон остаётся их. */ .flow__item.is-open, .faq__item[open] { border-color: var(--dp-line); } .flow__item:hover, .faq__item:hover, .flow__item:focus-within, .faq__item:focus-within { border-color: var(--dp-line-hi); box-shadow: inset 0 1px 0 var(--dp-rim-hi), var(--dp-seat-hi); } /* --------------------------------------------------------------------- 3. Калькулятор и карта. У обеих панелей подложка содержательная: у калькулятора свой градиент, у карты сама карта. Трогать её нельзя, поэтому здесь снимается только двойственность «рамка плюс ореол»: кант выводится на ведущий уровень, тень остаётся поджатой. --------------------------------------------------------------------- */ .calc { border: 1px solid var(--dp-line); box-shadow: inset 0 1px 0 var(--dp-rim), var(--dp-seat); } .geo__map { /* У карты вылет тени уже -30px, она давно посадка, а не ореол. Не хватало только видимого края - его и добавляем. */ border: 1px solid var(--dp-line); } /* --------------------------------------------------------------------- 4. Закон о движении. Подъём карточек на -2/-3px живёт в чужой зоне и намеренно не переписан, но при запрете анимации он обязан исчезнуть. Краска (кант и тень) остаётся: это не движение, а состояние. --------------------------------------------------------------------- */ @media (prefers-reduced-motion: reduce) { .card, .svc, .guard, .qcard, .flow__item, .faq__item { transition: none; } .card:hover, .svc:hover, .guard:hover, .qcard:hover { transform: none; } }