/* ------------------------------------------------------------ faces
   the two faces travel with the page. font-display: block, not swap:
   swap paints a fallback and re-paints when the real face lands, and
   every line on the page visibly re-wraps. these are small files off
   the same origin; the wait is a moment.

   this page sits beside the other three now, so the paths are flat.
   it lived in docs/ until 2026-08-17; the ashfall manual it replaced is
   in archive/docs-ashfall-2026-08-17.html.                          */

/* Лист вывернут 21 августа, теми же числами, что license: прежняя шкала,
   пересчитанная так, чтобы контраст каждой ступени к грунту остался тем
   же, каким был на чёрном — 17.1, 5.1, 3.0, 1.2 и 1.6 к одному.

   Островок реестра выворачивается сам: он набран `--ash-0` по `--bg`,
   то есть двумя значениями страницы наоборот. Был белым по чёрному,
   стал чёрным по светлому — трогать его не пришлось.               */
.p-documentation {
    --bg:      #e8e8e8;
    --ash-0:   #000000;   /* the ink        */
    --ash-2:   #606060;   /* nav, at rest   */
    --ash-3:   #868686;   /* footer         */
    --rule:    #d2d2d2;   /* hairlines      */
    --rule-lit:#b9b9b9;
    --lit:     var(--ash-0);

    --sys-sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

    --sans: "Ronzino", var(--sys-sans);


    --page-pad:    28px;

    /* переход между страницами */
    --slide:       620ms;   /* вся длительность                     */
    --dim:          0.25;   /* до какой яркости гаснет старая        */
    --lift:          18%;   /* насколько старая уходит вверх         */
    --lift-time:     0.6;   /* на какой части хода она трогается     */
    --scale:        0.94;   /* и во сколько ужимается, уходя вглубь   */

    --in:  220ms;  /* arrival */
    --out:  90ms;  /* departure is faster than arrival */

    /* шапка. те же числа, что на index и license. её высота считается
       из них: плашка плюс два поля, 14 + 9 + 9. Липкий островок
       цепляется за это же число.                                    */
    --mast-size:   11.5px;
    --mast-plate:  14px;
    --mast-padx:   3px;
    --mast-gap:    3px;
    --mast-radius: 2px;
    --mast-slot:   103px;
    --mast-track:  0.012em;
    --mast-inset:  10px;
    --mast-top:    9px;
    --mast-h: calc(var(--mast-plate) + var(--mast-top) * 2);
}

.p-documentation * { box-sizing: border-box; margin: 0; padding: 0; }

.p-documentation {
    background: var(--bg);
    color: var(--ash-0);
    font-family: var(--sans);
    font-size: 15px;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    display: flex;
    flex-direction: column;
    min-height: 100svh;
}

.p-documentation ::selection { background: var(--ash-0); color: var(--bg); }

.p-documentation a {
    color: var(--ash-0);
    text-decoration: none;
    border-bottom: 1px solid var(--rule-lit);
    transition: color var(--out), border-color var(--out);
}
.p-documentation .page {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 0 var(--page-pad);
}

/* ---------------------------------------------------------- masthead

   Те же плашки, что на index и license: числа с and2es.com, набраны
   Ronzino. Прежняя плита с `ashen one` и `docs` — в архиве.

   ЛИПКАЯ, а не приколотая, и это не вкус, а условие налистывания.
   Приколоченная шапка меряется от края ОКНА — но пока лист едет, он
   вынут в position: fixed и двигается transform'ом, а transform
   делает лист началом отсчёта для всего приколоченного внутри. Значит
   на ходу шапка едет с листом и встаёт на --stack-gap ниже, а в тот
   кадр, когда ход кончился и transform снят, она перескакивает к краю
   окна — прыжок ровно в щель, 11 px. Липкая шапка стоит в потоке
   листа и никуда не перескакивает: как на untitled.                */

.p-documentation .masthead {
    position: sticky;
    top: 0;
    z-index: 800;
    /* шапка стоит на ПОЛЕ ЛИСТА, а не на поле страницы: в потоке она
       сидит внутри --page-pad и плашки уехали бы на 18 внутрь против
       соседних страниц. Поле страницы вычитается, дальше работает
       собственное --mast-inset.                                    */
    margin: 0 calc(var(--page-pad) * -1);
    display: flex;
    align-items: center;
    gap: var(--mast-gap);
    padding: var(--mast-top) var(--mast-inset);
    background: transparent;
}

.p-documentation .mast-mid {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: var(--mast-gap);
}
.p-documentation .mast-left  { display: flex; gap: var(--mast-gap); }
.p-documentation .mast-right { display: flex; gap: var(--mast-gap); margin-left: auto; }

.p-documentation .pill {
    display: inline-flex;
    align-items: center;
    height: var(--mast-plate);
    padding: 0 var(--mast-padx);
    border: 0;
    border-radius: var(--mast-radius);
    background: #000000;
    color: #e8e8e8;
    font-family: var(--sans);
    font-size: var(--mast-size);
    letter-spacing: var(--mast-track);
    line-height: 1;
    white-space: nowrap;
}
.p-documentation .mast-mid .pill { width: var(--mast-slot); }
   it: one slab, one colour, three words on it.                    */

/* ---------------------------------------------------------- canvas
   the manual that stood here belonged to ashfall and is whole in
   archive/docs-ashfall-2026-08-17.html, unedited.                    */
/* pulled up by the masthead's whole height, so the first island starts at
   the top of the page instead of a row below it. sticky only takes over
   once something scrolls; until then the bar sits wherever the flow put
   it, and the flow was putting it under the masthead.                 */
/* шапка вернулась в поток и занимает свои --mast-h сама, поэтому
   подпирать её полем больше не надо: поле дало бы её высоту дважды. */
.p-documentation main {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

/* ---------------------------------------------------------- the bar
   it latches ON the masthead's line, not under it -- top: 0, not
   top: var(--mast-h). that is the whole answer to the thing that broke:
   sticky is confined to its own section, so when a section scrolls out
   its bar goes with it and the next one takes the slot. there is never
   more than ONE bar up there, so there is no stack, and with no stack
   nothing can re-latch onto anything every three pixels.

   the masthead no longer lends it the middle of the row: since 18 august
   the wordmark and both destinations stand together on one black slab at
   the left. so the bar does not share the line with them -- it BEGINS
   where the slab ends and runs to the right edge of the sheet, black
   into white, one continuous rule across the page.

   z-index 700 against the masthead's 800: the bar passes UNDER the
   wordmark and the nav and OVER everything in the page.              */
.p-documentation {
    /* the body's left, measured from the CONTENT box, which already
       starts a gutter in.                                            */
    --clear-l: 100px;

    /* where the island starts: hard against the end of the masthead's
       slab, so the two touch and nothing overlaps.

       derived, not picked. the slab holds `ashen one untitled docs` at
       13px mono: 71.4 + 63.4 + 31.7 of letters, two gutters of 28, and
       0.615em of its own ground at each end -- 237.0 wide. it is pulled
       0.615em left of the spine, so against the content box it runs
       from -8 to 229. the island's left margin is that 229. it holds at
       the narrow padding too, but only because the slab's own gutter is
       pinned at 28 rather than following --page-pad -- measured: with
       it following, the two came apart by 16 at 700px.               */
    --island-l: 229px;

    /* ДЛИНА ИМЕННОЙ ПЛАШКИ, и она правится только здесь. Плашка ровно в
       свои слова: 3 поля + `type 01` 38.16 + ЭТО + `sympathy` 50.89 + 3.
       То есть длину держит пустое место между словами и ничего больше.

       50 подобрано вживую в plate.html 21 августа. Плашка выходит 145 и
       ЗАЛЕЗАЕТ на колонку текста на 27: она липкая, и строки проезжают
       под ней, теряя это начало. Так и задумано — плита читается как
       титр поверх текста. Скромный предел, при котором края текста и
       плашки сходятся встык, — 22.95, и он отклонён сознательно.      */
    --entry-gap: 50px;
}

/* ПЛАШКИ, и те же самые, что в шапке: одна плита, одно поведение, один
   словарь на весь сайт. Строка под шапкой держит две из них.

   Левая — имя: `type 01 sympathy` одной длинной плашкой, шириной в свои
   слова, не растянутой. Её левый край стоит под левым краем `ashen one`,
   поэтому строка вынесена из полей страницы к полю шапки: --mast-inset
   минус --page-pad, то есть на 18 влево (и на 10 в узком режиме).

   Правая — дата, тем же приёмом с другого конца: её правый край стоит
   под правым краем `email`. Обе плашки висят на полях шапки, а не на
   полях текста, и потому стоят под своими из первой строки при любой
   ширине окна.

   Липнет как липла: top --mast-h, под шапкой, z-index 700 против её 800.
   Внутри секции, поэтому стопки не бывает.

   ПОЛЯ СВЕРХУ НЕТ, и это не экономия, а условие неподвижности. Пока
   стояло 14, строка на прокрутке уезжала вверх ровно на них: замер —
   от плашек шапки до плашек строки 23 в покое и 9 в защёлке. Ноль
   ставит покой туда же, куда защёлку — строка встык под шапкой, 9, —
   и на прокрутке не двигается вовсе.                                */
.p-documentation .entry-bar {
    position: sticky;
    top: var(--mast-h);
    z-index: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-left:  calc(var(--mast-inset) - var(--page-pad));
    margin-right: calc(var(--mast-inset) - var(--page-pad));
}
/* ИМЯ, а не ссылка. Нажимать его было незачем: `type 01 sympathy` уводил
   на `#`, то есть обещал переход и никуда не вёл. Теперь это просто
   надпись на плашке, и ни курсора, ни наведения у неё нет.

   Между словами --entry-gap: два слова стоят по краям своей плашки, и
   вся её длина считается этим полем. См. блок переменных выше.      */
.p-documentation .entry-link {
    gap: var(--entry-gap);
}
.p-documentation .entry-no { color: inherit; }
.p-documentation .entry-name { color: inherit; }

.p-documentation .entry-date { white-space: nowrap; }
/* there is no third column. four words were tried in it -- importer,
   a date, windows, manual -- and every one of them restated something the
   reader already had: the site, the calendar, the platform, the tab they
   are standing in. the row is told apart by its number and its name, and
   nothing else was ever needed.

   the slot existed because the strip is stretched and its right end looked
   empty. that is a layout question, and it was being answered with text.
   the end is simply white now.                                        */

/* always open. there is no collapsed state, which is the second half of
   why the positioning cannot break: nothing changes height under a
   latched bar.                                                        */
.p-documentation .entry-body {
    padding: 43px 0 120px;
}

/* ОТСТУП МЕЖДУ СТРОКАМИ — 9, и это не выбранное число, а ритм самой
   страницы: 9 стоит от верха окна до плашек шапки и 9 от шапки до
   строки. Теперь то же расстояние держится и между уходящей строкой и
   приходящей — раньше они сходились встык и на кадр ложились друг на
   друга.

   Скрипта тут не нужно, хватает поля у секции: липкая строка не может
   выйти за низ своей секции, поэтому расстояние между строками равно
   ровно этому полю и держится всю передачу само.                    */
.p-documentation .entry + .entry { margin-top: 9px; }


/* ---------------------------------------------------------- the manual
   same grammar as the specifications block on untitled: a quiet label, a
   blank line, then the lines. no bullets, no rules -- a list, not a
   table. the numbers in the middle section ARE content: the order of
   those four questions is the whole answer, so they are set.

   it hangs off --clear-l, the island's own left edge, so the body starts
   where its bar starts. that is the second axis the site has been
   declaring in :root and never using.                                 */
.p-documentation .doc {
    margin-left: var(--clear-l);
    max-width: 74ch;
    font-size: 13px;   /* the island's size. it was 15, and prose set
                          larger than the bar naming it read as a mistake */

    font-family: var(--sans);
}
.p-documentation .doc-group + .doc-group { margin-top: 43px; }
.p-documentation .doc-label { margin-bottom: 21px; }
.p-documentation .doc p + p { margin-top: 21px; }
.p-documentation .doc ol { list-style: none; }
.p-documentation .doc li + li { margin-top: 21px; }

/* ---------------------------------------------------------- footer */
.p-documentation footer {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--page-pad);
    flex-wrap: wrap;
    padding: 22px 0 18px;
    font-family: var(--sans);
    font-size: 11px;
    /* серого здесь больше нет: на светлом грунте подвал перестаёт быть
       тише страницы, он просто её последняя строка.               */
    color: #000000;
}

/* ---------------------------------------------------------- narrow */
@media (max-width: 720px) {
    .p-documentation { --page-pad: 20px; }
    .p-documentation footer { gap: calc(var(--page-pad) / 4) var(--page-pad); }
}

/* ------------------------------------------------- переход между страниц
   настоящая навигация: адрес меняется, F5 и «назад» работают, каждая
   страница грузит только своё. анимацию играет сам браузер — скрипт не
   нужен. в firefox её не будет, там просто обычный переход.

   старая страница СТОИТ, а не уезжает: без этого браузер разводит их
   крест-накрест и получается подмена, а не налистывание. новая выходит
   снизу и накрывает.                                                 */

/* полоса носит одно имя на всех страницах, поэтому браузер понимает,
   что это один и тот же объект, и оставляет её на месте.            */

/* НОВАЯ идёт снизу. кривая снята с becaneparis: quintEaseOut,
   .22 1 .36 1. первая контрольная точка уже стоит на единице, поэтому
   разгона нет вовсе — страница трогается на полной скорости и всю
   дорогу только гасится. это и есть их подхват: не «поехала», а «уже
   едет» с первого кадра.                                            */

/* СТАРАЯ делает два движения разом, и они не совпадают по времени.
   темнеет она с самого начала и ровно, а вверх трогается только на
   последней части хода — когда новая её уже почти закрыла.

   КРИВАЯ подъёма зеркальна кривой входа, тоже с becaneparis:
   quintEaseIn, .64 0 .78 0. вторая контрольная точка на нуле, значит
   торможения в конце нет — старая трогается с места и разгоняется до
   самого конца, уходя из кадра на полном ходу. пара out/in, вход
   гасится, выход разгоняется, — это их приём, а не наш.             */

/* подъём и ужатие — одно движение и один момент: старая уходит вверх и
   вглубь разом, когда её подхватывает приходящая.                    */
