/* Natalchik mini app, design v18 (19.10.2026): day and night, 95 screens.
   Source of the values: the v18 package (natalchik-v18: computed-day.json,
   computed-night.json and the mockups), measured again on the same fonts the
   page uses (lab/v18/spec.py). Screens move to v18 one section at a time;
   a v18 screen carries the class "v18" on its root, the rest of the page
   still lives in app.css until its section is done.
   ASCII only: every word of the page lives in okno/teksty.py. */

/* -- fonts: local files, never Google (the page loads only from our server) -- */
@font-face{font-family:'Sofia Sans';font-style:normal;font-weight:1 1000;font-display:swap;
  src:url('sofia-cyr.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Sofia Sans';font-style:normal;font-weight:1 1000;font-display:swap;
  src:url('sofia-lat.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';font-style:italic;font-weight:1 1000;font-display:swap;
  src:url('sofia-cyr-it.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Sofia Sans';font-style:italic;font-weight:1 1000;font-display:swap;
  src:url('sofia-lat-it.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:'Forum';font-style:normal;font-weight:400;font-display:swap;
  src:url('forum-cyr.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Forum';font-style:normal;font-weight:400;font-display:swap;
  src:url('forum-lat.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}

/* -- tokens: day (README 4, "Den") -- */
:root{
  /* Forum is a stand-in for the future "entry font": change it here only */
  --font-display:'Forum',Georgia,serif;
  --font-text:'Sofia Sans',system-ui,sans-serif;
  --v-bumaga:#F2F2EF;          /* screen background, paper */
  --v-chernila:#24272A;        /* main text */
  --v-vtor:#55595C;            /* secondary text */
  --v-podpis:#6B6F72;          /* small headings, field labels */
  --v-tusk:#6E7275;            /* muted: options not chosen, "delete" */
  --v-shag:#6E7275;            /* "1 iz 6" above the question: the same in both themes */
  --v-shalfey:#3E4642;         /* the dark screen and the cover */
  --v-shalfey-tekst:#ECEDEA;   /* text on it */
  --v-krem:#E4D1A0;            /* cream: the button on dark, the cover phrase */
  --v-knopka-fon:#3E4642;      /* the main button */
  --v-knopka-tekst:#E4D1A0;
  --v-knopka-vykl-fon:#3E4642; /* the button that cannot be pressed yet: same, at .4 */
  --v-knopka-vykl-tekst:#E4D1A0;
  --v-knopka-vykl-op:.4;
  --v-bordo:#8A1A2B;           /* the main thing and the chosen one */
  --v-bordo-m:#8A1A2B;         /* small bordeaux text (captions, action links) */
  --v-oshibka:#C2461C;         /* errors and the "delete" confirmation */
  --v-liniya:rgba(36,39,42,.45);       /* the line of a field */
  --v-liniya-tonk:rgba(36,39,42,.12);  /* progress track, list separators */
  --v-kruzhok:#6E7275;                 /* the ring of an option not chosen */
  --v-list-fon:#F2F2EF;                /* the bottom sheet */
  --v-podskazki:#FFFFFF;               /* city suggestions */
  --v-zatemnenie:rgba(40,44,42,.78);   /* under the bottom sheet */
  --v-pole:24px;                       /* the side gutter of every screen */
  --v-neskolko:#24272A;                /* 12: "mozhno vybrat neskolko" */
  --v-linii:rgba(36,39,42,.3);         /* 13: the ruled lines of the free answer */
  --v-linii-niz:rgba(36,39,42,.45);    /* 13: its bottom line */
  --v-tiho:#24272A;                    /* 08: the signs at the right and the last line */
  --v-n-cvet:#8A1A2B;                  /* the signature "- N." */
  --v-prochitano:#7C7F78;              /* 27-29: a chapter already read, both themes */
  --v-prog:#8A1A2B;                    /* 30: the line of reading progress, both themes */
  --v-pusto:#6E7275;                   /* 40: the empty field of the answer */
  --v-bledno:.4;                       /* 45: a day she did not come to */
}
/* -- night (README 4, "Noch") -- */
:root[data-tema="noch"]{
  --v-bumaga:#191C1B;
  --v-chernila:#E7E5DF;
  --v-vtor:#AEB1AD;
  --v-podpis:#AEB1AD;
  --v-tusk:#9EA29E;
  --v-knopka-fon:#E4D1A0;
  --v-knopka-tekst:#191C1B;
  --v-knopka-vykl-fon:#3A3E3C;
  --v-knopka-vykl-tekst:#7E827E;
  --v-knopka-vykl-op:1;
  --v-bordo:#B84C5A;
  --v-bordo-m:#CF5F6B;
  --v-oshibka:#EE7A45;
  --v-liniya:rgba(255,255,255,.4);
  --v-liniya-tonk:rgba(255,255,255,.14);
  --v-kruzhok:#AEB1AD;
  --v-list-fon:#232726;
  --v-podskazki:#2A2E2D;
  --v-neskolko:#AEB1AD;
  --v-linii:rgba(255,255,255,.3);
  --v-linii-niz:rgba(231,229,223,.45);
  --v-tiho:#AEB1AD;
  --v-n-cvet:#E4D1A0;
  --v-pusto:#AEB1AD;
  --v-bledno:.62;
}

/* -- a v18 screen: no rounding, no cards, no gradients anywhere below --
   --v-fon-ekrana is the background of the screen kind; the page reads it for the
   header of Telegram (app.js, O.cvetFona), so a colour is written only here */
:root{--v-fon-ekrana:var(--v-bumaga)}
.ekran.v18{--v-fon-ekrana:var(--v-bumaga);background:var(--v-fon-ekrana);color:var(--v-chernila);
  font:400 15px/1.4 var(--font-text);-webkit-font-smoothing:antialiased}
/* a process screen (waiting, questions of the test): dark in both themes */
.ekran.v18.temnyy,.ekran.v18.ritual{--v-fon-ekrana:#3E4642;color:#ECEDEA}
/* a result after the dark process: cream at night, the change takes about 250 ms (README 4) */
:root[data-tema="noch"] .ekran.v18.ritual{--v-fon-ekrana:#E4D1A0;color:#24272A}
.ekran.v18.ritual{transition:background-color .25s,color .25s}
/* leaving a dark screen: the background dissolves in 250 ms, no slide (audit v18, 2.6; app.js, pokazat) */
.ekran.rastvor{transition:opacity .25s linear}
.ekran.rastvor.vhod,.ekran.rastvor.uhod,.ekran.rastvor.vhod.obr,.ekran.rastvor.uhod.obr{transform:none}
@media (prefers-reduced-motion:reduce){.ekran.rastvor{transition:none}}
.ekran.v18 .fon{display:none}
.ekran.v18 .telo{padding:var(--verh-zapas) var(--v-pole) 24px;display:block;gap:0}
.ekran.v18 .niz{padding:0 var(--v-pole) max(var(--niz-zapas),24px);display:block}
.ekran.v18 .niz:empty{display:none}
.ekran.v18 ::selection{background:rgba(138,26,43,.18)}

/* the main button: our own, not Telegram's MainButton (README 6) */
.v18 .v-knopka{display:flex;align-items:center;justify-content:center;width:100%;height:52px;
  font:500 16px var(--font-text);background:var(--v-knopka-fon);color:var(--v-knopka-tekst);
  border:0;border-radius:0;padding:0 12px;text-align:center}
/* a pale button takes the tap and says what is missing (08.11, R81: it was silent) */
.v18 .v-knopka.vykl{background:var(--v-knopka-vykl-fon);color:var(--v-knopka-vykl-tekst);
  opacity:var(--v-knopka-vykl-op);cursor:default}
.v18 .v-knopka.zhdu{opacity:.7;pointer-events:none}
/* the control that waits for an order breathes - only it waits (08.11, R81) */
.v18 .zhdu{pointer-events:none;animation:v-zhdu 1.2s ease-in-out infinite}
@keyframes v-zhdu{0%,100%{opacity:.45}50%{opacity:.85}}
/* a pale button pressed: it shakes, and what is missing glows bordeaux a moment */
.v18 .v-knopka.netu{animation:v-netu .36s ease}
@keyframes v-netu{0%,100%{transform:none}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.v18 .v-nado,.v18 .v-nado button,.v18 .v-nado input,.v18 .v-nado .v-pole-podpis{animation:v-nado 1.5s ease}
@keyframes v-nado{0%,55%{color:var(--v-bordo);border-bottom-color:var(--v-bordo)}}
@media (prefers-reduced-motion:reduce){.v18 .zhdu,.v18 .v-knopka.netu{animation:none}.v18 .zhdu{opacity:.6}}

/* progress of the anketa and "1 iz 6" */
.v18 .v-prog{height:2px;background:var(--v-liniya-tonk);margin-top:4px}
.v18 .v-prog i{display:block;height:2px;background:var(--v-bordo)}
.v18 .v-shag{font:400 13px var(--font-text);color:var(--v-shag);text-align:right;margin-top:6px;min-height:16px}

/* the question of the anketa: the display font, sentence case */
.v18 .v-vopros{font:400 32px/1.08 var(--font-display);margin-top:10px;white-space:pre-line;
  overflow-wrap:normal;word-break:normal;hyphens:manual}

/* a field: the value large, on a line, without a box (README 6) */
.v18 .v-pole{margin-top:22px}
.v18 .v-pole-podpis{display:block;font:400 13.5px var(--font-text);color:var(--v-podpis);min-height:16px}
.v18 .v-pole-znach{position:relative;display:block;width:100%;margin-top:2px;padding:2px 0 6px;
  font:400 26px/1.15 var(--font-display);color:var(--v-chernila);background:none;
  border:0;border-bottom:1px solid var(--v-liniya);border-radius:0;outline:0;caret-color:var(--v-bordo);
  -webkit-appearance:none;appearance:none;text-align:left;min-height:39px}
.v18 .v-pole-znach::placeholder{color:var(--v-tusk);opacity:1}
.v18 .v-pole-znach.pusto{color:var(--v-tusk)}
.v18 .v-pole.osh .v-pole-znach{border-bottom-color:var(--v-oshibka)}
.v18 .v-osh{font:400 13.5px var(--font-text);color:var(--v-oshibka);margin-top:5px}
.v18 .v-osh:empty{display:none}
/* the native picker (date, time) opens over the styled field (screen 06) */
.v18 .v-pole-znach input.v-sistemnyy{position:absolute;inset:0;width:100%;height:100%;opacity:0;
  border:0;padding:0;margin:0;font-size:16px;-webkit-appearance:none;appearance:none}

/* choice in a row: options that fit on one line (README 6) */
.v18 .v-vstroku{display:flex;flex-wrap:nowrap;gap:0 18px;margin-top:8px;white-space:nowrap}
.v18 .v-vstroku button{display:inline-block;padding:12px 0;font:400 16px var(--font-text);color:var(--v-tusk);
  background:none;border:0;border-radius:0;min-height:43px}
.v18 .v-vstroku button::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;
  border:1px solid var(--v-kruzhok);box-sizing:border-box;margin-right:7px;vertical-align:middle}
.v18 .v-vstroku button.on{color:var(--v-bordo)}
.v18 .v-vstroku button.on::before{width:6px;height:6px;border:0;background:var(--v-bordo)}
/* the row did not fit (a narrow phone): the same options become a list */
.v18 .v-vstroku.stolb{flex-direction:column;gap:0}
.v18 .v-vstroku.stolb button{text-align:left}

/* choice in a list: a ring when the answer is one, a square when several */
/* (the bottom sheet lives outside the screen: 69 - the statuses in it) */
.v18 .v-spisok,.v-list .v-spisok{margin-top:18px}
.v18 .v-spisok button,.v-list .v-spisok button{position:relative;display:block;width:100%;text-align:left;
  padding:12px 0 12px 28px;font:400 20px/1.25 var(--font-text);color:var(--v-chernila);
  background:none;border:0;border-bottom:1px solid var(--v-liniya-tonk);border-radius:0}
.v18 .v-spisok button::before,.v-list .v-spisok button::before{content:"";position:absolute;left:2px;top:16px;
  width:13px;height:13px;border-radius:50%;border:1.5px solid var(--v-tusk);box-sizing:border-box}
.v18 .v-spisok.mnogo button::before{border-radius:0}
.v18 .v-spisok button.on,.v-list .v-spisok button.on{color:var(--v-bordo)}
.v18 .v-spisok button.on::before,.v-list .v-spisok button.on::before{border-color:var(--v-bordo);
  background:var(--v-bordo)}

/* 11-13: the line under the question sits close to it (6px, as in the mockup) */
.v18 p.v-pod-voprosom{margin-top:6px}
.v18 .v-neskolko{font:600 14px/1.4 var(--font-text);color:var(--v-neskolko);margin:6px 0 0}
/* 13: the free answer - Forum on ruled lines, as in the mockup: the lines are
   hard stops of one pattern 36px high (a ruled sheet, not a gradient of colour) */
.v18 textarea.v-linii{display:block;width:100%;box-sizing:border-box;margin:20px 0 0;padding:0;
  min-height:144px;resize:none;border:0;border-bottom:1px solid var(--v-linii-niz);border-radius:0;
  outline:none;background:repeating-linear-gradient(transparent 0 35px,var(--v-linii) 35px 36px);
  font:400 22px/36px var(--font-display);color:var(--v-chernila);caret-color:var(--v-bordo);
  -webkit-appearance:none;appearance:none}

/* text under the fields */
.v18 .v-pomet{font:400 14px/1.4 var(--font-text);color:var(--v-vtor);margin:22px 0 0}

/* a link: underlined, the colour of the text, a tap area of at least 44px */
.v18 .v-ssylka{display:inline-flex;align-items:center;min-height:44px;font:400 15px var(--font-text);
  color:var(--v-chernila);text-decoration:underline;text-underline-offset:4px;background:none;border:0;padding:0}
.v18 .v-udalit{color:var(--v-tusk)}

/* "- N." : only when Natalchik speaks about herself (README 6) */
.v18 .v-n{font-style:normal;font-size:12.5px;color:var(--v-n-cvet);white-space:nowrap}

/* city suggestions under the field */
.v18 .v-podskazki{background:var(--v-podskazki);margin-top:4px}
.v18 .v-podskazki:empty{display:none}
.v18 .v-podskazki button{display:block;width:100%;text-align:left;padding:9px 12px;font:400 16px var(--font-text);
  color:var(--v-chernila);background:none;border:0;border-radius:0}
.v18 .v-podskazki button span{color:var(--v-tusk)}

/* the bottom sheet: dim under it, a bold title, a dark button, the second action as text */
.v-zatemnenie{position:fixed;inset:0;background:var(--v-zatemnenie);z-index:50}
.v-list{position:fixed;left:0;right:0;bottom:0;z-index:51;background:var(--v-list-fon);color:var(--v-chernila);
  padding:26px var(--v-pole) max(44px,calc(var(--niz-zapas) + 10px));font:400 15.5px/1.45 var(--font-text)}
.v-list .v-list-zag{font:600 21px/1.3 var(--font-text)}
.v-list p{margin:10px 0 0}
.v-list .v-list-da{display:flex;align-items:center;justify-content:center;width:100%;height:50px;margin-top:20px;
  font:400 16px var(--font-text);background:var(--v-knopka-fon);color:var(--v-knopka-tekst);border:0;border-radius:0}
.v-list .v-list-net{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;
  margin-top:6px;text-align:center;font:400 15px var(--font-text);color:var(--v-chernila);
  text-decoration:underline;text-underline-offset:4px;background:none;border:0}
/* 90: "Ne seychas" - the text 44px above the edge of the sheet (its tap area reaches lower) */
.v-list .v-list-net:not(.opasno){margin-bottom:-12px}
/* 21, 74: the deletion under the safe button - a block of the same height (v18) */
.v-list .v-list-net.opasno{color:var(--v-oshibka);text-decoration:none;min-height:50px;margin-top:20px;font-size:16px}

/* inline choice: a pixel tighter before it becomes a list; the parts of the day take two rows */
.v18 .v-vstroku.tesno{gap:0 12px}
.v18 .v-vstroku.perenos{flex-wrap:wrap;gap:8px 18px;white-space:normal}
.v18 .v-vstroku button small{font-size:12px;color:var(--v-shag);margin-left:4px}

.v18 .v-bordo{color:var(--v-bordo)}
.v18 .skrit{display:none}
.v18 .v-pole-bez-podpisi .v-pole,.v18 .v-pole-bez-podpisi.v-pole{margin-top:8px}
.v18 .v-vremya .v-pomet{margin-top:22px}
.v18 .v-gorod{position:relative}

/* ===== section 1: entry and the anketa (01-21) ===== */

/* 01: centered, as the entry is (README 6: centre only on the entry and the event screens) */
.v18.v-vhod .telo{text-align:center;padding-left:0;padding-right:0}
.v18 .v-vhod-nomer{margin-top:60px;font:400 14px var(--font-text)}
.v18 .v-vhod-temy{margin-top:22px;font:400 33px/1.08 var(--font-display)}
.v18 .v-vhod-pod{margin:22px 30px 0;font:400 15px/1.4 var(--font-text)}
.v18 .v-vhod-chat{margin:16px var(--v-pole) 0;text-align:left}
.v18 .v-vhod-vremya{margin-bottom:10px;text-align:center;font:400 13px/1.4 var(--font-text);color:var(--v-tusk)}

/* the address for someone who came from the bot without it */
.v18 .v-vopros-sverhu{height:38px}

/* 07: only for adults - the question lower, the text close under it */
.v18 .v-vzroslym{margin-top:130px}
.v18 .v-vzroslym-tekst{margin-top:14px}

/* 14: the crisis branch - no steps, the words lower; the number large, its words grey;
   "later" is a link centred above the button */
.v18 .v-krizis-zag{margin-top:110px}
.v18 .v-krizis-tekst{font:400 17px/1.5 var(--font-text);margin:14px 0 0}
.v18 .v-krizis-otvl{font:400 16px/1.5 var(--font-text);margin:12px 0 0}
.v18 .v-krizis-nomer{font:400 28px/1 var(--font-display);margin:16px 0 0;
  -webkit-user-select:text;user-select:text}
.v18 .v-krizis-pod{font:400 14px/1.4 var(--font-text);color:var(--v-vtor);margin:6px 0 0}
/* 14: the number is a link to call, as it looks on the mockup - large, not underlined (audit v18, 3.4) */
.v18 .v-krizis-zvonok{color:inherit;text-decoration:none}
.v18 .v-krizis-kop{margin-top:2px}
.v18 .v-krizis-pozzhe{display:flex;justify-content:center;width:100%;margin-bottom:2px}

/* 08: the first look - the date, "TY - LEV" large, the Moon and the ascendant,
   one fact, and the line about the three questions signed "- N." */
.v18 .v-prog.shir{margin-left:calc(-1 * var(--v-pole));margin-right:calc(-1 * var(--v-pole))}
.v18 .v-vzglyad-data{font:400 13.5px var(--font-text);color:var(--v-podpis);margin:30px 0 0}
.v18 .v-vzglyad-ty{font:400 64px/.92 var(--font-display);color:var(--v-bordo);margin:10px 0 0;
  text-transform:uppercase}
.v18 .v-vzglyad-ryad{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:16px}
.v18 .v-vzglyad-ty + .v-vzglyad-ryad{margin-top:26px}
.v18 .v-vzglyad-ryad b{font:400 21px var(--font-display);color:var(--v-chernila);text-transform:uppercase;
  flex:none}
.v18 .v-vzglyad-ryad span{font:400 15px var(--font-text);color:var(--v-tiho);text-align:right}
.v18 .v-vzglyad-fakt{font:400 17px/1.45 var(--font-text);color:var(--v-chernila);margin:26px 0 0}
.v18 .v-vzglyad-pod{font:400 15.5px/1.45 var(--font-text);color:var(--v-tiho);margin:14px 0 0}
.v18 .v-vzglyad-ryad + .v-vzglyad-pod{margin-top:26px}

/* ===== section 2: the reading (22-37), 20.10 ===== */

/* the dark screens (22-24 waiting, 25 ready) carry their own ink and the cream
   button; at night 25 is cream with dark ink and a dark button (README 4) */
.ekran.v18.temnyy,.ekran.v18.ritual{--v-chernila:#ECEDEA;--v-vtor:#B9BCB8;--v-knopka-fon:#E4D1A0;
  --v-knopka-tekst:#24272A;--v-n-cvet:#E4D1A0;--v-liniya-tonk:rgba(255,255,255,.14)}
:root[data-tema="noch"] .ekran.v18.ritual{--v-chernila:#24272A;--v-vtor:#5A5E5A;--v-knopka-fon:#191C1B;
  --v-knopka-tekst:#E4D1A0;--v-n-cvet:#8A1A2B}

/* the state line on top of 22-24 and the label of a chapter (30-33) */
.v18 .v-step{font:400 14px/17px var(--font-text);color:var(--v-vtor);margin:22px 0 0}
.v18 .v-gl-step{color:var(--v-chernila)}
:root[data-tema="noch"] .v18 .v-gl-step{color:var(--v-vtor)}

/* 22-24: writing */
.v18 .v-p-zag{font:400 32px/34.56px var(--font-display);color:var(--v-krem);margin:10px 0 0;white-space:pre-line}
.v18 .v-p-spisok{margin-top:20px}
.v18 .v-p-gl{font:400 26px/28.6px var(--font-display);text-transform:uppercase;color:rgba(236,230,214,.38);
  margin-top:4px}
.v18 .v-p-gl:first-child{margin-top:0}
.v18 .v-p-gl.gotov{color:var(--v-shalfey-tekst)}
.v18 .v-p-gl.tek{color:var(--v-krem)}
.v18 .v-p-gl small{display:inline-block;vertical-align:top;margin-left:8px;font:400 13px/16px var(--font-text);
  text-transform:none;color:var(--v-krem)}
.v18 .v-p-tekst{font:400 15.5px/22.475px var(--font-text);color:var(--v-vtor);margin:18px 0 0}
.v18 .v-p-ssylki{display:flex;flex-wrap:wrap;gap:0 22px;margin-top:6px}
.v18 .v-p-vtoroy{margin-top:56px}
.v18 .v-p-vtoroy .v-p-zag{margin-top:0}
.v18 .v-p-nabl b{display:block;font:400 21px/24.15px var(--font-display);color:var(--v-krem);margin-top:20px}
.v18 .v-p-nabl span{display:block;font:400 14.5px/21.025px var(--font-text);color:var(--v-shalfey-tekst);margin-top:4px}

/* 25: ready */
.v18 .v-g-skolko{font:400 14px/17px var(--font-text);color:var(--v-vtor);margin:120px 0 0;min-height:17px}
.v18 .v-g-zag{font:400 42px/42.84px var(--font-display);text-transform:uppercase;color:var(--v-krem);
  margin:10px 0 0;white-space:pre-line}
:root[data-tema="noch"] .v18 .v-g-zag{color:var(--v-chernila)}

/* 26 and the system screens by its pattern */
.v18 .v-o-zag{font:400 42px/42.84px var(--font-display);text-transform:uppercase;margin:150px 0 0;
  white-space:pre-line}
.v18 .v-o-tekst{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:16px 0 0}
.v18 .v-o-slova{font:400 17px/1.5 var(--font-text);margin:150px 0 0;white-space:pre-line}
.v18 .v-o-tekst + .v-ssylka{margin-top:4px}

/* 27-29, 34, 36, 37: the header of a service screen and its line under it */
.v18 .v-r-shapka{font:600 17px/22px var(--font-text);margin:10px 0 0;padding-bottom:10px;
  border-bottom:1px solid rgba(36,39,42,.15)}
:root[data-tema="noch"] .v18 .v-r-shapka{border-bottom-color:rgba(231,229,223,.16)}
.v18 .v-r-pod{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:6px 0 0}
.v18 .v-r-plashka{margin:10px 0 0;padding:10px 12px;background:rgba(138,26,43,.08);font:400 15px/21px var(--font-text)}
.v18 .v-r-perepisat{display:block;padding:0;margin:0;background:none;border:0;font:400 15px/21px var(--font-text);
  color:var(--v-bordo)}
.v18 .v-r-spisok{margin-top:18px}
.v18 .v-r-el{display:flex;align-items:center;width:100%;min-height:34px;padding:0;margin:0;background:none;border:0;
  border-radius:0;text-align:left;font:400 17px var(--font-text);color:var(--v-chernila)}
.v18 .v-r-el .n{flex:none;width:26px;font:400 13px var(--font-text);color:var(--v-tusk)}
.v18 .v-r-el .nm{flex:1}
.v18 .v-r-el .st{flex:none;margin-left:12px;font:400 13px var(--font-text);color:var(--v-tusk)}
.v18 .v-r-el.prochitano .nm{color:var(--v-prochitano)}
.v18 .v-r-el.tek .nm{color:var(--v-bordo)}
.v18 .v-r-el.tek .st{color:var(--v-bordo-m)}
/* night, as natalchik-v18-night.html (audit v18, 4): the number and the dash stay #6E7275, the
   state is secondary; "chitat'"/"seychas" - the light bordeaux, "Perepisat'" - the main one */
:root[data-tema="noch"] .v18 .v-r-el .n{color:#6E7275}
:root[data-tema="noch"] .v18 .v-r-el .st{color:var(--v-vtor)}
:root[data-tema="noch"] .v18 .v-r-el.tek .st{color:var(--v-bordo-m)}
.v18 .v-r-el.zhdyot{opacity:.6;cursor:default}
.v18 .v-r-ssylki{margin-top:12px;display:flex;flex-direction:column;align-items:flex-start}
/* the links look 30 px high, as on the mockup, but take a tap of a finger - 44 px (audit v18, 4) */
.v18 .v-r-ssylki .v-ssylka{min-height:30px;position:relative}
.v18 .v-r-ssylki .v-ssylka::after{content:'';position:absolute;left:-8px;right:-8px;top:-7px;bottom:-7px}
/* links one under another: the lower one does not reach up over the upper one - the
   lower part of "Pasport karty" opened "Prezhnie razbory" (stand 08.11) */
.v18 .v-r-ssylki .v-ssylka + .v-ssylka::after{top:0}
/* 29: the line on top - the list is tighter, as on the mockup (.toc.tight: 28 px rows) */
.v18 .v-r-spisok.tesno{margin-top:8px}
.v18 .v-r-spisok.tesno .v-r-el{min-height:28px}

/* a skeleton of pale bars while loading (decisions: "not a pale copy of the screen") */
.v18 .v-zagruzka{margin-top:24px}
.v18 .v-zagruzka i{display:block;height:14px;margin-top:14px;background:var(--v-liniya-tonk)}
.v18 .v-zagruzka i:nth-child(2){width:80%}
.v18 .v-zagruzka i:nth-child(3){width:60%}

/* 30-33: a chapter; its label and the line of progress stay on top while it is read */
.v18 .v-gl-verh{position:sticky;top:0;z-index:2;background:var(--v-fon-ekrana);
  margin:0 calc(-1 * var(--v-pole));padding:0 var(--v-pole) 0}
.v18 .v-gl-verh .v-gl-step{padding-top:22px;margin-top:0}
.v18 .v-gl-prog{height:2px;background:var(--v-liniya-tonk);margin-top:6px}
.v18 .v-gl-prog i{display:block;height:2px;width:0;background:var(--v-prog)}
.v18 .v-gl-tema{font:400 32px/32px var(--font-display);text-transform:uppercase;margin:8px 0 0}
.v18 .v-gl-tri{font:400 26px/1.15 var(--font-display);margin:10px 0 0}
.v18 .v-gl-pod{font:400 20px/23px var(--font-display);color:var(--v-tusk);margin:4px 0 0}
.v18 .v-gl-osnova{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:10px 0 0}
.v18 .v-gl-pz{font:600 16px/1.35 var(--font-text);margin:24px 0 0}
.v18 .v-gl-lead{font:400 19px/27.55px var(--font-text);margin:18px 0 0}
.v18 .v-gl-mysl{font:400 22px/26.4px var(--font-display);color:var(--v-bordo);margin:12px 0 0 22px}
.v18 .v-gl-pochemu{font-size:14px;margin-top:2px}
.v18 .v-gl-p{font:400 15.5px/24.025px var(--font-text);margin:14px 0 0}
.v18 .v-gl-pz + .v-gl-mysl,.v18 .v-gl-pz + .v-gl-lead,.v18 .v-gl-pz + .v-gl-p{margin-top:8px}
.v18 .v-gl-ov{font:400 13.5px/19px var(--font-text);color:var(--v-vtor);margin:10px 0 0}
.v18 .v-gl-ov b{font-weight:600}
.v18 .v-gl-kalendar{margin-top:18px}
.v18 .v-gl-para{margin-top:26px;padding-top:2px;border-top:1px solid rgba(36,39,42,.18)}
:root[data-tema="noch"] .v18 .v-gl-para{border-top-color:rgba(255,255,255,.14)}
.v18 .v-gl-para ul.punkty{margin:10px 0 0;padding-left:18px;font:400 15.5px/24px var(--font-text)}

/* 31: "pochemu tak" - the bottom sheet */
.v-list.v-pt p{margin:0}
.v-list .v-pt-citata{font:400 15.5px/22.475px var(--font-text);color:var(--v-vtor);margin-top:8px !important}
.v-list .v-pt-cap{font:400 13.5px/16px var(--font-text);color:var(--v-podpis);margin-top:14px}
.v-list .v-pt-p{font:400 15.5px/22.475px var(--font-text);margin-top:2px !important}
.v-list .v-pt-pod{font:400 13px/18.85px var(--font-text);color:var(--v-vtor);margin-top:12px !important}

/* 32: "eto pro tebya?" */
.v18 .v-ot{margin-top:26px;padding-top:17px;border-top:1px solid rgba(36,39,42,.18)}
:root[data-tema="noch"] .v18 .v-ot{border-top-color:rgba(255,255,255,.14)}
.v18 .v-ot-vopros{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:0}
.v18 .v-ot .v-vstroku{margin-top:2px}
.v18 .v-ot-utochnit{font-size:14px}
.v18 textarea.v-ot-pole{min-height:108px;margin-top:4px}
.v18 .v-ot-uchtu{font:400 15.5px/22.475px var(--font-text);margin:10px 0 0}
:root[data-tema="noch"] .v18 .v-ot-uchtu{color:var(--v-vtor)}

/* 33: the end of the reading */
.v18 .v-k-prochitan{font:400 20px/23px var(--font-display);text-align:center;margin:16px 0 0}
.v18 .v-k-dalshe{margin-top:26px;padding-top:17px;border-top:1px solid rgba(36,39,42,.18)}
:root[data-tema="noch"] .v18 .v-k-dalshe{border-top-color:rgba(255,255,255,.14)}
.v18 .v-k-cap{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:0}
.v18 .v-k-etap{font:400 36px/36px var(--font-display);text-transform:uppercase;color:var(--v-bordo);margin:10px 0 0}
.v18 .v-k-tekst{font:400 15.5px/22.475px var(--font-text);margin:8px 0 0}
.v18 .v-k-domoy{font-size:16px;margin-top:8px}

/* 34-36: the passport; the wheel in our own graphics */
.v18 .v-ps-kol{display:block;margin:18px auto 0;padding:0;background:none;border:0;color:var(--v-chernila)}
.v18 .v-ps-koleso{display:block;width:170px;height:170px;color:var(--v-chernila);overflow:visible}
/* 35: as on the mockup - 320 wide, past the side gutter of the page (10 px from the edge on a
   340 phone), 40 below the caption (audit v18, 4: it was the width of the text column) */
.v18 .v-ps-koleso.krupno{width:calc(100vw - 20px);max-width:320px;height:auto;margin:40px 0 0;
  position:relative;left:50%;transform:translateX(-50%)}
.v18 .v-ps-koleso text{font-family:var(--font-text)}
.v18 .v-ps-koleso .v-ps-znak,.v18 .v-ps-koleso .v-ps-imya{font-family:var(--font-display)}
.v18 .v-ps-koleso .v-ps-bordo{fill:var(--v-bordo);stroke:var(--v-bordo)}
.v18 .v-ps-koleso text.v-ps-bordo{stroke:none}
.v18 .v-ps-ryady{margin-top:20px}
.v18 .v-ps-ryad{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:16px}
.v18 .v-ps-ryad:first-child{margin-top:0}
.v18 .v-ps-ryad b{font:400 21px/24px var(--font-display);text-transform:uppercase;flex:none}
.v18 .v-ps-ryad span{font:400 15px/19px var(--font-text);text-align:right}
/* 34, 36 at night: the column of the signs is secondary, as on the night mockup (audit v18, 4) */
:root[data-tema="noch"] .v18 .v-ps-ryad span{color:var(--v-vtor)}
.v18 .v-ps-ryad.sofia b{font:500 17px/22.1px var(--font-text);text-transform:none}
.v18 .v-ps-nuzhno{padding:0;background:none;border:0;font:400 15px/19px var(--font-text);color:var(--v-bordo);
  text-decoration:underline;text-underline-offset:4px}
:root[data-tema="noch"] .v18 .v-ps-nuzhno{color:var(--v-vtor)}
.v18 .v-ps-ryady + .v-ps-eshche{margin-top:2px}
.v18 .v-ps-eshche{text-align:left;line-height:27px}
.v18 .v-ps-placidus{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:10px 0 0}
.v18 .v-ps-centr{text-align:center;margin-top:18px}
.v18 .v-ps-imya-data{font:400 13.5px/16px var(--font-text);color:var(--v-podpis);margin:18px 0 0}

/* 37: previous readings */
.v18 .v-ar-ryady{margin-top:20px}
.v18 .v-ar-ryad{display:flex;justify-content:space-between;align-items:baseline;gap:12px;width:100%;
  min-height:42px;padding:10px 0;margin:0;background:none;border:0;border-radius:0;text-align:left;
  color:var(--v-chernila)}
.v18 .v-ar-ryad b{font:500 17px/22.1px var(--font-text)}
.v18 .v-ar-ryad span{font:400 15px/19px var(--font-text);text-align:right}
.v18 .v-ar-ryad.aktivnyy{color:var(--v-bordo)}
.v18 .v-ar-pod{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:14px 0 0}

/* ===== section 3: the main screen and the word of the day (15, 40-49), 28.10 ===== */

/* 15: what to send to the chat - the note closer to the options than on 11-13 */
.v18 .v-s-pod{margin-top:16px}
.v18 .v-s-myagko{margin-top:12px}

/* 40: the date, the word 60 bordeaux with the line drawn by hand, the text 17/1.42 */
.v18 .v-d-data{font:400 13.5px/16px var(--font-text);color:var(--v-podpis);margin:20px 0 0}
.v18 .v-d-slovo{font:400 60px/.9 var(--font-display);color:var(--v-bordo);margin:8px 0 0}
.v18 .v-d-wd{position:relative;display:inline-block}
.v18 .v-d-wd svg{position:absolute;left:-2px;bottom:-6px;width:calc(100% + 4px);height:14px;overflow:visible}
.v18 .v-d-tekst{font:400 17px/1.42 var(--font-text);margin:12px 0 0}
.v18 .v-d-zhdu{margin-top:12px}
.v18 .v-d-net{font:400 15px/1.45 var(--font-text);color:var(--v-vtor);margin:12px 0 0}
/* a link in a line of text: the line keeps its height, the tap area grows
   by an invisible layer 12px above and below (a button inline is a block in the line) */
.v18 .v-d-ssylki{margin-top:6px;line-height:19px}
.v18 .v-d-ssylki .v-ssylka,.v18 .v-d-dni .v-ssylka{display:inline;min-height:0;padding:0;line-height:19px;
  position:relative;vertical-align:baseline}
.v18 .v-d-ssylki .v-ssylka::after,.v18 .v-d-dni .v-ssylka::after,.v18 .v-d-izm::after,.v18 .v-d-pt-svernut::after{
  content:"";position:absolute;left:0;right:0;top:-12px;bottom:-12px}

/* 42: "Pochemu tak" opens in place, between two thin lines */
.v18 .v-d-pochemu{margin-top:10px;padding:10px 0 2px;border-top:1px solid rgba(36,39,42,.14);
  border-bottom:1px solid rgba(36,39,42,.14)}
:root[data-tema="noch"] .v18 .v-d-pochemu{border-color:rgba(255,255,255,.14)}
.v18 .v-d-pt-ryad{display:flex;justify-content:space-between;align-items:baseline;margin-top:22px;
  font:400 13.5px/16px var(--font-text);color:var(--v-podpis)}
.v18 .v-d-pt-svernut{position:relative;padding:0;background:none;border:0;font:inherit;color:inherit}
.v18 .v-d-pt{font:400 15px/1.45 var(--font-text);margin:6px 0 8px}
.v18 .v-d-pt-kn{font:400 14px/1.45 var(--font-text);color:var(--v-vtor);margin:0 0 8px}

/* 40: the question and the field of the answer in one line; 44: the answer in its place */
.v18 .v-d-vopros{display:block;font:400 15px/19px var(--font-text);margin:12px 0 0}
.v18 input.v-d-pole{display:block;width:100%;box-sizing:border-box;margin:4px 0 0;padding:0 0 7px;
  font:400 16px/19px var(--font-text);color:var(--v-chernila);background:none;border:0;
  border-bottom:1px solid var(--v-liniya);border-radius:0;outline:0;caret-color:var(--v-bordo);
  -webkit-appearance:none;appearance:none}
.v18 input.v-d-pole::placeholder{color:var(--v-pusto);opacity:1}
.v18 .v-d-otvet{display:flex;gap:14px;align-items:baseline;margin-top:12px;font:400 15px/19px var(--font-text)}
.v18 .v-d-ty{color:var(--v-tusk)}
.v18 .v-d-izm{position:relative;flex:none;margin-left:auto;padding:0;background:none;border:0;
  font:400 13.5px var(--font-text);color:var(--v-podpis);text-decoration:underline;text-underline-offset:4px}

/* 40-49: the sections - Forum 32, black; one bordeaux (README v18, "Bordo") */
.v18 .v-d-razdely{display:grid;gap:4px;margin-top:20px}
.v18 .v-d-razdel{display:block;width:100%;text-align:left;padding:0;margin:0 0 6px;background:none;border:0;
  border-radius:0;color:var(--v-chernila)}
.v18 .v-d-razdel .z{display:block;font:400 32px/.98 var(--font-display)}
.v18 .v-d-razdel small{display:block;font:400 13.5px/1.2 var(--font-text);padding-top:2px;color:var(--v-vtor)}
.v18 .v-d-razdel.bordo .z{color:var(--v-bordo)}
.v18 .v-d-razdel.bordo small{color:var(--v-bordo-m)}
.v18 .v-d-dni{font:400 13.5px/19px var(--font-text);color:var(--v-podpis);margin:6px 0 0}
.v18 .v-d-dni .v-ssylka{font-size:15px;color:inherit}

/* 45: past days - the word and the day; a day she did not come to is pale */
.v18 .v-pd-ryady{display:grid;margin-top:18px}
.v18 .v-pd-ryad{display:flex;justify-content:space-between;align-items:baseline;gap:12px;width:100%;
  min-height:35px;padding:0 0 11px;margin:0;background:none;border:0;border-radius:0;text-align:left;
  color:var(--v-chernila)}
.v18 .v-pd-ryad b{font:400 24px/1 var(--font-display)}
.v18 .v-pd-ryad span{font:400 13.5px/16px var(--font-text);color:var(--v-podpis);text-align:right}
.v18 .v-pd-ryad.segodnya b{color:var(--v-bordo)}
.v18 .v-pd-ryad.bledno{opacity:var(--v-bledno)}

/* 46: a day from the archive; the neighbour days below, to turn the pages */
.v18 .v-dn-slovo{font:400 48px/.9 var(--font-display);margin:18px 0 0}
.v18 .v-dn-tekst{font:400 18px/1.45 var(--font-text);margin:14px 0 0}
.v18 .v-dn-cap{font:400 13.5px/16px var(--font-text);color:var(--v-podpis);margin:22px 0 0}
.v18 .v-dn-otvet{margin-top:6px;padding:10px 12px;background:rgba(36,39,42,.055)}
:root[data-tema="noch"] .v18 .v-dn-otvet{background:rgba(255,255,255,.08)}
.v18 .v-dn-otvet p{font:400 15.5px/1.55 var(--font-text);margin:0}
.v18 .v-dn-sosedi{display:flex;justify-content:space-between;align-items:flex-start;margin-top:40px}
.v18 .v-dn-sosed{display:flex;flex-direction:column;align-items:flex-start;padding:0;margin:0;background:none;
  border:0;border-radius:0;text-align:left;color:var(--v-tusk)}
.v18 .v-dn-sosed + .v-dn-sosed,.v18 .v-dn-sosedi span + .v-dn-sosed{align-items:flex-end;text-align:right}
.v18 .v-dn-sosed b{display:block;font:400 22px var(--font-display)}
.v18 .v-dn-sosed small{display:block;font:400 13.5px/16px var(--font-text);color:var(--v-podpis);margin-top:2px}
.v18 .v-dn-sosed.segodnya b{color:var(--v-bordo)}

/* ===== section 4: forecasts (51-59), 28.10 ===== */

/* 51, 52: the list - Forum 30 titles, bordeaux only for a new one; the verb in bordeaux */
.v18 .v-pg-n{font:400 30px/30px var(--font-display);margin:20px 0 0}
.v18 .v-pg-n small{display:inline-block;vertical-align:top;margin-left:8px;font:400 13.5px/16px var(--font-text)}
.v18 .v-pg-punkt.bordo .v-pg-n{color:var(--v-bordo)}
.v18 .v-pg-d{font:400 14.5px/21.025px var(--font-text);margin:6px 0 0}
.v18 .v-pg-go{position:relative;display:block;padding:0;margin:6px 0 0;background:none;border:0;border-radius:0;
  font:400 14.5px/17px var(--font-text);color:var(--v-bordo);text-align:left}
.v18 .v-pg-go::after,.v18 .v-pg-svernut::after{content:"";position:absolute;left:-6px;right:-6px;top:-13px;bottom:-13px}
.v18 .v-pg-cap{font:400 13.5px/16px var(--font-text);color:var(--v-podpis);margin:0}
.v18 .v-pg-punkt + .v-pg-cap{margin-top:22px}
.v18 .v-pg-gde{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:18px 0 0}
.v18 .v-pg-prezhnie{margin-top:26px}
.v18 .v-pg-prezhnie + .v-ar-ryady{margin-top:6px}

/* 53, 54: the item opened in place - the titles 34, the opened one bordeaux with "svernut'" */
.v18 .v-pg-t{display:block;width:100%;padding:0;margin:16px 0 0;background:none;border:0;border-radius:0;
  text-align:left;font:400 34px/34px var(--font-display);color:var(--v-chernila)}
.v18 .v-pg-t.bordo{color:var(--v-bordo);width:auto;margin:0}
.v18 .v-pg-raskryt{margin-top:16px}
.v18 .v-pg-svyornut + .v-pg-raskryt{margin-top:12px}
.v18 .v-pg-raskryt + .v-pg-t{margin-top:26px}
.v18 .v-pg-ryad{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.v18 .v-pg-svernut{position:relative;flex:none;padding:0;background:none;border:0;
  font:400 14px/19.6px var(--font-text);color:var(--v-vtor)}
.v18 .v-pg-p{font:400 16px/24px var(--font-text);margin:12px 0 0}
.v18 .v-pg-pass{margin-top:14px}
.v18 .v-pg-pass.god{margin-top:12px}
.v18 .v-pg-pass > div{padding:8px 0;line-height:19px}
.v18 .v-pg-pass span{font:400 15px/19px var(--font-text)}
:root[data-tema="noch"] .v18 .v-pg-pass span{color:var(--v-vtor)}
.v18 .v-pg-skoro{font:italic 400 14.5px/17px var(--font-text);color:var(--v-podpis);margin:16px 0 0}
.v18 .v-pg-pass.god + .v-pg-skoro{margin-top:14px}
/* 54: this year or the next one - only when the birthday is less than two months away */
.v18 .v-pg-vybor{display:flex;flex-wrap:wrap;gap:0 18px}
.v18 .v-pg-pass > .v-pg-vybor{padding:0}
.v18 .v-pg-vybor button{display:inline-block;padding:8px 0;font:400 15px/19px var(--font-text);color:var(--v-tusk);
  background:none;border:0;border-radius:0}
.v18 .v-pg-vybor button.on{color:var(--v-bordo)}
.v18 .v-pg-vybor button.on::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--v-bordo);margin-right:7px;vertical-align:middle}

/* 58: writing a forecast - dark in both themes: accepted, writing, ready */
.v18 .v-pp-zag{font:400 32px/34.56px var(--font-display);color:var(--v-krem);margin:40px 0 0}
.v18 .v-pp-daty{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:6px 0 0}
.v18 .v-pp-shagi{margin-top:24px}
.ekran.v18.temnyy{--v-pp-dalshe:#A3A8A3}
.v18 .v-pp-shagi div{font:400 42px/44.52px var(--font-display);color:var(--v-pp-dalshe)}
.v18 .v-pp-shagi div.ok{color:var(--v-shalfey-tekst)}
.v18 .v-pp-shagi div.now{color:var(--v-krem)}
.v18 .v-pp-tekst{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:22px 0 0}

/* 59, 56, 57: reading - the title, the dates, the tabs; a block between two thin
   lines ("Korotko", the days of the pair); the first paragraph larger, the
   phrase-support in Forum bordeaux after it */
.v18 .v-pg-zag{font:400 32px/32px var(--font-display);margin:6px 0 0}
.v18 .v-pg-zag.krupno{font-size:44px;line-height:44px}
.v18 .v-pg-pod{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:6px 0 0}
.v18 .v-pg-vkladki{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px}
.v18 .v-pg-zag.krupno ~ .v-pg-vkladki{margin-top:10px}
.v18 .v-pg-vkladki button{display:inline-block;padding:12px 0;font:400 16px/19px var(--font-text);color:var(--v-tusk);
  background:none;border:0;border-radius:0}
.v18 .v-pg-vkladki button.on{color:var(--v-bordo)}
.v18 .v-pg-vkladki button.on::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--v-bordo);margin-right:7px;vertical-align:middle}
.v18 .v-pg-blok{margin-top:14px;padding:10px 0;border-top:1px solid rgba(36,39,42,.14);
  border-bottom:1px solid rgba(36,39,42,.14);font:400 15px/22.5px var(--font-text)}
:root[data-tema="noch"] .v18 .v-pg-blok{border-color:rgba(255,255,255,.14)}
.v18 .v-pg-blok.kor{line-height:21.75px}
.v18 .v-pg-blok .v-pg-cap + div{margin:0}
.v18 .v-pg-blok div + .v-pg-cap{margin-top:8px}
.v18 .v-pg-tekst{margin-top:14px}
.v18 .v-pg-tekst .v-gl-lead{margin:0}
.v18 .v-pg-tekst .v-gl-mysl{margin:12px 0 0 22px}
.v18 .v-pg-tekst .v-gl-p{margin:12px 0 0}
.v18 .v-pg-tekst .v-gl-mysl + .v-gl-p{margin-top:18px}
.v18 .v-pg-den{font:400 15px/22.5px var(--font-text);margin:10px 0 0}
.v18 .v-pg-den b{font-weight:500}
.v18 .v-pg-vkladki + .v-pg-den{margin-top:14px}
.v18 .v-pg-raschet{font:400 13.5px/19px var(--font-text);color:var(--v-podpis);margin:18px 0 0}
/* 96 Nebo: the lines of "Seychas u tebya" - what and about what heavier, the dates plain;
   the line of the planets going back - first and quieter; the links "Ves' kalendar'" and
   "Pochemu tak?" - as at the word of the day (41) */
.v18 .v-nb-s{font:400 15px/22.5px var(--font-text);margin:10px 0 0}
.v18 .v-nb-s b{font-weight:500}
.v18 .v-nb-s.retro{color:var(--v-vtor)}
.v18 .v-nb-s.retro b{font-weight:400}
.v18 .v-pg-blok.v-nb .v-pg-cap + p{margin-top:6px}
.v18 .v-nb-ssylki{margin-top:12px}

/* 55: "My s toboy" - what it is, for how long and where it is kept */
.v18 .v-mt-zag{font:400 40px/40px var(--font-display);margin:20px 0 0}
.v18 .v-mt-bez{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:16px 0 0}

/* ===== section 5 (29.10): people, invitations, "share" (16-21, 41, 43, 60-77) ===== */
/* 60: the list - "Lichnoe" and "Blizkie", a name in Forum, its line under it;
   the line of the day of a pair or a new pair in bordeaux, the gone ones pale */
:root{--v-l-pod:#6B6F72;--v-oblozhka:#3E4642;--v-oblozhka-tekst:#E4D1A0;--v-ramka:rgba(36,39,42,.15);
  --v-tumbler:rgba(36,39,42,.2);--v-plashka:rgba(138,26,43,.08)}
:root[data-tema="noch"]{--v-oblozhka:#E4D1A0;--v-oblozhka-tekst:#191C1B;--v-ramka:rgba(231,229,223,.16);
  --v-tumbler:rgba(255,255,255,.2)}
.v18 .v-l-gr{font:400 13px/16px var(--font-text);color:var(--v-shag);margin:16px 0 0}
.v18 .v-l-r{display:block;width:100%;text-align:left;padding:0;margin:12px 0 0;background:none;border:0;
  border-radius:0;color:var(--v-chernila)}
.v18 .v-l-gr + .v-l-r{margin-top:2px}
.v18 .v-l-r b{display:block;font:400 30px/30px var(--font-display);text-transform:uppercase;font-weight:400}
.v18 .v-l-r small{display:block;margin-top:3px;font:400 13px/16.9px var(--font-text);color:var(--v-l-pod)}
.v18 .v-l-r.bordo b{color:var(--v-bordo)}
.v18 .v-l-r.bordo small{color:var(--v-bordo-m)}
.v18 .v-l-r.bledno{opacity:.5}
/* a link standing alone: the line keeps the height of its text, the tap area
   grows by an invisible layer above and below */
.v18 .v-l-prigl,.v18 .v-n-ssylka,.v18 .v-p-kak,.v18 .v-k-ssylka,.v18 .v-s-kartinka,.v18 .v-vzglyad-kartinka,
.v18 .v-k-kartinka{display:inline-block;min-height:0;line-height:19px;position:relative}
.v18 .v-l-prigl::after,.v18 .v-n-ssylka::after,.v18 .v-p-kak::after,.v18 .v-k-ssylka::after,
.v18 .v-s-kartinka::after,.v18 .v-vzglyad-kartinka::after,.v18 .v-k-kartinka::after,.v18 .v-k-pochemu::after,
.v18 .v-n-drugoe::after{content:"";position:absolute;left:0;right:0;top:-12px;bottom:-12px}
.v18 .v-l-prigl{margin-top:20px}
/* 61, 62: nobody yet */
.v18 .v-l-pusto{font:400 38px/38.76px var(--font-display);text-transform:uppercase;white-space:pre-line;
  margin:90px 0 0}
.v18 .v-l-pusto-tekst{font:400 15.5px/22.475px var(--font-text);color:var(--v-tiho);margin:14px 0 0}
.v18 .v-l-pusto-tekst + .v-l-prigl{margin-top:20px}

/* 63, 64: a new person - small fields (Forum 22), "how to read" in one row */
.v18 .v-pole.sm{margin-top:14px}
.v18 .v-pole.sm .v-pole-znach{font-size:22px;line-height:25.3px;padding:0 0 4px;min-height:30.3px}
.v18 .v-pole.sm .v-pole-znach .v-tusk,.v18 .v-tusk{color:var(--v-tusk)}
.v18 .v-n-rod,.v18 .v-n-kak,.v18 .v-n-status{margin-top:14px}
.v18 .v-n-status:empty{display:none}
.v18 .v-n-kak .v-osh:empty{display:none}
.v18 .v-n-kak-ryad{display:flex;justify-content:space-between;align-items:baseline;margin-top:2px;padding:0 0 4px;
  border-bottom:1px solid var(--v-liniya);font:400 16px/19px var(--font-text)}
.v18 .v-n-drugoe{display:inline;min-height:0;font-size:14px;line-height:19px;position:relative}
.v18 .v-n-hvatit{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:8px 0 0}
.v18 .v-n-ssylka{margin-top:12px}
/* 64: love chosen - the screen is denser, as in the mockup */
.v18.v-n-tesno .v-vstroku button{padding:7px 0;min-height:33px}
.v18.v-n-tesno .v-pole.sm,.v18.v-n-tesno .v-n-rod,.v18.v-n-tesno .v-n-kak,.v18.v-n-tesno .v-n-status{margin-top:12px}
.v18.v-n-tesno .v-n-status .v-vstroku{margin-top:8px}

/* 65: invite by a link */
.v18 .v-r-shapka + .v-r-pod{margin-top:8px}
.v18 .v-p-kak{margin-top:10px}
.v18 .v-p-kak + .v-pole.sm{margin-top:22px}
.v18 .v-p-ssylka{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:2px;
  padding:2px 0 6px;border-bottom:1px solid var(--v-liniya);font:400 16px/19px var(--font-text)}
.v18 .v-p-ssylka span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v18 .v-p-kopirovat{flex:none;padding:0;margin:0;background:none;border:0;font:400 16px/19px var(--font-text);
  color:var(--v-bordo);position:relative}
.v18 .v-p-kopirovat::after{content:"";position:absolute;left:-8px;right:-8px;top:-12px;bottom:-12px}
.v18 .v-pole.sm + .v-step{margin-top:24px;color:var(--v-tiho)}
.v18 .v-p-ryad{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 0}
.v18 .v-step + .v-p-ryad{margin-top:4px}
.v18 .v-p-ryad b{font:500 17px/22.1px var(--font-text)}
.v18 .v-p-ryad span{font:400 15px/19px var(--font-text);text-align:right}
.v18 .v-p-ryad.bordo{color:var(--v-bordo)}
.v18 .v-p-deystviya{display:flex;flex-wrap:wrap;gap:12px 20px;margin-top:10px}
.v18 .v-p-deystviya .v-ssylka{min-height:0;line-height:19px;position:relative}
.v18 .v-p-deystviya .v-ssylka::after{content:"";position:absolute;left:0;right:0;top:-12px;bottom:-12px}

/* 67-73, 20: the card of a person - the name, what she is to you, the rows */
.v18 .v-k-imya{font:400 52px/52px var(--font-display);text-transform:uppercase;margin:12px 0 0}
.v18 .v-k-imya.mel{font-size:44px;line-height:44px}
.v18 .v-k-pod{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:6px 0 0}
.v18 .v-k-plashka{margin:10px 0 0;padding:10px 12px;background:var(--v-plashka);font:400 15px/21px var(--font-text)}
.v18 .v-k-ssylka{margin-top:8px}
.v18 .v-k-pod13{font:400 13px/18.2px var(--font-text);color:var(--v-vtor);margin:6px 0 0}
.v18 .v-k-r{display:block;width:100%;text-align:left;padding:0;margin:18px 0 0;background:none;border:0;border-radius:0;
  color:var(--v-chernila)}
.v18 .v-k-pod + .v-k-r,.v18 .v-k-pod13 + .v-k-r,.v18 .v-p-deystviya + .v-k-r{margin-top:26px}
.v18 .v-k-ssylka + .v-k-r,.v18 .v-k-plashka + .v-k-r{margin-top:22px}
.v18 .v-k-r b{display:block;font:400 30px/29.4px var(--font-display);text-transform:uppercase;font-weight:400}
.v18 .v-k-r small{display:block;padding-top:3px;font:400 14px/16.8px var(--font-text);color:var(--v-vtor)}
.v18 .v-k-r.bordo b{color:var(--v-bordo)}
.v18 .v-k-r.bordo small{color:var(--v-bordo-m)}
.v18 .v-k-den{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:14px 0 0}
.v18 .v-k-r + .v-k-den{margin-top:26px}
.v18 .v-k-pochemu{display:inline;min-height:0;padding:0;font-size:15px;line-height:19px;color:inherit;
  position:relative;vertical-align:baseline}
.v18 .v-k-vidit{margin-top:28px}
.v18 .v-k-ssylki{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:30px}
.v18 .v-k-ssylki .v-ssylka{min-height:0;line-height:19px;position:relative}
.v18 .v-k-ssylki .v-ssylka::after{content:"";position:absolute;left:0;right:0;top:-12px;bottom:-12px}
.v18 .v-k-imya.mel + .v-k-pod + .v-k-ssylki{margin-top:60px}
.v18 .v-k-r + .v-k-ssylki{margin-top:48px}
/* audit v18, 1.5: "Pokhozhe, Olya u tebya uzhe est'" - the two answers inside the plate */
.v18 .v-k-dvoynik .v-k-ssylki{margin-top:10px}
.v18 .v-k-dvoynik .v-k-ssylka{margin-top:0}
/* 69: the statuses in the bottom sheet */
.v-list .v-spisok{margin-top:4px}

/* 75, 76: the compatibility - the cover up to the top edge (the header of
   Telegram takes its colour), three spheres in words, the chosen in bordeaux */
.ekran.v18.v-s-ekran{--v-fon-ekrana:var(--v-oblozhka);--v-fon-niza:var(--v-bumaga);background:var(--v-bumaga)}
.v18 .v-s-obl{margin:calc(-1 * var(--verh-zapas)) calc(-1 * var(--v-pole)) 0;
  padding:calc(var(--verh-zapas) + 14px) var(--v-pole) 24px;background:var(--v-oblozhka);color:var(--v-oblozhka-tekst)}
.v18 .v-s-lab{font:400 13.5px/16px var(--font-text);opacity:.85}
.v18 .v-s-fraza{font:400 28px/33.04px var(--font-display);margin:8px 0 0}
.v18 .v-s-sfery{margin-top:30px}
.v18 .v-s-sf{display:flex;justify-content:space-between;align-items:baseline;gap:12px;width:100%;padding:0;margin:0;
  background:none;border:0;border-radius:0;color:var(--v-chernila);text-align:left}
.v18 .v-s-sf + .v-s-sf{margin-top:20px}
.v18 .v-s-sf b{font:400 26px/30px var(--font-display);text-transform:uppercase;font-weight:400}
.v18 .v-s-sf span{font:400 15px/19px var(--font-text);text-align:right}
.v18 .v-s-sf.on{color:var(--v-bordo)}
.v18 .v-s-p{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:14px 0 0}
.v18 .v-s-sfery + .v-s-p{margin-top:24px}
.v18 .v-s-p.temno{color:var(--v-chernila)}
.v18 .v-s-p.blizko{margin-top:4px}
.v18 .v-s-p13{font:400 13px/18.2px var(--font-text);color:var(--v-vtor);margin:14px 0 0}
.v18 .v-s-cap{font:400 13.5px/16px var(--font-text);color:var(--v-podpis);margin:14px 0 0}
.v18 .v-s-kartinka{margin-top:14px}
:root[data-tema="noch"] .v18 .v-s-p.temno{color:var(--v-vtor)}
/* the reading of the pair whole: the column of reading of the chapters (31) */
.v18 .v-s-punkty{margin:10px 0 0;padding:0 0 0 18px;font:400 16px/1.5 var(--font-text)}
.v18 .v-s-punkty li{margin-top:6px}

/* 43, 77: the picture before it goes - a framed card, the big word down below */
/* 77: the card is filled, as on the mockup, with the same thin dark line in both themes - at
   night it is not seen, the card is the fill (audit v18, 4: a light frame at night) */
.v18 .v-sh-karta{display:flex;flex-direction:column;min-height:360px;margin-top:18px;padding:24px 20px 20px;
  border:1px solid rgba(36,39,42,.12);background:var(--v-list-fon)}
.v18 .v-sh-karta.slovo{min-height:380px;padding:26px 22px 22px}
.v18 .v-sh-cap{font:400 13px/16px var(--font-text);color:var(--v-tusk)}
.v18 .v-sh-krupno{margin-top:auto;font:400 40px/40px var(--font-display);color:var(--v-bordo);text-transform:uppercase}
.v18 .v-sh-karta.slovo .v-sh-krupno{font-size:56px;line-height:56px}
.v18 .v-sh-karta.slovo .v-d-wd svg{bottom:-8px}
.v18 .v-sh-fraza{font:400 19px/24.7px var(--font-text);margin:16px 0 0}
.v18 .v-sh-karta.slovo .v-sh-fraza{font-size:18px;line-height:24.3px;margin-top:20px}
.v18 .v-sh-niz{display:flex;justify-content:space-between;gap:12px;margin-top:18px;font:400 13px/16px var(--font-text);
  color:var(--v-tusk)}
.v18 .v-sh-niz i{font-style:italic}
.v18 .v-sh-imya{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:16px}
.v18 .v-sh-imya span{display:block;font:400 17px/20px var(--font-text)}
.v18 .v-sh-imya small{display:block;font:400 13px/16px var(--font-text);color:var(--v-tusk)}
.v18 .v-sh-tumbler{flex:none;position:relative;width:44px;height:26px;padding:0;margin:0;border:0;border-radius:0;
  background:var(--v-tumbler)}
.v18 .v-sh-tumbler i{position:absolute;left:3px;top:3px;width:20px;height:20px;background:var(--v-bumaga);
  transition:left .15s}
.v18 .v-sh-tumbler.on{background:var(--v-bordo)}
.v18 .v-sh-tumbler.on i{left:21px}
.v18 .v-sh-ssylki{display:flex;flex-wrap:wrap;gap:0 18px;margin-top:16px}
.v18 .v-sh-ssylki .v-ssylka{min-height:0;line-height:19px;position:relative}
.v18 .v-sh-ssylki .v-ssylka::after{content:"";position:absolute;left:0;right:0;top:-12px;bottom:-12px}

/* 16, 17: the entry by an invitation - in the middle; the verb in bordeaux */
.v18.v-pr .v-pr-zag{font:400 40px/40.8px var(--font-display);text-transform:uppercase;text-align:center;
  margin:150px 0 0;white-space:pre-line}
.v18.v-pr .v-pr-tekst{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);text-align:center;margin:10px 36px 0}
.v18.v-pr .v-pr-zag + .v-pr-tekst{margin-top:18px}

/* 41, 08, 33: "Sdelat' kartinku" */
.v18 .v-d-ssylki .v-ssylka + .v-ssylka{margin-left:18px}
.v18 .v-vzglyad-kartinka{margin-top:12px}
.v18 .v-vzglyad-kartinka + .v-vzglyad-pod{margin-top:15px}
.v18 .v-k-kartinka{display:table;margin:8px auto 0}

/* ===== section 6: the time of birth by events (78-84), 29.10 ===== */
/* 78: the start - the heading lower, two paragraphs of 16/1.5 */
.v18 .v-vr-zag{margin-top:90px}
.v18 .v-vr-tekst{font:400 16px/1.5 var(--font-text);margin:14px 0 0}
.v18 .v-vr-tekst2{margin-top:24px}
/* 79: what was - the question close under the head, the list dense */
.v18 .v-vr-vopros{margin-top:22px}
.v18 .v-vr-spisok{margin-top:6px}
.v18 .v-vr-spisok button{padding-top:9px;padding-bottom:9px}
.v18 .v-vr-spisok button::before{top:13px}
/* 80: one event - "Sobytie 2 iz 4" in ink, the fields, "Ne pomnyu", the link */
.v18 .v-vr-step{color:var(--v-chernila)}
:root[data-tema="noch"] .v18 .v-vr-step{color:var(--v-vtor)}
.v18 .v-vr-vopros2{margin-top:10px}
.v18 .v-pole-znach select.v-sistemnyy{position:absolute;inset:0;width:100%;height:100%;opacity:0;
  border:0;padding:0;margin:0;font-size:16px;-webkit-appearance:none;appearance:none}
.v18 .v-vr-ne-pomnyu{margin-top:6px}
.v18 .v-vr-prervus{margin-top:8px}   /* the text where the mockup has it; the tap area is 44 */
/* audit v18, 1.6: fewer than six checked on 79 - a line under the list (empty - none);
   "it was more than once" on 80 - a link as "Prervus'" */
.v18 .v-vr-malo{margin-top:12px}
.v18 .v-vr-malo:empty{display:none}
.v18 .v-vr-ne-raz{margin-top:8px}
/* audit v18, 2.1: the way to the questions about her (79 with fewer than six, 82) */
.v18 .v-vr-k-oprosu{margin-top:8px}
.v18 .v-vr-k-oprosu[hidden]{display:none}
/* 81-83: the result - dark by day, cream at night (ritual) */
.v18 .v-vr-nad{font:400 14px/17px var(--font-text);color:var(--v-vtor);margin:90px 0 0}
.v18 .v-vr-nad82{margin-top:70px}
.v18 .v-vr-nad83{margin-top:110px}
:root[data-tema="noch"] .v18 .v-vr-nad{color:var(--v-chernila)}
.v18 .v-vr-okno{font:400 52px/1 var(--font-display);color:var(--v-krem);margin-top:6px}
.v18 .v-vr-chas{font:400 110px/1 var(--font-display);color:var(--v-krem);margin-top:6px}
.v18 .v-vr-krem{font:400 16px/1.5 var(--font-text);color:var(--v-krem);margin:12px 0 0}
:root[data-tema="noch"] .v18 .v-vr-okno,:root[data-tema="noch"] .v18 .v-vr-chas,
:root[data-tema="noch"] .v18 .v-vr-krem{color:var(--v-chernila)}
.v18 .v-vr-belyy{font:400 16px/1.5 var(--font-text);color:var(--v-chernila);margin:14px 0 0}
.v18 .v-vr-okno-po{font:400 15px/1.3 var(--font-text);color:var(--v-vtor);margin:8px 0 0}
.v18 .v-vr-belyy + .v-spisok{margin-top:8px}
/* 82: the lines between the options - the mockup's, dark on the dark screen */
.ekran.v18.ritual .v-vr-belyy + .v-spisok button{border-bottom-color:rgba(36,39,42,.12)}
:root[data-tema="noch"] .ekran.v18.ritual .v-vr-belyy + .v-spisok button{border-bottom-color:rgba(36,39,42,.18)}
.v18 .v-vr-ne-seychas{text-align:center;margin-bottom:1px}
/* the button that cannot be pressed yet on the dark screens (82), as in the mockup */
.ekran.v18.temnyy .v-knopka.vykl,.ekran.v18.ritual .v-knopka.vykl{background:rgba(236,230,214,.18);
  color:rgba(236,230,214,.5);opacity:.4}
:root[data-tema="noch"] .ekran.v18.ritual .v-knopka.vykl{background:rgba(25,28,27,.22);color:rgba(25,28,27,.55)}
/* 84: did not work out - the heading lower, the words of Natalchik in italics */
.v18 .v-vr-nv-zag{margin-top:110px}
.v18 .v-vr-nv-tekst{font:italic 400 15.5px/22.475px var(--font-text);margin:14px 0 0}
.v18 .v-vr-nv-tekst + .v-spisok{margin-top:14px}
/* 84 "zaschitano 4 iz 6" (audit v18, 1.6): the events counted as one, a line each, upright */
.v18 .v-vr-vmeste{font-style:normal;margin-top:6px}

/* ===== v18, section 7 (29.10): the profile 85, 86, 88; 87; my data 89, 90; 92-95 ===== */
/* 85: the name, the data in three lines, the links of 19px with a tap area of 44 */
.v18 .v-pf-imya{font:600 24px/28.8px var(--font-text);margin-top:22px}
.v18 .v-pf-dannye{margin-top:10px}
.v18 .v-pf-dannye p{margin:0;font:400 17px/25.5px var(--font-text)}
.v18 .v-pf-izmenit,.v18 .v-pf-ssylki .v-ssylka,.v18 .v-pf-udalit{position:relative;min-height:0;line-height:19px}
.v18 .v-pf-izmenit::after,.v18 .v-pf-ssylki .v-ssylka::after,.v18 .v-pf-udalit::after{content:"";position:absolute;
  left:0;right:0;top:-12px;bottom:-12px}
.v18 .v-pf-ssylki .v-ssylka + .v-ssylka::after{top:-7px}
.v18 .v-pf-izmenit{margin-top:12px}
.v18 .v-pf-cap{font:400 13.5px/16px var(--font-text);color:var(--v-podpis);margin-top:26px}
.v18 .v-pf-utro{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.v18 .v-pf-utro span{display:block;font:400 17px/20px var(--font-text)}
.v18 .v-pf-utro small{display:block;font:400 13px/16px var(--font-text);color:var(--v-tusk)}
.v18 .v-pf-tumbler{flex:none;position:relative;width:44px;height:26px;padding:0;margin:0;border:0;border-radius:0;
  background:var(--v-tumbler)}
.v18 .v-pf-tumbler i{position:absolute;left:3px;top:3px;width:20px;height:20px;background:var(--v-bumaga);
  transition:left .15s}
.v18 .v-pf-tumbler.on{background:var(--v-knopka-fon)}
.v18 .v-pf-tumbler.on i{left:21px}
.v18 .v-pf-tumbler[disabled]{cursor:default}
.v18 .v-pf-vremya{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:24px}
.v18 .v-pf-vremya > span{font:400 17px/20px var(--font-text)}
.v18 .v-pf-chas{position:relative;display:inline-block;font:400 15px/19px var(--font-text);
  text-decoration:underline;text-underline-offset:3px}
.v18 .v-pf-chas::after{content:"";position:absolute;left:0;right:0;top:-12px;bottom:-12px}
.v18 .v-pf-chas input.v-sistemnyy{position:absolute;left:0;right:0;top:-12px;bottom:-12px;width:100%;
  height:calc(100% + 24px);opacity:0;border:0;padding:0;margin:0;font-size:16px;z-index:1;
  -webkit-appearance:none;appearance:none}
/* 88: the bot may not write - the line and "Razreshit'" in bordeaux, without a line under */
.v18 .v-pf-razreshenie{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:12px 0 0}
.v18 .v-pf-razreshenie .v-ssylka.v-pf-razreshit{display:inline;min-height:0;padding:0;font:inherit;
  color:var(--v-bordo);text-decoration:none}
.v18 .v-pf-ssylki{display:flex;flex-direction:column;align-items:flex-start;gap:15px;margin-top:34px}
.v18 .v-pf-ssylki .v-ssylka.v-pf-bordo{color:var(--v-bordo);text-align:left}
.v18 .v-pf-udalit{margin-top:30px}
.v18 .v-pf-versiya{margin-top:40px;font:400 12px/16px var(--font-text);color:var(--v-tusk)}

/* 87: what Natal'chik is */
.v18 .v-nt-lead{font:400 18px/27.9px var(--font-text);margin:16px 0 0}
.v18 .v-nt-p{font:400 15.5px/24.025px var(--font-text);margin:12px 0 0}

/* 89: my data - the fields of the anketa, smaller (Forum 22) and tighter */
.v18 .v-md-pod{margin-top:6px}
.v18 .v-md .v-pole{margin-top:8px}
.v18 .v-md .v-pole-znach{font-size:22px;line-height:25.3px;padding:2px 0 3px;min-height:30px}
.v18 .v-md .v-vremya .v-pole{margin-top:6px}
/* 90: the title of the sheet breaks where the designer broke it */
.v-list .v-list-zag{white-space:pre-line}

/* 92: loading - the frame of the main screen in pale bars */
.v18 .v-zg-data{font:400 13.5px/16px var(--font-text);color:var(--v-podpis);margin-top:20px}
.v18 .v-zg{background:rgba(36,39,42,.09)}
:root[data-tema="noch"] .v18 .v-zg{background:rgba(255,255,255,.1)}
.v18 .v-zg-slovo{height:62px;margin-top:10px}
.v18 .v-zg-s{height:14px;margin-top:10px}
.v18 .v-zg-slovo + .v-zg-s{margin-top:18px}
.v18 .v-zg-pole{height:20px;margin-top:22px}
.v18 .v-zg-razdel{height:30px;margin-top:18px}
.v18 .v-zg-pole + .v-zg-razdel{margin-top:28px}
.v18 .v-zg-pod{height:10px;margin-top:6px}

/* 93: "My s toboy" is already there */
.v18 .v-mt-est-zag{font:400 34px/34px var(--font-display);color:var(--v-bordo);text-transform:uppercase;margin:16px 0 0}
.v18 .v-mt-est-pod{font:400 16px/24px var(--font-text);margin:12px 0 0}
.v18 .v-mt-est-p{font:400 14px/19.6px var(--font-text);color:var(--v-vtor);margin:14px 0 0}
.v18 .v-mt-est-ssylka{font-size:15px;color:var(--v-vtor);text-decoration:underline;text-underline-offset:3px;
  cursor:pointer;padding:13px 0}

/* 94, 95: the title lower than on 26 */
.v18 .v-o-zag.v-o-zag94{margin-top:190px}
/* 94: the reading kept on the phone (audit v18, 2.10) - the second line and the link under it */
.v18 .v-o-tekst.v-o-bez-seti{margin-top:12px}
.v18 .v-o-bez-seti .v-ssylka{margin-top:10px}
.v18 .v-o-zag.v-o-zag95{margin-top:185px}