/*
 * Roca Professionals, participant site and cabinet: design tokens.
 * Style "Roca printed matter in digital" (wave 6.1, decision of 19.10.2026): white sheet, black text and buttons, the Roca grey
 * #C6C6C4 only for lines and backing, a tight grotesque in headings, square corners, no colour accent. The description,
 * the tables and the list of what is not done: professionals/docs/ui-design-system.md.
 *
 * Font: Onest 400 and 500, SIL OFL 1.1 (licence next to the files: ../fonts/OFL-Onest.txt), from the package
 * @fontsource/onest 5.3.1 (npm, published 30.08.2026), subsets cyrillic-ext, cyrillic, latin-ext, latin, served by us:
 * the CSP of the site allows only 'self', and a CDN would see the visits of the participants. Onest stands in for the
 * Roca font Suisse Int'l until its licence and files arrive. Icons: Lucide 0.469.0 (ISC, icons/LICENSE) with a 1.5 px
 * stroke, used as masks. The Roca mark is img/roca.svg (checked against the file from the brand team, see the docs);
 * the Laufen mark is img/laufen.svg (the web SVG of the Laufen archive).
 * Component files never carry a raw colour, size or font: every value comes from here (a unit test checks the colours).
 */

@font-face{font-family:"Onest";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/onest-cyrillic-ext-400-normal.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"Onest";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/onest-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/onest-latin-ext-400-normal.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:"Onest";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/onest-latin-400-normal.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:"Onest";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/onest-cyrillic-ext-500-normal.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"Onest";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/onest-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/onest-latin-ext-500-normal.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:"Onest";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/onest-latin-500-normal.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{
  /* Шрифт: Onest, запасной Arial (казахские буквы есть и в нём), потом системный. Данные тоже Onest: цифры табличные (tabular-nums на body). */
  --rp-font:'Onest',Arial,system-ui,sans-serif;
  --rp-font-mono:var(--rp-font);

  /* Цвет: чёрный, белый и серый Roca */
  --rp-ink:#000000;
  --rp-ink-2:#333333;
  --rp-muted:#656563;
  --rp-paper:#FFFFFF;
  --rp-surface:#FFFFFF;
  --rp-stone:#F2F2F1;
  --rp-stone-strong:#E9E9E7;
  --rp-line:#DCDCDA;
  --rp-line-strong:#C6C6C4;
  --rp-line-quiet:#8C8C8A;
  --rp-accent:#000000;
  --rp-accent-hover:#262626;
  --rp-accent-pressed:#000000;
  --rp-success:#1F6B49; --rp-success-soft:#EDF3EF;
  --rp-warning:#7A5200; --rp-warning-soft:#F6F0E4;
  --rp-danger:#A02F1F; --rp-danger-pressed:#7F2418; --rp-danger-soft:#F7EAE7;
  --rp-neutral:#4D4D4B; --rp-neutral-soft:var(--rp-stone);
  --rp-status-success:#2E7D5B; --rp-status-warning:#B7791F; --rp-status-danger:#A93C2B; --rp-status-neutral:#757573;

  /* Действие: главная кнопка чёрная */
  --rp-action:var(--rp-ink);
  --rp-action-hover:#262626;
  --rp-action-pressed:#000000;
  --rp-on-accent:#FFFFFF;

  /* Совместимость с именами v1 */
  --rp-bg:var(--rp-paper);
  --rp-surface-sunken:var(--rp-stone);
  --rp-surface-strong:var(--rp-stone-strong);
  --rp-surface-inverse:var(--rp-ink);
  --rp-surface-inverse-raised:#1A1A1A;
  --rp-text:var(--rp-ink);
  --rp-text-secondary:var(--rp-ink-2);
  --rp-text-tertiary:var(--rp-muted);
  --rp-text-inverse:#FFFFFF;
  --rp-text-inverse-secondary:#D2D2D0;
  --rp-line-field:var(--rp-line-quiet);
  --rp-line-inverse:rgba(255,255,255,.24);
  --rp-line-on-media:rgba(255,255,255,.72);
  --rp-accent-soft:var(--rp-stone);
  --rp-accent-soft-strong:var(--rp-line);
  --rp-accent-on-inverse:#FFFFFF;
  --rp-disabled-bg:var(--rp-stone); --rp-disabled-text:#9A9A98;

  --rp-overlay:rgba(0,0,0,.42);
  --rp-veil:rgba(255,255,255,.94);
  --rp-scrim:linear-gradient(180deg,rgba(0,0,0,.38) 0%,rgba(0,0,0,0) 24%,rgba(0,0,0,0) 42%,rgba(0,0,0,.7) 100%);
  --rp-scrim-media:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.62) 100%);
  --rp-glint:rgba(255,255,255,.22);
  --rp-mask-solid:#000000;
  /* Волна загрузчика: рисунок с чёрной заливкой (в адресе данных # пишется как %23) */
  --rp-loader-wave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 20 Q25 8 50 20 T100 20 T150 20 T200 20 V40 H0Z' fill='%23000000'/%3E%3C/svg%3E");

  --rp-ph:#EAEAE8; --rp-ph-stripe:#E2E2E0; --rp-ph-text:#656563;
  --rp-ph-dark:#4A4A48; --rp-ph-dark-stripe:#545452; --rp-ph-dark-text:#E6E6E4;
  --rp-ph-fill:repeating-linear-gradient(135deg,var(--rp-ph) 0 14px,var(--rp-ph-stripe) 14px 15px);
  --rp-ph-fill-dark:repeating-linear-gradient(135deg,var(--rp-ph-dark) 0 16px,var(--rp-ph-dark-stripe) 16px 17px);
  --rp-skeleton:linear-gradient(90deg,var(--rp-stone) 0%,#F9F9F8 50%,var(--rp-stone) 100%);

  /* Шрифт: основной не меньше 16, вспомогательный не меньше 14. Шкала 14, 16, 20, 32, 44, 64 */
  --rp-fs-micro:14px; --rp-fs-caption:14px; --rp-fs-small:14px; --rp-fs-body:16px; --rp-fs-lead:16px;
  --rp-fs-h4:20px; --rp-fs-h3:20px; --rp-fs-h2:32px; --rp-fs-h1:44px; --rp-fs-number:48px;
  --rp-fs-display:64px; --rp-fs-display-xl:64px; --rp-fs-rubric:14px;
  /* Начертания: заголовки Regular, текст и выделения Medium. Полужирного нет (файла нет, гайд Roca его не называет) */
  --rp-fw-heading:400; --rp-fw-text:500; --rp-fw-strong:500;
  --rp-fw-regular:400; --rp-fw-medium:500;
  --rp-lh-tight:.98; --rp-lh-heading:1.04; --rp-lh-snug:1.3; --rp-lh-body:1.5;
  --rp-ls-display:-0.045em; --rp-ls-heading:-0.035em; --rp-ls-caps:0; --rp-ls-wordmark:0.08em;

  /* Отступы, сетка 4 px */
  --rp-sp-0-5:2px; --rp-sp-1:4px; --rp-sp-1-5:6px; --rp-sp-2:8px; --rp-sp-3:12px; --rp-sp-4:16px; --rp-sp-5:20px;
  --rp-sp-6:24px; --rp-sp-8:32px; --rp-sp-10:40px; --rp-sp-12:48px; --rp-sp-16:64px; --rp-sp-20:80px;
  --rp-sp-24:96px; --rp-sp-30:120px;

  /* Форма: прямые углы. Круг только у аватаров, точек статуса и тумблеров (--rp-r-round) */
  --rp-r-xs:0px; --rp-r-sm:0px; --rp-r-control:0px; --rp-r-md:0px; --rp-r-lg:0px; --rp-r-frame:0px; --rp-r-xl:0px;
  --rp-r-pill:0px; --rp-r-round:999px; --rp-r-icon-ios:22.37%; --rp-r-device:48px; --rp-r-device-screen:40px;

  /* Тени только у парящих слоёв (шторка, меню, панель вкладок); карточки держит линия */
  --rp-sh-1:0 0 0 1px var(--rp-line);
  --rp-sh-2:0 8px 28px rgba(0,0,0,.10),0 0 0 1px var(--rp-line);
  --rp-sh-3:0 -12px 40px rgba(0,0,0,.14);
  --rp-sh-4:0 12px 32px rgba(0,0,0,.22);
  --rp-sh-fab:none;
  --rp-sh-bar:0 -8px 24px rgba(0,0,0,.06);
  --rp-sh-device:0 40px 80px -30px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.08);
  /* Фокус: чёрное кольцо 2 px с белым зазором */
  --rp-focus:0 0 0 2px var(--rp-surface),0 0 0 4px var(--rp-accent);
  --rp-focus-danger:0 0 0 2px var(--rp-surface),0 0 0 4px var(--rp-danger);

  --rp-bw:1px; --rp-bw-strong:2px;
  --rp-tap:44px; --rp-btn-h:52px; --rp-btn-h-sm:44px; --rp-btn-h-admin:36px; --rp-field-h:56px; --rp-chip-h:32px;
  --rp-otp-w:48px; --rp-otp-h:56px; --rp-textarea-h:128px;
  --rp-icon-sm:20px; --rp-icon:24px; --rp-avatar-sm:32px; --rp-avatar:40px; --rp-avatar-lg:64px;
  --rp-topbar-h:56px; --rp-tabbar-item:52px; --rp-fab:48px; --rp-progress-h:4px; --rp-progress-h-thin:2px; --rp-dot:6px;
  --rp-thumb:56px; --rp-tile:104px; --rp-sheet-handle-w:36px; --rp-sheet-handle-h:4px;

  --rp-w-text:640px; --rp-w-content:1312px; --rp-w-desktop:1440px; --rp-w-admin:1160px; --rp-w-sidebar:264px;
  --rp-gutter-m:20px; --rp-gutter-d:48px;
  --rp-safe-top:env(safe-area-inset-top,0px); --rp-safe-bottom:env(safe-area-inset-bottom,0px);


  --rp-site-gutter:clamp(var(--rp-gutter-m),3.4cqi,var(--rp-gutter-d));
  --rp-site-section:clamp(var(--rp-sp-16),8cqi,var(--rp-sp-30));
  --rp-site-h1:clamp(var(--rp-fs-h1),5cqi,var(--rp-fs-display));
  --rp-site-h2:clamp(var(--rp-fs-h2),3cqi,var(--rp-fs-h1));
  --rp-site-lead:clamp(var(--rp-fs-body),1.4cqi,var(--rp-fs-h4));
  --rp-site-header-h:clamp(60px,5cqi,72px);
  --rp-site-hero-h:max(680px,56cqi);
  --rp-site-hero-pb:clamp(var(--rp-sp-10),6cqi,var(--rp-sp-24));
  --rp-level-min:296px; --rp-event-min:300px;
  --rp-map-h:200px; --rp-map-h-d:360px; --rp-qr:168px; --rp-checkbox:22px; --rp-index-w:400px; --rp-w-aside:400px;


  /* Движение: коротко и тихо */
  --rp-dur-fast:150ms; --rp-dur:200ms; --rp-dur-slow:250ms; --rp-dur-count:400ms; --rp-dur-spin:900ms; --rp-dur-shimmer:1800ms;
  --rp-ease:cubic-bezier(.22,1,.36,1);

  /* Логотипы: знаки как маски, цвет берётся из currentColor (только чёрный или белый) */
  --rp-logo:url(../img/roca.svg) center/contain no-repeat;
  --rp-logo-ar:2.319;
  --rp-logo-laufen:url(../img/laufen.svg) center/contain no-repeat;
  --rp-logo-laufen-ar:4.983;

  --rp-ic-house:url(../icons/house.svg) center/contain no-repeat;
  --rp-ic-grid:url(../icons/layout-grid.svg) center/contain no-repeat;
  --rp-ic-receipt:url(../icons/receipt.svg) center/contain no-repeat;
  --rp-ic-wrench:url(../icons/wrench.svg) center/contain no-repeat;
  --rp-ic-plus:url(../icons/plus.svg) center/contain no-repeat;
  --rp-ic-rating:url(../icons/list-ordered.svg) center/contain no-repeat;
  --rp-ic-more:url(../icons/ellipsis.svg) center/contain no-repeat;
  --rp-ic-back:url(../icons/arrow-left.svg) center/contain no-repeat;
  --rp-ic-arrow:url(../icons/arrow-right.svg) center/contain no-repeat;
  --rp-ic-down:url(../icons/chevron-down.svg) center/contain no-repeat;
  --rp-ic-right:url(../icons/chevron-right.svg) center/contain no-repeat;
  --rp-ic-search:url(../icons/search.svg) center/contain no-repeat;
  --rp-ic-calendar:url(../icons/calendar.svg) center/contain no-repeat;
  --rp-ic-camera:url(../icons/camera.svg) center/contain no-repeat;
  --rp-ic-x:url(../icons/x.svg) center/contain no-repeat;
  --rp-ic-check:url(../icons/check.svg) center/contain no-repeat;
  --rp-ic-retry:url(../icons/refresh-cw.svg) center/contain no-repeat;
  --rp-ic-offline:url(../icons/wifi-off.svg) center/contain no-repeat;
  --rp-ic-cloud-off:url(../icons/cloud-off.svg) center/contain no-repeat;
  --rp-ic-trash:url(../icons/trash-2.svg) center/contain no-repeat;
  --rp-ic-bell:url(../icons/bell.svg) center/contain no-repeat;
  --rp-ic-pin:url(../icons/map-pin.svg) center/contain no-repeat;
  --rp-ic-alert:url(../icons/circle-alert.svg) center/contain no-repeat;
  --rp-ic-award:url(../icons/award.svg) center/contain no-repeat;
  --rp-ic-gift:url(../icons/gift.svg) center/contain no-repeat;
  --rp-ic-file:url(../icons/file-text.svg) center/contain no-repeat;
  --rp-ic-download:url(../icons/download.svg) center/contain no-repeat;
  --rp-ic-user:url(../icons/user.svg) center/contain no-repeat;
  --rp-ic-globe:url(../icons/globe.svg) center/contain no-repeat;
  --rp-ic-share:url(../icons/share.svg) center/contain no-repeat;
  --rp-ic-square-plus:url(../icons/square-plus.svg) center/contain no-repeat;
  --rp-ic-more-v:url(../icons/ellipsis-vertical.svg) center/contain no-repeat;
  --rp-ic-menu:url(../icons/menu.svg) center/contain no-repeat;
  --rp-ic-lock:url(../icons/lock.svg) center/contain no-repeat;
  --rp-ic-send:url(../icons/send.svg) center/contain no-repeat;
  --rp-ic-message:url(../icons/message-circle.svg) center/contain no-repeat;
  --rp-ic-cal-plus:url(../icons/calendar-plus.svg) center/contain no-repeat;
  --rp-ic-external:url(../icons/external-link.svg) center/contain no-repeat;
  --rp-ic-users:url(../icons/users.svg) center/contain no-repeat;
  --rp-ic-clock:url(../icons/clock.svg) center/contain no-repeat;
  --rp-ic-phone:url(../icons/phone.svg) center/contain no-repeat;
  --rp-ic-image:url(../icons/image.svg) center/contain no-repeat;
}