/* Nakładki · the foundation of every page: the fonts, the base elements and the building blocks the screens share.
   The values are the prototype's ("Nakładki od nowa", Wersja A: Main.dc.html, the A_* artboards, System.dc.html);
   colours, radii and shadows are the tokens of nk-tokens.css, every var() with the prototype value as its fallback.
   The area files (site.css, panel.css, admin.css, wizard.css, editor.css, module.css, widget.css) build on these.

   Building blocks (the rule of each says where in the prototype it comes from):
   Fonts    Sofia Sans for everything (--nk-font on body), Hanken Grotesk for headings (--nk-font-display: h1 to h6,
            .h-*, .tile__title and the title classes each area file lists in one rule), Sofia Sans Extra Condensed for
            the display text of the pictures (--nk-post-display, renderer.js); figures that must line up or must not
            jump (stats, prices, tables, counters) are tabular (font-variant-numeric: tabular-nums)
   Page     .wrap (the 1160 px column with the side gutter clamp(16px, 4vw, 32px)), .wrap--app (1240 px: account,
            panel), .wrap--wide (1320 px: staff, the editor), .main (the page under the header), .main--app (account,
            panel, staff: 16 px text), .main--bleed (no column: full-width sections bring their own .wrap),
            .main--last (no footer under it), .section with --s and --l (the space above a block of a public page),
            .stack, .row (+ --between), .grid, .narrow
   Header   .top (Main.dc.html), .top--app (A_Uzytkownik, A_Panel), .top--admin (A_Admin): app/views/_header.php
   Footer   .site-foot--full (Main.dc.html), .site-foot--compact (A_Dla; + --app: A_Uzytkownik; + --minimal, logo and ©
            alone: A_Konto, A_Szukaj, A_AI): _footer.php
   Bars     .banner (the announcement bar of "Serwis"), .draft-bar (the staff note on a draft preview)
   Text     h1 to h6, p, a; .h-display, .h-page, .h-section, .h-card; .eyebrow, .lead, .muted, .soft, .meta, .small,
            .strong, .text-wrap
   Buttons  .btn (the dark pill, 48 px) with --ghost, --white, --outline, --light, --on-dark, --danger, --danger-ghost
            and the sizes --sm (looks 40 px, a 44 px target), --md (44), --lg (52), --xl (54), --block;
            .link (a button that reads as a link), .inline (a form inside a line of text)
   Forms    .field (label, .field__hint, .field__error), .input (+ --code; textarea.input), .check (+ --tall),
            .search (the pill with the button inside; --compact, --dark; .search__input, .search__btn (+ --icon),
            .search__icon)
   Chips    .chips (the row), .chip (Main: the grey pill) with --line (a filter: aria-pressed="true" or
            aria-current="page" fills it), --dashed, --on-dark
   Cards    .card (a panel, 20 px) with --sm (18 px), --tile (24 px), --hero (28 px), --soft (grey, no line), --dark;
            .tile (a card that is a link)
   Badges   .badge with --ok, --warn, --err, --dark, --soft
   Notices  .msg (+ --ok, --warn, --error, --dark: the toast of the prototype), .notice (+ --danger, --ok: a note the
            size of a card, with an action)
   Dark     .on-dark (text, links and the focus ring on an ink background)
   Other    .avatar (+ --lg), .icon, .scroll, .table, .plain, .steps, .secret, .codes, .skip, .vh, :focus-visible
   Errors   .error-card (A_Wylaczona: the centred card of every error page, with __mini, __title, __text, __actions,
            __note): app/views/errors/error.php
   Motion   the times --nk-motion-fast, --nk-motion, --nk-motion-slow, --nk-ease and --nk-rise (nk-tokens.css); .veil
            (the loading curtain: app/views/_veil.php and js/motion.js, which also blends the canvas pictures), the
            keyframes nk-in and nk-fade, an opened <details>, the hover and pressed states */

/* The fonts (SIL Open Font License, the *-OFL.txt beside each file in ../fonts), variable, hosted here. Two subsets
   each from Google Fonts: Latin, and Latin Extended for Polish letters. The version is in the file name, because fonts
   are cached for a year. The weight ranges are the ones the files cover.
   Sofia Sans (v20, 1–1000): the interface, the text, the text on the pictures (--nk-font, --nk-post-font) and the mails.
   Hanken Grotesk (v12, 100–900, no optical size axis): the headings (--nk-font-display), since 3.11.2026 in place of
   Bricolage Grotesque.
   Sofia Sans Extra Condensed (v6, 1–1000): the display text of the pictures (renderer.js, --nk-post-display), loaded
   by NkRender.ready() before a picture is drawn.
   Familjen Grotesk, the font of everything before 2.11.2026, stays in ../fonts for pages published by older releases
   and mails already sent; nothing here loads it. Bricolage Grotesque, the headings of 2.11.2026, is not shipped any
   more: a release copies the fonts into the doc root and never removes them there, so the pages published with it
   keep it until they are published again. */
@font-face {
  font-family: 'Sofia Sans';
  font-style: normal;
  font-weight: 1 1000;
  font-display: swap;
  src: url('../fonts/sofia-sans-v20-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Sofia Sans';
  font-style: normal;
  font-weight: 1 1000;
  font-display: swap;
  src: url('../fonts/sofia-sans-v20-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: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/hanken-grotesk-v12-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/hanken-grotesk-v12-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: 'Sofia Sans Extra Condensed';
  font-style: normal;
  font-weight: 1 1000;
  font-display: swap;
  src: url('../fonts/sofia-sans-extra-condensed-v6-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Sofia Sans Extra Condensed';
  font-style: normal;
  font-weight: 1 1000;
  font-display: swap;
  src: url('../fonts/sofia-sans-extra-condensed-v6-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;
}

/* Base: the root of every artboard (17 px, line 1.55, ink on the page background) and the links of its helmet. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
body {
  margin: 0;
  background: var(--nk-bg, #F7F6F2);
  color: var(--nk-ink, #0B1220);
  font-family: var(--nk-font, 'Sofia Sans', system-ui, sans-serif);
  font-size: 17px;
  line-height: 1.55;
}
a { color: var(--nk-ink, #0B1220); }
a:hover { color: var(--nk-link-hover, #1C5F99); }
/* Text in a coloured box keeps the box's colour for its links. */
.msg a, .notice a, .badge a, .banner a, .draft-bar a { color: inherit; }
/* A clearly visible ring for the keyboard (the prototype leaves it to the browser); white on ink (.on-dark, .top--admin). */
:focus-visible { outline: 3px solid var(--nk-link-hover, #1C5F99); outline-offset: 2px; }
img { border-style: none; }

/* Skip link: hidden until it gets the focus, then a dark pill in the corner. */
.skip { position: absolute; left: -9999px; top: 8px; z-index: 10; display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: var(--nk-r-pill, 999px); background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); font-weight: 600; text-decoration: none; }
.skip:focus { left: 8px; }
.skip:hover { color: var(--nk-on-ink, #FFFFFF); }
/* Text for screen readers only (for example the meaning of a count in a menu). */
.vh { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Page. The column of every artboard: max-width 1160 px plus the gutter on each side (content-box, like the
   prototype's inline boxes), so the text lines up with the logo at every width. */
.wrap { box-sizing: content-box; max-width: 1160px; margin-left: auto; margin-right: auto; padding-left: clamp(16px, 4vw, 32px); padding-right: clamp(16px, 4vw, 32px); }
.wrap--app { max-width: 1240px; }
.wrap--wide { max-width: 1320px; }
/* <main> of a public page (A_Konto, A_Szukaj): the footer's margin makes the space under it. */
.main { display: block; padding-top: clamp(32px, 5vw, 64px); }
/* Account, panel and staff (A_Uzytkownik, A_Panel, A_Admin): 16 px text, a tighter top and 64 px under the content. */
.main--app { padding-top: clamp(20px, 3vw, 32px); padding-bottom: 64px; font-size: 16px; }
/* A page of full-width sections (the home page): no column and no padding, each section brings its own .wrap. */
.main--bleed { padding-top: 0; }
/* A page without a footer (the wizard, A_Zaloz). */
.main--last { padding-bottom: 64px; }
/* The space above a block of a public page (Main.dc.html: the steps, "Popularne teraz"); --s the category tiles,
   --l the privacy line, the AI block and the dark block for organisations. */
.section { padding-top: clamp(80px, 11vw, 136px); }
.section--s { padding-top: clamp(72px, 10vw, 120px); }
.section--l { padding-top: clamp(88px, 12vw, 160px); }
.stack { display: flex; flex-direction: column; gap: 14px; }
.row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.row--between { justify-content: space-between; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.narrow { max-width: 520px; }
.plain { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.steps { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; }

/* Header, Main.dc.html: no background of its own, a line under it, the logo (38 px) on the left and the menu
   (16 px, 500) on the right; on a phone the menu wraps under the logo, as in the prototype (no menu button). */
.top { border-bottom: 1px solid var(--nk-line, #E3E0D9); }
.top__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; padding-top: 12px; padding-bottom: 12px; }
.top__brand { display: flex; align-items: center; gap: 14px; }
/* 44 px like the menu items beside it (house rule). */
.top__logo { display: inline-flex; align-items: center; min-height: 44px; }
.top__img { display: block; width: auto; height: 38px; }
.top__nav { display: flex; flex-wrap: wrap; align-items: center; gap: 0 22px; font-size: 16px; font-weight: 500; }
/* A menu item (a link, or the "Wyloguj" button of a form), 44 px high; the current one underlined (A_Szukaj). */
.top__link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0; border: 0; background: none; color: var(--nk-ink, #0B1220); font: inherit; text-decoration: none; cursor: pointer; }
.top__link:hover { color: var(--nk-link-hover, #1C5F99); }
.top__link[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; }
.top__link--muted { color: var(--nk-muted, #5D6372); }
/* "Wyloguj" of A_Uzytkownik and A_Panel: semibold and underlined. */
.top__link--strong { font-weight: 600; text-decoration: underline; }
/* The dark pill "Załóż stronę". */
.top__cta { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: var(--nk-r-pill, 999px); background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); font-weight: 600; text-decoration: none; }
.top__cta:hover { color: var(--nk-on-ink, #FFFFFF); }
.top__cta[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; }
/* The language switcher (Nk\Core\Lang): the other language of this page, a 44 px target. */
.top__lang { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 10px; border: 1px solid var(--nk-line-input, #7A7F8C); border-radius: var(--nk-r-pill, 999px); color: var(--nk-ink, #0B1220); font-size: 14px; font-weight: 700; letter-spacing: .04em; text-decoration: none; }
.top__lang:hover { color: var(--nk-link-hover, #1C5F99); }
.top__form { display: inline-flex; margin: 0; }
/* "Konto" of a signed-in person with the initial in a circle (A_AI). */
.top__avatar { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); font-size: 14px; font-weight: 700; line-height: 1; }
/* A static page's "Konto" waits hidden until motion.js shows it instead of the guest links. */
.top [hidden] { display: none; }
/* "Dla organizacji": a <details> whose summary is a menu item with a chevron; the five pages open in a white panel under
   it, over the page (motion.js closes it on Escape and on a click elsewhere). The current page is underlined, and so is
   the summary over it. On a phone the panel spans the header under the wrapped menu, wherever the summary ended up. */
.top__drop { position: relative; }
.top__drop > summary { list-style: none; }
.top__drop > summary::-webkit-details-marker { display: none; }
.top__drop > summary::after { content: ""; width: 7px; height: 7px; margin-top: -4px; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.top__drop[open] > summary::after { margin-top: 4px; transform: rotate(-135deg); }
.top__drop:has([aria-current="page"]) > summary { text-decoration: underline; text-underline-offset: 6px; }
.top__menu { position: absolute; z-index: 30; top: 100%; left: -18px; min-width: 230px; margin: 0; padding: 8px 0; border: 1px solid var(--nk-line, #E3E0D9); border-radius: var(--nk-r-card, 18px); background: var(--nk-surface, #FFFFFF); box-shadow: var(--nk-shadow-card, 0 1px 2px rgba(11, 18, 32, 0.08), 0 14px 30px rgba(11, 18, 32, 0.14)); list-style: none; }
.top__item { display: flex; align-items: center; min-height: 44px; padding: 0 18px; color: var(--nk-ink, #0B1220); text-decoration: none; }
.top__item:hover { background: var(--nk-surface-2, #EFEDE7); color: var(--nk-ink, #0B1220); }
.top__item[aria-current="page"] { font-weight: 700; text-decoration: underline; text-underline-offset: 6px; }
@media (max-width: 640px) {
  .top__in { position: relative; }
  .top__drop { position: static; }
  .top__menu { left: clamp(16px, 4vw, 32px); right: clamp(16px, 4vw, 32px); min-width: 0; }
}
/* The line next to the logo of the wizard (A_Zaloz): "Masz już stronę? Zaloguj się". */
.top__note { font-size: 15px; color: var(--nk-muted, #5D6372); }
.top__note a { font-weight: 600; }
/* Account and panel (A_Uzytkownik, A_Panel): a white bar, the logo at 34 px with the name of the place beside it,
   15 px links on the right. */
.top--app { background: var(--nk-surface, #FFFFFF); }
.top--app .top__in { padding-top: 10px; padding-bottom: 10px; }
.top--app .top__img { height: 34px; }
.top__ctx { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; font-weight: 600; color: var(--nk-muted, #5D6372); text-decoration: none; }
.top__nav--app { gap: 0 20px; font-size: 15px; font-weight: 400; }
.top__nav--panel { gap: 4px 18px; }
/* The person's address in the panel: a long one breaks on a phone instead of widening the page. */
.top__nav--panel .top__link--muted { min-width: 0; overflow-wrap: anywhere; }
/* Staff (A_Admin): an ink bar, the white logo at 32 px, the role, the search and the links on the right. */
.top--admin { border-bottom: 0; background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); }
.top--admin .top__in { gap: 10px 24px; padding-top: 10px; padding-bottom: 10px; }
.top--admin .top__brand { flex-wrap: wrap; gap: 8px 14px; }
.top--admin .top__img { height: 32px; }
.top__role { font-weight: 600; color: var(--nk-dark-muted, #B4BAC6); }
.top__nav--admin { gap: 0 18px; font-size: 15px; font-weight: 400; }
.top--admin .top__link { color: var(--nk-on-ink, #FFFFFF); text-decoration: underline; }
.top--admin .top__link--muted { color: var(--nk-dark-muted, #B4BAC6); }
.top--admin .top__link:hover { color: var(--nk-on-ink, #FFFFFF); }
.top--admin .search { flex: 1 1 280px; max-width: 440px; }
.top--admin :focus-visible { outline-color: var(--nk-on-ink, #FFFFFF); }
@media (forced-colors: active) {
  .top__link[aria-current="page"], .top__cta[aria-current="page"] { outline: 2px solid Highlight; outline-offset: 2px; }
}

/* Footer. --full is Main.dc.html: the logo with a line about the photos, three groups of links (15 px, muted,
   underlined) and the copyright under a thin line. --compact is A_Dla and A_Szukaj (--app: A_Uzytkownik, slimmer and
   without the copyright): the logo, Regulamin, Prywatność, Kontakt and the copyright in one row. Links are 44 px high (house rule; the
   prototype's groups have 40). */
.site-foot { border-top: 1px solid var(--nk-line, #E3E0D9); }
.site-foot--full { margin-top: clamp(72px, 10vw, 120px); }
.site-foot__in { display: flex; flex-wrap: wrap; gap: 32px 48px; padding-top: 40px; padding-bottom: 28px; }
.site-foot__brand { flex: 2 1 260px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.site-foot__logo { display: block; width: auto; height: 34px; align-self: flex-start; }
.site-foot__about { max-width: 300px; font-size: 15px; color: var(--nk-muted, #5D6372); }
.site-foot__group { flex: 1 1 160px; min-width: 0; display: flex; flex-direction: column; font-size: 15px; }
.site-foot__title { margin: 0 0 6px; font-weight: 600; }
.site-foot__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; }
.site-foot__item { margin: 0; }
.site-foot__list a { display: inline-flex; align-items: center; min-height: 44px; color: var(--nk-muted, #5D6372); }
.site-foot__list a:hover, .site-foot__nav a:hover { color: var(--nk-link-hover, #1C5F99); }
.site-foot__bottom { padding-top: 18px; padding-bottom: 28px; border-top: 1px solid var(--nk-line-soft, #EFEDE7); font-size: 14px; color: var(--nk-muted, #5D6372); }
.site-foot__copy { white-space: nowrap; }
.site-foot--compact { margin-top: clamp(56px, 8vw, 96px); }
.site-foot__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px; padding-top: 28px; padding-bottom: 28px; font-size: 15px; color: var(--nk-muted, #5D6372); }
.site-foot__row .site-foot__logo { height: 32px; align-self: center; }
.site-foot__nav { display: flex; flex-wrap: wrap; gap: 0 20px; }
.site-foot__nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--nk-muted, #5D6372); }
/* The logo and the copyright alone (A_Konto, A_Szukaj, A_AI): the same row, at the distance of those artboards. */
.site-foot--minimal { margin-top: clamp(56px, 8vw, 96px); }
/* Account (A_Uzytkownik): right under the content, a slimmer row, the logo at 30 px. */
.site-foot--app { margin-top: 0; }
.site-foot--app .site-foot__row { padding-top: 24px; padding-bottom: 24px; }
.site-foot--app .site-foot__logo { height: 30px; }

/* Bars above the header. The announcement of "Serwis" in the colours of the prototype's notes (warn); the staff note
   of a draft preview like the prototype's own bar on top of its screens (grey, a dashed line). */
.banner { background: var(--nk-warn-bg, #FBF0D9); color: var(--nk-warn, #5C3B00); }
.banner__in { display: flex; align-items: flex-start; gap: 10px; padding-top: 12px; padding-bottom: 12px; font-size: 15px; font-weight: 600; }
.banner__icon { flex: 0 0 auto; margin-top: 3px; }
.draft-bar { border-bottom: 1px dashed var(--nk-line-dashed, #B9B3A6); background: var(--nk-surface-2, #EFEDE7); color: var(--nk-ink-2, #3A4050); }
.draft-bar__in { padding-top: 10px; padding-bottom: 10px; font-size: 14px; font-weight: 600; }

/* Text. Headings are semibold with no margin; h1 is the title of a content page (A_Uzytkownik), h2 the title of a
   card (A_Admin, A_Uzytkownik). The classes give the other sizes of the prototype to any element. Every heading and
   title class is set in the display face, Hanken Grotesk; an area file names its own title classes in one rule like
   this one. */
h1, h2, h3, h4, h5, h6, .h-display, .h-page, .h-section, .h-card, .tile__title { font-family: var(--nk-font-display, 'Hanken Grotesk', 'Sofia Sans', system-ui, sans-serif); }
h1 { margin: 0; font-size: clamp(30px, 4vw, 44px); font-weight: 600; line-height: 1.08; letter-spacing: -0.025em; }
h2 { margin: 0; font-size: 20px; font-weight: 600; }
h3 { margin: 0; font-size: 18px; font-weight: 600; }
p { margin: 0; }
/* The hero of the home page. */
.h-display { font-size: clamp(42px, 6.2vw, 80px); font-weight: 600; line-height: 1; letter-spacing: -0.03em; }
/* The title of a public page (A_Szukaj, A_AI). */
.h-page { font-size: clamp(36px, 5vw, 60px); font-weight: 600; line-height: 1.04; letter-spacing: -0.03em; }
/* The title of a section of a public page (Main, A_Dla). */
.h-section { font-size: clamp(30px, 4.2vw, 50px); font-weight: 600; line-height: 1.06; letter-spacing: -0.025em; }
/* The title of a card, a step or a result. */
.h-card { font-size: 20px; font-weight: 600; }
.eyebrow { font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--nk-muted, #5D6372); }
.on-dark .eyebrow { color: var(--nk-dark-muted, #B4BAC6); }
.lead { max-width: 520px; font-size: clamp(17px, 2vw, 20px); color: var(--nk-muted, #5D6372); }
.muted { color: var(--nk-muted, #5D6372); }
.soft { color: var(--nk-ink-2, #3A4050); }
.meta { font-size: 15px; color: var(--nk-muted, #5D6372); }
.small { font-size: 14px; }
.strong { font-weight: 600; }
/* People's own text (a report, an appeal, a statement) breaks a long unbroken string instead of scrolling the page sideways. */
.text-wrap { overflow-wrap: anywhere; }

/* Buttons. The dark pill of the prototype: 48 px, 600, ink; a link or a button. */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 0 22px;
  border: 0;
  border-radius: var(--nk-r-pill, 999px);
  background: var(--nk-ink, #0B1220);
  color: var(--nk-on-ink, #FFFFFF);
  font: inherit;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.btn:hover { color: var(--nk-on-ink, #FFFFFF); }
/* Transparent with a light line (A_Szukaj "Załóż stronę", A_Admin). */
.btn--ghost { border: 1px solid var(--nk-line-strong, #D6D2C9); background: transparent; color: var(--nk-ink, #0B1220); }
.btn--ghost:hover { color: var(--nk-ink, #0B1220); border-color: var(--nk-ink, #0B1220); }
/* White with a light line, for a grey background (A_Admin, A_Uzytkownik). */
.btn--white { border: 1px solid var(--nk-line-strong, #D6D2C9); background: var(--nk-surface, #FFFFFF); color: var(--nk-ink, #0B1220); }
.btn--white:hover { color: var(--nk-ink, #0B1220); border-color: var(--nk-ink, #0B1220); }
/* Transparent with an ink line (A_AI, A_Admin). */
.btn--outline { border: 1px solid var(--nk-ink, #0B1220); background: transparent; color: var(--nk-ink, #0B1220); }
.btn--outline:hover { color: var(--nk-ink, #0B1220); }
/* On an ink block: the white pill and the one with a dark line (Main, "Dla organizacji"). */
.btn--light { background: var(--nk-surface, #FFFFFF); color: var(--nk-ink, #0B1220); }
.btn--light:hover { color: var(--nk-ink, #0B1220); }
.btn--on-dark { border: 1px solid var(--nk-dark-line, #3A4252); background: transparent; color: var(--nk-on-ink, #FFFFFF); }
.btn--on-dark:hover { color: var(--nk-on-ink, #FFFFFF); border-color: var(--nk-on-ink, #FFFFFF); }
.btn--danger { background: var(--nk-danger, #A3262A); }
.btn--danger:hover { background: var(--nk-danger-ink, #6B1A1D); }
.btn--danger-ghost { border: 1px solid var(--nk-danger, #A3262A); background: transparent; color: var(--nk-danger, #A3262A); }
.btn--danger-ghost:hover { color: var(--nk-danger-ink, #6B1A1D); border-color: var(--nk-danger-ink, #6B1A1D); }
/* Sizes: --sm looks 40 px like the prototype's buttons in lists, and a band above and below keeps the target 44 px. */
.btn--sm { position: relative; min-height: 40px; padding: 0 14px; font-size: 14px; }
.btn--sm::after { content: ''; position: absolute; top: -3px; right: 0; bottom: -3px; left: 0; }
.btn--md { min-height: 44px; padding: 0 18px; }
.btn--lg { min-height: 52px; padding: 0 24px; }
.btn--xl { min-height: 54px; padding: 0 26px; font-size: 16px; }
.btn--block { display: flex; width: 100%; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: 0.45; cursor: not-allowed; }
/* A button that reads as a link (A_Konto "Wyślij ponownie", A_Admin "Cofnij"). */
.link { padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: inherit; text-decoration: underline; cursor: pointer; }
.link:hover { color: var(--nk-link-hover, #1C5F99); }
.inline { display: inline; margin: 0; }

/* Forms (A_Konto, A_Zaloz; staff and panel pages with .main--app): the label above the field, errors under it. */
.field { display: flex; flex-direction: column; gap: 8px; }
.field label { font-weight: 600; }
.main--app .field label { font-size: 15px; }
.field__hint { font-size: 14px; color: var(--nk-muted, #5D6372); }
.field__error { font-size: 14px; font-weight: 600; color: var(--nk-danger, #A3262A); }
/* A group of fields (radios, checkboxes) under one question: no browser frame, the legend like a label. */
fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
legend { padding: 0; font-weight: 600; }
.main--app legend { font-size: 15px; }
/* A text field: 52 px with a 14 px radius on public pages (A_Konto), 46 px with a 12 px radius in the account, the
   panel and the staff pages (A_Uzytkownik, A_Admin). The edge is --nk-line-input (3:1, WCAG 1.4.11); the prototype
   draws it in --nk-line-strong. */
.input {
  width: 100%;
  min-height: 52px;
  padding: 0 18px;
  border: 1px solid var(--nk-line-input, #7A7F8C);
  border-radius: var(--nk-r-field, 14px);
  background: var(--nk-surface, #FFFFFF);
  color: var(--nk-ink, #0B1220);
  font: inherit;
  font-size: 16px;
}
.main--app .input { min-height: 46px; padding: 0 14px; border-radius: var(--nk-r-control, 12px); }
textarea.input, .main--app textarea.input { min-height: 96px; padding: 12px 14px; resize: vertical; }
select.input { padding-right: 12px; }
.input[aria-invalid="true"] { border-color: var(--nk-danger, #A3262A); }
/* The code from the mail (A_Konto): 60 px, large and spaced digits. */
.input--code, .main--app .input--code { min-height: 60px; padding: 0 18px; font-size: 28px; letter-spacing: 0.4em; font-variant-numeric: tabular-nums; }
/* A checkbox with its sentence (A_Konto, A_Zaloz). */
.check { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; color: var(--nk-ink-2, #3A4050); }
.check input { flex: 0 0 auto; width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--nk-ink, #0B1220); }
/* A choice of a public form (the report form) as a 44 px row, like .pnl-choice in the panel and .check in the staff pages. */
.check--tall { min-height: 44px; align-items: center; }
.check--tall input { margin: 0; }

/* The search pill (Main hero): a white pill with the dark button inside. --compact is the studio's (a grey field with
   a round button and an icon), .search__icon the magnifier at the start of A_Szukaj's field, --dark the staff
   search in the ink header. The field inside has no frame; the pill shows the focus ring instead. */
.search { position: relative; display: flex; align-items: center; gap: 6px; width: 100%; max-width: 540px; padding: 6px; border: 1px solid var(--nk-line-input, #7A7F8C); border-radius: var(--nk-r-pill, 999px); background: var(--nk-surface, #FFFFFF); }
.search__input { flex: 1 1 auto; align-self: stretch; min-width: 0; min-height: 48px; padding: 0 10px 0 18px; border: 0; background: transparent; color: var(--nk-ink, #0B1220); font: inherit; font-size: 16px; }
.search__input::-webkit-search-cancel-button { cursor: pointer; }
.search__btn { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px; border: 0; border-radius: var(--nk-r-pill, 999px); background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); font: inherit; font-size: 16px; font-weight: 600; cursor: pointer; }
.search__btn--icon { width: 44px; min-height: 44px; padding: 0; border-radius: 50%; }
.search__icon { flex: 0 0 auto; margin-left: 12px; color: var(--nk-muted, #5D6372); }
.search__icon + .search__input { padding-left: 4px; }
.search--compact { max-width: 420px; padding: 4px 4px 4px 16px; background: var(--nk-bg, #F7F6F2); }
.search--compact .search__input { min-height: 44px; padding: 0; }
.search--dark { gap: 6px; padding: 3px 3px 3px 15px; border-color: var(--nk-dark-line-input, #6B7385); background: var(--nk-dark-2, #1B2333); }
.search--dark .search__input { min-height: 40px; padding: 0; color: var(--nk-on-ink, #FFFFFF); font-size: 15px; }
.search--dark .search__input::placeholder { color: var(--nk-dark-placeholder, #8F97A8); }
.search--dark .search__btn { position: relative; min-height: 40px; padding: 0 16px; background: var(--nk-surface, #FFFFFF); color: var(--nk-ink, #0B1220); font-size: 14px; }
.search--dark .search__btn::after { content: ''; position: absolute; top: -4px; right: 0; bottom: -4px; left: 0; }
@supports selector(:has(*)) {
  .search:has(.search__input:focus-visible) { outline: 3px solid var(--nk-link-hover, #1C5F99); outline-offset: 2px; }
  .search--dark:has(.search__input:focus-visible) { outline-color: var(--nk-on-ink, #FFFFFF); }
  .search .search__input:focus-visible { outline: none; }
}

/* Chips: the grey pills under the hero search (Main), filters with a line (A_Szukaj: the chosen one in ink),
   the dashed "clear the filter" chip (Main) and the outlined chips on an ink block (Main, "Dla organizacji").
   In forced colours every pill gets a line, as the system colours drop the fills. */
.chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.chip { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 0; border-radius: var(--nk-r-pill, 999px); background: var(--nk-surface-3, #ECE9E2); color: var(--nk-ink, #0B1220); font: inherit; font-size: 15px; text-decoration: none; cursor: pointer; }
.chip--line { padding: 0 18px; border: 1px solid var(--nk-line, #E3E0D9); background: var(--nk-surface, #FFFFFF); font-weight: 600; }
.chip--line:hover { border-color: var(--nk-ink, #0B1220); }
.chip--line[aria-pressed="true"], .chip--line[aria-current="page"] { border-color: var(--nk-ink, #0B1220); background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); }
.chip--dashed { padding: 0 14px; border: 1px dashed var(--nk-line-dashed, #B9B3A6); background: transparent; color: var(--nk-ink-2, #3A4050); font-weight: 600; }
.chip--on-dark { border: 1px solid var(--nk-dark-line, #3A4252); background: transparent; color: var(--nk-on-ink, #FFFFFF); }
.chip--on-dark:hover { border-color: var(--nk-on-ink, #FFFFFF); color: var(--nk-on-ink, #FFFFFF); }
@media (forced-colors: active) {
  .btn, .top__cta, .search__btn, .chip { border: 1px solid ButtonText; }
  .chip--line[aria-pressed="true"], .chip--line[aria-current="page"] { outline: 2px solid Highlight; outline-offset: -2px; text-decoration: underline; }
}

/* Cards: white with a line. The default is a panel card (A_Panel, A_Uzytkownik: 20 px, padding up to 28 px);
   --sm a staff card (A_Admin: 18 px, 22 px), --tile a tile (24 px), --hero the one centred card of a page
   (A_Konto, A_Wylaczona, A_Zaloz: 28 px), --soft the grey hint box (A_Szukaj), --dark the ink card (A_Uzytkownik). */
.card { background: var(--nk-surface, #FFFFFF); border: 1px solid var(--nk-line, #E3E0D9); border-radius: var(--nk-r-panel, 20px); padding: clamp(20px, 3vw, 28px); }
.card--sm { border-radius: var(--nk-r-card, 18px); padding: 22px; }
.card--tile { border-radius: var(--nk-r-tile, 24px); padding: clamp(24px, 4vw, 40px); }
.card--hero { border-radius: var(--nk-r-hero, 28px); padding: clamp(24px, 4vw, 40px); }
.card--soft { border-color: var(--nk-surface-3, #ECE9E2); background: var(--nk-surface-3, #ECE9E2); padding: 22px 24px; }
.card--dark { border-color: var(--nk-ink, #0B1220); background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); }
.card--shadow { box-shadow: var(--nk-shadow-card, 0 1px 2px rgba(11, 18, 32, 0.08), 0 14px 30px rgba(11, 18, 32, 0.14)); }
.tile { display: flex; flex-direction: column; gap: 6px; color: var(--nk-ink, #0B1220); text-decoration: none; }
.tile:hover { border-color: var(--nk-ink, #0B1220); color: var(--nk-ink, #0B1220); }
.tile__title { font-size: 20px; font-weight: 600; }

/* Badges: a small pill with a state (A_Admin, A_Szukaj: 13 px, 600), in the text face also inside a title (the role
   after the name of an organisation in the panel, a state after the name of a page in "Twoje konto"). */
.badge { display: inline-block; padding: 3px 10px; border-radius: var(--nk-r-pill, 999px); background: var(--nk-surface-2, #EFEDE7); color: var(--nk-ink-2, #3A4050); font-family: var(--nk-font, 'Sofia Sans', system-ui, sans-serif); font-size: 13px; font-weight: 600; }
.badge--ok { background: var(--nk-success-bg, #E6F2EA); color: var(--nk-success, #1E5E30); }
.badge--warn { background: var(--nk-warn-bg, #FBF0D9); color: var(--nk-warn, #5C3B00); }
.badge--err { background: var(--nk-danger-bg, #F9E3E3); color: var(--nk-danger-ink, #6B1A1D); }
.badge--dark { background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); }
.badge--soft { background: var(--nk-surface-3, #ECE9E2); color: var(--nk-ink, #0B1220); }
@media (forced-colors: active) {
  .badge { border: 1px solid CanvasText; }
}

/* Notices. .msg is a line of news in a box (12 px radius); --dark is the toast of the prototype (role="status").
   .notice is a note the size of a card (A_Panel, A_Admin: 18 px radius) with room for a button at its end. */
.msg { padding: 12px 16px; border-radius: var(--nk-r-control, 12px); font-size: 15px; font-weight: 600; }
.msg--error { background: var(--nk-danger-bg, #F9E3E3); color: var(--nk-danger-ink, #6B1A1D); }
.msg--ok { background: var(--nk-success-bg, #E6F2EA); color: var(--nk-success, #1E5E30); }
.msg--warn { background: var(--nk-warn-bg, #FBF0D9); color: var(--nk-warn, #5C3B00); }
.msg--dark { background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); }
.notice { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; padding: 18px 20px; border-radius: var(--nk-r-card, 18px); background: var(--nk-warn-bg, #FBF0D9); color: var(--nk-warn, #5C3B00); }
.notice__text { flex: 1 1 420px; min-width: 0; }
.notice--danger { border: 1px solid var(--nk-danger-line, #E8B4B6); background: var(--nk-danger-soft, #FDF3F3); color: var(--nk-danger-ink, #6B1A1D); }
.notice--ok { background: var(--nk-success-bg, #E6F2EA); color: var(--nk-success, #1E5E30); }
@media (forced-colors: active) {
  .msg, .notice, .banner { border: 1px solid CanvasText; }
}

/* An ink block (Main "Dla organizacji", A_Admin's header): white text, links and focus ring. */
.on-dark { background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); }
.on-dark a:not(.btn):not(.chip) { color: var(--nk-on-ink, #FFFFFF); }
.on-dark :focus-visible { outline-color: var(--nk-on-ink, #FFFFFF); }

/* The initial of a person in a circle: 32 px in the header (A_AI), --lg 44 px in the account (A_Uzytkownik). */
.avatar { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; background: var(--nk-ink, #0B1220); color: var(--nk-on-ink, #FFFFFF); font-size: 14px; font-weight: 700; line-height: 1; }
.avatar--lg { width: 44px; height: 44px; font-size: 18px; }
/* An inline SVG icon (stroke="currentColor", aria-hidden): beside text, never squeezed. */
.icon { flex: 0 0 auto; vertical-align: middle; }

/* Tables. position: relative makes the scroller the containing block of the absolutely positioned .vh texts of its
   table (a hidden column header, "Przywróć jako szkic: wersja 3"): without it they sit against the page and widen
   it at 320 px. Figures are tabular (Sofia Sans draws proportional ones), so the columns of numbers line up. */
.scroll { position: relative; overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; font-size: 15px; font-variant-numeric: tabular-nums; }
.table th { padding: 8px; text-align: left; font-weight: 600; color: var(--nk-muted, #5D6372); }
.table td { padding: 8px; border-top: 1px solid var(--nk-line-soft, #EFEDE7); vertical-align: top; }
.table td > a { display: inline-flex; align-items: center; min-height: 44px; }
.table tr:has(> td > a) > td { vertical-align: middle; }

/* Two-step sign-in: the secret and the backup codes, set in a monospace font. */
.secret { margin-top: 8px; padding: 12px 14px; border-radius: var(--nk-r-control, 12px); background: var(--nk-surface-2, #EFEDE7); font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 19px; letter-spacing: 0.06em; word-break: break-all; }
.codes { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 18px; }
.codes li { padding: 8px 12px; border-radius: var(--nk-r-tag, 10px); background: var(--nk-surface-2, #EFEDE7); text-align: center; }

/* Error pages (errors/error.php): the one centred card of A_Wylaczona, as module.css draws it for a page that is off
   (.nkp-off), here because an error page loads app.css alone. .main's top and the card's margin make the prototype's
   clamp(48px, 8vw, 104px) above it; a long word or code breaks instead of widening the page at 320 px. */
.error-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  max-width: 640px;
  margin: clamp(16px, 3vw, 40px) auto 0;
  padding: clamp(28px, 5vw, 56px);
  border: 1px solid var(--nk-line, #E3E0D9);
  border-radius: var(--nk-r-hero, 28px);
  background: var(--nk-surface, #FFFFFF);
  text-align: center;
  overflow-wrap: anywhere;
}
/* Miniatura.dc.html at 120 px (the SVG's own size), faded and grey. */
.error-card__mini { display: block; flex: 0 0 auto; opacity: 0.45; filter: grayscale(1); }
.error-card__title { font-size: clamp(30px, 4.4vw, 46px); }
.error-card__text { max-width: 480px; color: var(--nk-muted, #5D6372); }
/* The dark pill and the outlined one, 52 px (.btn--lg); the outlined one 54 px with its line (the prototype sizes links
   without box-sizing), and in one row the dark one stretches along. */
.error-card__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 6px; }
.error-card__actions .btn--ghost { min-height: 54px; }
/* The card's last line ("Prowadzisz tę stronę?" in the prototype): the code of a server error. */
.error-card__note { margin-top: 8px; font-size: 15px; color: var(--nk-muted, #5D6372); }

/* Motion (3.11.2026, Krzysztof: "płynnie zanimowane, a nie tak sztywno i szarpiąco"). The times are the tokens
   --nk-motion-fast (hover, focus, pressed), --nk-motion (a message, a ready file, an opened section; motion.js blends
   the canvas pictures in it) and --nk-motion-slow (the curtain). With prefers-reduced-motion: reduce nk-tokens.css
   makes them 0, 100 and 120 ms and --nk-rise 0, and the lifts and presses below are off: nothing moves, a change is
   at once or a short fade (WCAG 2.3.3). */

/* The loading curtain (app/views/_veil.php): the page background over everything and the mark of the logo, whose
   rainbow flows, until motion.js lifts it (.is-gone). The mark comes only after 0.3 s, so a page that is ready at once
   just fades in. CSS lifts it by itself after 3 s (a script that failed, a slow network); a browser without scripts,
   print and a page whose focus the keyboard already has (an error summary with autofocus: WCAG 2.4.11) never show it. */
.veil { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; background: var(--nk-bg, #F7F6F2); animation: veil-out var(--nk-motion-slow, 300ms) var(--nk-ease, ease) 3s forwards; }
.veil.is-gone { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity var(--nk-motion-slow, 300ms) var(--nk-ease, ease), visibility 0s linear var(--nk-motion-slow, 300ms); }
.veil__mark { display: block; width: clamp(60px, 8vw, 76px); height: auto; animation: nk-in var(--nk-motion, 260ms) var(--nk-ease, ease) 0.3s backwards; }
/* One period of the stripes along x (6 stripes of 14.95 at 30°: 89.7 / cos 30°), so the flow starts over seamlessly. */
.veil__flow { animation: veil-flow 2.4s linear infinite; }
@keyframes veil-out { to { opacity: 0; visibility: hidden; } }
@keyframes veil-flow { to { transform: translateX(-103.58px); } }
@media (scripting: none) {
  .veil { display: none; }
}
@media print {
  .veil { display: none; }
}
@supports selector(:has(*)) {
  body:has(:focus-visible) .veil { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .veil__flow { animation: none; }
}

/* Coming in: a message, a note, an error under a field and the content of an opened <details> fade in and rise by
   --nk-rise when they show (on the page, unhidden or added by a script); nk-fade is the same without the rise. The
   area files use both for their own parts (the ready files of the module). */
@keyframes nk-in { from { opacity: 0; translate: 0 var(--nk-rise, 6px); } }
@keyframes nk-fade { from { opacity: 0; } }
.msg, .notice, .field__error, details[open] > :not(summary) { animation: nk-in var(--nk-motion, 260ms) var(--nk-ease, ease) backwards; }
/* An opened <details> also grows to its content and folds back when it closes, where the browser can animate it
   (::details-content and interpolate-size); the clip is vertical only, so a wide table inside still shows, and leaves
   8 px for the focus rings at its edges. */
@media (prefers-reduced-motion: no-preference) {
  :root { interpolate-size: allow-keywords; }
  ::details-content { height: 0; overflow-y: clip; overflow-clip-margin: 8px; transition: height var(--nk-motion, 260ms) var(--nk-ease, ease), content-visibility var(--nk-motion, 260ms) allow-discrete; }
  [open]::details-content { height: auto; }
}

/* Hover, focus and pressed: the colours, lines and shadows of every link, button, label and field change in
   --nk-motion-fast, so nothing jumps (here with no weight, so an area file's own transition wins). Under the pointer
   a pill lightens a little whatever its colour (a white veil inside it, so the text keeps its contrast; the white pill
   on an ink block greys instead); on a press it gives a little, and a card that is a link lifts. */
:where(a, button, summary, label, input, select, textarea) {
  transition: color var(--nk-motion-fast, 150ms) var(--nk-ease, ease), background-color var(--nk-motion-fast, 150ms) var(--nk-ease, ease), border-color var(--nk-motion-fast, 150ms) var(--nk-ease, ease), box-shadow var(--nk-motion-fast, 150ms) var(--nk-ease, ease), translate var(--nk-motion-fast, 150ms) var(--nk-ease, ease), scale var(--nk-motion-fast, 150ms) var(--nk-ease, ease);
}
.btn:hover, .top__cta:hover, .search__btn:hover { box-shadow: inset 0 0 0 100vmax rgba(255, 255, 255, 0.12); }
.btn--light:hover { background-color: var(--nk-surface-2, #EFEDE7); }
@media (prefers-reduced-motion: no-preference) {
  .btn:active, .top__cta:active, .search__btn:active, .chip:active { scale: 0.97; }
  .tile:hover, .tile:focus-visible { translate: 0 -2px; box-shadow: var(--nk-shadow-card, 0 1px 2px rgba(11, 18, 32, 0.08), 0 14px 30px rgba(11, 18, 32, 0.14)); }
}