.story{scroll-margin-top:clamp(20px,4vw,48px)}
.day{position:fixed;z-index:15;opacity:0;pointer-events:none;
  transition:opacity .25s ease,background-color .25s ease,border-color .25s ease;
  border:1px solid var(--line);background:var(--bg);padding:3px}
.day.on{opacity:1;pointer-events:auto}
.day-lane{position:relative;z-index:1;display:flex}
.day a{position:relative;display:grid;place-items:center;border-radius:999px;
  color:var(--dim);text-decoration:none;font-size:var(--fs-tile-s);line-height:1;
  font-variant-numeric:tabular-nums;-webkit-user-drag:none;
  transition:color .2s ease,background-color .2s ease}
.day a:hover{color:var(--ink)}
.day a:focus-visible{outline:1px solid var(--s5);outline-offset:3px}
.day a span{transition:opacity .2s ease}
.day a::before{content:'';position:absolute;left:50%;top:50%;width:10px;height:1px;margin-left:-5px;
  background:var(--s4);opacity:0;transition:opacity .2s ease}

.day:not(.low){right:var(--frame);top:0;transform:translateY(-50%);
  border-radius:calc(var(--fs-tile-s) / 2 + 11px)}
.day:not(.low) .day-lane{flex-direction:column}
.day:not(.low) .day-lens{display:none}
.day:not(.low) a{height:calc(var(--fs-tile-s) + 14px);padding:0 13px;
  transition:color .2s ease,background-color .2s ease,height .36s cubic-bezier(.5,1,.89,1)}
.day:not(.low) a.now{background:var(--red);color:#fff}
.day:not(.low):not(.open){background-color:transparent;border-color:transparent}
.day:not(.low):not(.open) a:not(.now){height:10px}
.day:not(.low):not(.open) a:not(.now) span{opacity:0}
.day:not(.low):not(.open) a:not(.now)::before{opacity:1}
.day:not(.low).open a::before{transition-duration:.1s}
.day.measure,.day.measure *{transition:none!important}

.day.low{--up:calc(24px + env(safe-area-inset-bottom));
  left:var(--frame);right:var(--frame);bottom:var(--up);border-radius:999px;overflow:hidden;padding:3px 0;
  border:1px solid rgba(255,255,255,.22);background:rgba(10,10,10,.16);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);
  transition:opacity .25s ease,transform .3s cubic-bezier(.22,1,.36,1)}
.day.low.is-hidden{transform:translateY(calc(100% + var(--up) + 4px));pointer-events:none}
.day.low .day-lane{align-items:center;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  scrollbar-width:none;padding:0 calc(50% - 38px);
  cursor:grab;-webkit-user-select:none;user-select:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent)}
.day.low .day-lane::-webkit-scrollbar{display:none}
.day.low .day-lane.drag{cursor:grabbing;scroll-snap-type:none}
.day.low a{flex:none;width:76px;height:32px;font-size:15px;scroll-snap-align:center}
.day.low a.now{color:#fff}
.day.low a::before{display:none}
.day.low .day-lens{position:absolute;left:50%;top:3px;height:32px;width:76px;margin-left:-38px;
  z-index:0;border-radius:999px;background:var(--red);pointer-events:none}
.story-grid{display:grid;grid-template-columns:1fr;
  gap:var(--sp2);margin-top:var(--sp4)}
.story-grid .tile{grid-column:auto;justify-content:flex-start}
.story-grid .story-mark{margin:0 0 var(--sp2)}
.story .tile.t-mesto{background:none;border:1px solid var(--red)}