/* Circle — the zine layer (pass 4: no rules).
   Loaded after editorial.css; everything here overrides or extends it. */

/* ---------- photocopies: desktop with a cursor only ----------
   The halftone is a toy for the pointer. Phones and tablets keep every
   photograph in full colour, exactly as in pass 3. */
.e-xerox,.e-scrawl--colour{display:none}
@media (min-width:1025px) and (hover:hover) and (pointer:fine){
  .e-xerox{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%}
  .e-cover-photo .e-xerox{transform:scale(1.06);transition:transform 2.4s var(--ease)}
  .e-cover.in .e-cover-photo .e-xerox{transform:none}
  .e-close>.e-xerox{position:absolute;z-index:0}
  .e-cover-photo{-webkit-user-select:none;user-select:none}
  .e-cover-photo.is-xerox{cursor:crosshair}
  .e-scrawl--colour{position:absolute;z-index:5;top:22px;right:max(14px,calc(var(--ring-r,20px) - 6px));flex-direction:column;align-items:flex-end;gap:0;width:min-content;color:var(--ink);font-size:var(--t-m);line-height:.92;text-align:right;white-space:normal;transform:rotate(7deg);text-shadow:0 0 6px var(--paper),0 0 2px var(--paper)}
  .e-scrawl--colour .e-arrowmark{width:26px;margin:2px 18px 0 0;transform:scaleX(-1) rotate(14deg)}
  .e-scrawl--colour .e-arrowmark path{stroke:var(--ink)}
  .is-xerox .e-scrawl--colour{display:inline-flex}
}
@media (prefers-reduced-motion:reduce){.e-xerox{transform:none;transition:none}}

/* ---------- GET dock (small screens) ---------- */
.e-dock{position:fixed;z-index:40;left:0;right:0;bottom:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px var(--g) calc(12px + env(safe-area-inset-bottom));background:var(--ink);color:var(--paper);transform:translateY(calc(100% + 20px));visibility:hidden;transition:transform .45s var(--ease),visibility 0s linear .45s}
.e-dock.on{transform:none;visibility:visible;transition:transform .45s var(--ease)}
.e-dock:before{content:"";position:absolute;left:0;right:0;top:-11px;height:12px;background:inherit;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='18' viewBox='0 0 240 18' preserveAspectRatio='none'%3E%3Cpath d='M0 18V9l9-4 7 6 11-8 8 7 13-6 6 5 12-9 9 8 10-3 8 6 12-8 7 7 14-5 9 4 8-7 11 9 10-6 8 3 13-8 9 7 7-4 11 6 9-5 10 4 9 1V18Z'/%3E%3C/svg%3E") 0 0/240px 12px repeat-x;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='18' viewBox='0 0 240 18' preserveAspectRatio='none'%3E%3Cpath d='M0 18V9l9-4 7 6 11-8 8 7 13-6 6 5 12-9 9 8 10-3 8 6 12-8 7 7 14-5 9 4 8-7 11 9 10-6 8 3 13-8 9 7 7-4 11 6 9-5 10 4 9 1V18Z'/%3E%3C/svg%3E") 0 0/240px 12px repeat-x}
.e-dock img{width:44px;height:44px;border-radius:11px;background:var(--paper)}
.e-dock p{display:grid;gap:3px;margin:0;min-width:0}
.e-dock b{font:900 17px/1 var(--grot);font-stretch:125%;letter-spacing:-.03em;text-transform:uppercase}
/* the icon is ink on an ink bar: a paper hairline keeps its tile visible. A % radius
   keeps squircle.js off it, since its clip would cut the hairline away */
.e-dock>img{border-radius:25%;box-shadow:0 0 0 1.5px rgba(250,250,248,.55)}
.e-dock b img{display:block;width:auto;height:32px;margin:-6px 0 -2px;border-radius:0;background:none}
.e-dock span{overflow:hidden;color:rgba(250,250,248,.66);font:300 15px/1.1 var(--serif);font-style:italic;white-space:nowrap;text-overflow:ellipsis}
.e-dock .e-get{height:36px;min-width:84px;font-size:var(--t-s)}
@media (min-width:1025px){.e-dock{display:none}}
@media (prefers-reduced-motion:reduce){.e-dock,.e-dock.on{transition:none}}

/* ---------- house rules: the contents, crossed out and rewritten ---------- */
.e-rules .e-contents-head{display:grid;justify-items:start;gap:18px;padding-bottom:30px}
.e-rules .e-kicker .e-num{margin-left:10px;font:inherit;letter-spacing:inherit}
.e-rules-title{margin:0;font:900 var(--t-xl)/.9 var(--grot);letter-spacing:-.045em;text-wrap:balance}
.e-rules .e-scrawl--issue{top:-6px;right:4px}
.e-rules .e-toc a{grid-template-columns:34px minmax(0,1fr) auto;grid-template-areas:"n x p" "n t t" "n d d";gap:4px 12px;padding:26px 0 28px}
.e-rules .e-toc-n{grid-area:n;align-self:start;padding-top:.5em}
.e-rules .e-toc-p{grid-area:p;align-self:start}
.e-rules .e-toc-d{grid-area:d;margin-top:8px}
.e-x{grid-area:x;position:relative;justify-self:start;color:var(--mute);font:300 var(--t-m)/1.2 var(--serif);font-style:italic;text-decoration:none}
.e-x:after{content:"";position:absolute;left:-6%;right:-6%;top:54%;height:.2em;background:var(--pink);border-radius:2px;transform:rotate(-3deg) scaleX(0);transform-origin:0 50%;transition:transform .5s var(--ease) .35s}
.in .e-x:after{transform:rotate(-3deg) scaleX(1)}
.e-rules .e-toc-t{grid-area:t;font:900 clamp(44px,13vw,104px)/.86 var(--grot);font-stretch:125%;letter-spacing:-.05em;text-transform:uppercase;text-wrap:balance;transform-origin:0 100%}
.e-rules li[data-reveal] .e-toc-t{opacity:0;transform:rotate(-2deg) scale(1.08);transition:opacity .25s .75s,transform .5s cubic-bezier(.3,1.6,.5,1) .75s}
.e-rules li.in .e-toc-t{opacity:1;transform:none}
.e-rules .e-toc a:hover .e-toc-t{transform:translateX(10px)}
@media (prefers-reduced-motion:reduce){.e-x:after{transform:rotate(-3deg);transition:none}.e-rules li[data-reveal] .e-toc-t{opacity:1;transform:none;transition:none}}
@media (min-width:1025px){
  .e-rules .e-contents-head{gap:22px}
  .e-rules-title{font-size:var(--t-l)}
  .e-rules .e-toc a{grid-template-columns:64px minmax(0,1fr) auto;padding:30px 0 34px}
  .e-rules .e-toc-t{font-size:clamp(64px,6.4vw,112px)}
}

/* ---------- palette: black, newsprint, hot pink, and a Jamie Reid yellow ---------- */
:root{--yellow:#ffe94d;--news:#efece4}
.e-save{background:var(--yellow)}
.e-save .e-lede{color:var(--ink)}
.e-save .e-snap,.e-save .e-receipt-wrap{box-shadow:none}
.e-save .e-snap{box-shadow:0 18px 36px rgba(60,50,0,.2)}
.e-save .e-receipt-wrap{filter:drop-shadow(0 16px 22px rgba(60,50,0,.2))}
.e-local{background:var(--pink)}
.e-local .e-lede,.e-local .e-figure figcaption{color:var(--ink)}
.e-local .local-experience{box-shadow:0 30px 70px rgba(90,0,50,.22)}
.e-r.r4{background:var(--yellow)}
.e-r.r5{background:var(--news)}

/* ---------- house rules: bigger corrections ---------- */
.e-x{font-size:clamp(20px,2vw,30px)}
.e-x:after{height:.24em;top:50%}

/* ---------- editor's letter: on phones the words come first, the photo is pasted after ---------- */
@media (max-width:699px){
  .e-letter{gap:56px}
  .e-letter-copy{order:-1}
  .e-letter-photo{width:88%;justify-self:center;transform:rotate(2deg)}
  .e-letter-photo img{aspect-ratio:4/5;object-fit:cover;object-position:50% 60%}
  .e-ransom{font-size:38px}
}

/* ---------- desktop cover: the headline as paper strips pasted on the black page ---------- */
@media (min-width:1025px){
  .e-cover h1{display:grid;justify-items:start;gap:.07em;text-shadow:none}
  .e-strip{display:block;width:max-content;max-width:100%;padding:.07em .14em .03em .1em;background:var(--ink);color:#fff;box-shadow:0 3px 0 rgba(0,0,0,.18);transform:rotate(-1.4deg)}
  .e-strip:nth-child(2){transform:rotate(.9deg) translateX(.22em)}
  .e-cover h1 .e-strip--it{margin-top:.08em;padding:.04em .2em .1em .14em;background:var(--pink);color:var(--ink);transform:rotate(-2.2deg) translateX(-.04em)}
  .e-cover h1 .e-strip:not(.e-strip--it){background:var(--paper);color:var(--ink);box-shadow:0 4px 0 rgba(255,122,205,.85)}
  .e-scrawl--you{display:none}
  .e-sticker{top:auto;bottom:36px;left:calc(50% - 128px)}
}

/* ---------- closing: the GET gets circled ---------- */
.e-mark--get{display:inline-block}
.e-mark--get>svg{left:-14%;top:-34%;width:128%;height:168%}
.e-mark--get path{stroke-width:5}
/* no pill: the marker loop is the button's border */
.e-mark--get .e-get,.e-mark--get .e-get:hover{background:none;color:var(--paper)}
@media (hover:hover){.e-mark--get .e-get:hover{color:var(--pink)}}

/* ---------- save: tap a polaroid, it gets stamped ---------- */
.e-save-art{position:relative}
.e-scrawl--save{position:absolute;z-index:6;right:2px;top:-30px;display:inline-flex;align-items:flex-end;gap:6px;color:var(--ink);transform:rotate(-5deg)}
.e-scrawl--save .e-arrowmark path{stroke:var(--ink)}
.e-collage .e-snap{cursor:pointer;-webkit-tap-highlight-color:transparent}
.e-collage .e-snap:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.e-snap-stamp{position:absolute;z-index:4;left:50%;top:38%;padding:5px 12px 3px;border:4px solid var(--pink);border-radius:7px;color:var(--pink);font:900 clamp(26px,2.4vw,34px)/1 var(--grot);font-stretch:125%;letter-spacing:.02em;text-transform:uppercase;pointer-events:none;opacity:0;border-width:5px;background:rgba(255,255,255,.84);transform:translate(-50%,-50%) rotate(-14deg) scale(2.2);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -3.2 2.4'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -3.2 2.4'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}
.e-snap.is-saved .e-snap-stamp{opacity:.95;transform:translate(-50%,-50%) rotate(-14deg) scale(1);transition:transform .28s cubic-bezier(.5,1.8,.6,1),opacity .1s}
.e-snap.is-thunk{animation:e-thunk .3s}
@keyframes e-thunk{30%{translate:0 4px}}
@media (prefers-reduced-motion:reduce){.e-snap.is-saved .e-snap-stamp{transition:none}.e-snap.is-thunk{animation:none}}

/* ---------- people: ransom initials ---------- */
.e-avatar{border-radius:0;transform:rotate(-4deg);box-shadow:0 2px 0 rgba(0,0,0,.18)}
.e-overheard li:nth-child(2) .e-avatar{background:var(--pink);color:var(--ink);font-stretch:75%;transform:rotate(5deg)}
.e-overheard li:nth-child(3) .e-avatar{background:var(--yellow);color:var(--ink);font-family:var(--serif);font-style:italic;font-weight:300;font-size:30px;transform:rotate(-2deg)}

/* ---------- footer: a wall to slap stickers on ---------- */
.e-wall{position:relative;margin-bottom:34px;cursor:copy;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
.e-wall .e-foot-word{margin:0}
.e-sticky{position:absolute;left:var(--x);top:var(--y);padding:7px 12px 6px;font:900 clamp(13px,1.3vw,18px)/1 var(--grot);font-stretch:125%;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;pointer-events:none;transform:translate(-50%,-50%) rotate(var(--r));box-shadow:0 3px 0 rgba(0,0,0,.35)}
.e-sticky--pink{background:var(--pink);color:var(--ink);border-radius:999px}
.e-sticky--yellow{background:var(--yellow);color:var(--ink)}
.e-sticky--paper{background:var(--news);color:var(--ink);font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(16px,1.6vw,22px);text-transform:none;letter-spacing:0}
.e-sticky--ink{background:var(--paper);color:var(--ink);border:2px solid var(--ink)}
.e-sticky--burst{width:clamp(78px,7vw,100px);height:clamp(78px,7vw,100px);padding:0;font-size:clamp(14px,1.3vw,18px);font-stretch:100%;display:grid;place-items:center;background:var(--pink);color:var(--ink);box-shadow:none;clip-path:polygon(50% 0,61% 18%,80% 8%,79% 29%,100% 31%,86% 48%,100% 64%,79% 68%,82% 90%,62% 81%,50% 100%,39% 81%,18% 90%,21% 68%,0 64%,14% 48%,0 31%,21% 29%,20% 8%,39% 18%)}
.e-sticky.is-new{animation:e-slap .32s cubic-bezier(.5,1.8,.6,1)}
@keyframes e-slap{from{transform:translate(-50%,-50%) rotate(var(--r)) scale(1.9);opacity:0}}
.e-scrawl--slap{position:absolute;right:0;bottom:-12px;transform:rotate(-4deg)}
@media (prefers-reduced-motion:reduce){.e-sticky.is-new{animation:none}}
@media (max-width:699px){
  .e-wall{padding-top:clamp(120px,36vw,170px)}
  .e-scrawl--slap{bottom:-22px}
  .e-mark--get>svg{left:-6%;width:112%}
}
@media (max-width:1024px){
  .e-local .e-figure img{aspect-ratio:5/4;object-fit:cover;object-position:50% 72%}
}

/* ---------- the demo phone, taped into the zine ---------- */
.demo-phone{position:relative}
.demo-phone .e-tape{z-index:6;width:120px;height:32px;mix-blend-mode:normal;background:rgba(244,238,220,.9);pointer-events:none}
.e-tape--tl{top:8px;left:-50px;transform:rotate(-42deg)}
.e-tape--br{bottom:8px;right:-50px;transform:rotate(-42deg)}
.e-tryme{position:absolute;z-index:7;top:-28px;right:-14px;width:96px;transform:rotate(14deg);filter:drop-shadow(0 6px 10px rgba(0,0,0,.4));pointer-events:none;animation:e-wobble 3.2s ease-in-out infinite}
.e-tryme polygon{fill:var(--yellow)}
.e-tryme text{font:900 25px var(--grot);font-stretch:125%;letter-spacing:-.02em;fill:var(--ink)}
@keyframes e-wobble{50%{transform:rotate(6deg) scale(1.04)}}
@media (prefers-reduced-motion:reduce){.e-tryme{animation:none}}
@media (max-width:1024px){.e-tryme{right:-6px;width:84px}}

/* ---------- ticker: yellow tape, so the yellow arrives early ---------- */
.e-ticker{background:var(--yellow)}

/* ======================================================================
   iPhone pass — everything below 1025px is laid out for a thumb, not a
   cursor, whatever device is looking at it.
   ====================================================================== */
:root{--g:max(clamp(20px,4vw,64px),env(safe-area-inset-left),env(safe-area-inset-right))}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
a,button,[role=button]{-webkit-tap-highlight-color:transparent}

/* collections: a deck of polaroids in full colour — flick or tap the top one to the back */
.e-scrawl--flick{display:none}
@media (max-width:1024px){
  .e-fan{display:grid;place-items:center;height:auto;margin-top:64px;padding:4px 0 26px;touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none}
  .e-fan .e-snap,.e-fan .e-snap:nth-child(n){grid-area:1/1;position:relative;left:auto;right:auto;top:auto;width:min(74%,380px);cursor:grab;transition:transform .45s var(--ease),opacity .3s}
  .e-fan .e-snap img{filter:none;-webkit-user-drag:none;-webkit-touch-callout:none}
  .e-fan .e-snap figcaption{font-size:var(--t-m)}
  /* without JavaScript the middle polaroid (the one with the pin) sits on top */
  .e-fan .e-snap:nth-child(2):not([data-pos]),.e-fan .e-snap[data-pos="0"]{z-index:3;transform:translateX(var(--dx,0px)) rotate(calc(-2deg + var(--tilt,0deg)))}
  .e-fan .e-snap:nth-child(3):not([data-pos]),.e-fan .e-snap[data-pos="1"]{z-index:2;transform:translate(9%,2%) rotate(6deg)}
  .e-fan .e-snap:nth-child(1):not([data-pos]),.e-fan .e-snap[data-pos="2"]{z-index:1;transform:translate(-9%,4%) rotate(-8deg)}
  .e-fan .e-snap.is-drag{transition:none;cursor:grabbing}
  .e-fan .e-snap.is-out{opacity:0;transform:translateX(calc(var(--out,1) * 115%)) rotate(calc(var(--out,1) * 16deg))!important}
  .e-fan .e-snap:focus-visible{outline:2px solid var(--pink);outline-offset:4px}
  .e-coll-art .e-burst{top:12px}
  .e-scrawl--flick{display:inline-flex;align-items:center;gap:8px;position:absolute;z-index:8;left:0;top:6px;transform:rotate(-5deg)}
  .e-scrawl--flick .e-arrowmark{width:44px}
}
@media (prefers-reduced-motion:reduce){.e-fan .e-snap{transition:none}}

/* demo steps: the row scrolls sideways, so its far edge fades while there's more */
@media (max-width:1024px){
  .e-demo .steps{-webkit-mask:linear-gradient(90deg,#000 calc(100% - 56px),transparent);mask:linear-gradient(90deg,#000 calc(100% - 56px),transparent);scroll-snap-type:x proximity}
  .e-demo .steps.at-end{-webkit-mask:none;mask:none}
  .e-demo .step{scroll-snap-align:start;scroll-margin-left:var(--g)}
}

/* taps answer back */
@media (max-width:1024px){
  .e-get:active{opacity:1;transform:scale(.96)}
  .e-get{transition:background .15s,transform .12s}
  .e-rules .e-toc a:active .e-toc-t{color:var(--pink)}
  .e-link:active{color:var(--pink)}
  .e-collage .e-snap:active{transform:rotate(0) scale(.98)}
}

/* share: a plain link-style button, only shown where the share sheet exists */
.e-share{padding:0;border:0;border-radius:0;background:none;cursor:pointer}
.e-share[hidden]{display:none}
@media (min-width:1025px){.e-share{display:none}}

/* demo on a phone: tabs, then what this screen is and what to tap, then the phone.
   Kept tight so the cue sits right above the screen it's talking about. */
@media (max-width:1024px){
  .e-demo .demo-grid{grid-template-columns:minmax(0,1fr);gap:22px}
  .e-demo .steps{grid-column:1;grid-row:1}
  .e-demo .explainer{grid-column:1;grid-row:2;padding:4px 0 6px}
  .e-demo .demo-phone{grid-column:1;grid-row:3}
  .e-demo .explainer p{margin-top:10px}
  .e-demo .hint{margin-top:16px}
}
@media (max-width:1024px){
  .e-demo .step{grid-template-columns:auto minmax(0,1fr);gap:8px;padding-right:34px}
}

/* scrolling on a phone: nothing on the page may hold on to a swipe.
   The Local panel was its own scroll box set to keep every swipe, so on iPhone
   the page froze under a finger on the white card. */
@media (max-width:1024px){
  .e-local .local-experience{overflow:visible;max-height:none}
  /* the detail card still rises from the bottom, clear of the GET bar */
  .e-local .discovery-detail{bottom:calc(88px + env(safe-area-inset-bottom))}
}
@media (max-width:1024px),(hover:none){
  .local-experience,.activity-scroll{overscroll-behavior:auto}
}

/* iOS keeps :hover on whatever was last tapped; don't let it stick */
@media (hover:none){
  .e-rules .e-toc a:hover .e-toc-t,.e-toc a:hover .e-toc-t{transform:none}
  .e-ticker:hover .e-ticker-track{animation-play-state:running}
}

/* ---------- save: the receipt reprints with every change ---------- */
.e-receipt-wrap.is-print .e-receipt>*{animation:e-print .42s var(--ease) both}
.e-receipt-wrap.is-print .e-receipt>strong{animation-delay:.05s}
.e-receipt-wrap.is-print .e-receipt>p:last-child{animation-delay:.1s}
@keyframes e-print{from{opacity:0;transform:translateY(7px)}}
.e-receipt-wrap.is-print .e-stamp{animation:e-restamp .34s cubic-bezier(.5,1.8,.6,1) both}
@keyframes e-restamp{from{opacity:0;transform:rotate(-12deg) scale(1.7)}}
.e-receipt-wrap .e-stamp{transition:opacity .2s}
.e-receipt-wrap.is-empty .e-stamp{opacity:0;animation:none}
@media (prefers-reduced-motion:reduce){.e-receipt-wrap.is-print .e-receipt>*,.e-receipt-wrap.is-print .e-stamp{animation:none}}

/* on a phone the four polaroids and the receipt fit on one screen, so every tap is seen */
@media (max-width:699px){
  .e-save .e-collage{margin-top:44px}
  .e-save .e-arrow{width:22px;height:40px;margin:18px auto 4px}
  .e-save .e-receipt{padding:26px 22px 30px}
  .e-save .e-receipt strong{margin:10px 0 8px}
  .e-stamp{font-size:var(--t-m);top:-16px;right:-2px;padding:5px 11px 3px;border-width:3px}
}

/* collections on a phone: headline, then straight to the deck; the pull quote follows it */
@media (max-width:1024px){
  .e-coll .e-spread-head{display:contents}
  .e-coll .e-spread-head>*{order:-1}
  .e-coll .e-spread-head>.e-kicker{margin-bottom:22px}
  .e-coll .e-spread-head>.e-h{margin-bottom:22px}
  .e-coll .e-spread-head>.e-quote{order:1;margin-top:64px}
  .e-coll .e-coll-art{margin-top:40px}
}

/* ---------- demo on a phone: a screen you swipe through ---------- */
.e-demo-dots{display:none}
@media (max-width:1024px){
  .e-demo .screen{touch-action:pan-y pinch-zoom}
  .e-demo-dots{display:grid;justify-items:center;gap:10px;margin-top:22px}
  .e-demo-dots-row{display:flex;gap:8px}
  .e-demo-dots i{width:7px;height:7px;border-radius:50%;background:rgba(250,250,248,.32);transition:width .3s var(--ease),background .3s}
  .e-demo-dots i.on{width:22px;border-radius:4px;background:var(--pink)}
  .e-demo-dots-label{color:rgba(250,250,248,.6);font:800 var(--t-xs)/1 var(--grot);font-stretch:125%;letter-spacing:.06em;text-transform:uppercase;transition:opacity .4s}
  .e-demo-dots.used .e-demo-dots-label{opacity:0}
}

/* cover on phones and tablets: keep a lane clear for the spinning sticker, so
   "Try the demo" never ends up underneath it (it did at 430px, iPhone Pro Max) */
@media (min-width:360px) and (max-width:1024px){
  .e-cover-text .e-actions{padding-right:124px}
}