body.wrapped-mode header,
 body.wrapped-mode footer {
   display: none;
 }

 body.wrapped-mode {
   background: #0b0b10;
 }

 .wstage:focus {
   outline: none;
 }

 .wstage {
   position: fixed;
   inset: 0;
   z-index: 20;
   display: flex;
   flex-direction: column;
   background: #0b0b10;
   font-family: var(--font-sans);
 }

 .wprog {
   display: flex;
   gap: 4px;
   padding: 12px 12px 0;
 }

 .wprog i {
   flex: 1;
   height: 3px;
   border-radius: 2px;
   background: rgba(255, 255, 255, .25);
   cursor: default;
   transition: background .2s;
 }

 .wprog i.done,
 .wprog i.cur {
   background: #fff;
 }

 .wprog i.seen {
   cursor: pointer;
 }

 .wprog i.seen:hover {
   background: rgba(255, 255, 255, .7);
 }

 .whead {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 10px 14px 4px;
   color: #fff;
 }

 .whead select {
   background: rgba(255, 255, 255, .12);
   color: #fff;
   border: 1px solid rgba(255, 255, 255, .3);
   border-radius: 6px;
   font-size: 13px;
   padding: 3px 6px;
 }

 .wclose {
   position: relative;
   z-index: 30;
   background: rgba(255, 255, 255, .1);
   border: 0;
   color: #fff;
   width: 44px;
   height: 44px;
   border-radius: 50%;
   font-size: 18px;
   line-height: 1;
   cursor: pointer;
   opacity: .9;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: background .15s, opacity .15s;
 }

 .wclose:hover {
   opacity: 1;
   background: rgba(255, 255, 255, .2);
 }

 .wr {
   position: relative;
   flex: 1;
   min-height: 0;
 }

 .wsl {
   position: absolute;
   inset: 0;
   opacity: 0;
   transform: translateX(42%) scale(.9) rotate(4deg);
   pointer-events: none;
   transition: opacity .45s ease, transform .6s cubic-bezier(.16, 1, .3, 1);
 }

 .wsl.wprev {
   transform: translateX(-42%) scale(.9) rotate(-4deg);
 }

 .wsl.on {
   opacity: 1;
   transform: translateX(0) scale(1) rotate(0deg);
   pointer-events: auto;
   will-change: transform, opacity;
 }

 .wsl:not(.on) * {
   animation: none !important;
 }

 .wsl:not(.on) .poster::after {
   display: none;
 }

 @media (prefers-reduced-motion: reduce) {
   .wsl {
     transition: opacity .15s linear;
     transform: none !important;
   }
 }

 .wnav {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   z-index: 15;
   width: 44px;
   height: 44px;
   border-radius: 50%;
   background: rgba(255, 255, 255, .1);
   border: 1px solid rgba(255, 255, 255, .16);
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   transition: background .15s, transform .15s, opacity .15s;
 }

 .wnav:hover {
   background: rgba(255, 255, 255, .22);
 }

 .wnav:active {
   transform: translateY(-50%) scale(.92);
 }

 .wnav:disabled {
   opacity: 0;
   pointer-events: none;
 }

 .wnav.l {
   left: clamp(8px, 2.4vw, 22px);
 }

 .wnav.r {
   right: clamp(8px, 2.4vw, 22px);
 }

 .wnav svg {
   width: 18px;
   height: 18px;
 }

 /* Touch blättert über die Tippzonen, die Pfeile lägen sonst über dem Text */
 @media (hover: none) and (pointer: coarse) {
   .wnav:not(:focus-visible) {
     opacity: 0;
   }
 }

 .wzone {
   position: absolute;
   top: 0;
   bottom: 0;
   width: 50%;
   z-index: 5;
   background: none;
   border: 0;
   cursor: pointer;
 }

 .wzone.l {
   left: 0;
 }

 .wzone.r {
   right: 0;
 }

 .poster {
   position: relative;
   height: 100%;
   overflow: hidden;
   padding: clamp(64px, 12vh, 96px) clamp(28px, 9vw, 40px) clamp(28px, 6vh, 48px);
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   text-align: center;
   gap: clamp(14px, 2.4vh, 22px);
   color: #fff;
 }

 .poster::after {
   content: "";
   position: absolute;
   inset: 0;
   z-index: 0;
   pointer-events: none;
   opacity: .06;
   mix-blend-mode: overlay;
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
 }

 .poster>* {
   position: relative;
   z-index: 1;
 }

 .w-a {
   background: linear-gradient(135deg, #0a0f42 0%, #3730a3 48%, #7c5cfc 100%);
 }

 .w-b {
   background: linear-gradient(135deg, #380d02 0%, #b8410c 48%, #ffb020 100%);
 }

 .w-c {
   background: linear-gradient(135deg, #012621 0%, #04785a 48%, #34e39a 100%);
 }

 .w-d {
   background: linear-gradient(135deg, #29073a 0%, #9d1ea8 48%, #f472e8 100%);
 }

 .w-e {
   background: linear-gradient(135deg, #351f00 0%, #b3620a 48%, #ffcf3f 100%);
 }

 .w-f {
   background: linear-gradient(135deg, #050508 0%, #14112f 55%, #362a72 100%);
 }

 .tk,
 .pk {
   font-size: 12.5px;
   line-height: 16px;
   font-weight: 700;
   letter-spacing: .22em;
   text-transform: uppercase;
   opacity: .7;
 }

 .wsl.on .rv {
  animation: rv .9s cubic-bezier(.22, 1, .36, 1) both;
}

.wsl.on .rw {
  display: inline-block;
  animation: rw .7s cubic-bezier(.22, 1, .36, 1) both;
}

.wsl.on .rv:has(.rw) {
  animation-name: fade;
  animation-duration: .4s;
}

@keyframes fade {
  from { opacity: 0; }
}

.hl:has(.rw) {
  text-decoration: none;
}

.hl .rw {
  text-decoration: underline;
  text-decoration-thickness: .1em;
  text-underline-offset: .12em;
}

.wsl.seen .rv,
.wsl.seen .rw {
  animation: none !important;
}

@keyframes rv {
  from { opacity: 0; transform: translateY(18px); filter: blur(6px); }
  to { opacity: 1; transform: none; filter: none; }
}

@keyframes rw {
  from { opacity: 0; transform: translateY(.35em); filter: blur(4px); }
  to { opacity: 1; transform: none; filter: none; }
}

.wsl.on .wphoto.rv {
   animation-name: rvp;
 }

 @keyframes rvp {
   from { opacity: 0; transform: translateY(40px) rotate(calc(var(--tilt) * -3)) scale(.8); }
   to { opacity: 1; transform: rotate(var(--tilt)); }
 }

 @media (prefers-reduced-motion: reduce) {
   .wsl.on .rv, .wsl.on .rw { animation: none; }
 }

 .tline {
   font-family: "Archivo Black", var(--font-sans);
   font-size: clamp(32px, 7.4vw, 56px);
   font-weight: 400;
   line-height: 1.05;
   letter-spacing: -.01em;
   max-width: 16ch;
   text-shadow: 0 6px 28px rgba(0, 0, 0, .35);
 }

 .tsub {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 2px;
   opacity: .8;
   font-size: 13px;
 }

 .tsub svg {
   width: 22px;
   height: 22px;
   animation: nudge 1.7s ease-in-out infinite;
 }

 @keyframes nudge {

   0%,
   100% {
     transform: translateY(0);
     opacity: .5;
   }

   50% {
     transform: translateY(7px);
     opacity: 1;
   }
 }

 @media (prefers-reduced-motion: reduce) {
   .tsub svg {
     animation: none;
   }
 }

 .wphoto {
   margin: 0 0 6px;
   max-width: min(460px, 88%);
   transform: rotate(var(--tilt, 0deg));
   background: #fff;
   padding: 8px 8px 22px;
   box-shadow: 0 12px 34px rgba(0, 0, 0, .4);
 }

 .wphoto img {
   display: block;
   width: 100%;
   max-height: 32vh;
   object-fit: cover;
 }

 .pbig .pn {
   font-family: "Archivo Black", var(--font-sans);
   font-size: clamp(80px, 21vw, 196px);
   line-height: .9;
   font-weight: 400;
   letter-spacing: -.015em;
   font-variant-numeric: tabular-nums;
   text-shadow: 0 10px 36px rgba(0, 0, 0, .4);
 }

 .pbig .pn {
   white-space: nowrap;
 }

 .pbig .pn small {
   display: block;
   font-family: var(--font-sans);
   font-size: max(.19em, 18px);
   font-weight: 700;
   letter-spacing: 0;
   line-height: 1.2;
   white-space: normal;
   margin-top: .35em;
   opacity: .85;
 }

 .pbig .pn .pu2 {
  font-family: var(--font-sans);
  font-size: max(.2em, 18px);
  font-weight: 700;
  letter-spacing: 0;
  margin-left: .25em;
  opacity: .85;
}

.pbig .pn .pu {
   font-size: .55em;
   margin-left: .04em;
 }

 .pbig .pw {
   font-family: "Archivo Black", var(--font-sans);
   font-size: clamp(48px, 14.5vw, 118px);
   line-height: 1;
   font-weight: 400;
   letter-spacing: -.01em;
   text-shadow: 0 8px 32px rgba(0, 0, 0, .4);
 }

 .ptxt {
   font-size: clamp(18px, 3vw, 25px);
   line-height: 1.32;
   max-width: 30ch;
   margin: 0 auto;
   font-weight: 600;
 }

 .ptxt b {
   font-weight: 800;
 }

 .pplus {
   font-size: clamp(14px, 1.8vw, 16px);
   line-height: 1.45;
   max-width: 42ch;
   margin: 0 auto;
   padding-top: var(--space-3);
   border-top: 1.5px solid rgba(255, 255, 255, .4);
   opacity: .88;
 }

 .pmini {
   display: flex;
   align-items: flex-end;
   justify-content: center;
   gap: 6px;
   height: 72px;
   width: 100%;
   max-width: 360px;
   padding: 14px 12px 22px;
   border-radius: 16px;
   background: rgba(8, 8, 14, .38);
 }

 .pmini div {
   flex: 1;
   background: #fff;
   opacity: .45;
   position: relative;
   min-height: 3px;
   border-radius: 3px 3px 0 0;
 }

 .pmini div.hi {
   opacity: 1;
 }

 .pmini span {
   position: absolute;
   top: 100%;
   left: 0;
   right: 0;
   text-align: center;
   font-size: 11px;
   padding-top: 4px;
   opacity: .85;
 }

 .wsince {
   position: absolute;
   top: 16px;
   right: 16px;
   z-index: 2;
   font-size: 10.5px;
   letter-spacing: .03em;
   padding: 4px 10px;
   border-radius: 999px;
   background: rgba(255, 255, 255, .14);
   opacity: .8;
 }

 .wchapn {
   font-family: "Archivo Black", var(--font-sans);
   font-size: clamp(42px, 10.5vw, 78px);
   font-weight: 400;
   letter-spacing: -.01em;
   line-height: 1.02;
   max-width: 14ch;
   text-shadow: 0 8px 32px rgba(0, 0, 0, .4);
 }

 .wfin {
   --wlo: #2b2560;
   --whi: #ffd166;
 }

 .wweek {
   --ch: clamp(8px, calc((100svh - 300px) / 24 - 2px), 18px);
   display: grid;
   grid-template-columns: auto 1fr;
   grid-template-areas: ". d" "h g";
   gap: 6px 8px;
   width: min(100%, 290px);
   font-size: 11px;
   line-height: 1;
   font-variant-numeric: tabular-nums;
 }

 .wwd,
 .wwh {
   display: grid;
   gap: 2px;
   opacity: .6;
 }

 .wwd {
   grid-area: d;
   grid-template-columns: repeat(7, 1fr);
   font-weight: 700;
 }

 .wwh {
   grid-area: h;
   grid-template-rows: repeat(24, var(--ch));
   align-items: center;
   text-align: right;
 }

 .wwg {
   grid-area: g;
   display: grid;
   grid-template-columns: repeat(7, 1fr);
   grid-template-rows: repeat(24, var(--ch));
   grid-auto-flow: column;
   gap: 2px;
 }

 .wwg i {
   border-radius: 3px;
   background: rgba(255, 209, 102, var(--p));
   background: color-mix(in oklch, var(--whi) calc(var(--p) * 100%), var(--wlo));
 }

 .wsl.on .wwg i {
   animation: wwin .5s ease-out both;
   animation-delay: calc(var(--d, 0s) + var(--k) * 22ms);
 }

 .wsl.seen .wwg i {
   animation: none;
 }

 @keyframes wwin {
   from { opacity: 0; transform: scale(.4); }
 }

 .wwkey {
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 13px;
   opacity: .75;
 }

 .wwkey i {
   width: 96px;
   height: 10px;
   border-radius: 3px;
   background: linear-gradient(to right, var(--wlo), var(--whi));
   background: linear-gradient(in oklch to right, var(--wlo), var(--whi));
 }

 @media (min-width: 720px) and (orientation: landscape) {
   .wweek {
     grid-template-columns: auto 1fr;
     grid-template-areas: ". h" "d g";
     width: min(100%, 860px);
     font-size: 12px;
   }

   .wwd {
     grid-template-columns: none;
     grid-template-rows: repeat(7, 1fr);
     align-items: center;
     text-align: right;
   }

   .wwh {
     grid-template-rows: none;
     grid-template-columns: repeat(24, 1fr);
     text-align: center;
   }

   .wwg {
     grid-template-columns: repeat(24, 1fr);
     grid-template-rows: none;
     grid-auto-flow: row;
     gap: 3px;
   }

   .wwg i {
     aspect-ratio: 1;
     border-radius: 4px;
   }
 }

 .hl {
   text-decoration: underline;
   text-decoration-thickness: .1em;
   text-underline-offset: .12em;
   text-decoration-color: currentColor;
   font-weight: 800;
 }

.wtop {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  width: min(100%, 340px);
  font-size: 15px;
  counter-reset: t 1;
}

.wtop li {
  counter-increment: t;
  display: flex;
  gap: var(--space-3);
  justify-content: space-between;
  padding: 6px 0;
  border-top: 1px solid rgba(255, 255, 255, .25);
  text-align: left;
}

.wtop li span::before {
  content: counter(t) ". ";
  opacity: .7;
}

.ptrio {
  display: flex;
  justify-content: center;
  gap: clamp(10px, 4vw, 48px);
  font-family: "Archivo Black", var(--font-sans);
}

.ptrio>div {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ptrio b {
  font-weight: 400;
  font-size: clamp(34px, 9.5vw, 104px);
  line-height: 1;
  white-space: nowrap;
  text-shadow: 0 8px 28px rgba(0, 0, 0, .4);
}

.ptrio .pu {
  font-size: .5em;
  margin-left: .04em;
}

.ptrio small {
  margin-top: .5em;
  font-family: var(--font-sans);
  font-size: clamp(13px, 2.4vw, 18px);
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  max-width: 7em;
  opacity: .85;
}

.wshare {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 0 16px 0 12px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 999px;
  background: rgba(255, 255, 255, .1);
  color: #fff;
  font: 600 14px/1 var(--font-sans);
  cursor: pointer;
}

.wshare:hover {
  background: rgba(255, 255, 255, .2);
}

.wshare .ic {
  width: 18px;
  height: 18px;
}

.whead select {
  min-height: 36px;
}

.wempty {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  opacity: .8;
}

.wemb {
  width: clamp(64px, 11vh, 92px);
  height: auto;
  color: #fff;
  filter: drop-shadow(0 8px 24px rgba(0, 0, 0, .35));
}

.wsl.on .wemb rect,
.wsl.on .wemb path {
  stroke-dasharray: 1;
  animation: wdraw 1.1s cubic-bezier(.65, 0, .35, 1) both;
  animation-delay: var(--d, 0s);
}

.wsl.on .wemb circle {
  transform-box: fill-box;
  transform-origin: center;
  animation: wpop .5s cubic-bezier(.34, 1.56, .64, 1) both;
  animation-delay: calc(var(--d, 0s) + .7s + var(--i) * .11s);
}

@keyframes wdraw {
  from {
    stroke-dashoffset: 1;
  }

  to {
    stroke-dashoffset: 0;
  }
}

@keyframes wpop {
  from {
    transform: scale(0);
  }
}

.wchap .pk {
  font-variant-numeric: tabular-nums;
}

.wclock {
  width: min(62vw, 30vh, 260px);
  height: auto;
  overflow: visible;
}

.poster:has(.wclock) .pbig .pn {
  font-size: clamp(64px, 15vw, 132px);
}

.wclock path {
  fill: #fff;
  opacity: .32;
  transform-box: view-box;
  transform-origin: 50% 50%;
}

.wclock path.in {
  opacity: .95;
}

.wclock circle {
  fill: rgba(8, 8, 14, .35);
}

.wclock text {
  fill: #fff;
  opacity: .75;
  font: 700 13px var(--font-sans);
  text-anchor: middle;
}

.wsl.on .wclock path {
  animation: wpetal .7s cubic-bezier(.22, 1, .36, 1) both;
  animation-delay: calc(var(--d, 0s) + var(--i) * 35ms);
}

@keyframes wpetal {
  from {
    transform: scale(.25);
    opacity: 0;
  }
}

.wsl.on .pmini div {
  animation: wgrow .8s cubic-bezier(.22, 1, .36, 1) both;
  animation-delay: calc(var(--d, 0s) + .15s + var(--i) * 45ms);
}

@keyframes wgrow {
  from {
    height: 0;
  }
}

.wtiles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  width: min(100%, 460px);
  text-align: left;
}

.wtiles div {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  padding: 14px 16px 16px;
  border-radius: 16px;
  background: rgba(8, 8, 14, .35);
}

.wtiles span {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  opacity: .75;
}

.wtiles b {
  font-family: "Archivo Black", var(--font-sans);
  font-weight: 400;
  font-size: clamp(20px, 5.4vw, 30px);
  line-height: 1.1;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.wsl.on .wtiles div {
  animation: wtile .6s cubic-bezier(.22, 1, .36, 1) both;
  animation-delay: calc(var(--d, 0s) + var(--i) * 90ms);
}

@keyframes wtile {
  from {
    opacity: 0;
    transform: translateY(14px) scale(.96);
  }
}

.wsl.seen .wemb *,
.wsl.seen .wclock path,
.wsl.seen .pmini div,
.wsl.seen .wtiles div {
  animation: none !important;
}

@media (prefers-reduced-motion: reduce) {

  .wsl.on .wemb *,
  .wsl.on .wclock path,
  .wsl.on .pmini div,
  .wsl.on .wtiles div {
    animation: none;
  }
}

.wopts {
  display: grid;
  gap: 10px;
  width: min(100%, 380px);
}

.wopts.across {
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}

.wopt {
  min-height: 56px;
  padding: 10px 14px;
  border: 1.5px solid rgba(255, 255, 255, .35);
  border-radius: 16px;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  font: 800 clamp(17px, 4.4vw, 22px)/1.2 var(--font-sans);
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  transition: background .2s, color .2s, opacity .2s, transform .15s;
}

.wopt:not(:disabled):hover {
  background: rgba(255, 255, 255, .22);
}

.wopt:not(:disabled):active {
  transform: scale(.97);
}

.wopt:disabled {
  cursor: default;
  opacity: .45;
}

.wopt.ok {
  opacity: 1;
  background: #fff;
  color: #14171b;
  border-color: #fff;
}

.wopt.miss {
  opacity: .7;
  text-decoration: line-through;
}

.wopt.hit {
  animation: wbump .45s cubic-bezier(.34, 1.56, .64, 1);
}

@keyframes wbump {
  50% {
    transform: scale(1.06);
  }
}

.wverdict {
  min-height: 1.3em;
  margin: 0;
  font-size: clamp(20px, 5vw, 28px);
  font-weight: 800;
}

.wscene {
  gap: clamp(10px, 2vh, 18px);
}

.shead {
  font-family: "Archivo Black", var(--font-sans);
  font-size: clamp(34px, 9vw, 72px);
  line-height: 1.05;
  letter-spacing: -.01em;
  max-width: 14ch;
  text-shadow: 0 6px 28px rgba(0, 0, 0, .35);
}

.sline {
  margin: 0;
  max-width: 22ch;
  font-size: clamp(22px, 5.6vw, 36px);
  line-height: 1.25;
  font-weight: 600;
}

.wzoom {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  cursor: zoom-in;
}

.wlight {
  position: absolute;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: max(20px, env(safe-area-inset-top, 0px)) 16px max(20px, env(safe-area-inset-bottom, 0px));
  background: rgba(5, 5, 10, .88);
  cursor: zoom-out;
}

.wlight:focus {
  outline: none;
}

.wlight figure {
  margin: 0;
  max-width: min(94vw, 900px);
  padding: 10px 10px 0;
  background: #fff;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .55);
}

.wlight img {
  display: block;
  max-width: 100%;
  max-height: 78vh;
  object-fit: contain;
}

.wlight figcaption {
  padding: 10px 4px 14px;
  color: #3a3530;
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
}

/* zentriert, solange der Brief passt; sonst scrollt die Folie, statt oben und unten abzuschneiden */
.wend {
  gap: clamp(14px, 2.4vh, 22px);
  justify-content: flex-start;
  overflow-y: auto;
  padding: clamp(20px, 5vh, 72px) clamp(24px, 6.5vw, 40px) clamp(20px, 4vh, 48px);
  overscroll-behavior: contain;
}

.wend > :first-child {
  margin-top: auto;
}

.wend > :last-child {
  margin-bottom: auto;
  flex: none;
}

.wletter {
  width: min(100%, 34rem);
  text-align: left;
  font-size: clamp(15px, 1.9vh, 18px);
  line-height: 1.5;
  flex: none;
}

.wletter p {
  margin: 0 0 .9em;
  color: rgba(255, 255, 255, .84);
}

.wletter .lgreet {
  font-family: "Archivo Black", var(--font-sans);
  font-size: clamp(26px, 5.6vw, 40px);
  line-height: 1.05;
  margin-bottom: .5em;
  color: #fff;
}

.wletter p:last-of-type {
  margin-bottom: 0;
  padding-top: .9em;
  border-top: 1.5px solid rgba(255, 255, 255, .3);
  color: #fff;
  font-weight: 700;
  font-size: 1.12em;
}

.wletter button {
  margin-top: clamp(18px, 3vh, 28px);
}

.wendb {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: clamp(18px, 3vh, 28px);
}

.wletter .wendb button {
  margin-top: 0;
}

.wend .wzipb {
  background: none;
  color: #fff;
  border: 1.5px solid rgba(255, 255, 255, .5);
}

.wend button:hover {
  transform: scale(1.04);
}

.wend button {
  background: #fff;
  color: #14171b;
  border: 0;
  border-radius: 999px;
  padding: 13px 30px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.wsl.seen .wletter *,
.wsl.seen .wopt {
  animation: none !important;
}

.wguess .tline {
  font-size: clamp(26px, 6.4vw, 46px);
}