/* dzyuban.com: the skin and the frame of every page.
   The name above, the sections of the site on the left, the pages of the section and the search on the right.
   Loaded after the page's own stylesheet; the home page loads it after home.css. */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Condensed:wght@700&display=swap");

:root,:root[data-theme="dark"],:root[data-theme="light"],body,body.legal-page{
  color-scheme:dark;
  --ground:#000;--surface:#0a0c12;--sunk:#050b14;
  --ink:#f3f5f8;--ink-soft:#a7b0bb;--ink-faint:#69737f;--ink-2:#a7b0bb;--ink-3:#69737f;
  --rule:#2a1a1a;--rule-soft:#1c2430;--rule-2:#1c2430;
  --accent:#ff2d2d;--accent-soft:#3a1010;--mark:#ff6a5e;
  --red:#ff2d2d;--red-ink:#ff6a5e;--plate:#050b14;
  --s-full:#7dffb0;--s-part:#ffb347;--s-ack:#8fb6e8;--s-notsent:#c9b8ff;
  --cond:"IBM Plex Sans Condensed","Roboto Condensed","Arial Narrow",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}

/* ---------- the ground ---------- */
body.has-frame{background:var(--ground);color:var(--ink);min-height:100vh;display:flex;flex-direction:column}
body.has-frame a{color:var(--ink);border-bottom:1px solid var(--rule-soft)}
body.has-frame a:hover{color:#fff;border-bottom-color:var(--red)}
body.has-frame a:focus-visible{outline:2px solid var(--red);outline-offset:2px}
body.has-frame ::selection{background:rgba(255,45,45,.35);color:#fff}

/* ---------- the name ---------- */
.masthead{position:relative;z-index:2;display:flex;justify-content:center;padding:clamp(16px,2.6vh,28px) 16px 0}
/* the name in the face of the page titles, heavier and wider set (order of 30.09.2026, variant 2) */
.masthead a{font:700 clamp(32px,4.7vw,58px)/1 var(--cond);letter-spacing:.10em;text-transform:uppercase;
  color:#fff;text-decoration:none;border:0}
header.top h1{font:700 clamp(32px,4.7vw,58px)/1 var(--cond);letter-spacing:.10em}
.masthead a:hover{color:#fff;border:0}
.masthead a:focus,.masthead a:focus-visible,header.top a:focus,header.top a:focus-visible,
body.has-frame .masthead a:focus-visible,body.has-frame header.top a:focus-visible{outline:0;border:0;box-shadow:none}
.masthead .z{position:relative;display:inline-block;color:var(--red)}
.masthead .z::after{content:"";position:absolute;left:6%;right:6%;top:50%;height:max(.085em,2px);background:var(--red);transform:translateY(-50%)}

/* the Z fills once, slowly, in waves: five tones of red rise through the letter from the bottom and stay (orders of 03.10.2026:
   once, no way back, slowly, in waves; the letter begins dark, hardly to be told from the ground; the line is part of the letter).
   One band of six tones, 6em high, climbs behind the letter; --zp is how far it has climbed (0..1). The line is a window on the
   same band at its own height, so its colour is always the colour of the letter where the line crosses it. */
@property --zp{syntax:'<number>';inherits:true;initial-value:0}
.masthead .z,header.top h1 .z,.masthead .z::after,header.top h1 .z::after{
  background-image:linear-gradient(to bottom,#1a0505 0 13%,#5a0e0e 20% 30%,#8c1212 37% 47%,#b81616 54% 64%,#dc1f1f 71% 81%,#ff2d2d 88% 100%)}
.masthead .z,header.top h1 .z{color:transparent;-webkit-background-clip:text;background-clip:text;text-shadow:none;
  background-size:100% 600%;background-position:0 calc(var(--zp)*100%);animation:z-tones 14s cubic-bezier(.4,0,.3,1) 2s 1 forwards}
/* the line is a stroke of the letter, not a bar laid over it (Amir, 03.10.2026: "the line is foreign, not part of the Z"):
   it runs exactly from the left ink edge to the right ink edge of the Z in IBM Plex Sans Condensed 700 (the box of the letter is wider:
   it carries the .10em letter-spacing on the right), it sits on the vertical middle of the glyph (cap height .703em, baseline at .869em),
   it stands on whole pixels, and nothing lies under the band: the old red background-color showed through at the edges as bright rims. */
/* order of 03.10.2026, morning: "trim it from below, and 3 mm longer": the line is 8px thick ("3 px thicker" than 5px, 03.10.2026), centred on the middle of the glyph,
   and runs exactly from ink edge to ink edge of the Z ("too long" when it ran past them, 03.10.2026) (ink .031em to .516em of the box; 1.5mm = .098em at the full size of 58px). */
.masthead .z::after,header.top h1 .z::after{left:.031em;right:.130em;height:8px;top:calc(.523em - 4px);transform:none;
  background-color:transparent;background-size:100% 6em;background-position:0 calc(var(--zp)*-5em - .523em + 4px)}
@keyframes z-tones{
  0%{--zp:0}
  11%{--zp:.09}
  19%{--zp:.13}
  31%{--zp:.30}
  39%{--zp:.35}
  52%{--zp:.54}
  60%{--zp:.59}
  73%{--zp:.79}
  81%{--zp:.83}
  100%{--zp:1}
}

/* the button under the list of the fund on the right: a plate like a tab of the maps */
.rail .rail-act{margin:16px 0 0;padding:0}
.rail .rail-act a{display:block;padding:11px 10px;text-align:center;border:1px solid var(--rule-2,#333);border-radius:4px;background:#0b0b0b;
  color:#fff;font:600 13px/1.2 var(--cond);letter-spacing:.2em;text-indent:.2em;text-transform:uppercase;text-decoration:none;
  transition:border-color .25s ease,color .25s ease,box-shadow .25s ease}
.rail .rail-act a:hover,.rail .rail-act a:focus-visible{border-color:var(--red);color:var(--red);box-shadow:0 0 18px rgba(255,45,45,.35);outline:0}

/* the form of the support page: the amount and the button on the axis */
body.has-frame main.support .support-act{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;margin:30px auto 26px;max-width:520px}
body.has-frame main.support .support-act label{font:500 11px/1.4 var(--cond);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}
body.has-frame main.support .support-act input{width:150px;padding:12px 14px;background:#0b0b0b;border:1px solid var(--rule-2,#333);border-radius:4px;color:#fff;
  font:600 18px/1 var(--cond);letter-spacing:.02em;font-variant-numeric:tabular-nums;text-align:center}
body.has-frame main.support .support-act input:focus{border-color:var(--red);outline:0;box-shadow:0 0 18px rgba(255,45,45,.3)}
body.has-frame main.support .support-act button{flex:1 1 200px;padding:12px 18px;background:#0b0b0b;border:1px solid var(--rule-2,#333);border-radius:4px;color:#fff;cursor:pointer;
  font:600 13px/1.2 var(--cond);letter-spacing:.2em;text-indent:.2em;text-transform:uppercase;transition:border-color .25s ease,color .25s ease,box-shadow .25s ease}
body.has-frame main.support .support-act button:hover,body.has-frame main.support .support-act button:focus-visible{border-color:var(--red);color:var(--red);box-shadow:0 0 18px rgba(255,45,45,.35);outline:0}
body.has-frame main.support .support-note{text-align:center;color:var(--red)}
body.has-frame main.support .support-note[hidden]{display:none}

/* a card of a number (.stat): the number and its words stand on the axis of the card, on every page (order of 03.10.2026) */
body.has-frame .stat,body.has-frame .stat b,body.has-frame .stat span{text-align:center}

/* ---------- three columns ---------- */
.frame{position:relative;z-index:1;flex:1 0 auto;display:grid;
  grid-template-columns:clamp(200px,16.5vw,290px) minmax(0,1fr) clamp(200px,16.5vw,290px);
  gap:0 clamp(16px,2vw,36px);align-items:start;
  padding:clamp(22px,4vh,44px) clamp(14px,2vw,32px) 40px}
.frame>main{min-width:0;width:100%}

/* ---------- the rails ---------- */
.rail{position:sticky;top:18px;max-height:calc(100vh - 36px);display:flex;flex-direction:column;min-height:0}
.rail ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.rail li{margin:0;padding:0}
.rail-body>ol[hidden],.lines .rail-body>ol[hidden]{display:none}
.rail-body{overflow-y:auto;min-height:0;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--rule) transparent}
.rail-body::-webkit-scrollbar{width:6px}
.rail-body::-webkit-scrollbar-thumb{background:var(--rule)}
.rail a{position:relative;display:grid;grid-template-columns:2.2em 1fr;gap:0 8px;align-items:baseline;color:inherit;text-decoration:none;
  padding:clamp(10px,1.5vh,15px) 12px;border:0;border-bottom:1px solid var(--rule);border-left:2px solid transparent;
  transition:transform .28s cubic-bezier(.2,.85,.3,1),border-color .28s,background-color .28s,box-shadow .28s}
.rail li:first-child>a{border-top:1px solid var(--rule)}
.rail a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--red);transform:scaleX(0);transform-origin:left;
  transition:transform .42s cubic-bezier(.2,.85,.3,1)}
.rail a:hover,.rail a:focus-visible,.rail a.on{outline:0;color:inherit;border-left-color:var(--red);border-bottom-color:var(--rule);transform:translateX(6px);
  background:radial-gradient(220px 110px at var(--gx,50%) var(--gy,50%),rgba(255,45,45,.30),rgba(255,45,45,.06) 72%);
  box-shadow:0 0 34px rgba(255,45,45,.16)}
.rail a:hover::after,.rail a:focus-visible::after,.rail a.on::after{transform:scaleX(1)}
.rail a:hover .t,.rail a:focus-visible .t,.rail a.on .t{color:#fff;text-shadow:0 0 18px rgba(255,45,45,.75)}
.rail .n{font:600 clamp(13px,.95vw,16px)/1 var(--cond);color:var(--red);letter-spacing:.06em;font-variant-numeric:tabular-nums}
.rail .t{font:600 clamp(16px,1.25vw,21px)/1.2 var(--cond);color:#fff;letter-spacing:.02em;text-wrap:balance}
.rail .s{grid-column:2;max-height:0;opacity:0;overflow:hidden;font-size:clamp(12px,.85vw,13.5px);line-height:1.4;color:var(--ink-soft);
  text-wrap:pretty;transition:max-height .35s ease,opacity .35s ease,margin .35s ease}
.rail a:hover .s,.rail a:focus-visible .s,.rail a.on .s{max-height:4.5em;opacity:1;margin-top:3px}

/* the right rail is the mirror of the left */
.rail-r a{grid-template-columns:1fr 2.2em;text-align:right;border-left:0;border-right:2px solid transparent}
.rail-r a::after{transform-origin:right}
.rail-r a:hover,.rail-r a:focus-visible,.rail-r a.on{border-left:0;border-right-color:var(--red);transform:translateX(-6px)}
.rail-r .n{grid-column:2;grid-row:1;text-align:right}
.rail-r .t{grid-column:1;grid-row:1}
.rail-r .s{grid-column:1}

/* the pages inside a section, under the section that is open */
.rail li ol{margin:0;padding:0}
.rail li ol a{padding:8px 12px;border-bottom:1px solid var(--rule-soft)}
.rail li ol .n{font-size:11.5px;color:var(--ink-faint);letter-spacing:.1em}
.rail li ol .t{font-size:clamp(13.5px,1vw,15.5px);font-weight:500;color:var(--ink-soft);letter-spacing:.01em}
.rail li ol a:hover .t,.rail li ol a:focus-visible .t,.rail li ol a.on .t{color:#fff}
.rail li ol a:hover .n,.rail li ol a.on .n{color:var(--red)}
.rail li ol li:last-child>a{border-bottom:1px solid var(--rule)}
.rail li ol[hidden]{display:none}
.rail li.fold>ol{animation:rail-open .32s cubic-bezier(.2,.85,.3,1)}
@keyframes rail-open{from{opacity:0;transform:translateY(-6px)}}
.rail .fold-mark{position:absolute;right:14px;top:50%;width:18px;height:18px;margin-top:-9px;cursor:pointer}
.rail-r .fold-mark{right:auto;left:14px}
.rail li.fold>a{padding-right:40px}
.rail-r li.fold>a{padding-right:12px;padding-left:40px}
.rail .fold-mark::before{content:"";position:absolute;left:5px;top:3px;width:7px;height:7px;border:solid var(--ink-faint);border-width:0 1.5px 1.5px 0;
  transform:translateY(4px) rotate(-135deg);transition:transform .28s cubic-bezier(.2,.85,.3,1),border-color .28s}
.rail li.shut>a .fold-mark::before{transform:rotate(45deg)}
.rail li.fold>a:hover .fold-mark::before,.rail .fold-mark:hover::before{border-color:var(--red)}

/* The right column of the home page in the look of the column of a map: a name begins under the first letter of the word
   of the search (--nx: the word stands on the axis, site.js measures the letter), its number stands after it and every
   number begins on one line. */
@media (min-width:981px){
  /* in a window that is not wide a name keeps its share of the column: the longest stands in one line down to 981 px */
  .lines .t{font-size:clamp(14.2px,1.45vw,23px)}
  .lines .n{font-size:clamp(10.5px,1.05vw,17px)}
  .lines.right{--nx:calc(50% - 28px)}
  .lines.right a{grid-template-columns:minmax(0,1fr) minmax(1.7em,auto);text-align:left;padding-left:var(--nx);padding-right:8px}
  .lines.right .n{grid-column:2;grid-row:1;text-align:left}
  .lines.right .t{grid-column:1;grid-row:1}
  .lines.right .s{grid-column:1/-1}
  .lines.right .rail-results a.sr,.lines.right .rail-hint,.lines.right .rail-sep{text-align:left}
}

/* The columns of the home page and of the maps: a line under the pointer keeps its height. Its name rises and its note
   stands under the name inside the line, so that no line under it moves. */
@media (min-width:981px){
  .lines a .t,.lines a .n{transition:transform .28s cubic-bezier(.2,.85,.3,1),color .28s,text-shadow .28s}
  .lines a .s{grid-column:auto;grid-row:auto;position:absolute;left:55px;right:10px;bottom:calc(clamp(11px,1.7vh,17px) - 9px);margin:0;max-height:none;font-size:clamp(12px,.85vw,13px);line-height:1.25;
    white-space:nowrap;overflow:hidden;opacity:0;transition:opacity .3s ease;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent)}
  /* the note is placed by no grid line, else its box is the grid area and the note stands 111 px to the right of the name (02.10.2026) */
  .lines.right a .s{left:var(--nx);grid-column:auto;grid-row:auto}
  .lines a:hover .s,.lines a:focus-visible .s{max-height:none;margin:0;opacity:1}
  .lines a:has(.s:not(:empty)):hover .t,.lines a:has(.s:not(:empty)):hover .n,
  .lines a:has(.s:not(:empty)):focus-visible .t,.lines a:has(.s:not(:empty)):focus-visible .n{transform:translateY(-7px)}
}

/* the left list starts level with the right list, under the height of the search line */
:root{--search-h:38px}
@media (min-width:1181px){.rail-l>ol{margin-top:calc(var(--search-h) - 1px)}}

/* ---------- the search, above the pages of the section ---------- */
/* one line under the word: the line of the search is the top line of the first row of the list */
.rail-search{margin:0;display:flex;flex-direction:column;gap:6px}
.rail-r .rail-body>ol>li:first-child>a,.lines.right .rail-body>ol>li:first-child>a{border-top:0}
.rail-q{width:100%;background:none;border:0;border-bottom:1px solid var(--rule);border-radius:0;color:#fff;outline:0;
  -webkit-appearance:none;appearance:none;font:500 15px/1.3 var(--cond);letter-spacing:.06em;padding:9px 12px 8px;height:var(--search-h);box-sizing:border-box;
  text-align:center;text-indent:.06em;caret-color:var(--red)}
/* on the axis of the line at every width (this outranks the phone rule of north/home.css) */
.rail-r .rail-q,.lines.right .rail-q{text-align:center;padding:9px 12px 8px}
/* the indent equals the spacing after the last letter: the letters themselves stand on the axis */
.rail-q::placeholder{color:var(--ink-faint);text-transform:uppercase;letter-spacing:.2em;text-indent:.2em;font-size:12px;opacity:1}
.rail-q:focus::placeholder{color:transparent}
.rail-q::-webkit-search-cancel-button,.rail-q::-webkit-search-decoration{display:none;-webkit-appearance:none}

/* the search line, here and on the maps (.find, maps/atlas.css). When the line is taken a red bar runs in slowly from the left
   end and strikes under the first letter of the word; from under that letter the line runs on to the right while the word is
   put out slowly, letter by letter, over it (site.js typeWord puts .sq-word after the field and measures where the word
   begins: --sq-x, --sq-f, --sq-p): .sq-rest is the word at rest, .sq-type the same letters at the same place, lit one by one,
   each with the caret after it. The letters stand on the base line of the plain placeholder and of the text of the field. */
.rail-search,.find{position:relative;--sq-x:50%;--sq-f:.3;--sq-p:66%;--sq-n:6;--sq-run:1.15s;--sq-lead:1.5s;--sq-step:.24s;--sq-out:.75s}
.rail-search::before,.rail-search::after,.find::before,.find::after{content:"";position:absolute;top:calc(var(--search-h,38px) - 1px);height:1px;
  background:var(--red);box-shadow:0 0 8px rgba(255,45,45,.55);pointer-events:none;transform:scaleX(0);transform-origin:left;
  transition:transform .32s cubic-bezier(.3,0,.7,.3)}
/* at rest the two parts of the line fold into the middle of the row: one bar, never two (order of 02.10.2026: to the centre) */
.rail-search::before,.find::before{left:0;width:var(--sq-x);transform-origin:calc(var(--sq-w,100%)/2) 50%}
.rail-search::after,.find::after{left:var(--sq-x);right:0;transform-origin:calc(var(--sq-w,200%)/2 - var(--sq-x)) 50%}
.rail-search:focus-within::before,.find:focus-within::before,.sq-on.rail-search::before,.sq-on.find::before{transform:scaleX(1);transform-origin:left;transition:transform var(--sq-run) cubic-bezier(.42,0,1,1)}
/* the right line keeps under the letter that has just come, then runs out to the end of the line */
.rail-search:focus-within::after,.find:focus-within::after,.sq-on.rail-search::after,.sq-on.find::after{transform:scaleX(1);transform-origin:left;
  transition:transform calc(var(--sq-n)*var(--sq-step) + var(--sq-out)) cubic-bezier(.3,.3,.4,1) var(--sq-lead);
  transition-timing-function:linear(0,var(--sq-f) var(--sq-p),calc(var(--sq-f) + (1 - var(--sq-f))*.62) calc(var(--sq-p) + (100% - var(--sq-p))*.4),calc(var(--sq-f) + (1 - var(--sq-f))*.92) calc(var(--sq-p) + (100% - var(--sq-p))*.75),1)}
.sq .sq-in::placeholder{color:transparent}
.sq-in:focus:placeholder-shown{caret-color:transparent}
.sq-word{position:absolute;z-index:1;left:0;top:0;width:100%;height:var(--search-h,38px);pointer-events:none;-webkit-user-select:none;user-select:none}
/* the strike: where the bar reaches the word the line flares once */
.sq-word::after{content:"";position:absolute;left:var(--sq-x,50%);top:calc(var(--search-h,38px) - 1px);width:150px;height:30px;margin:-15px 0 0 -75px;opacity:0;
  background:radial-gradient(closest-side,rgba(255,214,206,.95),rgba(255,45,45,.6) 26%,rgba(255,45,45,.14) 58%,rgba(255,45,45,0))}
.sq-in:focus+.sq-word::after,.sq-on .sq-word::after{animation:sq-strike .75s cubic-bezier(.2,.8,.3,1) var(--sq-run) both}
.sq-in:not(:placeholder-shown)+.sq-word .sq-rest,.sq-in:not(:placeholder-shown)+.sq-word .sq-type{display:none}
.sq-rest,.sq-type{position:absolute;left:0;top:0;right:0;bottom:0;box-sizing:border-box;padding:11px 12px 7px;text-align:center;text-indent:.2em;white-space:pre;
  font:500 12px/20px var(--cond);letter-spacing:.2em;text-transform:uppercase}
.sq-word i{display:inline-block;position:relative;font-style:normal;text-indent:0}
.sq-rest{color:var(--ink-faint,#69737f);transition:opacity .2s}
.sq-in:focus+.sq-word .sq-rest,.sq-on .sq-rest{opacity:0;transition-duration:.12s}
.sq-type{visibility:hidden;color:transparent}
.sq-in:focus+.sq-word .sq-type,.sq-on .sq-type{visibility:visible}
.sq-type i::after,.sq-type i:first-child::before{content:"";position:absolute;left:100%;top:50%;width:1px;height:14px;margin-top:-7px;background:var(--red);
  box-shadow:0 0 8px rgba(255,45,45,.9);opacity:0}
.sq-type i:first-child::before{left:-2px}
.sq-in:focus+.sq-word .sq-type i,.sq-on .sq-type i{animation:sq-letter .5s ease-out calc(var(--i)*var(--sq-step) + var(--sq-lead)) forwards}
.sq-in:focus+.sq-word .sq-type i::after,.sq-on .sq-type i::after{animation:sq-caret calc(var(--sq-step) - .02s) steps(1,end) calc(var(--i)*var(--sq-step) + var(--sq-lead))}
.sq-in:focus+.sq-word .sq-type i:last-child::after,.sq-on .sq-type i:last-child::after{animation:sq-blink 1.06s steps(1,end) calc(var(--i)*var(--sq-step) + var(--sq-lead)) infinite}
.sq-in:focus+.sq-word .sq-type i:first-child::before,.sq-on .sq-type i:first-child::before{animation:sq-caret calc(var(--sq-lead) - var(--sq-run)) steps(1,end) var(--sq-run)}
@keyframes sq-strike{0%{opacity:0;transform:scale(.15,.4)}22%{opacity:1;transform:scale(1,1)}100%{opacity:0;transform:scale(1.9,.5)}}
@keyframes sq-letter{0%{color:transparent;text-shadow:0 0 0 rgba(255,45,45,0)}35%{color:#ff5a4e;text-shadow:0 0 16px rgba(255,45,45,1)}100%{color:#fff;text-shadow:0 0 18px rgba(255,45,45,.75)}}
@keyframes sq-caret{from,to{opacity:1}}
@keyframes sq-blink{0%{opacity:1}50%,100%{opacity:0}}
.rail-scope{display:flex;gap:16px;justify-content:flex-end;padding:0 12px}
.rail-scope[hidden]{display:none}
.rail-scope button{background:none;border:0;padding:0 0 2px;cursor:pointer;color:var(--ink-faint);
  font:500 11px/1.4 var(--cond);letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid transparent}
.rail-scope button:hover{color:#fff}
.rail-scope button.on{color:var(--red-ink);border-bottom-color:var(--red)}
.rail-results{display:flex;flex-direction:column}
.rail-results[hidden]{display:none}
.rail-results a.sr{display:block;padding:10px 12px;margin:0;border:0;border-bottom:1px solid var(--rule-soft);color:var(--ink);
  text-align:left;transform:none;background:none;box-shadow:none;transition:background-color .2s}
.rail-results a.sr::after{display:none}
.rail-r .rail-results a.sr,.lines.right .rail-results a.sr{text-align:right}
.rail-results a.sr:hover,.rail-results a.sr.on{background:rgba(255,45,45,.09);transform:none;box-shadow:none;border-color:var(--rule-soft)}
.sr-where{display:block;font:500 10.5px/1.4 var(--cond);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:2px}
.sr-title{display:block;font:600 15px/1.3 var(--cond);color:#fff;letter-spacing:.02em;text-shadow:none}
.sr-snip{display:block;font:400 12.5px/1.45 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-soft);margin-top:3px;letter-spacing:0}
.rail-results mark,mark.hl{background:rgba(255,45,45,.28);color:#fff;border-radius:2px;padding:0 1px}
.rail-hint{margin:10px 12px;font:500 12px/1.4 var(--cond);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint)}
.rail-r .rail-hint,.lines.right .rail-hint{text-align:right}
.rail-sep{margin:14px 12px 4px;padding-top:10px;border-top:1px solid var(--rule);font:500 10.5px/1.4 var(--cond);
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}
.rail-r .rail-sep,.lines.right .rail-sep{text-align:right}
/* on the home page what is found stands from the left edge of the column, as on every page */
@media (min-width:981px){.lines.right .rail-results a.sr,.lines.right .rail-hint,.lines.right .rail-sep{text-align:left}}

/* the home page: the search above the contents of Legal, the list scrolls when it is long */
body.north-home .lines.right{display:flex;flex-direction:column;max-height:calc(100vh - 150px)}
body.north-home .lines.right .rail-body{overflow-y:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#2a1a1a transparent}
body.north-home .rail-search{margin:0}
body.north-home .rail-results a.sr{text-shadow:0 0 12px #000}

/* ---------- the foot ---------- */
body.has-frame footer.site{margin-top:12px;border-top:1px solid var(--rule);font:400 12px/1.5 "IBM Plex Sans",system-ui,sans-serif;
  letter-spacing:.06em;text-transform:none;color:var(--ink-faint)}
body.has-frame footer.site .wrap{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 22px;
  max-width:none;padding:16px 16px 22px}
body.has-frame footer.site a{color:var(--ink-faint);border:0}
body.has-frame footer.site a:hover{color:var(--red-ink)}
body.has-frame footer.foot{border-top:1px solid var(--rule)}

/* ---------- the type of the pages ---------- */
body.has-frame main h1{font-family:var(--cond);font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  font-size:clamp(36px,4.6vw,58px);line-height:1.02;color:#fff}
body.has-frame main h1.long{text-transform:none;letter-spacing:.005em;font-size:clamp(26px,3vw,38px);line-height:1.15;text-wrap:balance}
body.has-frame .hero-legal h1{font-size:clamp(52px,9vw,96px);line-height:.95;letter-spacing:.08em;margin:18px 0 10px}
body.has-frame .ws-hero h1{font-family:"Anton","Archivo Black",Impact,"Arial Narrow Bold",sans-serif;font-weight:400;
  font-size:clamp(60px,13vw,148px);line-height:.92;letter-spacing:.012em}
body.has-frame main h2,body.has-frame main h3{font-family:var(--cond);color:#fff;letter-spacing:.01em}
body.has-frame main h2{font-weight:600;font-size:clamp(22px,2.4vw,27px)}
body.has-frame main h3{font-weight:600;font-size:18px}
body.has-frame .doc h2 .num,body.has-frame .doc h2 .num{color:var(--red);font-family:var(--cond);font-weight:600}
body.has-frame .lede{font:500 clamp(18px,1.5vw,22px)/1.45 var(--cond);color:#fff;letter-spacing:.01em}
body.has-frame .byline{font-family:var(--cond);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}
body.has-frame .entry-date,body.has-frame .pin-no,body.has-frame .feed-head,body.has-frame .crumb,body.has-frame .front-state,
body.has-frame .case-date,body.has-frame .ws-no,body.has-frame .ws-kicker,body.has-frame .cn-label,body.has-frame .cr-due,
body.has-frame .cn-due,body.has-frame table.ledger th,body.has-frame .chip,body.has-frame .case-tools,body.has-frame .ws-jump a,
body.has-frame .ws-go,body.has-frame .ws-once,body.has-frame .chapters a{font-family:var(--cond);font-weight:500;letter-spacing:.16em;text-transform:uppercase}
body.has-frame .entry-date,body.has-frame .pin-no,body.has-frame .ws-no,body.has-frame .cn-label,body.has-frame .ws-kicker{color:var(--red-ink)}
body.has-frame .crumb a{color:var(--ink-faint)}
body.has-frame .crumb a:hover{color:var(--red-ink)}
body.has-frame .entry-title{font:600 21px/1.25 var(--cond);letter-spacing:.02em;color:#fff}
body.has-frame .entry-title:hover{color:var(--red-ink)}
body.has-frame .pin-title,body.has-frame .ws-title,body.has-frame .cn-name,body.has-frame .cr-name,body.has-frame .ws-sec-head h2,
body.has-frame .ws-sub h3{font-family:var(--cond);letter-spacing:.01em;color:#fff}
body.has-frame .ws-sec-head h2 span{font-family:var(--cond);color:var(--red-ink)}
body.has-frame .tallies b{font-family:var(--cond);font-weight:600;color:#fff;letter-spacing:.01em}
body.has-frame .case-head:hover .case-title,body.has-frame .case.open .case-title{color:var(--red-ink)}
body.has-frame .case-tools button:hover{color:var(--red-ink)}
body.has-frame .chapters a:hover{color:var(--red-ink)}
body.has-frame .pinned a.pin:hover{border-color:var(--red);box-shadow:0 0 34px rgba(255,45,45,.12)}
body.has-frame blockquote{border-left-color:var(--red)}
body.has-frame .creed{border-left-color:var(--red)}
body.has-frame table.reg th,body.has-frame table.reg td{border-bottom-color:var(--rule-soft)}
body.has-frame table.reg th{color:var(--ink-faint);opacity:1;font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;font-weight:500}
body.has-frame code{color:var(--ink-soft)}
/* a long unbroken string (a hash, an address) breaks rather than run out of the middle */
body.has-frame main p,body.has-frame main li,body.has-frame main td{overflow-wrap:break-word}
body.has-frame .clock{--late:#ff7a6a}
body.has-frame .mark{stroke:var(--red-ink)}
body.has-frame .mark .load{fill:var(--red-ink)}
body.has-frame .guil-bg{stroke:var(--red);opacity:.09}
body.has-frame.legal-page::before{background:radial-gradient(120% 100% at 50% 0%,rgba(255,45,45,.10) 0%,transparent 74%)}
body.has-frame .ws-page::before{opacity:.8}
body.has-frame a.ws-btn,body.has-frame button.ws-btn{background:var(--red);color:#fff;box-shadow:0 10px 30px -12px var(--red)}
body.has-frame .ws-form input[type=email]{border-color:var(--rule);background:var(--surface);color:#fff}
body.has-frame .ws-form input[type=email]:focus{outline-color:var(--red);border-color:var(--red)}
body.has-frame .ws-status{color:var(--red-ink)}

/* blocks that were sized to the window now fit the column */
.frame .pinned{width:100%;margin:36px 0 12px;transform:none;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.frame .ws-wide{width:100%;margin-left:0;transform:none}
.frame a.ws-card.ws-wide:hover{transform:translateY(-3px)}
.frame .tally{max-width:none}

/* ---------- the index: numbered lines on the axis of the page (Workshop, Contributions) ---------- */
.ix{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--rule)}
.ix li{margin:0;padding:0}
.ix a{position:relative;display:grid;grid-template-columns:3.4em minmax(0,1fr) 3.4em;align-items:center;gap:0 14px;
  padding:clamp(22px,3.4vh,34px) 10px;border:0;border-bottom:1px solid var(--rule);color:inherit;text-decoration:none;text-align:center;
  transition:background-color .3s,box-shadow .3s}
.ix a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--red);transform:scaleX(0);
  transition:transform .45s cubic-bezier(.2,.85,.3,1)}
.ix a:hover,.ix a:focus-visible{outline:0;color:inherit;border-bottom-color:var(--rule);
  background:radial-gradient(460px 170px at var(--gx,50%) var(--gy,50%),rgba(255,45,45,.22),rgba(255,45,45,.04) 72%);box-shadow:0 0 44px rgba(255,45,45,.10)}
.ix a:hover::after,.ix a:focus-visible::after{transform:scaleX(1)}
.ix-n{font:600 clamp(15px,1.15vw,18px)/1 var(--cond);color:var(--red);letter-spacing:.08em;text-align:left;font-variant-numeric:tabular-nums}
.ix-go{font:500 20px/1 var(--cond);color:var(--ink-faint);text-align:right;transition:color .3s,transform .3s}
.ix a:hover .ix-go,.ix a:focus-visible .ix-go{color:var(--red);transform:translateX(4px)}
.ix-body{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0}
.ix-k{font:500 11.5px/1.3 var(--cond);letter-spacing:.22em;text-transform:uppercase;color:var(--ink-faint)}
.ix-t{font:600 clamp(25px,2.7vw,40px)/1.05 var(--cond);letter-spacing:.035em;text-transform:uppercase;color:#fff;text-wrap:balance;transition:text-shadow .3s}
.ix a:hover .ix-t,.ix a:focus-visible .ix-t{text-shadow:0 0 22px rgba(255,45,45,.7)}
.ix-s{font:400 clamp(14.5px,1.05vw,16.5px)/1.5 "IBM Plex Sans",system-ui,sans-serif;color:var(--ink-soft);max-width:34em;text-wrap:pretty}
.ix-f{margin-top:3px;font:500 12px/1.3 var(--cond);letter-spacing:.16em;text-transform:uppercase;color:var(--red-ink)}
.ix-f b{font-weight:600;color:#fff;font-size:1.3em;letter-spacing:.04em;margin-right:.2em}
.ix-f b.red{color:var(--red)}

/* ---------- the board: the figures, three to a row ---------- */
.board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:28px 0 0;border-top:1px solid var(--rule)}
.board>a{position:relative;display:block;padding:24px 10px 20px;text-align:center;border:0;border-bottom:1px solid var(--rule);color:inherit;text-decoration:none;transition:background-color .3s}
.board>a:not(:nth-child(3n)){border-right:1px solid var(--rule-soft)}
.board>a:hover{background:radial-gradient(160px 90px at 50% 40%,rgba(255,45,45,.22),transparent 75%);border-bottom-color:var(--red)}
.board>a:hover b{color:#fff;text-shadow:0 0 22px rgba(255,45,45,.7)}
.board b.red,.board>a:hover b.red{color:var(--red)}
.board b{display:block;font:600 clamp(40px,4.4vw,62px)/1 var(--cond);color:#fff;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.board>a:hover span{color:#fff}
.board span{display:block;margin-top:9px;font:500 11.5px/1.35 var(--cond);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.ix-head{margin:54px 0 0;text-align:center;font:500 12px/1.4 var(--cond);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-faint)}
@media (max-width:640px){
  .ix a{grid-template-columns:2.2em minmax(0,1fr) 1.4em;gap:0 8px;padding:20px 4px}
  .board{grid-template-columns:repeat(2,minmax(0,1fr))}
  .board>a{border-right:0!important}
  .board>a:nth-child(odd){border-right:1px solid var(--rule-soft)!important}
}

/* the Workshop: the index under the name, the subscription under a line */
body.has-frame .ws-hero{padding:24px 0 0}
body.has-frame .ws-mail{margin:10px 0 20px;text-align:center}
body.has-frame .ws-mail h2{margin:12px 0 22px;font:600 clamp(24px,2.6vw,34px)/1.1 var(--cond);letter-spacing:.03em;text-transform:uppercase;color:#fff;text-wrap:balance}
body.has-frame .ws-mail .ws-form input[type=email]{border:0;border-bottom:1px solid var(--rule);border-radius:0;background:none;text-align:center}
body.has-frame .ws-mail .ws-form input[type=email]:focus{outline:0;border-bottom-color:var(--red)}
body.has-frame .ws-mail button.ws-btn{border-radius:0;font:600 13px/1 var(--cond);letter-spacing:.18em;text-transform:uppercase;padding:14px 26px}

/* ---------- an essay stands on the axis too ---------- */
body.has-frame .maps{justify-content:center}
body.skin .doc h1.title,body.skin .doc .byline{text-align:center}
body.skin .doc h2{justify-content:center;gap:.45em}
body.skin .doc h2 .num{min-width:0}

/* ---------- the chapters of an essay fold; they open open ---------- */
body.skin .doc section.case>h2{display:block}
body.skin .case-head{display:grid;grid-template-columns:14px 1fr 14px;align-items:baseline;gap:12px;width:100%;margin:0;padding:0;background:none;border:0;border-radius:0;
  cursor:pointer;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;text-align:left}
body.skin .case-head::before{content:""}
body.skin .case-title{display:flex;justify-content:center;align-items:baseline;gap:.45em;transition:color .2s}
body.skin .case.open .case-title{color:#fff}
body.skin .case-head:hover .case-title,body.skin .case.open .case-head:hover .case-title{color:var(--red-ink)}
body.skin .case-head:focus-visible{outline:2px solid var(--red);outline-offset:6px}
body.skin .case-sign{align-self:center;position:relative;width:14px;height:14px}
body.skin .case-sign::before,body.skin .case-sign::after{content:"";position:absolute;left:0;top:6px;width:14px;height:2px;background:var(--red);transition:transform .25s}
body.skin .case-sign::after{transform:rotate(90deg)}
body.skin .case.open .case-sign::after{transform:rotate(0)}
body.skin .case-body{padding-top:4px}
body.skin .case-tools{display:flex;justify-content:flex-end;gap:18px;margin:0 0 6px;font-size:12px}
body.skin .case-tools button{background:none;border:0;padding:0;cursor:pointer;font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--ink-soft)}
body.skin .case-tools button:hover{color:var(--red-ink)}
@media print{body.skin .case-body[hidden]{display:block!important}body.skin .case-sign,body.skin .case-tools{display:none}}

/* ---------- the columns of a page of text in the look of the columns of the home page and of a map ----------
   As wide as the columns of the home page and at the same place. On the right a name begins under the first letter of the
   word of the search (--nx: the word stands on the axis of the column, site.js measures the letter), its number stands after
   it and every number begins on one line; a page inside a section has its numeral before its name, a line of the log its
   date. The size of a name comes from the width of the column (--rt), so that the longest name of the lists (17 letters)
   stands in one line. A line under the pointer keeps its height: the name rises and the note stands under it inside the line. */
:root{--rail-w:clamp(240px,23vw,360px);--rt:clamp(13.8px,calc(1.0952vw + .95px),18.1px)}
/* the old menu rule of style.css (nav a: capitals, its own face and spacing) does not reach the lines of the frame */
.rail a{text-transform:none;letter-spacing:0;font-family:"IBM Plex Sans",system-ui,sans-serif;font-weight:400}
@media (min-width:1181px){
  .frame{grid-template-columns:var(--rail-w) minmax(0,1fr) var(--rail-w);padding-left:clamp(18px,2.6vw,44px);padding-right:clamp(18px,2.6vw,44px)}
  /* the middle is narrower by what the columns took: the text keeps its width, the title its two lines */
  .frame>main.wrap{padding-left:clamp(8px,1.2vw,24px);padding-right:clamp(8px,1.2vw,24px)}
  body.has-frame main h1{font-size:clamp(34px,3.55vw,58px)}
  body.has-frame main h1.long{font-size:clamp(24px,2.5vw,38px)}
  body.has-frame .ws-hero h1{font-size:clamp(60px,9.6vw,148px)}
  /* a table takes the width of the middle; a table of six columns puts its last one, the answer, under the line as text */
  body.has-frame table.ledger{min-width:0}
  body.has-frame table.ledger .mono{white-space:normal}
  body.has-frame table.ledger:has(th:nth-child(6)),body.has-frame table.ledger:has(th:nth-child(6)) thead,
  body.has-frame table.ledger:has(th:nth-child(6)) tbody{display:block}
  body.has-frame table.ledger:has(th:nth-child(6)) tr{display:grid;border-bottom:1px solid var(--rule-soft);
    grid-template-columns:minmax(0,1.25fr) minmax(0,1.08fr) minmax(0,1fr) minmax(0,1.08fr) minmax(0,1.1fr)}
  body.has-frame table.ledger:has(th:nth-child(6)) thead tr{border-bottom-color:var(--rule)}
  body.has-frame table.ledger:has(th:nth-child(6)) tbody tr:last-child{border-bottom:0}
  body.has-frame table.ledger:has(th:nth-child(6)) th,body.has-frame table.ledger:has(th:nth-child(6)) td{border-bottom:0;padding-right:10px}
  body.has-frame table.ledger:has(th:nth-child(6)) .mono{font-size:12px;white-space:normal;overflow-wrap:anywhere}
  body.has-frame table.ledger:has(th:nth-child(6)) .chip{white-space:normal;line-height:1.35}
  body.has-frame table.ledger:has(th:nth-child(6)) th:nth-child(6){display:none}
  body.has-frame table.ledger:has(th:nth-child(6)) td:nth-child(6){grid-column:1/-1;padding-top:0;padding-right:0;color:var(--ink-soft);text-align:justify;hyphens:auto}
  body.has-frame table.ledger:has(th:nth-child(6)) td:nth-child(6):empty{display:none}
  .rail a{grid-template-columns:2.1em minmax(0,1fr);padding:clamp(11px,1.7vh,17px) 14px;font-size:var(--rt)}
  .rail .t{font-size:1em}
  .rail .n{font-size:.75em}
  .rail>ol>li>a>.t,.rail-body>ol:not(.rail-log)>li>a>.t{white-space:nowrap}
  /* the line of the page that is open is lit and stands in its place */
  .rail a.on:not(:hover):not(:focus-visible){transform:none}

  .rail-r{--nx:calc(var(--rail-w)/2 - 28px)}
  .rail-r a{grid-template-columns:minmax(0,1fr) minmax(1.5em,auto);text-align:left;padding-left:var(--nx);padding-right:8px}
  .rail-r li.fold>a{padding-left:var(--nx);padding-right:8px}
  .rail-r .n{text-align:left}

  /* the pages inside a section and the lines of the log: the numeral or the date before the name, the name under the same letter */
  .rail li ol a,.rail-r .rail-log a{grid-template-columns:calc(var(--nx) - 12px) minmax(0,1fr);gap:0 12px;padding:8px 8px 8px 0}
  .rail li ol .n,.rail-r .rail-log .n{grid-column:1;grid-row:1;text-align:right;font-size:.75em}
  .rail li ol .t,.rail-r .rail-log .t{grid-column:2;grid-row:1;font-size:.88em;white-space:normal}
  .rail-r .rail-log .s{grid-column:2;grid-row:2}
  .rail-r .rail-fold{position:relative;text-align:left;padding-left:var(--nx)}
  .rail-r .rail-fold::before{float:none;position:absolute;left:17px}

  /* the note of a line stands inside the line */
  .rail ol:not(.rail-log)>li>a>.t,.rail ol:not(.rail-log)>li>a>.n{transition:transform .28s cubic-bezier(.2,.85,.3,1),color .28s,text-shadow .28s}
  .rail ol:not(.rail-log)>li>a>.s{grid-column:auto;grid-row:auto;position:absolute;left:calc(22px + 2.1*var(--rt));right:10px;bottom:calc(clamp(11px,1.7vh,17px) - 9px);
    margin:0;max-height:none;font-size:clamp(11.5px,.85vw,13px);line-height:1.25;white-space:nowrap;overflow:hidden;opacity:0;transition:opacity .3s ease;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent)}
  .rail-r ol:not(.rail-log)>li>a>.s{left:var(--nx)}
  .rail ol:not(.rail-log)>li>a:hover>.s,.rail ol:not(.rail-log)>li>a:focus-visible>.s{opacity:1}
  .rail ol:not(.rail-log)>li>a:has(.s:not(:empty)):hover>.t,.rail ol:not(.rail-log)>li>a:has(.s:not(:empty)):hover>.n,
  .rail ol:not(.rail-log)>li>a:has(.s:not(:empty)):focus-visible>.t,.rail ol:not(.rail-log)>li>a:has(.s:not(:empty)):focus-visible>.n{transform:translateY(-7px)}

  /* what is found stands from the left edge of the column; the choice of the section on the axis of the word */
  .rail-r .rail-results a.sr,.rail-r .rail-hint,.rail-r .rail-sep{text-align:left}
  .rail-scope{justify-content:center;padding:0}
  /* the list scrolls without a bar, and the light of a line under the pointer is not cut at the edge of the column */
  .rail-r .rail-body{scrollbar-width:none;margin:0 -18px;padding:0 18px}
  .rail-r .rail-body::-webkit-scrollbar{display:none}
}

/* ---------- one column on a narrow screen ----------
   Under 1181 px the middle between two columns of the home page width is too narrow for a table or the clock: the frame
   folds into rows. */
@media (max-width:1180px){
  .frame{display:flex;flex-direction:column;padding:10px 16px 40px;gap:0}
  body.fund-page .frame>main{flex:1 0 auto;min-height:0;margin-top:8px}
  .rail{position:static;max-height:none;min-width:0;max-width:100%}
  .rail-l{order:0}.rail-r{order:1}.frame>main{order:2;margin-top:18px}
  .rail-body{overflow:visible}
  .rail ol{flex-direction:row;overflow-x:auto;scrollbar-width:none;gap:0}
  .rail ol::-webkit-scrollbar{display:none}
  .rail li{flex:0 0 auto}
  .rail a,.rail-r a{display:flex;gap:6px;align-items:baseline;padding:11px 14px 11px 0;margin:0;border:0;transform:none;
    background:none;box-shadow:none;text-align:left;white-space:nowrap}
  .rail li:first-child>a{border-top:0}
  .rail li.fold>a,.rail-r li.fold>a{padding:11px 14px 11px 0}
  .rail a:hover,.rail a:focus-visible,.rail a.on,.rail-r a:hover,.rail-r a.on{border:0;transform:none;background:none;box-shadow:none}
  .rail a::after{display:none}
  .rail .s{display:none}
  .rail li ol{display:none}
  .rail .fold-mark{display:none}
  .rail .n{font-size:12px}
  .rail .t{font-size:15px;color:var(--ink-soft);text-shadow:none}
  .rail a.on .t{color:#fff;box-shadow:0 1px 0 var(--red)}
  .rail-l ol{border-bottom:1px solid var(--rule)}
  .rail-r ol{border-bottom:1px solid var(--rule)}
  .rail-search{margin:10px 0 2px}
  .rail-scope{justify-content:flex-start;padding:0}
  .rail-r .rail-results a.sr,.rail-r .rail-hint,.rail-r .rail-sep{text-align:left}
  .rail-results{margin-top:6px}
  .rail-results a.sr{white-space:normal}
  body.north-home .lines.right{max-height:none}
  body.north-home .lines.right .rail-body{overflow:visible}
  body.north-home .lines.right .rail-results a.sr,body.north-home .lines.right .rail-hint,
  body.north-home .lines.right .rail-sep{text-align:left}
}
@media (prefers-reduced-motion:reduce){.rail a,.rail a::after,.rail .s,.rail-results a.sr{transition:none}}
@media print{.rail,.masthead .z::after{display:none}.frame{display:block}}

/* ---------- the number of a chapter is as big as its heading, on every page ---------- */
body.has-frame main.doc h2 .num,body.has-frame main .doc h2 .num,body.skin main .doc h2 .num{font:inherit;font-size:1em;line-height:inherit;
  color:var(--red);letter-spacing:.04em;margin-right:.45em;min-width:0;display:inline}

/* the three tabs on the left (order of 04.10.2026: "bigger and more beautiful, there are only three of them now") */
@media (min-width:1181px){
  .rail.rail-l{--rt:clamp(22px,1.85vw,32px)}
  .rail.rail-l>ol>li>a{padding:clamp(20px,3vh,32px) 16px}
  .rail.rail-l>ol>li>a>.t{font-family:var(--cond);font-weight:600;text-transform:uppercase;letter-spacing:.08em}
  .rail.rail-l>ol>li>a>.n{font-size:.55em}
  .rail.rail-l ol:not(.rail-log)>li>a>.s{bottom:calc(clamp(20px,3vh,32px) - 14px);font-size:clamp(12px,.9vw,14px)}
  .rail.rail-l ol:not(.rail-log)>li>a:has(.s:not(:empty)):hover>.t,.rail.rail-l ol:not(.rail-log)>li>a:has(.s:not(:empty)):hover>.n,
  .rail.rail-l ol:not(.rail-log)>li>a:has(.s:not(:empty)):focus-visible>.t,.rail.rail-l ol:not(.rail-log)>li>a:has(.s:not(:empty)):focus-visible>.n{transform:translateY(-9px)}
}