@font-face{font-family:'Edo';src:url('/fonts/edo.ttf') format('truetype');font-weight:400;font-display:swap}
html,body{hyphens:none;-webkit-hyphens:none;word-break:normal}
:root{
  --pink:#D93686; --teal:#1F7F8A; --purple:#4F2A87; --ink:#211D24; --paper:#FFFFFF; --bg:#F7F4F8; --line:#E7DFEA; --muted:#6A616F;
  --display:'Bebas Neue','Arial Narrow',Impact,sans-serif; --body:'Source Sans 3',-apple-system,'Segoe UI',system-ui,sans-serif;
  --sat:env(safe-area-inset-top,0px); --sab:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;margin:0;max-width:100vw;overflow-x:hidden}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.4;display:flex;flex-direction:column;overflow:hidden;
  padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--pink);outline-offset:2px}
#screen{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-top:var(--sat)}
#screen.fit{overflow:hidden;display:flex;flex-direction:column}
#tabs{flex:none;display:grid;grid-template-columns:repeat(5,1fr);background:rgba(255,255,255,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);padding-bottom:var(--sab)}
#tabs[hidden]{display:none}
#tabs button{border:0;background:none;padding:9px 0 7px;font-size:11px;font-weight:700;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer}
#tabs button[aria-current=page]{color:var(--pink)}
#tabs svg,.ico{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wm{font-family:var(--display);line-height:.84;letter-spacing:.01em;display:inline-block;font-size:30px}
.wm small{display:block;font-size:.42em;letter-spacing:.08em}
.wm .e{color:var(--pink)}
.pad{padding:16px}
.top{display:flex;justify-content:space-between;align-items:flex-end;padding:12px 18px 8px;flex:none}
.round{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--paper);display:grid;place-items:center;cursor:pointer;padding:0}
h2.sec{font-family:var(--display);font-weight:400;font-size:30px;letter-spacing:.03em;margin:0 0 10px;line-height:1}
h2.sec b{color:var(--pink);font-weight:400}
.tag{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--pink)}
.muted{color:var(--muted);font-size:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:14px;padding:13px 20px;font-weight:700;cursor:pointer;background:var(--pink);color:#fff;text-decoration:none;text-align:center}
.btn.alt{background:none;color:var(--ink);border:2px solid var(--ink)}
.btn.ghost{background:none;color:var(--muted);border:1px solid var(--line)}
.btn.block{display:flex;width:100%}
.btn.sm{padding:9px 14px;font-size:14px;border-radius:12px}

/* HOME: one screen, no page scroll. Hero takes the space left over. */
.home{flex:1;min-height:0;display:flex;flex-direction:column;gap:10px;padding:0 14px 10px}
.hero{flex:1;min-height:0;display:flex;flex-direction:column;gap:8px}
.slides{flex:1;min-height:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;scrollbar-width:none;border-radius:28px}
.slides::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%;scroll-snap-align:center;border:0;padding:0;border-radius:28px;position:relative;overflow:hidden;cursor:pointer;text-align:left;color:#fff;
  background:linear-gradient(150deg,var(--pink),var(--purple))}
.slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(33,29,36,0) 30%,rgba(33,29,36,.78))}
.slide .in{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:20px;display:flex;flex-direction:column;gap:6px}
.slide .kick{align-self:flex-start;background:rgba(255,255,255,.2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:999px;padding:4px 12px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.slide h3{font-family:var(--display);font-weight:400;font-size:clamp(32px,9vw,44px);line-height:.95;letter-spacing:.02em;margin:0;text-wrap:balance}
.slide p{margin:0;opacity:.9;font-size:15px}
.slide .go{align-self:flex-start;margin-top:6px;background:#fff;color:var(--ink);border-radius:12px;padding:9px 16px;font-weight:700;font-size:14px}
.dots{display:flex;justify-content:center;gap:6px;flex:none;height:8px}
.dots i{width:6px;height:6px;border-radius:50%;background:var(--line);transition:all .2s}
.dots i.on{width:18px;border-radius:4px;background:var(--pink)}
.tiles{flex:none;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.tile{border:1px solid var(--line);background:var(--paper);border-radius:18px;padding:10px 4px;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:12px;font-weight:700;cursor:pointer;text-decoration:none;color:var(--ink)}
.tile .ico{color:var(--pink)}
.ad{flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);background:var(--paper);border-radius:18px;padding:9px 12px;text-decoration:none;color:inherit;min-height:52px}
.ad .lab{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700;display:block}
.ad b{font-size:15px;display:block;line-height:1.15}
.ad img{height:34px;max-width:90px;object-fit:contain}

/* lists and detail */
.card{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:14px;width:100%;text-align:left;cursor:pointer;display:block}
.item{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border:0;border-bottom:1px solid var(--line);background:none;width:100%;text-align:left;cursor:pointer}
.item .dot{width:52px;height:52px;border-radius:14px;flex:none;background:linear-gradient(135deg,var(--purple),var(--pink));overflow:hidden}
.item .dot img{width:100%;height:100%;object-fit:cover}
.h3{font-weight:700;font-size:17px;line-height:1.2;display:block}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cover{aspect-ratio:3/4;border-radius:6px;background:var(--paper);border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column;box-shadow:3px 4px 0 var(--line);position:relative}
.cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cover i{display:block;height:7%;background:linear-gradient(90deg,var(--pink),var(--purple));flex:none}
.cover .wm{font-size:clamp(18px,6vw,28px);margin:8% 8% 0}
.cover .ph{flex:1;margin:8%;border-radius:2px}
.back{border:0;background:none;color:var(--pink);font-weight:700;cursor:pointer;padding:0 0 10px;font-size:16px}
.body p{margin:0 0 14px}
.list-gap{display:flex;flex-direction:column;gap:14px}
.hero-in{background:linear-gradient(160deg,var(--pink),var(--purple));color:#fff;padding:36px 22px 28px}
.hero-in .wm{font-size:58px}.hero-in .wm .e{color:#fff}
.hero-in p{margin:14px 0 0;font-size:17px}
.field{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
.field label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.field input,.field select{border:1px solid var(--line);border-radius:12px;padding:13px;background:var(--paper);width:100%;font-size:16px}
.check{display:flex;gap:10px;align-items:flex-start;margin:4px 0 14px;font-size:14px}
.check input{margin-top:3px;width:18px;height:18px;accent-color:var(--pink)}
.err{color:#B3261E;font-weight:600;font-size:14px;min-height:20px;margin:0 0 8px}
.supp{display:flex;flex-wrap:wrap;gap:8px}
.supp a{border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;color:var(--ink);text-decoration:none}
.steps{padding-left:20px;margin:0 0 16px}.steps li{margin-bottom:8px}
#notice{position:fixed;z-index:50;left:12px;right:12px;top:calc(var(--sat) + 8px);background:var(--ink);color:#fff;border-radius:16px;padding:12px 14px;box-shadow:0 10px 30px rgba(0,0,0,.3);transform:translateY(-160%);opacity:0;visibility:hidden;pointer-events:none;transition:transform .35s,opacity .35s,visibility 0s .35s}
#notice.on{transform:none;opacity:1;visibility:visible;pointer-events:auto;transition:transform .35s,opacity .35s,visibility 0s}
#notice b{display:block;font-size:14px}#notice span{font-size:14px;opacity:.9}
@media (prefers-reduced-motion:reduce){#notice,.dots i{transition:none}.slides{scroll-behavior:auto}}
@media (max-height:640px){.tile{padding:7px 4px}.tile .ico{width:18px;height:18px}}

/* iPad and larger: side rail instead of bottom tabs, two-column no-scroll home, readable column widths */
@media (min-width:768px){
  body{flex-direction:row}
  #tabs{order:-1;width:104px;flex:none;grid-template-columns:1fr;grid-auto-rows:min-content;align-content:start;gap:6px;border-top:0;border-right:1px solid var(--line);padding:calc(var(--sat) + 20px) 8px var(--sab)}
  #tabs button{padding:12px 0;border-radius:16px;font-size:12px}
  #tabs button[aria-current=page]{background:rgba(217,54,134,.1)}
  .top{padding:20px 28px 10px}
  .wm{font-size:36px}
  .pad{max-width:780px;margin-inline:auto;padding:24px 28px}
  .grid2.eds{grid-template-columns:repeat(3,1fr);gap:22px}
  .home{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;gap:14px;padding:0 28px 28px}
  .hero{grid-row:1/-1;grid-column:1}
  .home>:not(.hero){grid-column:2}
  .tiles{grid-template-columns:1fr 1fr;gap:12px}
  .tile{padding:20px 8px;font-size:14px;border-radius:22px}
  .tile .ico{width:26px;height:26px}
  .slide .in{padding:32px}.slide h3{font-size:clamp(40px,6vw,64px)}.slide p{font-size:17px}
  .ad{padding:14px 16px;border-radius:22px}
  #screen>form{max-width:520px;margin-inline:auto;width:100%}
  .hero-in{padding:56px 28px 36px;text-align:center}
}
@media (min-width:768px) and (max-height:700px){.tile{padding:12px 8px}}

.slide .kick.new{background:var(--pink);color:#fff}
.slide img{object-position:center top}
.head-img{width:100%;max-height:260px;object-fit:cover;border-radius:18px;margin-bottom:12px;display:block}
.inline-img{width:100%;max-height:320px;object-fit:cover;border-radius:18px;margin:6px 0 16px;display:block}
@media (min-width:768px){.head-img{max-height:340px}.inline-img{max-height:420px}}

.ad .logo{height:38px;max-width:150px;object-fit:contain;object-position:left center;display:block;margin:3px 0}
.logos{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.logo-card{background:#fff;border:1px solid var(--line);border-radius:16px;height:68px;padding:10px;display:grid;place-items:center;text-decoration:none;color:var(--ink);font-weight:700;font-size:13px;text-align:center}
.logo-card img{max-width:100%;max-height:44px;object-fit:contain}

.welcome-h{font-family:var(--display);font-weight:400;font-size:34px;line-height:1.1;margin:14px 0 0;text-transform:uppercase;letter-spacing:.02em;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.legal{margin:22px 0 0;padding:0 22px 22px;font-size:11px;line-height:1.4;color:var(--muted);text-align:center}
@media (min-width:768px){.welcome-h{font-size:38px}}
.slide.empty{cursor:default;background:linear-gradient(160deg,var(--pink),var(--purple))}.slide.empty::after{display:none}
@media (min-width:768px){#screen{max-width:1180px;margin-inline:auto}}
.wm-img{display:block;height:30px;width:auto;max-width:100%}
.hero-in .wm-img{height:56px}
.cover .wm-img{width:70%;height:auto;margin:8% 8% 0}
@media (min-width:768px){.wm-img{height:38px}.hero-in .wm-img{height:76px;margin-inline:auto}}

.legal .elf{display:block;width:120px;height:auto;margin:0 auto 10px}

.hero-in.welcome{position:relative;overflow:hidden}
.welcome .tilt{display:inline-block;background:#fff;color:var(--charcoal,#211D24);font-family:var(--display);font-size:22px;letter-spacing:.04em;text-transform:uppercase;padding:4px 12px;margin-top:18px;transform:rotate(-3deg)}
.welcome .bar{display:inline-block;padding:4px 16px 2px 22px;margin-left:-22px;line-height:1.08;text-wrap:balance}
.welcome .b2{background:#211D24;color:#fff;font-size:1.12em}
.welcome p{max-width:46ch}
@media (min-width:768px){.welcome-h{align-items:center}.welcome .bar{margin-left:0;padding-left:22px}.welcome .tilt{margin-top:22px}.welcome p{margin-inline:auto}}

.welcome .wm-img{position:absolute;top:18px;right:18px;height:30px!important;width:auto;margin:0!important}
.welcome .tilt{position:relative;z-index:2;margin-top:34px;margin-bottom:-12px;margin-left:-4px}
.welcome .welcome-h{margin-top:0}
.welcome .b2{padding-top:14px}
@media (min-width:768px){.welcome .wm-img{top:26px;right:28px;height:38px!important}.welcome .tilt{margin-top:40px}}

.legal{margin:36px 0 0;padding:0 22px max(24px,env(safe-area-inset-bottom,0px));border-top:4px solid var(--pink);background:#fff;text-align:center;font-size:12px;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:8px}
.legal .elf{margin:22px auto 4px}
.legal .pp{color:var(--pink);font-weight:600;text-decoration:none}
.legal .pp:hover{text-decoration:underline}

#tabs{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:1fr}
.tiles{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:1fr}
@media (min-width:768px){#tabs{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:1fr}.tiles{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:1fr 1fr}}
.line .thumb{width:44px;height:58px;border-radius:6px;object-fit:cover;background:var(--line);flex:none;margin-right:12px}
@media (min-width:768px){
  #tabs{width:132px;gap:10px;padding-top:calc(var(--sat) + 28px)}
  #tabs button{padding:16px 0 14px;gap:8px;font-size:14px;letter-spacing:.02em}
  #tabs svg{width:34px;height:34px;stroke-width:1.8}
  .tile .ico{width:34px;height:34px}
}

/* Flipbook reader */
html.flip-open,html.flip-open body{overflow:hidden}
.flip{position:fixed;inset:0;z-index:200;background:#E5E5EA;color:#1d1d1f;display:flex;flex-direction:column}
.flip-top{display:flex;align-items:center;gap:12px;padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px;flex:none}
.flip-title{font-family:var(--display);font-size:26px;letter-spacing:.03em;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flip-pdf{color:#D93686;font-weight:600;font-size:14px;text-decoration:none}
.flip-x{border:0;background:#D93686;color:#fff;height:42px;padding:0 16px 0 12px;border-radius:999px;font:700 16px/1 inherit;font-family:inherit;cursor:pointer;flex:none;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}.flip-x span{font-size:26px;line-height:1;margin-top:-3px}.flip-scroll{display:flex;align-items:center;gap:12px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}.flip-scroll::-webkit-scrollbar{display:none}.flip-scroll>*{flex:none}.flip-scroll .flip-title{flex:1 0 auto}
.flip-stage{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:0 8px}
.flip-book{width:100%;height:100%}
.flip-msg{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:20px;font-size:17px}
.flip-fallback{color:#fff;background:var(--pink);padding:10px 18px;border-radius:12px;font-weight:700;text-decoration:none}
.flip-page{background:#fff;overflow:hidden}
.flip-page canvas{display:block;width:100%;height:100%;object-fit:contain}
.flip-wait{position:absolute;inset:0;background:linear-gradient(90deg,#eee,#f7f7f7,#eee)}
.flip-bar{display:flex;align-items:center;justify-content:center;gap:18px;padding:10px 14px calc(env(safe-area-inset-bottom,0px) + 14px);flex:none}
.flip-bar button{border:0;background:rgba(0,0,0,.09);color:#1d1d1f;width:52px;height:46px;border-radius:14px;font-size:30px;line-height:1;cursor:pointer}
.flip-bar button:active{background:var(--pink);color:#fff}
.flip-count{min-width:170px;text-align:center;font-weight:600;font-size:15px}

/* Overlays for adverts */
.adov{position:fixed;inset:0;z-index:300;background:rgba(20,16,24,.94);display:flex;align-items:center;justify-content:center;padding:calc(env(safe-area-inset-top,0px) + 16px) 16px calc(env(safe-area-inset-bottom,0px) + 16px)}
.adov-in{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:100%;max-height:100%;min-height:0}
.adov-img{display:block;min-height:0;border-radius:14px;overflow:hidden;background:#fff}
.adov-img img{display:block;max-width:100%;max-height:calc(100vh - 150px);max-height:calc(100dvh - 150px);object-fit:contain}
.adov-tag{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#bbb}
.adov-go{border:0;border-radius:14px;padding:12px 22px;font-weight:700;font-size:16px;background:var(--pink);color:#fff;cursor:pointer}
.adov-go:disabled{background:rgba(255,255,255,.18);color:#ddd;cursor:default}
.adov.splash{background:#1b1720}
.adov.splash .adov-img{border-radius:0;background:none}
.adov.splash .adov-img img{max-height:calc(100dvh - 130px)}
/* Flipbook adverts */
.flip-banner{flex:none;display:block;margin:0 auto;max-width:min(1200px,calc(100% - 16px));padding:0 8px}
.flip-banner img{display:block;width:100%;max-height:96px;object-fit:contain;border-radius:8px;background:#fff}
.flip-sky{display:none;flex:none;width:160px;align-self:center}
.flip-sky img{display:block;width:160px;max-height:min(600px,100%);object-fit:contain;border-radius:6px;background:#fff}
@media (min-width:1000px){.flip-sky{display:block}}
.flip-stage{overflow:hidden}
.flip-bar{position:relative;z-index:5}
.flip-book{flex:none;min-width:0}
.flip-pop{position:absolute;inset:0;z-index:6;background:rgba(10,8,14,.72);display:flex;align-items:center;justify-content:center;padding:16px}
.flip-pop-in{position:relative;max-width:min(560px,100%);max-height:100%}
.flip-pop-in img{display:block;max-width:100%;max-height:calc(100vh - 220px);max-height:calc(100dvh - 220px);object-fit:contain;border-radius:14px;background:#fff}
.flip-pop-x{position:absolute;top:-14px;right:-10px;border:0;background:#fff;color:#111;width:38px;height:38px;border-radius:50%;font-size:24px;line-height:1;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.4)}
/* Home slide for portrait covers: text on the left, whole cover on the right, no overlap */
@media (min-width:768px){
  .hero{max-height:460px;align-self:start}
  .slide.portrait{background:linear-gradient(120deg,var(--ink),#6b2d63);display:flex;flex-direction:row-reverse;align-items:stretch;justify-content:space-between;gap:24px;padding:28px}
  .slide.portrait::after{display:none}
  .slide.portrait img{position:static;inset:auto;flex:none;width:auto;height:100%;max-width:42%;align-self:center;object-fit:contain;border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,.45)}
  .slide.portrait .in{position:relative;flex:1 1 0;min-width:0;padding:0;justify-content:center;align-self:center}
  .slide.portrait h3{font-size:clamp(30px,3.6vw,52px);overflow-wrap:anywhere}
  #screen.fit{overflow-y:auto}
  #screen.fit>.home{flex:none}
  #screen.fit>.legal{display:flex}
}
@media (max-width:767.98px){#screen.fit>.legal{display:none}}

.inside{margin:22px 0 6px;text-align:left}
.inside-h{font-family:var(--display);font-weight:400;font-size:30px;letter-spacing:.03em;margin:0 0 8px;color:var(--ink)}
.inside-h b{color:var(--pink);font-weight:400}
.inside p{margin:0 0 10px;line-height:1.55}
.inside-list{margin:0 0 10px;padding-left:20px;line-height:1.55}
.inside-list li{margin:0 0 8px}

.legal .links{display:flex;gap:18px;flex-wrap:wrap;justify-content:center}
@media (min-width:768px){.hero{max-height:400px}}
@media (min-width:768px){.hero{height:400px;max-height:none;flex:none;align-self:start}}

/* socials */
.social{display:flex;gap:12px;justify-content:center;margin:2px 0 4px}
.social a{width:38px;height:38px;border-radius:50%;background:var(--pink);display:grid;place-items:center;transition:transform .15s}
.social a:hover{transform:translateY(-2px)}
.social svg{width:18px;height:18px;fill:#fff}
.follow .social{justify-content:flex-start;margin:0}
/* cutout photos */
.cut{display:block;height:auto;max-width:100%;pointer-events:none;user-select:none;-webkit-user-drag:none}
.welcome .cut.wel{height:210px;width:auto;margin:14px auto 0;max-width:92%;object-fit:contain;object-position:bottom}
.hero-in.welcome{padding-bottom:0}
@media (min-width:768px){.welcome .cut.wel{height:280px}}
.band{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:8px;min-height:132px;margin:0 0 16px;padding:18px 0 0 18px;border-radius:20px;overflow:hidden;background:linear-gradient(160deg,var(--pink),var(--purple));color:#fff}
.band-t{align-self:center;padding:0 0 18px;min-width:0;flex:1}
.band .sec{color:#fff;font-size:34px;margin:0 0 6px}
.band .sec b{color:#fff;text-decoration:underline;text-decoration-thickness:4px;text-underline-offset:5px;text-decoration-color:rgba(255,255,255,.55)}
.band p{margin:0;font-size:14px;line-height:1.3;color:rgba(255,255,255,.92);max-width:24ch}
.band .cut{flex:none;height:150px;width:auto;max-width:48%;object-fit:contain;object-position:bottom right;align-self:flex-end}
@media (min-width:768px){.band{min-height:170px;padding-left:28px}.band .sec{font-size:42px}.band p{font-size:16px;max-width:36ch}.band .cut{height:190px}}
.slide.empty{position:relative;overflow:hidden}
.slide.empty img.slide-cut{position:absolute;inset:auto 10px 0 auto;height:62%;width:auto;max-width:45%;object-fit:contain;object-position:bottom right}
.slide.empty .in{position:relative;z-index:1;max-width:58%}
.printc{position:relative;overflow:hidden;padding-right:120px!important;min-height:130px}
.printc .pc{position:absolute;right:8px;bottom:0;height:112px;width:auto;max-width:110px;object-fit:contain;object-position:bottom right}

.band .cut.top{align-self:flex-start;margin-top:-18px;height:168px;object-position:top right}
@media (min-width:768px){.band .cut.top{height:206px}}

/* gate screens fit the phone without scrolling */
#screen.gatefit{display:flex;flex-direction:column;min-height:0}
#screen.gatefit>.hero-in{flex:1 0 auto;display:flex;flex-direction:column;padding-bottom:0}
#screen.gatefit>.hero-in.welcome{padding-bottom:0}
#screen.gatefit>form{flex:1 0 auto}
.cutbox{flex:1 1 0;min-height:0;position:relative;margin-top:10px;width:100%}
.welcome .cutbox .cut.wel{position:absolute;bottom:0;left:50%;transform:translateX(-50%);height:100%;width:auto;max-width:100%;margin:0;object-fit:contain;object-position:bottom}
.gate-btns{display:flex;flex-direction:column;gap:10px;padding:16px 22px 6px;width:100%;max-width:520px;margin-inline:auto}
.legal.mini{margin:10px 0 0;gap:6px;padding:10px 22px max(12px,env(safe-area-inset-bottom,0px));flex:none}
.legal.mini .mini-r{display:flex;align-items:center;justify-content:center;gap:16px}
.legal.mini .elf{margin:0;width:90px;height:auto}
.legal.mini .social{margin:0}
.legal.mini .social a{width:32px;height:32px}
.legal.mini .social svg{width:16px;height:16px}
.legal.mini .links{gap:16px}
.legal.mini .addr{font-size:10.5px;line-height:1.3;color:var(--muted)}
@media (max-height:700px){.gatefit .welcome p{display:none}.gatefit .welcome .tilt{margin-top:18px}}
@media (max-height:600px){.cutbox{display:none}}
/* less overlap: tag just kisses the top of the bar */
.welcome .tilt{margin-bottom:-4px}
.welcome .bar{padding-top:12px}

/* app sponsor: a card over the faded app, closed by the reader */
.adov.splash{background:rgba(20,16,24,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.adov.splash .adov-in{background:#fff;border-radius:24px;padding:14px 14px 16px;box-shadow:0 24px 60px rgba(0,0,0,.35);width:min(420px,100%);max-height:100%}
.adov.splash .adov-img{border-radius:14px;background:none}
.adov.splash .adov-img img{max-height:calc(100dvh - 210px);width:100%}
.adov.splash .adov-tag{color:var(--muted,#6A616F);font-weight:700}
.adov.splash .adov-go{width:100%}
.feat-ad{margin:18px 0}
.featnav{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
.featnav .fn{display:flex;flex-direction:column;gap:4px;text-align:left;border:1px solid var(--line);background:var(--paper);border-radius:16px;padding:12px 14px;cursor:pointer;font:inherit;color:inherit;min-width:0}
.featnav .fn.next{text-align:right;grid-column:2}
.featnav .fn-k{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--pink)}
.featnav .fn-t{font-weight:700;line-height:1.25;overflow-wrap:anywhere}
@media (max-width:420px){.featnav{grid-template-columns:1fr}.featnav .fn.next{grid-column:1}}

.flip-ph{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:calc(100% - 24px);max-height:calc(100% - 24px);height:auto;border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,.25);opacity:.9;pointer-events:none}
.flip-msg{z-index:3;justify-content:flex-end;padding-bottom:28px;pointer-events:none;text-shadow:none}
.flip-msg .flip-fallback{pointer-events:auto}
.flip-spin{width:26px;height:26px;border-radius:50%;border:3px solid rgba(0,0,0,.15);border-top-color:#D93686;animation:flipspin .8s linear infinite}
@keyframes flipspin{to{transform:rotate(360deg)}}

/* Latest edition card: compact on phones too, with a slanted pink tab like the welcome screen */
.slide.portrait{background:linear-gradient(120deg,var(--ink),#6b2d63);display:flex;flex-direction:row-reverse;align-items:stretch;justify-content:space-between;gap:16px;padding:44px 18px 18px}
.slide.portrait::after{display:none}
.slide.portrait img{position:static;inset:auto;flex:none;width:auto;height:100%;max-width:42%;align-self:center;object-fit:contain;border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.slide.portrait .in{position:relative;flex:1 1 0;min-width:0;padding:0;justify-content:center;align-self:center}
.slide.portrait .in .kick{display:none}
.slide.portrait h3{font-size:clamp(26px,8vw,40px);overflow-wrap:anywhere}
.slide.portrait p{font-size:14px}
.ptab{position:absolute;z-index:2;top:14px;left:-6px;background:var(--pink);color:#fff;font-family:var(--display);font-size:20px;letter-spacing:.05em;text-transform:uppercase;padding:4px 16px 4px 20px;transform:rotate(-3deg);box-shadow:0 3px 10px rgba(0,0,0,.35)}
.hero.pho{flex:none}
.hero.pho .slides{flex:none;height:min(300px,40vh)}
@media (min-width:768px){.slide.portrait{padding:60px 28px 28px;gap:24px}.ptab{top:22px;font-size:26px;padding:6px 22px 6px 28px}.hero.pho .slides{height:100%}.slide.portrait h3{font-size:clamp(30px,3.6vw,52px)}.slide.portrait p{font-size:17px}}
.slide.portrait img{height:100%;width:auto;max-height:100%;object-position:center}
@media (min-width:768px){.slide.portrait img{height:100%;max-height:100%}}
.flip-page.flip-odd{background:#E5E5EA}
.cover.has-img{background:none;border:0;box-shadow:none;overflow:visible}
.cover.has-img img{object-fit:contain;filter:drop-shadow(0 6px 10px rgba(33,29,36,.28))}

/* Featured stories: picture cards */
.cards{display:grid;grid-template-columns:1fr;gap:16px;margin-top:6px}
.fcard{display:flex;flex-direction:column;text-align:left;border:1px solid var(--line);background:#fff;border-radius:18px;overflow:hidden;padding:0;cursor:pointer;font:inherit;color:inherit;box-shadow:0 2px 0 var(--line);transition:transform .15s,box-shadow .15s}
.fcard:active{transform:scale(.99)}
.fimg{display:block;aspect-ratio:3/2;background:linear-gradient(160deg,var(--pink),var(--purple));overflow:hidden}
.fimg img{display:block;width:100%;height:100%;object-fit:cover}
.fbody{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;flex:1}
.fh{font-weight:700;font-size:19px;line-height:1.25;overflow-wrap:anywhere}
.fcard .muted{margin-top:auto}
@media (min-width:560px){.cards{grid-template-columns:1fr 1fr}}
@media (min-width:768px){.pad.wide{max-width:1120px}.cards{gap:22px}.fcard:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(33,29,36,.12)}}
@media (min-width:1100px){.cards{grid-template-columns:repeat(3,1fr)}}
/* Reading view must never scroll: not itself, and not the page behind it */
html.flip-open,html.flip-open body,html.flip-open #screen{overflow:hidden!important;overscroll-behavior:none}
.flip,.flip-stage,.flip-book{touch-action:none;overscroll-behavior:contain}
.flip-top,.flip-bar{touch-action:manipulation}

/* adverts sit tight against the magazine: banner as wide as the book, skyscrapers as tall as the book */
.flip-col{display:flex;flex-direction:column;align-items:center;gap:8px}
.flip-row{display:flex;align-items:center;justify-content:center;gap:8px}
.flip-banner{flex:none;display:block;margin:0;padding:0;max-width:none}
.flip-banner img{display:block;width:100%;height:100%;max-height:none;object-fit:fill;border-radius:6px;background:#fff}
.flip-sky{display:none;flex:none;width:auto}
.flip-sky img{display:block;width:100%;height:100%;max-height:none;object-fit:fill;border-radius:6px;background:#fff}
@media (min-width:1000px){.flip-sky{display:block}}

/* bigger edition cover on its own page */
.edcover{width:min(440px,100%);margin:0 auto 8px}
@media (min-width:768px){.edcover{width:min(520px,100%)}}
/* supporter logos 50% bigger */
.logos{grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:14px}
.logo-card{height:102px;padding:15px;border-radius:20px;font-size:15px}
.logo-card img{max-height:66px}

/* home slides: arrows and a swipe note */
.hero{position:relative}
.sl-arrow{position:absolute;top:calc(50% - 40px);z-index:5;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--ink);font-size:30px;line-height:1;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.3);display:grid;place-items:center;padding:0 0 3px}
.sl-arrow.prev{left:10px}.sl-arrow.next{right:10px}
.sl-arrow:active{background:var(--pink);color:#fff}
.swipe-note{margin:2px 0 0;text-align:center;font-size:12px;color:var(--muted)}
.slide.portrait img{box-shadow:none;border-radius:0;filter:drop-shadow(0 10px 18px rgba(0,0,0,.5))}

/* desktop hover motion */
@media (hover:hover) and (pointer:fine){
  .side a,.side button,.tabbar a,nav a,.tab{transition:transform .18s ease,background .18s ease}
  .side a:hover svg,.side button:hover svg,nav a:hover svg,.tab:hover svg{animation:evc-wiggle .5s ease}
  .side a:hover,.tab:hover,nav a:hover{transform:translateX(3px)}
  .tile,.fcard,.logo-card,.card,.edcard{transition:transform .2s ease,box-shadow .2s ease}
  .tile:hover,.fcard:hover,.logo-card:hover,.card:hover,.edcard:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(0,0,0,.14)}
  .tile:hover svg{animation:evc-wiggle .5s ease}
  .btn,button.pink,.sl-arrow{transition:transform .15s ease}
  .btn:hover,button.pink:hover{transform:translateY(-2px)}
  .sl-arrow:hover{transform:scale(1.12)}
  .slide .cover,.slide img{transition:transform .3s ease}
  .slide:hover img{transform:scale(1.04) rotate(-1deg)}
}
@keyframes evc-wiggle{0%,100%{transform:rotate(0) scale(1)}25%{transform:rotate(-10deg) scale(1.12)}60%{transform:rotate(8deg) scale(1.12)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.sl-arrow{width:38px;height:38px;font-size:26px}
.sl-arrow.prev{left:6px}.sl-arrow.next{right:6px}
.hero .slide{padding-left:56px!important;padding-right:56px!important;box-sizing:border-box}
/* keep text clear of the arrows */
.hero .slide:not(.portrait):not(.empty) .in{padding-left:60px;padding-right:60px}
.hero .slide:not(.portrait) h3{font-size:clamp(26px,7vw,36px)}
@media (min-width:768px){.hero .slide:not(.portrait) h3{font-size:clamp(32px,4.2vw,52px)}.hero .slide:not(.portrait):not(.empty) .in{padding-bottom:36px}}
/* side menu hover motion (desktop and iPad with a mouse) */
@media (hover:hover) and (pointer:fine){
  #tabs button{transition:transform .18s ease,background .18s ease,color .18s ease}
  #tabs button:hover{transform:translateX(4px);background:rgba(217,54,134,.07);color:var(--pink)}
  #tabs button:hover svg{animation:evc-wiggle .5s ease}
  #tabs button:active{transform:scale(.96)}
}
/* desktop: left card and right column share top and bottom edges */
@media (min-width:768px){
  .home{align-items:stretch}
  .home>.hero,.home>.hero.pho{height:auto;max-height:none;min-height:400px;align-self:stretch;flex:none}
  .home>.hero .slides,.home>.hero.pho .slides{flex:1 1 auto;height:auto;min-height:360px}
  .home>:not(.hero):last-child{grid-row-end:-1;align-self:stretch;margin-bottom:var(--hero-foot,0px)}
  .home>:not(.hero){margin-bottom:0}
}

/* slanted tab on every home slide; photo slides drop the small pill */
.slide:not(.portrait) .kick{display:none}
.slide:not(.portrait) .ptab{top:16px}
@media (min-width:768px){.slide:not(.portrait) .ptab{top:22px;font-size:26px;padding:6px 22px 6px 28px}}
.body > p a{color:var(--pink);font-weight:600;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}

/* install steps with the real icons */
.stepicons li{line-height:1.5}
.stepicons .ico{display:inline-block;vertical-align:-6px;width:26px;height:26px;padding:3px;margin:0 2px;border-radius:8px;background:rgba(217,54,134,.12);color:var(--pink);box-sizing:content-box}
/* phones: the home screen fits the space with a gap above the tab bar, no scrolling */
@media (max-width:767.98px){
  .home{padding-bottom:14px}
  .home>.hero,.home>.hero.pho{flex:1 1 0;min-height:170px}
  .home>.hero .slides,.home>.hero.pho .slides{flex:1 1 auto;height:auto;min-height:150px}
  .home .ad{padding:10px 14px;gap:10px;align-items:center}
  .home .ad .logo{max-height:30px;width:auto}
  .home .ad .muted{font-size:13px;line-height:1.35}
  .home .ad .lab{margin-bottom:2px}
  .swipe-note{margin:0;font-size:11px}
}
.dl{display:flex;align-items:center;justify-content:center;gap:8px}.dl .ico{width:20px;height:20px}

/* ---- Priority 1 and 3 additions ---- */
.item .dot{width:76px;height:76px;border-radius:14px}
.itxt{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.snip{display:block;font-size:14px;line-height:1.35;color:var(--ink);opacity:.85}
.sponsored{align-self:flex-start;display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--pink);border:1px dashed var(--pink);border-radius:999px;padding:2px 9px;background:#fff}
.fbody .sponsored{margin:2px 0}
.fcard .snip{flex:none}
.eds-pad{padding-top:4px!important}
.edcard{display:flex;flex-direction:column;gap:2px;border:0;background:none;padding:0;text-align:left;cursor:pointer;min-width:0}
.edcard .cover{width:100%}
.edcard .h3{margin-top:8px}
.edcard .muted{font-size:13px}
.grid2.eds{gap:14px 12px}
.latest{display:grid;grid-template-columns:1fr;gap:10px}
.lcard{display:flex;gap:12px;align-items:center;text-align:left;border:1px solid var(--line);background:#fff;border-radius:18px;padding:10px;cursor:pointer;font:inherit;color:inherit;min-width:0;box-shadow:0 2px 0 var(--line)}
.limg{flex:none;width:72px;height:72px;border-radius:12px;overflow:hidden;background:linear-gradient(135deg,var(--purple),var(--pink));display:block}
.limg img{width:100%;height:100%;object-fit:cover;display:block}
.ltxt{display:flex;flex-direction:column;gap:2px;min-width:0}
.lh{font-weight:700;font-size:15px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ltxt .muted{font-size:12px}
.logo-card{border:1px solid var(--line);cursor:pointer;font:inherit;position:relative}
.logo-card.feat{border:2px solid var(--pink)}
.fbadge{position:absolute;top:-1px;left:10px;background:var(--pink);color:#fff;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:0 0 8px 8px}
.fbadge.static{position:static;display:inline-block;border-radius:999px;padding:3px 10px;margin-bottom:6px}
.supcard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;text-align:center;margin-bottom:12px}
.suplogo{display:block;max-width:200px;max-height:110px;object-fit:contain;margin:6px auto 4px}
.sech{font-family:var(--display);font-size:24px;letter-spacing:.02em;text-transform:uppercase;margin:18px 0 6px}
.svc{margin:0 0 10px;padding-left:20px}.svc li{margin:3px 0}
.offer{background:#fdf0f7;border:1px dashed var(--pink);border-radius:16px;padding:12px 14px;margin:12px 0}
.offer p{margin:4px 0 0;font-weight:600}
@media (max-width:767.98px){
  .home>.hero,.home>.hero.pho{flex:none;min-height:0}
  .home>.hero .slides,.home>.hero.pho .slides{flex:none;height:min(262px,36vh);min-height:200px}
  .slide.portrait{padding:46px 14px 12px;gap:12px}
  .slide.portrait .in{justify-content:flex-end;align-self:stretch;padding-top:6px}
  .swipe-note{margin:2px 0 8px}
  .hero{margin-bottom:2px}
  .slide.portrait img{max-width:52%}
  .slide.portrait h3{font-size:clamp(22px,6.4vw,30px);line-height:1}
  .slide.portrait p{font-size:13px;margin:2px 0 6px}
  .home{padding-bottom:16px}
}
@media (min-width:768px){.latest{grid-template-columns:1fr}.grid2.eds{gap:22px}}

/* Phone home screen: fit on one screen with no scrolling. The tab bar already links to every section. */
@media (max-width:767.98px){
  .home .tiles,.home .swipe-note{display:none}
  .home{gap:8px;padding-bottom:8px}
  .home>.hero .slides,.home>.hero.pho .slides{height:min(236px,30vh);min-height:170px}
  .home .latest{gap:8px}
  .home .lcard{padding:8px 10px;gap:10px}
  .home .limg{width:52px;height:52px;border-radius:10px}
  .home .lh{font-size:14px;-webkit-line-clamp:2}
  .home .ad{padding:8px 12px;min-height:46px}
  .home .ad .logo{max-height:26px;margin:0}
}
@media (max-width:767.98px) and (max-height:780px){ .home .lcard:nth-child(n+2){display:none} }
@media (max-width:767.98px) and (max-height:700px){ .home>.hero .slides,.home>.hero.pho .slides{height:min(200px,28vh);min-height:150px} }
#screen.homephone>.legal{display:none}
#screen.homephone{overflow-y:auto}
@media (max-width:767.98px) and (max-height:700px){ .home .slide.portrait{padding-top:40px} .home .slide.portrait h3{font-size:clamp(17px,5vw,22px)} .home .slide.portrait p{font-size:12px;margin:0 0 4px} .home .slide.portrait .btn{padding:8px 14px} }
@media (max-width:767.98px){ .home>.ad[data-print]{display:none} }
.tellstory{display:inline-block;margin-top:12px;background:#fff;color:var(--pink);font-weight:700;font-size:15px;padding:9px 18px;border-radius:999px;text-decoration:none;box-shadow:0 2px 0 rgba(0,0,0,.18)}

/* Taller phones: use the spare room to make the home screen livelier (shortcut tiles back, bigger carousel and cards). */
@media (max-width:767.98px) and (min-height:800px){
  .home .tiles{display:grid;gap:8px}
  .home .tile{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 2px 0 var(--line)}
  .home .tile svg{background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;border-radius:12px;padding:7px;box-sizing:content-box;width:20px;height:20px}
  .home>.hero .slides,.home>.hero.pho .slides{height:clamp(236px,31vh,360px)}
  .home .limg{width:64px;height:64px;border-radius:14px}
  .home .lh{font-size:15px}
  .home .lcard{padding:10px 12px}
}

/* The pink edition tag swings in when a slide comes into view. */
@keyframes tagin{0%{transform:translateX(-130%) rotate(-14deg);opacity:0}55%{transform:translateX(5%) rotate(1deg);opacity:1}78%{transform:translateX(-1%) rotate(-4deg)}100%{transform:translateX(0) rotate(-3deg);opacity:1}}
.slide.on .ptab{animation:tagin .75s cubic-bezier(.2,.8,.3,1) .15s both}
@media (prefers-reduced-motion:reduce){.slide.on .ptab{animation:none}}
/* Edition with no cover picture yet: a branded stand-in instead of an empty gap. */
.slide.portrait .phcover{flex:none;align-self:center;width:30%;max-width:130px;aspect-ratio:3/4;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,.45);font-family:var(--display);font-size:clamp(14px,3.9vw,19px);line-height:1;letter-spacing:.02em}
.slide.portrait .phcover b{font-size:.4em;letter-spacing:.14em;margin-bottom:2px}
@media (min-width:768px){.slide.portrait .phcover{width:auto;height:100%;max-width:42%;font-size:38px}}

/* Desktop and tablet home: everything on one screen, with a slim footer instead of the full one. */
@media (min-width:768px){
  #screen.fit{display:flex;flex-direction:column;overflow:hidden}
  #screen.fit>.top{flex:none}
  #screen.fit>.home{flex:1 1 0;min-height:0}
  #screen.fit>.legal{flex:none;margin-top:6px}
  #screen.fit>.legal.mini{padding-top:6px;padding-bottom:max(22px,env(safe-area-inset-bottom,0px))}
  #screen.fit .home>.hero,#screen.fit .home>.hero.pho{min-height:0}
  #screen.fit .home>.hero .slides,#screen.fit .home>.hero.pho .slides{min-height:0}
}
@media (min-width:768px) and (max-height:860px){ #screen.fit .home .tiles{display:none} #screen.fit .home .swipe-note{display:none} }

/* Sponsor banners: the whole tagline always shows and the card grows to hold it. */
.ad{min-width:0;height:auto}
.ad>span:first-child{min-width:0;flex:1 1 auto}
.ad .btn{flex:none}
.ad .logo{max-height:30px;width:auto;margin:2px 0}
@media (min-width:768px){ #screen.fit .home .tiles{display:none} #screen.fit .home .ad{padding:14px 16px} }

/* Desktop: use the width. The page and footer run edge to edge, with the content kept to a comfortable maximum. */
@media (min-width:768px){
  #screen{max-width:none;margin-inline:0}
  #screen>.top,#screen>.home{max-width:1560px;margin-inline:auto;width:100%;box-sizing:border-box}
  .pad.listpg,.pad.eds-pad{max-width:1560px}
  .pad.wide{max-width:1560px}
  #screen>.legal{width:100%;box-sizing:border-box;max-width:none;margin-inline:0}
  #screen.fit>.legal{margin-top:6px}
}
@media (min-width:1300px){.grid2.eds{grid-template-columns:repeat(4,1fr)}}

/* image banners: flush picture with rounded corners, no box around it */
.ad.adimg,.home .ad.adimg,#screen.fit .home .ad.adimg{display:block;position:relative;flex:none;align-self:stretch;padding:0;min-height:0;height:auto;border:0;background:transparent;box-shadow:none;border-radius:18px;overflow:hidden;line-height:0}
.ad.adimg img,.home .ad.adimg img{display:block;width:100%;max-width:none;height:auto;max-height:none;object-fit:contain;border-radius:18px}
.ad.adimg .lab{position:absolute;top:8px;left:8px;z-index:1;background:rgba(0,0,0,.55);color:#fff;padding:2px 8px;border-radius:999px;font-size:10px;line-height:1.4;margin:0}
.feat-ad .ad.adimg{margin:6px 0}

/* desktop home: the edition card is at least screen height, and grows to match the right column (bigger sponsor image, longer text). Sponsor sits on the bottom edge, level with the edition card. */
@media (min-width:768px){
  #screen.fit{overflow-y:auto}
  #screen.fit>.home{flex:none}
  #screen.fit .home>.hero,#screen.fit .home>.hero.pho{min-height:clamp(400px,calc(100vh - 250px),760px);height:auto;align-self:stretch}
  #screen.fit .home>.hero .slides,#screen.fit .home>.hero.pho .slides{min-height:0}
  #screen.fit .home>.ad,#screen.fit .home>.ad.adimg{align-self:end}
}


/* sponsor label: small dark pill, as before, so it never covers the artwork; dots sit under the card so card and sponsor share a bottom edge */
.ad.adimg{overflow:hidden}
.ad.adimg .lab{position:absolute;z-index:2;top:8px;left:8px;background:rgba(0,0,0,.55);color:#fff;font-family:inherit;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1.4;padding:2px 8px;margin:0;border-radius:999px;transform:none;box-shadow:none}
@media (min-width:768px){
  #screen.fit .home>.hero{position:relative}
  #screen.fit .home>.hero .dots{position:absolute;left:0;right:0;top:calc(100% + 10px)}
  #screen.fit .home>.hero .swipe-note{position:absolute;left:0;right:0;top:calc(100% + 26px);margin:0}
  #screen.fit>.home{padding-bottom:52px}
}
.tag+.sponsored{margin:0 0 4px 10px;vertical-align:middle} .body .sponsored{margin-block:4px}

/* edition slide: photo behind the cover, faded into the brand purple */
.slide.portrait::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(100deg,rgba(33,29,36,.94) 0%,rgba(74,35,84,.86) 45%,rgba(107,45,99,.72) 100%),var(--bgimg) center/cover no-repeat}
.slide.portrait>img,.slide.portrait>.phcover{position:relative;z-index:1}


/* tablet and desktop: the footer sits at the bottom of the screen, never floating under short pages */
@media (min-width:768px){
  #screen:not(.gatefit){display:flex;flex-direction:column}
  #screen:not(.gatefit)>*{flex:none;box-sizing:border-box}
  #screen:not(.gatefit)>.pad,#screen:not(.gatefit)>.top{width:100%}
  #screen:not(.gatefit)>.legal{margin-top:auto}
  #screen.fit>.home{flex:none}
}

/* Welcome screen on wide screens: the white "Hello and welcome to" label must hug its text, not stretch across the page, and the logo stays on top */
.welcome .tilt{width:fit-content;max-width:100%;align-self:flex-start}
.welcome .wm-img{z-index:3}
@media (min-width:768px){.welcome .tilt{align-self:center}}

/* Phone on its side: short screen. Skyscrapers flank the book, the top bar and page buttons float so the book is as big as possible. */
@media (orientation:landscape) and (max-height:520px) and (min-width:600px){
.flip-sky{display:block}
.flip-top{position:absolute;top:0;left:0;z-index:7;padding:calc(env(safe-area-inset-top,0px) + 6px) 0 0 calc(env(safe-area-inset-left,0px) + 8px)}
.flip-title,.flip-pdf{display:none}
.flip-x{height:36px;font-size:14px}
.flip-stage{padding:0 calc(env(safe-area-inset-right,0px) + 64px) 0 calc(env(safe-area-inset-left,0px) + 64px)}
.flip-bar{position:absolute;inset:0;padding:0;pointer-events:none;display:block}
.flip-bar button{pointer-events:auto;position:absolute;top:50%;margin-top:-23px;width:48px;height:46px}
.flip-prev{left:calc(env(safe-area-inset-left,0px) + 8px)}
.flip-next{right:calc(env(safe-area-inset-right,0px) + 8px)}
.flip-count{display:none}
}

/* Latest edition card: the cover gets the whole height of the card and up to half its width, so it is never tiny or squeezed to nothing */
.slide.portrait{padding:12px 14px 12px 18px}
.slide.portrait img{flex:0 1 auto;min-width:0;max-width:52%;height:100%;object-fit:contain;object-position:center}
@media (min-width:768px){.slide.portrait{padding:24px 28px}.slide.portrait img{max-width:46%}}

/* Produced by EVOLVE Advice, published by Elfandor */
.legal .brands{display:flex;gap:28px;justify-content:center;align-items:flex-end;margin:22px auto 6px}
.legal .brands span{display:flex;flex-direction:column;align-items:center;gap:5px}
.legal .brands small{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.legal .brands .elf{margin:0}
.legal .brands .evo{width:56px;height:56px;margin:0}
.legal.mini .evo{width:36px;height:36px;margin:0}

.legal .np{max-width:520px;margin:0 auto;font-size:12.5px;line-height:1.5;color:var(--ink)}
.legal.mini .np{font-size:11.5px;max-width:none}

.adnote{text-align:center;margin:8px 0 0;font-size:13px;color:var(--muted)}.adnote a{color:var(--pink);font-weight:700}
.sharecard{margin:14px 0;padding:20px;border-radius:22px;background:linear-gradient(135deg,var(--pink),var(--purple));color:#fff;text-align:left}
.sharecard .kk{display:inline-block;background:#fff;color:var(--pink);font-family:var(--display);font-size:16px;letter-spacing:.06em;padding:1px 12px;border-radius:999px;text-transform:uppercase;margin-bottom:8px}
.sharecard b{display:block;font-family:'Edo',var(--display);font-weight:400;font-size:32px;line-height:1;margin:0 0 6px}
.sharecard p{margin:0 0 14px;font-size:15px}
.sharecard .sc-b{display:flex;gap:10px;flex-wrap:wrap}.sharecard .btn{flex:1 1 140px;text-align:center;text-decoration:none;background:#fff;color:var(--ink)}.sharecard .btn.alt{background:var(--ink);color:#fff;border-color:var(--ink)}
.wbox{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-left:5px solid var(--pink);border-radius:16px;padding:14px;margin:20px 0}.wbox .ph{flex:none;width:68px;height:68px;border-radius:50%;object-fit:cover;background:var(--line)}.wbox p{margin:6px 0 0;font-size:14px}
.adwrap{display:flex;flex-direction:column;justify-content:flex-end;gap:0;min-width:0}.adwrap .adnote{margin:10px 0 2px}
.adov-head{display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px 0 12px;text-align:center}.adov-logo{height:38px;width:auto;display:block}.adov-sp{font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--pink)}.adov.splash:not(.x) .adov-in{gap:0}.adov.splash .adov-img img{max-height:calc(100dvh - 290px)}

.chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0;align-items:center}.chips .clbl{font-weight:700;font-size:13px;margin-right:2px}
.chip{border:1.5px solid rgba(0,0,0,.14);background:#fff;border-radius:999px;padding:4px 11px;font:inherit;font-size:13px;color:inherit}.chip.on{background:#D93686;border-color:#D93686;color:#fff}
.alink{border:0;background:none;padding:0;font:inherit;font-weight:700;color:inherit;text-decoration:underline;text-decoration-color:#D93686;text-underline-offset:3px;cursor:pointer}

.flip-tool{border:0;background:rgba(0,0,0,.08);color:#1d1d1f;border-radius:999px;padding:8px 14px;font:inherit;font-size:14px;font-weight:600;cursor:pointer;flex:none}
.flip-tool:active{background:#D93686;color:#fff}
.flip-top{flex-wrap:nowrap}.flip-title{font-size:22px}
@media (max-width:640px){.flip-title{display:none}.flip-top{justify-content:flex-start}.flip-tool{padding:8px 11px;font-size:13px}.flip-pdf{margin-left:auto}}
.flip-menu{position:absolute;z-index:20;background:#fff;color:#1d1d1f;border-radius:14px;box-shadow:0 10px 36px rgba(0,0,0,.28);padding:6px;min-width:230px;display:flex;flex-direction:column}
.flip-menu button{border:0;background:none;text-align:left;padding:12px 14px;font:inherit;font-size:15px;border-radius:10px;cursor:pointer;color:inherit}.flip-menu button:hover,.flip-menu button:active{background:#f1f1f5}
.flip-panel{position:absolute;inset:0;z-index:30;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;padding:14px}
.flip-panel-in{background:#fff;color:#1d1d1f;border-radius:18px;width:min(720px,100%);max-height:100%;display:flex;flex-direction:column;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.flip-panel-h{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid #e5e5ea;font-size:17px}
.flip-panel-x{border:0;background:rgba(0,0,0,.08);width:36px;height:36px;border-radius:50%;font-size:24px;line-height:1;cursor:pointer;color:#1d1d1f}
.flip-panel-b{padding:16px 20px 22px;overflow:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.flip-read{line-height:1.6;max-width:36em;margin:0 auto}.flip-read p{margin:0 0 .9em}.flip-read h3{font-size:1.25em;line-height:1.25;margin:1.1em 0 .4em}
.flip-fz{display:flex;gap:8px;justify-content:flex-end;margin-bottom:6px}.flip-fz button{border:0;background:#f1f1f5;border-radius:10px;padding:8px 14px;font:inherit;font-weight:700;cursor:pointer}
.flip-small{color:#555;margin:0 0 10px;font-size:14px}.flip-link{width:100%;box-sizing:border-box;padding:10px;border:1px solid #d2d2d7;border-radius:10px;font:inherit;font-size:14px;margin-bottom:12px}
.flip-sharegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.flip-sharegrid a,.flip-sharegrid button{display:block;text-align:center;border:0;background:#f1f1f5;border-radius:10px;padding:12px 6px;font:inherit;font-size:14px;font-weight:600;color:#1d1d1f;text-decoration:none;cursor:pointer}
#flip-print{display:none}
@media print{html.flip-printing body>*:not(#flip-print){display:none!important}html.flip-printing,html.flip-printing body{overflow:visible!important;height:auto!important;background:#fff!important}#flip-print{display:block!important}#flip-print .pimg{display:block;width:100%;max-height:100vh;object-fit:contain;page-break-after:always}@page{margin:8mm}}

.flip-art{position:absolute;inset:0;z-index:30;background:rgba(20,20,24,.6);display:flex;align-items:center;justify-content:center;padding:calc(env(safe-area-inset-top,0px) + clamp(8px,3vw,36px)) calc(env(safe-area-inset-right,0px) + clamp(8px,3vw,36px)) calc(env(safe-area-inset-bottom,0px) + clamp(8px,3vw,36px)) calc(env(safe-area-inset-left,0px) + clamp(8px,3vw,36px))}
.flip-art-card{background:#fff;color:#1d1d1f;border-radius:6px;width:min(980px,100%);max-height:100%;height:100%;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.45);overflow:hidden}
.flip-art-top{display:flex;gap:8px;align-items:center;padding:12px 18px;border-bottom:1px solid #ececf0;flex:none}
.flip-art-top button{border:0;background:#f3f3f7;border-radius:10px;padding:9px 14px;font:inherit;font-size:16px;font-weight:700;cursor:pointer;color:#1d1d1f}
.flip-art-top button sup{font-size:11px;color:#D93686}.flip-art-top .wide{font-size:14px;font-weight:600}
.flip-art-top .flip-art-x{margin-left:auto;background:#D93686;color:#fff;font-size:16px;border-radius:999px;padding:10px 18px}
.flip-art-scroll{overflow:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:clamp(18px,4vw,44px) clamp(18px,5vw,64px);flex:1}
.flip-art-scroll h2{font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif;font-weight:400;color:#D93686;font-size:clamp(38px,7vw,68px);line-height:1;margin:0 0 10px;text-wrap:balance;max-width:16em}
.flip-art-sub{font-size:clamp(18px,2.6vw,24px);line-height:1.35;color:#3a3a40;margin:0 0 10px;font-weight:600}
.flip-art-meta{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#8a8a93;border-top:3px solid #D93686;padding-top:8px;margin:14px 0 22px;width:90px}
.flip-art-body{font-family:Georgia,'Times New Roman',serif;line-height:1.75;max-width:38em;color:#26262b}
.flip-art-body p{margin:0 0 1.05em}.flip-art-body .lead{font-size:1.14em;font-weight:600;color:#1d1d1f}
.flip-art-nav{flex:none;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 18px;background:#f1f1f5;border-top:1px solid #e2e2e8}
.flip-art-nav span{font-size:15px;color:#6b6b74;font-weight:600}.flip-art-nav button{border:0;background:none;font:inherit;font-size:17px;font-weight:700;color:#D93686;cursor:pointer;padding:8px 6px}.flip-art-nav button:disabled{opacity:.25;cursor:default}
.flip-art-load{padding:40px;text-align:center;color:#6b6b74;font-size:17px}
@media(max-width:520px){.flip-art-nav span{display:none}.flip-art-top .wide{display:none}}

.flip-logo{height:34px;width:auto;flex:none;margin-right:12px;display:block}.flip-title{flex:1}@media (max-width:640px){.flip-logo{height:28px;margin-right:6px}}

.flip-soc{display:flex;gap:6px;align-items:center;margin-right:4px}.flip-soc[hidden]{display:none}.flip-soc button{border:0;width:34px;height:34px;border-radius:50%;color:#fff;font:700 15px/1 var(--body);cursor:pointer;display:grid;place-items:center;padding:0}.flip-soc button:hover{filter:brightness(1.12)}@media (max-width:900px){.flip-soc{display:none!important}}

.printpop .pp-card{background:#fff;color:var(--ink);border-radius:24px;padding:26px 22px 20px;width:min(400px,100%);text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.35);display:flex;flex-direction:column;align-items:center;gap:12px}
.printpop h2{font-family:var(--display);font-weight:400;font-size:30px;line-height:1.1;margin:4px 0 0;letter-spacing:.02em}.printpop h2 b{font-weight:400;color:var(--pink)}.printpop .pp-free{background:var(--pink);color:#fff;padding:0 8px;border-radius:6px;display:inline-block;transform:rotate(-2deg)}
.printpop p{margin:0;color:var(--muted);font-size:16px}.printpop .pp-go{width:100%;justify-content:center;text-align:center;margin-top:4px}
.printpop .pp-later{border:0;background:none;font:inherit;font-weight:700;color:var(--muted);cursor:pointer;padding:8px}
/* Edition slide: calmer photo behind so the cover stands out */
.slide.portrait::before{background:linear-gradient(100deg,rgba(33,29,36,.96) 0%,rgba(66,30,78,.92) 50%,rgba(90,36,88,.86) 100%),var(--bgimg) center/cover no-repeat}
.slide.portrait img{filter:drop-shadow(0 14px 26px rgba(0,0,0,.65)) drop-shadow(0 0 2px rgba(255,255,255,.35))}
@media (max-width:767.98px){.slide.portrait img{max-width:56%}}
/* Wide screens: banners inside pages are the same height as the pink title panel */
@media (min-width:768px){.pad .ad.adimg img{height:auto;max-height:none;width:100%;max-width:100%;margin:0;object-fit:contain}}
.flip-adnote{margin:0;height:18px;line-height:18px;overflow:hidden;white-space:nowrap;padding:0 8px;text-align:center;font-size:12px;color:rgba(255,255,255,.85);background:transparent;flex:none}.flip-adnote a{color:#fff;font-weight:700;text-decoration:underline}
/* Several adverts for one space take turns */
.adrot>.adslide{display:none}.adrot>.adslide.on{display:block;animation:adfade .5s ease}
@keyframes adfade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.adrot>.adslide.on{animation:none}}
/* "Sponsored" sits above the banner, not on top of it */
.ad.adimg .lab,.home .ad.adimg .lab,#screen.fit .home .ad.adimg .lab{position:static;display:block;background:none;color:var(--muted);padding:0 2px 5px;margin:0;border-radius:0;font-size:11px;line-height:1.2;letter-spacing:.12em}
.ad.adimg,.home .ad.adimg,#screen.fit .home .ad.adimg{overflow:visible;border-radius:0}
.ad.adimg img,.home .ad.adimg img{border-radius:18px}
@media (min-width:768px){.ad.adimg,.home .ad.adimg,#screen.fit .home .ad.adimg{text-align:center}.ad.adimg img,.home .ad.adimg img,#screen.fit .home .ad.adimg img{height:auto;max-height:none;width:100%;max-width:100%;margin:0;object-fit:contain}}

/* Links, videos and pop-ups on magazine pages */
.flip-els{position:absolute;inset:0;z-index:3;pointer-events:none}
.flip-el{position:absolute;display:flex;align-items:center;justify-content:center;pointer-events:auto;border:0;padding:0;margin:0;background:transparent;border-radius:6px;cursor:pointer;overflow:hidden;text-decoration:none}
.flip-el-link:hover,.flip-el-link:focus-visible{background:rgba(217,54,134,.16);outline:2px solid #D93686}
.flip-el-popup,.flip-el-youtube,.flip-el-vimeo,.flip-el-sound,.flip-el-embed,.flip-el-clipboard{background:rgba(217,54,134,.18);outline:2px solid #D93686}
.flip-el i{font-style:normal;background:#D93686;color:#fff;width:34px;height:34px;max-width:90%;max-height:90%;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.flip-el-picture img,.flip-el-slideshow img{width:100%;height:100%;object-fit:contain;display:block}
.flip-el-slideshow i.n{position:absolute;right:6px;bottom:6px;border-radius:999px;width:auto;height:auto;padding:2px 8px;font-size:12px}
.flip-el-sound.on i{background:#211D24}.flip-el-clipboard.done i{background:#2e7d32}
.flip-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.flip-vid{position:relative;width:min(86vw,760px);aspect-ratio:16/9;background:#000}.flip-vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.flip-pimg{max-width:min(86vw,760px);max-height:70vh;display:block;margin:0 auto;border-radius:10px}.flip-ptxt{margin:12px 0 0;line-height:1.5;max-width:min(86vw,560px)}
.flip-ss{display:flex;align-items:center;gap:8px;justify-content:center}.flip-ss img{max-width:min(70vw,640px);max-height:60vh;border-radius:10px}.flip-ss button{background:#D93686;color:#fff;border:0;border-radius:50%;width:38px;height:38px;font-size:22px;cursor:pointer}.flip-ssn{text-align:center;margin:8px 0 0;color:#6b6470}