/* Layout: a hand-drawn storybook — white pages, marker-style handwritten headings that match the ink illustrations, periwinkle and lime everywhere, red and yellow only for the special moments */
:root{
  color-scheme:light;
  --white:#FFFFFF; --paper:#FFFFFF;
  --ink:#171522; --soft:#5A5770;
  --purple:#7F86F5; --plum:#4A50C8; --lime:#A0E45D; --red:#FF4430; --yellow:#FFD400;
  --lilac:#D4D7FC; --wash:#F2F3FE; --wash-green:#F2FAEA; --line:#E6E7F2;
  --deep:#5E9C2A; --on-dark:rgba(23,21,34,.82);
  --f-head:"Kalam","Segoe Print","Bradley Hand","Comic Sans MS",cursive;
  --f-body:"Nunito","Avenir Next","Segoe UI",system-ui,sans-serif;
  --f-note:"Kalam","Segoe Print","Bradley Hand",cursive;
  --hand:"Shantell Sans","Kalam","Comic Sans MS",cursive;--brush:"Caveat Brush","Kalam","Segoe Print",cursive;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:18px;line-height:1.7;overflow-x:hidden}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:70;opacity:.35;background-image: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 .4 0 0 0 0 .2 0 0 0 0 .5 0 0 0 .06 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--paper)}
a{color:inherit}
img{display:block}
h1,h2,h3{font-family:var(--f-head);font-weight:700;line-height:1.12;letter-spacing:0;text-wrap:balance;margin:0;color:var(--ink)}
h1{font-size:clamp(2.4rem,5vw,4.2rem)}
h2{font-size:clamp(1.9rem,3.4vw,2.9rem)}
h3{font-size:1.4rem;font-weight:700}
.note{font-family:var(--f-note);font-weight:700;color:var(--plum);font-size:1.5rem;line-height:1.1}
.squiggle{position:relative;white-space:nowrap}
.squiggle::after{content:"";position:absolute;left:-2%;right:-2%;bottom:-.14em;height:.3em;background:var(--red);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 Q 12 2 22 7 T 42 7 T 62 7 T 82 7 T 102 7 T 118 6' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 Q 12 2 22 7 T 42 7 T 62 7 T 82 7 T 102 7 T 118 6' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat}
em.soft{font-style:normal;color:var(--purple);background:linear-gradient(transparent 70%,var(--lilac) 70%);padding:0 .08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
p{margin:0}
.wrap{max-width:none;margin:0;padding-left:max(clamp(22px,5vw,96px),env(safe-area-inset-left,0px));padding-right:max(clamp(22px,5vw,96px),env(safe-area-inset-right,0px))}
:focus-visible{outline:3px solid var(--purple);outline-offset:3px;border-radius:6px}

/* signature Z: purple letter with the logo's lime drop */
.zz{color:var(--plum);position:relative;display:inline-block;margin-right:.06em}
.nw{white-space:nowrap}
.zz::after{content:"";position:absolute;right:-.1em;bottom:.3em;width:.15em;height:.15em;background:var(--red);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}

.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-note);font-weight:700;font-size:1.55rem;letter-spacing:0;text-transform:none;color:var(--plum);line-height:1}
.eyebrow img{width:26px;height:26px}
.lead{font-size:1.18rem;color:var(--soft);max-width:34em}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.55em;font-family:var(--f-head);font-weight:700;font-size:1.12rem;letter-spacing:0;padding:.7em 1.45em .62em;border-radius:999px;border:2px solid var(--ink);background:var(--white);color:var(--ink);text-decoration:none;cursor:pointer;transition:transform .15s,background .15s,color .15s}
.btn:hover{transform:translateY(-2px);background:var(--wash)}
.btn.solid{background:var(--lime);border-color:var(--lime);color:var(--ink);box-shadow:0 6px 0 -1px var(--deep)}
.btn.solid:hover{background:#B2EC78}
.btn.solid:active{transform:translateY(3px);box-shadow:0 2px 0 -1px var(--deep)}

.btn svg{width:1.05em;height:1.05em;flex:none}
.btn .drop{width:.5em;height:.5em;background:var(--red);border-radius:50% 50% 50% 0;transform:rotate(-45deg);flex:none}

/* header */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(255,253,250,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;gap:22px;padding-block:14px}
.brand{display:block;flex:none}
.brand img{height:32px;width:auto}
nav.main{display:flex;gap:clamp(2px,.5vw,8px);margin-left:auto;align-items:center}
nav.main a{font-weight:700;font-size:.98rem;text-decoration:none;padding:.45em clamp(.6em,1vw,1em);border-radius:999px;color:var(--ink);white-space:nowrap}
nav.main .nav-tour{margin-left:clamp(4px,.6vw,10px)}
nav.main a:hover{color:var(--purple)}
nav.main a.on{background:var(--wash);color:var(--purple)}
nav.main a.mobile-only{display:none}
@media (max-width:960px){nav.main a.mobile-only{display:block}}
.menu-btn{display:none;margin-left:auto;background:var(--white);border:1.5px solid var(--purple);color:var(--purple);border-radius:999px;padding:6px 14px;font-weight:700;font-family:var(--f-body);cursor:pointer}
@media (max-width:960px){
  .menu-btn{display:block}
  header .cta{display:none}
  nav.main{display:none;position:absolute;left:0;right:0;top:100%;background:var(--white);flex-direction:column;padding:10px max(22px,env(safe-area-inset-left,0px)) 18px;border-bottom:1px solid var(--line)}
  nav.main.open{display:flex}
  nav.main a{font-size:1.1rem}
}

section.block{padding-block:96px}
.head{display:grid;gap:14px;margin-bottom:48px;max-width:760px}
.page-top{padding-block:76px 30px}
.page-top .lead{margin-top:18px}

/* ===== HOME ===== */
.hz-top{display:flex;align-items:center;gap:clamp(12px,2vw,28px)}
.hz-top .logo{display:inline-flex;align-items:center;background:var(--white);border:2.5px solid var(--ink);border-radius:16px;padding:9px 16px 8px;box-shadow:4px 4px 0 var(--ink);transform:rotate(-2.5deg);transition:transform .2s}
.hz-top .logo:hover{transform:rotate(0) scale(1.03)}
.hz-top .logo img{height:clamp(24px,2.1vw,32px);width:auto}
.hz-nav{display:flex;gap:clamp(2px,.5vw,8px);margin-left:auto;align-items:center}
.hz-nav a{color:var(--ink);text-decoration:none;font-weight:800;font-size:clamp(.9rem,1.05vw,1.04rem);padding:.45em clamp(.6em,1vw,1em);border-radius:999px;white-space:nowrap}
.hz-nav .nav-tour{margin-left:clamp(4px,.6vw,10px)}
.hz-nav a:hover{background:rgba(255,255,255,.3)}
.hz-nav a.on{background:rgba(255,255,255,.35)}
.hz-menu{display:none;margin-left:auto;background:var(--white);border:2.5px solid var(--ink);color:var(--ink);border-radius:12px;padding:6px 14px;font-weight:800;font-family:var(--f-body);cursor:pointer;box-shadow:3px 3px 0 var(--ink)}


.btn.lime{background:var(--lime);color:#2A1740;border-color:var(--lime);box-shadow:0 6px 0 -1px color-mix(in srgb,var(--lime) 70%,#000);font-weight:600}
.btn.lime:hover{background:color-mix(in srgb,var(--lime) 85%,#fff)}
.btn.lime:active{transform:translateY(3px);box-shadow:0 2px 0 -1px color-mix(in srgb,var(--lime) 70%,#000)}

/* hero typography: marker handwriting + brush notes, highlighter swipe */
.hz-copy{--hand:"Shantell Sans","Kalam","Comic Sans MS",cursive;--brush:"Caveat Brush","Kalam","Segoe Print",cursive;font-family:var(--hand)}
.hz-copy h1{font-family:var(--hand);font-weight:800;font-size:clamp(2.7rem,5.2cqw,5.6rem);line-height:.95;letter-spacing:-.015em;display:grid;gap:.04em;margin:0}
.hz-kicker{font-family:var(--brush);font-weight:400;font-size:.46em;letter-spacing:.01em;line-height:1;transform:rotate(-3deg);transform-origin:left bottom;justify-self:start;margin-bottom:.12em}
.hz-row{display:block;white-space:nowrap}
.hz-row2{display:flex;align-items:center;gap:.28em;flex-wrap:wrap}
.hl{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 60' preserveAspectRatio='none'%3E%3Cpath d='M7 17C38 9 92 7 196 11c2 0 3 2 2 4l-3 34c0 2-2 3-4 3C126 55 64 56 6 51c-3 0-5-3-4-6l1-24c0-2 2-4 4-4z' fill='%23FFD400'/%3E%3Cpath d='M14 22C70 17 130 16 188 19' stroke='%23FFE34D' stroke-width='5' stroke-linecap='round' fill='none' opacity='.7'/%3E%3Cpath d='M12 44C66 47 128 46 186 43' stroke='%23F2C500' stroke-width='4' stroke-linecap='round' fill='none' opacity='.6'/%3E%3C/svg%3E") center/100% 100% no-repeat;padding:.02em .16em .06em;margin-left:-.1em;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background-image .6s}
.hero-z[data-slide="3"] .hl{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 60' preserveAspectRatio='none'%3E%3Cpath d='M7 17C38 9 92 7 196 11c2 0 3 2 2 4l-3 34c0 2-2 3-4 3C126 55 64 56 6 51c-3 0-5-3-4-6l1-24c0-2 2-4 4-4z' fill='%23FFFFFF'/%3E%3Cpath d='M14 22C70 17 130 16 188 19' stroke='%23FFFFFF' stroke-width='5' stroke-linecap='round' fill='none' opacity='.7'/%3E%3Cpath d='M12 44C66 47 128 46 186 43' stroke='%23F1F1F6' stroke-width='4' stroke-linecap='round' fill='none' opacity='.6'/%3E%3C/svg%3E")}
.hz-note{font-family:var(--brush);font-weight:400;font-size:.3em;line-height:1.02;letter-spacing:.01em;display:inline-flex;align-items:flex-start;gap:.15em;transform:rotate(-5deg);margin-top:.4em}
.hz-note svg{width:2.1em;height:1.3em;flex:none;margin-top:-.1em}
.hz-copy p{font-family:var(--hand);font-weight:500;font-size:clamp(1rem,1.36cqw,1.3rem);line-height:1.55;color:var(--ink);max-width:31em}
.hz-copy p .x{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'%3E%3Cpath d='M2 12C20 7 38 14 56 9S86 11 98 8' stroke='%23FF4430' stroke-width='4.2' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") center/100% .6em no-repeat;padding:0 .08em;font-weight:700;white-space:nowrap}
.hz-copy p .ul{font-weight:700;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 16' preserveAspectRatio='none'%3E%3Cpath d='M3 9C40 4 80 13 118 8S176 5 197 9' stroke='%23171522' stroke-width='3' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") left bottom/100% .42em no-repeat;padding-bottom:.18em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.hz-copy .btn.hz-try{font-family:var(--hand);font-weight:800;font-size:clamp(1.3rem,1.75vw,1.8rem)}
.btn.sticker{background:var(--lime);color:var(--ink);border:2.5px solid var(--ink);border-radius:14px;font-family:var(--f-body);font-weight:800;font-size:1rem;padding:.55em 1.15em;box-shadow:4px 4px 0 var(--ink)}
.btn.sticker:hover{background:var(--lime);transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.btn.sticker:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}

.btn.hz-try{background:var(--white);color:var(--ink);border:3px solid var(--ink);border-radius:18px;font-weight:800;padding:.5em 1.35em .45em;letter-spacing:.005em;box-shadow:6px 6px 0 var(--ink);transition:transform .18s cubic-bezier(.3,1.6,.5,1),box-shadow .18s}
.btn.hz-try:hover{background:var(--white);transform:translate(-3px,-3px) rotate(-2deg);box-shadow:9px 9px 0 var(--ink)}
.btn.hz-try:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink)}

/* ===== HERO (responsive) =====
   panel = real box that grows with its text; cloud sits inside it (clipped by the rounded corners);
   the ink artwork is its own layer that spills below the panel. Both share one box, so they always line up. */
:root{--gut:clamp(10px,1.2vw,18px);--aw:clamp(400px,50cqw,1000px)}
.hero-z{position:relative;background:var(--paper);--hz-c:#777DF5;padding:var(--gut) var(--gut) calc(var(--aw) * 0.2005 + 6px)}
.hz-panel{position:relative;isolation:isolate;background:var(--hz-c);transition:background-color 1.4s ease;border-radius:clamp(20px,2.2vw,34px);overflow:hidden;
  min-height:calc(var(--aw) * 0.5441 + clamp(84px,7.5vw,128px));display:flex;flex-direction:column;
  padding:clamp(14px,1.8vw,28px) clamp(18px,3vw,52px) clamp(26px,3vw,52px);color:var(--ink)}
.hz-clouds{position:absolute;z-index:-1;right:0;bottom:0;width:var(--aw);aspect-ratio:1656/901;pointer-events:none}
.hz-art{position:absolute;z-index:2;right:var(--gut);bottom:6px;width:var(--aw);aspect-ratio:1656/1233;pointer-events:none}
.hz-clouds img,.hz-art img{position:absolute;inset:0;width:100%;height:100%;max-width:none;opacity:0;transition:opacity 1.4s ease}
.hz-clouds img.on,.hz-art img.on{opacity:1}
.hz-top{position:relative;z-index:4}
.hz-copy{position:relative;z-index:3;flex:1;display:grid;align-content:center;justify-items:start;gap:clamp(12px,1.3vw,20px);
  padding-top:clamp(16px,2vw,34px);width:100%;max-width:min(calc(100% + clamp(18px,3vw,52px) - var(--aw) * .96),720px)}
.hz-copy > *{max-width:100%}
.hz-menu{display:none;margin-left:auto;background:var(--white);border:2.5px solid var(--ink);color:var(--ink);border-radius:12px;padding:7px 15px;font-weight:800;font-family:var(--f-body);font-size:1rem;cursor:pointer;box-shadow:3px 3px 0 var(--ink)}
@media (max-width:899px){
  .hero-z{padding-bottom:calc((100% - 2 * var(--gut)) * 0.2005 + 6px)}
  .hz-panel{min-height:0;padding:clamp(14px,2.4vw,24px) clamp(18px,3.6vw,36px) calc((100vw - 2 * var(--gut)) * 0.5441 + 6px)}
  .hz-clouds{left:0;width:auto}
  .hz-art{left:var(--gut);width:auto}
  .hz-copy{max-width:100%;padding-top:clamp(22px,6vw,40px)}
  .hz-copy h1{font-size:clamp(2.4rem,11.5vw,5rem)}
  .hz-copy p{font-size:clamp(1rem,2.6vw,1.3rem);max-width:34em}
  .hz-copy .btn.hz-try{font-size:clamp(1.3rem,4.6vw,1.7rem)}
  .hz-art,.hz-clouds{width:auto}
  .hz-nav{display:none;position:absolute;left:0;right:0;top:calc(100% + 10px);z-index:9;flex-direction:column;align-items:stretch;background:var(--white);border:2.5px solid var(--ink);border-radius:18px;padding:10px;box-shadow:5px 5px 0 var(--ink)}
  .hz-nav.open{display:flex}
  .hz-nav a{color:var(--ink);font-size:1.05rem;padding:.7em 1em}
  .hz-nav a:hover{background:var(--wash)}
  .hz-menu{display:block}
}
@media (max-width:380px){.hz-top .logo{padding:7px 12px 6px}.hz-top .logo img{height:22px}}

/* highlighted menu item */
.nav-tour{display:inline-flex!important;align-items:center;gap:.35em;background:var(--red)!important;color:var(--white)!important;font-weight:800!important;border:2.5px solid var(--ink);border-radius:999px!important;padding:.38em .9em!important;box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg);text-decoration:none;white-space:nowrap;position:relative;transition:transform .15s,box-shadow .15s}
.nav-tour{transition:transform .15s,box-shadow .15s,background-color .8s ease,color .8s ease!important}
body[data-slide="1"] .nav-tour{background:var(--yellow)!important;color:var(--ink)!important}
body[data-slide="1"] .nav-tour .nt-star{color:var(--red)}
body[data-slide="2"] .nav-tour{background:#4A50C8!important}
body[data-slide="3"] .nav-tour{background:var(--ink)!important}
.nav-tour:hover{transform:rotate(0) translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.nav-tour .nt-star{color:var(--yellow);font-size:.95em;line-height:1;animation:ntspin 6s linear infinite;display:inline-block}
@keyframes ntspin{to{transform:rotate(360deg)}}
@media (max-width:899px){.hz-nav .nav-tour{justify-content:center;transform:none;margin:6px 0 0}}
@media (max-width:960px){nav.main .nav-tour{align-self:flex-start;transform:none;margin:6px 0 0}}
/* the global header hides on home until you scroll past the banner */
body.on-home header.top{position:fixed;left:0;right:0;transform:translateY(-110%);transition:transform .3s ease}
body.on-home.scrolled header.top{transform:none}
/* ===== playful menus: sticker bar, marker font, links that pop like little stickers ===== */
.hz-nav a,nav.main a{font-family:var(--hand)}
@media (min-width:900px){
  .hz-nav{background:var(--white);border:2.5px solid var(--ink);border-radius:999px;padding:5px 6px 5px 8px;box-shadow:4px 4px 0 var(--ink);transform:rotate(1deg);gap:2px}
  .hz-nav a{font-weight:700;transition:transform .22s cubic-bezier(.3,1.7,.5,1),background-color .18s,box-shadow .18s}
  .hz-nav a:not(.nav-tour):hover{transform:rotate(-5deg) translateY(-3px);box-shadow:inset 0 0 0 2px var(--ink),2px 2px 0 var(--ink)}
  .hz-nav a:not(.nav-tour):nth-child(odd):hover{background:var(--yellow)}
  .hz-nav a:not(.nav-tour):nth-child(even):hover{background:var(--lilac)}
  .hz-nav a.on,.hz-nav a.on:hover{background:var(--lime)!important;box-shadow:inset 0 0 0 2px var(--ink);transform:rotate(-2deg)}
  .hz-nav .nav-tour{margin-inline:6px 2px}
}
header.top{background:var(--white);border-bottom:2.5px solid var(--ink)}
header.top .brand{background:var(--white);border:2.5px solid var(--ink);border-radius:12px;padding:6px 12px 5px;box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg);transition:transform .2s}
header.top .brand:hover{transform:rotate(0) scale(1.03)}
header.top .brand img{height:24px}
@media (min-width:961px){
  nav.main a{font-weight:700;transition:transform .22s cubic-bezier(.3,1.7,.5,1),background-color .18s,box-shadow .18s}
  nav.main a:not(.nav-tour):hover{color:var(--ink);transform:rotate(-5deg) translateY(-2px);box-shadow:inset 0 0 0 2px var(--ink),2px 2px 0 var(--ink)}
  nav.main a:not(.nav-tour):nth-child(odd):hover{background:var(--yellow)}
  nav.main a:not(.nav-tour):nth-child(even):hover{background:var(--lilac)}
  nav.main a.on,nav.main a.on:hover{background:var(--lime);color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink);transform:rotate(-2deg)}
}
.menu-btn,.hz-menu{font-family:var(--hand);font-weight:700;border:2.5px solid var(--ink)!important;color:var(--ink)!important;background:var(--white);border-radius:12px;box-shadow:3px 3px 0 var(--ink);transform:rotate(2deg)}
.menu-btn[aria-expanded="true"],.hz-menu[aria-expanded="true"]{background:var(--lime)}
@media (max-width:960px){
  nav.main{border-bottom:2.5px solid var(--ink)!important;gap:4px}
  nav.main a{font-weight:700;border-radius:12px}
  nav.main a.on{background:var(--lime);color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
}
@media (max-width:899px){.hz-nav a{font-weight:700;border-radius:12px}.hz-nav a.on{background:var(--lime);box-shadow:inset 0 0 0 2px var(--ink)}}


.ribbon-band{background:var(--lime);color:var(--ink);overflow:hidden;position:relative}
.marquee .track{display:flex;width:max-content;animation:slide 46s linear infinite}
.marquee span{font-family:var(--f-head);font-weight:700;font-size:1.3rem;padding:16px 0;white-space:nowrap}
.marquee i{display:inline-block;width:.5em;height:.5em;margin:0 28px .05em;background:var(--red);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
@keyframes slide{to{transform:translateX(-50%)}}

.chapter{padding-block:100px}
.ch-head{display:grid;gap:14px;margin-bottom:44px;max-width:760px}
.ch-num{display:inline-flex;align-items:center;gap:12px;font-family:var(--f-note);font-weight:700;font-size:1.6rem;color:var(--plum);line-height:1}
.ch-num b{font-family:var(--f-head);font-weight:600;font-size:.95rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);background:var(--purple);border-radius:999px;padding:.35em .9em}

.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.plan{background:var(--white);border:1.5px dashed var(--lilac);border-radius:26px;padding:26px;display:grid;gap:10px;align-content:start;position:relative}
.plan .lbl{display:flex;justify-content:space-between;align-items:center;font-family:var(--f-head);font-weight:600;font-size:1.3rem}
.plan .verdict{font-family:var(--f-note);font-weight:700;font-size:1.35rem;line-height:1}
.plan p{color:var(--soft)}
.plan.no .lbl span:first-child{color:#9A8CAF;text-decoration:line-through;text-decoration-color:var(--purple);text-decoration-thickness:2px}
.plan.no .verdict{color:var(--red)}
.plan.no:nth-child(1){transform:rotate(-1.2deg)}.plan.no:nth-child(2){transform:rotate(.8deg)}.plan.no:nth-child(3){transform:rotate(-.6deg)}
.plan.yes{background:var(--purple);border:0;transform:rotate(1deg);box-shadow:0 22px 40px -26px rgba(42,23,64,.9)}
.plan.yes .lbl{color:var(--ink)}
.plan.yes .lbl span:first-child{display:flex;align-items:center;gap:10px}
.plan.yes .lbl img{width:30px;height:30px;border-radius:9px;background:var(--white);padding:2px}
.plan.yes p{color:var(--on-dark)}
.plan.yes .verdict{color:var(--ink)}
.plan-link{color:var(--ink);font-weight:800;text-decoration:none;margin-top:6px}
.plan-link:hover{text-decoration:underline}
@media (max-width:900px){.plans{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.plans{grid-template-columns:1fr}.plan{transform:none!important}}

.enter{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(36px,6vw,90px);align-items:center}
.polaroid{background:var(--white);padding:16px 16px 58px;border-radius:6px;box-shadow:0 24px 50px -28px rgba(42,23,64,.55);transform:rotate(-3deg);position:relative;max-width:460px;justify-self:center;width:100%}
.polaroid img{width:100%;height:auto;border-radius:3px}
.polaroid .cap{position:absolute;left:0;right:0;bottom:14px;text-align:center;font-family:var(--f-note);font-weight:700;font-size:1.5rem;color:var(--ink)}
.polaroid .tape{position:absolute;top:-14px;left:50%;width:120px;height:30px;background:rgba(220,203,245,.8);transform:translateX(-50%) rotate(3deg)}
.polaroid .sticker{position:absolute;right:-22px;bottom:70px;width:96px;height:96px;border-radius:50%;background:var(--red);color:var(--white);display:grid;place-items:center;text-align:center;font-family:var(--f-head);font-weight:600;font-size:.86rem;line-height:1.15;transform:rotate(12deg);box-shadow:0 10px 20px -12px rgba(42,23,64,.7)}
.polaroid .sticker i{position:absolute;right:16px;bottom:16px;width:12px;height:12px;background:var(--yellow);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
.enter .story{display:grid;gap:18px}
.enter .story p{color:var(--soft);font-size:1.12rem;max-width:36em}
.cozy-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:16px}
.cozy-list li{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start}
.cozy-list .ic{width:52px;height:52px;border-radius:18px;background:var(--white);display:grid;place-items:center;color:var(--purple)}
.cozy-list .ic svg{width:28px;height:28px}
.cozy-list b{display:block;font-family:var(--f-head);font-weight:600;font-size:1.15rem}
.cozy-list span{color:var(--soft)}
@media (max-width:860px){.enter{grid-template-columns:1fr}.polaroid{max-width:340px}.polaroid .sticker{right:6px;width:84px;height:84px;font-size:.78rem}}

.shelf-teaser{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,40px)}
.teaser{appearance:none;border:0;background:none;padding:0;text-align:left;font:inherit;color:inherit;cursor:pointer;display:grid;gap:12px;text-decoration:none}
.teaser .ph{border-radius:26px;overflow:hidden;aspect-ratio:4/5;max-width:100%;background:var(--wash)}
.teaser .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.3,1,.4,1)}
.teaser:hover .ph img{transform:scale(1.05) rotate(-1deg)}
.teaser b{font-family:var(--f-head);font-weight:600;font-size:1.3rem}
.teaser span{color:var(--soft)}
.teaser:nth-child(2){margin-top:44px}
.teaser-foot{margin-top:40px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
@media (max-width:860px){.shelf-teaser{grid-template-columns:1fr 1fr}.teaser:nth-child(2){margin-top:0}.teaser:nth-child(3){display:none}}
@media (max-width:480px){.shelf-teaser{grid-template-columns:1fr}.teaser:nth-child(3){display:grid}}

.the-end{background:var(--wash);border-radius:40px;padding:clamp(40px,6vw,80px) clamp(24px,5vw,72px);display:grid;justify-items:center;text-align:center;gap:18px;position:relative;overflow:hidden}
.the-end .zbig{width:96px;height:96px;animation:bob 4s ease-in-out infinite}
.the-end h2{font-size:clamp(2rem,4vw,3.2rem);max-width:16em}
.the-end .lead{max-width:32em;text-align:center}
.the-end .actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.the-end .doodle{position:absolute;color:var(--lilac);width:120px;height:120px}
.the-end .d1{left:5%;top:14%;transform:rotate(-12deg)}
.the-end .d2{right:6%;bottom:12%;transform:rotate(10deg)}
@keyframes bob{50%{translate:0 -8px}}
@media (max-width:700px){.the-end .doodle{display:none}}

.pkgs{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:stretch}
.served{font-family:var(--f-note);font-weight:700;font-size:1.3rem;color:var(--plum);line-height:1;margin-bottom:-4px}
.pkg{background:var(--white);border:1.5px dashed var(--lilac);border-radius:28px;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.pkg:hover{transform:translateY(-5px);box-shadow:0 24px 44px -30px rgba(42,23,64,.55)}
.pkg .shot{aspect-ratio:10/7;max-width:100%;background:var(--wash)}
.pkg .shot img{width:100%;height:100%;object-fit:cover}
.pkg .body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:12px;flex:1}
.pkg .top{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:24px}
.pkg .what{font-weight:800;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--plum)}
.pkg h3{font-size:1.5rem}
.pkg .desc{color:var(--soft);font-size:.97rem}
.pkg ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:.94rem}
.pkg li{display:flex;gap:10px;align-items:flex-start}
.pkg li::before{content:"";flex:none;width:7px;height:7px;margin-top:9px;background:var(--purple);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
.pkg .price{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);display:grid;gap:2px}
.pkg .price small{color:var(--soft);font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}
.pkg .price b{font-family:var(--f-head);font-weight:700;letter-spacing:-.03em;font-size:1.75rem;color:var(--purple);font-variant-numeric:tabular-nums;line-height:1.1}
.pkg .price b span{font-family:var(--f-body);font-size:.9rem;font-weight:700;letter-spacing:0;color:var(--soft);margin-left:6px}
.pkg .btn{justify-content:center}
.pkg.star{background:var(--purple);border-color:var(--purple);color:var(--ink)}
.pkg.star h3,.pkg.star .price b{color:var(--ink)}
.pkg.star .what,.pkg.star .desc,.pkg.star .price small,.pkg.star .price b span{color:var(--on-dark)}
.pkg.star .price{border-color:rgba(255,255,255,.25)}
.pkg.star li::before{background:var(--lime)}
.pkg.star .btn{background:var(--white);color:var(--ink);border-color:var(--white)}
.pkg.star .btn:hover{background:var(--wash)}
.badge{background:var(--yellow);color:var(--ink);font-weight:800;font-size:.72rem;letter-spacing:.04em;padding:.3em .8em;border-radius:999px;white-space:nowrap}
.pkg-note{margin-top:28px;color:var(--soft)}
.pkg-note a{color:var(--purple);font-weight:700}
@media (max-width:1080px){.pkgs{grid-template-columns:1fr 1fr}}
@media (max-width:580px){.pkgs{grid-template-columns:1fr}}

.cta-band{background:var(--wash);border-radius:32px;padding:56px 52px;display:grid;grid-template-columns:auto 1fr auto;gap:32px;align-items:center}
.cta-band > *{min-width:0}
.cta-band .zbig{width:110px;height:110px;animation:bob 4s ease-in-out infinite}
.cta-band .copy{display:grid;gap:10px}
.cta-band .actions{display:flex;gap:12px;flex-wrap:wrap}
@keyframes bob{50%{translate:0 -8px}}
@media (max-width:900px){.cta-band{grid-template-columns:auto 1fr}.cta-band .actions{grid-column:1/-1}}
@media (max-width:560px){.cta-band{grid-template-columns:1fr;padding:36px 24px}.cta-band .zbig{width:76px;height:76px}}

.plan-link{color:var(--ink);font-weight:800;text-decoration:none;margin-top:6px}
.plan-link:hover{text-decoration:underline}
.or-row{display:flex;align-items:center;gap:18px;margin:48px 0 26px}
.or-row .note{font-size:1.6rem}
.or-row::before,.or-row::after{content:"";flex:1;border-top:2px dashed var(--lilac)}
.pkgs{grid-template-columns:repeat(3,1fr)!important;gap:22px}
.pkg-wide{display:grid;grid-template-columns:1.05fr 1fr;background:var(--purple);color:var(--ink);border-radius:36px;overflow:hidden;box-shadow:0 30px 60px -36px rgba(42,23,64,.9)}
.pkg-wide > *{min-width:0}
.pkg-wide .shot{background:linear-gradient(#FBF8FD 50%,#F4EEFB 50%);display:grid;place-items:center;min-height:100%}
.pkg-wide .shot img{width:100%;height:auto;max-height:100%;object-fit:contain}
.pkg-wide .body{padding:clamp(28px,4vw,56px);display:grid;gap:16px;align-content:center}
.pkg-wide .top{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pkg-wide .what{font-weight:800;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--on-dark)}
.pkg-wide h3{color:var(--ink);font-size:clamp(1.8rem,3vw,2.6rem)}
.pkg-wide .desc{color:var(--on-dark);font-size:1.1rem;max-width:34em}
.pkg-wide ul{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 26px}
.pkg-wide li{display:flex;gap:10px}
.pkg-wide li::before{content:"";flex:none;width:8px;height:8px;margin-top:9px;background:var(--lime);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
.pkg-wide .buy{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:10px;padding-top:20px;border-top:1px solid rgba(255,255,255,.25)}
.pkg-wide .price small{display:block;color:var(--on-dark);font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}
.pkg-wide .price b{font-family:var(--f-head);font-weight:700;letter-spacing:-.03em;font-size:2.4rem;line-height:1.1}
.pkg-wide .price b span{font-family:var(--f-body);font-size:.95rem;font-weight:700;letter-spacing:0;color:var(--on-dark);margin-left:8px}
.pkg-wide .btn{background:var(--white);color:var(--ink);border-color:var(--white)}
.pkg-wide .btn:hover{background:var(--wash)}
@media (max-width:980px){.pkg-wide{grid-template-columns:1fr}.pkg-wide .shot{aspect-ratio:10/7}}
@media (max-width:560px){.pkg-wide ul{grid-template-columns:1fr}}
@media (max-width:1000px){.pkgs{grid-template-columns:1fr 1fr!important}}
@media (max-width:620px){.pkgs{grid-template-columns:1fr!important}.or-row{justify-content:center;text-align:center}.or-row::before,.or-row::after{display:none}}
.extras{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.extras div{background:var(--white);border:1.5px dashed var(--lilac);border-radius:24px;padding:22px;display:grid;gap:6px;align-content:start}
.extras b{font-family:var(--f-head);font-weight:600;font-size:1.15rem}
.extras span{color:var(--soft);font-size:.96rem}
.extras em{font-style:normal;font-family:var(--f-head);font-weight:700;color:var(--purple);font-size:1.3rem;margin-top:6px}
@media (max-width:1000px){.extras{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.extras{grid-template-columns:1fr}}
.pay-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;background:var(--wash);border-radius:26px;padding:30px}
.pay-row div{display:grid;gap:4px}
.pay-row b{font-weight:800}
.pay-row span{color:var(--soft)}
@media (max-width:760px){.pay-row{grid-template-columns:1fr}}
.cta-band{grid-template-columns:auto 1fr auto}


/* ===== CHAPTER ONE: the plot so far ===== */
.c1{position:relative;background:var(--lime);background-image:radial-gradient(rgba(23,21,34,.16) 1.3px,transparent 1.4px);background-size:22px 22px;margin-block:clamp(26px,3vw,44px) clamp(40px,5vw,72px);
  --hand:"Shantell Sans","Kalam","Comic Sans MS",cursive;--brush:"Caveat Brush","Kalam","Segoe Print",cursive;font-family:var(--hand);scroll-margin-top:60px}
.c1-wave{position:absolute;left:0;width:100%;height:clamp(18px,2.4vw,36px);display:block;fill:var(--lime)}
.c1-wave-t{bottom:calc(100% - 1px)}
.c1-wave-b{top:calc(100% - 1px)}
.c1-in{padding-block:clamp(48px,6vw,96px) clamp(52px,6vw,96px)}
.c1-head{display:grid;justify-items:center;text-align:center;gap:10px;max-width:1240px;margin:0 auto clamp(30px,4vw,56px)}
.c1-chip{font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;background:var(--white);border:2.5px solid var(--ink);border-radius:999px;padding:.3em .9em;box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg)}
.c1-kicker{font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.8rem);line-height:1;transform:rotate(-2deg);margin-top:4px}
.c1-head h2{font-family:var(--hand);font-weight:800;font-size:clamp(2rem,3.3vw,3.5rem);line-height:1.1;letter-spacing:-.015em;margin:0;text-wrap:balance}
@media (min-width:1100px){.c1-head h2{text-wrap:nowrap;white-space:nowrap}}
.hl-w{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 60' preserveAspectRatio='none'%3E%3Cpath d='M7 17C38 9 92 7 196 11c2 0 3 2 2 4l-3 34c0 2-2 3-4 3C126 55 64 56 6 51c-3 0-5-3-4-6l1-24c0-2 2-4 4-4z' fill='%23FFFFFF'/%3E%3C/svg%3E") center/100% 100% no-repeat;padding:0 .14em .04em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.c1-head p{margin:0;font-size:clamp(1.02rem,1.25vw,1.2rem);line-height:1.6;font-weight:500;max-width:46em;text-wrap:pretty}
.c1-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2vw,28px);align-items:stretch}
.c1-card{position:relative;background:var(--white);border:2.5px solid var(--ink);border-radius:18px;padding:clamp(20px,1.9vw,28px) clamp(18px,1.7vw,24px) clamp(18px,1.6vw,22px);
  box-shadow:6px 6px 0 var(--ink);transform:rotate(var(--r));display:flex;flex-direction:column;gap:10px;transition:transform .25s,box-shadow .25s}
.c1-card:hover{transform:rotate(0) translateY(-4px);box-shadow:8px 10px 0 var(--ink)}
.c1-card.no{background-image:repeating-linear-gradient(transparent 0 29px,rgba(127,134,245,.22) 29px 30px);background-position:0 54px}
.c1-tape{position:absolute;top:-13px;left:50%;width:84px;height:24px;background:rgba(255,255,255,.75);border:1px solid rgba(23,21,34,.12);transform:translateX(-50%) rotate(-4deg)}
.c1-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.c1-plan{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:1.05rem}
.c1-card.no .c1-plan{text-decoration:line-through;text-decoration-thickness:2.5px;text-decoration-color:var(--red);color:#6D6880}
.c1-plan img{width:28px;height:28px;background:var(--white);border:2px solid var(--ink);border-radius:8px;padding:1px}
.c1-stamp{font-weight:800;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red);border:2.5px solid var(--red);border-radius:8px;padding:.2em .55em .15em;transform:rotate(-8deg);opacity:.92;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.4)}
.c1-card h3{font-family:var(--hand);font-weight:800;font-size:clamp(1.25rem,1.5vw,1.5rem);line-height:1.15;margin:4px 0 0}
.c1-card p{margin:0;font-size:clamp(.98rem,1.05vw,1.06rem);line-height:1.55;color:#36324A;flex:1}
.c1-receipt{margin:6px 0 0;padding-top:12px;border-top:2px dashed rgba(23,21,34,.25);display:grid;gap:6px}
.c1-receipt div{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.c1-receipt dt{font-family:var(--brush);font-size:1.15rem;line-height:1;color:var(--soft);white-space:nowrap;flex:none}
.c1-receipt dd{margin:0;font-weight:700;font-size:.92rem;text-align:right}
.c1-card.yes{background:var(--purple);box-shadow:6px 6px 0 var(--ink)}
.c1-card.yes p{color:var(--ink)}
.c1-card.yes .c1-receipt{border-top-color:rgba(23,21,34,.35)}
.c1-card.yes .c1-receipt dt{color:var(--ink)}
.c1-card.yes .c1-stamp{color:var(--ink);background:var(--yellow);border-color:var(--ink);transform:rotate(-8deg) scale(1.08);font-size:.9rem}
.c1-twist{position:absolute;top:-16px;right:14px;font-family:var(--brush);font-size:clamp(1.7rem,2.2vw,2.2rem);line-height:1;background:var(--yellow);border:2.5px solid var(--ink);border-radius:12px;padding:.14em .55em .06em;transform:rotate(5deg);box-shadow:3px 3px 0 var(--ink);white-space:nowrap}
.c1-card.yes .c1-top{min-height:2.6rem}
.c1-link{align-self:flex-start;margin-top:6px;background:var(--white);color:var(--ink);text-decoration:none;font-weight:800;font-size:.98rem;border:2.5px solid var(--ink);border-radius:12px;padding:.45em .9em;box-shadow:3px 3px 0 var(--ink);transition:transform .15s,box-shadow .15s}
.c1-link:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.c1-foot{text-align:center;margin:clamp(30px,4vw,54px) 0 0;font-size:clamp(1.02rem,1.25vw,1.2rem);font-weight:600}
.c1-foot span{font-family:var(--brush);font-size:1.3em;margin-right:.2em}
.c1-foot a{color:var(--ink);font-weight:800;text-decoration-thickness:2.5px;text-underline-offset:4px;text-decoration-color:var(--red)}
@media (max-width:1180px){.c1-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px}}
@media (max-width:620px){.c1-cards{grid-template-columns:1fr;gap:34px}.c1-card{transform:rotate(calc(var(--r) * .5))}}
@media (prefers-reduced-motion:reduce){.nav-tour .nt-star{animation:none}}

/* ===== CHAPTER TWO: the vibe board ===== */
.c2{position:relative;background:var(--purple);background-image:linear-gradient(rgba(255,255,255,.12) 1.5px,transparent 1.5px),linear-gradient(90deg,rgba(255,255,255,.12) 1.5px,transparent 1.5px);background-size:44px 44px;
  margin-block:clamp(44px,5vw,80px);overflow-x:clip;scroll-margin-top:60px;
  --hand:"Shantell Sans","Kalam","Comic Sans MS",cursive;--brush:"Caveat Brush","Kalam","Segoe Print",cursive;font-family:var(--hand)}
.c2-wave{position:absolute;left:0;width:100%;height:clamp(18px,2.4vw,36px);display:block;fill:var(--purple)}
.c2-wave-t{bottom:calc(100% - 1px)}
.c2-wave-b{top:calc(100% - 1px)}
.c2-in{position:relative;z-index:1;padding-block:clamp(52px,6vw,100px) clamp(56px,6vw,100px)}
.c2-head{display:grid;justify-items:center;text-align:center;gap:10px;max-width:1100px;margin:0 auto clamp(40px,5vw,72px)}
.c2-chip{font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;background:var(--white);border:2.5px solid var(--ink);border-radius:999px;padding:.3em .9em;box-shadow:3px 3px 0 var(--ink);transform:rotate(2deg)}
.c2-kicker{font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.8rem);line-height:1;transform:rotate(-2deg);margin-top:4px}
.c2-head h2{font-family:var(--hand);font-weight:800;font-size:clamp(2.1rem,4vw,4rem);line-height:1.1;letter-spacing:-.015em;margin:0;text-wrap:balance}
.circ{position:relative;display:inline-block;padding:0 .1em;margin-left:.12em}
.circ svg{position:absolute;left:-6%;top:-20%;width:114%;height:146%;fill:none;stroke:var(--red);stroke-width:5;stroke-linecap:round;pointer-events:none;overflow:visible}
.c2-head p{margin:0;font-size:clamp(1.02rem,1.25vw,1.2rem);line-height:1.6;font-weight:500;max-width:44em;text-wrap:pretty}
.c2-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,64px);align-items:start}
.c2-item{position:relative;display:flex;flex-direction:column;gap:10px}
.c2-pola{position:relative;margin:0 0 8px;background:var(--white);padding:12px 12px 30px;border:2.5px solid var(--ink);border-radius:6px;box-shadow:7px 7px 0 var(--ink);transform:rotate(var(--r));transition:transform .3s cubic-bezier(.3,1.5,.5,1),box-shadow .3s}
.c2-item:hover .c2-pola{transform:rotate(0) translateY(-6px) scale(1.02);box-shadow:10px 12px 0 var(--ink)}
.c2-pola img{display:block;width:100%;height:auto;aspect-ratio:10/7;object-fit:cover;border-radius:2px;background:var(--wash)}
.ch-eyebrow{display:none!important;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 14px}.ch-eyebrow>span{margin-top:0}
.c1-kicker{color:var(--plum)}.c2-kicker{color:var(--white);text-shadow:2px 2px 0 rgba(23,21,34,.35)}
.c2-tape{position:absolute;top:-14px;left:50%;width:96px;height:26px;background:rgba(255,212,0,.82);border:1px solid rgba(23,21,34,.15);transform:translateX(-50%) rotate(-5deg);z-index:2}
.c2-item:nth-child(2) .c2-tape{background:rgba(160,228,93,.88);transform:translateX(-50%) rotate(4deg)}
.c2-item:nth-child(3) .c2-tape{background:rgba(255,255,255,.85)}
.c2-item h3{font-family:var(--hand);font-weight:800;font-size:clamp(1.35rem,1.8vw,1.8rem);line-height:1.12;margin:0}
.c2-item p{margin:0;font-size:clamp(1rem,1.1vw,1.1rem);line-height:1.55;font-weight:500;max-width:30em}
.c2-note{align-self:flex-end;margin-top:4px;font-family:var(--brush);font-size:clamp(1.2rem,1.5vw,1.5rem);line-height:1.05;padding:.5em .75em .4em;border:2.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);transform:rotate(var(--nr));max-width:100%}
.n-yellow{background:var(--yellow)}.n-lime{background:var(--lime)}.n-red{background:var(--red);color:var(--white)}
.c2-cta{margin-top:clamp(52px,6vw,96px);display:flex;flex-direction:column;align-items:center;gap:6px}
.c2-hint{display:inline-flex;align-items:flex-end;gap:4px;font-family:var(--brush);font-size:clamp(1.35rem,1.8vw,1.8rem);line-height:1;transform:rotate(-3deg) translateX(-24%)}
.c2-hint svg{width:2.4em;height:1.5em;transform:translateY(.5em)}
.c2-ticket{--tk:var(--yellow);position:relative;display:inline-flex;align-items:stretch;text-decoration:none;color:var(--ink);filter:drop-shadow(6px 6px 0 var(--ink));transform:rotate(-2deg);transition:transform .25s cubic-bezier(.3,1.6,.5,1),filter .25s}
.c2-ticket:hover{transform:rotate(1deg) scale(1.04);filter:drop-shadow(9px 9px 0 var(--ink))}
.c2-ticket > span{background:var(--tk);border:3px solid var(--ink);display:flex;flex-direction:column;justify-content:center}
.tk-stub{align-items:center;gap:4px;padding:14px 16px;border-radius:16px 0 0 16px;border-right:none!important;background:var(--white)!important;
  -webkit-mask:radial-gradient(circle 11px at 100% 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 11px at 100% 100%,#0000 98%,#000) bottom/100% 51% no-repeat;
          mask:radial-gradient(circle 11px at 100% 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 11px at 100% 100%,#0000 98%,#000) bottom/100% 51% no-repeat;transition:transform .3s cubic-bezier(.3,1.6,.5,1);transform-origin:right bottom}
.tk-stub img{width:clamp(34px,3vw,46px);height:auto}
.tk-stub em{font-style:normal;font-family:var(--brush);font-size:1rem;line-height:1;white-space:nowrap}
.c2-ticket:hover .tk-stub{transform:rotate(-6deg)}
.tk-main{position:relative;padding:14px clamp(22px,2.6vw,38px) 14px clamp(20px,2.2vw,32px);border-radius:0 16px 16px 0;border-left:3px dashed var(--ink)!important;text-align:left;
  -webkit-mask:radial-gradient(circle 11px at 0 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 11px at 0 100%,#0000 98%,#000) bottom/100% 51% no-repeat;
          mask:radial-gradient(circle 11px at 0 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 11px at 0 100%,#0000 98%,#000) bottom/100% 51% no-repeat}
.tk-main small{font-family:var(--brush);font-size:clamp(1.1rem,1.4vw,1.4rem);line-height:1}
.tk-main b{font-weight:800;font-size:clamp(1.6rem,2.6vw,2.6rem);line-height:1.05;letter-spacing:-.01em;white-space:nowrap}
@media (max-width:640px){.c2-hint{transform:rotate(-3deg)}.tk-main b{font-size:1.5rem}}
.c2-doodles{position:absolute;inset:0;pointer-events:none;z-index:0}
.dd{position:absolute;display:block}
.dd svg{width:100%;height:100%;display:block}
.dd.s1{width:46px;height:46px;left:6%;top:9%;fill:var(--yellow);stroke:var(--ink);stroke-width:2.5;animation:ddspin 14s linear infinite}
.dd.s2{width:30px;height:30px;right:9%;top:16%;fill:var(--white);stroke:var(--ink);stroke-width:2.5;animation:ddspin 10s linear infinite reverse}
.dd.h1{width:38px;height:38px;right:5%;bottom:20%;fill:var(--red);stroke:var(--ink);stroke-width:2.5;animation:ddbob 3.2s ease-in-out infinite}
.dd.q1{width:110px;height:36px;left:3%;bottom:14%;stroke:var(--yellow)}
.dd.q2{width:90px;height:30px;right:14%;top:5%;stroke:var(--white);opacity:.8}
.dd.sp{width:34px;height:34px;left:16%;top:30%;stroke:var(--white);animation:ddbob 2.6s ease-in-out infinite}
@keyframes ddspin{to{transform:rotate(360deg)}}
@keyframes ddbob{50%{transform:translateY(-8px) rotate(6deg)}}
@media (max-width:1000px){.c2-board{grid-template-columns:repeat(2,minmax(0,1fr))}.c2-item:nth-child(3){grid-column:1/-1;max-width:calc(50% - clamp(14px,2vw,32px));justify-self:center;width:100%}.dd.q1{display:none}}
@media (max-width:640px){.c2-board{grid-template-columns:1fr;gap:44px}.c2-item:nth-child(3){max-width:none}.dd.sp,.dd.q2,.dd.h1{display:none}.dd.s1{left:3%;top:3%}}
@media (prefers-reduced-motion:reduce){.dd{animation:none!important}}
/* ===== CHAPTER THREE: the bookshop window ===== */
.c3{position:relative;background-color:var(--yellow);background-image:repeating-conic-gradient(from -90deg at 50% 115%,rgba(255,255,255,.24) 0 5deg,transparent 5deg 10deg);
  margin-block:clamp(44px,5vw,80px);overflow-x:clip;scroll-margin-top:60px;
  --hand:"Shantell Sans","Kalam","Comic Sans MS",cursive;--brush:"Caveat Brush","Kalam","Segoe Print",cursive;font-family:var(--hand)}
.c3-wave{position:absolute;left:0;width:100%;height:clamp(18px,2.4vw,36px);display:block;fill:var(--yellow)}
.c3-wave-t{bottom:calc(100% - 1px)}
.c3-wave-b{top:calc(100% - 1px)}
.c3-in{position:relative;z-index:1;padding-block:clamp(52px,6vw,100px) clamp(64px,7vw,110px)}
.c3-head{display:grid;justify-items:center;text-align:center;gap:10px;max-width:1100px;margin:0 auto clamp(40px,5vw,64px)}
.c3-chip{font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;background:var(--white);border:2.5px solid var(--ink);border-radius:999px;padding:.3em .9em;box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg)}
.c3-kicker{font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.8rem);line-height:1;transform:rotate(-2deg);color:var(--ink)}
.c3-head h2{font-family:var(--hand);font-weight:800;font-size:clamp(2.1rem,4vw,4rem);line-height:1.15;letter-spacing:-.015em;margin:0;text-wrap:balance}
.c3-z{display:inline-block;background:var(--red);color:var(--white);border:3px solid var(--ink);border-radius:14px;padding:0 .28em .04em;box-shadow:5px 5px 0 var(--ink);transform:rotate(-3deg);white-space:nowrap;margin-left:.08em}
.c3-head p{margin:0;font-size:clamp(1.02rem,1.25vw,1.2rem);line-height:1.6;font-weight:500;max-width:44em;text-wrap:pretty}
/* the shop */
.c3-shop{position:relative;max-width:1240px;margin:0 auto;padding-top:34px}
.c3-sign{position:absolute;top:0;left:50%;transform:translateX(-50%) rotate(-2deg);z-index:3;background:var(--white);border:3px solid var(--ink);border-radius:12px;box-shadow:4px 4px 0 var(--ink);padding:.2em 1em .15em;white-space:nowrap}
.c3-sign span{font-family:var(--brush);font-size:clamp(1.5rem,2.2vw,2.2rem);line-height:1.1}
.c3-awning{position:relative;z-index:2;height:clamp(44px,5vw,64px);border:3px solid var(--ink);border-bottom:0;border-radius:18px 18px 0 0;
  background:repeating-linear-gradient(90deg,var(--red) 0 50px,var(--white) 50px 100px);background-position:center top;box-shadow:10px 0 0 var(--ink)}
.c3-scallop{position:absolute;top:100%;left:-3px;right:-3px;height:28px;
  background:radial-gradient(circle at 25px 0,var(--red) 22px,var(--ink) 22.5px 25px,transparent 25.5px),radial-gradient(circle at 75px 0,var(--white) 22px,var(--ink) 22.5px 25px,transparent 25.5px);
  background-size:100px 28px;background-repeat:repeat-x;background-position:center top}
.c3-awning::after{content:"";position:absolute;left:-3px;right:-3px;bottom:0;height:3px;background:var(--ink)}
.c3-window{position:relative;background:var(--white);border:3px solid var(--ink);border-top:0;border-radius:0 0 26px 26px;box-shadow:10px 10px 0 var(--ink);
  padding:clamp(70px,7vw,96px) clamp(18px,3vw,44px) 0;
  background-image:linear-gradient(115deg,transparent 0 62%,rgba(127,134,245,.08) 62% 70%,transparent 70% 74%,rgba(127,134,245,.08) 74% 76%,transparent 76%)}
.c3-peek{position:absolute;top:clamp(36px,3.6vw,48px);right:clamp(20px,4vw,60px);display:inline-flex;align-items:flex-start;gap:2px;font-family:var(--brush);font-size:clamp(1.2rem,1.5vw,1.5rem);line-height:1;color:var(--plum);transform:rotate(-2deg)}
.c3-peek svg{width:2.2em;height:1.5em;margin-top:.3em}
/* shelf: the books stand on planks made from each item, so rows always line up */
.c3-shelf{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:auto;row-gap:0}
.c3-book{position:relative;display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:0;justify-items:center;text-decoration:none;color:var(--ink);padding:0 clamp(8px,1.2vw,18px)}
.c3-book::before{content:"";grid-row:2;justify-self:stretch;margin-inline:calc(-1 * clamp(8px,1.2vw,18px));height:16px;background:var(--purple);border-block:3px solid var(--ink);position:relative;z-index:1}
.c3-book:first-child::before,.c3-book.row-start::before{border-left:3px solid var(--ink);border-radius:6px 0 0 6px}
.bk{grid-row:1;align-self:end;position:relative;display:block;width:min(100%,170px);margin-top:28px;transform-origin:50% 100%;transform:rotate(var(--r)) scale(var(--h));transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.bk img{display:block;width:100%;height:auto;aspect-ratio:464/672;object-fit:cover;border:2.5px solid var(--ink);border-radius:3px 9px 9px 3px;box-shadow:6px 0 0 var(--ink);background:var(--wash)}
.bk::after{content:"";position:absolute;inset:2.5px auto 2.5px 2.5px;width:14%;background:linear-gradient(90deg,rgba(0,0,0,.22),rgba(255,255,255,.12) 55%,transparent);border-radius:2px 0 0 2px;pointer-events:none}
.bk-ribbon{position:absolute;top:-4px;right:18%;width:14px;height:22px;background:var(--red);border:2px solid var(--ink);border-top:0;clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%);transform:translateY(0);transition:height .3s,transform .3s;z-index:2}
.c3-book:hover .bk,.c3-book:focus-visible .bk{transform:rotate(0) scale(var(--h)) translateY(-18px)}
.c3-book:hover .bk-ribbon,.c3-book:focus-visible .bk-ribbon{height:44px}
.bk-badge{position:absolute;z-index:3;top:-14px;left:-12px;font-family:var(--brush);font-size:clamp(1rem,1.2vw,1.2rem);line-height:1;white-space:nowrap;border:2.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:.3em .55em .2em;border-radius:999px;transform:rotate(-10deg)}
.bk-pick{background:var(--red);color:var(--white)}
.bk-new{background:var(--lime);transform:rotate(8deg);left:auto;right:-14px}
.bk-talker{grid-row:3;align-self:start;position:relative;margin:14px 0 clamp(40px,4vw,56px);width:100%;max-width:190px;background:var(--white);border:2.5px solid var(--ink);border-radius:4px;box-shadow:3px 3px 0 var(--ink);padding:.55em .65em .6em;text-align:center;transform:rotate(calc(var(--r) * -1.2));display:grid;gap:3px;transition:transform .3s}
.bk-talker::before{content:"";position:absolute;top:-12px;left:50%;width:10px;height:12px;background:var(--ink);transform:translateX(-50%);border-radius:2px}
.bk-talker b{font-weight:800;font-size:clamp(.9rem,1vw,1rem);line-height:1.15}
.bk-talker em{font-style:normal;font-family:var(--brush);font-size:clamp(1rem,1.15vw,1.15rem);line-height:1.1;color:var(--soft)}
.c3-book:hover .bk-talker{transform:rotate(0)}
/* the open sign */
.c3-cta{display:flex;justify-content:center;margin-top:clamp(40px,5vw,70px)}
.c3-open{display:inline-flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--ink);transform-origin:50% 0;animation:c3swing 5s ease-in-out infinite}
.op-strings{width:clamp(150px,14vw,200px);height:44px;display:block;margin-bottom:-3px}
.op-board{display:flex;flex-direction:column;align-items:center;background:var(--red);color:var(--white);border:3px solid var(--ink);border-radius:18px;box-shadow:6px 6px 0 var(--ink);padding:12px clamp(26px,3vw,40px) 0;overflow:hidden;transition:box-shadow .2s}
.op-board small{font-family:var(--brush);font-size:clamp(1.15rem,1.4vw,1.4rem);line-height:1}
.op-board b{font-weight:800;font-size:clamp(2.6rem,4.4vw,4rem);line-height:1;letter-spacing:.02em;text-transform:uppercase;margin:2px 0 10px}
.op-strip{align-self:stretch;margin-inline:calc(-1 * clamp(26px,3vw,40px));background:var(--white);color:var(--ink);border-top:3px solid var(--ink);text-align:center;font-weight:800;font-size:clamp(.95rem,1.1vw,1.08rem);padding:.45em 1em}
.c3-open:hover{animation:c3wiggle .6s ease-in-out}
.c3-open:hover .op-board{box-shadow:9px 9px 0 var(--ink)}
@keyframes c3swing{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@keyframes c3wiggle{0%{transform:rotate(-2deg)}25%{transform:rotate(7deg)}50%{transform:rotate(-5deg)}75%{transform:rotate(3deg)}100%{transform:rotate(0)}}
/* doodles */
.c3-doodles{position:absolute;inset:0;pointer-events:none;z-index:0}
.d3{position:absolute;display:block}.d3 svg{width:100%;height:100%;display:block}
.d3.t1{width:44px;height:44px;left:7%;top:7%;fill:var(--red);stroke:var(--ink);stroke-width:2.5;animation:ddspin 16s linear infinite}
.d3.t2{width:30px;height:30px;right:8%;top:12%;fill:var(--white);stroke:var(--ink);stroke-width:2.5;animation:ddspin 11s linear infinite reverse}
.d3.sp1{width:34px;height:34px;right:16%;top:22%;stroke:var(--ink);animation:ddbob 2.8s ease-in-out infinite}
.d3.sp2{width:30px;height:30px;left:10%;bottom:9%;stroke:var(--red);animation:ddbob 3.4s ease-in-out infinite}
@media (max-width:1060px){.c3-shelf{grid-template-columns:repeat(3,minmax(0,1fr))}.c3-book:nth-child(3n+1)::before{border-left:3px solid var(--ink);border-radius:6px 0 0 6px}.c3-book:nth-child(3n)::before{border-right:3px solid var(--ink);border-radius:0 6px 6px 0}.bk{width:min(100%,180px)}}
@media (min-width:1061px){.c3-book:nth-child(6)::before{border-right:3px solid var(--ink);border-radius:0 6px 6px 0}}
@media (max-width:640px){.c3-shelf{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c3-book::before{border-left:0!important;border-right:0!important;border-radius:0!important}
  .c3-book:nth-child(odd)::before{border-left:3px solid var(--ink)!important;border-radius:6px 0 0 6px!important}
  .c3-book:nth-child(even)::before{border-right:3px solid var(--ink)!important;border-radius:0 6px 6px 0!important}
  .c3-peek{position:static;display:flex;justify-content:center;margin:-34px 0 26px}
  .c3-window{padding-top:62px}.bk-talker{margin-bottom:30px}.d3.sp1,.d3.t2{display:none}.d3.t1{left:auto;right:5%;top:2%;width:34px;height:34px}}
@media (max-width:420px){.c3-z{box-shadow:3px 3px 0 var(--ink)}.op-board b{font-size:2.4rem}}
@media (prefers-reduced-motion:reduce){.c3-open,.d3{animation:none!important}}
/* ===== THE END: two endings, one obvious choice ===== */
.zend{background:var(--white);font-family:var(--hand);padding-block:clamp(56px,7vw,110px) clamp(44px,5vw,80px);overflow-x:clip}

.zend-head{display:grid;justify-items:center;text-align:center;gap:10px;max-width:1100px;margin:0 auto clamp(40px,5vw,70px)}
.zend-chip{font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;background:var(--white);border:2.5px solid var(--ink);border-radius:999px;padding:.3em .9em;box-shadow:3px 3px 0 var(--ink);transform:rotate(2deg)}
.zend-kicker{font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.8rem);line-height:1;transform:rotate(-2deg);color:var(--red)}
.zend-head h2{font-family:var(--hand);font-weight:800;font-size:clamp(2.2rem,4.6vw,4.6rem);line-height:1.12;letter-spacing:-.015em;margin:0;text-wrap:balance}
.beg{position:relative;display:inline-block;color:var(--red);margin-right:.08em}
.beg-ul{position:absolute;left:-2%;bottom:-.2em;width:104%;height:.32em;overflow:visible}
.beg-ul path{fill:none;stroke:var(--red);stroke-width:5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset .7s cubic-bezier(.5,0,.2,1)}
.beg-ul path:nth-child(2){stroke-width:4;transition-delay:.45s}
.beg-pp{position:absolute;right:-.3em;top:-.62em;font-family:var(--brush);font-weight:400;font-size:.3em;line-height:1;color:var(--ink);white-space:nowrap;transform:rotate(8deg);transition:opacity .4s .9s,transform .4s .9s}
.zend.pre .beg-ul path{stroke-dashoffset:1;transition:none}
.zend.pre .beg-pp{opacity:0;transform:rotate(8deg) translateY(6px);transition:none}
.zend-head p{margin:0;font-size:clamp(1.05rem,1.3vw,1.25rem);line-height:1.6;font-weight:500;max-width:40em}
.zend-choices{display:grid;grid-template-columns:minmax(0,.86fr) auto minmax(0,1.14fr);align-items:center;gap:clamp(14px,2.4vw,36px);max-width:1180px;margin:0 auto}
.zend-card{position:relative;border:3px solid var(--ink);border-radius:24px;padding:clamp(24px,3vw,42px);display:grid;gap:12px;justify-items:start}
.zend-card h3{font-family:var(--hand);font-weight:800;font-size:clamp(1.6rem,2.4vw,2.4rem);line-height:1.1;margin:0}
.zend-card p{margin:0;font-size:clamp(1rem,1.15vw,1.12rem);line-height:1.6;font-weight:500}
.zc-no{font-family:var(--brush);font-size:clamp(1.15rem,1.4vw,1.4rem);line-height:1}
.sad{background:#F3F3F6;border-style:dashed;border-color:#8C8A99;color:#6E6C7C;transform:rotate(-2deg)}
.sad h3{text-decoration:line-through;text-decoration-thickness:3px;text-decoration-color:rgba(110,108,124,.6)}
.zc-stamp{position:absolute;top:18px;right:18px;font-family:var(--hand);font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--red);border:3px solid var(--red);border-radius:8px;padding:.1em .5em;transform:rotate(12deg);opacity:.85;font-size:clamp(1rem,1.3vw,1.3rem)}
.zc-nah{font-family:var(--hand);font-weight:700;font-size:1rem;color:#6E6C7C;background:var(--white);border:2.5px dashed #8C8A99;border-radius:12px;padding:.55em 1.1em;cursor:pointer;margin-top:6px;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.zend-or{font-family:var(--brush);font-size:clamp(1.6rem,2.4vw,2.4rem);line-height:1;background:var(--yellow);border:3px solid var(--ink);border-radius:50%;width:2.3em;height:2.3em;display:grid;place-items:center;box-shadow:3px 3px 0 var(--ink);transform:rotate(-8deg);justify-self:center}
.yay{background:var(--purple);box-shadow:10px 10px 0 var(--ink);transform:rotate(1.5deg)}
.yay.nudge{animation:nudge .7s ease-in-out}
@keyframes nudge{0%,100%{transform:rotate(1.5deg)}20%{transform:rotate(-3deg) scale(1.03)}40%{transform:rotate(4deg) scale(1.04)}60%{transform:rotate(-2deg)}80%{transform:rotate(2deg)}}
.zc-tag{position:absolute;top:-20px;right:22px;font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.8rem);line-height:1;background:var(--yellow);border:2.5px solid var(--ink);border-radius:12px;padding:.18em .6em .08em;transform:rotate(5deg);box-shadow:3px 3px 0 var(--ink);white-space:nowrap}
.zc-yes{position:relative;display:inline-flex;align-items:center;text-decoration:none;color:var(--ink);background:var(--yellow);border:3px solid var(--ink);border-radius:16px;box-shadow:6px 6px 0 var(--ink);font-weight:800;font-size:clamp(1.25rem,2vw,1.8rem);line-height:1.1;padding:.65em 1.15em;margin-top:8px;transform:rotate(-1deg);transition:transform .2s cubic-bezier(.3,1.7,.5,1),box-shadow .2s}
.zc-yes::after{content:"";position:absolute;inset:-3px;border-radius:16px;border:3px solid var(--yellow);animation:ring 2s ease-out infinite;pointer-events:none}
@keyframes ring{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.18,1.5);opacity:0}}
.zc-yes:hover{transform:rotate(-3deg) scale(1.06);box-shadow:9px 9px 0 var(--ink)}
.zc-perks{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.zc-perks li{background:var(--white);border:2px solid var(--ink);border-radius:999px;padding:.2em .75em;font-weight:700;font-size:.9rem}
.zc-perks li:nth-child(2){background:var(--lime)}
.zc-peek{color:var(--ink);font-weight:700;font-size:.98rem;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.zend-foot{text-align:center;margin:clamp(40px,5vw,70px) auto 0;font-family:var(--brush);font-size:clamp(1.35rem,1.9vw,1.9rem);line-height:1.2;transform:rotate(-1.5deg);max-width:30em}
@media (max-width:860px){.zend-choices{grid-template-columns:1fr;gap:38px;max-width:560px}.zc-tag{right:auto;left:18px;transform:rotate(-4deg)}.sad{transform:rotate(-1deg)}.yay{transform:rotate(1deg)}}
@media (max-width:600px){.zend-head h2{margin-bottom:.55em}.beg-pp{font-size:16px;top:auto;bottom:-1.55em;right:-.4em;transform:rotate(-4deg)}.zend.pre .beg-pp{transform:rotate(-4deg) translateY(6px)}}
@media (max-width:480px){.zc-yes{font-size:1.2rem;padding:.6em .9em}.zc-tag{left:12px}}
@media (prefers-reduced-motion:reduce){.zc-yes::after{animation:none!important}}
/* about intro: white page, storybook voice. On wide screens the heading tucks up beside the art that spills out of the hero */
.about-intro .wrap{padding-left:max(calc(var(--gut) + clamp(18px,3vw,52px)),env(safe-area-inset-left,0px));padding-right:max(calc(var(--gut) + clamp(18px,3vw,52px)),env(safe-area-inset-right,0px))}
.about-intro{position:relative;z-index:3;background:transparent;padding-block:clamp(48px,9vw,80px) clamp(28px,3.5vw,52px);--hand:"Shantell Sans","Kalam","Comic Sans MS",cursive;--brush:"Caveat Brush","Kalam","Segoe Print",cursive}
.ai-head{display:grid;gap:6px;justify-items:start;margin-bottom:clamp(22px,3vw,40px)}
.ai-kicker{font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.8rem);color:var(--plum);transform:rotate(-3deg);line-height:1}
.ai-head h2{font-family:var(--hand);font-weight:800;font-size:clamp(2.8rem,6vw,5.6rem);line-height:.95;letter-spacing:-.02em;color:var(--ink);margin:0}
.about-intro .hl{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 60' preserveAspectRatio='none'%3E%3Cpath d='M7 17C38 9 92 7 196 11c2 0 3 2 2 4l-3 34c0 2-2 3-4 3C126 55 64 56 6 51c-3 0-5-3-4-6l1-24c0-2 2-4 4-4z' fill='%23A0E45D'/%3E%3Cpath d='M14 22C70 17 130 16 188 19' stroke='%23B8EE83' stroke-width='5' stroke-linecap='round' fill='none' opacity='.7'/%3E%3C/svg%3E") center/100% 100% no-repeat;padding:0 .14em .04em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.ai-note{font-family:var(--brush);font-size:clamp(1.1rem,1.35vw,1.35rem);line-height:1.15;color:var(--soft);display:flex;gap:.45em;align-items:center;transform:rotate(-1.5deg);margin:4px 0 0;max-width:100%}
.ai-note svg{width:2.4em;height:1.5em;flex:none;color:var(--ink);transform:rotate(18deg)}
.ai-body{font-family:var(--hand);font-size:clamp(1.04rem,1.2vw,1.2rem);line-height:1.75;color:#2B2838}
.ai-body p{margin:0}
.ai-lead{font-size:clamp(1.25rem,1.75vw,1.7rem);line-height:1.5;color:var(--ink);font-weight:600;max-width:46em;margin-bottom:clamp(20px,2.4vw,34px)!important}
.ai-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,3.4vw,56px)}
.ai-body .ul{font-weight:700;color:var(--ink);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 16' preserveAspectRatio='none'%3E%3Cpath d='M3 9C40 4 80 13 118 8S176 5 197 9' stroke='%23FF4430' stroke-width='3.2' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") left bottom/100% .4em no-repeat;padding-bottom:.16em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.ai-dream{font-weight:600;color:var(--ink)}
.ai-dream .hl{font-weight:800}
.ai-sign{font-family:var(--brush);font-size:clamp(1.3rem,1.6vw,1.6rem);line-height:1.2;color:var(--soft);margin-top:clamp(22px,2.6vw,36px)!important;transform:rotate(-1.5deg);transform-origin:right;text-align:right;margin-left:auto!important;width:fit-content;max-width:100%}
.ai-sign b{font-weight:400;color:var(--ink);font-size:1.2em}
@media (min-width:900px){
  /* pull the heading up into the white space next to the spilled artwork */
  .about-intro{margin-top:calc(var(--aw) * -0.2005 * .42);padding-top:0}
  .ai-head{max-width:calc(100% - var(--aw) - 24px)}
}
@media (max-width:1100px){.ai-cols{grid-template-columns:repeat(2,minmax(0,1fr))}.ai-dream{grid-column:1/-1}}
@media (max-width:700px){.ai-cols{grid-template-columns:1fr}.ai-note svg{transform:rotate(70deg)}}
/* ===== ABOUT ===== */
.cast-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:start}
.cast-grid > *{min-width:0}
.letter{background:var(--wash);border-radius:26px;padding:38px 38px 34px;display:grid;gap:16px}
.letter p{font-family:var(--f-head);font-variation-settings:"SOFT" 100;font-size:1.22rem;line-height:1.55;color:var(--ink)}
.letter .sig{font-style:italic;color:var(--purple)}
.people{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.person{border:1px solid var(--line);border-radius:22px;padding:20px;display:grid;gap:6px;background:var(--white)}
.avatar{width:72px;height:72px;border-radius:22px;overflow:hidden;background:var(--wash);margin-bottom:6px}
.avatar svg{width:100%;height:100%}
.person .role{font-weight:700;font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--plum)}
.person .fact{font-size:.95rem;color:var(--soft);line-height:1.5}
@media (max-width:920px){.cast-grid{grid-template-columns:1fr}}
@media (max-width:480px){.people{grid-template-columns:1fr}.letter{padding:28px 24px}}

.wwwh{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.wwwh div{display:grid;gap:8px;align-content:start;border-top:2px solid var(--purple);padding-top:18px}
.wwwh .q{font-family:var(--f-head);font-style:italic;font-variation-settings:"SOFT" 100,"WONK" 1;color:var(--plum);font-size:1.1rem}
.wwwh p{color:var(--soft);font-size:.98rem}
@media (max-width:960px){.wwwh{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.wwwh{grid-template-columns:1fr}}

.plot{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;position:relative}
.plot::before{content:"";position:absolute;left:40px;right:8%;top:36px;border-top:2px dashed var(--lilac)}
.step{position:relative;display:grid;gap:8px;justify-items:start}
.step .num{width:72px;height:72px;border-radius:22px;background:var(--white);border:1.5px solid var(--purple);display:grid;place-items:center;font-family:var(--f-head);font-weight:600;font-variation-settings:"SOFT" 100;font-size:1.9rem;color:var(--purple);margin-bottom:8px}
.step:last-child .num{background:var(--purple);color:var(--ink);position:relative}
.step:last-child .num::after{content:"";position:absolute;right:11px;bottom:11px;width:11px;height:11px;background:var(--lime);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
.step .time{font-size:.85rem;font-weight:700;color:var(--plum);letter-spacing:.06em;text-transform:uppercase}
.step p{color:var(--soft);font-size:.98rem}
.skip-note{margin-top:22px;color:var(--soft);font-style:italic}
@media (max-width:880px){.plot{grid-template-columns:1fr 1fr;gap:34px 20px}.plot::before{display:none}}
@media (max-width:480px){.plot{grid-template-columns:1fr}}

.promises{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.promise{background:var(--wash);border-radius:24px;padding:28px;display:grid;gap:10px;align-content:start}
.promise .big{font-family:var(--f-head);font-weight:600;font-variation-settings:"SOFT" 100;font-size:3rem;line-height:1;color:var(--purple)}
.promise p{color:var(--soft)}
@media (max-width:820px){.promises{grid-template-columns:1fr}}

.office{border:1px solid var(--line);border-radius:30px;overflow:hidden;background:var(--white)}
.office svg.scene{display:block;width:100%;height:auto}
.office .loc{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:18px 26px;border-top:1px solid var(--line);font-weight:600}
.office .loc .pin{display:flex;gap:10px;align-items:center}
.office .loc .pin svg{width:22px;height:22px;flex:none;color:var(--purple)}
.office .status{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--purple)}
.office .status::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--purple);animation:blink 1.4s infinite}
@keyframes blink{50%{opacity:.2}}
.chair{transform-box:fill-box;transform-origin:center;animation:twirl 5s ease-in-out infinite}
@keyframes twirl{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
.hook{transform-box:view-box;transform-origin:610px 40px;animation:swing 3.6s ease-in-out infinite}
@keyframes swing{0%,100%{transform:rotate(4deg)}50%{transform:rotate(-4deg)}}
.steam path{animation:steam 2.6s ease-in-out infinite;opacity:0}
.steam path:nth-child(2){animation-delay:.8s}.steam path:nth-child(3){animation-delay:1.6s}
@keyframes steam{0%{opacity:0;transform:translateY(6px)}40%{opacity:.7}100%{opacity:0;transform:translateY(-14px)}}
.tumble{animation:roll 10s linear infinite;transform-box:fill-box;transform-origin:center}
@keyframes roll{0%{transform:translateX(-120px) rotate(0)}100%{transform:translateX(1100px) rotate(1080deg)}}
.sun{animation:pulse 4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes pulse{50%{transform:scale(1.08)}}
.doorsign{transform-box:fill-box;transform-origin:50% 0;animation:swing 3s ease-in-out infinite}
.zzz text{font-family:var(--f-head);font-weight:600;fill:var(--plum);animation:fz 3s ease-in-out infinite;opacity:0}
.zzz text:nth-child(2){animation-delay:1s}.zzz text:nth-child(3){animation-delay:2s}
@keyframes fz{0%{opacity:0;transform:translate(0,0)}50%{opacity:1}100%{opacity:0;transform:translate(14px,-22px)}}
.office-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}
.office-facts div{background:var(--wash);border-radius:18px;padding:16px 20px;display:grid}
.office-facts small{font-weight:700;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.office-facts b{font-family:var(--f-head);font-weight:600;font-variation-settings:"SOFT" 100;font-size:1.35rem;color:var(--purple);line-height:1.2}
@media (max-width:760px){.office-facts{grid-template-columns:1fr 1fr}}

.fund{display:grid;grid-template-columns:auto 1fr;gap:48px;align-items:center;margin-top:56px;border:1.5px solid var(--purple);border-radius:30px;padding:44px}
.fund > *{min-width:0}
.jar{width:190px}
.jar svg{width:100%;height:auto;display:block}
.fund p{color:var(--soft);font-size:1.08rem;max-width:36em;margin-top:12px}
.fund p b{color:var(--purple)}
.meters{display:grid;gap:12px;margin-top:24px}
.meter .row{display:flex;justify-content:space-between;gap:10px;font-weight:700;margin-bottom:6px;flex-wrap:wrap}
.meter .row span{font-variant-numeric:tabular-nums;color:var(--purple)}
.meter .track{height:16px;border-radius:999px;background:var(--wash);overflow:hidden}
.meter .track div{height:100%;width:0;border-radius:999px;background:repeating-linear-gradient(-45deg,var(--purple) 0 12px,var(--plum) 12px 24px);background-size:34px 34px;transition:width 1.6s cubic-bezier(.5,0,.2,1);animation:stripes 1s linear infinite}
@keyframes stripes{to{background-position:34px 0}}
.or{font-family:var(--f-head);font-style:italic;color:var(--plum);text-align:center}
.fund .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.toast{color:var(--plum);font-weight:600;min-height:1.4em;margin-top:10px}
@media (max-width:780px){.fund{grid-template-columns:1fr;padding:30px 22px}.jar{width:140px;margin:0 auto}}

/* ===== WORK ===== */
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:36px}
.filters button{font:inherit;font-weight:600;font-size:.95rem;padding:.45em 1.1em;border-radius:999px;border:1.5px solid var(--line);background:var(--white);color:var(--ink);cursor:pointer}
.filters button:hover{border-color:var(--lilac)}
.filters button[aria-pressed="true"]{background:var(--purple);border-color:var(--purple);color:var(--ink)}
.shelf{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 28px}
.proj{appearance:none;border:0;background:none;padding:0;text-align:left;font:inherit;color:inherit;cursor:pointer;display:grid;gap:14px}
.proj .ph{border-radius:24px;overflow:hidden;aspect-ratio:4/5;max-width:100%;background:var(--wash);position:relative}
.proj .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.3,1,.4,1)}
.proj:hover .ph img,.proj:focus-visible .ph img{transform:scale(1.05)}
.proj .peek{position:absolute;left:16px;bottom:16px;background:var(--white);color:var(--purple);font-weight:700;font-size:.88rem;padding:.5em 1.05em;border-radius:999px;display:flex;gap:.5em;align-items:center;opacity:0;transform:translateY(10px);transition:opacity .25s,transform .25s}
.proj .peek i{width:.5em;height:.5em;background:var(--lime);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
.proj:hover .peek,.proj:focus-visible .peek{opacity:1;transform:none}
.proj .meta b{display:block;font-family:var(--f-head);font-weight:600;font-variation-settings:"SOFT" 100;font-size:1.35rem;line-height:1.2}
.proj .meta span{color:var(--soft);font-size:.95rem}
@media (max-width:880px){.shelf{grid-template-columns:1fr 1fr}}
@media (max-width:540px){.shelf{grid-template-columns:1fr}}

.case-top{padding-block:28px 0}
.back{appearance:none;background:none;border:0;color:var(--purple);font:inherit;font-weight:700;cursor:pointer;padding:6px 0}
.back:hover{text-decoration:underline}
.case-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding-block:34px 64px}
.case-hero > *{min-width:0}
.case-hero .sub{font-size:1.18rem;color:var(--soft);margin-top:16px;max-width:32em}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.tags span{background:var(--wash);border-radius:999px;padding:.3em .95em;font-weight:600;font-size:.9rem;color:var(--purple)}
.facts{display:flex;gap:12px 36px;margin-top:28px;flex-wrap:wrap}
.facts div{display:grid}
.facts small{font-weight:700;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}
.facts b{font-weight:700}
.case-cover{border-radius:28px;overflow:hidden;aspect-ratio:4/5;max-width:100%}
.case-cover img{width:100%;height:100%;object-fit:cover}
@media (max-width:820px){.case-hero{grid-template-columns:1fr}.case-cover{max-width:420px}}
.case-body section{padding-block:56px;border-top:1px solid var(--line)}
.two{display:grid;grid-template-columns:240px 1fr;gap:40px}
.two > *{min-width:0}
.two h2{font-size:1.8rem;margin-top:8px}
.two p{font-size:1.1rem;max-width:40em;color:var(--soft)}
@media (max-width:760px){.two{grid-template-columns:1fr;gap:12px}}
.gallery{display:grid;gap:22px;margin-top:28px}
.gallery figure{margin:0;display:grid;gap:10px}
.gallery figure img{width:100%;height:auto;border-radius:22px;background:var(--wash)}
.gallery figcaption{color:var(--soft);font-size:.96rem}
.gallery figcaption b{color:var(--ink);margin-right:8px}
.gallery .pair{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media (max-width:640px){.gallery .pair{grid-template-columns:1fr}}
.swatches{display:grid;grid-template-columns:repeat(4,1fr);border-radius:20px;overflow:hidden}
.swatches div{min-height:110px;display:flex;align-items:flex-end;padding:12px;font-weight:700;font-size:.82rem;font-variant-numeric:tabular-nums}
.got{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 28px}
.got li{display:flex;gap:12px;font-weight:600}
.got li::before{content:"";flex:none;width:8px;height:8px;margin-top:9px;background:var(--purple);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
@media (max-width:560px){.got{grid-template-columns:1fr}}
.next-proj{padding-block:56px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.next-proj small{font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--plum)}

/* ===== CONTACT ===== */
.form-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:start}
.form-wrap > *{min-width:0}
.zed{position:sticky;top:110px;display:grid;gap:18px;justify-items:start}
@keyframes bob{50%{translate:0 -8px}}
.bubble{background:var(--wash);border-radius:22px;padding:18px 22px;font-size:1.08rem;line-height:1.45;font-weight:500;position:relative;max-width:360px;min-height:4.6em}
.bubble::before{content:"";position:absolute;left:34px;top:-9px;width:18px;height:18px;background:var(--wash);transform:rotate(45deg)}
.contact-alt{color:var(--soft);font-size:.96rem;display:grid;gap:2px}
.contact-alt b{color:var(--ink);user-select:all}
form.fun{background:var(--white);border:1px solid var(--line);border-radius:28px;padding:34px}
.progress{display:grid;gap:8px;margin-bottom:28px}
.progress .lbl{display:flex;justify-content:space-between;font-weight:700;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--plum)}
.progress .bar{height:10px;border-radius:999px;background:var(--wash);position:relative}
.progress .fill{height:100%;border-radius:999px;background:var(--purple);width:25%;transition:width .5s cubic-bezier(.5,0,.2,1)}
.progress .pencil{position:absolute;top:50%;width:32px;height:32px;transform:translate(-30%,-64%) rotate(-30deg);transition:left .5s cubic-bezier(.5,0,.2,1);left:25%}
fieldset.page{border:0;margin:0;padding:0;display:grid;gap:22px}
fieldset.page legend{font-family:var(--f-head);font-weight:600;font-variation-settings:"SOFT" 100;font-size:1.75rem;margin-bottom:6px;padding:0;line-height:1.15}
.field{display:grid;gap:8px}
.field > label,.field .q{font-weight:700}
.field .hint{font-weight:500;color:var(--soft);font-style:italic}
input[type=text],input[type=email],input[type=tel],textarea{font:inherit;padding:.8em 1em;border-radius:14px;border:1.5px solid var(--line);background:var(--white);color:var(--ink);width:100%;transition:border-color .15s}
input::placeholder,textarea::placeholder{color:#ADA2BE}
textarea{min-height:120px;resize:vertical}
input:focus,textarea:focus{outline:none;border-color:var(--purple)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.chip span{display:inline-block;padding:.5em 1.05em;border:1.5px solid var(--line);border-radius:999px;font-weight:600;font-size:.95rem;background:var(--white);transition:transform .15s,background .15s,border-color .15s;cursor:pointer;user-select:none}
.chip:hover span{border-color:var(--lilac)}
.chip input:checked + span{background:var(--purple);border-color:var(--purple);color:var(--ink);transform:scale(1.04)}
.chip input:focus-visible + span{outline:3px solid var(--purple);outline-offset:2px}
.pick{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pick .chip{display:grid}
.pick .chip span{display:grid;gap:2px;border-radius:16px;padding:.8em 1em;height:100%}
.pick .chip span small{font-weight:500;color:var(--soft);font-size:.86rem}
.pick .chip input:checked + span small{color:var(--on-dark)}
@media (max-width:480px){.pick{grid-template-columns:1fr}}
.slider-out{font-family:var(--f-head);font-style:italic;font-variation-settings:"SOFT" 100,"WONK" 1;font-size:1.25rem;color:var(--purple)}
input[type=range]{width:100%;accent-color:var(--purple);height:30px}
.range-ends{display:flex;justify-content:space-between;font-size:.85rem;color:var(--soft);font-weight:600}
.pinky{display:flex;gap:12px;align-items:flex-start;font-weight:600;cursor:pointer}
.pinky input{width:22px;height:22px;accent-color:var(--purple);flex:none;margin-top:2px}
.nav-row{display:flex;justify-content:space-between;gap:12px;margin-top:26px;flex-wrap:wrap}
.err{color:#C0185A;font-weight:700;font-size:.95rem;min-height:1.2em}
.done{text-align:center;display:grid;gap:16px;justify-items:center;padding:20px 0}
.done h3{font-size:2.1rem}
.done .summary{background:var(--wash);border-radius:16px;padding:16px 20px;text-align:left;font-size:.98rem;width:100%;max-width:460px;display:grid;gap:4px}
@media (max-width:920px){.form-wrap{grid-template-columns:1fr}.zed{position:static}}
@media (max-width:480px){form.fun{padding:24px 18px}}
.faq{display:grid;gap:10px;max-width:860px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 0;font-weight:700;font-size:1.08rem;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--f-head);font-size:1.6rem;color:var(--purple);line-height:1;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 22px;color:var(--soft);max-width:44em}
#confetti{position:fixed;inset:0;pointer-events:none;z-index:80}

/* footer */
/* footer: hand-drawn artwork that changes colour with the hero */
/* footer top: a wobbly edge instead of a straight line, and the ribbon in the art flies out of the section */
.ft-wave{position:absolute;left:0;bottom:calc(100% - 1px);width:100%;height:clamp(34px,5.6vw,90px);display:block;fill:var(--ft-c);transition:fill 1.4s ease;z-index:-2}
.ft-ribbon{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:-1}
.ft-ribbon .rb{fill:none;stroke:#DDDEFB;stroke:color-mix(in srgb,var(--ft-c) 25%,#fff);stroke-width:59;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke 1.4s ease,stroke-dashoffset 1.8s cubic-bezier(.5,0,.2,1)}
.ft-ribbon.rb-wait .rb{stroke-dashoffset:1}
.rb-spark path{fill:none;stroke:var(--ink);stroke-width:6;stroke-linecap:round;transition:opacity .5s 1.4s}
.ft-ribbon.rb-wait .rb-spark path{opacity:0;transition:none}
@media (max-width:1180px){.ft-ribbon{display:none}}

.ft{position:relative;isolation:isolate;--ft-c:#777DF5;background:var(--ft-c);transition:background-color 1.4s ease;color:var(--ink);min-height:50vw;display:flex;flex-direction:column;
  --hand:"Shantell Sans","Kalam","Comic Sans MS",cursive;--brush:"Caveat Brush","Kalam","Segoe Print",cursive;font-family:var(--hand)}
.ft-bgs{position:absolute;inset:0;z-index:-1;overflow:hidden}
.ft-bgs img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:right bottom;opacity:0;transition:opacity 1.4s ease}
.ft-bgs img.on{opacity:1}
.ft-in{flex:1;display:grid;align-content:start;padding-bottom:clamp(24px,3vw,48px)!important;gap:clamp(18px,2.4vw,36px);padding:clamp(40px,5vw,84px) max(clamp(22px,5vw,96px),env(safe-area-inset-left,0px)) 0;max-width:min(64%,1000px)}
.ft-logo{display:inline-flex;background:var(--white);border:2.5px solid var(--ink);border-radius:16px;padding:9px 16px 8px;box-shadow:4px 4px 0 var(--ink);transform:rotate(-2.5deg);justify-self:start}
.ft-logo img{height:clamp(24px,2vw,32px);width:auto}
.ft-brand{display:grid;gap:16px;justify-items:start}
.ft-brand p{margin:0;font-size:clamp(1rem,1.2vw,1.2rem);line-height:1.55;font-weight:500;max-width:30em}
.ft-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.6vw,40px)}
.ft-cols h4{margin:0 0 8px;font-family:var(--brush);font-weight:400;font-size:clamp(1.25rem,1.5vw,1.5rem);line-height:1}
.ft-cols a,.ft-cols span{display:block;padding:3px 0;font-size:clamp(.95rem,1.05vw,1.05rem);font-weight:600;color:var(--ink);text-decoration:none;line-height:1.4;overflow-wrap:break-word}
.ft-cols a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.ft-sel{user-select:all}
.ft-big{margin:0;font-weight:800;font-size:clamp(1.5rem,3vw,3rem);line-height:1.05;letter-spacing:-.01em;max-width:16em}
.ft-bottom{position:relative;display:grid;gap:10px;justify-items:start;max-width:min(44%,640px);padding:0 max(clamp(22px,5vw,96px),env(safe-area-inset-left,0px)) calc(clamp(22px,3vw,44px) + env(safe-area-inset-bottom,0px))}
.ft-sig{margin:0;font-family:var(--brush);font-size:clamp(1.2rem,1.6vw,1.6rem);line-height:1;color:var(--ink);transform:rotate(-2deg);transform-origin:left}
.ft-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font-size:.9rem;font-weight:700}
.ft-copy{font-size:.9rem;font-weight:700}
.ft-chip{display:inline-flex;align-items:center;background:var(--white);color:var(--ink);text-decoration:none;border:2px solid var(--ink);border-radius:10px;padding:.25em .7em;box-shadow:2px 2px 0 var(--ink);font-size:.85rem;font-weight:800;transition:transform .15s,box-shadow .15s}
.ft-chip:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink)}


@media (max-width:1180px){
  .ft{min-height:0}
  .ft-in{max-width:none;padding-bottom:8px}
  .ft-bgs{position:relative;inset:auto;z-index:auto;order:2;aspect-ratio:1.55;margin-top:-8px}
  .ft-bottom{order:3;background:var(--white);max-width:none;padding-top:18px}
  .ft-sig{font-size:1.35rem}
}
@media (max-width:560px){.ft-cols{grid-template-columns:1fr 1fr}.ft-cols > div:nth-child(2){grid-column:1/-1;order:3}}


.view{animation:viewin .4s ease}
@keyframes viewin{from{opacity:.5;transform:translateY(10px)}}
.totop{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));width:50px;height:50px;border-radius:16px;border:0;background:var(--white);box-shadow:0 10px 24px -10px rgba(42,23,64,.55);cursor:pointer;z-index:40;padding:8px;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;transform:translateY(10px)}
.totop.show{opacity:1;pointer-events:auto;transform:none}
.totop img{width:100%;height:100%}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}html{scroll-behavior:auto}.abc .zt img{transform:scale(1.25)}}
/* ================= INNER PAGES: same sticker language as the home page ================= */
.pg{font-family:var(--hand);color:var(--ink)}
.pg h1,.pg h2,.pg h3{font-family:var(--hand);font-weight:800;letter-spacing:-.015em;color:var(--ink)}
.pg p{line-height:1.6}
/* page cover */
.pcover{--pc:var(--purple);margin:var(--gut) var(--gut) 0;background-color:var(--pc);border-radius:36px;position:relative;overflow:hidden;
  background-image:linear-gradient(rgba(255,255,255,.14) 1.5px,transparent 1.5px),linear-gradient(90deg,rgba(255,255,255,.14) 1.5px,transparent 1.5px);background-size:44px 44px}
.pc-yellow{--pc:var(--yellow);background-image:repeating-conic-gradient(from -90deg at 80% 120%,rgba(255,255,255,.26) 0 5deg,transparent 5deg 10deg)}
.pc-lime{--pc:var(--lime);background-image:radial-gradient(rgba(23,21,34,.16) 1.3px,transparent 1.4px);background-size:22px 22px}
.pc-red{--pc:var(--red);background-image:repeating-linear-gradient(-45deg,rgba(255,255,255,.08) 0 18px,transparent 18px 36px)}
.pc-in{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);align-items:center;gap:clamp(20px,4vw,60px);padding:clamp(40px,6vw,96px) clamp(22px,5vw,80px)}
.pc-copy{display:grid;gap:clamp(12px,1.4vw,20px);justify-items:start}
.pc-eb{justify-content:flex-start}
.pc-copy h1{margin:0;font-size:clamp(2.1rem,5.6vw,5.6rem);line-height:1.04;text-wrap:balance}
.pc-copy p{margin:0;font-size:clamp(1.05rem,1.35vw,1.3rem);font-weight:500;max-width:34em}
.pc-red .pc-copy p,.pc-red .p-kicker{color:var(--ink)}
.pc-z{display:inline-block;background:var(--white);border:3px solid var(--ink);border-radius:16px;padding:0 .25em .04em;box-shadow:5px 5px 0 var(--ink);transform:rotate(-2deg)}
.p-chip{font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;background:var(--white);border:2.5px solid var(--ink);border-radius:999px;padding:.3em .9em;box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg);white-space:nowrap}
.p-kicker{font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.8rem);line-height:1;transform:rotate(-2deg)}
.pc-art{position:relative;min-height:clamp(180px,22vw,320px);display:grid;place-items:center}
.pc-badge{width:clamp(130px,15vw,220px);aspect-ratio:1;background:var(--white);border:3px solid var(--ink);border-radius:50%;box-shadow:8px 8px 0 var(--ink);display:grid;place-items:center;transform:rotate(-8deg);animation:pcbob 5s ease-in-out infinite}
.pc-badge img{width:62%}
@keyframes pcbob{50%{transform:rotate(-3deg) translateY(-8px)}}
.pc-note{position:absolute;font-family:var(--brush);font-size:clamp(1.1rem,1.5vw,1.5rem);line-height:1;background:var(--yellow);border:2.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:.35em .6em .25em;white-space:nowrap}
.pc-note.n1{top:6%;left:0;transform:rotate(-6deg)}
.pc-note.n2{bottom:8%;right:0;transform:rotate(5deg);background:var(--white)}
.pc-books{grid-template-columns:repeat(3,auto);justify-content:center}
.pc-books img{width:clamp(80px,9vw,140px);border:3px solid var(--ink);border-radius:3px 9px 9px 3px;box-shadow:6px 6px 0 var(--ink);margin-inline:-12px}
.pc-books img:nth-child(1){transform:rotate(-10deg) translateY(10px)}
.pc-books img:nth-child(2){transform:rotate(2deg) translateY(-10px);z-index:1}
.pc-books img:nth-child(3){transform:rotate(11deg) translateY(12px)}
.pc-env{width:clamp(150px,17vw,250px);transform:rotate(-6deg);filter:drop-shadow(7px 7px 0 var(--ink));animation:pcbob 5s ease-in-out infinite}
.bigplate{display:grid;justify-items:center;background:var(--white);border:4px solid var(--ink);border-radius:20px;box-shadow:8px 8px 0 var(--ink);padding:.5em 1.1em .6em;transform:rotate(-5deg);position:relative;font-family:var(--hand)}
.bigplate::before{content:"";position:absolute;inset:8px;border:2.5px solid var(--ink);border-radius:12px;opacity:.3}
.bigplate small{font-weight:800;letter-spacing:.14em;font-size:clamp(.75rem,1vw,.95rem)}
.bigplate b{font-size:clamp(3.4rem,7vw,6.4rem);line-height:1;color:var(--red)}
.bigplate em{font-family:var(--brush);font-style:normal;font-size:clamp(1.1rem,1.5vw,1.5rem)}
.t-count{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.t-count span{background:var(--white);border:2.5px solid var(--ink);border-radius:999px;padding:.3em .9em;font-weight:700;box-shadow:3px 3px 0 var(--ink)}
.t-count .tc-gone{background:var(--ink);color:var(--white)}
/* sections */
.p-sec{padding-block:clamp(56px,7vw,110px)}
.p-tight{padding-block:clamp(30px,4vw,60px)}
.p-wash{background:var(--wash)}
.p-head{display:grid;justify-items:center;text-align:center;gap:10px;max-width:1000px;margin:0 auto clamp(34px,4.5vw,64px)}
.p-head h2{margin:0;font-size:clamp(2rem,3.8vw,3.6rem);line-height:1.12;text-wrap:balance}
.p-head p{margin:0;font-size:clamp(1.02rem,1.25vw,1.2rem);font-weight:500;max-width:42em}
.zbtn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;font-family:var(--hand);font-weight:800;font-size:clamp(1.05rem,1.3vw,1.25rem);line-height:1.1;color:var(--ink);background:var(--yellow);border:3px solid var(--ink);border-radius:14px;box-shadow:5px 5px 0 var(--ink);padding:.7em 1.2em;text-decoration:none;cursor:pointer;transform:rotate(-1deg);transition:transform .2s cubic-bezier(.3,1.7,.5,1),box-shadow .2s}
.zbtn:hover{transform:rotate(-3deg) scale(1.04);box-shadow:7px 7px 0 var(--ink)}
.zbtn.sm{font-size:1rem;padding:.6em 1em;box-shadow:4px 4px 0 var(--ink)}
.zbtn.alt{background:var(--white)}
.zlink{color:var(--ink);font-weight:700;text-decoration:underline;text-decoration-thickness:2.5px;text-underline-offset:4px;text-decoration-color:var(--red)}
.p-acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.p-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;background:var(--white);border:3px solid var(--ink);border-radius:26px;box-shadow:8px 8px 0 var(--ink);padding:clamp(24px,3vw,40px) clamp(22px,3.5vw,48px);max-width:1180px;margin:clamp(40px,5vw,70px) auto 0}
.p-band h2{margin:0;font-size:clamp(1.5rem,2.6vw,2.4rem);line-height:1.15;max-width:18em}
.p-tight .p-band{margin-top:0}
/* story beats */
.beats{list-style:none;margin:0 auto;padding:0;max-width:1080px;display:grid;gap:clamp(20px,3vw,34px);position:relative}
.beats::before{content:"";position:absolute;left:50%;top:10px;bottom:10px;border-left:3px dashed rgba(23,21,34,.35);transform:translateX(-50%)}
.beat{display:grid;grid-template-columns:1fr 64px 1fr;align-items:center}
.bt-n{grid-column:2;justify-self:center;width:56px;height:56px;border-radius:50%;background:var(--yellow);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);display:grid;place-items:center;font-weight:800;font-size:1.5rem;position:relative;z-index:1}
.bt-card{grid-column:1;grid-row:1;background:var(--white);border:3px solid var(--ink);border-radius:20px;box-shadow:6px 6px 0 var(--ink);padding:clamp(18px,2.2vw,28px);transform:rotate(-1.2deg)}
.beat:nth-child(even) .bt-card{grid-column:3;transform:rotate(1.2deg)}
.beat:nth-child(2) .bt-n{background:var(--lime)}.beat:nth-child(3) .bt-n{background:var(--lilac)}.beat:nth-child(4) .bt-n{background:var(--red);color:var(--white)}
.bt-card h3{margin:0 0 6px;font-size:clamp(1.25rem,1.7vw,1.6rem);line-height:1.15}
.bt-card p{margin:0;font-weight:500}
.bt-card a{color:var(--ink);font-weight:800;text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:3px}
/* crew */
.crew{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,2.6vw,40px);max-width:1240px;margin:0 auto}
.mate{background:var(--white);border:3px solid var(--ink);border-radius:8px;box-shadow:7px 7px 0 var(--ink);padding:12px 12px 20px;transform:rotate(var(--r));display:grid;gap:6px;transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.mate:hover{transform:rotate(0) translateY(-6px)}
.mt-pic{position:relative;background:var(--bg);border:2.5px solid var(--ink);border-radius:4px;aspect-ratio:1;display:grid;place-items:end center;overflow:visible;margin-bottom:8px}
.mt-pic svg{width:78%;height:auto;display:block}
.mt-pic .c2-tape{top:-16px}
.mt-role{font-family:var(--brush);font-size:1.15rem;line-height:1}
.mate h3{margin:0;font-size:1.6rem;line-height:1}
.mate p{margin:0;font-size:.98rem;font-weight:500;line-height:1.5}
.mt-read{font-size:.85rem;color:var(--soft);font-weight:600;margin-top:4px;border-top:2px dashed rgba(23,21,34,.2);padding-top:8px}
.mt-read b{display:block;color:var(--ink);font-family:var(--brush);font-weight:400;font-size:1.1rem}
/* AI */
.aiq-split{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,48px);max-width:1100px;margin:0 auto}
.aiq-card{border:3px solid var(--ink);border-radius:24px;padding:clamp(24px,3vw,40px);display:grid;gap:10px;align-content:start}
.aiq-yes{background:var(--lime);box-shadow:8px 8px 0 var(--ink);transform:rotate(-1deg)}
.aiq-no{background:var(--white);box-shadow:8px 8px 0 var(--ink);transform:rotate(1deg)}
.aiq-tag{justify-self:start;font-family:var(--brush);font-size:1.3rem;line-height:1;background:var(--white);border:2.5px solid var(--ink);border-radius:999px;padding:.25em .7em .15em}
.aiq-no .aiq-tag{background:var(--red);color:var(--white)}
.aiq-card h3{margin:0;font-size:clamp(1.4rem,2vw,1.9rem);line-height:1.15}
.aiq-card ul{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:10px}
.aiq-card li{position:relative;padding-left:34px;font-weight:600;line-height:1.4}
.aiq-card li::before{content:"";position:absolute;left:0;top:1px;width:22px;height:22px;border:2.5px solid var(--ink);border-radius:6px;background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 10l4 4 8-9' fill='none' stroke='%23171522' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/80% no-repeat}
.aiq-no li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 5l10 10M15 5L5 15' fill='none' stroke='%23FF4430' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E")}
.aiq-stamp{position:absolute;right:-26px;top:-46px;transform:rotate(12deg);width:clamp(110px,11vw,150px);aspect-ratio:1;border-radius:50%;background:var(--yellow);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);display:grid;place-content:center;text-align:center;font-weight:800;line-height:1.05;font-size:clamp(.85rem,1vw,1rem);z-index:2}
.aiq-stamp b{font-size:clamp(1.6rem,2.4vw,2.2rem)}
.aiq-stamp small{font-family:var(--brush);font-weight:400;font-size:.95em}
.aiq-foot{text-align:center;font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.8rem);margin:clamp(30px,4vw,50px) 0 0;transform:rotate(-1.5deg)}
/* the shelf: library cards */
.p-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:clamp(30px,4vw,50px)}
.p-filters button{font-family:var(--hand);font-weight:700;font-size:1rem;background:var(--white);border:2.5px solid var(--ink);border-radius:999px;padding:.4em 1.1em;cursor:pointer;box-shadow:3px 3px 0 var(--ink);transition:transform .2s cubic-bezier(.3,1.7,.5,1),background .2s}
.p-filters button:hover{transform:rotate(-4deg) translateY(-2px)}
.p-filters button[aria-pressed="true"]{background:var(--yellow);transform:rotate(-2deg)}
.cards-lib{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:clamp(24px,3vw,44px);max-width:1300px;margin:0 auto}
.lc{position:relative;display:grid;grid-template-columns:42% minmax(0,1fr);gap:18px;align-items:center;text-align:left;font:inherit;color:inherit;background:var(--white);border:3px solid var(--ink);border-radius:20px;box-shadow:7px 7px 0 var(--ink);padding:18px;cursor:pointer;transform:rotate(var(--r,0deg));transition:transform .3s cubic-bezier(.3,1.5,.5,1),box-shadow .3s}
.lc:hover{transform:rotate(0) translateY(-6px);box-shadow:10px 12px 0 var(--ink)}
.lc-cover{position:relative}
.lc-cover img{display:block;width:100%;aspect-ratio:464/672;object-fit:cover;border:2.5px solid var(--ink);border-radius:3px 9px 9px 3px;box-shadow:5px 0 0 var(--ink);transform:rotate(-3deg);transition:transform .3s}
.lc:hover .lc-cover img{transform:rotate(0) translateY(-6px)}
.lc-card{background:#FFFBEA;border:2px solid var(--ink);border-radius:6px;padding:10px 12px;background-image:repeating-linear-gradient(transparent 0 27px,rgba(127,134,245,.35) 27px 28px);display:grid;gap:2px;font-size:.92rem;line-height:28px}
.lc-no{font-family:var(--brush);font-size:1rem;color:var(--red);line-height:1}
.lc-card b{font-size:1.15rem;line-height:1.25;font-weight:800}
.lc-row{display:flex;gap:6px}.lc-row span{color:var(--soft);font-weight:600;min-width:3.6em}.lc-row em{font-style:normal;font-family:var(--brush);font-size:1.12rem}
.lc-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px;line-height:1.2}
.lc-tags i{font-style:normal;font-size:.78rem;font-weight:700;border:2px solid var(--ink);border-radius:999px;padding:.12em .55em;background:var(--white)}
.lc-peek{position:absolute;right:14px;bottom:-16px;font-family:var(--brush);font-size:1.15rem;background:var(--lime);border:2.5px solid var(--ink);border-radius:10px;padding:.2em .6em .1em;transform:rotate(-4deg);box-shadow:3px 3px 0 var(--ink)}
.lc.empty{grid-template-columns:1fr;place-items:center;text-align:center;background:transparent;border-style:dashed;box-shadow:none;min-height:260px;gap:10px;padding:28px}
.lc.empty h3{margin:0;font-size:1.6rem}.lc.empty p{margin:0;font-weight:500;max-width:22em}
.lc.empty .zbtn{margin-top:6px}
/* plans */
.needs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.6vw,36px);max-width:1200px;margin:0 auto}
.need{background:var(--bg);border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:clamp(20px,2.4vw,30px);transform:rotate(var(--r));display:grid;gap:8px;align-content:start}
.need h3{margin:0;font-size:clamp(1.3rem,1.8vw,1.7rem);line-height:1.15}
.need p{margin:0;font-weight:500}
.need a{justify-self:start;margin-top:4px;color:var(--ink);font-weight:800;text-decoration:underline;text-decoration-thickness:2.5px;text-underline-offset:4px}
.why-row{max-width:900px;margin:clamp(34px,4vw,56px) auto 0;text-align:center}
.why-row p{margin:0;font-size:clamp(1.05rem,1.3vw,1.25rem);font-weight:500}
.plans3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,3vw,44px);max-width:1240px;margin:0 auto;align-items:start}
.plan{position:relative;background:var(--white);border:3px solid var(--ink);border-radius:22px;box-shadow:8px 8px 0 var(--ink);padding:16px 16px 24px;display:grid;gap:8px;transform:rotate(var(--r));transition:transform .3s cubic-bezier(.3,1.5,.5,1);scroll-margin-top:110px}
.plan:hover{transform:rotate(0) translateY(-6px)}
.pl-shot{border:2.5px solid var(--ink);border-radius:12px;overflow:hidden;margin-bottom:8px}
.pl-shot img{display:block;width:100%;aspect-ratio:10/7;object-fit:cover}
.pl-what{font-family:var(--brush);font-size:1.25rem;line-height:1;color:var(--soft)}
.plan h3{margin:0;font-size:clamp(1.6rem,2.2vw,2.1rem);line-height:1.05}
.plan p{margin:0;font-weight:500}
.plan ul,.pw-list{list-style:none;margin:6px 0 10px;padding:0;display:grid;gap:7px}
.plan li,.pw-list li{position:relative;padding-left:28px;font-weight:600;font-size:.98rem;line-height:1.4}
.plan li::before,.pw-list li::before{content:"";position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:50%;border:2px solid var(--ink);background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10l3.5 3.5L15 6' fill='none' stroke='%23171522' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/80% no-repeat}
.plan .zbtn{justify-self:start}
/* price tags */
.ptag{position:absolute;top:-22px;right:16px;z-index:3;display:grid;justify-items:center;background:var(--yellow);border:3px solid var(--ink);border-radius:10px 14px 14px 10px;box-shadow:4px 4px 0 var(--ink);padding:.4em .9em .45em 1.6em;transform:rotate(8deg);font-family:var(--hand);line-height:1;transform-origin:20% 50%;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.ptag::before{content:"";position:absolute;left:9px;top:50%;width:11px;height:11px;border:2.5px solid var(--ink);border-radius:50%;background:var(--white);transform:translateY(-50%)}
.ptag::after{content:"";position:absolute;left:-26px;top:calc(50% - 16px);width:36px;height:3px;background:var(--ink);transform:rotate(-38deg);transform-origin:right center;border-radius:2px}
.ptag small{font-family:var(--brush);font-size:1rem;font-weight:400}
.ptag b{font-weight:800;font-size:clamp(1.6rem,2.2vw,2.1rem)}
.plan:hover .ptag{transform:rotate(-4deg)}
.ptag-xl{position:relative;top:auto;right:auto;transform:rotate(-8deg);padding:.5em 1.1em .6em 2em}
.ptag-xl b{font-size:clamp(3rem,6vw,5.4rem)}.ptag-xl small{font-size:clamp(1.1rem,1.5vw,1.5rem)}
.ptag-xl::after{display:none}
.ptag-lg,.ptag-gift{position:relative;top:auto;right:auto;transform:rotate(-4deg)}
.ptag-lg::after,.ptag-gift::after{display:none}
.ptag-lg b,.ptag-gift b{font-size:clamp(2rem,3vw,2.8rem)}
.ptag-gift{background:var(--lime)}
/* wide plan */
.plan-wide{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(22px,3vw,44px);align-items:center;background:var(--purple);border:3px solid var(--ink);border-radius:28px;box-shadow:10px 10px 0 var(--ink);padding:clamp(18px,2.4vw,30px);max-width:1240px;margin:clamp(50px,6vw,80px) auto 0;scroll-margin-top:110px}
.pw-best{position:absolute;top:-20px;left:28px;font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.8rem);background:var(--yellow);border:2.5px solid var(--ink);border-radius:12px;padding:.15em .6em .05em;transform:rotate(-4deg);box-shadow:3px 3px 0 var(--ink)}
.pw-shot{border:3px solid var(--ink);border-radius:18px;overflow:hidden;background:var(--white)}
.pw-shot img{display:block;width:100%;height:auto}
.pw-body{display:grid;gap:8px}
.pw-body .pl-what{color:var(--ink)}
.pw-body h3{margin:0;font-size:clamp(2rem,3.4vw,3.2rem);line-height:1}
.pw-body p{margin:0;font-weight:500;font-size:1.05rem}
.pw-list{grid-template-columns:1fr 1fr;gap:8px 18px}
.pw-list li::before{background-color:var(--white)}
.pw-buy{display:flex;flex-wrap:wrap;align-items:center;gap:22px 28px;margin-top:6px}
/* gift */
.gift{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(20px,3vw,44px);align-items:center;background:var(--white);border:3px dashed var(--ink);border-radius:28px;padding:clamp(24px,3.4vw,48px);max-width:1240px;margin:clamp(50px,6vw,80px) auto 0;scroll-margin-top:110px;background-image:radial-gradient(rgba(255,68,48,.18) 2px,transparent 2.4px);background-size:26px 26px}
.gf-body{display:grid;gap:10px;justify-items:start}
.gf-kick{font-family:var(--brush);font-size:clamp(1.25rem,1.6vw,1.6rem);color:var(--red);line-height:1}
.gift h3{margin:0;font-size:clamp(2rem,3.4vw,3.2rem);line-height:1}
.gift p{margin:0;font-weight:500;font-size:1.05rem;max-width:36em}
.gf-buy{display:flex;flex-wrap:wrap;align-items:center;gap:20px 28px;margin-top:6px}
.gf-fine{color:var(--soft);font-weight:600;font-size:.88rem}
.gf-art{position:relative;min-height:clamp(260px,26vw,360px);display:grid;place-items:center}
.gf-ribbon{position:absolute;left:50%;top:50%;width:30px;height:clamp(170px,17vw,240px);transform:translate(-50%,-46%);background:var(--red);border-inline:3px solid var(--ink);z-index:5}
.gf-ribbon::after{content:"";position:absolute;left:50%;top:52%;width:clamp(250px,25vw,360px);height:30px;transform:translate(-50%,-50%);background:var(--red);border-block:3px solid var(--ink)}
.gf-bow{position:absolute;top:50%;left:50%;width:clamp(96px,9vw,124px);transform:translate(-50%,-62%) rotate(-6deg);z-index:6}
.gf-art img{position:absolute;width:clamp(100px,10vw,150px);border:3px solid var(--ink);border-radius:3px 9px 9px 3px;box-shadow:5px 5px 0 var(--ink)}
.gf-art .gb1{transform:translateX(-62%) rotate(-12deg);z-index:1}
.gf-art .gb2{transform:translateY(8%) rotate(2deg);z-index:2}
.gf-art .gb3{transform:translateX(62%) rotate(12deg);z-index:1}
/* tour spot on the plans page */
.tour-spot{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(16px,2.4vw,34px);background:var(--red);color:var(--ink);border:3px solid var(--ink);border-radius:26px;box-shadow:10px 10px 0 var(--ink);padding:clamp(22px,3vw,40px);text-decoration:none;max-width:1240px;margin:0 auto;transform:rotate(-.6deg);transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
.tour-spot:hover{transform:rotate(0) scale(1.01)}
.ts-star{font-size:clamp(2.6rem,4vw,4rem);color:var(--yellow);-webkit-text-stroke:2px var(--ink);animation:ntspin 8s linear infinite;display:inline-block;line-height:1}
.ts-copy{display:grid;gap:4px}
.ts-copy small{font-family:var(--brush);font-size:clamp(1.15rem,1.5vw,1.5rem);line-height:1}
.ts-copy b{font-size:clamp(1.6rem,2.8vw,2.6rem);line-height:1.05;font-weight:800}
.ts-copy > span{font-weight:500;max-width:46em}
.ts-copy em{font-style:normal;font-weight:800;background:var(--white);border-radius:6px;padding:0 .3em}
.ts-btn{background:var(--white);border:3px solid var(--ink);border-radius:14px;box-shadow:4px 4px 0 var(--ink);font-weight:800;padding:.65em 1.1em;white-space:nowrap;transform:rotate(2deg)}
.rules{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;max-width:1240px;margin:clamp(34px,4vw,56px) auto 0}
.rules div{border-top:3px solid var(--ink);padding-top:12px;display:grid;gap:4px}
.rules b{font-size:1.15rem}.rules span{color:var(--soft);font-weight:600;font-size:.95rem;line-height:1.45}
/* tour page */
.t-steps{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2.4vw,32px);max-width:1240px}
.t-steps li{background:var(--white);border:3px solid var(--ink);border-radius:20px;box-shadow:6px 6px 0 var(--ink);padding:clamp(18px,2.2vw,26px);transform:rotate(var(--r));display:grid;gap:6px;align-content:start}
.t-steps li > span{width:46px;height:46px;border-radius:50%;background:var(--red);color:var(--white);border:3px solid var(--ink);display:grid;place-items:center;font-weight:800;font-size:1.3rem}
.t-steps h3{margin:4px 0 0;font-size:1.35rem;line-height:1.15}.t-steps p{margin:0;font-weight:500;font-size:.98rem}
.t-board{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,380px);gap:clamp(20px,3vw,44px);align-items:start;max-width:1300px;margin:0 auto}
.t-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-bottom:18px}
.t-search{flex:1;min-width:220px}
.t-search input{width:100%;font:inherit;font-weight:600;font-size:1rem;padding:.7em 1em;border:3px solid var(--ink);border-radius:14px;background:var(--white);box-shadow:4px 4px 0 var(--ink)}
.t-search input:focus{outline:3px solid var(--yellow);outline-offset:2px}
.t-toggle{display:inline-flex;align-items:center;gap:8px;font-weight:700;cursor:pointer}
.t-toggle input{width:22px;height:22px;accent-color:var(--red)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.plates{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:12px}
.plate{position:relative;aspect-ratio:2/1.2;background:var(--white);border:3px solid var(--ink);border-radius:12px;box-shadow:3px 3px 0 var(--ink);display:grid;place-content:center;text-align:center;font-family:var(--hand);color:var(--ink);cursor:pointer;padding:4px;transition:transform .2s cubic-bezier(.3,1.7,.5,1),background .2s}
.plate::before{content:"";position:absolute;inset:4px;border:2px solid rgba(23,21,34,.25);border-radius:7px;pointer-events:none}
.pl-code{font-weight:800;font-size:clamp(1.4rem,1.8vw,1.75rem);line-height:1;letter-spacing:.04em}
.pl-name{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-top:4px;line-height:1.1}
.plate:not(.claimed):hover{transform:rotate(-4deg) translateY(-3px);background:var(--lime)}
.plate[aria-pressed="true"]{background:var(--yellow);transform:rotate(-3deg) scale(1.06);box-shadow:5px 5px 0 var(--ink);z-index:1}
.plate.claimed{background:#EFEEF3;color:#A3A1B0;border-color:#B9B7C4;box-shadow:none;cursor:not-allowed}
.plate.claimed .pl-code{text-decoration:line-through;text-decoration-thickness:3px;text-decoration-color:rgba(255,68,48,.7)}
.plate.claimed::after{content:"claimed";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-14deg);font-weight:800;text-transform:uppercase;font-size:.72rem;letter-spacing:.1em;color:var(--red);border:2.5px solid var(--red);border-radius:6px;padding:.05em .4em;background:rgba(255,255,255,.9)}
.plate.held{background:var(--lime)}
.plate.held::after{content:"yours, on hold";position:absolute;left:50%;bottom:-10px;transform:translateX(-50%) rotate(-3deg);font-family:var(--brush);font-size:.9rem;white-space:nowrap;background:var(--white);border:2px solid var(--ink);border-radius:8px;padding:0 .4em}
.t-empty{font-family:var(--brush);font-size:1.4rem;text-align:center}
.claim{position:sticky;top:96px;background:var(--white);border:3px solid var(--ink);border-radius:24px;box-shadow:8px 8px 0 var(--ink);padding:clamp(20px,2.4vw,28px);scroll-margin-top:96px}
.cl-empty{display:grid;gap:8px;text-align:center;justify-items:center;padding:16px 0}
.cl-arrow{font-family:var(--brush);font-size:1.3rem;background:var(--yellow);border:2.5px solid var(--ink);border-radius:10px;padding:.15em .6em;transform:rotate(-4deg)}
.cl-empty h3{margin:6px 0 0;font-size:1.6rem}.cl-empty p{margin:0;font-weight:500;color:var(--soft)}
.cl-form{display:grid;gap:12px}
.cl-state{justify-self:start;font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;background:var(--yellow);border:2.5px solid var(--ink);border-radius:999px;padding:.25em .8em;transform:rotate(-2deg)}
.cl-form h3{margin:0;font-size:clamp(1.5rem,2vw,1.9rem);line-height:1.1}
.cl-plans{border:0;margin:0;padding:0;display:grid;gap:8px}
.cl-plans legend{font-weight:700;margin-bottom:6px}
.cl-plans label{display:block;cursor:pointer}
.cl-plans input{position:absolute;opacity:0}
.cl-plans label span{display:flex;justify-content:space-between;align-items:center;border:2.5px solid var(--ink);border-radius:12px;padding:.55em .9em;font-weight:700;background:var(--white);transition:background .15s,transform .15s}
.cl-plans small{font-weight:600;color:var(--soft)}
.cl-plans input:checked + span{background:var(--lime);transform:rotate(-1deg)}
.cl-plans input:focus-visible + span{outline:3px solid var(--yellow);outline-offset:2px}
.cl-f{display:grid;gap:4px;font-weight:700;font-size:.95rem}
.cl-f em{font-style:normal;font-weight:500;color:var(--soft)}
.cl-f input{font:inherit;font-weight:500;padding:.6em .8em;border:2.5px solid var(--ink);border-radius:10px;background:var(--white)}
.cl-f input:focus{outline:3px solid var(--yellow);outline-offset:1px}
.cl-ok{display:flex;gap:10px;align-items:flex-start;font-weight:600;font-size:.95rem;cursor:pointer}
.cl-ok input{width:20px;height:20px;accent-color:var(--red);flex:none;margin-top:2px}
.cl-err{margin:0;color:#C2141A;font-weight:700;min-height:1.2em;font-size:.92rem}
.cl-form .zbtn{justify-self:stretch;background:var(--red);color:var(--white)}
.cl-done{display:grid;gap:10px;text-align:center;justify-items:center;padding:10px 0}
.cl-done b{font-size:1.6rem;line-height:1.1}.cl-done p{margin:0;font-weight:500}
.terms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,30px);max-width:1240px;margin:0 auto}
.tm{border:3px solid var(--ink);border-radius:18px;padding:clamp(18px,2vw,24px);background:var(--white);display:grid;gap:6px;align-content:start}
.tm:nth-child(2){background:#FFF6D6}
.tm h3{margin:0;font-size:1.25rem}.tm p{margin:0;font-weight:500;font-size:.96rem}
/* slide in page: form and office in the new style */
.pg .form-wrap{max-width:1240px;margin:0 auto}
.pg .zed{gap:14px}
.zed-from{font-family:var(--brush);font-size:1.3rem;line-height:1;transform:rotate(-2deg)}
.pg .bubble{background:var(--white);border:3px solid var(--ink);border-radius:20px;box-shadow:5px 5px 0 var(--ink);font-weight:600}
.pg .bubble::before{background:var(--white);border-left:3px solid var(--ink);border-top:3px solid var(--ink);top:-11px}
.next-up{margin:6px 0 0;padding:0;list-style:none;counter-reset:nx;display:grid;gap:8px}
.next-up li{counter-increment:nx;display:flex;gap:10px;align-items:center;font-weight:600}
.next-up li::before{content:counter(nx);width:30px;height:30px;flex:none;border-radius:50%;border:2.5px solid var(--ink);background:var(--yellow);display:grid;place-items:center;font-weight:800}
.pg form.fun{border:3px solid var(--ink);border-radius:26px;box-shadow:8px 8px 0 var(--ink)}
.pg form.fun legend{font-family:var(--hand);font-weight:800}
.pg .chip span{font-family:var(--hand);border:2.5px solid var(--ink)}
.pg .chip input:checked + span{background:var(--lime);color:var(--ink)}
.pg .field input,.pg .field textarea{border:2.5px solid var(--ink);border-radius:12px;font-family:var(--hand)}
.pg .pick .chip input:checked + span small{color:var(--ink)}
.pg .office{border:3px solid var(--ink);border-radius:26px;box-shadow:8px 8px 0 var(--ink);overflow:hidden;background:var(--white);max-width:1240px;margin:0 auto}
.pg .office .scene{display:block;width:100%;height:auto}
.pg .office-facts{max-width:1240px;margin:22px auto 0}
.pg .fund{max-width:1240px;margin:clamp(30px,4vw,50px) auto 0;background:var(--white);border:3px solid var(--ink);border-radius:26px;box-shadow:8px 8px 0 var(--ink);padding:clamp(20px,3vw,40px)}
.fund-copy{display:grid;gap:12px}
.fund-copy h3{margin:0;font-size:clamp(1.6rem,2.6vw,2.4rem)}.fund-copy p{margin:0;font-weight:500}
.pg .track{border:2.5px solid var(--ink);background:var(--white)}
.pg .track > div{background:var(--lime)}
.pg .faq{margin:0 auto;gap:14px}
.pg .faq details{border:3px solid var(--ink);border-radius:16px;background:var(--white);padding:0 20px;box-shadow:4px 4px 0 var(--ink)}
.pg .faq details[open]{background:#FFFBEA}
.pg .faq summary{font-family:var(--hand);font-weight:800}
.pg .faq summary::after{color:var(--ink)}
.pg .faq details p{color:var(--ink);font-weight:500}
.pg .faq a{color:var(--ink);font-weight:800;text-decoration-color:var(--red)}
/* responsive */
@media (max-width:1100px){.crew{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px}.t-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.terms{grid-template-columns:1fr 1fr}.rules{grid-template-columns:1fr 1fr}}
@media (max-width:980px){.t-board{grid-template-columns:1fr}.claim{position:static}.plans3{grid-template-columns:1fr;max-width:560px}.plan-wide,.gift{grid-template-columns:1fr}.gf-art{order:-1}.needs{grid-template-columns:1fr;max-width:620px}}
@media (max-width:860px){.pc-in{grid-template-columns:1fr}.pc-art{min-height:200px}.aiq-split{grid-template-columns:1fr;max-width:600px}.aiq-stamp{position:relative;left:auto;top:auto;transform:rotate(-10deg);justify-self:center;margin:-10px 0}
  .beats::before{left:28px}.beat{grid-template-columns:48px minmax(0,1fr);gap:12px}.bt-n{width:46px;height:46px}.bt-card{overflow-wrap:break-word}.bt-n{grid-column:1}.bt-card,.beat:nth-child(even) .bt-card{grid-column:2;transform:none}
  .tour-spot{grid-template-columns:1fr;justify-items:start}.ts-star{display:none}.p-band{flex-direction:column;align-items:flex-start}}
@media (max-width:600px){.pcover{border-radius:26px}.crew{grid-template-columns:1fr;max-width:340px}.t-steps,.terms,.rules{grid-template-columns:1fr}.pw-list{grid-template-columns:1fr}.lc{grid-template-columns:34% minmax(0,1fr);padding:12px;gap:10px}.lc-card{min-width:0;overflow-wrap:break-word;padding:8px 9px}.lc-row span{min-width:3em}
  .pc-note{font-size:1rem}.plates{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px}.pl-name{font-size:.6rem}}
@media (prefers-reduced-motion:reduce){.pc-badge,.pc-env,.ts-star{animation:none!important}}

[hidden]{display:none!important}
.pg{padding-bottom:clamp(70px,9vw,130px)}
@media (min-width:1181px){.pg{padding-bottom:max(170px,15vw)}}
.pg .office-facts b,.pg .meter .row span,.pg .fund-copy b,.pg .meters .or{color:var(--ink)}
.pg .office .status{color:var(--red)}.pg .office .status::before{background:var(--red)}
.pg .office .pin{color:var(--ink)}
.pg .progress .lbl,.pg .slider-out{color:var(--ink);font-family:var(--hand)}
.pg .slider-out{font-style:normal;font-family:var(--brush);font-size:1.4rem}
.pg input[type=range]{accent-color:var(--red)}
.pg .bar .fill{background:var(--lime)}

/* ===== REAL TALK page ===== */
.pc-lilac{--pc:var(--lilac);background-image:radial-gradient(circle at 20px 20px,rgba(255,255,255,.55) 3px,transparent 3.5px);background-size:40px 40px}
.rt-bubbles{min-height:clamp(220px,24vw,330px)}
.rtb{position:absolute;font-family:var(--hand);font-weight:700;font-size:clamp(.95rem,1.25vw,1.2rem);line-height:1.25;background:var(--white);border:3px solid var(--ink);border-radius:20px;box-shadow:5px 5px 0 var(--ink);padding:.7em 1em;max-width:15em}
.rtb::after{content:"";position:absolute;bottom:-14px;left:26px;width:22px;height:22px;background:inherit;border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);transform:rotate(45deg) skew(10deg,10deg)}
.rtb.b1{top:4%;left:0;transform:rotate(-4deg)}
.rtb.b2{top:44%;right:0;transform:rotate(3deg);background:var(--yellow)}
.rtb.b2::after{left:auto;right:30px}
.rtb.b3{bottom:2%;left:18%;font-size:clamp(1.8rem,3vw,2.6rem);padding:.15em .5em;background:var(--red);color:var(--white);transform:rotate(-8deg)}
.rt-vs{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(14px,2.4vw,34px);max-width:1100px;margin:0 auto}
.rv{border:3px solid var(--ink);border-radius:22px;padding:clamp(20px,2.4vw,30px);display:grid;gap:8px}
.rv p{margin:0;font-weight:600;font-size:clamp(1rem,1.2vw,1.15rem)}
.rv-tag{justify-self:start;font-family:var(--brush);font-size:1.3rem;line-height:1;border:2.5px solid var(--ink);border-radius:999px;padding:.2em .7em .1em;background:var(--white)}
.rv-them{background:#F3F3F6;border-style:dashed;border-color:#8C8A99;color:#6E6C7C;transform:rotate(-1.5deg)}
.rv-them .rv-tag{border-color:#8C8A99}
.rv-us{background:var(--lime);box-shadow:7px 7px 0 var(--ink);transform:rotate(1.2deg)}
.rv-or{font-family:var(--brush);font-size:clamp(1.5rem,2.2vw,2.2rem);background:var(--yellow);border:3px solid var(--ink);border-radius:50%;width:2.2em;height:2.2em;display:grid;place-items:center;box-shadow:3px 3px 0 var(--ink);transform:rotate(-8deg)}
.qs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.2vw,28px);max-width:1240px;margin:0 auto;align-items:start}
.q{background:var(--white);border:3px solid var(--ink);border-radius:20px;box-shadow:5px 5px 0 var(--ink);transition:transform .25s cubic-bezier(.3,1.5,.5,1)}
.q:nth-child(odd){transform:rotate(-.6deg)}.q:nth-child(even){transform:rotate(.6deg)}
.q:hover{transform:rotate(0) translateY(-3px)}
.q[open]{background:#FFFBEA}
.q summary{list-style:none;cursor:pointer;display:grid;gap:8px;padding:clamp(16px,2vw,24px);padding-right:56px;position:relative}
.q summary::-webkit-details-marker{display:none}
.q summary::after{content:"+";position:absolute;right:18px;top:18px;width:30px;height:30px;border:2.5px solid var(--ink);border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:1.2rem;line-height:1;background:var(--yellow);transition:transform .2s}
.q[open] summary::after{transform:rotate(45deg)}
.q-no{font-family:var(--brush);font-size:1.1rem;color:var(--red);line-height:1}
.q-text{font-weight:800;font-size:clamp(1.1rem,1.45vw,1.35rem);line-height:1.3}
.q-by{display:flex;align-items:center;gap:8px;font-size:.92rem;font-weight:600;color:var(--soft)}
.q-by b{color:var(--ink)}.q-by{min-width:0}.q-by span{min-width:0;overflow-wrap:anywhere}
.q-by i{font-style:normal;flex:none;width:32px;height:32px;border-radius:50%;background:var(--c);border:2.5px solid var(--ink);display:grid;place-items:center;font-weight:800;font-size:.75rem;color:var(--ink)}
.q-a{border-top:2.5px dashed rgba(23,21,34,.25);margin:0 clamp(16px,2vw,24px);padding:14px 0 clamp(16px,2vw,22px);display:grid;gap:6px}
.q-say{font-family:var(--brush);font-size:1.15rem;line-height:1}
.q-a p{margin:0;font-weight:500}
.q-a a{color:var(--ink);font-weight:800;text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:3px}
.ask{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,64px);align-items:center;max-width:1240px;margin:0 auto}
.ask-copy{display:grid;gap:12px;justify-items:start}
.ask-copy h2{margin:0;font-size:clamp(2rem,3.6vw,3.4rem);line-height:1.1}
.ask-copy p{margin:0;font-weight:500;font-size:clamp(1.02rem,1.25vw,1.2rem)}
.ask-perks{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:8px}
.ask-perks li{display:flex;gap:10px;align-items:center;font-weight:700}
.ask-perks li::before{content:"★";color:var(--yellow);-webkit-text-stroke:1.5px var(--ink);font-size:1.3rem;line-height:1}
.ask-form,.ask-done{background:var(--white);border:3px solid var(--ink);border-radius:26px;box-shadow:8px 8px 0 var(--ink);padding:clamp(20px,2.6vw,32px);display:grid;gap:14px;transform:rotate(.8deg)}
.ask-form textarea{font:inherit;font-weight:500;padding:.7em .8em;border:2.5px solid var(--ink);border-radius:12px;resize:vertical;background:#FFFBEA}
.ask-form textarea:focus{outline:3px solid var(--yellow);outline-offset:1px}
.ask-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ask-form .zbtn{justify-self:start}
.ask-done{text-align:center;justify-items:center}.ask-done b{font-size:1.6rem}.ask-done p{margin:0;font-weight:500}
.rt-hint{text-align:center;margin:clamp(28px,3.4vw,44px) 0 0;font-weight:600;font-size:1.05rem}
.rt-hint a{color:var(--ink);font-weight:800;text-decoration-color:var(--red);text-decoration-thickness:2.5px;text-underline-offset:4px}
@media (max-width:980px){.qs{grid-template-columns:1fr;max-width:720px}.ask{grid-template-columns:1fr;max-width:640px}}
@media (max-width:760px){.rt-vs{grid-template-columns:1fr;max-width:520px}.rv-or{justify-self:center}}
@media (max-width:520px){.ask-row{grid-template-columns:1fr}.rtb{max-width:12em}}
@media (max-width:420px){.lc{grid-template-columns:1fr;padding:16px 16px 26px}.lc-cover{width:52%;justify-self:center}}

/* no lonely last words: balanced headings, pretty paragraphs */
h1,h2,h3,h4{text-wrap:balance}
p,li,dd,summary,figcaption,label,blockquote,.q-text,.bt-card p{text-wrap:pretty}
.nw{white-space:nowrap}
.ft-cols span .nw{display:inline;padding:0}
@media (max-width:860px){.tour-spot{grid-template-columns:minmax(0,1fr)}}@media (max-width:420px){.ts-btn{white-space:normal;text-align:center}}

/* ================= HOME ENERGY PASS ================= */
/* About: one big statement */
.ai-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:700px){.ai-cols{grid-template-columns:1fr}}
.ai-big{margin-top:clamp(34px,4.4vw,64px);display:grid;gap:8px;max-width:1150px}
.ai-big-k{font-family:var(--brush);font-size:clamp(1.4rem,2vw,2rem);line-height:1;color:var(--ink);transform:rotate(-2deg);justify-self:start}
.ai-big p{margin:0;font-family:var(--hand);font-weight:800;font-size:clamp(1.9rem,4.3vw,4.2rem);line-height:1.12;letter-spacing:-.02em;color:var(--ink);text-wrap:balance}
.ai-dream{margin-top:clamp(16px,1.8vw,24px)!important;font-size:clamp(1.1rem,1.4vw,1.35rem);max-width:40em}

/* giant chapter numbers */
.c1{overflow-x:clip}
.ch-big{display:none!important}
.c1-in,.c2-in,.c3-in{position:relative;z-index:1}
.ch-big{position:absolute;top:clamp(-10px,-1vw,0px);z-index:0;font-family:var(--hand);font-weight:800;font-size:clamp(8rem,24vw,24rem);line-height:.8;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:3px rgba(23,21,34,.16);pointer-events:none;user-select:none}
.c2 .ch-big{-webkit-text-stroke-color:rgba(255,255,255,.4)}
.cb-l{left:-.08em}.cb-r{right:-.06em}
@media (max-width:700px){.ch-big{font-size:9rem;-webkit-text-stroke-width:2.5px}.cb-l{left:auto;right:-.05em}}

/* pencil reading progress, home page only */
.pencil-bar{position:absolute;left:0;top:calc(100% + 3px);height:22px;width:100%;z-index:70;pointer-events:none;opacity:0;transition:opacity .3s}
body.on-home .pencil-bar.show{opacity:1}
.pb-line{position:absolute;left:0;top:9px;height:5px;width:var(--pb,0%);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 6'%3E%3Cpath d='M0 3C6 1 12 5 20 3S34 1 40 3' stroke='%23171522' stroke-width='2.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") left center/40px 6px repeat-x}
.pb-pencil{position:absolute;top:0;left:max(0px,calc(var(--pb,0%) - 56px));width:56px;height:22px}

@media (prefers-reduced-motion:no-preference){
  /* ---------- hero, plays on load ---------- */
  .hz-copy h1 .hl{background-position:left center;animation:hlSwipe .6s cubic-bezier(.6,0,.2,1) .35s both}
  .hz-note{animation:popIn .5s cubic-bezier(.3,1.7,.5,1) .95s both}
  .hz-copy p .x{background-position:left center;animation:strike .38s ease-out both}
  .hz-copy p .x:nth-of-type(1){animation-delay:1.15s}
  .hz-copy p .x:nth-of-type(2){animation-delay:1.6s}
  .hz-copy p .x:nth-of-type(3){animation-delay:2.05s}
  .hz-copy p .ul{animation:underline .6s ease-out 2.6s both}
  .btn.hz-try{animation:tryBounce 4.5s ease-in-out 3.3s infinite}
  .btn.hz-try:hover,.btn.hz-try:focus-visible{animation:none}
  @keyframes hlSwipe{from{background-size:0% 100%}to{background-size:100% 100%}}
  @keyframes strike{from{background-size:0% .6em}to{background-size:100% .6em}}
  @keyframes underline{from{background-size:0% .42em}to{background-size:100% .42em}}
  @keyframes popIn{from{opacity:0;scale:.6}to{opacity:1;scale:1}}
  @keyframes tryBounce{0%,78%,100%{translate:0 0;rotate:0deg}84%{translate:0 -10px;rotate:-3deg}90%{translate:0 0;rotate:0deg}95%{translate:0 -4px;rotate:1.5deg}}
  .hz-art,.hz-clouds{transition:translate .6s cubic-bezier(.2,.8,.3,1)}
  .hz-art{translate:calc(var(--mx,0) * -14px) calc(var(--my,0) * -8px)}
  .hz-clouds{translate:calc(var(--mx,0) * 8px) calc(var(--my,0) * 5px)}

  /* ---------- scroll reveals (only when JS is running) ---------- */
  html.rv-on [data-rv]{transition:opacity .7s ease,translate .8s cubic-bezier(.2,.8,.25,1)}
  html.rv-on [data-rv]:not(.in){opacity:0;translate:0 34px}
  html.rv-on .c1-cards[data-rv],html.rv-on .c2-board[data-rv],html.rv-on .c3-shop[data-rv],html.rv-on .zend-choices[data-rv]{opacity:1;translate:none}

  /* about */
  html.rv-on .ai-big .hl,html.rv-on .ai-body .ul{background-position:left center}
  html.rv-on .ai-body .ul{background-position:left bottom}
  html.rv-on .ai-big:not(.in) .hl{background-size:0% 100%}
  html.rv-on .ai-big .hl{transition:background-size .8s cubic-bezier(.6,0,.2,1) .45s}
  html.rv-on .ai-cols:not(.in) .ul{background-size:0% .42em}
  html.rv-on .ai-cols .ul{transition:background-size .7s ease-out .7s}
  html.rv-on .ai-sign b{display:inline-block;clip-path:inset(-10% 100% -10% 0);transition:clip-path 1.3s steps(14,end) .5s}
  html.rv-on .ai-sign.in b{clip-path:inset(-10% -5% -10% 0)}

  /* chapter numbers drift in */
  html.rv-on .ch-big{opacity:0;translate:0 40px;transition:opacity 1s ease,translate 1.2s cubic-bezier(.2,.8,.25,1)}
  html.rv-on .ch-big.in{opacity:1;translate:0 0}

  /* chapter one: cards drop, stamps slam, plot twist pops */
  html.rv-on .c1-card{opacity:0;translate:0 -60px;transition:opacity .45s ease,translate .7s cubic-bezier(.3,1.5,.5,1)}
  html.rv-on .c1-cards.in .c1-card{opacity:1;translate:0 0}
  html.rv-on .c1-cards.in .c1-card:nth-child(2){transition-delay:.18s}
  html.rv-on .c1-cards.in .c1-card:nth-child(3){transition-delay:.36s}
  html.rv-on .c1-cards.in .c1-card:nth-child(4){transition-delay:.9s}
  html.rv-on .c1-card.no .c1-stamp{opacity:0}
  html.rv-on .c1-cards.in .c1-card.no .c1-stamp{animation:slam .38s cubic-bezier(.5,0,.75,0) forwards}
  html.rv-on .c1-cards.in .c1-card:nth-child(1) .c1-stamp{animation-delay:.6s}
  html.rv-on .c1-cards.in .c1-card:nth-child(2) .c1-stamp{animation-delay:.85s}
  html.rv-on .c1-cards.in .c1-card:nth-child(3) .c1-stamp{animation-delay:1.1s}
  html.rv-on .c1-cards.in .c1-card.no{animation:thud .3s ease-out both}
  html.rv-on .c1-cards.in .c1-card:nth-child(1){animation-delay:.92s}
  html.rv-on .c1-cards.in .c1-card:nth-child(2){animation-delay:1.17s}
  html.rv-on .c1-cards.in .c1-card:nth-child(3){animation-delay:1.42s}
  html.rv-on .c1-twist{opacity:0;scale:.3}
  html.rv-on .c1-cards.in .c1-twist{animation:popIn .5s cubic-bezier(.3,1.8,.5,1) 1.6s forwards}
  @keyframes slam{0%{opacity:0;scale:2.6}70%{opacity:1;scale:.92}100%{opacity:.92;scale:1}}
  @keyframes thud{0%,100%{translate:0 0}30%{translate:-3px 2px}60%{translate:3px -1px}}

  /* chapter two: polaroids slide in, tape sticks, circle draws, notes flutter */
  html.rv-on .c2-head .circ path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1s cubic-bezier(.6,0,.3,1) .5s}
  html.rv-on .c2-head.in .circ path{stroke-dashoffset:0}
  html.rv-on .c2-item .c2-pola{opacity:0;translate:0 70px;rotate:-10deg;transition:opacity .5s ease,translate .8s cubic-bezier(.3,1.4,.5,1),rotate .8s cubic-bezier(.3,1.4,.5,1)}
  html.rv-on .c2-item:nth-child(2) .c2-pola{rotate:9deg}
  html.rv-on .c2-board.in .c2-pola{opacity:1;translate:0 0;rotate:0deg}
  html.rv-on .c2-board.in .c2-item:nth-child(2) .c2-pola{transition-delay:.2s}
  html.rv-on .c2-board.in .c2-item:nth-child(3) .c2-pola{transition-delay:.4s}
  html.rv-on .c2-pola .c2-tape{scale:0 1;transition:scale .35s cubic-bezier(.3,1.6,.5,1)}
  html.rv-on .c2-board.in .c2-item:nth-child(1) .c2-tape{scale:1 1;transition-delay:.75s}
  html.rv-on .c2-board.in .c2-item:nth-child(2) .c2-tape{scale:1 1;transition-delay:.95s}
  html.rv-on .c2-board.in .c2-item:nth-child(3) .c2-tape{scale:1 1;transition-delay:1.15s}
  html.rv-on .c2-item h3,html.rv-on .c2-item p{opacity:0;transition:opacity .6s ease .6s}
  html.rv-on .c2-board.in .c2-item h3,html.rv-on .c2-board.in .c2-item p{opacity:1}
  html.rv-on .c2-note{opacity:0;rotate:-24deg;scale:.6;transform-origin:50% 0}
  html.rv-on .c2-board.in .c2-note{animation:flutter .9s cubic-bezier(.3,1.5,.5,1) forwards}
  html.rv-on .c2-board.in .c2-item:nth-child(1) .c2-note{animation-delay:1.25s}
  html.rv-on .c2-board.in .c2-item:nth-child(2) .c2-note{animation-delay:1.45s}
  html.rv-on .c2-board.in .c2-item:nth-child(3) .c2-note{animation-delay:1.65s}
  @keyframes flutter{0%{opacity:0;rotate:-24deg;scale:.6}45%{opacity:1;rotate:10deg;scale:1.05}70%{rotate:-5deg;scale:1}100%{opacity:1;rotate:0deg;scale:1}}

  /* chapter three: books slide onto the shelf, notes swing, awning flaps */
  html.rv-on .c3-book .bk{opacity:0;translate:-60px 0;transition:opacity .4s ease,translate .7s cubic-bezier(.3,1.4,.5,1)}
  html.rv-on .c3-shop.in .c3-book .bk{opacity:1;translate:0 0}
  html.rv-on .c3-book .bk-talker{opacity:0;rotate:-28deg;transform-origin:50% -12px;transition:opacity .3s ease,rotate .9s cubic-bezier(.3,1.9,.5,1)}
  html.rv-on .c3-shop.in .c3-book .bk-talker{opacity:1;rotate:0deg}
  html.rv-on .c3-shop.in .c3-book:nth-child(1) .bk{transition-delay:.15s}html.rv-on .c3-shop.in .c3-book:nth-child(1) .bk-talker{transition-delay:.55s}
  html.rv-on .c3-shop.in .c3-book:nth-child(2) .bk{transition-delay:.27s}html.rv-on .c3-shop.in .c3-book:nth-child(2) .bk-talker{transition-delay:.67s}
  html.rv-on .c3-shop.in .c3-book:nth-child(3) .bk{transition-delay:.39s}html.rv-on .c3-shop.in .c3-book:nth-child(3) .bk-talker{transition-delay:.79s}
  html.rv-on .c3-shop.in .c3-book:nth-child(4) .bk{transition-delay:.51s}html.rv-on .c3-shop.in .c3-book:nth-child(4) .bk-talker{transition-delay:.91s}
  html.rv-on .c3-shop.in .c3-book:nth-child(5) .bk{transition-delay:.63s}html.rv-on .c3-shop.in .c3-book:nth-child(5) .bk-talker{transition-delay:1.03s}
  html.rv-on .c3-shop.in .c3-book:nth-child(6) .bk{transition-delay:.75s}html.rv-on .c3-shop.in .c3-book:nth-child(6) .bk-talker{transition-delay:1.15s}
  html.rv-on .c3-shop.in .c3-awning{animation:flap 1.1s ease-in-out .1s}
  html.rv-on .c3-sign{transition:rotate .6s cubic-bezier(.3,1.8,.5,1) .3s}
  html.rv-on .c3-shop:not(.in) .c3-sign{rotate:-14deg}
  @keyframes flap{0%,100%{scale:1 1}30%{scale:1 1.18}60%{scale:1 .94}}

  /* the end: best ending glows */
  html.rv-on .zend-choices.in .yay:not(.nudge){animation:glow 1.6s ease-out .6s 3}
  @keyframes glow{0%{box-shadow:10px 10px 0 var(--ink),0 0 0 0 rgba(255,212,0,.85)}100%{box-shadow:10px 10px 0 var(--ink),0 0 0 26px rgba(255,212,0,0)}}

  /* tiny confetti burst on the Plan Z card */
  .zburst{position:absolute;width:12px;height:12px;border:2px solid var(--ink);border-radius:3px;left:50%;top:30%;pointer-events:none;z-index:5;animation:burst .9s cubic-bezier(.2,.7,.3,1) forwards}
  @keyframes burst{0%{translate:0 0;rotate:0deg;opacity:1}100%{translate:var(--bx) var(--by);rotate:var(--br);opacity:0}}
}

/* ===== Team Z cards ===== */
.tz{display:grid;gap:clamp(40px,5vw,72px);max-width:1280px;margin:0 auto}
.tz-row{display:grid;gap:18px;justify-items:center}
.tz-label{font-family:var(--brush);font-size:clamp(1.5rem,2.2vw,2.1rem);line-height:1;background:var(--white);border:3px solid var(--ink);border-radius:999px;padding:.25em .9em .15em;box-shadow:4px 4px 0 var(--ink);transform:rotate(-2deg)}
.tz-row:nth-child(2) .tz-label{transform:rotate(2deg);background:var(--yellow)}
.tz-row:nth-child(3) .tz-label{background:var(--lime)}
.tz-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.2vw,32px);width:100%}
.tz-row.big .tz-cards{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1060px}
.tmc{display:flex;flex-direction:column;background:var(--tc);border:3px solid var(--ink);border-radius:26px;overflow:hidden;box-shadow:7px 7px 0 var(--ink);transform:rotate(var(--r));transition:transform .3s cubic-bezier(.3,1.5,.5,1),box-shadow .3s}
.tmc:hover{transform:rotate(0) translateY(-6px);box-shadow:10px 12px 0 var(--ink)}
.tm-photo{aspect-ratio:5/4;overflow:hidden;background:var(--tc)}
.tm-photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.3,1,.4,1)}
.tmc:hover .tm-photo img{transform:scale(1.05)}
.tm-body{position:relative;flex:1;padding:clamp(14px,1.6vw,22px) clamp(16px,1.6vw,22px) clamp(18px,1.8vw,24px);display:grid;gap:4px;align-content:start;background:var(--tc)}
.tm-wave{position:absolute;left:0;bottom:calc(100% - 1px);width:100%;height:clamp(16px,1.6vw,22px);fill:var(--tc)}
.tm-role{font-family:var(--brush);font-size:clamp(1.05rem,1.2vw,1.2rem);line-height:1.1;color:var(--soft)}
.tmc h3{margin:0;font-size:clamp(1.4rem,1.8vw,1.75rem);line-height:1.05}
.tmc p{margin:4px 0 0;font-size:clamp(.92rem,1vw,1rem);line-height:1.5;font-weight:500}
.tz-row.big .tmc h3{font-size:clamp(1.6rem,2.2vw,2.1rem)}
.tz-row.big .tmc p{font-size:clamp(.98rem,1.1vw,1.08rem)}
@media (max-width:1100px){.tz-cards{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px}.tz-row.big .tz-cards{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}}
@media (max-width:820px){.tz-row.big .tz-cards{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px}.tz-row.big .tmc:last-child{grid-column:1/-1;max-width:calc(50% - 12px);justify-self:center;width:100%}}
@media (max-width:540px){.tz-cards,.tz-row.big .tz-cards{gap:14px;max-width:none}.tz-row.big .tmc:last-child{max-width:calc(50% - 7px)}.tmc{border-radius:18px;border-width:2.5px;box-shadow:4px 4px 0 var(--ink)}.tm-body{padding:10px 11px 14px;gap:2px}.tm-role{font-size:.95rem}.tmc h3,.tz-row.big .tmc h3{font-size:1.2rem}.tmc p,.tz-row.big .tmc p{font-size:.8rem;line-height:1.42}.tm-wave{height:12px}}

/* line-art portraits sit on the card tint */
.tm-photo{background:color-mix(in srgb,var(--tc) 55%,#fff)}
.tm-photo img.ink{mix-blend-mode:multiply;object-fit:cover;object-position:50% 2%}
.tmc h3{overflow-wrap:break-word;text-wrap:balance}
.tmc.cat .tm-role::before{content:"🐾 "}
.tmc h3{font-size:clamp(1.2rem,1.5vw,1.5rem)!important;hyphens:manual}
.tz-row.big .tmc h3{font-size:clamp(1.35rem,1.9vw,1.85rem)!important}
@media (max-width:540px){.tmc h3,.tz-row.big .tmc h3{font-size:1.05rem!important}}
.tmc h3 .nick{display:inline-block;font-family:var(--brush);font-weight:400;font-size:.9em;margin-left:.35em;transform:rotate(-3deg);color:var(--ink);white-space:nowrap}

/* ===== Our Story banner: the crew lives inside the panel ===== */
.story-hero{position:relative}
.story-hero .sh-panel{margin-inline:max(var(--gut),calc((100% - 1560px) / 2))}

.sh-panel{--px:clamp(22px,5vw,80px);padding:clamp(40px,5vw,80px) var(--px) 0;overflow:hidden}
.sh-top{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);align-items:end;gap:clamp(20px,4vw,64px);max-width:1240px;margin:0 auto}
.sh-l{display:grid;justify-items:start;gap:clamp(12px,1.4vw,18px)}
.sh-l .ch-eyebrow{justify-content:flex-start}
.sh-l h1{margin:0;font-size:clamp(2.4rem,5.2vw,5.4rem);line-height:1.04;text-wrap:balance}
.sh-r{display:grid;gap:14px;justify-items:start;padding-bottom:.5em}
.sh-r p{margin:0;font-size:clamp(1.05rem,1.3vw,1.25rem);font-weight:600;line-height:1.55}
.sh-link{display:inline-flex;align-items:flex-start;gap:6px;font-family:var(--brush);font-size:clamp(1.5rem,2vw,2rem);line-height:1;color:var(--ink);text-decoration:none;transform:rotate(-3deg);transition:transform .2s cubic-bezier(.3,1.7,.5,1)}
.sh-link svg{width:2.1em;height:1.65em;margin-top:.35em}
.sh-link:hover{transform:rotate(0) translateY(-2px)}
.sh-stage{position:relative;margin:clamp(14px,2vw,30px) calc(var(--px) * -1) 0;display:flex;justify-content:center}
.sh-stage::before{content:"";position:absolute;left:50%;bottom:-22%;width:min(1300px,110%);aspect-ratio:2.6;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.34),rgba(255,255,255,.12) 60%,transparent)}
.sh-stage img{position:relative;display:block;width:100%;max-width:none;flex:none;height:auto}
@media (prefers-reduced-motion:no-preference){
  .sh-stage img{animation:crewUp .9s cubic-bezier(.25,1.3,.5,1) .15s both}
  @keyframes crewUp{from{opacity:0;translate:0 50px}to{opacity:1;translate:0 0}}
}
@media (max-width:860px){.sh-top{grid-template-columns:1fr;gap:16px;align-items:start}.sh-r{padding-bottom:0}}
@media (max-width:600px){.sh-stage img{width:132%}}

/* ===== OUR STORY v2 ===== */
.sp-sec{position:relative;overflow-x:clip}
.sp-sec > .wrap{position:relative;z-index:1}
.sp-sec .ch-big{top:clamp(10px,2vw,30px)}
/* 1. story as a horizontal timeline */
.beats{max-width:1500px;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.4vw,36px);align-items:start}
.beats::before{left:5%;right:5%;top:28px;bottom:auto;border-left:0;border-top:3px dashed rgba(23,21,34,.35);transform:none}
.beat{grid-template-columns:1fr;justify-items:center;gap:18px}
.beat .bt-n,.beat .bt-card,.beat:nth-child(even) .bt-card{grid-column:1;grid-row:auto}
.beat .bt-card{width:100%;transform:rotate(-1.4deg)}
.beat:nth-child(even) .bt-card{transform:rotate(1.4deg) translateY(18px)}
@media (max-width:1100px){.beats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px;max-width:820px}.beats::before{display:none}.beat:nth-child(even) .bt-card{transform:rotate(1.4deg)}}
@media (max-width:600px){.beats{grid-template-columns:1fr;max-width:460px}.beat{grid-template-columns:48px minmax(0,1fr);justify-items:stretch;align-items:start;gap:12px}.beat .bt-n{grid-column:1}.beat .bt-card,.beat:nth-child(even) .bt-card{grid-column:2;transform:none}}
/* 2. team rows without labels */
.tz{gap:clamp(26px,3vw,44px)}
/* 3. the showdown */
.vs-sec{background:var(--yellow);background-image:repeating-conic-gradient(from 0deg at 50% 46%,rgba(255,255,255,.28) 0 6deg,transparent 6deg 12deg);padding-block:clamp(60px,7vw,110px);border-block:3px solid var(--ink)}
.vs-mini{display:inline-block;font-family:var(--brush);font-weight:400;font-size:.62em;background:var(--red);color:var(--white);border:3px solid var(--ink);border-radius:50%;width:1.9em;height:1.9em;line-height:1.85em;text-align:center;transform:rotate(-10deg);vertical-align:.12em}
.fighters{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:clamp(14px,2.6vw,40px);max-width:1180px;margin:0 auto}
.fighter{position:relative;background:var(--white);border:3px solid var(--ink);border-radius:26px;box-shadow:8px 8px 0 var(--ink);padding:clamp(22px,2.6vw,34px);display:grid;justify-items:center;text-align:center;gap:10px}
.f-z{transform:rotate(-1.5deg)}.f-r{transform:rotate(1.5deg);background:#EEF0F4}
.f-corner{position:absolute;top:-18px;left:50%;transform:translateX(-50%) rotate(-3deg);font-family:var(--brush);font-size:1.25rem;line-height:1;white-space:nowrap;background:var(--lime);border:2.5px solid var(--ink);border-radius:999px;padding:.25em .8em .15em}
.f-r .f-corner{background:#C9CCD6;transform:translateX(-50%) rotate(3deg)}
.f-faces{display:flex;justify-content:center;margin-top:8px}
.f-faces img{width:clamp(64px,7vw,92px);aspect-ratio:1;object-fit:cover;object-position:50% 8%;border-radius:50%;border:3px solid var(--ink);background:#FFF4F0;margin-left:-16px;box-shadow:3px 3px 0 var(--ink)}
.f-faces img:first-child{margin-left:0}
.f-faces img:nth-child(2){background:#FFFBEA}.f-faces img:nth-child(3){background:#F4FBEE}.f-faces img:nth-child(4){background:#F4F5FF}
.f-bot{height:clamp(96px,10vw,128px);display:grid;place-items:center;margin-top:8px}
.f-bot .bot{height:100%;width:auto}
.fighter h3{margin:0;font-size:clamp(1.8rem,2.8vw,2.6rem);line-height:1}
.f-stats{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:6px;font-weight:600;font-size:clamp(.95rem,1.05vw,1.05rem)}
.f-stats b{display:block;font-family:var(--brush);font-weight:400;font-size:1.05em;color:var(--soft);line-height:1.1}
.vs-badge{font-family:var(--hand);font-weight:800;font-size:clamp(2.2rem,4vw,3.6rem);line-height:1;color:var(--white);background:var(--red);border:4px solid var(--ink);border-radius:50%;width:2.1em;height:2.1em;display:grid;place-items:center;box-shadow:6px 6px 0 var(--ink);transform:rotate(-10deg)}
/* race */
.race{position:relative;max-width:1180px;margin:clamp(44px,5vw,70px) auto 0;background:var(--white);border:3px solid var(--ink);border-radius:24px;box-shadow:8px 8px 0 var(--ink);padding:clamp(18px,2.4vw,28px) clamp(16px,2.4vw,28px);display:grid;gap:14px}
.lane{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px}
.lane-tag{font-family:var(--brush);font-size:clamp(1.15rem,1.6vw,1.5rem);line-height:1;width:4.2em}
.track{position:relative;height:clamp(54px,6vw,70px);border-radius:999px;background:repeating-linear-gradient(90deg,#F2F3FE 0 40px,#E6E8FB 40px 80px);border:2.5px solid var(--ink);margin-right:clamp(44px,5vw,64px)}
.runner{position:absolute;top:50%;left:4px;width:clamp(46px,5vw,60px);height:clamp(46px,5vw,60px);translate:0 -50%}
.runner svg{width:100%;height:100%;display:block;filter:drop-shadow(2px 2px 0 #171522)}
.finish{position:absolute;top:clamp(14px,2vw,24px);bottom:clamp(14px,2vw,24px);right:clamp(16px,2.4vw,28px);width:clamp(30px,3.6vw,44px);border:2.5px solid var(--ink);border-radius:8px;background:conic-gradient(#171522 25%,#fff 0 50%,#171522 0 75%,#fff 0) 0 0/16px 16px}
.err{position:absolute;bottom:105%;left:50%;translate:-50% 0;white-space:nowrap;font-family:var(--brush);font-size:clamp(.95rem,1.2vw,1.15rem);line-height:1;background:var(--white);border:2.5px solid var(--ink);border-radius:10px;padding:.25em .55em .15em;opacity:0;scale:.6}
.smoke{position:absolute;top:-6px;left:10%;width:70%;height:20px;border-radius:50%;background:radial-gradient(circle at 30% 60%,rgba(120,120,130,.55) 0 30%,transparent 32%),radial-gradient(circle at 70% 40%,rgba(120,120,130,.45) 0 26%,transparent 28%);opacity:0}
.trophy{position:absolute;right:clamp(4px,1vw,12px);top:-22px;font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.7rem);line-height:1;background:var(--lime);border:3px solid var(--ink);border-radius:12px;box-shadow:3px 3px 0 var(--ink);padding:.2em .6em .1em;transform:rotate(6deg)}
/* default (no animation) end state */
.rz{left:calc(100% - clamp(46px,5vw,60px) - 4px)}
.rr{left:58%}
.rr .err{opacity:1;scale:1}
/* scorecard */
.score{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:clamp(20px,3vw,44px);max-width:1180px;margin:clamp(40px,5vw,64px) auto 0;align-items:start}
.rounds{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.rd{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;background:var(--white);border:3px solid var(--ink);border-radius:16px;padding:12px 16px;box-shadow:4px 4px 0 var(--ink)}
.rd-n{font-family:var(--brush);font-size:1.15rem;line-height:1;color:var(--soft);white-space:nowrap}
.rd-t{font-weight:700;font-size:clamp(1rem,1.15vw,1.1rem);line-height:1.3}
.rd-t small{display:block;font-family:var(--brush);font-weight:400;font-size:1.02rem;color:var(--soft)}
.rd-win{font-weight:800;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;border:2.5px solid var(--ink);border-radius:8px;padding:.3em .6em;white-space:nowrap;transform:rotate(-4deg)}
.rd-win.z{background:var(--lime)}
.rd-win.r{background:#C9CCD6}
.final{position:sticky;top:110px;background:var(--ink);color:var(--white);border:3px solid var(--ink);border-radius:24px;box-shadow:8px 8px 0 var(--red);padding:clamp(22px,2.6vw,32px);display:grid;gap:12px;text-align:center;transform:rotate(1.2deg)}
.fin-k{font-family:var(--brush);font-size:1.4rem;line-height:1;color:var(--yellow)}
.fin-n{display:flex;justify-content:center;align-items:center;gap:14px}
.fin-n span{display:grid;font-weight:700;font-size:1rem;line-height:1.2}
.fin-n b{font-size:clamp(3.2rem,5vw,4.6rem);line-height:1;font-weight:800}
.fin-n span:first-child b{color:var(--lime)}
.fin-n span:last-child{opacity:.7}
.fin-n i{font-style:normal;font-weight:800;font-size:2.6rem}
.final p{margin:0;font-weight:600;line-height:1.5}
.final small{font-family:var(--brush);font-size:1.1rem;color:#C1C5FA;line-height:1.2}
@media (max-width:900px){.fighters{grid-template-columns:1fr;max-width:520px;gap:28px}.vs-badge{justify-self:center;margin:-6px 0}.score{grid-template-columns:1fr;max-width:620px}.final{position:static}}
@media (max-width:600px){.rd{grid-template-columns:minmax(0,1fr) auto;gap:6px 10px}.rd-n{grid-column:1/-1}.lane{grid-template-columns:1fr;gap:4px}.lane-tag{width:auto}.trophy{top:-18px}.err{left:auto;right:-10px;bottom:auto;top:calc(100% + 4px);translate:0 0;font-size:.9rem}.race{padding-bottom:40px}.track{margin-right:40px}.finish{width:26px}}

/* ===== story page motion (only when JS adds rv-on) ===== */
@media (prefers-reduced-motion:no-preference){
  .view:not([hidden]) .sh-l .circ path{stroke-dasharray:1;stroke-dashoffset:1;animation:drawC 1s cubic-bezier(.6,0,.3,1) .5s forwards}
  @keyframes drawC{to{stroke-dashoffset:0}}
  .view:not([hidden]) .sh-l h1,.view:not([hidden]) .sh-l .ch-eyebrow{animation:riseIn .7s cubic-bezier(.2,.8,.25,1) both}
  .view:not([hidden]) .sh-r{animation:riseIn .7s cubic-bezier(.2,.8,.25,1) .25s both}
  .view:not([hidden]) .sh-link svg{animation:nudgeDown 1.8s ease-in-out 1.4s infinite}
  @keyframes riseIn{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
  @keyframes nudgeDown{0%,100%{translate:0 0}50%{translate:4px 6px}}
  html.rv-on .p-head:not(.in) .hl{background-size:0% 100%}
  html.rv-on .p-head .hl{background-position:left center;transition:background-size .8s cubic-bezier(.6,0,.2,1) .35s}
  /* timeline */
  html.rv-on .beats[data-rv]{opacity:1;translate:none}
  html.rv-on .beats::before{transform-origin:left;scale:0 1;transition:scale 1.2s cubic-bezier(.6,0,.2,1)}
  html.rv-on .beats.in::before{scale:1 1}
  html.rv-on .beat .bt-n{scale:0;transition:scale .45s cubic-bezier(.3,1.8,.5,1)}
  html.rv-on .beat .bt-card{opacity:0;translate:0 50px;transition:opacity .5s ease,translate .7s cubic-bezier(.3,1.4,.5,1)}
  html.rv-on .beats.in .bt-n{scale:1}
  html.rv-on .beats.in .bt-card{opacity:1;translate:0 0}
  html.rv-on .beats.in .beat:nth-child(2) .bt-n{transition-delay:.25s}html.rv-on .beats.in .beat:nth-child(2) .bt-card{transition-delay:.35s}
  html.rv-on .beats.in .beat:nth-child(3) .bt-n{transition-delay:.5s}html.rv-on .beats.in .beat:nth-child(3) .bt-card{transition-delay:.6s}
  html.rv-on .beats.in .beat:nth-child(4) .bt-n{transition-delay:.75s}html.rv-on .beats.in .beat:nth-child(4) .bt-card{transition-delay:.85s}
  html.rv-on .beats.in .beat:nth-child(1) .bt-card{transition-delay:.1s}
  /* team cards pop in */
  html.rv-on .tz-row[data-rv]{opacity:1;translate:none}
  html.rv-on .tz-row .tmc{opacity:0;scale:.85;translate:0 30px;transition:opacity .45s ease,scale .6s cubic-bezier(.3,1.6,.5,1),translate .6s cubic-bezier(.3,1.6,.5,1),transform .3s cubic-bezier(.3,1.5,.5,1),box-shadow .3s}
  html.rv-on .tz-row.in .tmc{opacity:1;scale:1;translate:0 0}
  html.rv-on .tz-row.in .tmc:nth-child(2){transition-delay:.12s,.12s,.12s,0s,0s}
  html.rv-on .tz-row.in .tmc:nth-child(3){transition-delay:.24s,.24s,.24s,0s,0s}
  html.rv-on .tz-row.in .tmc:nth-child(4){transition-delay:.36s,.36s,.36s,0s,0s}
  .tmc.cat .tm-photo img{transform-origin:50% 100%}
  html.rv-on .tz-row.in .tmc.cat .tm-photo img{animation:catWiggle 2.4s ease-in-out 1.2s 2}
  @keyframes catWiggle{0%,100%{rotate:0deg}20%{rotate:-4deg}40%{rotate:3deg}60%{rotate:-2deg}}
  /* fighters slide in from their corners, VS slams */
  html.rv-on .fighters[data-rv]{opacity:1;translate:none}
  html.rv-on .f-z{opacity:0;translate:-80px 0;transition:opacity .5s ease,translate .8s cubic-bezier(.3,1.5,.5,1)}
  html.rv-on .f-r{opacity:0;translate:80px 0;transition:opacity .5s ease,translate .8s cubic-bezier(.3,1.5,.5,1)}
  html.rv-on .fighters.in .f-z,html.rv-on .fighters.in .f-r{opacity:1;translate:0 0}
  html.rv-on .vs-badge{scale:0}
  html.rv-on .fighters.in .vs-badge{animation:slamVS .5s cubic-bezier(.5,0,.75,0) .7s forwards}
  @keyframes slamVS{0%{scale:3;opacity:0}70%{scale:.9;opacity:1}100%{scale:1;opacity:1}}
  .bot-eye{animation:blink 3.4s infinite}
  @keyframes blink{0%,92%,100%{opacity:1}95%{opacity:0}}
  /* the race */
  html.rv-on .race[data-rv]{transition:opacity .6s ease,translate .8s cubic-bezier(.2,.8,.25,1)}
  html.rv-on .race .rz,html.rv-on .race .rr{left:4px}
  html.rv-on .race .err{opacity:0;scale:.6}
  html.rv-on .race .trophy{opacity:0;scale:.3}
  html.rv-on .race.in .rr{animation:robotRun 3.4s linear .4s forwards}
  html.rv-on .race.in .rz{animation:zRun 3.4s cubic-bezier(.45,0,.55,1) .4s forwards}
  html.rv-on .race.in .err{animation:pop .4s cubic-bezier(.3,1.8,.5,1) 1.7s forwards}
  html.rv-on .race.in .smoke{animation:puff 1.4s ease-out 1.5s 2}
  html.rv-on .race.in .rr svg{animation:shake .25s linear 1.45s 4}
  html.rv-on .race.in .rz svg{animation:hop .34s ease-in-out .4s 10}
  html.rv-on .race.in .trophy{animation:pop .5s cubic-bezier(.3,1.8,.5,1) 3.75s forwards}
  @keyframes robotRun{0%{left:4px}35%{left:52%}45%,100%{left:58%}}
  @keyframes zRun{0%{left:4px}35%{left:30%}100%{left:calc(100% - clamp(46px,5vw,60px) - 4px)}}
  @keyframes pop{to{opacity:1;scale:1}}
  @keyframes puff{0%{opacity:0;translate:0 0}30%{opacity:1}100%{opacity:0;translate:0 -22px}}
  @keyframes shake{25%{rotate:-6deg}75%{rotate:6deg}}
  @keyframes hop{50%{translate:0 -8px}}
  /* rounds stamp in, final score drops */
  html.rv-on .rounds[data-rv]{opacity:1;translate:none}
  html.rv-on .rd{opacity:0;translate:-30px 0;transition:opacity .4s ease calc(var(--i) * .12s),translate .5s cubic-bezier(.3,1.4,.5,1) calc(var(--i) * .12s)}
  html.rv-on .rounds.in .rd{opacity:1;translate:0 0}
  html.rv-on .rd .rd-win{opacity:0}
  html.rv-on .rounds.in .rd .rd-win{animation:stampIn .35s cubic-bezier(.5,0,.75,0) forwards;animation-delay:calc(.35s + var(--i) * .12s)}
  @keyframes stampIn{0%{opacity:0;scale:2.4}70%{opacity:1;scale:.92}100%{opacity:1;scale:1}}
  html.rv-on .final.in .fin-n span:first-child b{animation:pop2 .6s cubic-bezier(.3,1.8,.5,1) .4s both}
  @keyframes pop2{from{scale:.2;opacity:0}to{scale:1;opacity:1}}
  html.rv-on .p-band.in{animation:wobble .8s ease-in-out .3s}
  @keyframes wobble{25%{rotate:-1deg}50%{rotate:1deg}75%{rotate:-.5deg}}
}
.sp-sec .ch-big.cb-r{right:-.12em}.sp-sec .ch-big.cb-l{left:-.12em}

/* ===== Our Story ending: an open book ===== */
.be-sec{padding-block:clamp(40px,5vw,80px) clamp(60px,7vw,110px);overflow-x:clip}
.book-end{position:relative;display:grid;grid-template-columns:1fr 1fr;max-width:1180px;margin:0 auto;filter:drop-shadow(10px 10px 0 var(--ink))}
.be-page{position:relative;background:#FFFCF2;border:3px solid var(--ink);padding:clamp(28px,3.6vw,56px) clamp(24px,3.6vw,56px) clamp(52px,5vw,72px);display:grid;align-content:start;gap:clamp(10px,1.2vw,16px)}
.be-l{border-radius:26px 6px 6px 26px;border-right-width:1.5px;background:linear-gradient(90deg,#FFFCF2 82%,#EFEADB)}
.be-r{border-radius:6px 26px 26px 6px;border-left-width:1.5px;background-color:#FFFCF2;background-image:linear-gradient(90deg,#EFEADB,#FFFCF2 18%),repeating-linear-gradient(transparent 0 39px,rgba(127,134,245,.32) 39px 41px);background-blend-mode:multiply}
.be-k{font-family:var(--brush);font-size:clamp(1.25rem,1.6vw,1.6rem);line-height:1;color:var(--soft);transform:rotate(-2deg);justify-self:start}
.be-page h2{margin:0;font-size:clamp(1.9rem,3.2vw,3rem);line-height:1.1}
.be-l p{margin:0;font-size:clamp(1.02rem,1.2vw,1.15rem);font-weight:500;line-height:1.65;max-width:26em}
.be-fin{font-family:var(--brush);font-size:clamp(2.4rem,4vw,3.6rem);line-height:1;color:var(--red);justify-self:end;transform:rotate(-8deg);margin-top:6px}
.be-pg{position:absolute;bottom:18px;font-family:var(--brush);font-size:1.1rem;color:var(--soft)}
.be-l .be-pg{left:28px}.be-r .be-pg{right:28px}
.be-letter{margin:0;font-family:var(--brush);font-size:clamp(1.35rem,1.9vw,1.8rem);line-height:41px;color:var(--ink)}
.be-blank{display:inline-block;margin-inline:.25em;width:var(--w);height:.9em;border-bottom:3px solid var(--ink);vertical-align:-.1em;position:relative}
.be-blank::after{content:"";position:absolute;left:-4%;right:-4%;bottom:-6px;height:10px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 10' preserveAspectRatio='none'%3E%3Cpath d='M2 6C20 2 40 9 60 4S90 7 98 3' stroke='%23FF4430' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;opacity:.85}
.be-r .p-acts{margin-top:clamp(8px,1.2vw,16px)}
.be-pencil{position:absolute;right:clamp(20px,3vw,40px);top:clamp(-22px,-1.6vw,-14px);width:clamp(120px,13vw,170px);transform:rotate(-14deg);filter:drop-shadow(3px 3px 0 #171522)}
.be-ribbon{position:absolute;left:50%;top:-14px;width:26px;height:calc(100% + 54px);translate:-50% 0;z-index:3;background:var(--red);border:3px solid var(--ink);border-top:0;clip-path:polygon(0 0,100% 0,100% 100%,50% calc(100% - 18px),0 100%);pointer-events:none}
@media (max-width:820px){
  .book-end{grid-template-columns:1fr;max-width:600px}
  .be-l{border-radius:26px 26px 6px 6px;border-right-width:3px;border-bottom-width:1.5px;background:linear-gradient(180deg,#FFFCF2 85%,#EFEADB)}
  .be-r{border-radius:6px 6px 26px 26px;border-left-width:3px;border-top-width:1.5px;background-image:linear-gradient(180deg,#EFEADB,#FFFCF2 12%),repeating-linear-gradient(transparent 0 39px,rgba(127,134,245,.32) 39px 41px)}
  .be-ribbon{left:auto;right:42px;translate:none;top:-26px;height:96px}
  .be-pencil{top:auto;bottom:22px;right:60px;width:110px}
}
@media (max-width:520px){.be-page{padding:34px 20px 56px}.be-pencil{display:none}.be-ribbon{right:26px;width:22px;height:80px}.be-l .be-k{max-width:calc(100% - 50px)}}
@media (prefers-reduced-motion:no-preference){
  html.rv-on .book-end[data-rv]{opacity:1;translate:none}
  html.rv-on .be-r{transform-origin:left center;transition:transform 1s cubic-bezier(.3,1.2,.4,1),opacity .5s}
  html.rv-on .book-end:not(.in) .be-r{transform:perspective(1400px) rotateY(-75deg);opacity:.4}
  html.rv-on .book-end:not(.in) .be-l{opacity:0}
  html.rv-on .be-l{transition:opacity .5s}
  html.rv-on .be-fin{opacity:0;scale:.4}
  html.rv-on .book-end.in .be-fin{animation:finPop .5s cubic-bezier(.3,1.8,.5,1) 1s forwards}
  @keyframes finPop{to{opacity:1;scale:1}}
  html.rv-on .be-blank::after{scale:0 1;transform-origin:left;transition:scale .6s ease-out}
  html.rv-on .book-end.in .be-blank::after{scale:1 1;transition-delay:1.3s}
  html.rv-on .book-end.in .be-blank:nth-of-type(2)::after{transition-delay:1.7s}
  html.rv-on .be-pencil{opacity:0;translate:60px -30px}
  html.rv-on .book-end.in .be-pencil{opacity:1;translate:0 0;transition:opacity .5s ease 1.1s,translate .8s cubic-bezier(.3,1.5,.5,1) 1.1s}
  html.rv-on .book-end.in .be-pencil{animation:scribble 1.2s ease-in-out 2.2s 2}
  @keyframes scribble{25%{rotate:-4deg;translate:-6px 2px}50%{rotate:3deg;translate:4px -2px}75%{rotate:-2deg;translate:-3px 1px}}
  @media (max-width:820px){html.rv-on .book-end:not(.in) .be-r{transform:perspective(1400px) rotateX(70deg);transform-origin:top center}}
}

/* ===== Our Story: notebook paper instead of the home page colour blocks ===== */
.view.pg,#view-case{--ml:clamp(14px,4.4vw,72px);background-color:#fff;
  background-image:linear-gradient(90deg,transparent calc(var(--ml) - 1px),rgba(255,68,48,.38) calc(var(--ml) - 1px),rgba(255,68,48,.38) calc(var(--ml) + 1px),transparent calc(var(--ml) + 1px)),repeating-linear-gradient(transparent 0 37px,rgba(127,134,245,.13) 37px 38px)}
#view-about .sp-sec,#view-about .be-sec{background:transparent}
#view-about .p-head{margin-bottom:clamp(30px,4vw,56px)}
/* the showdown happens in a ring */
.vs-sec{background:transparent;border:0;padding-block:clamp(30px,4vw,60px)}
.ring{position:relative;max-width:1320px;margin:0 auto;background:radial-gradient(ellipse 60% 45% at 50% 42%,#FFF3B0 0,#FFFAE0 45%,#fff 80%);border:3px solid var(--ink);border-radius:30px;box-shadow:10px 10px 0 var(--ink);padding:clamp(70px,7vw,100px) clamp(18px,3.4vw,56px) clamp(70px,7vw,100px)}
.ring::before,.ring::after{content:"";position:absolute;left:clamp(18px,3vw,40px);right:clamp(18px,3vw,40px);height:30px;background:linear-gradient(var(--red) 0 6px,transparent 6px 12px,var(--white) 12px 18px,transparent 18px 24px,var(--red) 24px 30px);filter:drop-shadow(0 1.5px 0 var(--ink)) drop-shadow(0 -1.5px 0 var(--ink))}
.ring::before{top:22px}.ring::after{bottom:22px}
.ring .p-head{position:relative}
@media (max-width:600px){.ring{border-radius:22px;box-shadow:6px 6px 0 var(--ink);padding:60px 14px}.ring::before,.ring::after{height:24px;background:linear-gradient(var(--red) 0 5px,transparent 5px 9.5px,var(--white) 9.5px 14.5px,transparent 14.5px 19px,var(--red) 19px 24px)}.ring::before{top:16px}.ring::after{bottom:16px}}

/* ===== Our Story banner on the notebook paper: no colour block, an ink frame instead ===== */
.story-hero{padding-top:clamp(14px,2vw,30px)}
.story-hero .sh-panel{position:relative;background:none;border:0;box-shadow:none;border-radius:0;overflow:visible}
.sh-frame{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;overflow:visible}
.sh-frame path{fill:none;stroke:var(--ink);stroke-width:3.2;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.sh-frame .f2{stroke-width:1.6;opacity:.55}
.sh-tape{position:absolute;z-index:4;top:-14px;width:clamp(90px,10vw,150px);height:clamp(26px,2.6vw,36px);background:rgba(255,212,0,.78);border:1px solid rgba(23,21,34,.15)}
.sh-tape.t1{left:clamp(10px,2vw,40px);transform:rotate(-8deg)}
.sh-tape.t2{right:clamp(10px,2vw,40px);transform:rotate(7deg);background:rgba(160,228,93,.8)}
.sh-stage{overflow:hidden;margin-bottom:0;margin-inline:calc(var(--px) * -1 + max(.8%,4px))}
.sh-stage::before{background:radial-gradient(closest-side,rgba(255,212,0,.32),rgba(255,212,0,.12) 60%,transparent)}
.sh-stage img{image-rendering:auto}
.sh-l h1 .circ svg path{stroke-width:5}
@media (max-width:600px){.sh-tape{top:-10px}}
@media (prefers-reduced-motion:no-preference){
  .view:not([hidden]) .sh-frame path{stroke-dasharray:12000;stroke-dashoffset:12000;animation:frameDraw 1.6s cubic-bezier(.6,0,.3,1) .1s forwards}
  .view:not([hidden]) .sh-frame .f2{animation-delay:.4s}
  @keyframes frameDraw{to{stroke-dashoffset:0}}
  .view:not([hidden]) .sh-tape{animation:tapeOn .4s cubic-bezier(.3,1.8,.5,1) 1.3s both}
  @keyframes tapeOn{from{opacity:0;scale:.5 1}}
}

/* ===== story beats as sticky notes ===== */
.beats{align-items:stretch}
.beat{grid-template-rows:auto 1fr}
.beat:nth-child(1){--nc:#FFE873}.beat:nth-child(2){--nc:#FFC9D3}.beat:nth-child(3){--nc:#D2F3A6}.beat:nth-child(4){--nc:#D4D7FC}
.beat .bt-card{position:relative;height:100%;box-sizing:border-box;background:var(--nc);border:0;border-radius:2px 2px 4px 2px;padding:clamp(30px,2.6vw,38px) clamp(20px,2vw,28px) clamp(30px,2.6vw,40px);
  box-shadow:0 14px 20px -12px rgba(23,21,34,.45),0 3px 6px -2px rgba(23,21,34,.12);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 34px),calc(100% - 34px) 100%,0 100%)}
.beat .bt-card::after{content:"";position:absolute;right:0;bottom:0;width:34px;height:34px;background:linear-gradient(135deg,rgba(0,0,0,.18) 0 50%,transparent 50%) ,linear-gradient(315deg,transparent 50%,color-mix(in srgb,var(--nc) 80%,#000) 50%);
  background:linear-gradient(315deg,transparent 0 50%,color-mix(in srgb,var(--nc) 78%,#171522) 50% 100%);box-shadow:-2px -2px 3px rgba(0,0,0,.08)}
.beat .bt-card::before{content:"";position:absolute;top:-2px;left:50%;width:84px;height:24px;translate:-50% 0;rotate:-3deg;background:rgba(255,255,255,.55);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.beat:nth-child(even) .bt-card::before{rotate:4deg}
.beat .bt-card h3{font-size:clamp(1.25rem,1.6vw,1.55rem)}
.beat .bt-card p{font-weight:500}
.beat:nth-child(1) .bt-card{transform:rotate(-2.2deg)}
.beat:nth-child(2) .bt-card{transform:rotate(1.6deg) translateY(16px)}
.beat:nth-child(3) .bt-card{transform:rotate(-1.2deg)}
.beat:nth-child(4) .bt-card{transform:rotate(2.4deg) translateY(16px)}
.beat .bt-card{transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.beat .bt-card:hover{transform:rotate(0) translateY(-4px)}
@media (max-width:1100px){.beat:nth-child(2) .bt-card,.beat:nth-child(4) .bt-card{transform:rotate(1.8deg)}}
@media (max-width:600px){.beat{grid-template-rows:auto}.beat .bt-card{height:auto}.beat:nth-child(n) .bt-card{transform:rotate(calc(var(--tilt,1deg)))}.beat:nth-child(odd){--tilt:-1.2deg}.beat:nth-child(even){--tilt:1.2deg}}
.beat .bt-card{box-shadow:none}.beat{filter:drop-shadow(0 12px 10px rgba(23,21,34,.2)) drop-shadow(0 2px 2px rgba(23,21,34,.1))}

/* ===== Team straight on the paper ===== */
#view-about .tmc{background:none!important;border:0;box-shadow:none;border-radius:0;overflow:visible;transform:none;text-align:center}
#view-about .tmc:hover{transform:translateY(-4px);box-shadow:none}
#view-about .tm-photo{width:min(78%,230px);margin:0 auto;aspect-ratio:1;border-radius:58% 42% 55% 45%/48% 56% 44% 52%;background:var(--tc);border:2.5px solid var(--ink);overflow:hidden;transform:rotate(var(--r));transition:border-radius .6s ease,transform .3s cubic-bezier(.3,1.5,.5,1)}
#view-about .tmc:nth-child(even) .tm-photo{border-radius:44% 56% 47% 53%/55% 45% 57% 43%}
#view-about .tmc:hover .tm-photo{border-radius:50%;transform:rotate(0) scale(1.04)}
#view-about .tm-photo img.ink{transform-origin:50% 6%;scale:1.13}
#view-about .tmc:hover .tm-photo img{transform:none}
#view-about .tm-photo img{mix-blend-mode:multiply;object-fit:cover;object-position:50% 6%}
#view-about .tmc:hover .tm-photo img{transform:none}
#view-about .tm-wave{display:none}
#view-about .tm-body{background:none;padding:14px 6px 0;justify-items:center}
#view-about .tm-role{color:var(--soft)}
#view-about .tmc p{max-width:22em;margin-inline:auto}
#view-about .tz-cards{row-gap:clamp(30px,3.4vw,48px)}
@media (max-width:540px){#view-about .tm-photo{width:86%}#view-about .tm-body{padding:10px 2px 0}}

@media (prefers-reduced-motion:no-preference){
  html.rv-on #ai .rounds.in .rd .rd-win{animation:chalkIn .5s ease-out forwards;animation-delay:calc(.35s + var(--i) * .12s)}
  @keyframes chalkIn{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
}

/* ===== closing, written straight on the paper ===== */
.pe-sec{padding-block:clamp(40px,5vw,80px) clamp(70px,8vw,120px);overflow-x:clip}
.paper-end{position:relative;max-width:900px;margin:0 auto;text-align:center;display:grid;justify-items:center;gap:clamp(12px,1.4vw,18px)}
.pe-k{margin:0;font-family:var(--brush);font-size:clamp(1.4rem,2vw,1.9rem);color:var(--soft);transform:rotate(-2deg);display:inline-flex;align-items:baseline;gap:.4em}
.pe-fin{font-size:1.5em;color:var(--red);transform:rotate(-8deg);display:inline-block}
.paper-end h2{margin:0;font-size:clamp(2.4rem,5vw,4.8rem);line-height:1.05;text-wrap:balance}
.pe-letter{margin:0;font-family:var(--brush);font-size:clamp(1.4rem,2.1vw,2rem);line-height:2;max-width:30em;color:var(--ink)}
.paper-end .p-acts{justify-content:center;margin-top:6px}
.pe-pencil{position:absolute;right:clamp(-40px,-3vw,-10px);bottom:clamp(-20px,-1vw,0px);width:clamp(110px,12vw,170px);transform:rotate(-18deg);filter:drop-shadow(3px 3px 0 #171522)}
@media (max-width:700px){.pe-pencil{position:static;transform:rotate(-8deg);margin-top:8px}}
@media (prefers-reduced-motion:no-preference){
  html.rv-on .paper-end .pe-fin{opacity:0;scale:.3}
  html.rv-on .paper-end.in .pe-fin{animation:finPop .5s cubic-bezier(.3,1.8,.5,1) .5s forwards}
  html.rv-on .paper-end .be-blank::after{scale:0 1;transform-origin:left;transition:scale .6s ease-out}
  html.rv-on .paper-end.in .be-blank::after{scale:1 1;transition-delay:.9s}
  html.rv-on .paper-end.in .be-blank:nth-of-type(2)::after{transition-delay:1.3s}
  html.rv-on .paper-end .pe-pencil{opacity:0;translate:70px -30px}
  html.rv-on .paper-end.in .pe-pencil{opacity:1;translate:0 0;transition:opacity .5s ease .8s,translate .8s cubic-bezier(.3,1.5,.5,1) .8s;animation:scribble 1.2s ease-in-out 1.8s 2}
}

/* ===================== BOOK THEME ===================== */
/* front cover: a spine down the left and page edges on the right */
.book-spine,.book-edges{position:fixed;top:0;bottom:0;z-index:44;pointer-events:none;opacity:0;transition:opacity .4s}
.book-spine{left:0;width:clamp(7px,.9vw,14px);background:linear-gradient(90deg,#3B3F9E,#5E64D8 45%,#4A50C8 70%,#2F3384);box-shadow:2px 0 6px rgba(23,21,34,.25)}
.book-spine::after{content:"";position:absolute;top:0;bottom:0;left:50%;border-left:2px dashed rgba(255,255,255,.45)}
.book-edges{right:0;width:clamp(5px,.6vw,9px);background:repeating-linear-gradient(90deg,#fff 0 1.5px,#D9D9E4 1.5px 3px);border-left:1.5px solid rgba(23,21,34,.25)}
body.on-cover .book-spine{opacity:1}
body:not(.on-cover) .book-edges{opacity:1}
@media (max-width:600px){.book-spine{width:6px}.book-edges{width:4px}}
/* chapter running head */
.runhead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;max-width:1400px;margin:0 auto;padding:clamp(14px,1.8vw,22px) max(var(--gut),calc(var(--ml,20px) + 16px)) 10px;font-family:var(--brush);color:var(--soft);font-size:clamp(1rem,1.3vw,1.25rem);line-height:1;border-bottom:1.5px solid rgba(23,21,34,.14);position:relative;z-index:2}
.runhead b{font-weight:400;color:var(--ink);font-size:1.15em;letter-spacing:.02em;text-align:center}
.runhead .rh-ch{white-space:nowrap}.runhead .rh-pg{white-space:nowrap}
#view-case .runhead{margin-bottom:10px}
.runhead{padding-top:clamp(30px,3.4vw,48px)!important}
/* next chapter / turn the page */
.turnpage{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:18px;max-width:1400px;margin:0 auto;padding:clamp(20px,3vw,40px) max(var(--gut),20px) clamp(110px,10vw,170px);border-top:1.5px solid rgba(23,21,34,.14)}
.tp-pg{position:absolute;left:50%;top:clamp(20px,3vw,40px);translate:-50% 0;font-family:var(--brush);font-size:1.15rem;color:var(--soft)}
.tp-link{position:relative;display:grid;justify-items:end;text-decoration:none;color:var(--ink);padding:14px 50px 18px 26px;background:#fff;border:3px solid var(--ink);border-radius:16px 16px 4px 16px;box-shadow:6px 6px 0 var(--ink);transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
.tp-link small{font-family:var(--brush);font-size:clamp(1.05rem,1.3vw,1.25rem);color:var(--soft);line-height:1}
.tp-link b{font-family:var(--hand);font-weight:800;font-size:clamp(1.3rem,2vw,1.8rem);line-height:1.15}
.tp-corner{position:absolute;right:6px;bottom:6px;width:34px;height:34px;background:#FFE873;clip-path:polygon(0 0,100% 0,0 100%);filter:drop-shadow(-1px -1px 0 #171522);border-radius:0 0 0 4px;transition:width .25s,height .25s}
.tp-link:hover{transform:translateY(-3px) rotate(-1deg)}
.tp-link:hover .tp-corner{width:46px;height:46px}
.tp-link b::after{content:"";display:inline-block;width:1.25em;height:.8em;margin-left:.35em;vertical-align:-.05em;background:currentColor;-webkit-mask:var(--har) center/contain no-repeat;mask:var(--har) center/contain no-repeat}
@media (max-width:600px){.turnpage{justify-content:center;padding-top:56px}}
/* back cover: binding shade and a barcode */
.ft::before{content:"";position:absolute;inset:0 auto 0 0;width:clamp(10px,1.2vw,18px);background:linear-gradient(90deg,rgba(23,21,34,.28),transparent);pointer-events:none;z-index:1}
.ft-barcode{display:inline-grid;justify-items:center;gap:4px;background:#fff;border:2px solid var(--ink);border-radius:6px;padding:8px 10px 5px;transform:rotate(-2deg);margin-top:6px;box-shadow:3px 3px 0 var(--ink)}
.ft-barcode i{display:block;width:120px;height:38px;background:repeating-linear-gradient(90deg,#171522 0 2px,transparent 2px 4px,#171522 4px 5px,transparent 5px 8px,#171522 8px 11px,transparent 11px 12px,#171522 12px 13px,transparent 13px 16px)}
.ft-barcode small{font-family:var(--hand);font-weight:700;font-size:.62rem;letter-spacing:.12em}
/* the page flip */
@keyframes shadeOut{0%{opacity:1}100%{opacity:0}}

/* ===== notebook extras: index tabs, margin doodles, a corner to peel ===== */
.ix-tabs{position:fixed;right:0;top:50%;z-index:46;display:none;flex-direction:column;gap:6px;transform:translateY(-50%);opacity:0;transition:opacity .4s}
body:not(.on-cover) .ix-tabs{opacity:1}
@media (min-width:1100px) and (min-height:620px){.ix-tabs{display:flex}}
.ix-tabs a{position:relative;display:block;width:40px;padding:14px 0 14px 9px;margin-right:-17px;border:2px solid var(--ink);border-right:0;border-radius:12px 0 0 12px;background:var(--c);color:var(--ink);font-family:var(--brush);font-size:1.02rem;line-height:1;text-decoration:none;box-shadow:inset -6px 0 8px -6px rgba(23,21,34,.25);transition:margin-right .25s cubic-bezier(.3,1.6,.5,1),width .25s;white-space:nowrap}
.ix-tabs a{transform:none;writing-mode:vertical-lr;text-orientation:mixed}
.ix-tabs a span{display:inline-block;transform:rotate(180deg)}
.ix-tabs a:hover,.ix-tabs a:focus-visible{margin-right:-6px}
.ix-tabs a.on{margin-right:0;width:46px;box-shadow:-4px 4px 0 var(--ink)}
.ix-tabs a.on::after{content:"";position:absolute;right:-2px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--ink);display:none}
.ix-tabs a.hot{color:#fff}
.mdood{position:absolute;left:calc(var(--ml,40px) / 2);width:clamp(24px,2.6vw,40px);height:auto;transform:translateX(-50%) rotate(var(--r,0deg));pointer-events:none;z-index:2;display:none;overflow:visible}
@media (min-width:900px){.mdood{display:block}}
.mdood path{fill:none;stroke:var(--dc,#171522);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:160;stroke-dashoffset:160}
.mdood.in path{animation:doodDraw 1.1s cubic-bezier(.5,0,.3,1) forwards}
.mdood.in path+path{animation-delay:.5s}
@keyframes doodDraw{to{stroke-dashoffset:0}}
.dogear{position:fixed;right:0;bottom:0;z-index:47;width:var(--de,64px);height:var(--de,64px);padding:0;border:0;cursor:pointer;background:none;filter:drop-shadow(-3px -3px 4px rgba(23,21,34,.22));opacity:0;pointer-events:none;transition:opacity .3s,width .3s cubic-bezier(.3,1.5,.5,1),height .3s cubic-bezier(.3,1.5,.5,1)}
body:not(.on-cover) .dogear{opacity:1;pointer-events:auto}
body .dogear.gone{opacity:0;pointer-events:none}
.dogear::before{content:"";position:absolute;inset:0;background:linear-gradient(to top left,var(--lime) 0 50%,transparent 50%)}
.dogear::after{content:"";position:absolute;inset:0;background:linear-gradient(to top left,transparent 50%,#E4E1D6 50%,#F7F5EE 62%,#FFFFFF 85%)}
.dogear i{display:none;z-index:1;font-style:normal;font-weight:800;font-size:calc(var(--de,64px) * .26);line-height:1;color:var(--ink)}
.dogear b{position:absolute;right:calc(100% + 10px);bottom:12px;font-family:var(--brush);font-weight:400;font-size:1.1rem;color:var(--ink);white-space:nowrap;background:#fff;border:2px solid var(--ink);border-radius:10px;padding:4px 10px;box-shadow:3px 3px 0 var(--ink);opacity:0;transform:translateX(8px) rotate(-2deg);transition:.25s;pointer-events:none}
.dogear:hover,.dogear:focus-visible{--de:96px}
.dogear:hover b,.dogear:focus-visible b{opacity:1;transform:rotate(-2deg)}
.dogear.flick{animation:earFlick 1s cubic-bezier(.3,1.6,.5,1) .9s both}
@keyframes earFlick{0%{width:64px;height:64px}35%{width:104px;height:104px}100%{width:64px;height:64px}}
@media (max-width:700px){.dogear{--de:46px}.dogear:hover{--de:46px}.dogear b{display:none}@keyframes earFlick{0%{width:46px;height:46px}35%{width:72px;height:72px}100%{width:46px;height:46px}}body:not(.on-cover) .totop{bottom:calc(64px + env(safe-area-inset-bottom,0px))}}
@media (prefers-reduced-motion:reduce){.mdood path{stroke-dashoffset:0}.dogear.flick{animation:none}}

/* ===== chapter banners, same frame as Our Story, a different scene each ===== */
.ch-hero .sh-panel{padding-bottom:clamp(18px,2.4vw,34px)}
.ch-hero .pc-z{background:var(--yellow)}
.hv-tour .pc-z{background:var(--red);color:var(--white)}
.hv-shelf .sh-tape.t1{background:rgba(255,68,48,.7)}.hv-shelf .sh-tape.t2{background:rgba(127,134,245,.75)}
.hv-plans .sh-tape.t1{background:rgba(160,228,93,.8)}.hv-plans .sh-tape.t2{background:rgba(255,212,0,.78)}
.hv-tour .sh-tape.t1{background:rgba(127,134,245,.75)}.hv-tour .sh-tape.t2{background:rgba(255,68,48,.7)}
.hv-talk .sh-tape.t1{background:rgba(212,215,252,.95)}.hv-talk .sh-tape.t2{background:rgba(255,212,0,.78)}
.hv-slide .sh-tape.t1{background:rgba(255,143,163,.8)}.hv-slide .sh-tape.t2{background:rgba(160,228,93,.8)}
.ch-hero .t-count{margin-top:2px}
.xh-stage{position:relative;max-width:1240px;margin:clamp(18px,2.6vw,40px) auto 0;height:clamp(170px,17vw,250px)}
/* shelf: books standing on a plank */
.xs-books{position:absolute;left:4%;right:4%;bottom:14px;display:flex;justify-content:center;align-items:flex-end;gap:clamp(6px,1.2vw,18px)}
.xs-books img{height:clamp(110px,13vw,190px);width:auto;aspect-ratio:464/672;object-fit:cover;border:2.5px solid var(--ink);border-radius:2px 7px 7px 2px;box-shadow:4px 0 0 var(--ink);transform:rotate(var(--r));transform-origin:50% 100%;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.xs-books img:nth-child(odd){height:clamp(100px,12vw,172px)}
.xs-plant svg{height:clamp(80px,9vw,130px);width:auto;display:block}
.xs-plank{position:absolute;left:2%;right:2%;bottom:0;height:16px;background:#E3B97F;border:3px solid var(--ink);border-radius:4px;box-shadow:0 5px 0 var(--ink)}
/* plans: taped polaroids + price tag */
.xp-row{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;gap:clamp(12px,3vw,48px)}
.xp-pola{position:relative;margin:0;background:#fff;border:2.5px solid var(--ink);padding:8px 8px 30px;box-shadow:5px 5px 0 var(--ink);transform:rotate(var(--r));width:clamp(120px,15vw,230px)}
.xp-pola img{display:block;width:100%;aspect-ratio:10/7;object-fit:cover}
.xp-pola b{position:absolute;left:0;right:0;bottom:6px;text-align:center;font-family:var(--brush);font-weight:400;font-size:clamp(1rem,1.4vw,1.35rem)}
.xp-tape{position:absolute;top:-12px;left:50%;width:70px;height:22px;translate:-50% 0;rotate:-4deg;background:rgba(255,212,0,.8)}
.xp-pola:nth-child(2) .xp-tape{background:rgba(160,228,93,.85);rotate:5deg}.xp-pola:nth-child(3) .xp-tape{background:rgba(212,215,252,.95)}
.xp-tag{top:auto!important;bottom:8%;right:4%!important;transform:rotate(10deg)}
.xp-gift{position:absolute;left:3%;top:8%;transform:rotate(-6deg);background:var(--yellow)}
/* tour: plates along a road */
.xt-road{position:absolute;left:0;top:30%;width:100%;height:50%}
.xt-road path{fill:none;stroke:var(--ink);stroke-width:4;stroke-dasharray:18 14;vector-effect:non-scaling-stroke;opacity:.45}
.xt-plates{position:absolute;left:2%;right:22%;top:18%;display:flex;justify-content:space-around;align-items:center}
.xt-pl{display:grid;place-items:center;width:clamp(70px,8vw,120px);aspect-ratio:2/1.2;background:#fff;border:3px solid var(--ink);border-radius:12px;box-shadow:4px 4px 0 var(--ink);transform:rotate(var(--r));position:relative}
.xt-pl::before{content:"";position:absolute;inset:5px;border:2px solid rgba(23,21,34,.22);border-radius:7px}
.xt-pl b{font-weight:800;font-size:clamp(1.2rem,2vw,1.9rem);line-height:1}
.xt-pl i{font-style:normal;font-family:var(--brush);font-size:.95rem;line-height:1}
.xt-pl:nth-child(1),.xt-pl:nth-child(4){background:#EFEEF3;color:#9C9AAA}
.xt-pl:nth-child(1) b,.xt-pl:nth-child(4) b{text-decoration:line-through;text-decoration-color:var(--red);text-decoration-thickness:3px}
.xt-pl.you{background:var(--yellow)}
.xt-big{position:absolute!important;right:3%;top:8%;transform:rotate(-6deg) scale(.82)!important;transform-origin:right top}
/* real talk: floating questions */
.xq{position:absolute;font-family:var(--hand);font-weight:700;font-size:clamp(.85rem,1.15vw,1.1rem);line-height:1.25;background:#fff;border:3px solid var(--ink);border-radius:18px;box-shadow:4px 4px 0 var(--ink);padding:.6em .9em;max-width:15em}
.xq::after{content:"";position:absolute;bottom:-12px;left:24px;width:18px;height:18px;background:inherit;border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);transform:rotate(45deg)}
.xq.b1{left:2%;top:10%;transform:rotate(-4deg)}
.xq.b2{left:28%;top:52%;transform:rotate(3deg);background:var(--yellow)}
.xq.b3{left:52%;top:6%;transform:rotate(-2deg);background:#D4D7FC}
.xq.b4{left:76%;top:4%;font-size:clamp(1.6rem,2.6vw,2.4rem);padding:.1em .45em;background:var(--red);color:#fff;transform:rotate(-8deg)}
.xq.b5{right:2%;top:46%;transform:rotate(4deg);background:#D2F3A6}
.xq.b2::after,.xq.b5::after{left:auto;right:26px}
/* slide in: a paper plane flies to the envelope */
.xc-path{position:absolute;inset:0;width:100%;height:100%}
.xc-path path{fill:none;stroke:var(--ink);stroke-width:3;stroke-dasharray:6 12;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:.5}
.xc-plane{position:absolute;left:2%;bottom:10%;width:clamp(56px,6vw,84px);transform:rotate(-14deg)}
.xc-env{position:absolute;right:4%;top:4%;width:clamp(120px,14vw,200px);transform:rotate(6deg);filter:drop-shadow(5px 5px 0 #171522)}
.xc-note{position:absolute;left:38%;top:12%;transform:rotate(-4deg);background:var(--yellow)}
@media (max-width:860px){.xh-stage{height:200px}.xt-plates{right:2%;top:auto;bottom:4%}.xt-big{transform:rotate(-6deg) scale(.6)!important}.xq.b3{left:auto;right:2%}.xq.b4{left:auto;right:4%;top:64%}}
@media (max-width:600px){.xh-stage{height:170px;margin-inline:calc(var(--px) * -.5)}
  .xs-books img:nth-child(n+6){display:none}.xs-books img{height:96px!important}.xs-plant svg{height:66px}
  .xp-pola{width:30%}.xp-tag{transform:rotate(10deg) scale(.7)!important;transform-origin:right bottom;bottom:-4%}.xp-gift{display:none}
  .xt-pl{width:58px}.xt-pl:nth-child(5){display:none}.xt-big{display:none!important}.xt-plates{right:0;left:0}
  .xq{font-size:.78rem;max-width:11em}.xq.b2{left:4%;top:56%}.xq.b5{display:none}.xq.b3{top:30%}
  .xc-note{left:22%;top:auto;bottom:6%;font-size:.95rem}.xc-env{width:96px}}
@media (prefers-reduced-motion:no-preference){
  .view:not([hidden]) .xs-books img{animation:bookIn .6s cubic-bezier(.3,1.5,.5,1) both}
  .view:not([hidden]) .xs-books > *:nth-child(2){animation-delay:.08s}.view:not([hidden]) .xs-books > *:nth-child(3){animation-delay:.16s}.view:not([hidden]) .xs-books > *:nth-child(4){animation-delay:.24s}.view:not([hidden]) .xs-books > *:nth-child(5){animation-delay:.32s}.view:not([hidden]) .xs-books > *:nth-child(6){animation-delay:.4s}.view:not([hidden]) .xs-books > *:nth-child(7){animation-delay:.48s}
  @keyframes bookIn{from{opacity:0;translate:0 -40px}}
  .xs-books img:hover{transform:rotate(0) translateY(-10px)}
  .view:not([hidden]) .xp-pola{animation:polaIn .7s cubic-bezier(.3,1.4,.5,1) both}
  .view:not([hidden]) .xp-pola:nth-child(2){animation-delay:.15s}.view:not([hidden]) .xp-pola:nth-child(3){animation-delay:.3s}
  @keyframes polaIn{from{opacity:0;translate:0 60px;rotate:-12deg}}
  .view:not([hidden]) .xt-pl{animation:plateIn .5s cubic-bezier(.3,1.7,.5,1) both}
  .view:not([hidden]) .xt-pl:nth-child(2){animation-delay:.12s}.view:not([hidden]) .xt-pl:nth-child(3){animation-delay:.24s}.view:not([hidden]) .xt-pl:nth-child(4){animation-delay:.36s}.view:not([hidden]) .xt-pl:nth-child(5){animation-delay:.48s}
  @keyframes plateIn{from{opacity:0;scale:.4}}
  .xt-pl.you{animation:plateIn .5s cubic-bezier(.3,1.7,.5,1) .24s both,youBob 2.4s ease-in-out 1s infinite!important}
  @keyframes youBob{50%{translate:0 -8px}}
  .view:not([hidden]) .xq{animation:qIn .5s cubic-bezier(.3,1.7,.5,1) both}
  .view:not([hidden]) .xq.b2{animation-delay:.15s}.view:not([hidden]) .xq.b3{animation-delay:.3s}.view:not([hidden]) .xq.b4{animation-delay:.45s}.view:not([hidden]) .xq.b5{animation-delay:.6s}
  @keyframes qIn{from{opacity:0;scale:.5}}
  .view:not([hidden]) .xc-path path{stroke-dashoffset:400;animation:dashMove 1.6s linear infinite}
  @keyframes dashMove{to{stroke-dashoffset:0}}
  .view:not([hidden]) .xc-plane{animation:planeFly 3.2s ease-in-out infinite}
  @keyframes planeFly{0%,100%{translate:0 0;rotate:-14deg}50%{translate:20px -26px;rotate:-4deg}}
}

.vs-sec .wrap{position:relative}
@media (max-width:600px){
  .xs-books{left:2%;right:2%;gap:6px}.xs-books img{height:84px!important}.xs-books img:nth-child(n+5){display:none}.xs-plant svg{height:58px}
  .hv-tour .xh-stage{height:110px}.hv-tour .xt-road{top:10%;height:60%}.hv-tour .xt-plates{top:22%;bottom:auto}
  .xq.b4{display:none}.xp-tag{display:none}
  .xp-row{gap:8px}
}
@media (max-width:420px){.hv-tour .sh-l h1{font-size:clamp(1.7rem,9vw,2.2rem)}.xq.b2{top:62%}}
#shelfTop,#plans,#states,#funForm,#mailbag,#team{scroll-margin-top:96px}
/* =====================================================================
   THE BOOK ON THE DESK: everything sits on a cutting mat, seen from above
   ===================================================================== */
:root{--mat:#E5E6FC;--grid:rgba(122,128,242,.26);--grid2:rgba(122,128,242,.11);--desk:clamp(8px,3.4vw,64px);--lp:clamp(8px,2.2vw,30px);--bw:min(1320px,calc(100% - 2 * var(--desk) - 2 * var(--lp)));--bl:max(calc(var(--desk) + var(--lp)),calc((100% - var(--bw)) / 2));--side:calc(100% - var(--bl) - var(--bw));--sh:66px}
body{background-color:var(--mat);margin:0}
body::after{display:none!important}
body::before{content:"";position:fixed;inset:0;height:auto;z-index:-1;pointer-events:none;background-color:transparent;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px),linear-gradient(var(--grid2) 1px,transparent 1px),linear-gradient(90deg,var(--grid2) 1px,transparent 1px);background-size:120px 120px,120px 120px,24px 24px,24px 24px}
@media (max-width:400px){:root{--desk:4px;--lp:7px}}
/* the book */
main{position:relative;z-index:1;margin:0 var(--side) calc(var(--desk) + 56px) var(--bl);background:#fff;container-type:inline-size;
  box-shadow:2px 3px 0 -1px #fff,2px 3px 0 0 #CBCCE4,4px 6px 0 -1px #fff,4px 6px 0 0 #CBCCE4,6px 9px 0 -1px #fff,6px 9px 0 0 #CBCCE4,0 34px 60px -24px rgba(23,21,34,.45),0 10px 22px rgba(23,21,34,.12)}
main::before{content:"";position:absolute;top:0;bottom:0;left:0;width:clamp(14px,2vw,30px);z-index:6;pointer-events:none;background:linear-gradient(90deg,rgba(23,21,34,.16),rgba(23,21,34,.05) 45%,transparent)}
body.on-cover main{border-radius:4px 12px 0 0}
body.on-cover main::before{width:clamp(12px,1.6vw,24px);background:linear-gradient(90deg,rgba(23,21,34,.30),rgba(255,255,255,.35) 38%,rgba(23,21,34,.10) 62%,transparent)}
.ft{z-index:1;margin:0 var(--side) calc(var(--desk) + 12px) var(--bl);border-radius:0 0 12px 4px;box-shadow:2px 3px 0 -1px #fff,2px 3px 0 0 #CBCCE4,4px 6px 0 -1px #fff,4px 6px 0 0 #CBCCE4,0 34px 60px -24px rgba(23,21,34,.5)}
.book-spine,.book-edges,.ix-tabs{display:none!important}
/* the top strip is just more desk, the book's top edge runs along its bottom */
header.top,body.on-home header.top{position:sticky;top:0;left:auto;right:auto;transform:none;height:var(--sh);background:transparent;backdrop-filter:none;border:0;box-shadow:none}
header.top::before{content:"";position:absolute;inset:0;z-index:-1;background-color:var(--mat);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px),linear-gradient(var(--grid2) 1px,transparent 1px),linear-gradient(90deg,var(--grid2) 1px,transparent 1px);background-size:120px 120px,120px 120px,24px 24px,24px 24px}
header.top::after{content:"";position:absolute;z-index:1;left:calc(var(--bl) - var(--lp));right:var(--side);bottom:0;height:7px;border-radius:3px 3px 0 0;background:linear-gradient(#fff,#fff) bottom/100% 2px no-repeat,repeating-linear-gradient(180deg,#C9CAE3 0 1px,#fff 1px 2.5px);box-shadow:0 -3px 6px -2px rgba(23,21,34,.18);pointer-events:none}
header.top .wrap{max-width:none;height:100%;padding:0 calc(var(--side) + 6px) 0 var(--bl);align-items:center}
header.top .menu-btn,header.top nav.main,.hz-menu,.hz-nav{display:none!important}
body.on-home:not(.scrolled) header.top .brand{opacity:0;pointer-events:none}
.pencil-bar{display:none!important}
body.on-cover header.top::after{left:var(--bl)}
.leftpage{position:absolute;top:0;bottom:0;right:100%;width:var(--lp);z-index:0;pointer-events:none;box-shadow:-2px 3px 0 -1px #fff,-2px 3px 0 0 #CBCCE4,-4px 6px 0 -1px #fff,-4px 6px 0 0 #CBCCE4,0 34px 60px -24px rgba(23,21,34,.4);background-color:#FBFAF7;background-image:linear-gradient(270deg,rgba(23,21,34,.22),rgba(23,21,34,.06) 30px,transparent 70px),repeating-linear-gradient(transparent 0 37px,rgba(127,134,245,.2) 37px 38px)}
.leftpage::after{content:"";position:absolute;right:clamp(20px,3vw,48px);bottom:30px;font-family:var(--brush);color:var(--soft);font-size:1rem}
body.on-cover .leftpage{display:none}
body.opening .leftpage{visibility:hidden}
@media (max-width:700px){.leftpage{background-image:linear-gradient(270deg,rgba(23,21,34,.24),rgba(23,21,34,.05) 18px,transparent 40px),repeating-linear-gradient(transparent 0 37px,rgba(127,134,245,.2) 37px 38px)}}
/* bookmarks peeking out of the top of the book */
.bmarks{position:absolute;right:calc(var(--side) + clamp(12px,3vw,48px));bottom:0;display:flex;align-items:flex-end;gap:clamp(4px,.6vw,8px)}
.bm{position:relative;z-index:0;display:block;height:var(--pk,46px);min-width:30px;color:var(--ink);text-decoration:none;filter:drop-shadow(2px 0 1px rgba(23,21,34,.22));transform:translateY(var(--y,0px));transition:transform .35s cubic-bezier(.3,1.6,.45,1)}
.bm i{position:absolute;left:0;right:0;top:0;height:calc(var(--pk,46px) + var(--tail,0px));background:linear-gradient(90deg,rgba(23,21,34,.10),transparent 18%,transparent 82%,rgba(23,21,34,.10)),var(--c);clip-path:polygon(0 0,50% 9px,100% 0,100% 100%,0 100%);transition:height .4s cubic-bezier(.3,1.4,.5,1)}
.bm i::after{content:"";position:absolute;left:3px;right:3px;top:0;bottom:0;border-left:1.5px dashed rgba(255,255,255,.55);border-right:1.5px dashed rgba(255,255,255,.55)}
.bm span{position:relative;display:block;padding:13px 13px 0;font-family:var(--brush);font-size:1.14rem;line-height:1;white-space:nowrap}
.bm .l-short{display:none}
.bm.hot{color:#fff}
.bm:hover,.bm:focus-visible{--y:-6px}
.bm.on{z-index:2;--y:-4px;--tail:clamp(26px,2.6vw,36px)}
.bm.on i{clip-path:polygon(0 0,50% 9px,100% 0,100% 100%,50% calc(100% - 11px),0 100%)}
.bm.pull{--y:-16px!important;transition-duration:.25s}
.bm:focus-visible{outline:none}.bm:focus-visible span{text-decoration:underline}
@media (max-width:1240px){.bm .l-full{display:none}.bm .l-short{display:block}}
@media (max-width:700px){
  :root{--sh:76px}
  .bmarks{right:calc(var(--side) + 8px);gap:3px}
  .bm{--pk:68px;width:31px;min-width:0}
  .bm span{padding:10px 0 0;writing-mode:vertical-rl;margin:0 auto;font-size:.8rem;letter-spacing:0}
  .bm.on{--tail:26px}
  header.top .brand{padding:5px 9px 4px}header.top .brand img{height:19px}
}
@media (max-width:360px){.bmarks{gap:2px}.bm{width:26px}.bm span{font-size:.72rem}header.top .brand img{height:16px}}
/* the big red marker that drew every red circle on this site. the open book covers it */
.dt-marker{position:absolute;z-index:0;width:clamp(46px,4.2vw,62px);transform:translateX(-50%);pointer-events:none;display:none}
.dt-marker svg{position:absolute;overflow:visible}
.mk-pen{left:0;top:0;width:100%;transform:rotate(9deg);filter:drop-shadow(5px 8px 4px rgba(23,21,34,.22))}
.mk-cap{left:8%;top:calc(var(--mw,62px) * 6);width:85%;transform:rotate(-28deg);filter:drop-shadow(4px 6px 3px rgba(23,21,34,.2))}
.mk-scribble{left:-60%;top:-60px;width:220%;opacity:.0}

.paperclip{position:absolute;z-index:7;right:-12px;top:clamp(130px,12vw,190px);width:30px;height:84px;transform:rotate(8deg);pointer-events:none;filter:drop-shadow(1px 2px 1px rgba(23,21,34,.25))}
@media (max-width:899px){.paperclip{display:none}}
body.on-cover .paperclip{display:none}
/* corner + top button keep inside the book */
.dogear{display:none!important}
.totop{right:calc(var(--side) + 14px);transition:opacity .3s,transform .3s}
/* hero (the cover) works off the book width now, not the screen */
@media (max-width:899px){.hz-panel{padding-bottom:calc((100cqw - 2 * var(--gut)) * 0.5441 + 6px)}}
/* the page flip: soft paper, driven frame by frame */
.flip-sheet{position:fixed;inset:0;z-index:45;pointer-events:none;overflow:hidden}
.flip-page,.flip-ghost{position:absolute;transform-style:preserve-3d}
.fseg{position:absolute;top:0;height:100%;transform-style:preserve-3d;transform-origin:0 50%;will-change:transform}
.flip-under{position:absolute;z-index:0;overflow:hidden;background:#fff}
.flip-under *{animation-duration:0s!important;animation-delay:0s!important;animation-iteration-count:1!important;transition:none!important}
.flip-dim,.flip-cast{z-index:1}
.fface *,.flip-under *{filter:none!important;backdrop-filter:none!important;will-change:auto!important}
.fface b.sh,.flip-dim,.flip-cast{will-change:transform,opacity!important}
.flip-under{will-change:transform}
.flip-page{z-index:2}
.fface{position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#fff}
.fface *{animation-duration:0s!important;animation-delay:0s!important;animation-iteration-count:1!important;transition:none!important}
.fface.backf{transform:rotateY(180deg);background-color:#FBFAF6;background-image:repeating-linear-gradient(transparent 0 37px,rgba(127,134,245,.18) 37px 38px)}
.fface.blank{background-color:#FCFBF8;background-image:repeating-linear-gradient(transparent 0 37px,rgba(127,134,245,.16) 37px 38px)}
.fface b.sh{position:absolute;inset:0;pointer-events:none}
.flip-dim,.flip-cast{position:absolute;pointer-events:none}
.flip-dim{background:rgba(23,21,34,.22)}
.flip-cast::after{content:"";position:absolute;top:0;bottom:0;width:clamp(80px,12vw,200px)}
.flip-cast::after{left:0;background:linear-gradient(90deg,rgba(23,21,34,.34),rgba(23,21,34,.1) 35%,transparent)}
/* ===== v61: logo bookmark, smoother bookmarks, library back cover, handwritten form ===== */
/* bookmarks: same shape points in both states so the tail grows smoothly, no filters */
.bm{filter:none!important;will-change:transform}
.bm i,.bm::before{clip-path:polygon(0 0,50% 9px,100% 0,100% 100%,50% 100%,0 100%);transition:height .4s cubic-bezier(.3,1.3,.5,1),clip-path .4s cubic-bezier(.3,1.3,.5,1)}
.bm::before{content:"";position:absolute;left:2px;right:-3px;top:1px;height:calc(var(--pk,46px) + var(--tail,0px));background:rgba(23,21,34,.2)}
.bm.on i,.bm.on::before{clip-path:polygon(0 0,50% 9px,100% 0,100% 100%,50% calc(100% - 11px),0 100%)}
/* the logo is its own bookmark, a fat card with a tassel lying on the desk */
header.top .wrap a.brand{position:absolute;left:calc(var(--bl) + clamp(14px,2.6vw,44px));bottom:0;z-index:0;margin:0;display:flex;align-items:flex-start;height:var(--lpk,58px);padding:12px 16px 0;background:#fff;border:2.5px solid var(--ink);border-bottom:0;border-radius:14px 14px 0 0;box-shadow:3px -1px 0 rgba(23,21,34,.14);transform:translateY(var(--y,0px));transition:transform .35s cubic-bezier(.3,1.6,.45,1),opacity .3s}
header.top .wrap a.brand:hover,header.top .wrap a.brand:focus-visible{--y:-7px;transform:translateY(var(--y))}
header.top .wrap a.brand img{height:26px}
header.top .wrap a.brand::before{content:"";position:absolute;left:9px;top:9px;width:9px;height:9px;border-radius:50%;background:var(--mat);border:2px solid var(--ink)}
header.top .wrap a.brand img{margin-left:10px}
.tassel{position:absolute;right:calc(100% - 14px);top:-6px;width:84px;height:46px;overflow:visible;pointer-events:none;transform-origin:100% 30%}
a.brand:hover .tassel{animation:tassel .8s ease-in-out}
@keyframes tassel{25%{transform:rotate(-9deg)}60%{transform:rotate(6deg)}100%{transform:none}}
@media (max-width:700px){header.top .wrap a.brand{--lpk:50px;padding:10px 10px 0;left:calc(var(--bl) + 10px)}header.top .wrap a.brand img{height:18px;margin-left:12px}header.top .wrap a.brand::before{left:6px;top:8px;width:7px;height:7px}.tassel{width:50px;height:27px;right:calc(100% - 11px);top:-3px}header.top .wrap a.brand{left:calc(var(--bl) + 34px)}}
@media (max-width:360px){header.top .wrap a.brand img{height:15px}header.top .wrap a.brand{padding:10px 7px 0}}
/* ===== the library back cover ===== */
.ft.lib{display:block;min-height:0!important;background:#5A60D8!important;color:#fff;padding:clamp(34px,5vw,80px) clamp(22px,5vw,90px) clamp(26px,3vw,40px);overflow:hidden;
  background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.045) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(23,21,34,.07) 0 1px,transparent 1px 3px),radial-gradient(120% 90% at 30% 20%,rgba(255,255,255,.12),transparent 60%)!important;
  box-shadow:inset 0 0 0 3px rgba(23,21,34,.08),inset 0 18px 30px -18px rgba(23,21,34,.35),2px 3px 0 -1px #fff,2px 3px 0 0 #CBCCE4,0 34px 60px -24px rgba(23,21,34,.5)!important}
.lc-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,.9fr);gap:clamp(26px,4vw,70px);align-items:start;max-width:1400px;margin:0 auto}
.lc-logo{display:inline-block;background:#fff;border:2.5px solid var(--ink);border-radius:12px;padding:8px 14px 6px;box-shadow:4px 4px 0 var(--ink);transform:rotate(-3deg)}
.lc-logo img{height:28px;display:block}
.lc-quote{margin:22px 0 0;max-width:30em;font-weight:600;font-size:1.02rem;line-height:1.6;color:rgba(255,255,255,.92)}
.lc-big{margin:clamp(22px,3vw,40px) 0 0;font-family:var(--f-head,inherit);font-weight:800;font-size:clamp(1.9rem,3.4vw,3.2rem);line-height:1.08;letter-spacing:-.01em;color:#fff;text-shadow:0 2px 0 rgba(23,21,34,.35),0 -1px 0 rgba(255,255,255,.25)}
.lc-big em{font-style:normal;color:var(--yellow)}
/* pocket + date due card */
.lc-pocket-wrap{position:relative;padding-top:10px;max-width:360px;justify-self:center;width:100%;transform:rotate(-2.5deg)}
.lc-card{position:relative;z-index:1;margin:0 18px;background:#FFF9EA;color:var(--ink);border-radius:4px;padding:14px 14px 108px;box-shadow:0 6px 14px rgba(23,21,34,.25);
  background-image:linear-gradient(90deg,transparent 88px,rgba(255,68,48,.55) 88px,rgba(255,68,48,.55) 90px,transparent 90px)}
.lc-card-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;white-space:nowrap;border-bottom:2px solid var(--ink);padding-bottom:6px;margin-bottom:4px;font-family:var(--f-body);font-weight:800;font-size:.68rem;letter-spacing:.1em}
.lc-card-h span{font-weight:700;color:var(--soft)}
.lc-card a{display:grid;grid-template-columns:76px 1fr;gap:14px;align-items:center;padding:5px 0;border-bottom:1px solid rgba(127,134,245,.4);text-decoration:none;color:var(--ink);font-family:var(--brush);font-size:1.22rem;line-height:1.2;transition:transform .15s}
.lc-card a:hover{transform:translateX(4px)}.lc-card a:hover span{text-decoration:underline;text-decoration-color:var(--red)}
.lc-card s{text-decoration:none;font-family:var(--f-body);font-weight:800;font-size:.68rem;letter-spacing:.1em;color:#5A60D8;border:1.6px solid currentColor;border-radius:4px;padding:2px 5px;justify-self:start;opacity:.85}
.lc-card a:nth-child(odd) s{transform:rotate(-4deg)}.lc-card a:nth-child(even) s{transform:rotate(3deg);color:var(--red)}
.lc-pocket{position:absolute;z-index:2;left:0;right:0;bottom:-14px;height:112px;background:#EBD9B0;border-radius:6px 6px 10px 10px;box-shadow:0 -3px 6px rgba(23,21,34,.18),0 10px 18px rgba(23,21,34,.25);display:grid;place-content:center;text-align:center;color:#6B5320;
  background-image:linear-gradient(180deg,rgba(255,255,255,.35),transparent 30%)}
.lc-pocket::before{content:"";position:absolute;left:50%;top:0;width:70px;height:20px;transform:translateX(-50%);background:#E0CB98;border-radius:0 0 40px 40px}
.lc-pocket b{font-family:var(--f-body);font-weight:800;font-size:.86rem;letter-spacing:.18em;line-height:1.35}
.lc-pocket small{display:block;margin-top:4px;font-family:var(--brush);font-size:1rem;letter-spacing:0}
/* index card + stickers */
.lc-side{display:grid;gap:26px;justify-items:start}
.lc-index{position:relative;background:#fff;color:var(--ink);border-radius:4px;padding:22px 20px 18px;transform:rotate(1.8deg);box-shadow:0 6px 14px rgba(23,21,34,.25);max-width:340px;width:100%;
  background-image:linear-gradient(transparent 46px,rgba(255,68,48,.5) 46px,rgba(255,68,48,.5) 48px,transparent 48px),repeating-linear-gradient(transparent 0 27px,rgba(127,134,245,.32) 27px 28px);background-position:0 0,0 20px}
.lc-index::before{content:"";position:absolute;left:50%;top:-12px;width:96px;height:26px;transform:translateX(-50%) rotate(-4deg);background:rgba(255,212,0,.82);border:1px solid rgba(23,21,34,.12)}
.lc-index h4{margin:0 0 6px;font-family:var(--brush);font-weight:400;font-size:1.4rem;line-height:1.1}
.lc-index h4+span{margin-top:4px}
.lc-index span,.lc-index a{display:block;font-weight:600;font-size:.94rem;line-height:28px;color:var(--ink)}
.lc-index a{color:#4A50C8;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.lc-index .lc-gap{height:14px}
.lc-index span.nw{display:inline;white-space:nowrap;font-size:inherit;line-height:inherit}
.lc-stick{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.lc-end{font-family:var(--brush);font-size:clamp(1.7rem,2.4vw,2.2rem);line-height:1;color:var(--red);border:3px solid var(--red);border-radius:10px;padding:6px 14px 4px;transform:rotate(-9deg);background:rgba(255,255,255,.88);letter-spacing:.02em;box-shadow:inset 0 0 0 2px rgba(255,255,255,.9)}
.lc-bottom{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;max-width:1400px;margin:clamp(34px,4vw,56px) auto 0;padding-top:18px;border-top:1.5px dashed rgba(255,255,255,.4);font-size:.88rem;font-weight:600;color:rgba(255,255,255,.9)}
.lc-bottom .ft-sig{margin:0;font-family:var(--brush);font-size:1.15rem;color:#fff}
.lc-bottom .ft-meta{margin-left:auto;display:flex;gap:8px}
.lc-bottom .ft-chip{background:#fff;color:var(--ink)}
@media (max-width:1100px){.lc-grid{grid-template-columns:1fr 1fr}.lc-blurb{grid-column:1/-1}}
@media (max-width:640px){.lc-grid{grid-template-columns:1fr}.lc-pocket-wrap{max-width:330px}.lc-side{justify-items:center}.lc-bottom .ft-meta{margin-left:0}.lc-card a{grid-template-columns:66px 1fr;font-size:1.12rem}.lc-card{background-image:linear-gradient(90deg,transparent 78px,rgba(255,68,48,.55) 78px,rgba(255,68,48,.55) 80px,transparent 80px)}}
/* ===== Slide In: the form is handwritten right onto the page ===== */
#funForm{background:transparent;border:0;box-shadow:none;padding:0;counter-reset:q;font-family:var(--brush);--pen:#2E3AA8}
#funForm::before,#funForm::after{display:none}
#funForm .progress{margin-bottom:10px}
#funForm .progress .bar{display:none}
#funForm .progress .lbl{font-family:var(--brush);text-transform:none;letter-spacing:0;font-size:1.15rem;color:var(--soft);font-weight:400}
#funForm .progress .lbl #pgLbl{color:var(--red);transform:rotate(-3deg);display:inline-block}
#funForm .page{border:0;padding:0;margin:0;display:grid;gap:clamp(18px,2vw,26px)}
#funForm legend{font-family:var(--brush);font-weight:400;font-size:clamp(2rem,3.4vw,2.7rem);line-height:1.1;color:var(--ink);margin-bottom:14px;padding:0 4px 10px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 14' preserveAspectRatio='none'%3E%3Cpath d='M3 9c60-6 130-7 200-3 30 2 60 2 94-1' fill='none' stroke='%23FF4430' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") left bottom/100% 12px no-repeat}
#funForm .field{gap:4px;counter-increment:q}
#funForm .field > label,#funForm .field .fq{font-family:var(--brush);font-weight:400;font-size:clamp(1.35rem,1.9vw,1.6rem);line-height:1.25;color:var(--ink);background:none;border:0;padding:0;box-shadow:none;border-radius:0;display:block}
#funForm .field > label::before,#funForm .field .fq::before{content:counter(q) ". ";color:var(--red)}
#funForm .hint{display:block;font-family:var(--brush);font-style:normal;font-weight:400;font-size:1.02rem;color:var(--soft);margin-top:2px}
#funForm input[type=text],#funForm input[type=email],#funForm input[type=tel],#funForm textarea,#funForm input[type=range]{border:0!important;border-radius:0!important}
#funForm input[type=text],#funForm input[type=email],#funForm input[type=tel],#funForm textarea{width:100%;background:transparent;border:0;border-radius:0;box-shadow:none;outline:none;padding:4px 2px 6px;font-family:var(--brush);font-size:1.45rem;line-height:1.3;color:var(--pen);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 8' preserveAspectRatio='none'%3E%3Cpath d='M1 5c80-3 160-2 240 0s110-2 158-1' fill='none' stroke='%23171522' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") left bottom/100% 7px no-repeat}
#funForm input::placeholder,#funForm textarea::placeholder{color:rgba(90,87,112,.45);font-family:var(--brush)}
#funForm input[type=text]:focus,#funForm input[type=email]:focus,#funForm input[type=tel]:focus,#funForm textarea:focus{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 8' preserveAspectRatio='none'%3E%3Cpath d='M1 5c80-3 160-2 240 0s110-2 158-1' fill='none' stroke='%23FF4430' stroke-width='3.4' stroke-linecap='round'/%3E%3C/svg%3E")}
#funForm textarea{min-height:152px;resize:vertical;line-height:38px;padding:0 2px;background:repeating-linear-gradient(transparent 0 36px,rgba(23,21,34,.55) 36px 38px)}
#funForm textarea:focus{background:repeating-linear-gradient(transparent 0 36px,rgba(255,68,48,.7) 36px 38px)}
/* options: written out, the red marker circles what you pick */
#funForm .chips{gap:4px 6px;margin-top:4px}
#funForm .chip span{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0;padding:.35em .75em;font-family:var(--brush);font-weight:400;font-size:1.3rem;color:var(--ink);transform:none;position:relative}
#funForm .chip span::after{content:"";position:absolute;inset:-4px -6px;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 50' preserveAspectRatio='none'%3E%3Cpath d='M14 12C40 2 96 2 112 18c10 12-6 26-46 28C28 48 4 38 6 24 8 12 34 6 70 6' fill='none' stroke='%23FF4430' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;clip-path:inset(0 100% 0 0);transition:clip-path .35s ease}
#funForm .chip:hover span::after{clip-path:inset(0 0 0 0);opacity:.25}
#funForm .chip input:checked + span{color:var(--ink)}
#funForm .chip input:checked + span::after{clip-path:inset(0 0 0 0);opacity:1}
#funForm .chip input:focus-visible + span{outline:2px dashed var(--purple);outline-offset:2px}
#funForm .pick{gap:4px 14px}
#funForm .pick .chip{justify-items:start}
#funForm .pick .chip span{width:fit-content;max-width:100%}
#funForm .pick .chip span{display:grid;gap:0;padding:.55em 1.4em;border-radius:0;height:auto}
#funForm .pick .chip span small{font-family:var(--brush);font-size:1rem;color:var(--soft)}
#funForm .slider-out{font-family:var(--brush);font-style:normal;font-size:1.5rem;color:var(--pen)}
#funForm input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;height:34px}
#funForm input[type=range]::-webkit-slider-runnable-track{height:3px;background:var(--ink);border-radius:3px}
#funForm input[type=range]::-moz-range-track{height:3px;background:var(--ink);border-radius:3px}
#funForm input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-10px;border-radius:50%;background:var(--red);border:2.5px solid var(--ink);cursor:pointer}
#funForm input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--red);border:2.5px solid var(--ink)}
#funForm .range-ends{font-family:var(--brush);font-size:1.05rem;font-weight:400}
#funForm .pinky{font-family:var(--brush);font-weight:400;font-size:1.3rem;line-height:1.3;align-items:center}
#funForm .pinky input{-webkit-appearance:none;appearance:none;width:26px;height:26px;margin:0;border:2.5px solid var(--ink);border-radius:4px 8px 5px 9px;background:transparent;cursor:pointer;flex:none}
#funForm .pinky input:checked{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M5 15l7 8L27 3' fill='none' stroke='%23FF4430' stroke-width='4.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/120% no-repeat}
#funForm .err{font-family:var(--brush);font-size:1.25rem;color:var(--red)}
#funForm .nav-row{margin-top:30px}
#funForm .nav-row .zbtn{background:transparent;color:var(--ink);font-family:var(--brush);font-weight:400;font-size:1.45rem;letter-spacing:0;padding:.3em 1em .25em;border:2.5px solid var(--ink);border-radius:255px 18px 225px 18px/18px 225px 18px 255px;box-shadow:none;transition:transform .15s}
#funForm .nav-row .zbtn:hover{transform:rotate(-2deg) scale(1.04);background:rgba(255,212,0,.35)}
#funForm .nav-row #nextBtn,#funForm .nav-row #sendBtn{background:rgba(255,212,0,.55)}
/* ===== Team Z vs the robots, on a sheet of colored paper that unrolls as you scroll ===== */
.roll-wrap{position:relative;max-width:1320px;margin:0 auto;--hid:0px;--open:0px;--k:1}
.roll-win{position:relative;overflow:hidden;padding:0 18px 30px;margin:0 -18px -30px;will-change:transform}
.roll-on .roll-win{transform:translateY(calc(-1 * var(--hid)))}
.roll-on .roll-win > .ring{transform:translateY(var(--hid));will-change:transform}
#ai .ring.roll{border:0;border-radius:3px;max-width:none;background-color:#CDD0FB;
  background-image:radial-gradient(120% 60% at 50% 0%,rgba(255,255,255,.35),transparent 60%),repeating-linear-gradient(115deg,rgba(255,255,255,.05) 0 2px,transparent 2px 5px),repeating-linear-gradient(25deg,rgba(23,21,34,.025) 0 1px,transparent 1px 4px);
  box-shadow:0 1px 2px rgba(23,21,34,.18),0 22px 34px -18px rgba(23,21,34,.45);padding-top:clamp(56px,6vw,90px)}
#ai .ring.roll::before,#ai .ring.roll::after{display:none}
.roll-top{position:absolute;z-index:3;left:0;right:0;top:0;height:0;pointer-events:none}
.roll-top::before,.roll-top::after{content:"";position:absolute;top:-12px;width:clamp(90px,10vw,140px);height:30px;background:rgba(160,228,93,.82);border:1px solid rgba(23,21,34,.12)}
.roll-top::before{left:6%;transform:rotate(-6deg)}.roll-top::after{right:6%;transform:rotate(5deg);background:rgba(255,212,0,.78)}
.roll-cyl{display:none;position:absolute;z-index:4;left:-12px;right:-12px;top:0;height:58px;margin-top:-29px;border-radius:29px;pointer-events:none;will-change:transform;
  transform:translateY(var(--open)) scaleY(var(--k));
  background:linear-gradient(180deg,#8E94E8 0%,#B9BDF7 16%,#E9EAFF 34%,#CDD0FB 52%,#A9AEF2 74%,#7D83DA 100%);box-shadow:0 16px 20px -10px rgba(23,21,34,.45),inset 0 -2px 0 rgba(23,21,34,.12)}
.roll-cyl::before,.roll-cyl::after{content:"";position:absolute;top:0;bottom:0;width:26px;border-radius:50%;background:radial-gradient(closest-side,#7D83DA 0 18%,#E9EAFF 24% 36%,#A9AEF2 42% 56%,#E9EAFF 62% 74%,#8E94E8 80%);box-shadow:inset 0 0 0 1.5px rgba(23,21,34,.18)}
.roll-cyl::before{left:-6px}.roll-cyl::after{right:-6px}
.roll-on .roll-cyl{display:grid}
.totop{transition:opacity .25s,transform .25s}
.totop.gone{opacity:0!important;pointer-events:none!important}

/* =====================================================================
   FOOTER: the book is done, this is just the desk. real things, not drawings
   ===================================================================== */
.ft.desk{display:block;position:relative;z-index:1;margin:0!important;padding:clamp(30px,4vw,60px) var(--desk) 0;background:transparent!important;background-image:none!important;box-shadow:none!important;border-radius:0!important;color:var(--ink);min-height:0!important;overflow:hidden}
.ft.desk::before{display:none}
.dk{position:relative;max-width:1240px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.8fr) minmax(0,.95fr);grid-template-areas:"letter phone side";gap:clamp(26px,4vw,64px);align-items:start;padding-bottom:clamp(40px,5vw,70px)}
/* paper that looks like paper */
.dk-paper{background:#FDFDFB;background-image:linear-gradient(155deg,#FFFFFF 0%,#F8F7F3 60%,#F1F0EB 100%);border-radius:2px;
  box-shadow:0 1px 1px rgba(20,20,30,.08),0 3px 6px -1px rgba(20,20,30,.12),0 18px 30px -12px rgba(20,20,30,.32)}
/* letterhead with the blurb and the tagline */
.dk-letter{grid-area:letter;position:relative;padding:clamp(26px,3vw,44px) clamp(24px,3vw,46px) clamp(30px,3vw,44px);transform:rotate(-1.4deg);font-family:var(--f-body)}
.dk-letter .dk-logo img{height:30px;display:block}
.dk-letter hr{border:0;border-top:1px solid rgba(20,20,30,.14);margin:18px 0 22px}
.dk-letter .dk-big{margin:0;font-weight:800;font-size:clamp(1.9rem,3vw,2.9rem);line-height:1.08;letter-spacing:-.015em;color:#1d1b29}
.dk-letter .dk-big em{font-style:normal;color:#5A60D8}
.dk-letter p.dk-blurb{margin:16px 0 0;font-size:1rem;line-height:1.65;color:#4a4858;max-width:34em}
.dk-letter nav{margin-top:24px;display:flex;flex-wrap:wrap;gap:6px 18px;padding-top:16px;border-top:1px solid rgba(20,20,30,.1)}
.dk-letter nav a{font-size:.92rem;font-weight:700;color:#1d1b29;text-decoration:none;border-bottom:1.5px solid rgba(90,96,216,.35)}
.dk-letter nav a:hover{color:#5A60D8;border-bottom-color:#5A60D8}
/* a business card on top of the letter */
.dk-card{position:absolute;right:clamp(-40px,-2.6vw,-16px);top:clamp(-34px,-2.4vw,-20px);width:clamp(220px,19vw,270px);aspect-ratio:1.75;padding:16px 18px;transform:rotate(5deg);display:flex;flex-direction:column;justify-content:space-between;background:#FFFFFF;background-image:linear-gradient(160deg,#FFFFFF,#F4F3EF);border-radius:3px;
  box-shadow:0 1px 1px rgba(20,20,30,.12),0 4px 8px -2px rgba(20,20,30,.2),0 16px 24px -10px rgba(20,20,30,.35)}
.dk-card img{height:18px;width:auto;align-self:flex-start}
.dk-card b{display:block;font-family:var(--f-body);font-weight:700;font-size:.92rem;color:#1d1b29;letter-spacing:.005em}
.dk-card small{display:block;font-family:var(--f-body);font-size:.74rem;color:#6a6878;margin-top:2px}
.dk-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:#5A60D8;border-radius:0 0 3px 3px}
/* the phone */
.dk-phone{grid-area:phone;justify-self:center;position:relative;width:min(100%,250px);aspect-ratio:9/19;border-radius:40px;padding:11px;transform:rotate(6deg);
  background:linear-gradient(135deg,#3a3a40 0%,#18181c 30%,#0c0c0f 70%,#2a2a30 100%);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.18),inset 0 0 0 3px #0b0b0d,0 2px 3px rgba(0,0,0,.3),0 26px 40px -16px rgba(20,20,30,.6),18px 22px 40px -22px rgba(20,20,30,.5)}
.dk-phone::before{content:"";position:absolute;left:-3px;top:22%;width:3px;height:9%;border-radius:2px 0 0 2px;background:#2b2b31;box-shadow:0 70px 0 #2b2b31}
.dk-screen{position:relative;height:100%;border-radius:30px;overflow:hidden;background:#fff;font-family:var(--f-body);color:#111;display:flex;flex-direction:column}
.dk-screen::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,0) 38%);pointer-events:none}
.dk-island{position:absolute;left:50%;top:9px;width:34%;height:20px;border-radius:12px;background:#000;transform:translateX(-50%);z-index:2}
.dk-status{display:flex;justify-content:space-between;padding:10px 18px 0;font-size:.62rem;font-weight:700}
.dk-prof{padding:22px 14px 8px}
.dk-prof .row{display:flex;align-items:center;gap:12px}
.dk-prof .av{width:58px;height:58px;border-radius:50%;padding:3px;background:conic-gradient(#A0E45D,#7A80F2,#FF4430,#FFD400,#A0E45D)}
.dk-prof .av img{width:100%;height:100%;border-radius:50%;background:#fff;border:2px solid #fff;display:block}
.dk-prof .nums{display:flex;gap:10px;font-size:.6rem;color:#555;text-align:center}.dk-prof .nums b{display:block;font-size:.78rem;color:#111}
.dk-prof h5{margin:10px 0 0;font-size:.8rem;font-weight:800}
.dk-prof p{margin:2px 0 0;font-size:.66rem;line-height:1.4;color:#333}
.dk-prof .btns{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px}
.dk-prof .btns a,.dk-prof .btns span{display:block;text-align:center;font-size:.64rem;font-weight:700;padding:6px 0;border-radius:8px;background:#EFEFF3;color:#111;text-decoration:none}
.dk-prof .btns a{background:#5A60D8;color:#fff}
.dk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:auto}
.dk-grid i{aspect-ratio:1;display:block}
.dk-grid i:nth-child(1){background:#7A80F2}.dk-grid i:nth-child(2){background:#F4F2EC url(img/icon.png) center/46% no-repeat}.dk-grid i:nth-child(3){background:#A0E45D}
.dk-grid i:nth-child(4){background:#FFD400}.dk-grid i:nth-child(5){background:#1d1b29}.dk-grid i:nth-child(6){background:#FF4430}
/* sticky note + coffee */
.dk-side{grid-area:side;display:grid;gap:clamp(30px,4vw,54px);justify-items:center;padding-top:10px}
.dk-note{position:relative;width:min(100%,250px);aspect-ratio:1;padding:26px 22px;transform:rotate(-4deg);background:#FFEC7A;background-image:linear-gradient(170deg,#FFF3A6 0%,#FFEA70 55%,#F8DE5A 100%);
  box-shadow:0 1px 1px rgba(20,20,30,.12),0 10px 14px -8px rgba(20,20,30,.35);font-family:var(--brush);color:#1d1b29}
.dk-note::after{content:"";position:absolute;right:6px;bottom:4px;width:60%;height:24px;z-index:-1;box-shadow:12px 14px 16px rgba(20,20,30,.28);transform:rotate(4deg);border-radius:0 0 40% 0}
.dk-note p{margin:0;font-size:clamp(1.35rem,1.8vw,1.6rem);line-height:1.2}
.dk-note a{display:inline-block;margin-top:12px;font-size:1.25rem;color:#3d43b8;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.dk-cup{position:relative;width:min(70%,190px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,#FFFFFF 0 58%,#F1F1F1 63%,#E2E2E2 72%,#F7F7F7 80%,#DADADA 100%);
  box-shadow:0 2px 3px rgba(0,0,0,.18),0 18px 28px -10px rgba(20,20,30,.45)}
.dk-cup::before{content:"";position:absolute;inset:18%;border-radius:50%;background:radial-gradient(circle at 50% 50%,#FFFFFF 0 62%,#E9E9E9 74%,#FAFAFA 86%,#D4D4D4 100%);box-shadow:0 6px 10px -3px rgba(0,0,0,.35)}
.dk-cup::after{content:"";position:absolute;inset:26%;border-radius:50%;background:radial-gradient(circle at 42% 38%,#8A5A33 0%,#5B3820 35%,#3A2214 70%,#2A170D 100%);box-shadow:inset 0 0 0 4px #A9784B,inset 0 0 0 7px rgba(196,148,98,.55),inset 0 3px 8px rgba(0,0,0,.5)}
.dk-cup i{position:absolute;right:2%;top:50%;width:20%;height:13%;border-radius:0 40px 40px 0;transform:translate(60%,-50%);background:linear-gradient(180deg,#FFFFFF,#E3E3E3);box-shadow:0 4px 6px -2px rgba(0,0,0,.3)}
.dk-cup b{position:absolute;left:35%;top:33%;width:16%;height:9%;border-radius:50%;background:rgba(255,255,255,.28);filter:blur(1px);z-index:2}
/* the mat's own printed edge carries the small print */
.dk-edge{position:relative;max-width:1240px;margin:0 auto;padding:30px 0 22px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;font-family:var(--f-body);font-size:.8rem;font-weight:700;color:rgba(74,80,200,.85);letter-spacing:.04em}
.dk-edge::before{content:"";position:absolute;left:0;right:0;top:0;height:16px;background:repeating-linear-gradient(90deg,rgba(74,80,200,.55) 0 1.5px,transparent 1.5px 12px) bottom/100% 8px no-repeat,repeating-linear-gradient(90deg,rgba(74,80,200,.7) 0 1.5px,transparent 1.5px 60px) bottom/100% 16px no-repeat}
.dk-edge .dk-sig{font-family:var(--brush);font-weight:400;font-size:1.1rem;letter-spacing:0;color:#3d43b8}
.dk-edge nav{margin-left:auto;display:flex;gap:16px}
.dk-edge nav a{color:inherit;text-decoration:none;text-transform:uppercase;font-size:.74rem;letter-spacing:.12em}
.dk-edge nav a:hover{text-decoration:underline}
@media (max-width:1060px){.dk{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"letter letter" "phone side"}.dk-card{right:3%}.dk-letter{margin-right:4%}}
@media (max-width:620px){.dk{grid-template-columns:1fr;grid-template-areas:"letter" "phone" "side";gap:56px}.dk-letter{transform:rotate(-.8deg)}.dk-card{position:relative;right:auto;top:auto;margin:24px -6px -40px auto;width:min(84%,250px)}.dk-phone{width:min(74%,240px)}.dk-edge nav{margin-left:0}}
/* desk layer: sits under the book, scrolls with the page */
.desk-layer{position:absolute;left:0;top:0;width:100%;z-index:0;pointer-events:none;overflow:hidden}
.desk-layer .dt-marker{position:absolute!important;top:120px!important;transform:translateX(-50%)}
.dt-marker.tight .mk-pen{transform:rotate(4deg)}
.dt-marker.tight .mk-cap{left:6%;width:88%;top:calc(var(--mw) * 5.7 + 18px);transform:rotate(-6deg)}
.dk-item{position:absolute;display:none;transform:rotate(var(--r,0deg));filter:drop-shadow(4px 7px 4px rgba(23,21,34,.2))}
.dk-item svg{display:block;width:100%;height:auto}
@media (max-width:1180px){.desk-layer .dk-item{display:none!important}}
/* footer v2: the whole width of the desk, real cup, real phone */
.ft.desk{padding:clamp(40px,5vw,80px) clamp(18px,5vw,110px) 0}
.ft.desk .dk{max-width:1640px;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr) minmax(0,.7fr) minmax(0,.7fr);grid-template-areas:"letter phone note cup";gap:clamp(24px,4vw,80px);align-items:center}
.dk-phone{grid-area:phone;position:relative;display:block;justify-self:center;width:min(100%,260px);aspect-ratio:195/380;transform:rotate(7deg);padding:0;background:none;border-radius:0;box-shadow:none;filter:drop-shadow(10px 18px 14px rgba(20,20,30,.35)) drop-shadow(0 2px 2px rgba(20,20,30,.2));transition:transform .4s cubic-bezier(.3,1.4,.5,1)}
.dk-phone::before{display:none}
.dk-phone:hover{transform:rotate(3deg) translateY(-6px)}
.dk-phone img{position:absolute;display:block;max-width:none}
.dk-ph-body{inset:0;width:100%;height:100%}
.dk-ph-shot{left:5.9%;top:3.4%;width:87.7%;height:94.4%;object-fit:cover;object-position:50% 0;border-radius:11% / 5.6%;z-index:1}
.dk-ph-body{z-index:0}
.dk-phone::after{content:"";position:absolute;z-index:2;left:5.9%;top:3.4%;width:87.7%;height:94.4%;border-radius:11% / 5.6%;background:linear-gradient(125deg,rgba(255,255,255,.22) 0%,rgba(255,255,255,0) 40%);pointer-events:none}
.dk-note{grid-area:note;justify-self:center}
.dk-note::after{display:none!important}
.dk-note{box-shadow:0 1px 1px rgba(20,20,30,.14),0 2px 4px rgba(20,20,30,.08),0 14px 18px -10px rgba(20,20,30,.38),inset 0 -20px 26px -24px rgba(120,90,0,.35)}
.dk-cup{grid-area:cup;justify-self:center;display:block;width:min(100%,280px);height:auto;transform:rotate(-8deg);filter:drop-shadow(8px 16px 14px rgba(20,20,30,.38)) drop-shadow(0 2px 2px rgba(20,20,30,.2))}
.ft.desk .dk-edge{max-width:1640px}
@media (max-width:1180px){.ft.desk .dk{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"letter letter" "phone note" "phone cup";row-gap:40px}}
@media (max-width:620px){.ft.desk .dk{grid-template-columns:1fr;grid-template-areas:"letter" "phone" "note" "cup";gap:56px}.dk-phone{width:min(70%,240px)}.dk-cup{width:min(72%,250px)}}
/* ===== v64 ===== */
/* the setup: three flops in a row, short and tidy, then Plan Z as one wide card */
.c1-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,34px) clamp(16px,2vw,28px);align-items:start;max-width:1120px;margin:0 auto}
.c1-card{gap:6px}
.c1-card.no{padding:clamp(18px,1.6vw,22px) clamp(18px,1.6vw,22px) 16px}
.c1-card.no p{flex:none}
.c1-card.no .c1-receipt{margin-top:10px;padding-top:10px}
.c1-card.no .c1-receipt div{display:grid;grid-template-columns:auto 1fr;gap:10px}
.c1-card.yes{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);grid-template-areas:"top rec" "h rec" "p link";column-gap:clamp(22px,4vw,64px);row-gap:6px;padding:clamp(24px,2.6vw,36px) clamp(24px,3vw,44px);margin-top:clamp(8px,1.4vw,18px)}
.c1-card.yes .c1-top{grid-area:top;min-height:0}
.c1-card.yes h3{grid-area:h;font-size:clamp(1.5rem,2.2vw,2.1rem)}
.c1-card.yes p{grid-area:p;font-size:clamp(1rem,1.15vw,1.12rem)}
.c1-card.yes .c1-receipt{grid-area:rec;align-self:center;margin:0;padding:16px 0 0;border-top:2px dashed rgba(23,21,34,.35);font-size:1.05rem}
.c1-card.yes .c1-receipt dd{font-size:1rem}
.c1-card.yes .c1-link{grid-area:link;align-self:end;justify-self:start}
.c1-twist{right:auto;left:clamp(150px,14vw,190px);transform:rotate(-5deg)}
@media (max-width:900px){.c1-cards{grid-template-columns:1fr;max-width:560px}.c1-card.yes{grid-template-columns:1fr;grid-template-areas:"top" "h" "p" "rec" "link"}.c1-card.yes .c1-receipt{margin-top:10px}.c1-twist{left:auto;right:14px}}
/* the good part: a plain, pretty shelf */
.z3{max-width:1180px;margin:0 auto}
.z3-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(30px,3vw,46px) clamp(14px,2vw,30px)}
.z3-bk{display:grid;justify-items:center;text-align:center;gap:4px;text-decoration:none;color:var(--ink)}
.z3-cov{position:relative;display:block;width:100%;padding:0 6%;margin-bottom:16px}
.z3-cov::after{content:"";position:absolute;left:calc(-1 * clamp(8px,1vw,16px));right:calc(-1 * clamp(8px,1vw,16px));bottom:-14px;height:14px;background:linear-gradient(#FFFFFF,#F3EFE6);border:2.5px solid var(--ink);border-radius:3px;box-shadow:0 8px 10px -6px rgba(23,21,34,.45)}
.z3-cov img{display:block;width:100%;aspect-ratio:464/672;object-fit:cover;border-radius:2px 7px 7px 2px;border:2px solid var(--ink);box-shadow:inset 6px 0 8px -4px rgba(0,0,0,.4),5px 6px 0 rgba(23,21,34,.85);transform-origin:50% 100%;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.z3-bk:nth-child(odd) .z3-cov img{transform:rotate(-2deg)}.z3-bk:nth-child(even) .z3-cov img{transform:rotate(1.6deg)}
.z3-bk:hover .z3-cov img,.z3-bk:focus-visible .z3-cov img{transform:translateY(-14px) rotate(0)}
.z3-bk em{font-style:normal;font-family:var(--brush);font-size:clamp(1rem,1.15vw,1.12rem);line-height:1.15;color:#3d3a52;max-width:15em}
.z3-cta{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:clamp(36px,4vw,56px)}
.z3-hint{font-family:var(--brush);font-size:1.15rem;color:var(--ink);opacity:.75}
@media (max-width:1000px){.z3-row{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.z3-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (prefers-reduced-motion:no-preference){
  html.rv-on .z3[data-rv]{opacity:1;translate:none}
  html.rv-on .z3 .z3-bk{opacity:0;translate:0 30px;transition:opacity .45s ease var(--d),translate .6s cubic-bezier(.3,1.5,.5,1) var(--d)}
  html.rv-on .z3.in .z3-bk{opacity:1;translate:0 0}
}
/* the open book: on any inner page the turned page lies on the left, out to the screen edge */
.leftpage{width:var(--bl)!important;box-shadow:none!important;background-color:#FBFAF7;background-image:linear-gradient(270deg,rgba(23,21,34,.26),rgba(23,21,34,.07) 34px,transparent 90px),repeating-linear-gradient(transparent 0 37px,rgba(127,134,245,.2) 37px 38px)!important}
.leftpage::before{content:"";position:absolute;top:0;bottom:0;right:clamp(28px,4vw,70px);border-left:2px solid rgba(255,68,48,.3)}
body:not(.on-cover) header.top::after{left:0}
/* footer: things dropped on the table, not lined up */
.ft.desk .dk{display:block;position:relative;max-width:1640px;min-height:clamp(560px,46vw,660px)}
.ft.desk .dk-letter{position:relative;width:min(46%,560px);margin:20px 0 0 2%}
.ft.desk .dk-phone{position:absolute;left:52%;top:70px;width:clamp(170px,15vw,230px);transform:rotate(-14deg)}
.ft.desk .dk-phone:hover{transform:rotate(-10deg) translateY(-6px)}
.ft.desk .dk-note{position:absolute;left:73%;top:8px;width:clamp(190px,15vw,230px);transform:rotate(9deg)}
.ft.desk .dk-note2{position:absolute;left:79%;top:clamp(290px,24vw,340px);width:clamp(170px,13vw,200px);aspect-ratio:1;padding:20px 18px;transform:rotate(-6deg);background:linear-gradient(170deg,#FFD7E2 0%,#FFC2D2 60%,#F8B3C6 100%);box-shadow:0 1px 1px rgba(20,20,30,.14),0 14px 18px -10px rgba(20,20,30,.38);font-family:var(--brush);color:#1d1b29;font-size:1.3rem;line-height:1.2}
.ft.desk .dk-note2 b{display:block;font-weight:400;font-size:1.5rem;color:var(--red)}
.ft.desk .dk-clip{position:absolute;left:66%;top:clamp(380px,32vw,450px);width:22px;transform:rotate(64deg);filter:drop-shadow(1px 2px 1px rgba(20,20,30,.3))}
.ft.desk .dk-clip.c2{left:70%;top:clamp(410px,34vw,480px);transform:rotate(18deg)}
@media (max-width:1100px){.ft.desk .dk{min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:40px 30px;align-items:start}.ft.desk .dk-letter{grid-column:1/-1;width:auto;margin:0}.ft.desk .dk-phone,.ft.desk .dk-note,.ft.desk .dk-note2{position:relative;left:auto;top:auto;justify-self:center}.ft.desk .dk-phone{grid-row:span 2;width:min(80%,230px)}.ft.desk .dk-clip{display:none}}
@media (max-width:620px){.ft.desk .dk{grid-template-columns:1fr}.ft.desk .dk-phone{grid-row:auto}}

/* ===== v66 ===== */
.c1-chip,.c2-chip,.c3-chip{font-family:var(--brush)!important;font-weight:400!important;text-transform:none!important;letter-spacing:.01em!important;font-size:clamp(1.15rem,1.4vw,1.35rem)!important;padding:.25em .9em .15em!important}
@media (min-width:900px){.hz-row2{flex-wrap:nowrap}}
/* hero: a little light and depth on the panel */
.hz-panel{background-image:radial-gradient(90% 80% at 12% 8%,rgba(255,255,255,.28),rgba(255,255,255,0) 60%),radial-gradient(70% 70% at 95% 100%,rgba(23,21,34,.16),rgba(23,21,34,0) 70%),linear-gradient(160deg,rgba(255,255,255,.08),rgba(23,21,34,.08))}
/* setup cards: colorful washi tape */
.c1-tape{height:26px;width:92px;border:0;opacity:.9;background:repeating-linear-gradient(45deg,rgba(255,255,255,.35) 0 6px,transparent 6px 12px),#FF8FA3}
.c1-card:nth-child(2) .c1-tape{background:repeating-linear-gradient(90deg,rgba(255,255,255,.4) 0 3px,transparent 3px 10px),#7A80F2;transform:translateX(-50%) rotate(3deg)}
.c1-card:nth-child(3) .c1-tape{background:radial-gradient(rgba(255,255,255,.55) 2px,transparent 2.5px) 0 0/10px 10px,#FFD400;transform:translateX(-50%) rotate(-6deg)}
/* the turn: plain words in white marker, no tags */
.c2-note{background:none!important;border:0!important;box-shadow:none!important;padding:0 .2em;color:#fff!important;font-size:clamp(1.4rem,1.8vw,1.8rem);text-shadow:0 2px 0 rgba(23,21,34,.25)}
/* shelf CTA pops off the yellow */
.z3-cta .zbtn{background:var(--ink);color:#fff;box-shadow:5px 5px 0 var(--red)}
.z3-cta .zbtn:hover{background:var(--purple);color:#fff}
/* the shelf: a real wooden plank, brackets, a bookend and a plant */
.z3{position:relative;padding:0 clamp(40px,5vw,80px)}
.z3-cov::after{background:linear-gradient(180deg,#D9A66B 0%,#C48A4F 45%,#A8703A 100%)!important;height:18px!important;bottom:-18px!important;border-color:#5B3A1C!important;border-radius:2px!important;box-shadow:0 10px 12px -6px rgba(23,21,34,.5),inset 0 2px 0 rgba(255,255,255,.3)!important}
.z3-cov{margin-bottom:22px}
.z3-bk:first-child .z3-cov::before,.z3-bk:last-child .z3-cov::before{display:none;content:"";position:absolute;bottom:-46px;width:16px;height:30px;background:#2a2833;border-radius:0 0 8px 8px;z-index:-1}
.z3-bk:first-child .z3-cov::before{left:12%}.z3-bk:last-child .z3-cov::before{right:12%}
.z3-end{position:absolute;bottom:0;pointer-events:none;z-index:2}
.z3-bookend{left:-30px;width:40px;bottom:0}
.z3-plant{right:-44px;width:54px;bottom:0}
.z3-bk:nth-child(3n+1) .z3-cov img{transform:rotate(-3deg)}
.z3-bk:nth-child(4) .z3-cov img{transform:rotate(4deg) translateX(4px)}
@media (max-width:1000px){.z3{padding:0}.z3-end{display:none}}
.z3-row{position:relative}.z3-bk:first-child,.z3-bk:last-child{position:relative;z-index:2}
/* footer: sitemap in two tidy rows, tour stands out */
.dk-letter nav{display:grid;grid-template-columns:repeat(3,max-content);gap:12px 24px;align-items:center;justify-items:start}
.dk-letter nav a.dk-tour{background:var(--red);color:#fff;border:2px solid var(--ink);border-radius:999px;padding:.1em .7em;box-shadow:2px 2px 0 var(--ink);transform:rotate(-2deg)}
.dk-letter nav a.dk-tour:hover{color:#fff;background:#E8301E}
@media (max-width:460px){.dk-letter nav{grid-template-columns:repeat(2,max-content)}}
/* footer: phone stays put, a follow label next to it */
.ft.desk .dk-phone,.ft.desk .dk-phone:hover{transform:rotate(-8deg)!important}
.dk-follow{position:absolute;left:61%;top:clamp(440px,37vw,500px);display:inline-flex;flex-direction:column;align-items:flex-start;padding:12px 18px 10px;background:#fff;border:2.5px solid var(--ink);border-radius:14px;box-shadow:5px 5px 0 var(--ink);transform:rotate(-4deg);color:var(--ink);text-decoration:none;font-family:var(--brush);z-index:3;transition:transform .2s cubic-bezier(.3,1.6,.5,1)}
.dk-follow::before{content:"";position:absolute;top:-14px;left:50%;width:70px;height:22px;background:rgba(160,228,93,.85);transform:translateX(-50%) rotate(5deg)}
.dk-follow b{font-weight:400;font-size:clamp(1.6rem,2vw,2rem);line-height:1;color:var(--red)}
.dk-follow span{font-size:1.2rem;line-height:1.1}
.dk-follow svg{position:absolute;left:-70px;top:-46px;width:70px;color:var(--ink);transform:scaleX(-1) rotate(-30deg)}
.dk-follow:hover{transform:rotate(0) scale(1.05)}
@media (max-width:1100px){.dk-follow{position:relative;left:auto;top:auto;justify-self:center;align-self:center}.dk-follow svg{display:none}}

/* ===== v67 ===== */
body.on-cover main{border-radius:0 0 0 0}
body.on-cover main::before{top:-7px}
body.on-cover header.top::after{border-radius:2px 10px 0 0}
.zend{padding-bottom:clamp(90px,9vw,150px)!important}
.z3-bk:hover .z3-cov img,.z3-bk:focus-visible .z3-cov img{transform:translateY(-14px) rotate(0)!important}
.z3-vase{left:-50px;width:50px;bottom:0}
.z3-bk:first-child .z3-cov::after{left:-62px!important}
.z3-bk:last-child .z3-cov::after{right:-58px!important}
@media (max-width:1000px){.z3-bk:first-child .z3-cov::after,.z3-bk:last-child .z3-cov::after{left:-8px!important;right:-8px!important}}
.dk-letter nav a.dk-tour{position:relative;background:none;border:0;border-bottom:1.5px solid rgba(255,68,48,.45);border-radius:0;padding:0;box-shadow:none;transform:none;color:var(--red);font-weight:700}
.dk-letter nav a.dk-tour:hover{background:none;color:#C92A1A}
.dk-tour small{position:absolute;left:50%;bottom:calc(100% + 4px);transform:translateX(-50%) rotate(-3deg);white-space:nowrap;font-family:var(--brush);font-weight:400;font-size:.8rem;line-height:1;color:#fff;background:var(--ink);border-radius:6px;padding:3px 7px 2px}
.dk-letter nav{row-gap:20px}
.dk-follow::before{display:none}
.dk-follow{left:57%!important;top:calc(96px + min(15vw,230px) * 1.95)!important;transform:rotate(-3deg)}
.ft.desk .dk{min-height:calc(190px + min(15vw,230px) * 1.95)!important}
.ft.desk .dk-note2{aspect-ratio:auto!important;min-height:170px}
.dk-follow svg{left:-62px!important;top:-58px!important;width:52px!important;transform:none!important}

/* ===== v68: Our Story ===== */
/* hero sits straight on the paper: no box, the crew stands on a big highlighter swipe */
#view-about .story-hero .sh-frame,#view-about .story-hero .sh-tape{display:none}
#view-about .story-hero .sh-panel{padding-top:clamp(24px,3vw,50px)}
#view-about .sh-stage{overflow:visible;overflow-x:clip;margin-top:clamp(20px,3vw,44px)}
#view-about .sh-stage::before{display:none}
#view-about .sh-stage::after{content:"";position:absolute;z-index:2;pointer-events:none;mix-blend-mode:multiply;left:50%;bottom:14%;width:min(1180px,94%);height:34%;transform:translateX(-50%) rotate(-1.4deg);border-radius:0;background:rgba(255,212,0,.55);
  clip-path:polygon(1% 18%,8% 6%,22% 12%,40% 2%,58% 10%,74% 3%,90% 9%,99% 4%,98% 44%,100% 82%,88% 94%,70% 88%,52% 98%,34% 90%,16% 97%,3% 88%,0% 52%)}
#view-about .sh-stage img{-webkit-mask-image:linear-gradient(#000 84%,transparent 99%);mask-image:linear-gradient(#000 84%,transparent 99%)}
/* the rolled paper: square corners, the roll fades away once it's fully open */
#ai .ring.roll{border-radius:0}
.roll-cyl{border-radius:10px;opacity:var(--ro,1);transition:opacity .2s}
.roll-cyl::before,.roll-cyl::after{width:10px;border-radius:5px;background:linear-gradient(180deg,#7D83DA,#C9CCFA 40%,#8E94E8);box-shadow:none}
.roll-cyl::before{left:-2px}.roll-cyl::after{right:-2px}
/* end of the book: same breathing room as the home page */
.pe-sec{padding-bottom:clamp(90px,9vw,150px)!important}

/* ===== v68 footer + page ends ===== */
.pg{padding-bottom:0!important}
.view.pg > section:last-of-type,#view-case > :last-child{padding-bottom:clamp(90px,9vw,150px)!important}
.pe-sec{padding-bottom:clamp(90px,9vw,150px)!important}
@media (min-width:1101px){.ft.desk .dk-letter{width:min(44%,560px)}.ft.desk .dk-phone{left:61%}.ft.desk .dk-note{left:78%}.ft.desk .dk-note2{left:83%}}
@media (min-width:1101px){.dk-follow{left:calc(61% - 196px)!important;top:clamp(190px,16vw,250px)!important;padding:9px 13px 8px!important}.dk-follow b{font-size:1.45rem!important}.dk-follow span{font-size:1.02rem!important}}
.dk-follow{transform:rotate(-5deg)!important}
.dk-follow:hover{transform:rotate(0) scale(1.05)!important}
.dk-follow svg{left:auto!important;right:-74px!important;top:auto!important;bottom:-6px!important;width:74px!important;transform:none!important}
.dk-promo{position:absolute;right:clamp(-110px,-6vw,-60px);bottom:clamp(64px,5.4vw,80px);display:block;pointer-events:none}
.dk-promo b{display:inline-block;background:var(--red);color:#fff;font-family:var(--brush);font-weight:400;font-size:clamp(1.05rem,1.3vw,1.3rem);line-height:1;padding:.45em .8em .35em;border:2.5px solid var(--ink);border-radius:10px;box-shadow:4px 4px 0 var(--ink);transform:rotate(4deg);white-space:nowrap}
.dk-promo svg{position:absolute;right:calc(100% + 2px);top:60%;width:58px;color:var(--ink)}
.dk-tour small{display:none}
@media (max-width:1100px){.dk-follow{left:auto!important;top:auto!important}.dk-follow svg,.dk-promo svg{display:none}.dk-promo{position:relative;right:auto;bottom:auto;margin-top:16px}}
@media (max-width:1100px){.ft.desk .dk>*{grid-area:auto!important}.ft.desk .dk-letter{order:0;grid-column:1/-1!important}.ft.desk .dk-phone{order:1;grid-row:auto!important}.dk-follow{order:2}.ft.desk .dk-note{order:3}.ft.desk .dk-note2{order:4}.dk-promo b{transform:rotate(-2deg)}}

/* ===== v69 ===== */
.desk-over{z-index:3}
.desk-over .dk-item{filter:drop-shadow(3px 5px 3px rgba(23,21,34,.22))}
/* footer arrows */
.dk-follow svg{right:-50px!important;bottom:12px!important;width:38px!important}
.dk-promo svg{right:calc(100% + 6px)!important;top:4px!important;width:clamp(80px,7vw,104px)!important;transform:rotate(-8deg);transform-origin:100% 0}
/* our story hero */
#view-about .sh-stage img{-webkit-mask-image:none;mask-image:none}
#view-about .sh-l h1{font-size:clamp(2.8rem,6.4cqw,6.4rem);line-height:.98;letter-spacing:-.02em}
.hw-k{display:block;font-family:var(--brush);font-weight:400;font-size:.56em;letter-spacing:0;color:var(--red);transform:rotate(-4deg);transform-origin:left bottom;margin-bottom:.15em}
.sh-sticky{position:relative;justify-self:end;align-self:start;width:min(100%,300px);padding:28px 24px 24px;margin-right:calc(-1 * clamp(22px,5vw,80px) - 14px);background:linear-gradient(170deg,#FFF3A6,#FFE66B 60%,#F8DC50);transform:rotate(3deg);box-shadow:0 2px 2px rgba(23,21,34,.1),0 18px 22px -12px rgba(23,21,34,.4)}
.sh-sticky p{font-family:var(--brush);font-weight:400;font-size:clamp(1.25rem,1.6vw,1.45rem)!important;line-height:1.25!important}
.sh-clip{position:absolute;right:26px;top:-34px;width:24px;transform:rotate(6deg);filter:drop-shadow(1px 2px 1px rgba(23,21,34,.3))}
@media (max-width:900px){.sh-sticky{margin-right:0;justify-self:start}}
/* stickers on the robots paper */
.stk{position:absolute;z-index:3;display:block;filter:drop-shadow(2px 3px 0 rgba(23,21,34,.25))}
.stk svg{display:block;width:100%;height:auto}
.stk::after{content:"";position:absolute;inset:-5px;border-radius:30%;background:#fff;z-index:-1;opacity:.9}
.stk-stop{right:clamp(20px,4vw,60px);top:clamp(20px,2.4vw,36px);width:clamp(54px,6vw,84px);transform:rotate(12deg)}
.stk-cau{left:clamp(18px,3vw,46px);bottom:clamp(30px,4vw,60px);width:clamp(54px,6vw,80px);transform:rotate(-10deg)}
.stk-stop::after{border-radius:28%}.stk-cau::after{clip-path:polygon(50% -6%,106% 104%,-6% 104%);border-radius:0}
@media (max-width:600px){.stk-cau{display:none}.stk-stop{width:46px;top:10px;right:10px}}
/* the shelf hero: a library pocket on the page */
.pk-hero{padding:clamp(30px,4vw,64px) max(var(--gut),calc(var(--ml,40px) + 20px)) clamp(10px,2vw,30px)}
.pk-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,4vw,70px);align-items:center;max-width:1180px;margin:0 auto}
.pk-k{font-family:var(--brush);font-size:clamp(1.2rem,1.5vw,1.45rem);color:var(--red);display:inline-block;transform:rotate(-3deg)}
.pk-copy h1{margin:8px 0 14px;font-size:clamp(2.6rem,5.6cqw,5.4rem);line-height:1;letter-spacing:-.02em}
.pk-hl{display:inline-block;background:var(--yellow);border:3px solid var(--ink);border-radius:12px;padding:0 .2em;box-shadow:5px 5px 0 var(--ink);transform:rotate(-2deg)}
.pk-copy p{margin:0 0 14px;max-width:30em;font-size:clamp(1.05rem,1.3vw,1.22rem);font-weight:600;line-height:1.55}
.pk-art{position:relative;height:clamp(300px,30vw,420px);max-width:520px;width:100%;justify-self:center}
.pk-cards{position:absolute;left:8%;right:8%;bottom:34%;height:62%}
.pk-cards img{position:absolute;bottom:0;left:calc(var(--i) * 15%);width:28%;aspect-ratio:464/672;object-fit:cover;border:2.5px solid var(--ink);border-radius:3px 8px 8px 3px;box-shadow:4px 4px 0 rgba(23,21,34,.85);transform-origin:50% 100%;transform:rotate(calc((var(--i) - 2.5) * 6deg)) translateY(calc(var(--i) * 3px));transition:transform .35s cubic-bezier(.3,1.6,.5,1);pointer-events:auto}
.pk-cards img:hover{transform:rotate(calc((var(--i) - 2.5) * 3deg)) translateY(-40px);z-index:5}
.pk-pocket{position:absolute;left:0;right:0;bottom:0;height:44%;z-index:4;display:grid;align-content:center;justify-items:center;text-align:center;gap:2px;background:#E6CF9D;background-image:linear-gradient(180deg,rgba(255,255,255,.35),transparent 40%),repeating-linear-gradient(90deg,rgba(120,90,40,.05) 0 2px,transparent 2px 6px);border:3px solid var(--ink);border-radius:6px 6px 16px 16px;box-shadow:0 14px 18px -10px rgba(23,21,34,.45);color:#5C4519}
.pk-pocket::before{content:"";position:absolute;left:50%;top:-3px;width:84px;height:22px;transform:translateX(-50%);background:#D9BE85;border:3px solid var(--ink);border-top:0;border-radius:0 0 46px 46px}
.pk-pocket b{font-weight:800;font-size:clamp(.9rem,1.2vw,1.1rem);letter-spacing:.2em;margin-top:10px}
.pk-pocket span{font-family:var(--brush);font-size:clamp(1rem,1.2vw,1.15rem)}
.pk-pocket i{position:absolute;right:12px;bottom:10px;font-style:normal;font-weight:800;font-size:.7rem;letter-spacing:.12em;color:var(--red);border:2px solid var(--red);border-radius:5px;padding:2px 6px;transform:rotate(-8deg)}
.pk-pocket em{position:absolute;left:14px;bottom:12px;font-style:normal;font-family:var(--brush);font-size:1rem;color:#3d43b8;transform:rotate(-3deg)}
@media (prefers-reduced-motion:no-preference){.view:not([hidden]) .pk-cards img{animation:pkUp .7s cubic-bezier(.3,1.5,.5,1) calc(.3s + var(--i) * .08s) both}@keyframes pkUp{from{translate:0 60%;opacity:0}}}
@media (max-width:820px){.pk-in{grid-template-columns:1fr}.pk-art{height:280px}}
@media (max-width:420px){.pk-pocket em,.pk-pocket i{display:none}}

/* ===== v70 ===== */
/* left page stops partway, the desk shows beyond it */
.leftpage{width:max(var(--lp),calc(var(--bl) * .62))!important}
body:not(.on-cover) header.top::after{left:calc(var(--bl) - max(var(--lp),calc(var(--bl) * .62)))}
/* story: the paperclip grips the note at the page edge */
.sh-clip{right:auto!important;left:calc(100% - 40px - 13px);top:-8px!important;width:26px!important;transform:rotate(90deg)!important;transform-origin:50% 50%;z-index:3}
.sh-sticky{padding-top:40px!important;padding-right:52px!important}
.sh-sticky{margin-right:calc(-1 * clamp(22px,5vw,80px) - 40px)!important}
@media (max-width:900px){.sh-clip{display:none}.sh-sticky{margin-right:0!important}}
/* timeline sticky notes: only some have the folded corner */
.beat:nth-child(2) .bt-card,.beat:nth-child(3) .bt-card{clip-path:none}.beat:nth-child(2) .bt-card::after,.beat:nth-child(3) .bt-card::after{display:none}
.beat:nth-child(odd) .bt-card::before{display:none}
/* ===== shelf page ===== */
.sp-head{text-align:center;display:grid;gap:8px;justify-items:center;margin:clamp(10px,2vw,30px) auto clamp(30px,4vw,54px);max-width:640px}
.sp-head h2{margin:0;font-size:clamp(2rem,3.4vw,3.2rem)}
.sp-head p{margin:0;font-weight:600;line-height:1.55}
.sc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(34px,4vw,56px) clamp(20px,3vw,44px);max-width:1160px;margin:0 auto;transition:opacity .26s,transform .26s}
.sc-grid.out-l{opacity:0;transform:translateX(-40px) rotate(-1deg)}.sc-grid.out-r{opacity:0;transform:translateX(40px) rotate(1deg)}
.sc-grid.in-r{opacity:0;transform:translateX(40px);transition:none}.sc-grid.in-l{opacity:0;transform:translateX(-40px);transition:none}
.sc{position:relative;display:grid;grid-template-columns:42% 1fr;gap:14px;align-items:start;text-align:left;padding:22px 16px 18px;background:#fff;border:2px solid var(--ink);border-radius:4px;box-shadow:0 2px 0 rgba(23,21,34,.06),0 16px 22px -14px rgba(23,21,34,.4);transform:rotate(var(--r));transition:transform .3s cubic-bezier(.3,1.5,.5,1),box-shadow .3s;cursor:pointer;font:inherit;color:var(--ink);
  background-image:linear-gradient(transparent 33px,rgba(255,68,48,.35) 33px,rgba(255,68,48,.35) 35px,transparent 35px),repeating-linear-gradient(transparent 0 23px,rgba(127,134,245,.18) 23px 24px);background-position:0 0,0 36px}
.sc:hover,.sc:focus-visible{transform:rotate(0) translateY(-6px);box-shadow:0 2px 0 rgba(23,21,34,.06),0 24px 30px -16px rgba(23,21,34,.5)}
.tack{position:absolute;left:50%;top:-16px;width:30px;transform:translateX(-50%) rotate(-8deg);z-index:2}
.sc:nth-child(even) .tack{transform:translateX(-50%) rotate(12deg)}
.sc-cov img{display:block;width:100%;aspect-ratio:475/700;object-fit:cover;border:2px solid var(--ink);border-radius:2px 6px 6px 2px;box-shadow:3px 3px 0 var(--ink)}
.sc-txt{display:grid;gap:4px;min-width:0}
.sc-no{font-family:var(--brush);font-size:1rem;color:var(--red)}
.sc-txt b{font-weight:800;font-size:clamp(1rem,1.2vw,1.12rem);line-height:1.2}
.sc-txt em{font-style:normal;font-family:var(--brush);font-size:1.15rem;line-height:1.15;color:#3d3a52}
.sc-row{font-size:.86rem;font-weight:700;color:var(--soft)}
.sc-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.sc-tags i{font-style:normal;font-size:.74rem;font-weight:700;border:1.5px solid var(--ink);border-radius:999px;padding:1px 8px;background:var(--wash)}
.sc-go{margin-top:6px;font-family:var(--brush);font-size:1.15rem;color:#3d43b8}
.sp-pager{display:flex;align-items:center;justify-content:center;gap:clamp(14px,3vw,40px);margin:clamp(40px,5vw,70px) auto clamp(30px,4vw,50px)}
.sp-prev,.sp-next{position:relative;font-family:var(--brush);font-size:clamp(1.2rem,1.6vw,1.45rem);color:var(--ink);background:none;border:0;cursor:pointer;padding:0;width:clamp(110px,11vw,150px);height:clamp(70px,7vw,92px)}
.sp-prev span,.sp-next span{position:relative;z-index:1}
.sp-prev::before,.sp-next::before{content:"";position:absolute;inset:0;background:linear-gradient(170deg,#FFF3A6,#FFE66B);box-shadow:0 10px 14px -8px rgba(23,21,34,.4);transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.sp-prev::before{clip-path:polygon(22% 0,100% 0,100% 100%,22% 100%,0 50%);transform:rotate(-3deg)}
.sp-next::before{clip-path:polygon(0 0,78% 0,100% 50%,78% 100%,0 100%);transform:rotate(3deg);background:linear-gradient(170deg,#D6F8B6,#BDF08E)}
.sp-prev span{padding-left:14px}.sp-next span{padding-right:14px}
.sp-prev:hover::before{transform:rotate(-3deg) translateX(-6px)}.sp-next:hover::before{transform:rotate(3deg) translateX(6px)}
.sp-prev:disabled,.sp-next:disabled{opacity:.35;cursor:default}
.sp-prev:disabled::before,.sp-next:disabled::before{transform:none}
.sp-mid{display:grid;justify-items:center;gap:8px}
.sp-now{font-family:var(--brush);font-size:1.2rem;color:var(--soft)}
.sp-dots{display:flex;gap:8px}
.sp-dots button{width:34px;height:34px;border-radius:50%;border:2px solid var(--ink);background:#fff;font-family:var(--brush);font-size:1.1rem;cursor:pointer;color:var(--ink);transition:transform .2s}
.sp-dots button[aria-current="page"]{background:var(--red);color:#fff;transform:rotate(-8deg) scale(1.1)}
.sp-dots button:hover{transform:translateY(-3px)}
@media (max-width:1000px){.sc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.sc-grid{grid-template-columns:1fr;max-width:420px}.sp-dots button{width:30px;height:30px}.sp-prev,.sp-next{width:96px;height:60px;font-size:1.1rem}}
/* ===== new chapter heroes: written right on the page ===== */
.nh{padding:clamp(34px,4vw,70px) max(var(--gut),calc(var(--ml,40px) + 20px)) clamp(20px,3vw,40px)}
.nh-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(20px,4vw,70px);align-items:center;max-width:1180px;margin:0 auto}
.nh-k{font-family:var(--brush);font-size:clamp(1.2rem,1.5vw,1.45rem);color:var(--red);display:inline-block;transform:rotate(-3deg)}
.nh h1{margin:8px 0 14px;font-size:clamp(2.5rem,5.2cqw,5rem);line-height:1.02;letter-spacing:-.02em;text-wrap:balance}
.nh p{margin:0 0 14px;max-width:32em;font-size:clamp(1.05rem,1.3vw,1.2rem);font-weight:600;line-height:1.55}
.nh-art{position:relative;min-height:clamp(260px,26vw,360px);display:grid;place-items:center}
@media (max-width:820px){.nh-in{grid-template-columns:1fr}.nh-art{min-height:240px}}
@media (max-width:480px){.nr-mark{display:none}.nr-stamp{right:8px;top:8px}.nh h1{font-size:clamp(2rem,9.5vw,2.6rem)}}
@media (prefers-reduced-motion:no-preference){.view:not([hidden]) .nh-art>*{animation:nhIn .7s cubic-bezier(.3,1.4,.5,1) both}.view:not([hidden]) .nh-art>*:nth-child(2){animation-delay:.12s}.view:not([hidden]) .nh-art>*:nth-child(3){animation-delay:.24s}.view:not([hidden]) .nh-art>*:nth-child(4){animation-delay:.36s}@keyframes nhIn{from{opacity:0;translate:0 30px}}}
/* plans: a torn to-do list and a price tag */
.np-list{position:relative;width:min(100%,340px);margin:0 auto;padding:26px 26px 22px 46px;background:#fff;transform:rotate(-3deg);box-shadow:0 2px 2px rgba(23,21,34,.08),0 18px 24px -12px rgba(23,21,34,.4);background-image:linear-gradient(90deg,transparent 34px,rgba(255,68,48,.4) 34px,rgba(255,68,48,.4) 36px,transparent 36px),repeating-linear-gradient(transparent 0 31px,rgba(127,134,245,.22) 31px 32px);background-position:0 0,0 50px;
  clip-path:polygon(0 4%,4% 0,9% 3%,15% 0,22% 3%,30% 0,38% 2%,46% 0,54% 3%,62% 0,70% 2%,78% 0,86% 3%,94% 0,100% 2%,100% 100%,0 100%)}
.np-list b{display:block;font-family:var(--brush);font-weight:400;font-size:1.3rem;line-height:1.2;margin-bottom:8px;padding-right:10px}
.np-list ul{list-style:none;margin:0;padding:0;font-family:var(--brush);font-size:1.3rem;line-height:32px}
.np-list li{position:relative;padding-left:30px}
.np-list li::before{content:"";position:absolute;left:0;top:7px;width:18px;height:18px;border:2.5px solid var(--ink);border-radius:3px 6px 4px 5px}
.np-list li.ok{text-decoration:line-through;text-decoration-color:var(--red);text-decoration-thickness:2.5px;color:var(--soft)}
.np-list li.ok::after{content:"";position:absolute;left:3px;top:4px;width:18px;height:10px;border-left:3.5px solid var(--red);border-bottom:3.5px solid var(--red);transform:rotate(-45deg)}
.np-list li.star{color:#3d43b8}
.np-list li.star::after{content:"★";position:absolute;right:-10px;top:-2px;color:var(--red);font-size:1.2rem}
.np-tag{position:absolute;right:0;bottom:6%;display:grid;justify-items:center;padding:16px 22px 14px 30px;background:var(--yellow);border:2.5px solid var(--ink);border-radius:8px 18px 18px 8px;box-shadow:5px 5px 0 var(--ink);transform:rotate(12deg);clip-path:polygon(18px 0,100% 0,100% 100%,18px 100%,0 50%)}
.np-hole{position:absolute;left:14px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:#fff;border:2px solid var(--ink)}
.np-tag small{font-family:var(--brush);font-size:1rem;line-height:1}.np-tag b{font-weight:800;font-size:clamp(2rem,3vw,2.6rem);line-height:1}.np-tag em{font-style:normal;font-family:var(--brush);font-size:.95rem}
/* real talk: notes passed in class */
.nt-note{position:absolute;font-family:var(--brush);font-size:clamp(1.15rem,1.5vw,1.4rem);line-height:1.2;padding:16px 18px;max-width:230px;background:#fff;box-shadow:0 2px 2px rgba(23,21,34,.08),0 14px 18px -10px rgba(23,21,34,.38);background-image:repeating-linear-gradient(transparent 0 25px,rgba(127,134,245,.22) 25px 26px)}
.nt-note u{text-decoration-color:var(--red);text-decoration-thickness:2.5px}
.nt-note.n1{left:2%;top:8%;transform:rotate(-6deg)}
.nt-note.n2{right:2%;top:22%;transform:rotate(5deg);background-color:#FFE66B;background-image:none}
.nt-note.n3{left:16%;bottom:6%;transform:rotate(3deg);background-color:#D6F8B6;background-image:none}
.nt-fold{position:absolute;right:10%;bottom:4%;width:96px;height:72px;background:#fff;border:2px solid var(--ink);transform:rotate(-14deg);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);box-shadow:0 10px 12px -6px rgba(23,21,34,.35)}
.nt-fold::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 49%,var(--ink) 49%,var(--ink) 51%,transparent 51%),linear-gradient(45deg,transparent 49%,var(--ink) 49%,var(--ink) 51%,transparent 51%);opacity:.5}
.nt-fold span{position:absolute;left:0;right:0;bottom:-30px;text-align:center;font-family:var(--brush);color:var(--red);font-size:1.1rem}
/* tour: a postcard */
.nr-card{position:relative;width:min(100%,440px);container-type:inline-size;aspect-ratio:1.5;display:grid;grid-template-columns:1.1fr 1fr;background:#FFFDF6;border:2px solid var(--ink);border-radius:4px;transform:rotate(-4deg);box-shadow:0 2px 2px rgba(23,21,34,.08),0 20px 26px -12px rgba(23,21,34,.45)}
.nr-l{display:grid;align-content:center;justify-items:start;padding:18px 20px;border-right:2px dashed rgba(23,21,34,.3);background:linear-gradient(160deg,#7A80F2,#5A60D8);color:#fff;border-radius:3px 0 0 3px}
.nr-l b{font-family:var(--brush);font-weight:400;font-size:clamp(1.2rem,1.6vw,1.5rem);transform:rotate(-4deg)}
.nr-l strong{font-weight:800;font-size:clamp(1.4rem,11cqw,3rem);line-height:1;color:var(--yellow);text-shadow:3px 3px 0 var(--ink)}
.nr-l span{font-family:var(--brush);font-size:1.05rem;margin-top:8px}
.nr-r{position:relative;padding:18px}
.nr-stamp{position:absolute;right:16px;top:16px;display:grid;justify-items:center;padding:10px 12px;background:var(--red);color:#fff;border:3px dotted #fff;outline:2px solid var(--ink);transform:rotate(6deg)}
.nr-stamp b{font-weight:800;font-size:1.7rem;line-height:1}.nr-stamp small{font-family:var(--brush);font-size:.95rem}
.nr-mark{position:absolute;right:62px;top:56px;width:84px;height:84px;border-radius:50%;border:2.5px solid rgba(23,21,34,.55);display:grid;place-items:center;text-align:center;font-weight:800;font-size:.72rem;letter-spacing:.12em;color:rgba(23,21,34,.6);transform:rotate(-14deg)}
.nr-r i{position:absolute;left:18px;right:18px;height:2px;background:rgba(23,21,34,.3)}
.nr-r i:nth-of-type(1){bottom:70px}.nr-r i:nth-of-type(2){bottom:46px}.nr-r i:nth-of-type(3){bottom:22px}
/* slide in: an envelope with a letter peeking out */
.ns-env{position:relative;width:min(100%,400px);aspect-ratio:1.45;transform:rotate(4deg);margin-top:60px}
.ns-letter{position:absolute;left:8%;right:8%;bottom:30%;height:110%;padding:20px 22px;background:#fff;border:2px solid var(--ink);box-shadow:0 6px 10px rgba(23,21,34,.15);display:grid;align-content:start;gap:14px;background-image:repeating-linear-gradient(transparent 0 27px,rgba(127,134,245,.22) 27px 28px);background-position:0 46px;transition:transform .4s cubic-bezier(.3,1.5,.5,1)}
.nh-art:hover .ns-letter{transform:translateY(-24px)}
.ns-letter b{font-family:var(--brush);font-weight:400;font-size:1.6rem}
.ns-letter span{display:block;height:3px;background:rgba(61,67,184,.55);border-radius:2px;width:86%}
.ns-letter span.s{width:52%}
.ns-letter em{font-style:normal;font-family:var(--brush);font-size:1.2rem;color:var(--red);justify-self:end;margin-top:4px}
.ns-front{position:absolute;inset:0;top:30%;background:#E9D9F7;border:2.5px solid var(--ink);border-radius:4px;box-shadow:0 18px 24px -12px rgba(23,21,34,.45);clip-path:polygon(0 0,50% 46%,100% 0,100% 100%,0 100%);background-image:linear-gradient(160deg,#F1E6FA,#D9C4F0)}
.ns-front::before{content:"";position:absolute;inset:0;background:linear-gradient(to top right,transparent 49.6%,var(--ink) 49.6%,var(--ink) 50.4%,transparent 50.4%) left/50% 100% no-repeat,linear-gradient(to top left,transparent 49.6%,var(--ink) 49.6%,var(--ink) 50.4%,transparent 50.4%) right/50% 100% no-repeat;opacity:.35}
.ns-heart{position:absolute;left:50%;top:38%;width:40px;height:40px;transform:translate(-50%,-50%) rotate(-10deg);background:var(--red);clip-path:path("M20 36C6 26 0 18 3 10 6 3 15 2 20 9 25 2 34 3 37 10 40 18 34 26 20 36Z")}

/* ===== v71 ===== */
.leftpage::before{display:none!important}
body:not(.on-cover) header.top::after{left:var(--bl)!important}
/* the clip, for real: one wire behind the note, one in front */
.sh-sticky{background:none!important;isolation:isolate}
.sh-sticky::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(170deg,#FFF3A6,#FFE66B 60%,#F8DC50)}
.clpw{position:absolute;left:calc(100% - 40px - 15px);top:-30px;width:30px;height:96px;pointer-events:none}
.clp{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.clp-b{z-index:-2;filter:drop-shadow(1px 2px 1px rgba(23,21,34,.25))}
.clp-f{z-index:2;filter:drop-shadow(1px 3px 1.5px rgba(23,21,34,.35))}
.sh-clip{display:none}
@media (max-width:900px){.clpw{display:none}}
/* paw prints walking across the book */
.paws{position:absolute;left:0;width:100%;height:90px;pointer-events:none;z-index:4}
.paw{position:absolute;width:36px;height:36px;opacity:0;transition:opacity .35s ease}
.paws.on .paw{opacity:var(--o,.55)}
.paw svg{width:100%;height:100%;display:block}
@media (max-width:700px){.paw{width:22px;height:22px}}
/* pricing page */
.plan .tack{position:absolute;left:28%;top:-18px;width:32px;transform:translateX(-50%) rotate(-8deg);z-index:3}
.plan:nth-child(2) .tack{transform:translateX(-50%) rotate(10deg)}
#plans .p-head{margin-bottom:clamp(40px,5vw,60px)}
.tour-spot{position:relative;border:3px dashed var(--ink)!important;box-shadow:none!important;border-radius:14px!important;outline:6px solid var(--red);outline-offset:-1px;background:var(--red)!important;transform:rotate(-1deg)}
.ts-cut{position:absolute;left:-16px;top:-18px;font-size:1.8rem;color:var(--ink);transform:rotate(-30deg);background:#fff;border-radius:50%;width:38px;height:38px;display:grid;place-items:center;border:2px solid var(--ink)}
.rules{position:relative;background:#FFE66B;padding:clamp(22px,3vw,34px);transform:rotate(.6deg);box-shadow:0 2px 2px rgba(23,21,34,.08),0 16px 22px -12px rgba(23,21,34,.38);gap:18px!important;max-width:1100px!important}
.rl-h{position:absolute;left:clamp(22px,3vw,34px);top:-16px;font-family:var(--brush);font-size:1.25rem;background:#fff;border:2px solid var(--ink);border-radius:999px;padding:2px 14px;transform:rotate(-3deg)}
.rules div{border-top:0!important;padding-top:6px!important;padding-left:30px;position:relative}
.rules div::before{content:"";position:absolute;left:0;top:9px;width:16px;height:9px;border-left:3.5px solid var(--red);border-bottom:3.5px solid var(--red);transform:rotate(-45deg)}
.rules b{font-family:var(--brush);font-weight:400;font-size:1.35rem!important}
.rules span:not(.rl-h){color:var(--ink)!important}
@media (max-width:900px){.rules{grid-template-columns:1fr 1fr!important}}
@media (max-width:520px){.rules{grid-template-columns:1fr!important}}
/* shelf CTA: an empty pinned card waiting for a book */
.sh-cta{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(22px,4vw,56px);align-items:center;max-width:980px;margin:clamp(30px,4vw,60px) auto 0;padding:clamp(26px,3vw,40px);background:#fff;border:2px solid var(--ink);border-radius:4px;transform:rotate(-.6deg);box-shadow:0 18px 26px -14px rgba(23,21,34,.4);
  background-image:linear-gradient(transparent 46px,rgba(255,68,48,.35) 46px,rgba(255,68,48,.35) 48px,transparent 48px),repeating-linear-gradient(transparent 0 27px,rgba(127,134,245,.18) 27px 28px)}
.sh-cta>.tack{position:absolute;left:50%;top:-20px;width:36px;transform:translateX(-50%) rotate(-6deg)}
.sh-cta-slot{width:clamp(120px,12vw,160px);aspect-ratio:475/700;border:3px dashed var(--ink);border-radius:3px 8px 8px 3px;display:grid;place-items:center;text-align:center;background:repeating-linear-gradient(45deg,rgba(255,212,0,.25) 0 10px,transparent 10px 20px);transform:rotate(-3deg)}
.sh-cta-slot span{font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.7rem);line-height:1.05}
.sh-cta-k{font-family:var(--brush);font-size:1.25rem;color:var(--red)}
.sh-cta h2{margin:4px 0 10px;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.1}
.sh-cta p{margin:0 0 16px;font-weight:600;line-height:1.55}
@media (max-width:620px){.sh-cta{grid-template-columns:1fr;justify-items:center;text-align:center}.sh-cta .p-acts{justify-content:center}}

/* ===== v72 ===== */
.paws{position:absolute;left:0;top:0;width:100%;height:0;pointer-events:none;z-index:4}
.paw{position:absolute;opacity:0;transition:opacity .4s ease;mix-blend-mode:multiply}

/* inner pages sit on the paper, no lilac bands */
.view.pg .p-wash{background:transparent!important}
/* closing bands: a torn note taped to the page */
.view.pg .p-band{position:relative;border:0!important;border-radius:0!important;box-shadow:0 2px 2px rgba(23,21,34,.08),0 18px 24px -14px rgba(23,21,34,.4)!important;background:#fff!important;transform:rotate(-.8deg);
  background-image:repeating-linear-gradient(transparent 0 29px,rgba(127,134,245,.2) 29px 30px)!important;clip-path:polygon(0 3%,3% 0,7% 3%,12% 0,18% 2%,25% 0,33% 3%,41% 0,50% 2%,58% 0,66% 3%,74% 0,82% 2%,90% 0,96% 3%,100% 0,100% 100%,0 100%)}
.view.pg .p-band::before{content:"";position:absolute;left:50%;top:6px;width:110px;height:26px;transform:translateX(-50%) rotate(-3deg);background:rgba(160,228,93,.8)}
/* pricing: fine print crisp, 3 points */
.rules{transform:none!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
.rl-h{transform:rotate(-2deg) translateZ(0);-webkit-font-smoothing:antialiased;font-size:1.3rem!important}
@media (max-width:700px){.rules{grid-template-columns:1fr!important}}
/* the sidekick deal: an admit-two ticket */
.sk-deal{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(16px,2.4vw,34px);max-width:1100px;margin:clamp(40px,5vw,64px) auto 0;padding:clamp(20px,2.6vw,30px) clamp(20px,3vw,40px);background:var(--purple);color:#fff;text-decoration:none;border:3px solid var(--ink);border-radius:18px;box-shadow:8px 8px 0 var(--ink);transform:rotate(.8deg);transition:transform .25s cubic-bezier(.3,1.5,.5,1);
  -webkit-mask:radial-gradient(circle 14px at 0 50%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 14px at 100% 50%,transparent 98%,#000) right/51% 100% no-repeat}
.sk-deal:hover{transform:rotate(0) scale(1.01)}
.sk-stub{display:grid;justify-items:center;padding-right:clamp(16px,2.4vw,30px);border-right:3px dashed rgba(255,255,255,.6)}
.sk-stub b{font-weight:800;font-size:clamp(2.6rem,4vw,3.6rem);line-height:1;color:var(--yellow);text-shadow:3px 3px 0 var(--ink)}
.sk-stub small{font-family:var(--brush);font-size:1.05rem;line-height:1;text-align:center}
.sk-main{display:grid;gap:4px}
.sk-main small{font-family:var(--brush);font-size:1.15rem}
.sk-main b{font-weight:800;font-size:clamp(1.6rem,2.8vw,2.4rem);line-height:1.05}
.sk-main span{font-weight:600;line-height:1.5}
.sk-main em{font-style:normal;background:var(--yellow);color:var(--ink);padding:0 .2em;border-radius:4px}
.sk-off{display:grid;justify-items:center;background:#fff;color:var(--ink);border:3px solid var(--ink);border-radius:50%;width:clamp(100px,10vw,124px);aspect-ratio:1;align-content:center;transform:rotate(-10deg);box-shadow:4px 4px 0 var(--ink)}
.sk-off b{font-weight:800;font-size:clamp(1.8rem,2.6vw,2.3rem);line-height:1;color:var(--red)}
.sk-off small{font-family:var(--brush);font-size:.95rem;line-height:1;text-align:center}
@media (max-width:760px){.sk-deal{grid-template-columns:1fr;text-align:center;justify-items:center}.sk-stub{border-right:0;border-bottom:3px dashed rgba(255,255,255,.6);padding:0 0 12px}}
/* shelf: polaroids pinned on a cork board */
.cork{position:relative;max-width:1220px;margin:0 auto;padding:clamp(44px,5vw,70px) clamp(18px,3vw,50px) clamp(10px,2vw,20px);border:clamp(10px,1.2vw,16px) solid #B07D4F;border-radius:10px;box-shadow:inset 0 0 0 2px rgba(23,21,34,.25),inset 0 6px 18px rgba(23,21,34,.25),0 18px 30px -16px rgba(23,21,34,.5);
  background-color:#CFA272;background-image:radial-gradient(rgba(120,80,40,.35) 1px,transparent 1.6px),radial-gradient(rgba(255,240,210,.35) 1px,transparent 1.6px),radial-gradient(rgba(90,60,30,.25) 1.4px,transparent 2px);background-size:9px 9px,13px 13px,21px 21px;background-position:0 0,4px 6px,9px 3px}
.sc{display:flex!important;flex-direction:column;gap:0!important;padding:12px 12px 16px!important;background:#FFFEFA!important;background-image:none!important;border:0!important;border-radius:2px!important;box-shadow:0 2px 3px rgba(23,21,34,.2),0 16px 22px -12px rgba(23,21,34,.5)!important;text-align:left}
.sc-photo{display:block;aspect-ratio:1;overflow:hidden;background:#222}
.sc-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 22%;transition:transform .5s ease}
.sc:hover .sc-photo img{transform:scale(1.05)}
.sc .sc-txt{display:grid;gap:2px;padding:14px 4px 0}
.sc-no{font-family:var(--brush);font-size:1rem;color:var(--red)}
.sc .sc-txt b{font-size:clamp(1.05rem,1.3vw,1.2rem)}
.sc .sc-txt em{font-style:normal;font-family:var(--brush);font-size:1.12rem;color:#3d3a52}
.sc-svc{font-size:.84rem;font-weight:700;color:var(--soft);margin-top:4px}
.sc-go{justify-self:start;margin-top:10px!important;font-family:var(--brush)!important;font-size:1.15rem!important;color:var(--ink)!important;background:var(--yellow);border:2px solid var(--ink);border-radius:999px;padding:2px 12px;box-shadow:2px 2px 0 var(--ink)}
.sc .tack{top:-14px!important}
.cork .sp-pager{margin:clamp(40px,4vw,56px) auto clamp(20px,2vw,30px)}
.cork .sp-now{color:#3A2614;font-weight:700}
@media (max-width:620px){.cork{border-width:8px;padding:40px 14px 10px}.sp-pager{gap:10px;flex-wrap:wrap}.sp-prev,.sp-next{padding:12px 16px 10px!important;font-size:1.15rem!important}.sp-mid{order:-1;width:100%}}
/* real talk: notebook upgrade */
.rv{border:0!important;border-radius:2px!important;box-shadow:0 2px 2px rgba(23,21,34,.08),0 16px 22px -12px rgba(23,21,34,.38)!important}
.rv-them{background:#fff!important;color:#7A7889!important;position:relative}
.rv-them::after{content:"";position:absolute;inset:18% 6%;background:linear-gradient(to bottom right,transparent 48%,rgba(255,68,48,.75) 48.5%,rgba(255,68,48,.75) 51%,transparent 51.5%),linear-gradient(to top right,transparent 48%,rgba(255,68,48,.75) 48.5%,rgba(255,68,48,.75) 51%,transparent 51.5%);pointer-events:none}
.rv-us{background:linear-gradient(170deg,#D6F8B6,#BDF08E)!important}
.p-filters button{border-radius:10px 10px 0 0!important;border-bottom-width:0!important;padding:.45em 1em .35em!important;font-family:var(--brush)!important;font-weight:400!important;font-size:1.1rem!important}
.p-filters button[aria-pressed="true"]{transform:translateY(-6px)}
.q{border:0!important;border-radius:3px!important;box-shadow:0 2px 2px rgba(23,21,34,.08),0 16px 22px -14px rgba(23,21,34,.4)!important;background:#fff!important;background-image:linear-gradient(90deg,var(--qc,#FFE66B) 0 8px,transparent 8px),repeating-linear-gradient(transparent 0 27px,rgba(127,134,245,.16) 27px 28px)!important}
.q:nth-child(4n+2){--qc:#FFB7C5}.q:nth-child(4n+3){--qc:#BDF08E}.q:nth-child(4n+4){--qc:#C1C5FA}
.q:nth-child(odd){transform:rotate(-.5deg)}.q:nth-child(even){transform:rotate(.6deg)}
.q[open]{background-color:#FFFDF2!important}
.q-a p{font-family:var(--brush);font-weight:400!important;font-size:clamp(1.15rem,1.4vw,1.3rem);line-height:1.35;color:#2E3AA8}
.q-say{font-family:var(--brush)!important;color:var(--red)!important;font-size:1.1rem!important}
.ask-form{border:0!important;border-radius:2px!important;box-shadow:0 2px 2px rgba(23,21,34,.08),0 20px 28px -14px rgba(23,21,34,.45)!important;background:#FFF6B8!important;background-image:linear-gradient(90deg,transparent 40px,rgba(255,68,48,.4) 40px,rgba(255,68,48,.4) 42px,transparent 42px),repeating-linear-gradient(transparent 0 31px,rgba(23,21,34,.12) 31px 32px)!important;padding-left:58px!important;transform:rotate(1deg)}
.ask-form textarea,.ask-form input{background:rgba(255,255,255,.65)!important}
/* slide in: notebook upgrade */
.bubble{background:linear-gradient(170deg,#FFF3A6,#FFE66B)!important;border-radius:2px!important;transform:rotate(-2deg);box-shadow:0 14px 18px -10px rgba(23,21,34,.4);font-family:var(--brush);font-size:1.3rem!important;line-height:1.3!important}
.bubble::before{display:none!important}
.contact-alt{background:#fff;padding:14px 18px;border:2px dashed rgba(23,21,34,.35);border-radius:6px;transform:rotate(1deg)}
.next-up{background:#fff;padding:16px 18px 16px 44px!important;box-shadow:0 12px 18px -12px rgba(23,21,34,.35);background-image:repeating-linear-gradient(transparent 0 29px,rgba(127,134,245,.2) 29px 30px)}
.office,.fund{box-shadow:0 2px 2px rgba(23,21,34,.08),0 20px 28px -14px rgba(23,21,34,.4)!important}

/* ===== v73: nothing moves while a page turns ===== */
.view{animation:none!important}
body.flipping .desk-layer{transition:none!important}
.fface *,.flip-under *{transition:none!important;animation:none!important}
.fface [data-rv],.flip-under [data-rv]{opacity:1!important;translate:none!important}
.fface>.view,.flip-under>.view{container-type:inline-size;background-color:#fff;isolation:isolate}
.fface .sh-stage,.flip-under .sh-stage{isolation:isolate}

.dk-letter .dk-logo{display:inline-block;vertical-align:middle}
.dk-tag{display:block;width:max-content;margin:12px 0 0 2px;font-family:var(--brush);font-size:clamp(1.35rem,1.8vw,1.7rem);line-height:1;color:var(--red);transform:rotate(-3deg)}
@media (max-width:420px){.dk-tag{margin:10px 0 0}}
.dk-ctag{position:absolute;right:16px;top:16px;font-style:normal;font-family:var(--brush);font-size:.95rem;color:var(--red)}

/* ===== v75 ===== */
.roll-cyl{height:74px!important;margin-top:-37px!important;border-radius:14px!important;display:grid;place-items:center}
.roll-hint{font-style:normal;font-family:var(--brush);font-size:clamp(1.05rem,1.4vw,1.3rem);color:#2A2E8A;opacity:var(--hint,1);transition:opacity .3s}
/* shelf pager: notebook page corners */
.sp-prev,.sp-next{width:auto!important;height:auto!important;padding:16px 30px 14px!important;background:#fff!important;border:2px solid var(--ink)!important;border-radius:3px!important;box-shadow:0 12px 16px -10px rgba(23,21,34,.45)!important;background-image:repeating-linear-gradient(transparent 0 23px,rgba(127,134,245,.22) 23px 24px)!important;font-size:clamp(1.3rem,1.7vw,1.55rem)!important;position:relative;overflow:visible}
.sp-prev::before,.sp-next::before{content:""!important;position:absolute!important;inset:auto!important;top:-12px!important;left:50%!important;width:70px!important;height:22px!important;transform:translateX(-50%) rotate(-4deg)!important;clip-path:none!important;background:rgba(255,212,0,.8)!important;box-shadow:none!important}
.sp-next::before{background:rgba(160,228,93,.85)!important;transform:translateX(-50%) rotate(5deg)!important}
.sp-prev::after,.sp-next::after{content:"";position:absolute;bottom:-2px;width:22px;height:22px;background:linear-gradient(135deg,#E9E6DC 50%,transparent 50%);border-top:2px solid var(--ink)}
.sp-next::after{right:-2px;border-left:2px solid var(--ink);background:linear-gradient(315deg,transparent 50%,#E9E6DC 50%)}
.sp-prev::after{left:-2px;border-right:2px solid var(--ink);background:linear-gradient(45deg,transparent 50%,#E9E6DC 50%)}
.sp-prev{transform:rotate(-3deg)}.sp-next{transform:rotate(3deg)}
.sp-prev span,.sp-next span{padding:0!important}
.sp-prev span::before,.sp-next span::after{content:"";display:inline-block;width:1.25em;height:.8em;vertical-align:-.05em;background:currentColor;-webkit-mask:var(--har) center/contain no-repeat;mask:var(--har) center/contain no-repeat}.sp-prev span::before{margin-right:.35em;transform:scaleX(-1)}.sp-next span::after{margin-left:.35em}
.sp-prev:hover{transform:rotate(-1deg) translateX(-4px)!important}.sp-next:hover{transform:rotate(1deg) translateX(4px)!important}
/* pricing: the tour, loud */
.tr-big{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(20px,3vw,44px);align-items:center;max-width:1140px;margin:clamp(30px,4vw,56px) auto 0;padding:clamp(30px,4vw,54px) clamp(24px,4vw,56px);background:var(--red);color:#fff;text-decoration:none;border:3px solid var(--ink);border-radius:20px;box-shadow:10px 10px 0 var(--ink);transform:rotate(-1deg);transition:transform .3s cubic-bezier(.3,1.5,.5,1);overflow:hidden;
  background-image:repeating-conic-gradient(from 0deg at 85% 50%,rgba(255,255,255,.1) 0 7deg,transparent 7deg 14deg)}
.tr-big:hover{transform:rotate(0) scale(1.01)}
.tr-tape{position:absolute;left:40px;top:-6px;width:130px;height:30px;background:rgba(255,212,0,.9);transform:rotate(-4deg)}
.tr-l{display:grid;justify-items:start;gap:6px}
.tr-k{font-family:var(--brush);font-size:clamp(1.15rem,1.5vw,1.4rem);background:var(--ink);padding:3px 12px;border-radius:999px;transform:rotate(-2deg)}
.tr-h{font-weight:800;font-size:clamp(2rem,3.6vw,3.3rem);line-height:1}
.tr-h span{color:var(--yellow);text-shadow:3px 3px 0 var(--ink)}
.tr-p{font-weight:700;font-size:clamp(1.05rem,1.3vw,1.2rem);margin-top:6px}
.tr-price{font-weight:800;font-size:clamp(5rem,10vw,8.6rem);line-height:.85;color:#fff;text-shadow:6px 6px 0 var(--ink);letter-spacing:-.03em}
.tr-price i{font-style:normal;font-size:.5em;vertical-align:top;margin-right:4px}
.tr-btn{margin-top:14px;background:var(--yellow);color:var(--ink);font-weight:800;font-size:clamp(1.05rem,1.3vw,1.2rem);border:3px solid var(--ink);border-radius:14px;padding:.55em 1.1em;box-shadow:4px 4px 0 var(--ink)}
.tr-r{position:relative;display:grid;justify-items:center;gap:22px;padding-top:20px}
.tr-count{display:grid;justify-items:center;background:#fff;color:var(--ink);border:3px solid var(--ink);border-radius:50%;width:clamp(130px,13vw,170px);aspect-ratio:1;align-content:center;box-shadow:5px 5px 0 var(--ink);transform:rotate(6deg)}
.tr-count b{font-weight:800;font-size:clamp(2.6rem,4vw,3.6rem);line-height:1;color:var(--red)}
.tr-count small{font-family:var(--brush);font-size:1.05rem;line-height:1.05;text-align:center}
.tr-plates{display:flex;gap:10px}
.tr-pl{display:grid;justify-items:center;width:clamp(80px,8vw,104px);padding:6px 4px;background:var(--c);color:var(--ink);border:2.5px solid var(--ink);border-radius:8px;transform:rotate(var(--r));box-shadow:3px 3px 0 var(--ink)}
.tr-pl small{font-weight:800;font-size:.62rem;letter-spacing:.14em;color:#3D43B8}
.tr-pl b{font-weight:800;font-size:clamp(.9rem,1.2vw,1.1rem);letter-spacing:.08em}
.tr-stamp{position:absolute;right:-10px;top:-30px;font-weight:800;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;text-align:center;line-height:1.2;color:var(--yellow);border:2.5px solid var(--yellow);border-radius:8px;padding:6px 10px;transform:rotate(-12deg)}
@media (max-width:760px){.tr-big{grid-template-columns:1fr}.tr-r{margin-top:10px}.tr-stamp{display:none}}
/* three promises on three sticky notes */
.pr3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,40px);max-width:1040px;margin:clamp(50px,6vw,80px) auto 0}
.pr3-n{display:grid;gap:6px;justify-items:start;padding:24px 22px 26px;box-shadow:0 2px 2px rgba(23,21,34,.08),0 18px 22px -12px rgba(23,21,34,.4)}
.pr3-n svg{width:54px;height:54px}
.pr3-n b{font-family:var(--brush);font-weight:400;font-size:clamp(1.5rem,2vw,1.8rem);line-height:1.1}
.pr3-n span{font-weight:600;line-height:1.45}
.pr3-n.n1{background:linear-gradient(170deg,#FFF3A6,#FFE66B);transform:rotate(-2deg)}
.pr3-n.n2{background:linear-gradient(170deg,#D6F8B6,#BDF08E);transform:rotate(1.5deg) translateY(10px)}
.pr3-n.n3{background:linear-gradient(170deg,#FFD3DC,#FFB7C5);transform:rotate(-1deg)}
@media (max-width:760px){.pr3{grid-template-columns:1fr;max-width:420px}}
/* the sidekick deal: two matching coupons, one for you, one for your bestie */
.sk2{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(16px,3vw,40px);align-items:center;max-width:1100px;margin:clamp(50px,6vw,80px) auto 0;padding:clamp(24px,3vw,40px);background:#fff;color:var(--ink);text-decoration:none;border:3px dashed var(--ink);border-radius:20px;background-image:radial-gradient(rgba(122,128,242,.18) 2px,transparent 2.4px);background-size:22px 22px;transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.sk2:hover{transform:scale(1.01)}
.sk2-c{display:grid;justify-items:center;width:clamp(110px,11vw,140px);padding:16px 8px;border:3px solid var(--ink);border-radius:14px;box-shadow:5px 5px 0 var(--ink)}
.sk2-c.c1{background:var(--purple);color:#fff;transform:rotate(-7deg)}
.sk2-c.c2{background:var(--lime);transform:rotate(7deg)}
.sk2-c small{font-family:var(--brush);font-size:1.15rem}
.sk2-c b{font-weight:800;font-size:clamp(2.2rem,3.4vw,3rem);line-height:1}
.sk2-c em{font-style:normal;font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:.85rem}
.sk2-mid{display:grid;justify-items:center;text-align:center;gap:6px}
.sk2-k{font-family:var(--brush);font-size:1.3rem;color:var(--red)}
.sk2-mid b{font-weight:800;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.05}
.sk2-mid>span:not(.sk2-k):not(.sk2-btn){font-weight:600;line-height:1.5;max-width:30em}
.sk2-mid u{text-decoration-color:var(--red);text-decoration-thickness:3px}
.sk2-btn{margin-top:8px;font-family:var(--brush);font-size:1.3rem;border-bottom:2.5px solid var(--red)}
.sk2-heart{position:absolute;left:50%;top:-26px;width:52px;transform:translateX(-50%) rotate(-8deg)}
@media (max-width:760px){.sk2{grid-template-columns:1fr 1fr}.sk2-mid{grid-column:1/-1;grid-row:1}.sk2-c{justify-self:center}}
/* real talk CTA: a letter with a stamp */
.fq-cta{max-width:980px;margin:clamp(20px,3vw,40px) auto 0}
.fq-letter{position:relative;padding:clamp(34px,4vw,56px) clamp(26px,4vw,60px) clamp(40px,4vw,60px) clamp(40px,5vw,80px);background:#FFFDF6;border:2px solid var(--ink);border-radius:4px;transform:rotate(-.8deg);box-shadow:0 22px 30px -16px rgba(23,21,34,.45);
  background-image:linear-gradient(90deg,transparent 28px,rgba(255,68,48,.4) 28px,rgba(255,68,48,.4) 30px,transparent 30px),repeating-linear-gradient(transparent 0 31px,rgba(127,134,245,.2) 31px 32px);background-position:0 0,0 18px}
.fq-k{font-family:var(--brush);font-size:clamp(1.6rem,2.2vw,2rem);color:var(--red)}
.fq-letter h2{margin:4px 0 12px;font-size:clamp(1.9rem,3.4vw,3rem);line-height:1.08;max-width:15em}
.fq-letter p{margin:0 0 18px;font-weight:600;line-height:1.55;max-width:34em}
.fq-stamp{position:absolute;right:clamp(18px,3vw,40px);top:clamp(-22px,-1.6vw,-16px);display:grid;justify-items:center;width:84px;padding:10px 0 8px;background:var(--lime);border:3px dashed #fff;outline:2.5px solid var(--ink);transform:rotate(8deg)}
.fq-stamp b{font-weight:800;font-size:2.2rem;line-height:1}.fq-stamp small{font-family:var(--brush);font-size:.85rem}
.fq-post{position:absolute;right:clamp(130px,13vw,180px);top:26px;width:92px;height:92px;border-radius:50%;border:2.5px solid rgba(23,21,34,.45);display:grid;place-items:center;text-align:center;font-weight:800;font-size:.66rem;letter-spacing:.14em;color:rgba(23,21,34,.5);transform:rotate(-14deg)}
.fq-sign{position:absolute;right:clamp(26px,4vw,60px);bottom:18px;font-family:var(--brush);font-size:1.5rem;color:#3D43B8;transform:rotate(-4deg)}
@media (max-width:620px){.fq-post{display:none}.fq-sign{position:static;display:block;margin-top:14px}}
/* contact hero envelope */
.nh{overflow-x:clip}
.ns2{width:min(100%,460px);height:auto;overflow:visible;filter:drop-shadow(0 20px 18px rgba(23,21,34,.28))}
.ns2-letter{transition:transform .45s cubic-bezier(.3,1.5,.5,1)}
.nh-art:hover .ns2-letter{transform:translateY(-22px)}

/* ===== v76 ===== */
.roll-hint{display:none}
.sk2-heart{display:none}
.sk2-fist{position:absolute;left:50%;top:-92px;width:min(240px,60%);transform:translateX(-50%) rotate(-3deg);filter:drop-shadow(3px 4px 0 rgba(23,21,34,.15))}
.sk2{margin-top:clamp(110px,10vw,140px)!important;padding-top:clamp(50px,5vw,70px)!important}
@media (prefers-reduced-motion:no-preference){.sk2:hover .sk2-fist{animation:bump .5s cubic-bezier(.3,1.6,.5,1)}@keyframes bump{40%{transform:translateX(-50%) scale(1.15) rotate(3deg)}}}
/* the tour: a giant embossed license plate */
.lp{display:grid;justify-items:center;gap:22px;max-width:1000px;margin:clamp(40px,5vw,70px) auto 0;text-decoration:none;color:var(--ink)}
.lp-k{font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.6rem);color:#fff;background:var(--red);padding:4px 16px;border-radius:999px;transform:rotate(-2deg);box-shadow:3px 3px 0 var(--ink)}
.lp-plate{position:relative;display:grid;justify-items:center;width:min(100%,820px);aspect-ratio:2/1;padding:4% 6%;border-radius:clamp(16px,2vw,28px);overflow:hidden;transform:rotate(-2deg);transition:transform .4s cubic-bezier(.3,1.4,.5,1);
  background:linear-gradient(180deg,#FFFDF5 0%,#F1EEE3 55%,#E4E0D2 100%);border:clamp(6px,.8vw,10px) solid #2B2E48;
  box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 7px #C9C3B0,inset 0 -18px 30px -18px rgba(23,21,34,.35),0 26px 40px -18px rgba(23,21,34,.55),10px 12px 0 rgba(23,21,34,.85)}
.lp:hover .lp-plate{transform:rotate(0) translateY(-6px)}
.lp-plate::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 60%,rgba(255,212,0,.22),transparent 70%),linear-gradient(90deg,transparent 0 47%,rgba(255,68,48,.08) 47% 53%,transparent 53%);pointer-events:none}
.lp-bolt{position:absolute;width:clamp(14px,1.6vw,20px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#9BA0B4 60%,#5E6272);box-shadow:inset 0 0 0 1.5px rgba(23,21,34,.4)}
.lp-bolt::after{content:"";position:absolute;left:20%;right:20%;top:46%;height:2px;background:#4E5262;transform:rotate(30deg)}
.lp-bolt.b1{left:6%;top:9%}.lp-bolt.b2{right:6%;top:9%}.lp-bolt.b3{left:6%;bottom:9%}.lp-bolt.b4{right:6%;bottom:9%}
.lp-top{position:relative;font-family:var(--brush);font-size:clamp(1.6rem,3.6vw,3rem);color:#3D43B8;line-height:1;margin-top:1%}
.lp-num{position:relative;font-weight:800;font-size:clamp(5rem,15vw,12rem);line-height:.95;letter-spacing:.04em;color:var(--red);
  text-shadow:0 -2px 0 rgba(255,255,255,.9),0 3px 0 #B4241A,0 6px 0 #8E1A12,0 10px 14px rgba(23,21,34,.35)}
.lp-d{font-size:.55em;vertical-align:.5em;margin-right:.05em}
.lp-bot{position:relative;font-weight:800;font-size:clamp(.75rem,1.4vw,1.15rem);letter-spacing:.24em;color:#2B2E48}
.lp-reg{position:absolute;right:13%;top:7%;display:grid;justify-items:center;width:clamp(70px,9vw,100px);padding:6px 4px;background:var(--lime);border:2.5px solid #2B2E48;border-radius:8px;transform:rotate(8deg);box-shadow:inset 0 0 0 2px rgba(255,255,255,.5)}
.lp-reg small{font-weight:800;font-size:clamp(.45rem,.6vw,.6rem);letter-spacing:.12em}
.lp-reg b{font-weight:800;font-size:clamp(1.4rem,2.4vw,2.1rem);line-height:1}
.lp-shine{position:absolute;inset:-20%;background:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.65) 50%,transparent 60%);transform:translateX(-80%);pointer-events:none}
@media (prefers-reduced-motion:no-preference){.lp:hover .lp-shine{transition:transform 1s ease;transform:translateX(80%)}}
.lp-cta{display:grid;justify-items:center;gap:8px;text-align:center}
.lp-btn{background:var(--yellow);font-weight:800;font-size:clamp(1.05rem,1.4vw,1.25rem);border:3px solid var(--ink);border-radius:14px;padding:.6em 1.2em;box-shadow:5px 5px 0 var(--ink);transition:transform .2s}
.lp:hover .lp-btn{transform:translate(-2px,-2px) rotate(-1deg)}
.lp-note{font-family:var(--brush);font-size:1.2rem;color:var(--soft)}
@media (max-width:620px){.lp-plate{aspect-ratio:1.7}.lp-reg{right:8%;top:6%}.lp-bot{letter-spacing:.1em}}
/* contact CTA: passed notes and an answer */
.ct-cta{display:grid;min-width:0;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,64px);align-items:center;max-width:1040px;margin:clamp(30px,4vw,60px) auto 0}
.ct-notes{position:relative;height:clamp(240px,24vw,300px)}
.ct-n{position:absolute;width:min(78%,260px);padding:16px 18px;font-family:var(--brush);font-size:clamp(1.2rem,1.6vw,1.45rem);line-height:1.2;box-shadow:0 2px 2px rgba(23,21,34,.08),0 16px 20px -10px rgba(23,21,34,.4)}
.ct-n.n1{left:0;top:0;background:#fff;transform:rotate(-6deg);background-image:repeating-linear-gradient(transparent 0 25px,rgba(127,134,245,.22) 25px 26px)}
.ct-n.n2{right:0;top:32%;background:linear-gradient(170deg,#FFF3A6,#FFE66B);transform:rotate(5deg)}
.ct-n.n3{left:10%;bottom:0;background:linear-gradient(170deg,#D6F8B6,#BDF08E);transform:rotate(-2deg)}
.ct-k{font-family:var(--brush);font-size:1.35rem;color:var(--red)}
.ct-txt h2{margin:4px 0 12px;font-size:clamp(1.9rem,3.2vw,2.8rem);line-height:1.1}
.ct-txt p{margin:0 0 18px;font-weight:600;line-height:1.55}
@media (max-width:760px){.ct-cta{grid-template-columns:minmax(0,1fr)}.ct-txt h2{font-size:clamp(1.45rem,7vw,1.9rem)}.ct-notes{height:250px}.ct-n{width:70%}}
.sp-prev::before,.sp-next::before{display:none!important}

/* tour: real license plates, one per state */
.plates{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))!important;gap:18px!important}
.plate{aspect-ratio:2/1!important;display:grid!important;grid-template-rows:auto 1fr auto;align-content:stretch!important;justify-items:center;padding:7% 6% 6%!important;border:0!important;border-radius:12px!important;
  background:linear-gradient(180deg,#FFFFFF 0%,#F4F3EE 60%,#E7E5DC 100%)!important;color:#1F3BA8!important;
  box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px #C9C6BA,0 2px 0 #B9B6AA,0 10px 14px -8px rgba(23,21,34,.45)!important;transition:transform .25s cubic-bezier(.3,1.5,.5,1),box-shadow .25s!important}
.plate::before{inset:5px!important;border:1.5px solid rgba(23,21,34,.12)!important;border-radius:9px!important}
.pl-s{position:absolute;width:14%;height:7%;border-radius:99px;background:#CFCBC0;box-shadow:inset 0 1px 2px rgba(23,21,34,.45)}
.pl-s.s1{left:22%;top:8%}.pl-s.s2{right:22%;top:8%}.pl-s.s3{left:22%;bottom:8%}.pl-s.s4{right:22%;bottom:8%}
.plate .pl-name{display:block;font-family:"Caveat Brush",cursive!important;font-weight:400;font-size:clamp(1.15rem,1.6vw,1.45rem)!important;line-height:1;color:#E53424!important;margin-top:2px;text-shadow:0 1px 0 rgba(255,255,255,.9),0 -1px 0 rgba(23,21,34,.15)}
.plate .pl-code{font-family:"Oswald",sans-serif!important;font-weight:600;font-size:clamp(1.9rem,2.7vw,2.4rem)!important;line-height:1;letter-spacing:.05em;color:#1F3BA8;align-self:center;text-decoration:none;
  text-shadow:0 -1px 0 rgba(255,255,255,.95),0 2px 0 #142A82,0 3px 3px rgba(23,21,34,.3)}
.plate .pl-nick{font-family:var(--f-body,Nunito),sans-serif;font-weight:800;font-size:clamp(.66rem,.8vw,.74rem);letter-spacing:.06em;color:#E53424;white-space:nowrap}
.plate .pl-mini{position:absolute;right:7%;bottom:6%;font-size:.48rem;font-weight:800;letter-spacing:.08em;color:#1F3BA8;opacity:.7}
.plate:not(.claimed):hover{transform:rotate(-3deg) translateY(-4px)!important;background:linear-gradient(180deg,#FFFFFF,#F4F3EE 60%,#E7E5DC)!important;box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px #C9C6BA,0 2px 0 #B9B6AA,0 18px 20px -10px rgba(23,21,34,.5)!important}
.plate[aria-pressed="true"]{background:linear-gradient(180deg,#FFF7C2,#FFE66B)!important;transform:rotate(-2deg) scale(1.05)!important;box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px #E0C33E,0 0 0 3px var(--ink),6px 6px 0 var(--ink)!important}
.plate.claimed{background:linear-gradient(180deg,#F1F0F4,#E4E2EA)!important;color:#A3A1B0!important;box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px #D3D1DA!important;filter:grayscale(1)}
.plate.claimed .pl-code{text-decoration:line-through!important;text-decoration-color:rgba(255,68,48,.85)!important;text-decoration-thickness:4px!important;color:#9C9AAA;text-shadow:none}
.plate.claimed .pl-name,.plate.claimed .pl-nick{color:#A3A1B0!important}
.plate.claimed::after{filter:none;font-size:.82rem!important;background:#fff}
@media (max-width:620px){.plates{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))!important;gap:12px!important}.plate .pl-nick{font-size:.55rem}.plate .pl-mini{display:none}}


.lp-plate{aspect-ratio:2/1!important;padding:5% 4% 6%!important;border:0!important;border-radius:clamp(18px,2vw,28px)!important;align-content:space-between;
  background:linear-gradient(180deg,#FFFFFF 0%,#F5F4EF 55%,#E6E4DA 100%)!important;
  box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 7px #CFCBBE,inset 0 -20px 30px -20px rgba(23,21,34,.25),0 3px 0 #B5B1A4,0 30px 40px -18px rgba(23,21,34,.55)!important}
.lp-plate::before{background:none!important}
.lp-plate .pl-s{width:11%;height:5.5%}
.lp-plate .pl-s.s1,.lp-plate .pl-s.s3{left:19%}.lp-plate .pl-s.s2,.lp-plate .pl-s.s4{right:19%}
.lp-plate .pl-s.s1,.lp-plate .pl-s.s2{top:5%}.lp-plate .pl-s.s3,.lp-plate .pl-s.s4{bottom:7%}
.lp-top{font-family:"Caveat Brush",cursive!important;font-size:clamp(2rem,5vw,4.2rem)!important;color:#E53424!important;margin-top:2%!important;text-shadow:0 2px 0 rgba(255,255,255,.9),0 -1px 0 rgba(23,21,34,.12)}
.lp-num{font-family:"Oswald",sans-serif!important;font-weight:600!important;font-size:clamp(3rem,10.5vw,8.6rem)!important;line-height:1!important;letter-spacing:.03em!important;color:#1F3BA8!important;white-space:nowrap;
  text-shadow:0 -2px 0 rgba(255,255,255,.95),0 3px 0 #142A82,0 6px 0 #0E1F66,0 10px 12px rgba(23,21,34,.3)!important}
.lp-bot{font-family:var(--f-body,Nunito),sans-serif;font-weight:800!important;font-size:clamp(1.05rem,2.6vw,2.1rem)!important;letter-spacing:.02em!important;color:#E53424!important}
.lp-c1,.lp-c2{position:absolute;bottom:7%;font-family:var(--f-body,Nunito),sans-serif;font-weight:800;font-size:clamp(.55rem,1vw,.85rem);color:#1F3BA8;line-height:1.25}
.lp-c1{left:4.5%}.lp-c2{right:4.5%;text-align:right}
.lp-c2 b{font-size:1.5em;color:#E53424}.lp-c2 small{font-size:.75em;opacity:.8}
@media (max-width:620px){.lp-c1{display:none}.lp-plate{aspect-ratio:1.8!important}}


/* budget slider: smooth fill, snapping stops, springy thumb */
#funForm input[type=range]{height:44px!important;cursor:pointer;--pct:25%}
#funForm input[type=range]::-webkit-slider-runnable-track{height:12px!important;border-radius:99px!important;background:linear-gradient(90deg,var(--lime) 0,var(--yellow) calc(var(--pct) * .6),var(--red) var(--pct),rgba(23,21,34,.1) var(--pct))!important;border:2.5px solid var(--ink);box-shadow:inset 0 2px 3px rgba(23,21,34,.2)}
#funForm input[type=range]::-moz-range-track{height:12px;border-radius:99px;background:rgba(23,21,34,.1);border:2.5px solid var(--ink)}
#funForm input[type=range]::-moz-range-progress{height:12px;border-radius:99px;background:linear-gradient(90deg,var(--lime),var(--yellow),var(--red))}
#funForm input[type=range]::-webkit-slider-thumb{width:34px!important;height:34px!important;margin-top:-13px!important;border-radius:50%!important;background:#fff url("img/icon.png") center/72% no-repeat!important;border:3px solid var(--ink)!important;box-shadow:3px 3px 0 var(--ink);transition:transform .25s cubic-bezier(.3,1.7,.5,1)}
#funForm input[type=range]:active::-webkit-slider-thumb{transform:scale(1.2) rotate(-10deg)}
#funForm input[type=range]::-moz-range-thumb{width:30px;height:30px;border-radius:50%;background:#fff url("img/icon.png") center/72% no-repeat;border:3px solid var(--ink)}
.bud-ticks{display:flex;justify-content:space-between;padding:0 15px;margin-top:-6px}
.bud-ticks i{width:3px;height:10px;background:rgba(23,21,34,.35);border-radius:2px}
#budgetOut{display:inline-block;transition:color .2s}
#budgetOut.pop{animation:budPop .45s cubic-bezier(.3,1.7,.5,1)}
@keyframes budPop{0%{transform:scale(.85) rotate(-3deg);opacity:.4}100%{transform:none;opacity:1}}

/* after sending: the good-news page */
.dn{position:relative;text-align:left;display:grid;gap:14px;padding:clamp(26px,3vw,40px) clamp(22px,3vw,40px) clamp(30px,3vw,40px);background:#FFFDF6;border:2px solid var(--ink);border-radius:4px;box-shadow:0 22px 30px -16px rgba(23,21,34,.45);transform:rotate(-.6deg);
  background-image:repeating-linear-gradient(transparent 0 33px,rgba(127,134,245,.18) 33px 34px);animation:dnIn .7s cubic-bezier(.3,1.5,.5,1)}
@keyframes dnIn{from{opacity:0;transform:translateY(40px) rotate(-4deg) scale(.95)}}
.dn-stamp{position:absolute;right:clamp(14px,3vw,34px);top:clamp(-26px,-2vw,-18px);font-family:"Oswald",sans-serif;font-weight:700;font-size:clamp(1.6rem,3vw,2.4rem);letter-spacing:.1em;color:var(--red);border:4px solid var(--red);border-radius:10px;padding:2px 14px;background:rgba(255,255,255,.92);transform:rotate(12deg);animation:stampIn .5s cubic-bezier(.3,1.8,.5,1) .5s both}
@keyframes stampIn{from{opacity:0;transform:rotate(12deg) scale(2.4)}}
.dn-k{font-family:var(--brush);font-size:clamp(1.25rem,1.6vw,1.45rem);color:var(--red)}
.dn h3{margin:0;font-family:var(--hand);font-weight:800;font-size:clamp(1.9rem,3.4vw,2.9rem);line-height:1.08;max-width:15em}
.dn-lead{margin:0;font-weight:600;line-height:1.6;max-width:36em}
.dn-lead b{background:linear-gradient(transparent 55%,rgba(255,212,0,.6) 55%);font-weight:800;word-break:break-word}
.dn-next{margin-top:10px;font-family:var(--brush);font-size:1.5rem;display:inline-block;transform:rotate(-2deg)}
.dn-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,24px)}
.dn-steps li{position:relative;display:grid;gap:6px;align-content:start;padding:30px 18px 20px;box-shadow:0 2px 2px rgba(23,21,34,.08),0 16px 20px -12px rgba(23,21,34,.4);animation:dnIn .6s cubic-bezier(.3,1.5,.5,1) both}
.dn-steps .s1{background:linear-gradient(170deg,#FFF3A6,#FFE66B);transform:rotate(-2deg);animation-delay:.25s}
.dn-steps .s2{background:linear-gradient(170deg,#D6F8B6,#BDF08E);transform:rotate(1.5deg);animation-delay:.4s}
.dn-steps .s3{background:linear-gradient(170deg,#FFD3DC,#FFB7C5);transform:rotate(-1deg);animation-delay:.55s}
.dn-n{position:absolute;left:14px;top:-18px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;font-weight:800;font-size:1.2rem;border:3px solid #fff;box-shadow:0 0 0 2px var(--ink)}
.dn-steps b{font-family:var(--brush);font-weight:400;font-size:1.55rem;line-height:1.05}
.dn-steps li>span:last-child{font-weight:600;font-size:.95rem;line-height:1.5}
.dn-sign{margin:10px 0 0;font-family:var(--brush);font-size:1.25rem;color:var(--soft);text-align:right}
.dn-sign b{font-weight:400;font-size:1.6rem;color:#3D43B8}
.dn-again{justify-self:start;background:none;border:0;padding:0;font-family:var(--brush);font-size:1.1rem;color:var(--soft);text-decoration:underline;cursor:pointer}
@media (max-width:760px){.dn-steps{grid-template-columns:1fr}.dn-steps li{transform:none!important}}

.lp-plate{container-type:inline-size}
.lp-num{font-size:12.4cqw!important}
.lp-top{font-size:7.4cqw!important}.lp-bot{font-size:3.6cqw!important}
.pl-s.s1{left:9%!important;top:9%!important}.pl-s.s2{right:9%!important;left:auto!important;top:9%!important}.pl-s.s3{left:9%!important;bottom:9%!important;top:auto!important}.pl-s.s4{right:9%!important;left:auto!important;bottom:9%!important;top:auto!important}
.plate .pl-s{width:10%;height:6%}
.plate .pl-mini{display:none}
.lp-plate .pl-s.s1,.lp-plate .pl-s.s3{left:13%!important}.lp-plate .pl-s.s2,.lp-plate .pl-s.s4{right:13%!important}
.lp-plate .pl-s.s3,.lp-plate .pl-s.s4{bottom:20%!important}
#funForm .dn,#funForm .dn p,#funForm .dn li span{font-family:var(--hand)}

/* ===== v78 ===== */
/* shelf pager: one real folded corner */
.sp-prev,.sp-next{border:0!important;box-shadow:none!important;filter:drop-shadow(0 0 0 var(--ink)) drop-shadow(0 1.5px 0 var(--ink)) drop-shadow(1.5px 0 0 var(--ink)) drop-shadow(-1.5px 0 0 var(--ink)) drop-shadow(0 -1.5px 0 var(--ink)) drop-shadow(0 10px 10px rgba(23,21,34,.3))}
.sp-next{clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%)}
.sp-prev{clip-path:polygon(0 0,100% 0,100% 100%,22px 100%,0 calc(100% - 22px))}
.sp-prev::after,.sp-next::after{width:22px!important;height:22px!important;bottom:0!important;border:0!important}
.sp-next::after{right:0!important;left:auto!important;background:linear-gradient(315deg,transparent 50%,#DCD8CC 50%,#EFECE3 80%)!important}
.sp-prev::after{left:0!important;right:auto!important;background:linear-gradient(45deg,transparent 50%,#DCD8CC 50%,#EFECE3 80%)!important}
/* shelf hero: our latest work */
.lw{display:block!important}
.lw img{position:absolute;bottom:6%;width:42%;aspect-ratio:475/700;object-fit:cover;border:2.5px solid var(--ink);border-radius:3px 9px 9px 3px;box-shadow:inset 8px 0 10px -6px rgba(0,0,0,.4),6px 8px 0 rgba(23,21,34,.85);transform-origin:50% 100%;transition:transform .35s cubic-bezier(.3,1.5,.5,1)}
.lw1{left:2%;transform:rotate(-10deg);z-index:1}
.lw2{left:29%;transform:rotate(1deg) translateY(-6%);z-index:3}
.lw3{right:2%;transform:rotate(9deg);z-index:2}
.lw img:hover{transform:rotate(0) translateY(-14%);z-index:5}
.lw-tag{position:absolute;left:50%;top:0;transform:translateX(-50%) rotate(-3deg);font-family:var(--brush);font-size:clamp(1.2rem,1.6vw,1.5rem);white-space:nowrap;background:var(--yellow);border:2.5px solid var(--ink);border-radius:999px;padding:4px 16px;box-shadow:3px 3px 0 var(--ink);z-index:6}
.lw-new{position:absolute;right:4%;top:14%;z-index:6;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--red);color:#fff;font-family:var(--brush);font-size:1.4rem;border:2.5px solid var(--ink);transform:rotate(14deg);box-shadow:3px 3px 0 var(--ink)}
.pk-art.lw{height:clamp(330px,32vw,450px)}
@media (prefers-reduced-motion:no-preference){.view:not([hidden]) .lw img{animation:lwIn .7s cubic-bezier(.3,1.5,.5,1) both}.view:not([hidden]) .lw2{animation-delay:.12s}.view:not([hidden]) .lw3{animation-delay:.24s}@keyframes lwIn{from{opacity:0;translate:0 60px}}}
@media (max-width:420px){.lw-tag{font-size:1rem}.lw-new{width:50px;height:50px;font-size:1.1rem}}

/* ===== v79 ===== */
/* paws walk: each print lands in turn, then fades, again and again */
.paws .paw{opacity:0;transform:rotate(var(--rot)) scale(1.25);transition:none!important}
.paws.on .paw{animation:pawWalk var(--cyc,6s) linear infinite;animation-delay:var(--dl)}
@keyframes pawWalk{0%{opacity:0;transform:rotate(var(--rot)) scale(1.3)}3%{opacity:var(--o);transform:rotate(var(--rot)) scale(1)}50%{opacity:var(--o);transform:rotate(var(--rot)) scale(1)}68%{opacity:0;transform:rotate(var(--rot)) scale(1)}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.paws.on .paw{animation:none;opacity:var(--o)!important;transform:rotate(var(--rot))}}
/* shelf hero labels */
.lw-tag{left:auto!important;right:58%!important;top:-4%!important;transform:rotate(-6deg)!important;display:grid!important;justify-items:start;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;font-family:var(--brush);color:var(--red);font-size:clamp(1.3rem,1.8vw,1.7rem)!important;line-height:1;white-space:nowrap}
.lw-tag b{font-weight:400;font-size:.75em;color:var(--ink)}
.lw-tag svg{position:absolute;left:68%;top:70%;width:clamp(50px,5vw,70px);color:var(--red)}
.lw-new{background:none!important;border:0!important;box-shadow:none!important;width:clamp(70px,7vw,92px)!important;height:auto!important;aspect-ratio:1;right:6%!important;top:6%!important;animation:spinSlow 14s linear infinite}
.lw-new svg{position:absolute;inset:0;width:100%;height:100%}
.lw-new b{position:relative;font-family:"Oswald",sans-serif;font-weight:700;font-size:clamp(1.05rem,1.3vw,1.3rem);letter-spacing:.06em;color:#fff}
@keyframes spinSlow{to{rotate:360deg}}
@media (max-width:820px){.lw-tag{right:auto!important;left:0!important}.lw-tag svg{display:none}}
/* Z HQ, the dream board */
.hq{position:relative;display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(24px,4vw,60px);align-items:center;max-width:1100px;margin:clamp(40px,5vw,70px) auto 0;padding:clamp(30px,4vw,56px);background:#FFFDF6;border:2px solid var(--ink);border-radius:6px;transform:rotate(-.5deg);box-shadow:0 26px 34px -18px rgba(23,21,34,.45);
  background-image:linear-gradient(rgba(127,134,245,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(127,134,245,.12) 1px,transparent 1px);background-size:26px 26px}
.hq-tape{position:absolute;top:-14px;width:130px;height:30px;background:rgba(255,212,0,.82)}
.hq-tape.t1{left:8%;transform:rotate(-5deg)}.hq-tape.t2{right:8%;transform:rotate(4deg);background:rgba(160,228,93,.85)}
.hq-art{position:relative;display:grid;place-items:center}
.hq-art .jar{width:min(100%,300px);filter:drop-shadow(8px 10px 0 rgba(23,21,34,.12));animation:jarBob 4s ease-in-out infinite}
@keyframes jarBob{50%{transform:translateY(-8px) rotate(-1.5deg)}}
.hq-tip{position:absolute;right:0;top:4%;font-family:var(--brush);font-size:1.15rem;color:var(--red);transform:rotate(10deg);text-align:center;line-height:1.1}
.hq-k{font-family:var(--brush);font-size:1.4rem;color:var(--red)}
.hq-copy h3{margin:2px 0 10px;font-size:clamp(2.2rem,4vw,3.4rem);line-height:1}
.hq-copy p{margin:0 0 14px;font-weight:600;line-height:1.6}
.hq-wall{display:grid;gap:6px;margin:6px 0 16px}
.hq-bricks{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;max-width:440px}
.hq-bricks i{height:20px;border:2px solid var(--ink);border-radius:3px;background:#fff;transform:scale(.85);opacity:.5;transition:background .3s,transform .4s cubic-bezier(.3,1.7,.5,1),opacity .3s}
.hq-bricks i:nth-child(n+11){margin-left:12px;margin-right:-12px}
.hq-bricks i.on{background:linear-gradient(170deg,#FF7A5C,#FF4430);transform:none;opacity:1}
.hq-wl{font-family:var(--brush);font-size:1rem;color:var(--soft)}
.hq-pick{display:block;margin-top:8px;font-family:var(--brush);font-size:1.3rem}
.hq-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:6px 0 18px}
.hq-t{display:grid;justify-items:center;gap:2px;padding:12px 8px;background:#fff;border:2.5px solid var(--ink);border-radius:12px;box-shadow:3px 3px 0 var(--ink);cursor:pointer;font:inherit;color:var(--ink);transition:transform .2s cubic-bezier(.3,1.6,.5,1),background .2s}
.hq-t b{font-weight:800;font-size:1.6rem;line-height:1}
.hq-t span{font-family:var(--brush);font-size:1rem;line-height:1.1;text-align:center}
.hq-t:hover{transform:translateY(-3px) rotate(-2deg)}
.hq-t.hot{background:var(--yellow);transform:rotate(-2deg) scale(1.04)}
.hq-ps{font-family:var(--brush)!important;font-weight:400!important;font-size:1.15rem;color:#3D43B8;margin-top:12px!important}
@media (max-width:820px){.hq{grid-template-columns:1fr}.hq-art .jar{width:200px}}
@media (max-width:460px){.hq-tiers{grid-template-columns:1fr}.hq-bricks i:nth-child(n+11){margin:0}}

.paws.on .paw{animation:pawOnce .45s cubic-bezier(.3,1.6,.5,1) both!important;animation-delay:var(--dl)!important}
@keyframes pawOnce{from{opacity:0;transform:rotate(var(--rot)) scale(1.35)}to{opacity:var(--o);transform:rotate(var(--rot)) scale(1)}}

.lw-tag svg{left:auto!important;right:-54px!important;top:30%!important;width:50px!important}.lw-new{display:none!important}

/* AI: one section, tale of the tape */
.f-rec{font-family:var(--brush);font-size:1.1rem;color:var(--red);margin-top:-4px}
.tape{position:relative;max-width:900px;margin:clamp(40px,5vw,64px) auto 0;padding:clamp(22px,3vw,34px);background:#fff;border:3px solid var(--ink);border-radius:20px;box-shadow:7px 7px 0 var(--ink)}
.tt-h{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-bottom:18px;text-align:center}
.tt-h span{font-weight:800;font-size:clamp(1rem,1.4vw,1.25rem)}
.tt-h span:first-child{color:#3D43B8}.tt-h span:last-child{color:#6E7390}
.tt-h b{font-family:var(--brush);font-weight:400;font-size:clamp(1.5rem,2.4vw,2.1rem);background:var(--yellow);border:2.5px solid var(--ink);border-radius:999px;padding:2px 18px;transform:rotate(-2deg)}
.tt-row{display:grid;grid-template-columns:1fr minmax(150px,auto) 1fr;align-items:center;gap:12px;padding:8px 0;border-top:2px dashed rgba(23,21,34,.15)}
.tt-row b{font-family:var(--brush);font-weight:400;font-size:clamp(1.05rem,1.4vw,1.25rem);text-align:center;line-height:1.1}
.tt-z,.tt-r{height:18px;background:rgba(23,21,34,.06);border:2px solid var(--ink);border-radius:99px;overflow:hidden;display:flex}
.tt-z{justify-content:flex-end}
.tt-z i,.tt-r i{display:block;height:100%;width:0;transition:width 1.1s cubic-bezier(.2,.8,.25,1)}
.tt-z i{background:linear-gradient(270deg,var(--purple),#A9AEF7)}.tt-r i{background:linear-gradient(90deg,#9BA0B4,#C9CCD6)}
.tape.in .tt-z i{width:var(--z)}.tape.in .tt-r i{width:var(--r)}
.tt-row:nth-child(3) i{transition-delay:.15s}.tt-row:nth-child(4) i{transition-delay:.3s}.tt-row:nth-child(5) i{transition-delay:.45s}.tt-row:nth-child(6) i{transition-delay:.6s}
.tt-note{margin:12px 0 0;text-align:right;font-family:var(--brush);font-size:1.1rem;color:var(--soft)}
.verdict{position:relative;display:grid;justify-items:center;text-align:center;gap:6px;max-width:760px;margin:clamp(36px,4vw,56px) auto 0;padding:clamp(26px,3vw,40px) clamp(20px,4vw,50px);background:var(--ink);color:#fff;border-radius:22px;transform:rotate(-.8deg);box-shadow:8px 8px 0 var(--red)}
.vd-k{font-family:var(--brush);font-size:1.3rem;color:var(--yellow)}
.vd-h{font-weight:800;font-size:clamp(1.8rem,3.4vw,2.8rem);line-height:1.05}
.verdict p{margin:6px 0 0;font-weight:600;line-height:1.55;max-width:34em;color:#E9E8F2}
.verdict small{font-family:var(--brush);font-size:1.1rem;color:var(--lime)}
.vd-belt{position:absolute;right:-18px;top:-22px;font-family:"Oswald",sans-serif;font-weight:700;letter-spacing:.14em;font-size:1rem;color:var(--ink);background:linear-gradient(170deg,#FFE66B,#F4C430);border:3px solid var(--ink);border-radius:12px;padding:6px 14px;transform:rotate(12deg);box-shadow:3px 3px 0 var(--ink)}
@media (max-width:620px){.tt-row{grid-template-columns:1fr;gap:4px}.tt-row b{order:-1}.tt-h{grid-template-columns:1fr}.tt-h span{display:none}.vd-belt{right:6px}}
/* Z HQ, calmer and cleaner */
.hq-art .hq-jar{width:min(100%,300px);display:block;animation:jarBob 4s ease-in-out infinite}
.hq-art .jar{display:none}
.hq-tape{display:none}
.hq{background-image:none!important;background:#fff!important;border:0!important;box-shadow:0 2px 2px rgba(23,21,34,.08),0 26px 34px -18px rgba(23,21,34,.4)!important;transform:none!important;padding:clamp(34px,4vw,60px)!important;gap:clamp(30px,5vw,70px)!important}
.hq-copy p{max-width:32em}
.hq-prog{display:grid;gap:8px;margin:8px 0 22px}
.hq-bricks{max-width:460px!important}
.hq-nums{display:flex;gap:18px;flex-wrap:wrap;font-weight:700;font-size:.95rem;color:var(--soft)}
.hq-nums b{color:var(--red);font-size:1.15rem}
.hq-tiers{max-width:460px;margin:0 0 20px!important}
.hq-t b{font-size:1.5rem!important}
.hq-legit{display:flex;flex-wrap:wrap;gap:6px 18px;margin:14px 0 0!important;font-size:.9rem!important;font-weight:700!important;color:#3E8E2A}
.hq-tip{top:2%!important;right:4%!important}


.spk{position:absolute;z-index:3;width:12px;height:12px;pointer-events:none;background:var(--yellow);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);filter:drop-shadow(0 0 3px rgba(255,212,0,.9));opacity:0;animation:twinkle 2.4s ease-in-out infinite}
.spk.k1{left:-10px;top:-4px;width:16px;height:16px}.spk.k2{right:-6px;top:-10px;width:13px;height:13px;animation-delay:.8s}.spk.k3{left:42%;top:-16px;width:14px;height:14px;animation-delay:1.6s;background:#FFF6B0}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.2) rotate(0)}20%{opacity:1;transform:scale(1.15) rotate(45deg)}40%{opacity:0;transform:scale(.3) rotate(90deg)}}
@media (prefers-reduced-motion:reduce){.spk{animation:none;opacity:.9}}
.stk-cau{bottom:auto!important;top:clamp(20px,2.4vw,36px)!important}

.z3-bk{position:relative}


.p-head .vs-mini{background:none!important;border:0!important;box-shadow:none!important;color:var(--red)!important;font-family:var(--brush)!important;font-weight:400!important;font-size:.95em!important;width:auto!important;height:auto!important;padding:0 .15em!important;display:inline-block;transform:rotate(-8deg) translateY(-.1em);border-radius:0!important;text-decoration:underline wavy var(--red) 3px;text-underline-offset:6px}
.vs-badge{background:none!important;border:0!important;box-shadow:none!important;width:clamp(96px,10vw,130px)!important;height:clamp(96px,10vw,130px)!important;display:grid!important;place-items:center;position:relative;color:var(--ink)!important;font-family:"Oswald",sans-serif!important;font-weight:700!important;font-size:clamp(2rem,3.4vw,2.9rem)!important;letter-spacing:.04em;animation:vsPulse 2.4s ease-in-out infinite}
.vs-badge::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--yellow);clip-path:polygon(50% 0,61% 22%,85% 10%,80% 36%,100% 46%,80% 58%,90% 84%,64% 76%,50% 100%,38% 76%,12% 88%,20% 60%,0 48%,20% 36%,12% 10%,38% 24%);filter:drop-shadow(4px 4px 0 var(--ink))}
.vs-badge::after{content:"";position:absolute;inset:12%;z-index:-1;background:var(--red);clip-path:polygon(50% 0,61% 22%,85% 10%,80% 36%,100% 46%,80% 58%,90% 84%,64% 76%,50% 100%,38% 76%,12% 88%,20% 60%,0 48%,20% 36%,12% 10%,38% 24%);opacity:.0}
@keyframes vsPulse{50%{transform:scale(1.08) rotate(-4deg)}}


.lw-tag{right:-2%!important;left:auto!important;top:-10%!important;justify-items:end!important;text-align:right}
.lw-tag svg{right:auto!important;left:-58px!important;top:40%!important;width:52px!important;transform:scaleX(-1)}


.hq-chip{display:block;font-weight:800;font-size:clamp(1.3rem,1.8vw,1.6rem);margin:4px 0 8px}
.hq-t span{font-size:1.02rem!important;line-height:1.15}
.hq-t.hot{background:var(--yellow)!important}
.hq-go{margin:0 0 10px}
.hq-go.go-pop{animation:goPop .45s cubic-bezier(.3,1.7,.5,1)}
@keyframes goPop{from{opacity:0;transform:translateY(10px) scale(.9)}}
.hq-alt{display:inline-block;margin-top:4px;font-size:.95rem}


/* Z HQ lives on a blueprint */
.view.pg .p-sec.bp{position:relative;margin:clamp(20px,3vw,40px) clamp(10px,2.4vw,40px);padding:clamp(50px,6vw,90px) 0 clamp(50px,6vw,80px)!important;border-radius:6px;color:#fff;transform:rotate(-.4deg);
  background-color:#2A4FA8!important;background-image:linear-gradient(rgba(255,255,255,.16) 1.5px,transparent 1.5px),linear-gradient(90deg,rgba(255,255,255,.16) 1.5px,transparent 1.5px),linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px),radial-gradient(120% 80% at 30% 10%,rgba(255,255,255,.12),transparent 60%)!important;background-size:120px 120px,120px 120px,24px 24px,24px 24px,100% 100%!important;
  box-shadow:inset 0 0 0 10px rgba(255,255,255,.06),inset 0 0 60px rgba(0,0,0,.25),0 26px 40px -20px rgba(23,21,34,.55)}
.p-sec.bp::before,.p-sec.bp::after{content:"";position:absolute;top:-14px;width:140px;height:32px;background:rgba(255,212,0,.85);z-index:2}
.p-sec.bp::before{left:6%;transform:rotate(-5deg)}.p-sec.bp::after{right:6%;transform:rotate(4deg);background:rgba(160,228,93,.85)}
.p-sec.bp .p-head h2,.p-sec.bp .p-head p{color:#fff}
.p-sec.bp .p-head .hl{color:#FFE66B!important;background:none!important;box-shadow:none!important;padding:0 .1em!important;font-family:var(--brush);font-weight:400;font-size:1.12em;display:inline-block;transform:rotate(-4deg);text-decoration:underline wavy #FFE66B 3px;text-underline-offset:8px}.p-sec.bp .p-head .hl::before,.p-sec.bp .p-head .hl::after{display:none!important}
.bp-site{position:relative;max-width:1000px;margin:0 auto}
.bp-build{position:relative;margin:0 auto;max-width:700px}
.bp-build img{display:block;width:100%;height:auto;filter:invert(1) brightness(2);opacity:.92}
.bp-sign{position:absolute;left:55%;top:25%;transform-origin:50% 0;translate:-50% 0;display:grid;justify-items:center;padding:8px 14px 6px;background:var(--yellow);color:var(--ink);border:2.5px solid var(--ink);border-radius:8px;box-shadow:3px 3px 0 rgba(0,0,0,.35);animation:signSwing 3.2s ease-in-out infinite}
.bp-sign::before{content:"";position:absolute;bottom:100%;left:50%;width:2px;height:16px;background:#fff}
.bp-sign b{font-family:"Oswald",sans-serif;font-weight:700;font-size:clamp(1rem,1.6vw,1.4rem);letter-spacing:.06em;line-height:1}
.bp-sign small{font-family:var(--brush);font-size:clamp(.85rem,1.1vw,1rem)}
@keyframes signSwing{0%,100%{rotate:6deg}50%{rotate:-6deg}}
.bp-note{position:absolute;font-family:var(--brush);font-size:clamp(1rem,1.4vw,1.25rem);line-height:1.1;color:#FFE66B;transform:rotate(-6deg)}
.bp-note::after{content:"";position:absolute;width:34px;height:2px;background:#FFE66B;opacity:.8}
.bp-note.n1{left:-10%;top:30%}.bp-note.n1::after{left:100%;top:60%;transform:rotate(12deg)}
.bp-note.n2{right:-13%;top:40%;transform:rotate(5deg)}.bp-note.n2::after{right:100%;top:60%;transform:rotate(-12deg)}
.bp-note.n3{left:-4%;bottom:14%;transform:rotate(-3deg)}.bp-note.n3::after{display:none}
.bp-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:900px;margin:clamp(20px,3vw,34px) auto 0}
.bp-facts div{padding:12px 14px;border:2px dashed rgba(255,255,255,.55);border-radius:6px;display:grid;gap:2px}
.bp-facts small{font-weight:800;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.bp-facts b{font-family:var(--brush);font-weight:400;font-size:1.35rem;color:#fff}
.bp-stamp{position:absolute;right:-2%;top:14px;font-weight:800;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;text-align:center;color:#FF8A78;border:2.5px solid #FF8A78;border-radius:8px;padding:6px 10px;transform:rotate(10deg)}
.p-sec.bp .hq{color:var(--ink);margin-top:clamp(40px,5vw,60px)!important;transform:rotate(.6deg)!important}
.p-sec.bp .hq::before{content:"";position:absolute;left:50%;top:-14px;width:120px;height:30px;transform:translateX(-50%) rotate(-3deg);background:rgba(255,255,255,.75)}
.p-sec.bp .office-facts{display:none}
@media (max-width:760px){.bp-facts{grid-template-columns:1fr 1fr}.bp-note{display:none}.bp-stamp{position:static;display:inline-block;margin:10px 0 0}}
@media (prefers-reduced-motion:reduce){.bp-sign{animation:none}}


.fb{position:relative;display:grid;justify-items:center;text-align:center;gap:6px;max-width:1080px;margin:clamp(60px,7vw,90px) auto 0;padding:clamp(30px,4vw,50px) clamp(16px,3vw,40px);text-decoration:none;color:var(--ink);background:#FFFDF6;border:2px solid var(--ink);border-radius:4px;transform:rotate(.5deg);box-shadow:0 24px 32px -16px rgba(23,21,34,.45);
  background-image:repeating-linear-gradient(transparent 0 31px,rgba(127,134,245,.18) 31px 32px)}
.fb::before{content:"";position:absolute;left:50%;top:-14px;width:130px;height:30px;transform:translateX(-50%) rotate(-3deg);background:rgba(255,212,0,.82)}
.fb-k{font-family:var(--brush);font-size:clamp(1.3rem,1.8vw,1.6rem);color:var(--red)}
.fb-h{font-weight:800;font-size:clamp(2.2rem,4.4vw,3.8rem);line-height:1}
.fb-art{position:relative;display:block;width:100%;margin:clamp(14px,2vw,24px) 0}
.fb-art img{display:block;width:100%;height:auto;transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.fb:hover .fb-art img{transform:scale(1.03)}
.fb-c{position:absolute;top:-6%;display:grid;justify-items:center;width:clamp(96px,12vw,140px);padding:12px 6px;border:3px solid var(--ink);border-radius:14px;box-shadow:4px 4px 0 var(--ink)}
.fb-c.c1{left:14%;background:var(--purple);color:#fff;transform:rotate(-8deg)}
.fb-c.c2{right:14%;background:var(--lime);transform:rotate(8deg)}
.fb-c small{font-family:var(--brush);font-size:clamp(.9rem,1.1vw,1.05rem);line-height:1}
.fb-c b{font-weight:800;font-size:clamp(1.9rem,3.2vw,2.8rem);line-height:1}
.fb-c em{font-style:normal;font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:.8rem}
.fb-pow{position:absolute;left:50%;top:44%;width:0;height:0}
.fb-pow i{position:absolute;left:0;top:0;width:clamp(22px,3vw,36px);height:5px;border-radius:3px;background:var(--red);transform-origin:0 50%;transform:rotate(var(--a)) translateX(clamp(60px,7vw,90px)) scaleX(var(--s,1));animation:pow 1.6s ease-in-out infinite}
.fb-pow i:nth-child(1){--a:-60deg}.fb-pow i:nth-child(2){--a:-90deg;background:var(--yellow)}.fb-pow i:nth-child(3){--a:-120deg}.fb-pow i:nth-child(4){--a:60deg;background:var(--yellow)}.fb-pow i:nth-child(5){--a:90deg}.fb-pow i:nth-child(6){--a:120deg;background:var(--yellow)}
@keyframes pow{0%,100%{--s:.6;opacity:.5}50%{--s:1.2;opacity:1}}
@property --s{syntax:"<number>";inherits:false;initial-value:1}
.fb-p{font-weight:600;line-height:1.55;max-width:34em}
.fb-p u{text-decoration-color:var(--red);text-decoration-thickness:3px}
.fb-btn{margin-top:10px}
.sk2{display:none!important}
@media (max-width:620px){.fb-on.f1{left:4%}.fb-on.f2{right:3%}}
.cl-f input[type=tel]{width:100%}
:root{--har:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 22'%3E%3Cpath d='M3 12.5c7-1.2 15-1.6 25-1.2M20 3.5c3 2.6 6 5 9.5 7.6-3.6 2.4-6.6 5-9 8' fill='none' stroke='%23000' stroke-width='4.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.har{display:inline-block;width:1.3em;height:.82em;margin-left:.4em;vertical-align:-.06em;background:currentColor;-webkit-mask:var(--har) center/contain no-repeat;mask:var(--har) center/contain no-repeat;transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
a:hover .har,button:hover .har{transform:translateX(4px)}
/* home shelf: hello my name is stickers */
.z3-hi{position:relative;display:grid;justify-items:center;width:min(100%,170px);margin-top:16px;background:var(--red);border:2.5px solid var(--ink);border-radius:12px;box-shadow:3px 4px 0 rgba(23,21,34,.85);color:#fff;overflow:hidden;transform:rotate(-3deg);transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.z3-bk:nth-child(even) .z3-hi{transform:rotate(2.5deg);background:var(--purple)}
.z3-bk:nth-child(3n) .z3-hi{background:#2E9E5B}
.z3-hi small{font-family:"Oswald",sans-serif;font-weight:700;font-size:clamp(1rem,1.25vw,1.2rem);letter-spacing:.14em;line-height:1;padding-top:7px}
.z3-my{font-weight:700;font-size:.66rem;letter-spacing:.06em;text-transform:lowercase;padding-bottom:5px;opacity:.95}
.z3-hi b{display:grid;place-items:center;align-self:stretch;width:calc(100% - 10px);min-height:2.6em;margin:0 5px 6px;padding:.2em .4em;background:#fff;border-radius:4px;color:var(--ink);font-family:var(--brush);font-weight:400;font-size:clamp(1.05rem,1.3vw,1.3rem);line-height:1.05;text-wrap:balance}
.z3-bk:hover .z3-hi{transform:rotate(0) scale(1.05)}
/* tour finale: road signs */
.hwy{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,60px);align-items:center;margin-top:clamp(50px,6vw,80px);padding:clamp(28px,4vw,50px);background:#FFFDF6;border:2px solid var(--ink);transform:rotate(-.5deg);box-shadow:0 22px 30px -16px rgba(23,21,34,.45);background-image:repeating-linear-gradient(transparent 0 31px,rgba(127,134,245,.16) 31px 32px)}
.hwy::before{content:"";position:absolute;left:50%;top:-14px;width:130px;height:30px;transform:translateX(-50%) rotate(-3deg);background:rgba(255,68,48,.75)}
.hwy-k{font-family:var(--brush);font-size:clamp(1.25rem,1.7vw,1.5rem);color:var(--red)}
.hwy h2{font-weight:800;font-size:clamp(2rem,3.6vw,3.1rem);line-height:1.05;margin:4px 0 12px}
.hwy p{font-weight:600;line-height:1.6;margin:0 0 16px}
.hwy-left{display:inline-flex;align-items:baseline;gap:.4em;font-family:var(--brush);font-size:1.25rem;padding:.25em .8em;border:2.5px dashed var(--ink);border-radius:999px;transform:rotate(-2deg)}
.hwy-left b{font-family:"Oswald",sans-serif;font-size:1.6rem;color:var(--red)}
.hwy-post{position:relative;display:grid;gap:18px;padding:0 0 70px;justify-items:center}
.hwy-pole{position:absolute;left:50%;top:10px;bottom:0;width:16px;margin-left:-8px;background:linear-gradient(90deg,#9AA0AE,#E4E7EE 45%,#8A90A0);border:2px solid var(--ink);z-index:0}
.hwy-cone{position:absolute;right:8%;bottom:0;width:46px;height:58px;background:linear-gradient(transparent 30%,#fff 30% 44%,transparent 44% 62%,#fff 62% 74%,transparent 74%),#FF7A1A;clip-path:polygon(38% 0,62% 0,100% 88%,100% 100%,0 100%,0 88%);filter:drop-shadow(2px 2px 0 var(--ink))}
.hwy-sign{position:relative;z-index:1;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px;width:min(100%,420px);padding:16px 20px 14px;background:#0E6B3A;color:#fff;text-decoration:none;border-radius:14px;border:3px solid var(--ink);box-shadow:inset 0 0 0 3px #0E6B3A,inset 0 0 0 5px #fff,6px 6px 0 var(--ink);transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.hwy-sign.s1{transform:rotate(-2.5deg)}
.hwy-sign.s2{grid-template-columns:1fr;background:#2A4FA8;box-shadow:inset 0 0 0 3px #2A4FA8,inset 0 0 0 5px #fff,6px 6px 0 var(--ink);transform:rotate(2deg) translateX(18px)}
.hwy-sign:hover{transform:rotate(0) translateY(-4px)}
.hwy-shield{display:grid;justify-items:center;width:62px;padding:6px 0 10px;background:#fff;color:var(--ink);border:3px solid var(--ink);clip-path:polygon(0 0,100% 0,100% 62%,50% 100%,0 62%);border-radius:8px 8px 0 0}
.hwy-shield small{font-weight:800;font-size:.55rem;letter-spacing:.14em;color:var(--red)}
.hwy-shield b{font-family:"Oswald",sans-serif;font-size:1.8rem;line-height:1}
.hwy-t{display:grid;gap:2px}
.hwy-t small{font-family:var(--brush);font-size:1.1rem;color:#FFE66B}
.hwy-t b{font-family:"Oswald",sans-serif;font-weight:700;font-size:clamp(1.5rem,2.3vw,2rem);letter-spacing:.03em;line-height:1.05}
.hwy-exit{position:absolute;right:16px;top:-16px;display:inline-flex;align-items:center;background:var(--yellow);color:var(--ink);font-family:"Oswald",sans-serif;font-weight:700;font-size:.85rem;letter-spacing:.08em;padding:3px 10px;border:2.5px solid var(--ink);border-radius:6px}
.hwy-exit .har{width:1.1em}
@media (max-width:820px){.hwy{grid-template-columns:1fr}.hwy-sign.s2{transform:rotate(2deg)}}
.f-robos .robo{width:clamp(64px,7vw,92px);height:auto;aspect-ratio:1;border-radius:50%;border:3px solid var(--ink);background:#EEF0F4;margin-left:-16px;box-shadow:3px 3px 0 var(--ink);overflow:hidden}.f-robos .robo:first-child{margin-left:0}.f-robos .robo:nth-child(2){transform:rotate(-4deg)}.f-robos .robo:nth-child(3){transform:rotate(5deg)}
.gift{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:clamp(10px,2vw,20px) 0!important}.gift::before,.gift::after{display:none!important}.gf-art{min-height:clamp(300px,30vw,420px)}.gf-art img{width:clamp(120px,12vw,175px)}.gf-kick{transform:rotate(-2deg)}
.fb-art{position:relative}.fb-art img{display:block;width:100%;height:auto}.fb-art .fb-fill{position:absolute;inset:0}.fb-art .fb-ink{position:relative}
.fb:hover .fb-art img{transform:none}.fb-art{transition:transform .4s cubic-bezier(.3,1.6,.5,1)}.fb:hover .fb-art{transform:scale(1.02)}
.fb-on{position:absolute;display:grid;justify-items:center;line-height:1;pointer-events:none}
.fb-art{container-type:inline-size}
.fb-on b{font-family:var(--brush);font-weight:400;font-size:5.6cqw;letter-spacing:.01em}
.fb-on small{font-family:var(--brush);font-size:2.4cqw;margin-top:.15em}
@container (max-width:480px){.fb-on small{display:none}.fb-on b{font-size:6.4cqw}}
.fb-on.f1{left:9%;top:36%;color:#fff;transform:rotate(-3deg)}
.fb-on.f2{right:6%;top:24%;color:var(--ink);transform:rotate(-5deg)}
.fb-c{display:none!important}
.bp-note.n1{left:-12%!important;top:22%!important}.bp-note.n1::after{left:100%;top:55%;width:96px;transform-origin:0 50%;transform:rotate(16deg)}
.bp-note.n2{right:-15%!important;top:38%!important}.bp-note.n2::after{right:100%;top:30%;width:40px;transform:rotate(-20deg)}
.bp-note.n3{left:-10%!important;bottom:2%!important}.bp-note.n3::after{display:block!important;left:100%;top:40%;width:150px;transform-origin:0 50%;transform:rotate(-12deg)}
.bp-facts{margin-top:clamp(40px,5vw,64px)!important}.bp-note.n4{left:57%;bottom:-9%;transform:rotate(-3deg)}.bp-note.n4::after{right:100%;top:10%;width:36px;transform-origin:100% 50%;transform:rotate(40deg)}
@media (min-width:981px){.t-board{grid-template-columns:minmax(0,1fr) minmax(300px,420px)!important}.claim{max-height:calc(100vh - 110px);overflow-y:auto;scrollbar-width:thin}}
.cl-form{gap:9px!important}.cl-form h3{font-size:clamp(1.35rem,1.7vw,1.7rem)!important}
.cl-plans{gap:6px!important}.cl-plans label span{padding:.4em .8em!important}
.cl-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.cl-f input{padding:.45em .7em!important}.cl-f{font-size:.9rem!important;gap:3px!important}
@media (max-width:420px){.cl-row{grid-template-columns:1fr}}
input[type=checkbox]:not(.chip input){-webkit-appearance:none;appearance:none;flex:none;width:24px!important;height:24px!important;margin:0 4px 0 0;border:2.5px solid var(--ink);border-radius:6px 5px 7px 5px;background:#fff;box-shadow:2px 2px 0 var(--ink);display:inline-grid;place-items:center;cursor:pointer;vertical-align:-6px;transform:rotate(-3deg);transition:background .15s,transform .2s cubic-bezier(.3,1.6,.5,1)}
input[type=checkbox]:not(.chip input)::after{content:"";width:22px;height:20px;background:var(--ink);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M4 11.5c2 1.6 3.8 3.6 5.2 6C12 11 16 5.6 22 1.5' fill='none' stroke='%23000' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M4 11.5c2 1.6 3.8 3.6 5.2 6C12 11 16 5.6 22 1.5' fill='none' stroke='%23000' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;transform:translate(2px,-3px) scale(0);transition:transform .25s cubic-bezier(.3,1.8,.5,1)}
input[type=checkbox]:not(.chip input):checked{background:var(--yellow);transform:rotate(2deg)}
input[type=checkbox]:not(.chip input):checked::after{transform:translate(2px,-3px) scale(1)}
input[type=checkbox]:not(.chip input):focus-visible{outline:3px solid var(--purple);outline-offset:2px}
.cl-ok input,.pinky input{margin-top:0!important}
#view-tour > section.p-sec:last-of-type{padding-bottom:clamp(30px,3.5vw,50px)!important}
.plate[hidden]{display:none!important}
.gf-ribbon,.gf-bow{display:none}
.gf-wrap{position:absolute;width:clamp(130px,13vw,190px);transform:translateY(6%) rotate(2deg);z-index:2;filter:drop-shadow(5px 5px 0 var(--ink))}
.gf-art .gf-wrap img{position:relative;display:block;width:100%;border:3px solid var(--ink);border-radius:3px 9px 9px 3px;box-shadow:none}
.gf-rv,.gf-rh{position:absolute;display:block}
.gf-rv{top:0;bottom:0;left:56%;width:15%;background:linear-gradient(90deg,#B81F12,#FF4430 28%,#FF8A78 50%,#FF4430 72%,#B81F12);border-inline:2.5px solid var(--ink)}
.gf-rh{left:0;right:0;top:40%;height:11%;background:linear-gradient(#B81F12,#FF4430 28%,#FF8A78 50%,#FF4430 72%,#B81F12);border-block:2.5px solid var(--ink)}
.gf-bow2{position:absolute;left:63.5%;top:45.5%;width:118%;translate:-50% -50%;rotate:-4deg;overflow:visible;transform-origin:50% 45%;animation:bowWig 4s ease-in-out infinite}
@keyframes bowWig{0%,86%,100%{transform:none}90%{transform:rotate(-5deg) scale(1.04)}95%{transform:rotate(4deg)}}
.gf-tag{position:absolute;left:78%;top:66%;display:grid;justify-items:center;gap:1px;padding:10px 12px 8px 22px;background:#E9CFA4;color:var(--ink);border:2.5px solid var(--ink);clip-path:polygon(14px 0,100% 0,100% 100%,14px 100%,0 50%);rotate:14deg;transform-origin:0 50%;animation:tagSw 3.6s ease-in-out infinite}
.gf-tag::before{content:"";position:absolute;left:10px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:#FFFDF6;border:2px solid var(--ink)}
.gf-tag em{font-family:var(--brush);font-style:normal;font-size:clamp(1.2rem,1.5vw,1.45rem);line-height:1;color:var(--red)}
.gf-tag small{font-family:var(--hand,var(--brush));font-size:.78rem;font-weight:700;white-space:nowrap}
@keyframes tagSw{50%{rotate:6deg}}
@media (prefers-reduced-motion:reduce){.gf-bow2,.gf-tag{animation:none}}
.fb-on.f1{left:13%!important;top:31%!important;transform:rotate(-2deg)!important;text-shadow:2px 2px 0 rgba(23,21,34,.55)}.fb-on.f2{right:5%!important;top:22%!important}
.hwy{display:none}
.trip{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,60px);align-items:center;margin-top:clamp(50px,6vw,80px);padding-bottom:clamp(70px,8vw,100px)}
.trip-k{font-family:var(--brush);font-size:clamp(1.25rem,1.7vw,1.5rem);color:var(--red)}
.trip h2{font-weight:800;font-size:clamp(2rem,3.6vw,3.2rem);line-height:1.05;margin:4px 0 12px}
.trip p{font-weight:600;line-height:1.6;margin:0;max-width:34em}
.tkt{position:relative;display:grid;grid-template-columns:1fr auto;text-decoration:none;color:var(--ink);transform:rotate(-3deg);filter:drop-shadow(6px 6px 0 var(--ink));transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.tkt:hover{transform:rotate(0) translateY(-4px)}
.tkt-main,.tkt-stub{position:relative;background:var(--yellow);border:3px solid var(--ink);-webkit-mask:radial-gradient(circle 13px at 100% 0,#0000 98%,#000) top right/100% 51% no-repeat,radial-gradient(circle 13px at 100% 100%,#0000 98%,#000) bottom right/100% 51% no-repeat}
.tkt-main{display:grid;gap:6px;padding:20px 26px 18px;border-right:0;border-radius:12px 0 0 12px;background-image:repeating-linear-gradient(-45deg,transparent 0 14px,rgba(255,255,255,.22) 14px 16px)}
.tkt-stub{display:grid;place-content:center;justify-items:center;padding:16px 18px;border-left:3px dashed var(--ink);border-radius:0 12px 12px 0;background:#FFFDF6;-webkit-mask:radial-gradient(circle 13px at 0 0,#0000 98%,#000) top left/100% 51% no-repeat,radial-gradient(circle 13px at 0 100%,#0000 98%,#000) bottom left/100% 51% no-repeat}
.tkt-main small,.tkt-stub small{font-weight:800;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase}
.tkt-main b{font-family:"Oswald",sans-serif;font-weight:700;font-size:clamp(1.6rem,2.6vw,2.3rem);letter-spacing:.02em;line-height:1}
.tkt-row{display:flex;align-items:center;gap:12px}
.tkt-row em{font-style:normal;font-family:"Oswald",sans-serif;font-weight:700;font-size:clamp(2.6rem,4.4vw,3.8rem);line-height:.9;color:var(--red)}
.tkt-row span{font-family:var(--brush);font-size:1.05rem;line-height:1.1}
.tkt-go{justify-self:start;display:inline-flex;align-items:center;margin-top:6px;padding:.45em 1em;background:var(--ink);color:#fff;border-radius:999px;font-weight:800}
.tkt-stub b{font-family:"Oswald",sans-serif;font-size:clamp(2.2rem,3.6vw,3rem);line-height:1;color:var(--red)}
.trip-road{position:absolute;left:0;right:0;bottom:6px;width:100%;height:90px}
.trip-car{position:absolute;bottom:34px;left:0;width:clamp(70px,8vw,100px);animation:drive 14s linear infinite}
@keyframes drive{from{left:-12%;transform:translateY(0) rotate(-2deg)}25%{transform:translateY(-14px) rotate(3deg)}50%{transform:translateY(6px) rotate(-2deg)}75%{transform:translateY(-10px) rotate(2deg)}to{left:100%;transform:translateY(0)}}
.trip{overflow-x:clip}
@media (max-width:820px){.trip{grid-template-columns:1fr}.tkt{justify-self:center;max-width:420px;width:100%}}
@media (max-width:380px){.tkt-main{padding:16px 16px 14px}.tkt-stub{padding:12px 10px}}
@media (prefers-reduced-motion:reduce){.trip-car{animation:none;left:70%}}
.pdood{position:relative;height:clamp(120px,14vw,190px);margin:clamp(10px,2vw,30px) auto -40px;max-width:1100px;pointer-events:none}
.pdood svg{position:absolute;fill:none;stroke:#8C8A99;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.55}
.pdood .d1{left:4%;top:18%;width:30px;rotate:-12deg}
.pdood .d2{left:16%;top:62%;width:56px}
.pdood .d3{left:30%;top:14%;width:26px;rotate:10deg}
.pdood .d4{left:42%;top:56%;width:30px}
.pdood .d5{left:53%;top:6%;width:34px;rotate:-8deg}
.pdood .d6{left:64%;top:58%;width:42px;rotate:6deg}
.pdood .d7{left:76%;top:16%;width:22px}
.pdood .d8{left:85%;top:52%;width:38px;rotate:-6deg}
.pdood .d9{left:92%;top:10%;width:56px;rotate:20deg}
@media (max-width:620px){.pdood{height:110px}.pdood .d2,.pdood .d6,.pdood .d9{display:none}}
.tkt{grid-template-columns:minmax(0,1fr) max-content}.tkt-stub{width:max-content}.tkt-go{white-space:nowrap}
@media (max-width:520px){.tkt-main{padding:16px 14px 14px}.tkt-stub{padding:10px 8px}.tkt-stub small{font-size:.55rem;letter-spacing:.1em}.tkt-main b{font-size:1.45rem}.tkt-row em{font-size:2.3rem}.tkt-row span{font-size:.92rem}.tkt-go{font-size:.9rem}}
.fb-on.f1{color:var(--ink)!important;text-shadow:none!important;top:24%!important;left:12%!important}
.pdood svg{opacity:.7;stroke:#7E7C8C}
@media (max-width:600px){.gf-tag{left:52%;top:80%}.gf-art{overflow-x:clip}}
.contact-alt a{color:inherit;text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:3px}a.ft-sel{display:block;color:inherit;text-decoration:none;font-weight:800}a.ft-sel:hover{text-decoration:underline}
.nav-row:has(#sendBtn[hidden]) + .lg-send{display:none}.lg-send{text-align:right}.lg-consent{display:block;font-size:.8rem;font-weight:600;line-height:1.45;color:var(--soft);margin-top:6px}.lg-consent a{color:inherit;text-decoration:underline}

/* ===== legal pages ===== */
.lg-date{display:inline-block;margin-top:6px;font-weight:800;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;padding:.35em .8em;border:2px solid var(--ink);border-radius:999px;background:var(--white)}
.lg-art{min-height:clamp(240px,24vw,330px)}
.lg-sheet{position:relative;width:min(300px,80%);aspect-ratio:3/3.7;background:#fff;border:3px solid var(--ink);border-radius:4px;box-shadow:6px 6px 0 var(--ink);padding:22px 22px;display:grid;align-content:start;gap:12px;transform:rotate(3deg)}
.lg-sheet b{font-family:var(--brush);font-weight:400;font-size:1.6rem;text-align:center}
.lg-sheet i{display:block;height:6px;border-radius:3px;background:#D9D7E6}.lg-sheet i.s{width:62%}
.lg-sig{position:absolute;bottom:20px;display:grid;justify-items:center;width:42%;border-top:2px solid var(--ink);padding-top:4px;font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.lg-sig em{position:absolute;bottom:100%;font-family:var(--brush);font-style:normal;font-size:1.25rem;letter-spacing:0;text-transform:none;color:#2A4FA8;transform:rotate(-6deg)}
.lg-sig.a{left:16px}.lg-sig.b{right:16px}
.lg-sig .jk-paw{position:absolute;right:-6px;bottom:18px;width:34px;color:var(--red);opacity:.85;transform:rotate(18deg)}
.lg-stamp{position:absolute;left:4%;top:8%;font-weight:800;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;text-align:center;color:var(--red);border:3px solid var(--red);border-radius:10px;padding:8px 12px;transform:rotate(-12deg);background:rgba(255,255,255,.7)}
.lg-wrap{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(24px,4vw,60px);align-items:start;max-width:1100px}
.lg-toc{position:sticky;top:96px;display:grid;gap:2px;padding:18px 16px;background:var(--white);border:2.5px solid var(--ink);border-radius:14px;box-shadow:4px 4px 0 var(--ink);max-height:calc(100vh - 120px);overflow:auto;scrollbar-width:thin}
.lg-toc b{font-family:var(--brush);font-weight:400;font-size:1.3rem;color:var(--red);margin-bottom:4px}
.lg-toc a{display:flex;gap:8px;align-items:baseline;padding:5px 6px;border-radius:6px;color:var(--ink);text-decoration:none;font-weight:700;font-size:.9rem;line-height:1.25}
.lg-toc a i{font-style:normal;font-family:"Oswald",sans-serif;font-size:.8rem;color:var(--soft)}
.lg-toc a:hover{background:var(--yellow)}
.lg-body{display:grid;gap:clamp(30px,4vw,46px)}
.lg-s{position:relative;scroll-margin-top:96px;padding-left:clamp(0px,5vw,64px)}
.lg-n{position:absolute;left:0;top:-2px;font-family:"Oswald",sans-serif;font-weight:700;font-size:clamp(1.4rem,2.4vw,2rem);color:var(--purple);opacity:.85}
.lg-s h2{margin:0 0 12px;font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1.1}
.lg-short{position:relative;margin:0 0 14px;padding:14px 18px 12px;background:#FFF3A8;border-radius:2px 2px 14px 2px;box-shadow:0 10px 14px -10px rgba(23,21,34,.5);font-family:var(--brush);font-size:clamp(1.15rem,1.4vw,1.3rem);line-height:1.3;max-width:34em;transform:rotate(-.6deg)}
.lg-s:nth-child(even) .lg-short{background:#DDF5C4;transform:rotate(.5deg)}
.lg-s:nth-child(3n) .lg-short{background:#E3E4FF}
.lg-short b{display:block;font-family:var(--hand);font-weight:800;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:2px}
.lg-full p{margin:0 0 10px;font-weight:500;line-height:1.7;max-width:42em}
.lg-end{padding:22px 24px;border:2.5px dashed var(--ink);border-radius:14px}
.lg-end b{font-size:1.3rem}.lg-end p{margin:6px 0 0;font-weight:600}.lg-end a{color:var(--ink);text-decoration-color:var(--red);text-decoration-thickness:2px}
@media (max-width:860px){.lg-wrap{grid-template-columns:1fr}.lg-toc{position:static;max-height:none;grid-template-columns:1fr 1fr;column-gap:10px}.lg-toc b{grid-column:1/-1}}
@media (max-width:480px){.lg-toc{grid-template-columns:1fr}.lg-s{padding-left:0}.lg-n{position:static;display:block;margin-bottom:2px}}

/* ===== J.K. Meowling ===== */
.jk-cat{display:block;width:100%;height:auto;overflow:visible}
.jk-eye,.jk-pup{transform-box:fill-box;transform-origin:center;animation:jkBlink 5s infinite}
@keyframes jkBlink{0%,93%,100%{transform:scaleY(1)}96%{transform:scaleY(.1)}}
.jk{position:absolute;right:clamp(20px,6%,90px);bottom:0;width:clamp(86px,9vw,120px);z-index:5;cursor:pointer;background:none;border:0;padding:0;overflow:hidden;height:clamp(62px,6.4vw,86px)}
.jk .jk-cat{transform:translateY(105%);transition:transform .6s cubic-bezier(.3,1.5,.5,1)}
.jk.up .jk-cat{transform:translateY(8%)}
.jk:hover .jk-cat{transform:translateY(0)}
.jk-say{position:absolute;right:calc(clamp(20px,6%,90px) + clamp(70px,7vw,100px));bottom:clamp(14px,1.6vw,22px);max-width:240px;padding:10px 14px;background:#fff;border:2.5px solid var(--ink);border-radius:14px 14px 4px 14px;box-shadow:3px 3px 0 var(--ink);font-family:var(--brush);font-size:1.1rem;line-height:1.2;z-index:6;opacity:0;transform:translateY(8px) scale(.9);transform-origin:100% 100%;transition:.25s;pointer-events:none}
.jk-say.on{opacity:1;transform:none}
.jk-say small{display:block;font-family:var(--hand);font-weight:800;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
@media (prefers-reduced-motion:reduce){.jk-eye,.jk-pup{animation:none}}

/* ===== brand check ===== */
.bc-art,.bct-art{position:relative;display:grid;place-items:center}
.bc-mini{position:relative;width:min(280px,80%);display:grid;gap:8px;padding:20px 22px 22px;background:#fff;border:3px solid var(--ink);border-radius:6px;box-shadow:6px 6px 0 var(--ink);transform:rotate(-3deg);background-image:repeating-linear-gradient(transparent 0 33px,rgba(127,134,245,.2) 33px 34px)}
.bc-mini b{font-family:var(--brush);font-weight:400;font-size:1.6rem;text-align:center;margin-bottom:4px}
.bc-mini span{display:flex;justify-content:space-between;font-weight:700;border-bottom:1.5px dashed #CFCDE0;padding-bottom:4px}
.bc-mini em{font-style:normal;font-family:var(--brush);font-size:1.35rem;line-height:1;color:var(--red)}
.bc-mini strong{position:absolute;right:-18px;top:-22px;display:grid;place-items:center;width:68px;height:68px;border:3.5px solid var(--red);border-radius:50%;font-family:var(--brush);font-weight:400;font-size:2rem;color:var(--red);background:#fff;transform:rotate(12deg)}
.bc-art .jk-cat,.bct-art .jk-cat{position:absolute;width:clamp(96px,10vw,130px);left:2%;bottom:-6%}
.bc-pen{position:absolute;right:6%;bottom:6%;width:14px;height:150px;border-radius:7px 7px 2px 2px;background:linear-gradient(90deg,#C8221A,#FF4430 40%,#C8221A);border:2.5px solid var(--ink);transform:rotate(34deg)}
.bc-pen::after{content:"";position:absolute;left:50%;bottom:-16px;width:0;height:0;margin-left:-6px;border:6px solid transparent;border-top:16px solid var(--ink)}
.bc-form{display:grid;gap:12px;max-width:820px;margin:0 auto}
.bc-q{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 18px;margin:0;padding:14px 18px;background:var(--white);border:2.5px solid var(--ink);border-radius:14px;box-shadow:3px 3px 0 var(--ink)}
.bc-q legend{float:left;display:flex;gap:10px;align-items:baseline;padding:0;font-weight:700;line-height:1.35;max-width:32em}
.bc-q legend i{font-style:normal;font-family:"Oswald",sans-serif;color:var(--purple);font-size:1.1rem}
.bc-a{display:flex;gap:6px;flex:none}
.bc-a label{position:relative;cursor:pointer}
.bc-a input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.bc-a span{display:inline-block;padding:.4em .85em;border:2.5px solid var(--ink);border-radius:999px;font-weight:800;font-size:.95rem;background:#fff;transition:transform .2s cubic-bezier(.3,1.6,.5,1),background .15s}
.bc-a label:nth-child(1) input:checked+span{background:var(--lime)}
.bc-a label:nth-child(2) input:checked+span{background:var(--yellow)}
.bc-a label:nth-child(3) input:checked+span{background:#FF8A78}
.bc-a input:checked+span{transform:rotate(-4deg) scale(1.06)}
.bc-a input:focus-visible+span{outline:3px solid var(--purple);outline-offset:2px}
.bc-q.miss{border-color:var(--red);box-shadow:3px 3px 0 var(--red)}
.bc-form .zbtn{justify-self:center;margin-top:6px}
.bc-card{position:relative;max-width:820px;margin:0 auto;padding:clamp(24px,3.4vw,44px);background:#fff;border:3px solid var(--ink);border-radius:6px;box-shadow:8px 8px 0 var(--ink);background-image:repeating-linear-gradient(transparent 0 35px,rgba(127,134,245,.18) 35px 36px);animation:goPop .5s cubic-bezier(.3,1.5,.5,1)}
.bc-card::before{content:"";position:absolute;left:50%;top:-14px;width:130px;height:30px;transform:translateX(-50%) rotate(-3deg);background:rgba(255,212,0,.82)}
.bc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.bc-top small{font-weight:800;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}
.bc-top h3{margin:2px 0 0;font-size:clamp(1.6rem,2.8vw,2.3rem);line-height:1.05}
.bc-grade{flex:none;display:grid;place-items:center;width:clamp(90px,10vw,120px);aspect-ratio:1;border:4px solid var(--red);border-radius:50%;font-family:var(--brush);font-size:clamp(3rem,5vw,4rem);color:var(--red);transform:rotate(10deg);line-height:1}
.bc-rows{display:grid;gap:10px;margin:20px 0}
.bc-row{display:grid;grid-template-columns:130px 52px minmax(0,1fr);gap:12px;align-items:baseline;padding-bottom:10px;border-bottom:1.5px dashed #CFCDE0}
.bc-row b{font-weight:800}
.bc-row em{font-style:normal;font-family:var(--brush);font-size:1.7rem;line-height:1;color:var(--red)}
.bc-row span{font-family:var(--brush);font-size:1.12rem;line-height:1.3;color:#2A4FA8}
.bc-rec{display:grid;gap:8px;padding:16px 18px;background:#FFF3A8;border-radius:2px 2px 14px 2px;transform:rotate(-.5deg)}
.bc-rec b{font-size:1.15rem}.bc-rec p{margin:0;font-weight:600}
.bc-acts{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;margin-top:18px}
.bc-sign{display:flex;align-items:center;gap:10px;margin-top:18px;font-family:var(--brush);font-size:1.15rem}
.bc-sign .jk-paw{width:40px;color:var(--red);transform:rotate(-14deg)}
.bc-again{background:none;border:0;padding:0;font:inherit;font-weight:700;text-decoration:underline;cursor:pointer;color:var(--ink)}
.bc-real{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start;max-width:1100px;margin:0 auto;padding:clamp(24px,3.4vw,44px);background:var(--white);border:3px solid var(--ink);border-radius:18px;box-shadow:6px 6px 0 var(--ink)}
.bc-k,.bct-k{font-family:var(--brush);font-size:clamp(1.2rem,1.6vw,1.45rem);color:var(--red)}
.bc-real h2{margin:4px 0 10px;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.05}
.bc-real p{font-weight:600;line-height:1.6}
.bc-perks{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:8px}
.bc-perks li{display:flex;gap:10px;align-items:center;font-weight:700}
.bc-perks li::before{content:"";flex:none;width:22px;height:22px;border:2.5px solid var(--ink);border-radius:6px;background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M4 11.5c2 1.6 3.8 3.6 5.2 6C12 11 16 5.6 22 1.5' fill='none' stroke='%23171522' stroke-width='3.6' stroke-linecap='round'/%3E%3C/svg%3E") center/70% no-repeat}
.bc-rf{display:grid;gap:10px}
.bc-rf textarea{width:100%;font:inherit;padding:.5em .7em;border:2.5px solid var(--ink);border-radius:10px;background:#fff;resize:vertical}
.bc-rf small small{font-weight:600;color:var(--soft)}
.bc-rf .zbtn{justify-self:start}
.bc-done{display:grid;gap:8px;align-content:center;text-align:center;padding:20px}
.bc-done b{font-size:1.5rem}
@media (max-width:860px){.bc-real{grid-template-columns:1fr}.bc-row{grid-template-columns:100px 44px minmax(0,1fr)}}
@media (max-width:520px){.bc-q{flex-direction:column;align-items:flex-start}.bc-row{grid-template-columns:1fr 40px}.bc-row span{grid-column:1/-1}.bc-top{flex-direction:column-reverse}}
/* home teaser */
.bct{padding:clamp(40px,6vw,90px) max(var(--gut),calc(var(--ml,40px) + 20px))}
.bct-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,60px);align-items:center;max-width:1100px;margin:0 auto}
.bct-card h2{margin:6px 0 12px;font-size:clamp(2rem,3.8vw,3.3rem);line-height:1.05}
.bct-card p{font-weight:600;line-height:1.6;margin:0 0 18px;max-width:32em}
.bct-art{min-height:clamp(260px,24vw,340px)}
.bct-art .jk-cat{left:auto;right:4%;bottom:-4%}
@media (max-width:820px){.bct-in{grid-template-columns:1fr}.bct-art{min-height:280px}}
.bc-nudge{display:flex;align-items:center;justify-content:center;gap:8px;width:max-content;max-width:100%;margin:0 auto clamp(20px,3vw,34px);padding:.5em 1.1em;border:2.5px dashed var(--ink);border-radius:999px;color:var(--ink);text-decoration:none;font-weight:700;font-size:1rem;transform:rotate(-1deg);flex-wrap:wrap;text-align:center}
.bc-nudge b{font-family:var(--brush);font-weight:400;font-size:1.2rem;color:var(--red)}
.bc-nudge svg{width:30px;transform:rotate(-70deg)}
.bc-nudge:hover{background:var(--yellow)}

/* ===== glow up sliders ===== */
.gl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:clamp(24px,3vw,40px);max-width:1180px;margin:0 auto}
.gl{position:relative;display:grid;gap:10px}
.gl-box{position:relative;aspect-ratio:14/9;border:3px solid var(--ink);border-radius:12px;overflow:hidden;box-shadow:6px 6px 0 var(--ink);background:#F2EEE4;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize;--x:50%}
.gl-box img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.gl-box .gl-before{clip-path:inset(0 calc(100% - var(--x)) 0 0)}
.gl-line{position:absolute;top:0;bottom:0;left:var(--x);width:3px;margin-left:-1.5px;background:var(--ink)}
.gl-knob{position:absolute;top:50%;left:var(--x);display:grid;place-items:center;width:52px;height:52px;margin:-26px 0 0 -26px;border:3px solid var(--ink);border-radius:50%;background:var(--yellow);box-shadow:3px 3px 0 var(--ink);font-weight:800}
.gl-knob svg{width:30px}
.gl-tag{position:absolute;top:12px;padding:.25em .7em;border:2.5px solid var(--ink);border-radius:8px;font-family:var(--brush);font-size:1.1rem;line-height:1.1;background:#fff;pointer-events:none}
.gl-tag.b{left:12px;transform:rotate(-4deg)}.gl-tag.a{right:12px;background:var(--lime);transform:rotate(4deg)}
.gl-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:ew-resize}
.gl-range:focus-visible~.gl-knob{outline:3px solid var(--purple);outline-offset:3px}
.gl-cap{display:flex;justify-content:space-between;gap:10px;align-items:baseline;flex-wrap:wrap}
.gl-cap b{font-size:1.15rem}.gl-cap span{font-family:var(--brush);font-size:1.1rem;color:var(--soft)}
.gl-hint{position:absolute;left:50%;bottom:14px;translate:-50% 0;padding:.25em .8em;background:var(--ink);color:#fff;border-radius:999px;font-weight:700;font-size:.82rem;pointer-events:none;transition:opacity .3s}
.gl-box.used .gl-hint{opacity:0}

/* ===== 404 ===== */
.oo{padding:clamp(50px,8vw,120px) 0!important}
.oo-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,60px);align-items:center;max-width:1000px}
.oo-art{position:relative;min-height:280px;display:grid;place-items:center}
.oo-art .jk-cat{position:relative;width:clamp(150px,18vw,220px);z-index:2}
.oo-page{position:absolute;left:8%;bottom:4%;width:120px;height:150px;background:#fff;border:3px solid var(--ink);border-radius:4px;transform:rotate(-38deg);box-shadow:4px 4px 0 var(--ink);background-image:repeating-linear-gradient(transparent 0 18px,#D9D7E6 18px 21px)}
.oo-k{font-weight:800;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.oo h1{margin:8px 0 14px;font-size:clamp(2.2rem,4.4vw,3.8rem);line-height:1.04}
.oo p{font-weight:600;line-height:1.6}
@media (max-width:760px){.oo-in{grid-template-columns:1fr}.oo-art{min-height:220px}}
.plate .pl-nick{font-size:max(.62rem,11px)}

.lg-date{white-space:nowrap;font-size:clamp(.62rem,2.6vw,.78rem)}
.bct-art .jk-cat{left:-2%!important;right:auto!important}
.jk{right:clamp(70px,14%,190px)}.jk-say{right:calc(clamp(70px,14%,190px) + clamp(70px,7vw,100px))}
@media (max-width:520px){.jk-say{right:12px;bottom:clamp(70px,18vw,90px);max-width:calc(100% - 24px)}}
.bct,.bc-mini,.bc-card,.bc-real{font-family:var(--hand)}
.bct-card h2{font-family:var(--hand)!important;font-style:normal!important;font-weight:800!important;letter-spacing:-.01em}
.bct-card p{font-family:var(--hand);font-weight:500}
.bc-mini span{font-family:var(--hand);font-weight:700}
.lg-head{max-width:1100px;margin:0 auto;padding:clamp(40px,5vw,70px) max(var(--gut),calc(var(--ml,40px) + 20px)) 0;box-sizing:content-box}
.lg-k{font-family:var(--brush);font-size:clamp(1.15rem,1.5vw,1.4rem);color:var(--red)}
.lg-head h1{margin:4px 0 12px;font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1.05;letter-spacing:-.02em}
#view-terms .p-sec,#view-privacy .p-sec{padding-top:clamp(26px,3vw,40px)!important}
@media (max-width:620px){
  .ft.desk .dk{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:20px 14px!important;align-items:center}
  .ft.desk .dk-letter{grid-column:1/-1!important}
  .ft.desk .dk-phone{grid-column:1!important;grid-row:2/span 2!important;width:100%!important;max-width:170px;justify-self:center}
  .ft.desk .dk-note{grid-column:2!important;grid-row:2!important}
  .ft.desk .dk-note2{grid-column:2!important;grid-row:3!important}
  .ft.desk .dk-note,.ft.desk .dk-note2{width:100%!important;max-width:none!important;padding:14px 12px!important;font-size:.82em!important}
  .dk-follow{display:none!important}
  .ft.desk .dk{padding-bottom:20px!important}
}

/* ===== the quick hello popup ===== */
#pop{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:16px;overflow-y:auto}
#pop[hidden]{display:none}
.pop-bg{position:fixed;inset:0;background:rgba(23,21,34,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:popFade .25s ease}
.pop-card{position:relative;width:min(640px,100%);margin:44px 0 20px;padding:clamp(26px,4vw,40px) clamp(20px,4vw,40px) clamp(20px,3vw,30px);background:#FFFDF6;border:3px solid var(--ink);border-radius:6px;box-shadow:10px 10px 0 var(--ink);font-family:var(--hand);background-image:linear-gradient(90deg,transparent 46px,rgba(255,68,48,.35) 46px 48px,transparent 48px),repeating-linear-gradient(transparent 0 33px,rgba(127,134,245,.18) 33px 34px);animation:popIn .45s cubic-bezier(.3,1.5,.5,1)}
@keyframes popIn{from{opacity:0;transform:translateY(30px) rotate(-3deg) scale(.94)}}
@keyframes popFade{from{opacity:0}}
.pop-tape{position:absolute;left:50%;top:-15px;width:140px;height:32px;transform:translateX(-50%) rotate(-3deg);background:rgba(255,212,0,.85)}
.pop-cat{position:absolute;right:68px;top:-72px;width:100px;height:auto;overflow:visible}
.pop-stamp{position:absolute;right:16px;top:16px;display:grid;justify-items:center;width:60px;padding:6px 0;background:var(--lime);border:2.5px dashed var(--ink);transform:rotate(6deg);line-height:1}
.pop-stamp b{font-family:var(--brush);font-weight:400;font-size:1.7rem}.pop-stamp small{font-family:var(--brush);font-size:.7rem}
.pop-x{position:absolute;left:-18px;top:-18px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:2.5px solid var(--ink);background:#fff;box-shadow:3px 3px 0 var(--ink);cursor:pointer;color:var(--ink);transition:transform .2s}
.pop-x:hover{transform:rotate(90deg)}.pop-x svg{width:20px}
.pop-form{display:grid;gap:12px}
.pop-k{font-family:var(--brush);font-size:clamp(1.15rem,1.6vw,1.35rem);color:var(--red);padding-right:70px}
#pop h2{margin:-4px 0 0;font-size:clamp(1.7rem,3.6vw,2.4rem);line-height:1.05;padding-right:60px}
.pop-lead{margin:0;font-weight:500;line-height:1.55;font-size:1rem}
.pop-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pop-f{display:grid;gap:4px;font-weight:700;font-size:.95rem}
.pop-f small,.pop-g small{font-weight:500;color:var(--soft)}
.pop-f input,.pop-f textarea{width:100%;box-sizing:border-box;font:inherit;font-weight:500;padding:.55em .8em;border:2.5px solid var(--ink);border-radius:10px;background:#fff;transition:box-shadow .15s,transform .15s}
.pop-f input:focus,.pop-f textarea:focus{outline:0;box-shadow:3px 3px 0 var(--purple);transform:translate(-1px,-1px)}
.pop-f textarea{resize:vertical;min-height:62px}
.pop-g{margin:0;padding:0;border:0;display:flex;flex-wrap:wrap;gap:8px}
.pop-g legend{width:100%;padding:0;margin-bottom:6px;font-weight:700;font-size:.95rem}
.pop-g label{position:relative;cursor:pointer}
.pop-g input{position:absolute;opacity:0;inset:0;margin:0;width:100%!important;height:100%!important;cursor:pointer}
.pop-g span{display:inline-block;padding:.35em .85em;border:2.5px solid var(--ink);border-radius:999px;background:#fff;font-weight:700;font-size:.92rem;transition:transform .2s cubic-bezier(.3,1.6,.5,1),background .15s}
.pop-g label:nth-child(5n+2) input:checked+span{background:var(--yellow)}
.pop-g label:nth-child(5n+3) input:checked+span{background:var(--lime)}
.pop-g label:nth-child(5n+4) input:checked+span{background:#FFB3C1}
.pop-g label:nth-child(5n+5) input:checked+span{background:#C9CBFF}
.pop-g label:nth-child(5n+6) input:checked+span{background:#FFD3A1}
.pop-g input:checked+span{transform:rotate(-3deg) scale(1.05);box-shadow:2px 2px 0 var(--ink)}
.pop-g input:focus-visible+span{outline:3px solid var(--purple);outline-offset:2px}
.pop-go{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:4px}
.pop-done{display:grid;justify-items:center;text-align:center;gap:10px;padding:20px 0 10px}
.pop-done .dn-stamp{position:static;transform:rotate(-8deg)}
.pop-done h3{margin:0;font-size:clamp(1.6rem,3.4vw,2.2rem);line-height:1.1}
.pop-done p{margin:0;font-weight:500;max-width:30em}
body.pop-open{overflow:hidden}
@media (max-width:560px){.pop-row{grid-template-columns:1fr}.pop-cat{right:auto;left:40px;width:84px;top:-60px}.pop-card{background-image:repeating-linear-gradient(transparent 0 33px,rgba(127,134,245,.18) 33px 34px)}.pop-x{left:auto;right:-8px;top:-20px}.pop-stamp{top:12px;right:12px;width:52px}}
/* floating say hi bookmark */
.hi-tab{position:fixed;right:0;top:50%;z-index:60;display:grid;justify-items:center;gap:6px;padding:14px 9px 16px 11px;background:var(--red);color:#fff;border:2.5px solid var(--ink);border-right:0;border-radius:12px 0 0 12px;box-shadow:-3px 3px 0 var(--ink);font-family:var(--brush);font-size:1.15rem;line-height:1;cursor:pointer;transform:translate(110%,-50%);transition:transform .35s cubic-bezier(.3,1.5,.5,1)}
.hi-tab span{writing-mode:vertical-rl;transform:rotate(180deg)}
.hi-tab svg{width:22px}
.hi-tab.show{transform:translate(0,-50%)}
.hi-tab.show:hover{transform:translate(-4px,-50%)}
@media (max-width:620px){.hi-tab{top:auto;bottom:90px;transform:translate(110%,0);padding:10px 7px 12px 9px;font-size:1rem}.hi-tab.show{transform:none}.hi-tab.show:hover{transform:none}}
body.on-contact .hi-tab{display:none}
.dk-hi{margin-top:16px}
@media (prefers-reduced-motion:reduce){.pop-card,.pop-bg{animation:none}}

#pop h2{font-family:var(--hand)!important;font-style:normal!important;font-weight:800!important;letter-spacing:-.01em}
.pop-card{margin-top:84px!important}
@media (min-width:561px){.pop-card{padding-left:72px!important}.pop-x{left:-18px}}

/* ===== popup v2: fits any screen, opens out of an envelope ===== */
#pop{place-items:center;overflow:hidden;padding:0 12px}
.pop-card{display:flex;flex-direction:column;width:min(620px,100%)!important;max-height:calc(100dvh - 96px);margin:62px 0 18px!important;padding:0!important;z-index:2}
.pop-in{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:clamp(22px,3vw,30px) clamp(18px,3.4vw,34px) clamp(16px,2.4vw,22px) clamp(18px,3.4vw,34px);border-radius:4px}
@media (min-width:561px){.pop-in{padding-left:72px}}
.pop-form{gap:10px}
.pop-lead{font-size:.95rem}
.pop-f input,.pop-f textarea{padding:.45em .75em}
.pop-f textarea{min-height:44px}
.pop-g span{padding:.3em .8em;font-size:.88rem}
.pop-cat{z-index:-1;top:-64px!important}
@media (max-height:760px){.pop-lead{display:none}#pop h2{font-size:clamp(1.5rem,3vw,2rem)}}
/* the opening sequence */
#pop.opening .pop-bg{animation:popFade .3s ease both}
#pop.opening .pop-card{animation:letterOut .75s .42s cubic-bezier(.25,1.35,.45,1) both}
#pop.opening .pop-cat{animation:catPeek .55s 1.05s cubic-bezier(.3,1.7,.5,1) both}
#pop.opening .pop-tape{animation:tapeSlap .35s .98s cubic-bezier(.3,1.6,.5,1) both}
#pop.opening .pop-stamp{animation:stampThump .4s 1.15s cubic-bezier(.3,1.6,.5,1) both}
#pop.opening .pop-x{animation:goPop .3s 1.2s both}
#pop.opening .pop-g label,#pop.opening .pop-f{animation:fieldIn .4s both}
#pop.opening .pop-f:nth-of-type(1){animation-delay:.95s}#pop.opening .pop-row .pop-f:nth-child(2){animation-delay:1s}
@keyframes letterOut{0%{opacity:0;transform:translateY(46vh) scale(.42) rotate(-6deg)}35%{opacity:1}70%{transform:translateY(-14px) scale(1.02) rotate(1deg)}100%{transform:none}}
@keyframes catPeek{from{transform:translateY(60px)}}
@keyframes tapeSlap{from{opacity:0;transform:translateX(-50%) rotate(-14deg) scale(1.7)}}
@keyframes stampThump{0%{opacity:0;transform:rotate(-20deg) scale(2.4)}70%{opacity:1;transform:rotate(9deg) scale(.92)}100%{transform:rotate(6deg)}}
@keyframes fieldIn{from{opacity:0;transform:translateY(8px)}}
.pop-env{position:fixed;left:50%;bottom:-10px;width:min(420px,84vw);aspect-ratio:1.6;translate:-50% 0;z-index:3;pointer-events:none;opacity:0;perspective:900px}
.pe-back,.pe-front,.pe-flap{position:absolute;left:0;right:0}
.pe-back{inset:0;background:#E9CFA4;border:3px solid var(--ink);border-radius:8px}
.pe-front{inset:0;background:#F3DDB6;border:3px solid var(--ink);border-radius:8px;clip-path:polygon(0 32%,50% 64%,100% 32%,100% 100%,0 100%)}
.pe-flap{top:0;height:62%;background:#DDBE8C;border:3px solid var(--ink);border-radius:8px 8px 0 0;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;z-index:2}
#pop.opening .pop-env{animation:envRide 1.25s ease both}
#pop.opening .pe-flap{animation:flapOpen .3s .3s ease-in both}
@keyframes envRide{0%{opacity:1;transform:translateY(110%)}24%{opacity:1;transform:translateY(-6%)}34%,62%{opacity:1;transform:none}100%{opacity:0;transform:translateY(120%) rotate(6deg)}}
@keyframes flapOpen{to{transform:rotateX(180deg);z-index:0}}
/* closing */
#pop.closing .pop-card{animation:letterAway .32s ease-in both}
#pop.closing .pop-bg{animation:popFade .32s reverse both}
@keyframes letterAway{to{opacity:0;transform:translateY(60px) scale(.88) rotate(4deg)}}
@media (prefers-reduced-motion:reduce){#pop.opening *,#pop.closing *{animation:none!important}.pop-env{display:none}}

/* ===== side bookmark v2 ===== */
.hi-tab{padding:16px 10px 26px 12px!important;border-radius:10px 0 0 0!important;background:var(--red)!important;clip-path:none!important;box-shadow:none!important;filter:drop-shadow(-3px 3px 0 var(--ink));overflow:visible}
.hi-tab::before{content:"";position:absolute;inset:4px 4px 12px 4px;border:1.5px dashed rgba(255,255,255,.7);border-right:0;border-radius:6px 0 0 0;pointer-events:none}
.hi-tab::after{content:"";position:absolute;left:-2.5px;right:0;bottom:-14px;height:16px;background:var(--red);border-left:2.5px solid var(--ink);clip-path:polygon(0 0,100% 0,100% 100%,50% 30%,0 100%)}
.hi-tab span{font-size:1.2rem;letter-spacing:.02em}
.hi-badge{position:absolute;left:-12px;top:-10px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--yellow);color:var(--ink);border:2.5px solid var(--ink);font-family:var(--hand);font-style:normal;font-weight:800;font-size:.8rem;animation:badgeHop 3.2s ease-in-out infinite}
@keyframes badgeHop{0%,70%,100%{transform:none}78%{transform:translateY(-7px) rotate(-10deg)}86%{transform:none}92%{transform:translateY(-3px)}}
.hi-tab.show{animation:tabNudge 7s 2s ease-in-out infinite}
@keyframes tabNudge{0%,90%,100%{transform:translate(0,-50%)}93%{transform:translate(-8px,-50%) rotate(-3deg)}96%{transform:translate(-2px,-50%)}}
.hi-tab.show:hover{animation:none;transform:translate(-6px,-50%)!important}
@media (max-width:620px){.hi-tab.show{animation:none}}
@media (prefers-reduced-motion:reduce){.hi-badge,.hi-tab.show{animation:none}}

/* ===== real human grading form gets breathing room ===== */
.bc-rf{padding:clamp(18px,2.4vw,26px);background:#fff;border:2.5px dashed var(--ink);border-radius:16px}
.bc-rf .cl-f input,.bc-rf textarea{box-sizing:border-box;width:100%;max-width:100%}
.bc-rf .cl-f{min-width:0}
@media (max-width:520px){.bc-real{padding:18px 14px}.bc-rf{padding:16px 14px}}


/* popup v3: still, no scrolling */
.pop-card{width:min(640px,100%)!important}
.pop-in{padding:22px 30px 18px 30px!important;overflow:visible}
@media (min-width:561px){.pop-in{padding-left:70px!important}}
.pop-form{gap:9px!important}
#pop h2{font-size:clamp(1.55rem,2.6vw,2.05rem)!important;padding-right:84px}
.pop-k{padding-right:84px}
.pop-lead{font-size:.92rem!important;line-height:1.45!important}
.pop-row{gap:10px!important}
.pop-f{font-size:.88rem!important;gap:3px!important}
.pop-f input{padding:.38em .7em!important}
.pop-g{flex-wrap:nowrap!important;gap:6px!important}
.pop-g legend{font-size:.88rem!important;margin-bottom:4px!important}
.pop-g label{flex:1 1 auto;min-width:0}
.pop-g span{display:block!important;text-align:center;white-space:nowrap;padding:.32em .5em!important;font-size:.84rem!important}
.pop-go .zbtn{padding:.5em 1.1em}
#pop .lg-consent{font-size:.74rem;margin-top:0}
.pop-x{left:auto!important;right:-18px!important;top:-18px!important}
.pop-stamp{right:30px!important;top:20px!important}
.pop-cat{right:auto!important;left:50%;margin-left:90px}
.pop-in{max-height:none}
.pop-card{max-height:none!important;overflow:visible}
@media (max-height:720px) and (min-width:561px){.pop-lead{display:none}}
@media (max-width:560px){
  #pop{align-items:start;overflow-y:auto}
  .pop-in{padding:20px 16px 16px!important}
  .pop-g{flex-wrap:wrap!important}.pop-g label{flex:0 1 auto}
  .pop-row{grid-template-columns:1fr 1fr!important}
  .pop-lead{display:none}
  #pop h2,.pop-k{padding-right:58px}
  .pop-stamp{right:14px!important;top:14px!important;width:48px!important}
  .pop-x{right:-6px!important;top:-20px!important}
  .pop-cat{margin-left:30px;width:80px!important;top:-54px!important}
}
/* envelope matches the letter */
.pop-env{width:min(700px,98vw)!important;aspect-ratio:1.45!important}


/* shelf cards flip like real cards */
#shelfGrid{perspective:1400px}
#shelfGrid .sc.flip-out{animation:cardFlipOut .38s cubic-bezier(.55,0,.75,.4) both;animation-delay:calc(var(--fi) * 70ms);pointer-events:none}
#shelfGrid .sc.flip-in{animation:cardFlipIn .42s cubic-bezier(.2,.7,.3,1.25) both;animation-delay:calc(var(--fi) * 70ms)}
@keyframes cardFlipOut{from{transform:rotate(var(--r)) rotateY(0)}to{transform:rotate(var(--r)) rotateY(calc(var(--fd,1) * -90deg)) translateZ(0);filter:brightness(.85)}}
@keyframes cardFlipIn{from{transform:rotate(var(--r)) rotateY(calc(var(--fd,1) * 90deg));filter:brightness(.85)}to{transform:rotate(var(--r)) rotateY(0)}}


/* tour: road trip stops */
.rt-k{font-family:var(--brush);font-size:clamp(1.2rem,1.6vw,1.45rem);color:var(--red);display:inline-block;transform:rotate(-2deg)}
.rt-map{position:relative;max-width:1100px;margin:clamp(20px,3vw,40px) auto 0;min-height:clamp(380px,36vw,460px)}
.rt-road{position:absolute;left:0;right:0;top:20%;width:100%;height:56%}
.rt-stops{list-style:none;margin:0;padding:0;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,3vw,40px);height:100%}
.rt-s{position:relative;display:grid;justify-items:center;align-content:start;gap:12px}
.rt-s.s1{padding-top:clamp(150px,15vw,190px)}.rt-s.s2{padding-top:0}.rt-s.s3{padding-top:clamp(150px,15vw,190px)}
.rt-pin{position:relative;display:grid;justify-items:center;align-content:center;width:64px;height:64px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--red);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);color:#fff;line-height:1;z-index:2}
.rt-pin b,.rt-pin small{transform:rotate(45deg)}
.rt-pin b{font-family:"Oswald",sans-serif;font-size:1.6rem}.rt-pin small{font-family:var(--brush);font-size:.75rem;margin-top:-2px}
.rt-s.s2 .rt-pin{background:var(--purple)}.rt-s.s3 .rt-pin{background:#2E9E5B}
.rt-card{position:relative;width:min(100%,300px);padding:16px 18px 14px;background:#FFF3A8;border-radius:2px 2px 16px 2px;box-shadow:0 14px 18px -12px rgba(23,21,34,.5);transform:rotate(-2deg)}
.rt-s.s2 .rt-card{background:#E3E4FF;transform:rotate(1.5deg)}.rt-s.s3 .rt-card{background:#DDF5C4;transform:rotate(-1deg)}
.rt-card::before{content:"";position:absolute;left:50%;top:-12px;width:80px;height:24px;transform:translateX(-50%) rotate(-4deg);background:rgba(255,255,255,.6)}
.rt-card h3{margin:0 0 6px;font-size:clamp(1.3rem,1.8vw,1.55rem);line-height:1.1}
.rt-card p{margin:0;font-family:var(--hand);font-weight:500;line-height:1.5}
.rt-flag{position:absolute;right:-1%;top:-4%;padding:8px 14px 6px;font-family:var(--brush);font-size:1.15rem;line-height:1.05;text-align:center;background:#fff;border:2.5px solid var(--ink);border-radius:6px;box-shadow:3px 3px 0 var(--ink);transform:rotate(8deg)}
.rt-flag::after{content:"";position:absolute;left:12px;top:100%;width:3px;height:44px;background:var(--ink)}
@media (max-width:820px){
  .rt-map{min-height:0}
  .rt-road{left:50%;top:0;bottom:0;width:60px;height:100%;transform:translateX(-50%) rotate(0)}
  .rt-road{display:none}
  .rt-stops{grid-template-columns:1fr;gap:26px;padding-left:0;border-left:0}
  .rt-stops::before{content:"";position:absolute;left:31px;top:20px;bottom:20px;width:6px;background:repeating-linear-gradient(#171522 0 16px,transparent 16px 28px);border-radius:3px}
  .rt-s,.rt-s.s1,.rt-s.s2,.rt-s.s3{padding-top:0;grid-template-columns:64px minmax(0,1fr);justify-items:start;align-items:center;gap:16px}
  .rt-card{width:100%}
  .rt-flag{position:relative;right:auto;top:auto;display:block;width:max-content;margin:30px auto 0;transform:rotate(-3deg)}.rt-flag::after{display:none}
}
/* tour: three simple rules */
.rr3{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.6vw,34px);max-width:1180px;align-items:start}
.rule{position:relative;padding:clamp(22px,2.6vw,30px) clamp(18px,2.2vw,26px) clamp(18px,2.2vw,24px);background:#fff;border:3px solid var(--ink);border-radius:18px;box-shadow:6px 6px 0 var(--ink)}
.rule:nth-child(1){transform:rotate(-1deg)}.rule:nth-child(2){transform:rotate(.6deg)}.rule:nth-child(3){transform:rotate(-.6deg)}
.rr-n{position:absolute;left:-14px;top:-18px;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--yellow);border:3px solid var(--ink);box-shadow:2px 2px 0 var(--ink);font-family:"Oswald",sans-serif;font-weight:700;font-size:1.4rem}
.rule h3{margin:4px 0 8px;font-size:clamp(1.3rem,1.8vw,1.55rem);line-height:1.12}
.rule p{margin:0 0 10px;font-family:var(--hand);font-weight:500;line-height:1.55}
.rr-docs{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:7px}
.rr-docs li{position:relative;padding-left:28px;font-family:var(--hand);font-weight:700;font-size:.95rem;line-height:1.35}
.rr-docs li::before{content:"";position:absolute;left:0;top:1px;width:18px;height:18px;border:2.5px solid var(--ink);border-radius:5px;background:var(--lime)}
.rr-note{padding:10px 12px;background:#FFF3A8;border-radius:2px 2px 12px 2px;font-size:.92rem;transform:rotate(-.6deg)}
.rr-note b{color:var(--red)}
.rr-end{margin-top:12px!important;padding-top:10px;border-top:2px dashed #CFCDE0;font-family:var(--brush)!important;font-size:1.15rem;color:var(--red)}
@media (max-width:980px){.rr3{grid-template-columns:1fr;max-width:560px;gap:34px}}


@media (max-width:620px){
  header.top .bmarks{display:none!important}
  header.top .menu-btn{display:inline-flex!important;align-items:center;gap:8px;margin-left:auto;padding:7px 14px 6px!important;font-size:1rem;border-radius:12px!important;transform:rotate(1.5deg)}
  header.top .menu-btn::before{content:"";width:18px;height:12px;background:linear-gradient(var(--ink) 0 2.5px,transparent 2.5px 4.75px,var(--ink) 4.75px 7.25px,transparent 7.25px 9.5px,var(--ink) 9.5px 12px)}
  header.top nav.main{display:none!important}
  header.top nav.main.open{display:grid!important;position:absolute;left:12px;right:12px;top:calc(100% + 8px);gap:8px;padding:16px 14px 14px!important;background:#FFFDF6!important;border:2.5px solid var(--ink)!important;border-radius:14px;box-shadow:6px 6px 0 var(--ink);animation:menuDrop .3s cubic-bezier(.3,1.5,.5,1)}
  header.top nav.main.open a{display:flex;align-items:center;gap:10px;padding:10px 14px!important;border-radius:10px 4px 4px 10px;border:2.5px solid var(--ink)!important;font-family:var(--brush);font-size:1.25rem;color:var(--ink)!important;text-decoration:none;background:var(--c,#fff)!important;clip-path:polygon(0 0,100% 0,calc(100% - 14px) 50%,100% 100%,0 100%)}
  header.top nav.main.open a:nth-child(1){--c:#7A80F2;color:#fff!important}header.top nav.main.open a:nth-child(2){--c:#A0E45D}header.top nav.main.open a:nth-child(3){--c:#FFD400}header.top nav.main.open a:nth-child(4){--c:#FFB3A8}header.top nav.main.open a:nth-child(5){--c:#FF4430;color:#fff!important}header.top nav.main.open a:nth-child(6){--c:#C1C5FA}
  header.top nav.main.open a.on{transform:translateX(8px)}
  header.top .wrap{padding-block:10px!important}
}
@keyframes menuDrop{from{opacity:0;transform:translateY(-10px) scale(.97)}}


@media (max-width:620px){
  /* say hi: a little round stamp, out of the way of the text */
  .hi-tab{top:auto!important;bottom:18px!important;right:auto!important;left:14px;width:54px;height:54px;padding:0!important;border:2.5px solid var(--ink)!important;border-radius:50%!important;display:grid!important;place-items:center;box-shadow:3px 3px 0 var(--ink)!important;filter:none!important;transform:translateY(140%)!important}
  .hi-tab.show{transform:none!important}
  .hi-tab::before,.hi-tab::after,.hi-tab span{display:none!important}
  .hi-tab svg{width:24px}
  .hi-badge{left:auto;right:-6px;top:-6px}
  /* brand check art stays inside the page */
  .bc-art .bc-mini,.bct-art .bc-mini{width:min(230px,70%)}
  .bc-mini strong{right:-8px;top:-18px;width:54px;height:54px;font-size:1.6rem}
  .bc-art,.bct-art{overflow-x:clip}
  /* cover gift art not cut at the top */
  .gf-art{margin-top:18px}.gf-tag{left:50%!important;top:84%!important}
  /* plans nudge fits */
  .bc-nudge{width:auto;font-size:.92rem;margin-inline:8px}
  /* home shelf: 3 per row so it isn't endless */
  .z3-row{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:26px 10px!important}
  /* footer card sits below the letter instead of on top of it */
  .ft.desk .dk-card{margin-top:30px!important}
  .rt-card h3,.rule h3{font-size:1.3rem}
}

.pop-card,.pop-bg{animation:none}
#pop:not(.opening):not(.closing) .pop-card,#pop:not(.opening):not(.closing) .pop-bg,#pop:not(.opening):not(.closing) .pop-cat,#pop:not(.opening):not(.closing) .pop-tape,#pop:not(.opening):not(.closing) .pop-stamp,#pop:not(.opening):not(.closing) .pop-x,#pop:not(.opening):not(.closing) .pop-f,#pop:not(.opening):not(.closing) .pop-g label{animation:none!important}
#shelfGrid{overflow-anchor:none}
#shelfGrid{perspective:none!important}#shelfGrid .sc{backface-visibility:hidden;will-change:transform}

#pop .pop-env{position:static!important;display:contents!important;opacity:1!important;animation:none!important;width:auto!important;aspect-ratio:auto!important;translate:none!important}
#pop .pe-back,#pop .pe-front,#pop .pe-flap{position:fixed;left:50%;top:50%;right:auto;bottom:auto;width:min(680px,94vw);aspect-ratio:1.55;height:auto;transform:translate(-50%,-6%);opacity:0;pointer-events:none;border-radius:10px}
#pop .pe-back{z-index:1;background:#E3C594;border:3px solid var(--ink)}
#pop .pe-front{z-index:3;background:linear-gradient(160deg,#F6E2BD,#EDD3A4);border:3px solid var(--ink);border-top:0;clip-path:polygon(0 14%,50% 58%,100% 14%,100% 100%,0 100%)}
#pop .pe-flap{z-index:4;height:auto;aspect-ratio:2.6;background:#D9B983;border:3px solid var(--ink);border-bottom:0;border-radius:10px 10px 0 0;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0}
#pop.opening .pe-back,#pop.opening .pe-front{animation:envSide 1.5s cubic-bezier(.3,.9,.4,1) both}
#pop.opening .pe-flap{animation:flapSide 1.5s cubic-bezier(.3,.9,.4,1) both}
@keyframes envSide{0%{opacity:1;transform:translate(calc(-50% - 100vw),-6%) rotate(-9deg)}24%{opacity:1;transform:translate(-50%,-6%) rotate(1.5deg)}30%,70%{opacity:1;transform:translate(-50%,-6%) rotate(0)}100%{opacity:0;transform:translate(-50%,70vh) rotate(5deg)}}
@keyframes flapSide{0%{opacity:1;z-index:4;transform:translate(calc(-50% - 100vw),-6%) rotate(-9deg) rotateX(0)}24%{opacity:1;transform:translate(-50%,-6%) rotate(1.5deg) rotateX(0)}30%{z-index:4;transform:translate(-50%,-6%) rotateX(0)}38%{z-index:0}44%,70%{opacity:1;z-index:0;transform:translate(-50%,-6%) rotateX(180deg)}100%{opacity:0;z-index:0;transform:translate(-50%,70vh) rotate(5deg) rotateX(180deg)}}
#pop.opening .pop-card{animation:letterRise 1.5s cubic-bezier(.3,.9,.4,1) both!important}
@keyframes letterRise{0%,38%{opacity:0;transform:translateY(46vh) scale(.88)}40%{opacity:1;transform:translateY(46vh) scale(.88)}74%{transform:translateY(-14px) scale(1.01)}86%,100%{opacity:1;transform:none}}
#pop.opening .pop-cat{animation:catPeek .5s 1.2s cubic-bezier(.3,1.7,.5,1) both!important}
#pop.opening .pop-tape{animation:tapeSlap .35s 1.15s cubic-bezier(.3,1.6,.5,1) both!important}
#pop.opening .pop-stamp{animation:stampThump .4s 1.25s cubic-bezier(.3,1.6,.5,1) both!important}
#pop.opening .pop-x{animation:goPop .3s 1.3s both!important}
#pop.opening .pop-f,#pop.opening .pop-g label{animation:none!important}
@media (max-width:560px){#pop .pe-back,#pop .pe-front,#pop .pe-flap{top:46%}}

#funForm .fq{display:block}

/* ===== case file ===== */
.cz{max-width:1120px;margin:0 auto;padding:clamp(10px,2vw,24px) max(var(--gut),calc(var(--ml,40px) + 20px)) clamp(40px,5vw,70px);box-sizing:content-box}
.cz-back{display:inline-flex;align-items:center;gap:8px;margin:4px 0 clamp(20px,3vw,34px);padding:.4em .9em;background:#fff;border:2.5px solid var(--ink);border-radius:10px;box-shadow:3px 3px 0 var(--ink);font-family:var(--brush);font-size:1.15rem;color:var(--ink);cursor:pointer;transform:rotate(-1.5deg)}
.cz-back .har{transform:scaleX(-1);margin:0}
.cz-back:hover{background:var(--yellow)}
.cz-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,4vw,60px);align-items:center}
.cz-case{font-family:var(--brush);font-size:clamp(1.15rem,1.5vw,1.35rem);color:var(--red)}
.cz h1{margin:4px 0 6px;font-family:var(--hand);font-weight:800;font-size:clamp(2.4rem,5vw,4.4rem);line-height:1;letter-spacing:-.02em}
.cz-book{display:block;font-family:var(--brush);font-size:clamp(1.3rem,1.9vw,1.7rem);color:#4a4858}
.cz-book b{font-weight:400;color:var(--ink);background:linear-gradient(transparent 58%,rgba(255,212,0,.75) 58%)}
.cz-chipsrow{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 18px}
.cz-chip{display:inline-flex;align-items:center;gap:8px;padding:.35em .85em .3em .55em;border:2.5px dashed #B9B7C8;border-radius:999px;font-family:var(--hand);font-weight:700;font-size:.92rem;color:#9C9AAE}
.cz-chip::before{content:"";width:16px;height:16px;border:2.5px solid currentColor;border-radius:5px}
.cz-chip.on{border-style:solid;border-color:var(--ink);color:var(--ink);background:#fff;box-shadow:2px 2px 0 var(--ink)}
.cz-chip.on::before{border-color:var(--ink);background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M4 11.5c2 1.6 3.8 3.6 5.2 6C12 11 16 5.6 22 1.5' fill='none' stroke='%23171522' stroke-width='3.6' stroke-linecap='round'/%3E%3C/svg%3E") center/80% no-repeat}
.cz-facts{display:flex;flex-wrap:wrap;gap:12px}
.cz-facts div{display:grid;padding:10px 16px 8px;background:#fff;border:2.5px solid var(--ink);border-radius:12px;box-shadow:3px 3px 0 var(--ink)}
.cz-facts div:nth-child(2){transform:rotate(1.5deg);background:#FFF3A8}
.cz-facts small{font-family:var(--hand);font-weight:800;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}
.cz-facts b{font-family:var(--brush);font-weight:400;font-size:1.35rem;line-height:1.1}
.cz-art{position:relative;display:grid;place-items:center;padding:20px 0}
.cz-cover{position:relative;margin:0;width:min(300px,78%);padding:12px 12px 40px;background:#fff;box-shadow:0 2px 2px rgba(23,21,34,.08),0 24px 30px -16px rgba(23,21,34,.5);transform:rotate(3deg)}
.cz-cover img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover}
.cz-tape{position:absolute;left:50%;top:-14px;width:110px;height:28px;transform:translateX(-50%) rotate(-4deg);background:rgba(255,212,0,.82)}
.cz-stamp{position:absolute;left:2%;bottom:6%;display:grid;place-items:center;width:104px;height:104px;border:3px solid var(--red);border-radius:50%;color:var(--red);font-family:var(--hand);font-weight:800;font-size:.72rem;line-height:1.15;letter-spacing:.08em;text-transform:uppercase;text-align:center;transform:rotate(-14deg);background:rgba(255,253,246,.85)}
.cz-stamp b{font-family:var(--brush);font-weight:400;font-size:1.5rem;letter-spacing:0;text-transform:none}
.cz-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.6vw,32px);margin:clamp(40px,5vw,70px) 0 clamp(50px,6vw,80px);align-items:start}
.cz-note{position:relative;padding:22px 20px 20px;border-radius:2px 2px 16px 2px;box-shadow:0 16px 20px -14px rgba(23,21,34,.5);background:#FFF3A8;transform:rotate(-1.5deg)}
.cz-note.n2{background:#FFD7DE;transform:rotate(1.2deg) translateY(14px)}
.cz-note.n3{background:#DDF5C4;transform:rotate(-.8deg)}
.cz-note::before{content:"";position:absolute;left:50%;top:-12px;width:80px;height:24px;transform:translateX(-50%) rotate(-3deg);background:rgba(255,255,255,.6)}
.cz-note b{display:block;font-family:var(--brush);font-weight:400;font-size:1.4rem;color:var(--red);margin-bottom:4px}
.cz-note p{margin:0;font-family:var(--hand);font-weight:500;line-height:1.55}
.cz-sec{margin:0 0 clamp(50px,6vw,90px)}
.cz-sh{display:flex;gap:18px;align-items:flex-start;margin-bottom:clamp(20px,3vw,34px)}
.cz-no{flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:var(--yellow);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font-family:"Oswald",sans-serif;font-weight:700;font-size:1.4rem;transform:rotate(-6deg)}
.s-web .cz-no{background:var(--lime)}.s-social .cz-no{background:#FFB7C5}
.cz-k{display:block;font-family:var(--brush);font-size:clamp(1.1rem,1.5vw,1.3rem);color:var(--red)}
.cz-sh h2{margin:0;font-family:var(--hand);font-weight:800;font-size:clamp(1.8rem,3.2vw,2.7rem);line-height:1.05}
.cz-sh p{margin:6px 0 0;font-family:var(--hand);font-weight:500;color:#4a4858}
.cz-gal{display:grid;gap:clamp(18px,3vw,36px);grid-template-columns:repeat(2,minmax(0,1fr))}
.cz-gal.n1{grid-template-columns:1fr;max-width:800px;margin:0 auto}
.cz-gal.n3 .cz-fig:first-child,.cz-gal.n4 .cz-fig:first-child{grid-column:1/-1}
.cz-gal.n4{grid-template-columns:repeat(3,minmax(0,1fr))}
.cz-fig{margin:0;transform:rotate(var(--t))}
.cz-zoom{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;font:inherit;transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.cz-zoom:hover{transform:translateY(-4px) rotate(calc(var(--t) * -.5))}
.cz-zoom img{display:block;width:100%;height:auto;aspect-ratio:14/9;object-fit:cover;background:#F2EEE4}
.f-pola .cz-zoom{padding:12px 12px 14px;background:#fff;box-shadow:0 2px 2px rgba(23,21,34,.08),0 22px 28px -16px rgba(23,21,34,.5)}
.f-web .cz-zoom{border:3px solid var(--ink);border-radius:12px;overflow:hidden;background:#fff;box-shadow:6px 6px 0 var(--ink)}
.f-web .cz-fig{transform:none}
.cz-bar{display:flex;gap:6px;align-items:center;height:28px;padding:0 12px;background:#FFFDF6;border-bottom:3px solid var(--ink)}
.cz-bar i{width:11px;height:11px;border-radius:50%;border:2px solid var(--ink)}
.cz-bar i:nth-child(1){background:#FF8A78}.cz-bar i:nth-child(2){background:var(--yellow)}.cz-bar i:nth-child(3){background:var(--lime)}
.cz-fig figcaption{margin-top:10px;font-family:var(--brush);font-size:1.15rem;text-align:center;color:#4a4858}
.cz-chips2{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:clamp(24px,3vw,36px)}
.cz-paint{display:grid;width:96px;padding:6px 6px 8px;background:#fff;border:2px solid var(--ink);border-radius:6px;box-shadow:3px 3px 0 var(--ink)}
.cz-paint:nth-child(odd){transform:rotate(-3deg)}.cz-paint:nth-child(even){transform:rotate(2.5deg)}
.cz-paint i{display:block;height:64px;border-radius:3px;background:var(--c)}
.cz-paint small{margin-top:6px;font-family:var(--hand);font-weight:700;font-size:.72rem;text-align:center}
.cz-quote{margin:0 auto clamp(50px,6vw,80px);max-width:760px;padding:26px 30px;background:#fff;border:3px solid var(--ink);border-radius:18px;box-shadow:6px 6px 0 var(--ink);transform:rotate(-.8deg)}
.cz-quote p{margin:0;font-family:var(--brush);font-size:clamp(1.4rem,2.2vw,1.8rem);line-height:1.3}
.cz-quote cite{display:block;margin-top:10px;font-family:var(--hand);font-style:normal;font-weight:800}
.cz-box{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
.cz-boxcard{padding:24px 26px;background:#fff;border:3px solid var(--ink);border-radius:6px;box-shadow:6px 6px 0 var(--ink);background-image:repeating-linear-gradient(transparent 0 37px,rgba(127,134,245,.18) 37px 38px);transform:rotate(-.6deg)}
.cz-boxcard ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.cz-boxcard li{display:flex;gap:10px;align-items:center;font-family:var(--hand);font-weight:700}
.cz-boxcard li::before{content:"";flex:none;width:20px;height:20px;border:2.5px solid var(--ink);border-radius:5px;background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M4 11.5c2 1.6 3.8 3.6 5.2 6C12 11 16 5.6 22 1.5' fill='none' stroke='%23171522' stroke-width='3.6' stroke-linecap='round'/%3E%3C/svg%3E") center/75% no-repeat}
.cz-next{display:grid;gap:14px}
.cz-nextcard{display:grid;grid-template-columns:92px minmax(0,1fr);gap:16px;align-items:center;padding:12px;background:#fff;border:0;box-shadow:0 2px 2px rgba(23,21,34,.08),0 18px 24px -14px rgba(23,21,34,.45);text-align:left;cursor:pointer;font:inherit;color:var(--ink);transform:rotate(1.2deg);transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.cz-nextcard:hover{transform:rotate(0) translateY(-4px)}
.cz-nextcard img{width:100%;aspect-ratio:2/3;object-fit:cover}
.cz-nextcard b{display:block;font-family:var(--hand);font-weight:800;font-size:1.25rem}
.cz-nextcard em{display:block;font-family:var(--brush);font-style:normal;font-size:1.1rem;color:#4a4858}
.cz-go{display:inline-flex;align-items:center;margin-top:8px;padding:.3em .8em;background:var(--yellow);border:2px solid var(--ink);border-radius:999px;font-family:var(--brush);font-size:1rem}
.cz-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:10px}
.cz-cta b{font-family:var(--brush);font-weight:400;font-size:1.3rem}
.cz-lb{position:fixed;inset:0;z-index:10000;display:none;place-items:center;padding:20px;background:rgba(23,21,34,.82);cursor:zoom-out}
.cz-lb.on{display:grid;animation:popFade .25s ease}
.cz-lb img{max-width:min(1200px,96vw);max-height:88vh;border:6px solid #fff;border-radius:6px;box-shadow:0 30px 60px rgba(0,0,0,.4);cursor:default}
.cz-lbx{position:absolute;right:18px;top:16px;width:46px;height:46px;border-radius:50%;border:2.5px solid var(--ink);background:#fff;font-size:1.8rem;line-height:1;cursor:pointer;box-shadow:3px 3px 0 var(--ink)}
@media (max-width:860px){.cz-hero,.cz-box{grid-template-columns:1fr}.cz-art{order:-1}.cz-notes{grid-template-columns:1fr;gap:28px}.cz-note.n2{transform:rotate(1deg)}.cz-gal,.cz-gal.n4{grid-template-columns:1fr}}
@media (max-width:480px){.cz-stamp{width:84px;height:84px;font-size:.6rem}.cz-stamp b{font-size:1.2rem}.cz-sh{gap:12px}.cz-no{width:46px;height:46px;font-size:1.1rem}.cz-paint{width:72px}.cz-paint i{height:48px}}

.cz,.cz-box,.cz-notes,.cz-hero{min-width:0}.cz-box>*,.cz-hero>*{min-width:0}.cz-boxcard li{min-width:0;overflow-wrap:anywhere}@media (max-width:480px){.cz-boxcard{padding:18px 14px}.cz-nextcard{grid-template-columns:70px minmax(0,1fr)}}
.cz-sh>div{min-width:0}.cz-sh h2{overflow-wrap:break-word}@media (max-width:380px){.cz-sh h2{font-size:1.55rem}}
#view-case{overflow-x:clip}

/* write with a pen on the forms, normal cursor on buttons */
#funForm,#funForm *,#pop .pop-card,#pop .pop-card *{cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2244%22%20height%3D%2244%22%20viewBox%3D%220%200%2044%2044%22%3E%3Cg%20stroke%3D%22%23171522%22%20stroke-width%3D%222.2%22%20stroke-linejoin%3D%22round%22%20stroke-linecap%3D%22round%22%3E%3Cpath%20d%3D%22M10%2029L31%208l5%205-21%2021z%22%20fill%3D%22%232F6BFF%22/%3E%3Cpath%20d%3D%22M27%2012l4-4%205%205-4%204z%22%20fill%3D%22%231D4FD6%22/%3E%3Cpath%20d%3D%22M31%208l3-3a2.8%202.8%200%200%201%204%200l1%201a2.8%202.8%200%200%201%200%204l-3%203z%22%20fill%3D%22%231A3A99%22/%3E%3Cpath%20d%3D%22M10%2029l5%205-9.5%204.2a1.2%201.2%200%200%201-1.6-1.6z%22%20fill%3D%22%23E9F0FF%22/%3E%3Cpath%20d%3D%22M4.4%2039.6l2-4.6%202.6%202.6z%22%20fill%3D%22%232F6BFF%22/%3E%3C/g%3E%3Cpath%20d%3D%22M14%2027L30%2011%22%20stroke%3D%22%23fff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.55%22/%3E%3C/svg%3E") 4 40,text}
#funForm button,#funForm button *,#funForm a,#funForm a *,#funForm .chip,#funForm .chip *,#funForm .pinky,#funForm .pinky *,#pop .pop-card button,#pop .pop-card button *,#pop .pop-card a,#pop .pop-card a *,#pop .pop-g label,#pop .pop-g label *{cursor:pointer}

#pop.opening .pop-card{animation:none!important}
#pop.closing .pop-card{animation:none!important}
.toss-bin,.toss-ball{position:fixed;z-index:6;pointer-events:none}
.toss-bin svg,.toss-ball svg{display:block;width:100%;height:auto;overflow:visible}
.toss-ball{z-index:7;filter:drop-shadow(3px 4px 0 rgba(23,21,34,.35))}

/* ===== case files v2: book covers, phones, live link ===== */
.cz-gal.f-book{grid-template-columns:repeat(4,minmax(0,1fr))!important;max-width:1040px;margin:0 auto;gap:clamp(16px,2.6vw,34px)}
.cz-gal.f-book .cz-fig:first-child{grid-column:auto}
.f-book .cz-zoom{position:relative;border-radius:3px 9px 9px 3px;overflow:hidden;background:#111;box-shadow:7px 8px 0 var(--ink)}
.f-book .cz-zoom::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(90deg,rgba(0,0,0,.45) 0,rgba(255,255,255,.22) 2.5%,rgba(0,0,0,.18) 5%,transparent 11%)}
.f-book .cz-zoom img{aspect-ratio:5/8;object-fit:cover;background:#111}
@media (max-width:760px){.cz-gal.f-book{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.f-web .cz-zoom img{aspect-ratio:16/10;object-position:top}
.cz-phones{display:flex;justify-content:center;align-items:flex-start;gap:clamp(12px,4vw,48px);margin-top:clamp(28px,4vw,48px)}
.cz-ph{flex:0 1 220px;min-width:0}
.cz-ph .cz-zoom{padding:7px;border:3px solid var(--ink);border-radius:30px;background:var(--ink);box-shadow:6px 6px 0 rgba(23,21,34,.25)}
.cz-ph .cz-zoom img{aspect-ratio:390/844;border-radius:23px;object-fit:cover;object-position:top}
.cz-ph:nth-child(2){margin-top:28px}
@media (max-width:520px){.cz-ph .cz-zoom{padding:4px;border-radius:18px;border-width:2px}.cz-ph .cz-zoom img{border-radius:14px}.cz-ph figcaption{font-size:.95rem}.cz-ph:nth-child(2){margin-top:16px}}
.cz-live{display:inline-flex;align-items:center;gap:8px;margin-top:10px;font-family:var(--hand);font-weight:700;color:var(--ink);text-decoration:underline;text-decoration-color:var(--red);text-decoration-thickness:3px;text-underline-offset:4px}
.cz-live:hover{color:var(--red)}
.cz-lb.tall{display:none;overflow-y:auto;place-items:start center;padding:70px 12px 30px}
.cz-lb.tall.on{display:grid}
.cz-lb.tall img{max-height:none;width:min(1100px,94vw);height:auto}
@media (max-width:520px){.cz-sh h2{overflow-wrap:normal;word-break:normal;hyphens:none;font-size:1.45rem}.cz-chips2{gap:10px}.cz-paint{width:62px;padding:4px 4px 6px}.cz-paint i{height:42px}.cz-paint small{font-size:.62rem}}
.cz-live{white-space:nowrap}
@media (max-width:520px){.cz-sh{flex-direction:column;gap:8px}.cz-sh h2{font-size:clamp(1.25rem,6.6vw,1.5rem)}}
@media (max-width:360px){.cz-chips2{gap:7px}.cz-paint{width:54px}.cz-paint i{height:38px}.cz-paint small{font-size:.56rem}}
@media (max-width:360px){.cz-chips2{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.cz-paint{width:auto;min-width:0}}
.sc-photo.is-ph img{object-position:50% 30%}

/* ===== support the author strip ===== */
.cz-buy{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(12px,2vw,22px);align-items:center;max-width:860px;margin:clamp(34px,5vw,56px) auto;padding:14px clamp(14px,2.4vw,22px);background:#FFF8E6;border:2.5px dashed var(--ink);border-radius:14px;transform:rotate(-.4deg)}
.cz-buy-heart{display:grid;justify-items:center;gap:2px;width:64px}
.cz-buy-heart svg{width:38px;height:auto;animation:czBeat 2.4s ease-in-out infinite}
.cz-buy-heart small{font-family:var(--hand);font-weight:800;font-size:.68rem;line-height:1;text-transform:uppercase;letter-spacing:.04em;color:var(--red);text-align:center}
@keyframes czBeat{0%,60%,100%{transform:scale(1)}68%{transform:scale(1.18)}76%{transform:scale(.96)}84%{transform:scale(1.1)}}
.cz-buy-txt b{display:block;font-family:var(--hand);font-weight:800;font-size:clamp(1rem,1.6vw,1.12rem);line-height:1.2}
.cz-buy-txt p{margin:3px 0 0;font-family:var(--hand);font-weight:500;font-size:.92rem;line-height:1.4;color:#4a4858}
.cz-buy-btn{display:grid;justify-items:center;padding:9px 16px 7px;background:var(--yellow);color:var(--ink);border:2.5px solid var(--ink);border-radius:999px;box-shadow:3px 3px 0 var(--ink);font-family:var(--hand);font-weight:800;font-size:.98rem;line-height:1.1;text-decoration:none;white-space:nowrap;cursor:pointer;transition:transform .2s,box-shadow .2s}
.cz-buy-btn small{font-weight:700;font-size:.7rem;opacity:.75}
.cz-buy-btn:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}
@media (max-width:620px){.cz-buy{grid-template-columns:auto minmax(0,1fr);row-gap:12px}.cz-buy-btn{grid-column:1/-1;justify-self:start;margin-left:calc(64px + clamp(12px,2vw,22px))}}
@media (max-width:380px){.cz-buy{grid-template-columns:1fr;text-align:center;justify-items:center}.cz-buy-btn{margin-left:0;justify-self:center}}
@media (prefers-reduced-motion:reduce){.cz-buy-heart svg{animation:none}}
@media (max-width:620px){.cz-buy{padding:12px 14px;gap:10px 12px}.cz-buy-heart{width:46px}.cz-buy-heart svg{width:30px}.cz-buy-heart small{font-size:.58rem}.cz-buy-txt p{font-size:.86rem}.cz-buy-btn{margin-left:58px;padding:7px 14px 6px;font-size:.92rem}}
@media (max-width:380px){.cz-buy-btn{margin-left:0}}

/* ===== reviews from Bark ===== */
.rvz{padding:clamp(48px,6vw,96px) max(var(--gut),calc(var(--ml,40px) + 20px))}
.rvz-head{display:grid;justify-items:center;text-align:center;gap:10px;max-width:900px;margin:0 auto clamp(34px,4.5vw,56px)}
.rvz-chip{font-family:var(--brush);font-size:clamp(1.15rem,1.4vw,1.35rem);background:var(--white,#fff);border:2.5px solid var(--ink);border-radius:999px;padding:.25em .9em .15em;box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg)}
.rvz-head h2{font-family:var(--hand);font-weight:800;font-size:clamp(2.1rem,4vw,4rem);line-height:1.15;letter-spacing:-.015em;margin:0;text-wrap:balance}
.rvz-head p{margin:0;font-size:clamp(1.02rem,1.25vw,1.2rem);line-height:1.6;font-weight:500;max-width:40em;text-wrap:pretty}
.rvz-score{display:inline-flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:6px 12px;margin-top:6px;padding:8px 18px;background:var(--yellow);border:2.5px solid var(--ink);border-radius:14px;box-shadow:4px 4px 0 var(--ink);transform:rotate(1deg)}
.rvz-score b{font-family:var(--hand);font-weight:800;font-size:1.6rem;line-height:1}
.rvz-stars{color:var(--red);font-size:1.25rem;letter-spacing:2px;-webkit-text-stroke:1px var(--ink)}
.rvz-score small{font-family:var(--hand);font-weight:700;font-size:.95rem}
.rvz-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.8vw,36px);max-width:1120px;margin:0 auto;align-items:start}
.rvz-card{position:relative;margin:0;padding:26px 22px 20px;border-radius:2px 2px 18px 2px;background:#FFF3A8;box-shadow:0 16px 22px -14px rgba(23,21,34,.5);transform:rotate(-1.4deg);min-width:0}
.rvz-card.r2{background:#FFD7DE;transform:rotate(1.1deg) translateY(16px)}
.rvz-card.r3{background:#DDF5C4;transform:rotate(-.7deg)}
.rvz-card::before{content:"";position:absolute;left:50%;top:-12px;width:84px;height:24px;transform:translateX(-50%) rotate(-3deg);background:rgba(255,255,255,.65)}
.rvz-s{display:block;color:var(--red);font-size:1.15rem;letter-spacing:2px;-webkit-text-stroke:.8px var(--ink);margin-bottom:8px}
.rvz-card blockquote{margin:0;font-family:var(--hand);font-weight:500;font-size:1.02rem;line-height:1.55;overflow-wrap:anywhere}
.rvz-card blockquote::before{content:"\201C"}.rvz-card blockquote::after{content:"\201D"}
.rvz-card figcaption{display:grid;gap:2px;margin-top:14px;padding-top:12px;border-top:2px dashed rgba(23,21,34,.3)}
.rvz-card figcaption b{font-family:var(--brush);font-weight:400;font-size:1.35rem;color:var(--ink)}
.rvz-card figcaption small{font-family:var(--hand);font-weight:700;font-size:.82rem;opacity:.7}
.rvz-cta{display:flex;justify-content:center;margin-top:clamp(40px,5vw,60px)}
.rvz-cta .zbtn i{font-style:normal}
@media (max-width:860px){.rvz-grid{grid-template-columns:1fr;max-width:560px;gap:28px}.rvz-card.r2{transform:rotate(1deg)}}
.rvz-cta .zbtn{white-space:nowrap}
@media (max-width:420px){.rvz-cta .zbtn{font-size:.95rem;padding-left:18px;padding-right:18px}}
@media (max-width:340px){.rvz-cta .zbtn{font-size:.85rem;padding-left:14px;padding-right:14px}}
@media (max-width:620px){.rvz{padding-left:14px;padding-right:14px}}

/* ===== one font family, one icon style ===== */
:root{--f-body:"Shantell Sans","Kalam","Comic Sans MS",cursive}
.dk-screen,.dk-screen *{font-family:"Nunito","Avenir Next","Segoe UI",system-ui,sans-serif}
.plate .pl-nick,.lp-bot,.lp-c1,.lp-c2{font-family:"Nunito",sans-serif!important}
:root{--istar:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 3l4.6 11.2L37 15.6l-9.4 8 2.9 12.2L20 29.4 9.5 35.8l2.9-12.2-9.4-8 12.4-1.4z'/%3E%3C/svg%3E");--ichk:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M3.5 11.5c2 1.6 3.8 3.6 5.2 6C11.5 11 15.5 5.6 21 2' fill='none' stroke='%23000' stroke-width='3.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.zi{display:inline-block;width:1em;height:1em;background:currentColor;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat;vertical-align:-.13em;font-style:normal}
.zi-star{--i:var(--istar)}
.zi-chk{--i:var(--ichk);width:1.05em}
.zi-down{--i:var(--har);width:1.15em;height:.75em;transform:rotate(90deg);margin-left:.25em;vertical-align:-.05em}
.nt-star .zi{width:1em;height:1em}
.zs{display:inline-block;width:1.25em;height:1.25em;fill:var(--yellow);stroke:var(--ink);stroke-width:3;stroke-linejoin:round;vertical-align:middle}
.zs.off{fill:#fff}
.rvz-stars,.rvz-s{display:inline-flex;gap:3px;-webkit-text-stroke:0;letter-spacing:0}
.rvz-score .zs{width:1.3em;height:1.3em}
.rvz-s{margin-bottom:10px}.rvz-s .zs{width:1.2em;height:1.2em}
.rvz-score .zs{fill:#fff}
.rvz-card .zs{fill:var(--yellow)}
.cz-buy-btn>span{display:inline-flex;align-items:center}
.cz-buy-btn .har{width:1em;margin-left:.3em}
.ask-perks li::before,.np-list li.star::after{content:""!important;-webkit-text-stroke:0!important;display:inline-block;width:1em;height:1em;background:var(--yellow);-webkit-mask:var(--istar) center/contain no-repeat;mask:var(--istar) center/contain no-repeat}
.ask-perks li::before{width:1.3rem;height:1.3rem}
.np-list li.star::after{background:var(--red)}
.zsi{display:inline-block;width:.95em;height:.95em;fill:currentColor;vertical-align:-.12em;margin-right:.1em}

/* ===== socials: wide banner + post grid ===== */
.s-social .cz-gal.f-pola{grid-template-columns:repeat(3,minmax(0,1fr))!important;max-width:980px;margin:0 auto}
.s-social .cz-gal.f-pola .cz-fig:first-child{grid-column:auto}
.s-social .cz-gal.f-pola .cz-fig.wide{grid-column:1/-1}
.s-social .f-pola .cz-zoom{background:#fff;padding:8px 8px 0;box-shadow:0 2px 2px rgba(23,21,34,.08),0 18px 24px -14px rgba(23,21,34,.45)}
.s-social .f-pola .cz-zoom img{aspect-ratio:3/4;object-fit:cover;object-position:top}
.s-social .f-pola .wide .cz-zoom img{aspect-ratio:auto}
.s-social .f-pola .cz-zoom{padding-bottom:8px}
@media (max-width:620px){.s-social .cz-gal.f-pola{grid-template-columns:repeat(2,minmax(0,1fr))!important}.s-social .f-pola .cz-zoom{padding:5px}}



/* ===== keepsake letter v2: one smooth tri-fold, same motion both ways ===== */
.ks{--ez:cubic-bezier(.65,0,.35,1);position:relative;margin:clamp(30px,5vw,60px) auto clamp(50px,6vw,80px);max-width:1080px}
.ks-note{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 22px;font-family:var(--brush);font-size:clamp(1.25rem,1.8vw,1.55rem);color:var(--red);transform:rotate(-1.5deg)}
.ks-note .har{transform:rotate(90deg);width:1.2em}
.ks-letter{--kh:clamp(300px,38vw,420px);--k3:calc(var(--kh) / 3);position:relative;max-width:880px;margin:0 auto;padding-bottom:78px;color:var(--t-ink);transition:padding-bottom .45s ease 1.75s}
.ks-letter.open{padding-bottom:0;transition-delay:.15s}
.ks-fold{position:relative;height:var(--k3);padding-bottom:0;perspective:1300px;perspective-origin:50% 30%;cursor:pointer;border-radius:10px;box-shadow:0 26px 30px -20px rgba(23,21,34,.6);outline:none;
  transition:height .75s var(--ez) .55s,padding-bottom .75s var(--ez) 1.15s}
.ks-letter.open .ks-fold{height:calc(var(--k3) * 2);padding-bottom:var(--k3);cursor:default;transition:padding-bottom .75s var(--ez) .25s,height .75s var(--ez) .95s}
.ks-fold:focus-visible{box-shadow:0 0 0 3px var(--yellow),0 0 0 6px var(--ink)}
.ks-stack{position:absolute;left:0;right:0;top:0;height:var(--kh);transform:translateY(calc(var(--k3) * -1));transform-style:preserve-3d;transition:transform .75s var(--ez) .55s}
.ks-letter.open .ks-stack{transform:translateY(0);transition-delay:.95s}
.ks-p{position:absolute;left:0;right:0;height:var(--k3);transform-style:preserve-3d}
.ks-top{top:0;transform-origin:50% 100%;transform:rotateX(-180deg) translateZ(-1px);transition:transform .75s var(--ez) .55s}
.ks-mid{top:var(--k3)}
.ks-bot{top:calc(var(--k3) * 2);transform-origin:50% 0;transform:rotateX(180deg) translateZ(-2px);transition:transform .75s var(--ez) 1.15s}
.ks-letter.open .ks-top{transform:rotateX(0deg) translateZ(0);transition-delay:.95s}
.ks-letter.open .ks-bot{transform:rotateX(0deg) translateZ(0);transition-delay:.25s}
.ks-f,.ks-b{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;padding:10px clamp(16px,4vw,44px);overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--t-bg)}
.ks-b{transform:rotateX(180deg);background:linear-gradient(180deg,var(--t-bg2),var(--t-bg));border-radius:10px}
.ks-top .ks-f{border-radius:10px 10px 0 0;background:radial-gradient(130% 160% at 85% 0%,var(--t-bg2),var(--t-bg) 70%)}
.ks-mid .ks-f{background:linear-gradient(180deg,color-mix(in srgb,var(--t-bg2) 55%,var(--t-bg)),var(--t-bg) 18%,var(--t-bg) 82%,color-mix(in srgb,var(--t-bg2) 55%,var(--t-bg)))}
.ks-bot .ks-f{border-top:1px solid color-mix(in srgb,var(--t-ink) 10%,transparent)}
.ks-top .ks-f::after,.ks-mid .ks-f::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:color-mix(in srgb,var(--t-ink) 12%,transparent)}
.ks-hello{position:relative;z-index:1;font-family:var(--t-font);font-size:clamp(1.05rem,1.6vw,1.35rem);color:var(--t-acc2)}
.ks-name{position:relative;z-index:1;display:block;font-family:var(--t-font);font-weight:700;font-size:clamp(2.1rem,5.2vw,4.2rem);line-height:1.08;color:var(--t-ink)}
.ks-letter.it .ks-hello,.ks-letter.it .ks-name,.ks-letter.it .ks-vibe,.ks-letter.it .ks-for{font-style:italic}
.ks-letter.caps .ks-hello{letter-spacing:.14em;text-transform:uppercase;font-size:clamp(.78rem,1.15vw,.95rem);font-family:var(--t-body);font-weight:600}
.ks-letter.scr .ks-name{font-weight:400;font-size:clamp(2.7rem,6.4vw,5.2rem)}
.ks-letter.scr .ks-hello{font-size:clamp(1.45rem,2.3vw,1.95rem)}
.ks-vibe{margin:0;font-family:var(--t-font);font-size:clamp(1.3rem,2.6vw,2.1rem);line-height:1.22;color:var(--t-ink);text-wrap:balance;max-width:26em}
.ks-letter.scr .ks-vibe{font-size:clamp(1.9rem,3.6vw,2.9rem)}
.ks-letter.caps .ks-vibe{letter-spacing:.04em}
.ks-made{font-family:var(--t-body);font-weight:600;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--t-acc2)}
.ks-list{font-family:var(--t-body);font-weight:500;font-size:clamp(.95rem,1.4vw,1.08rem);color:var(--t-ink)}
.ks-for{font-family:var(--t-font);font-size:clamp(1.05rem,1.6vw,1.3rem);color:var(--t-ink);margin-bottom:4px}
.ks-letter.scr .ks-for{font-size:clamp(1.5rem,2.3vw,1.9rem)}
.ks-letter.caps .ks-for{font-family:var(--t-body);font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:clamp(.72rem,1.05vw,.86rem)}
.ks-seal{width:clamp(56px,7.5vw,76px);height:auto;filter:drop-shadow(0 3px 2px rgba(0,0,0,.3))}
.ks-keep,.ks-tape,.ks-open{transition:opacity .4s ease 1.9s,transform .5s cubic-bezier(.3,1.4,.5,1) 1.9s}
.ks-keep{position:absolute;z-index:5;right:7%;top:-42px;width:clamp(96px,13vw,146px);pointer-events:none;filter:drop-shadow(0 8px 6px rgba(23,21,34,.35))}
.ks-keep svg{display:block;width:100%;height:auto;transform:rotate(12deg)}
.ks-tape{position:absolute;z-index:6;top:-11px;left:6%;width:92px;height:26px;background:rgba(255,234,150,.85);box-shadow:0 1px 2px rgba(0,0,0,.12);transform:rotate(-22deg)}
.ks-open{position:absolute;left:50%;top:calc(var(--k3) + 18px);transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:.6em 1.3em;background:var(--yellow);color:var(--ink);border:2.5px solid var(--ink);border-radius:999px;box-shadow:4px 4px 0 var(--ink);font-family:var(--hand);font-weight:800;font-size:1.02rem;white-space:nowrap;cursor:pointer}
.ks-open::before{content:"";width:1.1em;height:1.1em;background:currentColor;-webkit-mask:var(--istar) center/contain no-repeat;mask:var(--istar) center/contain no-repeat}
.ks-open:hover{transform:translateX(-50%) translateY(-2px)}
.ks-letter.open .ks-keep{opacity:0;transform:translate(60px,-80px) rotate(24deg);transition:opacity .35s ease,transform .45s cubic-bezier(.5,0,.75,0)}
.ks-letter.open .ks-tape{opacity:0;transition:opacity .25s ease}
.ks-letter.open .ks-open{opacity:0;transform:translateX(-50%) scale(.9);pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.ks-seal{transition:opacity .3s ease 1.85s}
.ks-letter.open .ks-seal{opacity:0;transition-delay:.05s}
.ks-body{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .6s var(--ez) 0s,opacity .35s ease 0s}
.ks-letter.open .ks-body{grid-template-rows:1fr;opacity:1;transition:grid-template-rows 1s var(--ez) 1.6s,opacity .6s ease 1.7s}
.ks-bin{min-height:0;overflow:hidden}
.ks-pad{margin-top:-1px;padding:clamp(30px,4vw,56px) clamp(18px,4vw,52px) clamp(26px,3vw,40px);background:linear-gradient(180deg,var(--t-bg),var(--t-bg2));border-radius:0 0 10px 10px;box-shadow:0 26px 30px -20px rgba(23,21,34,.5)}
.ks-pad .cz-sec{margin-bottom:clamp(36px,5vw,60px)}
.ks-pad .cz-sh h2{font-family:var(--t-font);font-weight:700;color:var(--t-ink);letter-spacing:0;font-size:clamp(2rem,3.6vw,3rem)}
.ks-letter.it .ks-pad .cz-sh h2{font-style:italic}
.ks-letter.scr .ks-pad .cz-sh h2{font-weight:400;font-size:clamp(2.6rem,4.6vw,3.8rem)}
.ks-letter.caps .ks-pad .cz-sh h2{letter-spacing:.03em}
.ks-pad .cz-k{font-family:var(--t-font);font-size:clamp(1.15rem,1.7vw,1.4rem);color:var(--t-acc2)}
.ks-letter.it .ks-pad .cz-k{font-style:italic}
.ks-letter.scr .ks-pad .cz-k{font-size:clamp(1.5rem,2.2vw,1.85rem)}
.ks-letter.caps .ks-pad .cz-k{font-family:var(--t-body);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:.8rem}
.ks-pad .cz-sh p{font-family:var(--t-body);font-weight:500;font-size:clamp(1rem,1.25vw,1.1rem);line-height:1.65;color:var(--t-ink);opacity:.88}
.ks-pad .cz-no{background:var(--t-acc);color:var(--t-on);border:0;box-shadow:none;transform:none;font-family:var(--t-body);font-weight:600}
.ks-pad .cz-live{font-family:var(--t-body);font-weight:600;color:var(--t-ink);text-decoration-color:var(--t-acc2)}
.ks-pad .cz-live:hover{color:var(--t-acc2)}
.ks-pad .cz-fig figcaption{font-family:var(--t-body);font-weight:500;font-size:.95rem;color:var(--t-ink);opacity:.85}
.ks-pad .f-web .cz-zoom,.ks-pad .cz-ph .cz-zoom{border-color:color-mix(in srgb,var(--t-ink) 90%,transparent);box-shadow:0 18px 30px -16px rgba(0,0,0,.55)}
.ks-pad .cz-bar{border-color:color-mix(in srgb,var(--t-ink) 90%,transparent)}
.ks-pad .cz-paint{border:0;box-shadow:0 8px 14px -8px rgba(0,0,0,.45)}
.ks-pad .cz-paint small{font-family:var(--t-body);font-weight:600;color:#2a2733}
.ks-pad .f-book .cz-zoom{box-shadow:0 18px 26px -14px rgba(0,0,0,.65)}
.cz-div{display:flex;justify-content:center;margin:0 auto clamp(30px,4vw,48px);max-width:440px}
.cz-div svg{width:100%;height:auto;display:block}
.czm{position:absolute;z-index:0;pointer-events:none;opacity:.45}
.czm-tr{right:-6px;top:-4px;width:clamp(110px,22%,210px)}
.ks-end{text-align:center}
.ks-close{margin-top:-4px;padding:.55em 1.2em;background:transparent;color:var(--t-ink);border:1.5px solid color-mix(in srgb,var(--t-ink) 60%,transparent);border-radius:999px;font-family:var(--t-body);font-weight:600;font-size:.95rem;cursor:pointer}
.ks-close:hover{background:color-mix(in srgb,var(--t-ink) 8%,transparent)}
@media (max-width:620px){.ks-letter{--kh:330px}.ks-keep{right:2%;top:-34px;width:86px}.ks-note{padding-right:56px;font-size:1.15rem}.czm-tr{width:96px;opacity:.3}.ks-pad{padding:26px 14px 22px}.ks-for{max-width:78%;line-height:1.2}.ks-f,.ks-b{padding:8px 14px}}
@media (prefers-reduced-motion:reduce){.ks *,.ks-letter,.ks-letter *{transition:none!important}}
.ks-letter{z-index:2}
.ks-fold{box-sizing:content-box}
.ks-top .ks-f::before,.ks-bot .ks-f::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.38),rgba(0,0,0,.12));opacity:1}
.ks-top .ks-f::before{transition:opacity .75s var(--ez) .55s}
.ks-bot .ks-f::before{background:linear-gradient(0deg,rgba(0,0,0,.38),rgba(0,0,0,.12));transition:opacity .75s var(--ez) 1.15s}
.ks-letter.open .ks-top .ks-f::before{opacity:0;transition-delay:.95s}
.ks-letter.open .ks-bot .ks-f::before{opacity:0;transition-delay:.25s}
@media (max-width:620px){.ks-tape{left:-12px;top:-6px;width:58px;height:20px}.ks-keep{right:-6px;top:-62px;width:72px}.ks-note{padding-right:64px}.ks-for{max-width:70%}.ks-b{gap:6px}}
.cz-gal.f-book.n1{grid-template-columns:minmax(0,340px)!important;justify-content:center}
.cz-gal.f-book.n2{grid-template-columns:repeat(2,minmax(0,300px))!important;justify-content:center}
.f-book .cz-zoom img.nat{aspect-ratio:auto;object-fit:contain}
@media (min-width:621px){.s-social .cz-gal.f-pola.n4:not(:has(.wide)){grid-template-columns:repeat(4,minmax(0,1fr))!important}}

/* ===== hero: the author, not the book ===== */
.cz-photo img{aspect-ratio:4/5!important;object-fit:cover}
.cz-photo.fit img{object-fit:contain;background:#F6F1EC}
.cz-photo figcaption{position:absolute;left:0;right:0;bottom:8px;text-align:center;font-family:var(--brush);font-size:1.25rem;color:#3a3846}
/* ===== keepsake: a real piece of their world ===== */
.ks-keep{width:clamp(92px,12vw,138px)!important}
.ks-keep img{display:block;width:100%;height:auto;transform:rotate(9deg)}
.ks-keep .kk-book{border-radius:2px 6px 6px 2px;box-shadow:inset 6px 0 6px -4px rgba(0,0,0,.45),6px 10px 14px rgba(0,0,0,.35)}
.ks-keep .kk-card{padding:6px 6px 18px;background:#fff;box-shadow:0 10px 16px rgba(0,0,0,.3);transform:rotate(-7deg)}
.cz-div{display:flex;align-items:center;gap:14px;max-width:420px}
.cz-div::before,.cz-div::after{content:"";flex:1;height:1px;background:color-mix(in srgb,var(--t-ink) 35%,transparent)}
.cz-div span{font-family:var(--t-font);font-size:1.1rem;letter-spacing:.2em;color:var(--t-acc2)}
/* ===== presentation blocks ===== */
.ks-pad .cz-zoom{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.ks-pad .cz-zoom img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:fill}
.bk-pal{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:22px}
.bk-pal span{display:grid;justify-items:center;gap:6px}
.bk-pal i{width:52px;height:52px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px var(--t-bg),0 0 0 4px color-mix(in srgb,var(--t-ink) 35%,transparent)}
.bk-pal small{font-family:var(--t-body);font-size:.72rem;font-weight:600;color:var(--t-ink);opacity:.75}
/* shelf */
.bk-shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(110px,15vw,150px),1fr));gap:34px 18px;padding:10px 6px 0}
.bk-book{position:relative;margin:0;padding-bottom:22px}
.bk-book::after{content:"";position:absolute;left:-18px;right:-18px;bottom:0;height:14px;background:linear-gradient(180deg,color-mix(in srgb,var(--t-acc) 55%,#000),color-mix(in srgb,var(--t-acc) 30%,#000));box-shadow:0 10px 14px -6px rgba(0,0,0,.6)}
.bk-book .cz-zoom{transform-origin:50% 100%;transition:transform .35s cubic-bezier(.3,1.5,.5,1)}
.bk-book .cz-zoom img{aspect-ratio:2/3;object-fit:cover;border-radius:2px 5px 5px 2px;box-shadow:inset 8px 0 8px -6px rgba(0,0,0,.5),0 10px 16px -6px rgba(0,0,0,.6)}
.bk-book:hover .cz-zoom{transform:translateY(-12px) rotate(-2deg)}
.bk-book figcaption{position:absolute;left:0;right:0;bottom:-26px;text-align:center;font-family:var(--t-body);font-size:.8rem;color:var(--t-ink);opacity:0;transition:opacity .2s}
.bk-book:hover figcaption{opacity:.85}
/* fan */
.bk-fan{position:relative;height:clamp(300px,36vw,430px);margin:10px auto 30px;max-width:760px}
.bk-card{position:absolute;left:50%;bottom:0;width:clamp(150px,20vw,230px);margin:0 0 0 calc(clamp(150px,20vw,230px) / -2);transform-origin:50% 120%;transform:translateX(calc(var(--o) * clamp(60px,9vw,120px))) rotate(calc(var(--o) * 9deg));transition:transform .45s cubic-bezier(.3,1.3,.5,1);z-index:calc(10 - var(--i))}
.bk-card .cz-zoom img{aspect-ratio:2/3;object-fit:cover;border-radius:4px;box-shadow:0 18px 26px -10px rgba(0,0,0,.6)}
.bk-fan:hover .bk-card{transform:translateX(calc(var(--o) * clamp(90px,13vw,170px))) rotate(calc(var(--o) * 12deg))}
.bk-card:hover{z-index:20!important}
.bk-card:hover .cz-zoom{transform:translateY(-18px)}
.bk-card .cz-zoom{transition:transform .3s}
.bk-card figcaption{text-align:center;margin-top:8px;font-family:var(--t-body);font-size:.85rem;color:var(--t-ink);opacity:0;transition:opacity .2s}
.bk-card:hover figcaption{opacity:.9}
/* spotlight */
.bk-spot{display:flex;justify-content:center;gap:clamp(26px,6vw,80px);padding:20px 0 10px;perspective:1400px}
.bk-3d{margin:0;width:min(330px,70%)}
.bk-spot.n2 .bk-3d{width:min(280px,44%)}
.bk-3d .cz-zoom{transform:rotateY(-18deg) rotateX(4deg);transform-style:preserve-3d;transition:transform .6s cubic-bezier(.3,1,.4,1)}
.bk-3d:nth-child(2) .cz-zoom{transform:rotateY(18deg) rotateX(4deg)}
.bk-3d .cz-zoom:hover{transform:rotateY(0) rotateX(0) translateY(-6px)}
.bk-3d .cz-zoom img{border-radius:3px 6px 6px 3px;box-shadow:inset 10px 0 10px -8px rgba(0,0,0,.55),26px 30px 40px -18px rgba(0,0,0,.7)}
.bk-3d figcaption{text-align:center;margin-top:16px;font-family:var(--t-font);font-size:1.3rem;color:var(--t-ink)}
/* stage */
.bk-stage{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:18px;align-items:center}
.bk-main .cz-zoom img,.bk-side .cz-zoom img{border-radius:10px;box-shadow:0 22px 34px -18px rgba(0,0,0,.6)}
.bk-side{display:grid;gap:18px}
.bk-stage figure{margin:0}.bk-stage figcaption{margin-top:8px;font-family:var(--t-body);font-size:.85rem;color:var(--t-ink);opacity:.8}
/* brand board */
.bk-brand{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-areas:"m m m v0" "m m m v1" "p p t t";gap:12px}
.bk-brand figure{margin:0;position:relative;overflow:hidden;border-radius:10px}
.bb-main{grid-area:m}.bb-v.v0{grid-area:v0}.bb-v.v1{grid-area:v1}
.bk-brand .cz-zoom,.bk-brand .cz-zoom img{height:100%}.bk-brand .cz-zoom img{object-fit:cover}
.bb-v figcaption{position:absolute;left:8px;bottom:6px;font-family:var(--t-body);font-size:.7rem;font-weight:600;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.bb-pal{grid-area:p;display:flex;border-radius:10px;overflow:hidden;min-height:110px}
.bb-pal span{flex:1;background:var(--c);display:flex;align-items:flex-end;padding:8px}
.bb-pal small{font-family:var(--t-body);font-size:.68rem;font-weight:600;background:rgba(255,255,255,.85);color:#222;padding:2px 5px;border-radius:4px}
.bb-type{grid-area:t;display:grid;align-content:center;padding:16px 18px;border-radius:10px;background:color-mix(in srgb,var(--t-ink) 8%,transparent);color:var(--t-ink)}
.bb-type small{font-family:var(--t-body);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;opacity:.7}
.bb-type b{font-family:var(--t-font);font-weight:700;font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.1}
.bb-type span{font-family:var(--t-body);font-size:.9rem;opacity:.8}
/* deck */
.bk-wide{margin:0 0 30px}.bk-wide .cz-zoom img{border-radius:8px;box-shadow:0 22px 34px -18px rgba(0,0,0,.6)}
.bk-wide figcaption{text-align:center;margin-top:8px;font-family:var(--t-body);font-size:.85rem;color:var(--t-ink);opacity:.8}
.bk-deck{display:grid;justify-items:center;gap:18px;touch-action:pan-y}
.bk-cards{position:relative;width:min(340px,78vw);aspect-ratio:4/5.6}
.bk-dc{position:absolute;inset:0;margin:0;transition:transform .5s cubic-bezier(.3,1.2,.5,1),opacity .4s;transform:translate(calc(min(var(--o),3) * 16px),calc(min(var(--o),3) * 10px)) rotate(calc(min(var(--o),3) * 3deg)) scale(calc(1 - min(var(--o),3) * .04));opacity:calc(1 - min(var(--o),4) * .22)}
.bk-dc .cz-zoom img{border-radius:6px;box-shadow:0 18px 30px -12px rgba(0,0,0,.6)}
.bk-dc figcaption{text-align:center;margin-top:10px;font-family:var(--t-body);font-size:.9rem;color:var(--t-ink);opacity:0;transition:opacity .3s}
.bk-dc.top figcaption{opacity:.9}
.bk-ctl{display:flex;align-items:center;gap:14px;margin-top:34px}
.bk-ctl button{padding:.45em 1.1em;border-radius:999px;border:1.5px solid color-mix(in srgb,var(--t-ink) 55%,transparent);background:transparent;color:var(--t-ink);font-family:var(--t-body);font-weight:600;cursor:pointer}
.bk-ctl button:hover{background:var(--t-acc);color:var(--t-on);border-color:var(--t-acc)}
.bk-count{font-family:var(--t-body);color:var(--t-ink);opacity:.8;min-width:56px;text-align:center}
/* feed: a phone with their real grid */
.bk-feedwrap{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,4vw,50px);align-items:center;justify-content:center}
.bk-feed{width:290px;padding:10px;border-radius:36px;background:#111;box-shadow:0 30px 50px -20px rgba(0,0,0,.6)}
.bf-top{display:flex;align-items:center;gap:10px;padding:14px 12px 10px;background:#fff;border-radius:28px 28px 0 0}
.bf-top img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.bf-top b{display:block;font:600 .82rem/1.1 system-ui,sans-serif;color:#111}.bf-top span{font:400 .72rem system-ui,sans-serif;color:#666}
.bf-scroll{height:420px;overflow:hidden;background:#fff;border-radius:0 0 28px 28px}
.bf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.bf-grid .cz-zoom img{aspect-ratio:3/4;object-fit:cover}
.bf-scroll.go .bf-grid{animation:bfRoll 26s linear infinite}
.bf-scroll.go:hover .bf-grid{animation-play-state:paused}
@keyframes bfRoll{to{transform:translateY(-50%)}}
.bk-feednotes{list-style:none;margin:0;padding:0;display:grid;gap:8px;max-width:300px}
.bk-feednotes li{font-family:var(--t-body);font-size:.95rem;color:var(--t-ink);padding-left:16px;border-left:2px solid var(--t-acc)}
/* strip */
.bk-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 16px}
.bk-strip figure{margin:0;scroll-snap-align:start}
.bk-strip .cz-zoom{padding:6px;border-radius:22px;background:#111}
.bk-strip .cz-zoom img{aspect-ratio:9/14;object-fit:cover;border-radius:16px}
.bk-strip figcaption{text-align:center;margin-top:8px;font-family:var(--t-body);font-size:.85rem;color:var(--t-ink);opacity:.85}
/* browser: their site, live-ish */
.bk-laptop{max-width:820px;margin:0 auto}
.bk-screen{border-radius:14px 14px 0 0;background:#1a1a1a;padding:10px 10px 0}
.bk-bar{display:flex;align-items:center;gap:6px;height:26px;padding:0 10px;background:#f2f2f2;border-radius:8px 8px 0 0}
.bk-bar i{width:9px;height:9px;border-radius:50%;background:#d0d0d0}
.bk-bar span{margin-left:10px;font:500 .72rem system-ui,sans-serif;color:#555;background:#fff;padding:2px 10px;border-radius:6px}
.bk-view{position:relative;aspect-ratio:16/10;overflow:hidden;background:#fff;cursor:zoom-in}
.bk-shot{display:block;width:100%;height:auto}
.bk-shot.roll{animation:bkRoll var(--t,14s) ease-in-out 1s infinite alternate}
.bk-view:hover .bk-shot{animation-play-state:paused}
@keyframes bkRoll{0%,8%{transform:translateY(0)}92%,100%{transform:translateY(var(--d))}}
.bk-base{height:16px;margin:0 -5%;border-radius:0 0 18px 18px;background:linear-gradient(#cfcfd4,#9a9aa2);box-shadow:0 20px 30px -14px rgba(0,0,0,.6)}
.bk-tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:22px 0 6px}
.bk-tabs button{display:grid;gap:4px;width:120px;padding:4px;border-radius:8px;border:1.5px solid transparent;background:color-mix(in srgb,var(--t-ink) 8%,transparent);cursor:pointer}
.bk-tabs button.on{border-color:var(--t-acc)}
.bk-tabs img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:5px}
.bk-tabs span{font-family:var(--t-body);font-size:.72rem;font-weight:600;color:var(--t-ink)}
.bk-phones{display:flex;justify-content:center;gap:clamp(12px,3vw,34px);margin-top:26px}
.bk-phones figure{margin:0;width:min(180px,30%)}
.bk-phones figure:nth-child(2){transform:translateY(-16px)}
.bk-phone{padding:6px!important;border-radius:26px!important;background:#111!important}
.bk-phone img{aspect-ratio:390/844;object-fit:cover;object-position:top;border-radius:20px}
.bk-phones figcaption{text-align:center;margin-top:8px;font-family:var(--t-body);font-size:.8rem;color:var(--t-ink);opacity:.8}
@media (max-width:720px){
 .bk-stage{grid-template-columns:1fr}.bk-side{grid-template-columns:1fr 1fr}
 .bk-brand{grid-template-columns:1fr 1fr;grid-template-areas:"m m" "v0 v1" "p p" "t t"}
 .bk-feedwrap{grid-template-columns:1fr;justify-items:center}.bk-feed{width:min(280px,86vw)}.bf-scroll{height:380px}
 .bk-fan{height:auto;display:grid;grid-auto-flow:column;grid-auto-columns:62%;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px}
 .bk-card{position:static;width:auto;margin:0;transform:none!important;scroll-snap-align:center}.bk-card figcaption{opacity:.85}
 .bk-spot.n2{gap:16px}.bk-spot.n2 .bk-3d{width:46%}
 .bk-3d .cz-zoom{transform:none!important}
 .bk-strip{grid-auto-columns:62%}
 .bk-tabs button{width:calc(50% - 6px)}
 .bk-shelf{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){.bk-shot.roll,.bf-scroll.go .bf-grid{animation:none}}
.bk-shelf{grid-template-columns:repeat(var(--c),minmax(0,150px));justify-content:center}
.bk-card{transform:translateX(calc(var(--o) * var(--sp))) rotate(calc(var(--o) * var(--rot)))}
.bk-fan:hover .bk-card{transform:translateX(calc(var(--o) * var(--sp) * 1.35)) rotate(calc(var(--o) * var(--rot) * 1.3))}
.bk-fan{overflow:visible}
@media (max-width:720px){.bk-shelf{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bk-fan{contain:layout}

/* ===== brand board: never crop a logo ===== */
.bk-brand{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-areas:"m m" "v0 v1" "p t"!important}
.bk-brand figure{overflow:visible}
.bk-brand .cz-zoom,.bk-brand .cz-zoom img{height:auto!important}
.bk-brand .cz-zoom img{object-fit:contain!important;border-radius:10px}
.bb-v figcaption{position:static;margin-top:6px;color:var(--t-ink);text-shadow:none;opacity:.8}
.bb-pal{min-height:90px}
@media (max-width:520px){.bk-brand{grid-template-areas:"m m" "v0 v1" "p p" "t t"!important}}
.bk-stage .cz-zoom img,.bk-tabs img{object-fit:contain}
.bk-tabs img{object-fit:cover}
/* ===== reveal: one cover, full flex ===== */
.bk-reveal{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(24px,5vw,60px);align-items:center;padding:clamp(10px,3vw,30px) 0 clamp(30px,4vw,50px)}
.rv-glow{position:absolute;left:8%;top:6%;width:44%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--t-acc) 55%,transparent),transparent 65%);filter:blur(30px);pointer-events:none}
.rv-front{position:relative;margin:0;justify-self:center;width:min(380px,100%);perspective:1400px}
.rv-front .cz-zoom{transform:rotateY(-14deg) rotateX(3deg);transition:transform .7s cubic-bezier(.3,1,.4,1)}
.rv-front .cz-zoom:hover{transform:none}
.rv-front .cz-zoom img{border-radius:3px 6px 6px 3px;box-shadow:inset 12px 0 12px -10px rgba(0,0,0,.6),30px 34px 50px -20px rgba(0,0,0,.75)}
.rv-side{color:var(--t-ink)}
.rv-k{font-family:var(--t-body);font-size:.75rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--t-acc2)}
.rv-side b{display:block;margin:6px 0 14px;font-family:var(--t-font);font-weight:700;font-size:clamp(2rem,4.6vw,3.4rem);line-height:1}
.rv-side ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.rv-side li{font-family:var(--t-body);font-size:.98rem;padding-left:18px;position:relative}
.rv-side li::before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--t-acc)}
.rv-wrap{margin-top:10px}
@media (max-width:720px){.bk-reveal{grid-template-columns:1fr;text-align:center}.rv-side ul{justify-items:center}.rv-side li{padding-left:0}.rv-side li::before{display:none}.rv-front .cz-zoom{transform:none}.rv-front{width:min(300px,80%)}}
/* ===== instagram grid ===== */
.bk-igwrap{display:grid;justify-items:center;gap:16px}
.bk-ig{width:min(460px,100%);background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 26px 40px -20px rgba(0,0,0,.45)}
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.ig-grid .cz-zoom img{aspect-ratio:3/4;object-fit:cover!important}
.ig-note{margin:0;max-width:440px;text-align:center;font-family:var(--t-body);font-size:.95rem;color:var(--t-ink);opacity:.85}
/* ===== spinner rack ===== */
.bk-rack{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 18px;padding:24px 18px 30px;border-radius:14px;background:repeating-linear-gradient(180deg,transparent 0 calc(50% - 6px),color-mix(in srgb,var(--t-acc) 70%,#000) calc(50% - 6px) 50%),color-mix(in srgb,var(--t-bg2) 70%,#000)}
.rk{margin:0;transform:rotate(calc((var(--i) - 3.5) * .6deg))}
.rk .cz-zoom{padding:6px;background:#F4E9D2;box-shadow:0 14px 22px -10px rgba(0,0,0,.7);transition:transform .25s}
.rk:hover .cz-zoom{transform:translateY(-8px) rotate(-2deg)}
.rk .cz-zoom img{aspect-ratio:2/3;object-fit:cover!important}
.rk figcaption{margin-top:8px;text-align:center;font-family:var(--t-body);font-size:.8rem;font-weight:600;color:var(--t-ink);text-transform:uppercase;letter-spacing:.04em}
@media (max-width:720px){.bk-rack{grid-template-columns:repeat(2,minmax(0,1fr));background:color-mix(in srgb,var(--t-bg2) 70%,#000)}}

/* ===== the author wall: polaroids pegged on a string ===== */
.aw{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(34px,4vw,54px) 0;max-width:1180px;margin:0 auto;padding-top:6px}
.aw-p{position:relative;display:block;text-decoration:none;color:var(--ink);padding:clamp(26px,2.6vw,34px) clamp(8px,1.2vw,16px) 0}
.aw-p::before{content:"";position:absolute;left:0;right:0;top:0;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 22' preserveAspectRatio='none'%3E%3Cpath d='M0 3Q50 19 100 3' fill='none' stroke='%23171522' stroke-width='2.4' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat;pointer-events:none}
.aw-card{display:block;background:#fff;border:2px solid var(--ink);border-radius:4px;padding:7px 7px 0;box-shadow:4px 6px 0 rgba(23,21,34,.85);transform:rotate(var(--r));transform-origin:50% -18px;transition:transform .5s cubic-bezier(.3,1.6,.5,1)}
.aw-p:hover .aw-card,.aw-p:focus-visible .aw-card{transform:rotate(calc(var(--r) * -1.4)) translateY(-3px)}
.aw-card img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border:1.5px solid var(--ink);border-radius:2px;background:#eee}
.aw-card b{display:block;font-family:var(--brush);font-weight:400;font-size:clamp(1.05rem,1.3vw,1.3rem);line-height:1.1;text-align:center;padding:8px 2px 2px}
.aw-card small{display:block;text-align:center;font-family:var(--f-body);font-size:.72rem;opacity:.7;padding-bottom:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aw-peg{position:absolute;left:50%;top:clamp(10px,1.2vw,14px);width:14px;height:30px;margin-left:-7px;z-index:2;border:2px solid var(--ink);border-radius:3px;background:var(--pc,#FFD93D);transform:rotate(calc(var(--r) * .5))}
.aw-peg::after{content:"";position:absolute;left:50%;top:9px;width:6px;height:6px;margin-left:-3px;border-radius:50%;border:1.5px solid var(--ink);background:#fff}
@media (prefers-reduced-motion:no-preference){html.rv-on .aw[data-rv]{opacity:1;translate:none}html.rv-on .aw .aw-card{opacity:0;transform:rotate(calc(var(--r) * 6)) translateY(-20px);transition:opacity .4s ease var(--d),transform .9s cubic-bezier(.3,1.7,.45,1) var(--d)}html.rv-on .aw.in .aw-card{opacity:1;transform:rotate(var(--r))}html.rv-on .aw.in .aw-p:hover .aw-card{transform:rotate(calc(var(--r) * -1.4)) translateY(-3px);transition-delay:0s}}
@media (max-width:1000px){.aw{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.aw{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 0}.aw-p{padding-left:10px;padding-right:10px}}
/* author wall page hero: polaroids not books */
.lw img.lw-ph{aspect-ratio:4/5;background:#fff;padding:7px 7px 26px;border-radius:3px;box-shadow:6px 8px 0 rgba(23,21,34,.85)}
/* footer phone: our real, live Instagram */
.dk-phone{text-decoration:none;color:#111}
.dk-ph-live{position:absolute;left:5.9%;top:3.4%;width:87.7%;height:94.4%;border-radius:11% / 5.6%;overflow:hidden;background:#fff;z-index:1;container-type:inline-size;display:flex;flex-direction:column;font-family:-apple-system,"Helvetica Neue",Arial,sans-serif}
.ig-sb{display:flex;justify-content:space-between;align-items:center;padding:4.5cqw 9cqw 1cqw;font-size:5.4cqw;font-weight:600}
.ig-sb i{display:flex;gap:1.6cqw;align-items:center}.ig-sb i span{display:block;width:4cqw;height:3cqw;background:#111;border-radius:.6cqw}.ig-sb i span:last-child{width:7cqw;border-radius:1cqw}
.ig-top{display:flex;align-items:center;gap:3cqw;padding:2.5cqw 5cqw 2cqw;font-size:5.6cqw;font-weight:700;border-bottom:1px solid #eee}
.ig-top svg{width:5cqw;height:5cqw}
.ig-frame{position:relative;flex:0 0 auto;overflow:hidden}
.ig-frame iframe{position:absolute;left:0;top:0;width:360px;border:0;transform-origin:0 0;background:#fff}
.ig-frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 9%}
.ig-frame.live img{visibility:hidden}
.ig-fol{margin:3cqw 5cqw 0;display:block;text-align:center;background:#0095F6;color:#fff!important;border-radius:2.5cqw;padding:2.6cqw 0;font-size:5cqw;font-weight:600;text-decoration:none}
.ig-more{margin:2.5cqw 5cqw 0;text-align:center;font-size:4.4cqw;color:#737373;line-height:1.3}
.ig-nav{margin-top:auto;display:flex;justify-content:space-around;align-items:center;padding:3cqw 4cqw 6cqw;border-top:1px solid #eee}
.ig-nav svg{width:6.5cqw;height:6.5cqw}
@media (max-width:420px){#view-work .pk-copy h1{font-size:clamp(2rem,10.5vw,2.6rem)!important}#view-work .pk-hl{white-space:normal!important}}

/* ===== footer phone v3: a real Instagram profile, live posts ===== */
.dk-ph-live.igp{background:#fff;color:#0c0c0d;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;display:flex;flex-direction:column;letter-spacing:0;line-height:1.25;-webkit-font-smoothing:antialiased}
.igp a{color:inherit;text-decoration:none}
.igp svg{display:block}
.dk-phone .igp img{position:static;max-width:100%;inset:auto}
.igp-sb{position:relative;display:flex;align-items:center;justify-content:space-between;height:11cqw;padding:2.2cqw 7.5cqw 0 9cqw;font-size:4.3cqw;flex:none}
.igp-sb b{font-weight:600}
.igp-isl{position:absolute;left:50%;top:2.6cqw;width:26cqw;height:7.4cqw;margin-left:-13cqw;border-radius:6cqw;background:#000}
.igp-si{display:flex;align-items:center;gap:1.3cqw}.igp-si svg{height:2.9cqw;width:auto;fill:currentColor}.igp-si svg:last-child{height:3.2cqw}
.igp-top{display:flex;align-items:center;gap:1.6cqw;padding:2.4cqw 4cqw 2.4cqw 3cqw;font-size:4.6cqw;flex:none}
.igp-top>svg:first-child{width:6.2cqw;height:6.2cqw}.igp-top b{font-weight:700}.igp-ck{width:3.9cqw;height:3.9cqw}.igp-sp{flex:1}.igp-top>svg:last-child{width:6cqw;height:6cqw}
.igp-prof{display:flex;align-items:center;gap:4.5cqw;padding:2cqw 4cqw 0;flex:none}
.igp-av{flex:none;width:21cqw;height:21cqw;border-radius:50%;padding:.9cqw;background:conic-gradient(from 210deg,#FEDA75,#FA7E1E,#D62976,#962FBF,#4F5BD5,#FEDA75)}
.igp-av img{display:block;width:100%;height:100%;border-radius:50%;border:.9cqw solid #fff;box-sizing:border-box;object-fit:cover}
.igp-who{display:grid;gap:.6cqw}.igp-who b{font-size:4.5cqw;font-weight:700}.igp-who span{font-size:3.7cqw;color:#737373}
.igp-bio{padding:2.6cqw 4cqw 0;font-size:3.65cqw;line-height:1.32;flex:none}
.igp-bio p{margin:0}.igp-bio p:first-child{font-weight:600}
.igp-bio a{display:inline-flex;align-items:center;gap:1cqw;margin-top:.6cqw;color:#00376B!important;font-weight:600}.igp-bio a svg{width:3.4cqw;height:3.4cqw}
.igp-btns{display:grid;grid-template-columns:1fr 1fr 8.6cqw;gap:1.6cqw;padding:3.2cqw 4cqw 0;flex:none}
.igp-btns a{display:grid;place-items:center;height:8.6cqw;border-radius:2.2cqw;font-size:3.75cqw;font-weight:600;background:#EFEFEF}
.igp-btns .igp-fol{background:#0095F6;color:#fff!important}.igp-btns .igp-fol:hover{background:#1877F2}
.igp-add svg{width:4.6cqw;height:4.6cqw}
.igp-hls{display:flex;gap:3.6cqw;padding:3.6cqw 4cqw 0;flex:none}
.igp-hl{display:grid;justify-items:center;gap:1.2cqw;font-size:3.1cqw;width:15.5cqw}
.igp-hl i{display:grid;place-items:center;width:15.5cqw;height:15.5cqw;border-radius:50%;box-shadow:0 0 0 .5cqw #fff,0 0 0 .85cqw #DBDBDB;background:var(--c);color:#171522}
.igp-hl i svg{width:7.6cqw;height:7.6cqw}
.igp-tabs{display:flex;margin-top:3.6cqw;border-top:1px solid #EFEFEF;flex:none}
.igp-tabs span{flex:1;display:grid;place-items:center;padding:2.2cqw 0;color:#a8a8a8}.igp-tabs span svg{width:6cqw;height:6cqw}
.igp-tabs span.on{color:#0c0c0d;box-shadow:inset 0 -.6cqw 0 #0c0c0d}
.igp-grid{position:relative;flex:none;overflow:hidden;background:#fff}
.igp-grid img{display:block;width:100%;height:100%;object-fit:cover}
.igp-grid iframe{position:absolute;left:0;top:0;width:230px;height:420px;border:0;background:#fff;opacity:0;transition:opacity .4s}
.igp-grid.live iframe{opacity:1}
.igp-nav{margin-top:auto;display:flex;justify-content:space-around;align-items:center;padding:2.6cqw 3cqw 6.4cqw;border-top:1px solid #EFEFEF;background:#fff;flex:none}
.igp-nav svg{width:6.6cqw;height:6.6cqw}
.igp-me{width:6.6cqw;height:6.6cqw;border-radius:50%;overflow:hidden;box-shadow:0 0 0 .5cqw #0c0c0d}.igp-me img{width:100%;height:100%;display:block}

/* ===== v126: this story belongs to (the nameplate) ===== */
.hz-acts{display:flex;align-items:center;gap:clamp(16px,2.2vw,34px);flex-wrap:wrap}
.zn{position:relative;display:grid;gap:1px;padding:8px 14px 9px;background:#fff;border:2.5px solid var(--ink);border-radius:10px;box-shadow:4px 4px 0 rgba(23,21,34,.85);transform:rotate(-1.8deg);width:min(270px,74vw);cursor:text;transition:transform .25s cubic-bezier(.3,1.6,.5,1),box-shadow .2s}
.zn:hover{transform:rotate(-.6deg) translateY(-2px)}
.zn:focus-within{transform:rotate(0) scale(1.03);box-shadow:6px 6px 0 var(--ink)}
.zn-k{font-family:var(--brush);font-size:1.02rem;line-height:1;color:var(--red);letter-spacing:.01em}
.zn-line{display:flex;align-items:flex-end;gap:8px;border-bottom:2.5px solid var(--ink);padding-bottom:1px}
.zn-line svg{width:19px;height:19px;flex:none;margin-bottom:5px;color:var(--ink);opacity:.55}
.zn .zn-line input[type=text]{flex:1;min-width:0;width:100%;border:0;border-radius:0;outline:0;background:none;font-family:var(--brush);font-weight:400;font-size:1.55rem;line-height:1.15;color:var(--ink);padding:0;height:1.25em}
.zn .zn-line input[type=text]::placeholder{color:rgba(23,21,34,.34)}
.zn-hi{position:absolute;left:8px;top:calc(100% + 9px);font-family:var(--brush);font-size:1.02rem;line-height:1.1;color:var(--ink);white-space:nowrap;opacity:0;transform:translateY(-4px) rotate(1.8deg);transition:opacity .3s,transform .3s;pointer-events:none}
.zn-hi.me-on{opacity:.9;transform:rotate(1.8deg)}
.me-slot{display:inline-block;transform-origin:0 60%}
.me-slot.me-pop{animation:mePop .55s cubic-bezier(.3,1.7,.5,1)}
@keyframes mePop{0%{transform:scale(.86) rotate(-3deg)}55%{transform:scale(1.06) rotate(1.5deg)}100%{transform:none}}
.be-blank.filled{display:inline!important;width:auto!important;min-width:0;height:auto!important;padding:0 .15em;font-family:var(--brush);font-size:1.12em;color:var(--plum);white-space:nowrap;background:none!important;border:0!important;box-shadow:inset 0 -3px 0 var(--red);vertical-align:baseline}.be-blank.filled::before,.be-blank.filled::after{display:none!important}
.sh-cta-slot span[data-me-lines].me-on{white-space:pre-line;overflow-wrap:anywhere;font-size:clamp(1.25rem,1.9vw,1.8rem);color:var(--plum)}
@media (max-width:899px){.hz-acts{gap:22px 18px}.zn-hi{white-space:normal}}
@media (prefers-reduced-motion:reduce){.me-slot.me-pop{animation:none}}

/* ===== v126: try your name on ===== */
.tyn{position:relative;background:#fff;padding:clamp(70px,8vw,130px) 0 clamp(64px,7vw,110px)}
.tyn-in{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);grid-template-areas:"head stage" "ctrl stage" "foot stage";column-gap:clamp(30px,4.6vw,84px);row-gap:clamp(18px,2vw,26px);align-items:start;max-width:1320px;margin:0 auto}
.tyn-head{grid-area:head;display:grid;gap:10px;align-self:end}
.tyn-k{font-family:var(--brush);font-size:1.25rem;color:var(--red);transform:rotate(-2deg);transform-origin:left;justify-self:start}
.tyn-head h2{font-family:var(--hand);font-weight:800;font-size:clamp(2.1rem,3.9vw,3.5rem);line-height:1.04;letter-spacing:-.01em}
.tyn-head p{font-family:var(--hand);font-weight:500;font-size:clamp(1rem,1.2vw,1.16rem);line-height:1.55;max-width:30em}
.tyn-stage{grid-area:stage;align-self:center;min-width:0}
.tyn-ctrl{grid-area:ctrl;display:grid;gap:16px;min-width:0}
.tyn-foot{grid-area:foot;display:grid;gap:16px;align-self:start}
.tyn-field{display:grid;gap:3px;max-width:26em}
.tyn-field>span,.tyn-pick>span{font-family:var(--brush);font-size:1.12rem;color:var(--plum);line-height:1}
.tyn .tyn-field input[type=text]{font-family:var(--brush);font-size:clamp(1.5rem,2.2vw,1.9rem);line-height:1.2;padding:.28em .6em .22em;border:3px solid var(--ink);border-radius:14px;background:#FFFDF2;box-shadow:5px 5px 0 var(--ink);color:var(--ink);width:100%;transition:transform .2s cubic-bezier(.3,1.6,.5,1),box-shadow .2s}
.tyn .tyn-field input[type=text]:focus{outline:none;border-color:var(--ink);transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--purple)}
.tyn .tyn-field input[type=text]::placeholder{color:rgba(23,21,34,.3)}
.tyn-sample{font-style:normal;font-family:var(--hand);font-size:.82rem;color:var(--soft);margin-top:6px}
.has-me .tyn-sample{visibility:hidden}
.tyn-pick{display:grid;gap:8px}
.tyn-chips{display:flex;flex-wrap:wrap;gap:8px}
.tyn-chip{font-family:var(--hand);font-weight:700;font-size:.95rem;line-height:1;padding:.5em .85em;border:2.5px solid var(--ink);border-radius:999px;background:#fff;color:var(--ink);cursor:pointer;box-shadow:2.5px 2.5px 0 var(--ink);transition:transform .15s cubic-bezier(.3,1.6,.5,1),background .15s,box-shadow .15s}
.tyn-chip:hover{transform:translateY(-2px) rotate(-2deg)}
.tyn-chip[aria-pressed=true]{background:var(--yellow);transform:rotate(-2deg);box-shadow:4px 4px 0 var(--ink)}
.tyn-fine{font-family:var(--hand);font-size:.95rem;line-height:1.5;color:var(--soft);max-width:30em}
.tyn-fine b{font-family:var(--brush);font-weight:400;font-size:1.15em;color:var(--red)}
.tyn-ba{position:relative;aspect-ratio:16/10;border:3px solid var(--ink);border-radius:20px;box-shadow:9px 9px 0 var(--ink);overflow:hidden;background:#fff;transform:rotate(.8deg);isolation:isolate}
.tyn-L{position:absolute;inset:0;overflow:hidden}
.tyn-L.before{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.tyn .tyn-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:5;touch-action:pan-y}
.tyn-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:0;z-index:4;pointer-events:none}
.tyn-handle::before{content:"";position:absolute;top:0;bottom:0;left:-1.5px;width:3px;background:var(--ink)}
.tyn-handle i{position:absolute;left:0;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:var(--yellow);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);display:grid;place-items:center;color:var(--ink)}
.tyn-handle i svg{width:22px;height:22px}
.tyn-handle em{position:absolute;left:0;bottom:12px;transform:translateX(-50%);font-style:normal;font-family:var(--hand);font-weight:800;font-size:.72rem;white-space:nowrap;color:#fff;background:var(--ink);border-radius:999px;padding:3px 10px}
.tyn-ba:focus-within .tyn-handle i{outline:3px solid var(--purple);outline-offset:3px}
.tyn-tag{position:absolute;top:12px;z-index:3;font-family:var(--brush);font-size:1.05rem;line-height:1;padding:5px 12px 4px;border:2.5px solid var(--ink);border-radius:999px;box-shadow:2.5px 2.5px 0 var(--ink);pointer-events:none}
.tyn-tag.b{left:12px;background:#fff;transform:rotate(-3deg)}
.tyn-tag.a{right:12px;background:var(--lime);transform:rotate(3deg)}
.tyn-mocks{display:grid;grid-template-columns:.62fr 1.5fr .78fr;gap:clamp(12px,2vw,28px);margin-top:clamp(22px,2.6vw,36px);align-items:end;padding:0 clamp(0px,1vw,14px)}
.tyk{margin:0;display:grid;gap:8px;justify-items:center;min-width:0;background:none;border:0;padding:0;box-shadow:none}
.tyk figcaption{font-family:var(--brush);font-size:1.05rem;line-height:1;color:var(--soft);white-space:nowrap}
.tyk-prof .tyav{position:relative;width:100%;max-width:128px;aspect-ratio:1;border-radius:50%;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);overflow:hidden;transform:rotate(-4deg)}
.tyk-web{justify-items:stretch}.tyk-web figcaption{justify-self:center}
.tyk-web .tybr{border:3px solid var(--ink);border-radius:12px;box-shadow:5px 5px 0 var(--ink);overflow:hidden;background:#fff;transform:rotate(-1deg)}
.tyk-web .tybar{display:flex;align-items:center;gap:5px;padding:5px 9px;border-bottom:2.5px solid var(--ink);background:var(--wash)}
.tyk-web .tybar i{width:7px;height:7px;border-radius:50%;background:var(--ink);opacity:.28}
.tyk-web .tybar span{margin-left:6px;font-family:var(--hand);font-weight:600;font-size:.64rem;line-height:1.3;background:#fff;border:1.5px solid var(--ink);border-radius:999px;padding:1px 9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:78%}
.tyk-web .tyscr{position:relative;aspect-ratio:16/8.2;overflow:hidden}
.tyk-post .tysq{position:relative;width:100%;max-width:150px;aspect-ratio:1;border:3px solid var(--ink);border-radius:10px;box-shadow:5px 5px 0 var(--ink);overflow:hidden;transform:rotate(3deg)}
.tyk-post .tyst{position:absolute;right:-7%;bottom:8%;z-index:2;font-family:var(--hand);font-weight:800;font-size:clamp(.5rem,.8vw,.68rem);line-height:1.05;text-align:center;background:var(--yellow);border:2px solid var(--ink);padding:3px 12px 3px 8px;transform:rotate(-8deg);box-shadow:2px 2px 0 var(--ink)}
/* the artboards: fixed size, scaled to fit, so every name is fitted once */
.tya,.tyma{position:absolute;left:0;top:0;transform-origin:0 0;transform:scale(var(--tys,1));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.tya{width:640px;height:400px;gap:10px}.tyma{width:200px;height:200px}
.tya .nm,.tyma .nm{display:inline-block;white-space:nowrap;line-height:1.05;position:relative}
.tya .tg{display:flex;align-items:center;gap:12px;white-space:nowrap;position:relative}
.tya .tg i{display:block;flex:none}
.g-romance{background:radial-gradient(120% 90% at 50% 0%,#FFF4F6 0%,#FFDCE4 70%,#FFC6D4 100%);color:#A3163F}
.g-romance .nm{font-family:"Allura","Great Vibes","Brush Script MT",cursive;line-height:1.2;padding:0 .12em}
.g-romance .orn{width:44px;height:40px;margin-bottom:-12px}
.g-romance .tg{font-family:"Josefin Sans","Avenir Next",sans-serif;font-weight:600;font-size:15px;letter-spacing:.42em;text-transform:uppercase;color:#C2466A;margin-top:-4px;padding-left:.42em}
.g-romance .tg i{width:46px;height:1.5px;background:currentColor;opacity:.55}
.g-fantasy{background:radial-gradient(2px 2px at 12% 22%,#fff 50%,transparent 52%),radial-gradient(1.6px 1.6px at 84% 16%,#fff 50%,transparent 52%),radial-gradient(1.6px 1.6px at 70% 78%,#fff 50%,transparent 52%),radial-gradient(2px 2px at 24% 82%,#fff 50%,transparent 52%),radial-gradient(1.4px 1.4px at 46% 10%,#fff 50%,transparent 52%),radial-gradient(1.4px 1.4px at 93% 58%,#fff 50%,transparent 52%),radial-gradient(1.4px 1.4px at 6% 60%,#fff 50%,transparent 52%),radial-gradient(60% 60% at 50% 40%,#27357A,transparent 75%),linear-gradient(180deg,#0E1433,#171F4E);color:#E9C46A}
.g-fantasy .nm{font-family:"Cinzel Decorative","Cinzel",Georgia,serif;font-weight:700;text-transform:uppercase;letter-spacing:.03em;background:linear-gradient(180deg,#FFEDB3,#DBA944 58%,#B37D1F);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1.15}
.g-fantasy .orn{width:92px;height:44px;margin-bottom:2px}
.g-fantasy .tg{font-family:"Cinzel",Georgia,serif;font-weight:500;font-size:14px;letter-spacing:.5em;text-transform:uppercase;color:#CDB77D;padding-left:.5em}
.g-fantasy .tg i{width:7px;height:7px;background:#DBA944;transform:rotate(45deg)}
.g-thriller{background:linear-gradient(135deg,#1B1B20,#09090B);color:#fff;gap:4px}
.g-thriller .typre{font-family:"Oswald","Arial Narrow",sans-serif;font-weight:500;font-size:25px;letter-spacing:.55em;text-transform:uppercase;color:rgba(255,255,255,.78);padding-left:.55em;white-space:nowrap}
.g-thriller .nm{font-family:"Bebas Neue","Oswald","Arial Narrow",sans-serif;text-transform:uppercase;letter-spacing:.02em;line-height:.92}
.g-thriller .nm::after{content:"";position:absolute;left:-4%;right:-4%;top:46%;height:.07em;background:#E0261A;transform:rotate(-1.2deg)}
.g-thriller .tg{font-family:"Oswald","Arial Narrow",sans-serif;font-weight:500;font-size:14px;letter-spacing:.5em;text-transform:uppercase;color:#E0261A;margin-top:12px;padding-left:.5em}
.g-thriller .tg i{display:none}
.g-mystery{background-color:#FBF3DF;background-image:radial-gradient(#EADCB6 1.2px,transparent 1.4px);background-size:18px 18px;color:#17615C}
.g-mystery .nm{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:800;line-height:1.15;padding:0 .1em}
.g-mystery .orn{width:50px;height:50px;margin-bottom:-4px}
.g-mystery .tg{font-family:"Josefin Sans","Avenir Next",sans-serif;font-weight:600;font-size:14px;letter-spacing:.4em;text-transform:uppercase;color:#D9642B;padding-left:.4em}
.g-mystery .tg i{width:34px;height:0;border-top:2.5px dotted #D9642B}
.g-scifi{background:radial-gradient(60% 80% at 82% 8%,rgba(255,79,216,.28),transparent 62%),radial-gradient(50% 60% at 10% 100%,rgba(77,225,255,.18),transparent 60%),linear-gradient(160deg,#070B24,#1A1048);color:#8DF3FF}
.g-scifi .nm{font-family:"Orbitron","Trebuchet MS",sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.07em;text-shadow:0 0 18px rgba(93,225,255,.6);z-index:1;padding-left:.07em}
.g-scifi .orb{position:absolute;left:50%;top:47%;width:580px;height:150px;transform:translate(-50%,-50%) rotate(-9deg);border:2px solid rgba(255,79,216,.75);border-radius:50%}
.g-scifi .orb::after{content:"";position:absolute;right:52px;top:9px;width:14px;height:14px;border-radius:50%;background:#FF4FD8;box-shadow:0 0 14px #FF4FD8}
.g-scifi .tg{font-family:"Orbitron","Trebuchet MS",sans-serif;font-weight:500;font-size:12px;letter-spacing:.6em;text-transform:uppercase;color:#FF9BEA;margin-top:8px;padding-left:.6em;z-index:1}
.g-scifi .tg i{display:none}
.g-horror{background:radial-gradient(70% 75% at 50% 45%,#4F0D0D,#0B0606 78%);color:#EFE8D8}
.g-horror .nm{font-family:"Rubik Dirt","Special Elite",Georgia,serif;text-transform:uppercase;letter-spacing:.02em;z-index:1}
.g-horror .claw{position:absolute;left:50%;top:50%;width:420px;height:300px;transform:translate(-50%,-50%);opacity:.85}
.g-horror .tg{font-family:"Special Elite","Courier New",monospace;font-size:15px;letter-spacing:.4em;text-transform:uppercase;color:#FF4B3E;z-index:1;margin-top:4px;padding-left:.4em}
.g-horror .tg i{display:none}
.g-kids{background-color:#FFE45C;background-image:radial-gradient(#fff 6px,transparent 7px);background-size:46px 46px;color:#171522;gap:6px}
.g-kids .nm{font-family:"Baloo 2","Fredoka","Arial Rounded MT Bold",sans-serif;font-weight:800;line-height:1.1;padding:0 .08em}
.g-kids .nm i{font-style:normal;display:inline-block;transform:rotate(var(--r,0deg));color:var(--c);text-shadow:3px 3px 0 #fff,-2px -2px 0 #fff,3px -2px 0 #fff,-2px 3px 0 #fff}
.g-kids .orn{width:46px;height:46px;margin-bottom:-6px}
.g-kids .tg{font-family:"Baloo 2","Arial Rounded MT Bold",sans-serif;font-weight:600;font-size:17px;background:#fff;border:2.5px solid #171522;border-radius:99px;padding:2px 16px}
.g-kids .tg i{display:none}
.g-memoir{background:linear-gradient(180deg,#F6F1E7,#EFE8DA);color:#26231F}
.g-memoir .nm{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:600;line-height:1.15;padding:0 .08em}
.g-memoir .orn{width:36px;height:36px;margin-bottom:-2px}
.g-memoir .tg{font-family:"Josefin Sans","Avenir Next",sans-serif;font-weight:600;font-size:13px;letter-spacing:.42em;text-transform:uppercase;color:#727C48;padding-left:.42em}
.g-memoir .tg i{width:52px;height:1.5px;background:#727C48}
.g-bad{background:#fff;gap:6px}
.g-bad::before{content:"FREE LOGO APP    FREE LOGO APP    FREE LOGO APP";position:absolute;left:-30%;top:40%;width:160%;font:700 36px Arial,Helvetica,sans-serif;color:rgba(0,0,0,.055);transform:rotate(-17deg);white-space:nowrap;letter-spacing:.18em}
.g-bad .b-stars{font:400 24px "Times New Roman",Times,serif;color:#C9A227;letter-spacing:.6em;padding-left:.6em;position:relative}
.g-bad .nm{font-family:"Times New Roman",Times,serif;font-style:italic;font-weight:700;background:linear-gradient(180deg,#2B6BE0,#7B2BE0);-webkit-background-clip:text;background-clip:text;color:transparent;transform:scaleY(1.28);filter:drop-shadow(3px 3px 0 #BDBDBD);padding:0 .12em;line-height:1.2}
.g-bad .b-tg{font-family:"Comic Sans MS","Comic Neue","Chalkboard SE","Comic Sans",cursive;font-size:24px;color:#E00000;margin-top:16px;position:relative}
.g-bad .b-url{font:400 13px Arial,Helvetica,sans-serif;color:#1A0DAB;text-decoration:underline;position:relative}
.tyma .nm{font-size:92px}
.tyma.g-thriller .nm::after{top:48%}
@media (max-width:899px){
  .tyn-in{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "stage" "ctrl" "foot";row-gap:22px}
  .tyn-ba{box-shadow:6px 6px 0 var(--ink);border-radius:16px}
  .tyn-handle i{width:40px;height:40px;margin:-20px 0 0 -20px}
  .tyn-mocks{gap:12px;grid-template-columns:.6fr 1.4fr .74fr}
  .tyk figcaption{font-size:.92rem}
}
@media (max-width:420px){.tyn-tag{font-size:.9rem;top:8px;padding:4px 9px 3px}.tyn-tag.b{left:8px}.tyn-tag.a{right:8px}.tyn-handle em{display:none}.tyk figcaption{font-size:.8rem}.tyk-web .tybar span{font-size:.56rem}}

/* ===== v126: the toy box (sound + doodle) ===== */
.zdock{position:fixed;left:calc(16px + env(safe-area-inset-left,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:58;display:none;align-items:flex-end;gap:10px}
@media (min-width:900px) and (hover:hover) and (pointer:fine){.zdock{display:flex}}
.zd-btn{position:relative;width:46px;height:46px;border-radius:50%;border:2.5px solid var(--ink);background:#fff;color:var(--ink);box-shadow:3px 3px 0 var(--ink);cursor:pointer;display:grid;place-items:center;padding:0;transition:transform .18s cubic-bezier(.3,1.6,.5,1),background .15s}
.zd-btn:hover{transform:translateY(-3px) rotate(-6deg)}
.zd-btn svg{width:22px;height:22px}
.zd-btn[aria-pressed=true]{background:var(--yellow)}
.zd-btn .off{display:block}.zd-btn[aria-pressed=true] .off{display:none}
.zd-btn::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%) rotate(-2deg);font-family:var(--brush);font-size:1rem;line-height:1;white-space:nowrap;background:var(--ink);color:#fff;border-radius:999px;padding:5px 11px 4px;opacity:0;pointer-events:none;transition:opacity .15s}
.zd-btn:hover::after,.zd-btn:focus-visible::after{opacity:1}
.zd-hint{position:absolute;left:0;bottom:calc(100% + 14px);font-family:var(--brush);font-size:1.1rem;line-height:1.15;background:var(--yellow);border:2.5px solid var(--ink);border-radius:12px 12px 12px 3px;box-shadow:3px 3px 0 var(--ink);padding:7px 12px;white-space:nowrap;transform:rotate(-2deg);animation:zdHint .5s cubic-bezier(.3,1.6,.5,1) both}
@keyframes zdHint{from{opacity:0;transform:translateY(10px) rotate(-6deg) scale(.8)}}
.zd-tray{display:none;align-items:center;gap:6px;background:#fff;border:2.5px solid var(--ink);border-radius:999px;box-shadow:3px 3px 0 var(--ink);padding:5px 8px}
body.doodling .zd-tray{display:flex}
.zd-tool{width:34px;height:34px;border-radius:50%;border:2.5px solid transparent;background:none;cursor:pointer;display:grid;place-items:center;padding:0;color:var(--ink);font-family:var(--hand);font-weight:800;font-size:.72rem}
.zd-tool i{display:block;width:18px;height:18px;border-radius:50%;background:var(--c);border:2px solid var(--ink)}
.zd-tool[aria-pressed=true]{border-color:var(--ink);background:var(--wash)}
.zd-tool.txt{width:auto;border-radius:999px;padding:0 10px;border-color:var(--ink)}
.zd-tool.txt:hover{background:var(--yellow)}
.dz-catch{position:fixed;inset:0;z-index:45;display:none;touch-action:none;cursor:crosshair}
body.doodling .dz-catch{display:block}
.dz-layer{position:absolute;left:0;top:0;width:100%;height:100%;z-index:40;pointer-events:none;overflow:visible}
.dz-layer path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.dz-layer path.hi{mix-blend-mode:multiply}
body.doodling header.top{z-index:59}
body.pop-open .zdock{display:none!important}
#pop .pop-card,#pop .pop-card *{cursor:auto}
#pop .pop-card input[type=text],#pop .pop-card input[type=email],#pop .pop-card input[type=tel],#pop .pop-card textarea{cursor:text}
#pop .pop-card button,#pop .pop-card button *,#pop .pop-card a,#pop .pop-card a *,#pop .pop-g label,#pop .pop-g label *,#pop .pop-g input{cursor:pointer}
.nav-snd{font:inherit;background:none;border:0;color:inherit;cursor:pointer;text-align:left;padding:0}
@media (min-width:900px) and (hover:hover) and (pointer:fine){.nav-snd{display:none!important}}
/* polaroids develop as they land */
@media (prefers-reduced-motion:no-preference){
  html.rv-on .aw.in .aw-card img{animation:zDevelop 1.9s ease-out both;animation-delay:calc(var(--d) + .25s)}
  #shelfGrid .sc.flip-in .sc-photo img{animation:zDevelop 1.5s ease-out both}
  @keyframes zDevelop{0%{filter:brightness(2.2) saturate(0) contrast(.5) sepia(.5)}100%{filter:none}}
  .hz-kicker{clip-path:inset(-20% 100% -20% 0);animation:zWrite .7s steps(16,end) .05s forwards}
  @keyframes zWrite{to{clip-path:inset(-20% -5% -20% 0)}}
}
.fs-save{display:inline-block;font-family:var(--brush);font-size:clamp(1.25rem,1.7vw,1.6rem);line-height:1.1;color:var(--ink);transform:rotate(-3deg);margin:0 6px}
.fs-save s{text-decoration-color:var(--red);text-decoration-thickness:2.5px}
.fs-save b{font-weight:400;background:var(--lime);border-radius:6px;padding:0 6px}
.skip-link{position:fixed;left:12px;top:-60px;z-index:999;background:var(--yellow);color:var(--ink);border:3px solid var(--ink);border-radius:12px;padding:8px 14px;font-family:var(--hand);font-weight:800;transition:top .15s}
.skip-link:focus{top:12px}

/* ===== v129: the index, like the back of a book ===== */
.ax{margin:clamp(40px,5vw,70px) auto 0;max-width:980px;padding:clamp(22px,3vw,36px) clamp(18px,3vw,40px) clamp(24px,3vw,34px);background:#fff;border:2.5px solid var(--ink);border-radius:6px;box-shadow:6px 6px 0 var(--ink);background-image:linear-gradient(transparent calc(100% - 1px),rgba(127,134,245,.28) 0);background-size:100% 2.05rem;background-position:0 .2rem}
.ax h2{display:grid;gap:2px;font-family:var(--hand);font-weight:800;font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.1;margin-bottom:14px}
.ax h2 span{font-family:var(--brush);font-weight:400;font-size:1.15rem;color:var(--red);transform:rotate(-2deg);transform-origin:left}
.ax-list{list-style:none;margin:0;padding:0;columns:3 15em;column-gap:clamp(24px,3vw,46px)}
.ax-list li{break-inside:avoid;line-height:2.05rem}
.ax-list a{display:flex;align-items:baseline;gap:6px;color:var(--ink);text-decoration:none;font-family:var(--hand);font-weight:700;font-size:.98rem;min-width:0}
.ax-list a b{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 1 auto;min-width:0}
.ax-list a i{flex:1 1 12px;min-width:12px;border-bottom:2px dotted rgba(23,21,34,.35);transform:translateY(-4px)}
.ax-list a em{font-style:normal;font-family:var(--brush);font-size:1.02rem;color:var(--plum);white-space:nowrap;flex:none}
.ax-list a:hover b,.ax-list a:focus-visible b{background:linear-gradient(transparent 55%,var(--yellow) 0)}