
:root{
  --ink:#0d0d0d; --paper:#f2efe8; --signal:#ff3d00; --mute:#8a867d;
  --felt:#151412;
  --sans:"Archivo",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --pad:clamp(14px,3vw,40px);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 1.4 -.35'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html,body{margin:0}
body{position:relative;min-height:100vh;color:var(--paper);font-family:var(--sans);-webkit-font-smoothing:antialiased;
  background:radial-gradient(ellipse 70% 55% at 50% 42%,rgba(255,236,200,.06),rgba(0,0,0,0) 70%),radial-gradient(ellipse at 50% 40%,#1e1c19 0%,var(--felt) 55%,#0b0a09 100%);background-color:var(--felt)}

body::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--grain) 0 0/160px 160px;opacity:.09;pointer-events:none}
a{color:inherit}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}


.ct-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 20px;padding:14px var(--pad) 0}
.ct-mark{display:inline-flex;align-items:center;gap:2px;text-decoration:none;font:900 clamp(20px,2.1vw,28px)/1 var(--sans);letter-spacing:-.04em;text-transform:uppercase}
.ct-mark img{width:1.25em;height:1.25em;border-radius:50%}
.ct-ai{margin:0;font:400 12px/1.4 var(--mono);color:#cfcac0}


.ct-main{padding:10px var(--pad) 0}

.table{--tw:1200;--th:900;--cq:calc(1cqw * var(--cqk,1));position:relative;margin:0 auto;container-type:inline-size;
  width:min(100%,2600px,calc((100svh - var(--chrome,118px)) * var(--tw) / var(--th)));min-width:min(100%,720px);aspect-ratio:var(--tw)/var(--th)}
.conduits{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:0}
.conduits path{fill:none;stroke-linecap:square;stroke-linejoin:miter}
.cd-ink{stroke:#050404;stroke-width:19;opacity:.85}
.conduits path.cd-hop,.conduits.pre path.cd-hop,.conduits.in path.cd-hop{stroke:var(--felt);stroke-width:34;stroke-linecap:butt;fill:none;stroke-dasharray:none;stroke-dashoffset:0;transition:none}   
.cd-col{stroke-width:12}
.cd-core{stroke:rgba(5,4,4,.55);stroke-width:1.6;stroke-dasharray:.004 .006}   

.conduits path.cd-pulse,.conduits.in path.cd-pulse{stroke-width:8;stroke-linecap:round;stroke-dasharray:.07 1.6;stroke-dashoffset:.07;opacity:.85;transition:none;
  animation:cdpulse var(--pd,5s) linear var(--pdl,0s) infinite}
.conduits.pre:not(.in) path.cd-pulse{opacity:0;animation:none}
@keyframes cdpulse{from{stroke-dashoffset:.07}to{stroke-dashoffset:-1}}

.conduits path.cd-ink.cd-thick{stroke-width:48}
.conduits path.cd-col.cd-thick{stroke-width:32}
.conduits path.cd-core.cd-thick{stroke-width:4}
.conduits path.cd-pulse.cd-thick,.conduits.in path.cd-pulse.cd-thick{stroke-width:21}
.conduits path.cd-hop.cd-hop-thick,.conduits.pre path.cd-hop.cd-hop-thick,.conduits.in path.cd-hop.cd-hop-thick{stroke-width:64}   
.conduits.pre path{stroke-dasharray:1;stroke-dashoffset:1}
.conduits.pre .cd-core{stroke-dasharray:1}
.conduits.in path{stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset .9s cubic-bezier(.5,0,.2,1)}
.conduits.in .cd-core{stroke-dasharray:.004 .006;transition:none}


.cards{position:absolute;inset:0;z-index:1}
.card{position:absolute;display:block;translate:-50% -50%;color:var(--paper)}
.hit{display:block;text-decoration:none;color:inherit;outline:none}
.card[hidden]{display:none}
.face{position:relative;display:block;width:100%;overflow:hidden;
  transform:rotate(var(--rot,0deg));transition:transform .25s cubic-bezier(.3,.7,.3,1),box-shadow .25s;
  background:var(--paper);padding:max(3px,calc(.33 * var(--cq)));border-radius:max(3px,calc(.45 * var(--cq)));
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 calc(.5 * var(--cq)) calc(1.1 * var(--cq)) rgba(0,0,0,.55),0 calc(.1 * var(--cq)) calc(.25 * var(--cq)) rgba(0,0,0,.6)}
.face>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:max(1px,calc(.2 * var(--cq)))}
a.hit:hover .face,a.hit:focus-visible .face{transform:rotate(0deg) translateY(calc(-.5 * var(--cq)));box-shadow:0 calc(1.4 * var(--cq)) calc(2.2 * var(--cq)) rgba(0,0,0,.6),0 calc(.2 * var(--cq)) calc(.3 * var(--cq)) rgba(0,0,0,.6)}
a.hit:focus-visible .face{outline:2px solid var(--signal);outline-offset:3px}


.under{position:absolute;left:50%;top:100%;translate:-50% 0;margin-top:max(7px,calc(.7 * var(--cq)));width:max-content;max-width:190%;display:flex;flex-direction:column;align-items:center;gap:max(5px,calc(.45 * var(--cq)))}
.tag{padding:3px 7px 4px;background:rgba(21,20,18,.94);border-radius:2px;text-align:center;pointer-events:none;display:flex;flex-direction:column;gap:3px}

.signup{font:700 clamp(9px,calc(.78 * var(--cq)),11px)/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--paper);background:rgba(21,20,18,.94);border:1px solid rgba(242,239,232,.45);border-radius:99px;padding:5px 9px 5px;white-space:nowrap}
.signup:hover,.signup:focus-visible{border-color:var(--paper);background:var(--paper);color:var(--ink);outline:none}
.t-name{font:800 clamp(10px,calc(1.02 * var(--cq)),14px)/1.05 var(--sans);letter-spacing:.05em;text-transform:uppercase}
.t-serif{font:italic 400 clamp(16px,calc(1.7 * var(--cq)),24px)/1 var(--serif);letter-spacing:0;text-transform:none}
.t-line{font:400 clamp(9px,calc(.86 * var(--cq)),12px)/1.3 var(--mono);color:#b9b4aa}
.t-line:empty{display:none}
.c-gg .t-name{font-size:clamp(9px,calc(.8 * var(--cq)),11px);font-weight:600;letter-spacing:.03em;text-transform:none}
.c-gg .under{max-width:none}
.c-hi-freqs .t-line{color:var(--signal)}


.cell{position:relative;display:block;width:100%;height:100%;border-radius:max(1px,calc(.2 * var(--cq)));overflow:hidden}
.cell::after{content:"";position:absolute;inset:0;background:var(--grain) 0 0/120px 120px;mix-blend-mode:multiply;opacity:.55;pointer-events:none}
.cell .win{position:absolute;inset:22%;border:max(2px,calc(.22 * var(--cq))) solid #1b1714;border-radius:1px}
.cell-bio{background:linear-gradient(172deg,#cdc0cf 0%,#e4dfd8 46%,#e6e1db 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(.7 * var(--cq));color:#171311;
  box-shadow:inset 0 0 0 max(2px,calc(.2 * var(--cq))) #171311, inset 0 0 0 max(6px,calc(.65 * var(--cq))) transparent}
.cell-bio::before{content:"";position:absolute;inset:max(7px,calc(.75 * var(--cq)));border:max(1px,calc(.12 * var(--cq))) solid rgba(23,19,17,.55)}
.bio-t{font:900 clamp(20px,calc(2.7 * var(--cq)),40px)/.9 var(--sans);letter-spacing:-.03em;text-transform:uppercase;text-align:center}
.bio-n{font:700 clamp(8px,calc(.78 * var(--cq)),11px)/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--signal)}
.cell-bars{background:linear-gradient(160deg,#aaa69c 0%,#8b8a84 45%,#686a67 100%)}
.cell-bars .win{inset:24%;background:repeating-linear-gradient(90deg,#1b1714 0 max(2px,calc(.2 * var(--cq))),transparent 0 22%);background-color:rgba(255,255,255,.1)}
.cell-hatch{background:#141210}
.cell-hatch .win{inset:14% 16%;border-color:var(--paper);background:repeating-linear-gradient(135deg,transparent 0 calc(.55 * var(--cq)),#e9e4da calc(.55 * var(--cq)) calc(.78 * var(--cq)))}
.cell-moon{background:linear-gradient(170deg,#f2efe8,#cdc0cf)}
.cell-moon .win{inset:30%;border-radius:50%;background:#fff;border-color:#1b1714}


.f-graphics{background:linear-gradient(170deg,#36b2e6 0%,#51c2ee 35%,#4acc76 70%,#37984b 100%);perspective:900px;overflow:visible}
.gx{position:relative;display:block;width:100%;height:100%}
.gx-card{position:absolute;inset:0;display:block;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.45,.05,.3,1)}
.gx-card.is-flipping{transform:rotateY(180deg)}
.gx-card.no-anim{transition:none!important}
.gx-face{position:absolute;inset:0;background:var(--paper) center/contain no-repeat;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.gx-back{transform:rotateY(180deg)}


.f-instagram{background:linear-gradient(170deg,#f8cc0c 0%,#f2b708 42%,#f08e07 100%)}
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:max(2px,calc(.22 * var(--cq)));width:100%;height:100%}
.ig-grid i{display:block;background:var(--paper) center/contain no-repeat}
.ig-grid .ig-empty{background:linear-gradient(170deg,rgba(255,255,255,.35),rgba(255,255,255,0)),transparent;box-shadow:inset 0 0 0 max(1px,calc(.12 * var(--cq))) rgba(27,23,20,.6)}


.f-back{background:var(--paper)}
.back,.deck i,.draw-back,.deal-back{position:relative;display:block;width:100%;height:100%;border-radius:max(1px,calc(.2 * var(--cq)));
  background:var(--card-back,none) center/cover no-repeat,#ece9e2}
.card.is-down:hover .face{transform:rotate(calc(var(--rot,0deg) - 4deg)) translate(calc(.4 * var(--cq)),calc(-.6 * var(--cq)))}
.deck{position:absolute;translate:-50% -50%;aspect-ratio:.5625;z-index:0;transform:rotate(var(--rot,0deg));
  display:block;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer;perspective:700px;-webkit-tap-highlight-color:transparent}
.cards{pointer-events:none}.card{pointer-events:auto}   
.deck:focus-visible{outline:2px solid var(--signal);outline-offset:4px}
.deck i{position:absolute;inset:0;border:max(2px,calc(.3 * var(--cq))) solid var(--paper);border-radius:max(3px,calc(.45 * var(--cq)));box-shadow:0 calc(.2 * var(--cq)) calc(.5 * var(--cq)) rgba(0,0,0,.5)}
.deck i:nth-child(1){transform:translate(calc(.5 * var(--cq)),calc(.45 * var(--cq))) rotate(3deg)}
.deck i:nth-child(2){transform:translate(calc(.3 * var(--cq)),calc(.28 * var(--cq))) rotate(-2deg)}
.deck i:nth-child(3){transform:translate(calc(.14 * var(--cq)),calc(.12 * var(--cq))) rotate(1deg)}

.draw{position:absolute;inset:0;display:block;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.45,.05,.3,1)}
.draw-face{position:absolute;inset:0;border:max(2px,calc(.3 * var(--cq))) solid var(--paper);border-radius:max(3px,calc(.45 * var(--cq)));box-shadow:0 calc(.2 * var(--cq)) calc(.5 * var(--cq)) rgba(0,0,0,.5);
  backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.draw-front{transform:rotateY(180deg);background:var(--paper);display:flex;align-items:center;justify-content:center}
.draw-img{position:absolute;inset:4%;display:block}
.draw-img img{display:block;width:100%;height:100%;object-fit:contain}
.draw-front .stamp{font-size:max(5px,calc(.42 * var(--cq)))}
.deck.is-drawn .draw{transform:rotateY(180deg)}
.deck.no-flip .draw{transition:none}
.deck:not(.is-drawn):hover .draw{translate:0 calc(-.35 * var(--cq))}
@media (hover:none){.deck:hover .draw{translate:none}}
.deal-back{position:absolute;inset:0;z-index:4;opacity:0;pointer-events:none;transform-origin:50% 50%}


.alt-back{display:none;position:absolute;inset:max(3px,calc(.33 * var(--cq)))}
.card.dealt-down .alt-back{display:block}


.spreads{display:flex;justify-content:center;gap:4px;margin:14px auto 0}
.spreads button{font:700 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#9d988e;background:transparent;border:1px solid #3a3733;border-radius:99px;padding:7px 11px;cursor:pointer}
.spreads button[aria-pressed="true"]{color:var(--ink);background:var(--paper);border-color:var(--paper)}
.spreads button:hover{border-color:var(--paper);color:var(--paper)}
.spreads button[aria-pressed="true"]:hover{color:var(--ink)}
.note{font:400 13px/1.6 var(--mono);color:var(--mute);text-align:center}


.ct-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px var(--pad) 22px;font:400 12px/1 var(--mono);color:#8f8a80}
.ct-foot p{margin:0}
.foot-amp{color:var(--signal);width:64px}
.mark3{display:block;width:100%;aspect-ratio:2989/1819;background-color:currentColor;-webkit-mask:url(img/TRIPLE-AMPERSAND-logo.svg) center/contain no-repeat;mask:url(img/TRIPLE-AMPERSAND-logo.svg) center/contain no-repeat}
.hamp{position:relative;display:inline-block;width:.64em;height:.83em;vertical-align:-.1em;margin:0 .06em;background:currentColor;-webkit-mask:url("img/amp-glyph.svg") center/contain no-repeat;mask:url("img/amp-glyph.svg") center/contain no-repeat}
.hamp-t{position:absolute;inset:0;overflow:hidden;color:transparent;font-size:1px;line-height:1;white-space:nowrap}


@media (max-width:720px){
  .table{width:100%;min-width:0;aspect-ratio:auto;display:block;padding:18px 0 8px;container-type:normal}
  .conduits{display:none}
  .deck{position:relative;left:auto!important;top:auto!important;translate:none;width:34%!important;margin:40px auto 0;transform:rotate(-2deg)}
  .draw-face,.deck i{border-width:3px;border-radius:4px}
  .table::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:12px;translate:-50% 0;border:3px solid #050404;border-width:0 3px;
    background:linear-gradient(180deg,#f8cc0c,#4acc76 18%,#36b2e6 30%,#036cda 44%,#50127d 56%,#c30610 68%,#f0780a 82%,#997faf)}
  .cards{position:relative;inset:auto;display:flex;flex-direction:column;gap:30px}
  .card{position:relative;left:auto!important;top:auto!important;translate:none;width:62%!important;align-self:flex-start;margin-left:var(--mx,4%)}
  .card.alt{align-self:flex-end;margin-right:var(--mx,4%);margin-left:0}
  .alt-back{inset:3px}
  .card[style*="--ar:0.8"]{width:56%!important}
  .card[style*="--ar:0.5625"]{width:46%!important}
  .card.is-wide{width:88%!important;align-self:center;margin:0}
  .card.c-gg{width:26%!important}
  .card.c-cv{align-self:center;margin:0;width:52%!important}
  .face{padding:3px;border-radius:4px;box-shadow:0 6px 14px rgba(0,0,0,.55)}
  .cell-bio{gap:8px}.bio-t{font-size:30px}.bio-n{font-size:10px}
  .cell-bio::before{inset:7px}
  .cell-hatch .win{background:repeating-linear-gradient(135deg,transparent 0 5px,#e9e4da 5px 7px)}
  .under{position:relative;left:auto;top:auto;translate:none;margin:9px auto 0;max-width:none;width:100%}
  .card.c-gg .under{width:max-content;margin-left:50%;translate:-50% 0}
  .tag{padding:3px 6px}
  .signup{font-size:11px;padding:7px 11px}
  .t-name{font-size:12px}.t-line{font-size:11px}.t-serif{font-size:22px}
  .ct-foot{padding-top:30px}
}

@media (pointer:coarse){
  .spreads{gap:8px;margin-top:18px}
  .spreads button{font-size:12px;padding:12px 16px;min-height:44px}
  .signup{font-size:12px;padding:10px 14px}
  .t-name{font-size:max(12px,calc(1.02 * var(--cq)))}
  .t-line{font-size:max(11px,calc(.86 * var(--cq)))}
  .t-serif{font-size:max(19px,calc(1.7 * var(--cq)))}
  a.hit:hover .face{transform:rotate(var(--rot,0deg))}
  a.hit:active .face{transform:rotate(0deg) translateY(calc(-.4 * var(--cq)))}
}
@media (orientation:portrait) and (min-width:721px){
  .table{width:min(100%,2600px,calc((100svh - var(--chrome,150px)) * var(--tw) / var(--th)))}
}
@media (prefers-reduced-motion:reduce){
  .face,.gx-card,.conduits.in path,.draw{transition:none!important}
  .gx-card{transform:none!important}
}

.spine{display:none}
@media (max-width:720px){
  .table::before{content:none}
  .spine{display:block;position:absolute;inset:0;z-index:0;pointer-events:none}
  .spine i{position:absolute;left:50%;width:12px;translate:-50% 0;border:3px solid #050404;border-width:0 3px;overflow:hidden}
  .spine i::after{content:"";position:absolute;left:0;right:0;top:0;height:var(--ph,40px);background:linear-gradient(180deg,rgba(0,0,0,0),var(--pc,#fff) 50%,rgba(0,0,0,0));opacity:.9;
    will-change:transform;animation:spdown var(--pd,5s) linear var(--pdl,0s) infinite}
  .spine i[data-dir="up"]::after{animation-name:spup}
  .spine i[data-weight="thick"]{width:32px;border-width:0 6px;--ph:100px}   
}

.stamp{position:absolute;z-index:3;right:6%;bottom:5%;display:flex;align-items:center;gap:.28em;pointer-events:none;
  transform-origin:100% 100%;transform:rotate(-90deg) translateX(100%);white-space:nowrap;
  font:700 max(6px,calc(.52 * var(--cq)))/1 var(--mono);letter-spacing:.04em;color:#0d0d0d;filter:drop-shadow(0 0 .6px rgba(242,239,232,.95)) drop-shadow(0 0 1.5px rgba(242,239,232,.6))}
.stamp img{display:block;height:2.1em;width:auto}
.stamp[hidden]{display:none}
.f-graphics .stamp{right:5%;bottom:5%}
@media (max-width:720px){ .stamp{font-size:7px} }

@keyframes spdown{from{transform:translateY(calc(-1 * var(--ph,40px)))}to{transform:translateY(var(--len,200px))}}
@keyframes spup{from{transform:translateY(var(--len,200px))}to{transform:translateY(calc(-1 * var(--ph,40px)))}}
@media (prefers-reduced-motion: reduce){.conduits path.cd-pulse{display:none;animation:none}.spine i::after{display:none;animation:none}}

.c-new-age .face>img{box-shadow:0 0 0 1px rgba(23,19,17,.12)}


.cell-store{background:radial-gradient(ellipse 60% 50% at 50% 55%,rgba(255,255,255,.16),rgba(255,255,255,0) 70%),linear-gradient(165deg,#50127d 0%,#7a2c9e 22%,#4acc76 56%,#f8cc0c 78%,#f0780a 100%);
  box-shadow:inset 0 0 0 max(2px,calc(.2 * var(--cq))) #171311}
.cell-store .planet{position:absolute;inset:6%;width:88%;height:88%;display:block;overflow:visible}
.c-store .t-name{letter-spacing:.14em}

.c-store .float{display:block;position:relative;animation:storefloat 10s ease-in-out infinite;will-change:transform}
.table.laying .c-store .float{animation:none}
@keyframes storefloat{0%{transform:translate(0,0) rotate(0deg)}25%{transform:translate(1.5px,-4px) rotate(.6deg)}50%{transform:translate(0,-6px) rotate(0deg)}75%{transform:translate(-1.5px,-3px) rotate(-.6deg)}100%{transform:translate(0,0) rotate(0deg)}}
.c-store button.hit{display:block;width:100%;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.c-store .hit:hover .face,.c-store .hit:focus-visible .face{transform:rotate(0deg) translateY(calc(-.5 * var(--cq)));box-shadow:0 calc(1.4 * var(--cq)) calc(2.2 * var(--cq)) rgba(0,0,0,.6),0 calc(.2 * var(--cq)) calc(.3 * var(--cq)) rgba(0,0,0,.6)}
.c-store .hit:focus-visible .face{outline:2px solid var(--signal);outline-offset:3px}

.c-store .soon{position:absolute;left:50%;top:calc(100% + 4px);translate:-50% 0;white-space:nowrap;font:700 clamp(9px,calc(.78 * var(--cq)),11px)/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink);background:var(--paper);border-radius:99px;padding:5px 9px;box-shadow:0 2px 6px rgba(0,0,0,.5)}
.c-store .soon[hidden]{display:none}

.c-store.is-called .face{animation:storecall 1.1s ease-in-out 2}
@keyframes storecall{0%,100%{box-shadow:0 0 0 0 rgba(240,120,10,0),0 calc(.5 * var(--cq)) calc(1.1 * var(--cq)) rgba(0,0,0,.55)}50%{box-shadow:0 0 0 max(4px,calc(.45 * var(--cq))) rgba(240,120,10,.9),0 0 0 max(9px,calc(.95 * var(--cq))) rgba(74,204,118,.5),0 0 max(26px,calc(2.6 * var(--cq))) max(8px,calc(.8 * var(--cq))) rgba(122,44,158,.6)}}


.oo-ov{position:absolute;left:0;top:0;width:100%;height:0;z-index:4;pointer-events:none}
.oneone{position:absolute;left:max(7px,calc(.75 * var(--cq)));top:max(7px,calc(.75 * var(--cq)));pointer-events:auto;display:inline-block;margin:0;cursor:pointer;
  font:700 max(7px,calc(.42 * var(--cq)))/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;text-decoration:none;white-space:nowrap;color:var(--ink);
  background:linear-gradient(90deg,#7a2c9e,#4acc76,#f0780a) left bottom/100% 2px no-repeat,var(--paper);border:1px solid var(--ink);border-radius:2px;padding:2px 4px 3px;
  box-shadow:0 1px 3px rgba(0,0,0,.45);transform:rotate(var(--rot,0deg))}
.oneone[hidden]{display:none}
.oneone i{font-style:normal;font-weight:400;opacity:.7;border-left:1px dashed rgba(13,13,13,.5);padding-left:.4em;margin-left:.25em}
.oneone.is-demo{border-style:dashed}
.oneone:hover,.oneone:focus-visible{background:linear-gradient(90deg,#7a2c9e,#4acc76,#f0780a);color:var(--paper);outline:none}
.oo-in{left:7%;top:5%;z-index:3;transform:none;font-size:max(6px,calc(.42 * var(--cq)))}
@media (max-width:720px){
  .card.c-store{align-self:center;margin:0;width:50%!important}
  .oneone{font-size:9px;left:8px;top:8px}
  .oo-in{font-size:8px}
  .c-store .soon{font-size:11px}
}
@media (prefers-reduced-motion:reduce){
  .c-store .float{animation:none!important}
  .c-store.is-called .face{animation:none;box-shadow:0 0 0 4px rgba(240,120,10,.9),0 0 0 9px rgba(74,204,118,.5),0 calc(.5 * var(--cq)) calc(1.1 * var(--cq)) rgba(0,0,0,.55)}
}


.ph-tag{position:absolute;left:max(7px,calc(.75 * var(--cq)));top:max(7px,calc(.75 * var(--cq)));z-index:4;pointer-events:none;
  font:700 max(7px,calc(.42 * var(--cq)))/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;color:var(--ink);
  background:var(--paper);border:1px dashed var(--ink);border-radius:2px;padding:2px 4px 3px;box-shadow:0 1px 3px rgba(0,0,0,.45)}
.card.is-down .ph-tag{display:none}
@media (max-width:720px){.ph-tag{font-size:9px;left:8px;top:8px}}
.c-hi-freqs .face{background:var(--card-color,#55A01C)}

.cyc{position:absolute;inset:0;pointer-events:none;z-index:1}
.cyc-l{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;animation-name:cyc6;animation-timing-function:linear;animation-iteration-count:infinite}
.cyc[data-n="2"] .cyc-l{animation-name:cyc2}.cyc[data-n="3"] .cyc-l{animation-name:cyc3}.cyc[data-n="4"] .cyc-l{animation-name:cyc4}.cyc[data-n="5"] .cyc-l{animation-name:cyc5}
@keyframes cyc2{0%{opacity:0}25.00%{opacity:1}50.00%{opacity:1}75.00%{opacity:0}100%{opacity:0}}
@keyframes cyc3{0%{opacity:0}16.67%{opacity:1}33.33%{opacity:1}50.00%{opacity:0}100%{opacity:0}}
@keyframes cyc4{0%{opacity:0}12.50%{opacity:1}25.00%{opacity:1}37.50%{opacity:0}100%{opacity:0}}
@keyframes cyc5{0%{opacity:0}10.00%{opacity:1}20.00%{opacity:1}30.00%{opacity:0}100%{opacity:0}}
@keyframes cyc6{0%{opacity:0}8.33%{opacity:1}16.67%{opacity:1}25.00%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.cyc-l{animation:none!important;opacity:0}.cyc-l:first-child{opacity:1}}

.c-hi-freqs .face img,.c-hi-freqs .cyc{object-fit:contain}
.c-hi-freqs .cyc{inset:auto 0;top:50%;height:auto;aspect-ratio:1;transform:translateY(-50%)}
