:root {
  --ink: #151515;
  --night: #11182f;
  --night-2: #172550;
  --cream: #f2e6cc;
  --paper: #e9d8b8;
  --gold: #efbd46;
  --pink: #cf4772;
  --red: #cf5137;
  --green: #326449;
  --blue: #315ca2;
  --serif: "Fraunces", Georgia, serif;
  --hand: "Caveat", cursive;
  --sans: "DM Sans", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); font-family: var(--sans); overflow-x: hidden; -webkit-user-select: none; user-select: none; }
button, a { color: inherit; }
a { text-decoration: none; }
button { font: inherit; }
::selection { background: var(--pink); color: white; }
.can-select, .can-select *, .art-dialog, .art-dialog *, input, textarea, select, [contenteditable] { -webkit-user-select: text; user-select: text; }
a, button { touch-action: manipulation; }
a:focus-visible, button:focus-visible, [tabindex="-1"]:focus-visible { outline: 3px solid var(--gold); outline-offset: 5px; }

.skip-link { position: fixed; top: 1rem; left: 1rem; z-index: 1000; padding: .7rem 1rem; background: var(--cream); transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.paper-grain { position: fixed; inset: -80px; z-index: 90; pointer-events: none; opacity: .055; mix-blend-mode: multiply; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); animation: grain .45s steps(3) infinite; }
@keyframes grain { 0%,100%{transform:translate(0)} 33%{transform:translate(-14px,9px)} 66%{transform:translate(11px,-12px)} }

.home-page { background: var(--night); }
.home-page main, .home-page .site-footer { position: relative; z-index: 1; }
.sky-canvas { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; background: var(--night); opacity: 0; transform: translate3d(calc(var(--parallax-x,0px) * -.45),calc(var(--parallax-y,0px) * -.45),0) scale(1.02); transition: opacity 1.1s ease, transform .25s ease; }
.is-ready .sky-canvas { opacity: 1; }

.site-header, .riot-header { position: fixed; z-index: 100; top: 0; left: 0; width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 1.4rem clamp(1.2rem,4vw,4rem); color: var(--cream); transition: color .35s ease, text-shadow .35s ease; }
.site-header::before { content: ""; position: absolute; inset: .9rem clamp(.7rem,2vw,2rem); z-index: -1; border-radius: 999px; background: rgba(17,24,47,.14); backdrop-filter: blur(12px); opacity: .32; transition: opacity .35s, background .35s; }
.past-hero .site-header { color: var(--ink); text-shadow: 0 1px 0 rgba(255,255,255,.35); }
.past-hero .site-header::before { background: rgba(242,230,204,.72); opacity: 1; }
.wordmark { font: 600 clamp(1.6rem,3vw,2.3rem)/1 var(--hand); letter-spacing: -.04em; }
.wordmark span { color: var(--gold); }
.site-nav { display: flex; align-items: center; gap: clamp(1rem,2.5vw,2.5rem); font: 400 .72rem/1 var(--sans); text-transform: uppercase; letter-spacing: .16em; }
.site-nav a { position: relative; padding: .6rem .15rem; }
.site-nav a::after { content:""; position:absolute; left:0; right:0; bottom:.2rem; height:2px; background:var(--gold); transform:scaleX(0) rotate(-1deg); transition:transform .35s; }
.site-nav a:hover::after, .site-nav a:focus-visible::after { transform:scaleX(1) rotate(-1deg); }
.site-nav a.is-active::after { transform:scaleX(1) rotate(-1deg); }
.site-nav .nav-riot { color: #ffc7d5; }
.menu-toggle { display:none; border:0; background:none; color:inherit; }

.hero { min-height: 100svh; position: relative; display: grid; place-content: center; text-align: center; color: var(--cream); padding: 7rem 1rem 5rem; isolation: isolate; }
.hero::before { content:""; position:absolute; inset:0; z-index:-1; background: radial-gradient(circle at 52% 48%,transparent 0 25%,rgba(8,11,27,.14) 52%,rgba(5,8,20,.72) 100%); }
.hero-kicker { margin: 0 0 2rem; font: 500 clamp(1.1rem,2vw,1.5rem)/1 var(--hand); color: var(--gold); transform: rotate(-2deg); }
.hero-title { display:flex; justify-content:center; margin:0; font: 600 clamp(5.5rem,18vw,15rem)/.78 var(--hand); letter-spacing:-.085em; text-shadow: 0 8px 30px rgba(0,0,0,.25); }
.hero-title span, .hero-title b { display:inline-block; font-weight:inherit; animation: title-float 4s ease-in-out infinite alternate; }
.hero-title span:nth-child(2n) { animation-delay:-1.7s; }.hero-title span:nth-child(3n){animation-delay:-2.8s}.hero-title b{color:var(--pink);animation-delay:-.8s}
@keyframes title-float { 0%{transform:translateY(0) rotate(0)} 100%{transform:translateY(-.07em) rotate(1.5deg)} }
.hero-statement { margin: clamp(1.4rem,4vh,3rem) auto 0; font: 300 clamp(1rem,2vw,1.35rem)/1.55 var(--serif); }
.hero-statement p { margin:0; }.hero-statement strong { display:block; margin-top:.2rem; font:600 clamp(1.5rem,3vw,2.4rem)/1 var(--hand); color:var(--gold); }
.hero-note { position:absolute; font:600 1.1rem var(--hand); color:#f7c2cd; opacity:.75; }.hero-note-left{left:8vw;top:34%;transform:rotate(-12deg)}.hero-note-right{right:7vw;bottom:28%;transform:rotate(9deg)}
.hero-orbit { position:absolute; z-index:-1; border:2px solid rgba(239,189,70,.18); border-radius:50%; filter:blur(.2px); animation:orbit 18s linear infinite; }.hero-orbit-one{width:55vw;height:18vw;left:-12vw;top:24%}.hero-orbit-two{width:40vw;height:13vw;right:-8vw;bottom:22%;border-color:rgba(207,71,114,.22);animation-direction:reverse}
@keyframes orbit { 50%{transform:rotate(8deg) scale(1.08)} }
.paint-scroll { position:absolute; bottom:1.6rem; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:.35rem; font:500 .95rem var(--hand); }
.paint-scroll i { width:2px;height:45px;background:linear-gradient(var(--gold),transparent);animation:scroll-line 1.8s ease-in-out infinite;transform-origin:top; }
@keyframes scroll-line { 0%,100%{transform:scaleY(.3);opacity:.4}50%{transform:scaleY(1);opacity:1} }

.section-pad { padding: clamp(5rem,10vw,10rem) clamp(1.2rem,6vw,7rem); }
.work-section { position:relative; background:var(--cream); }
.work-section::before { content:""; position:absolute; left:0; right:0; top:-52px; height:74px; background:var(--cream); clip-path:polygon(0 33%,9% 10%,22% 38%,37% 7%,53% 34%,69% 12%,84% 35%,100% 5%,100% 100%,0 100%); opacity:.98; }
.section-heading { display:grid; grid-template-columns:1fr 2fr 1.2fr; gap:3rem; align-items:end; margin-bottom:clamp(4rem,8vw,8rem); position: relative; }
.eyebrow { margin:0; font:500 .68rem/1 var(--sans); text-transform:uppercase; letter-spacing:.22em; }
.section-heading h2, .about-copy h2 { margin:0; font:500 clamp(3rem,7vw,7rem)/.92 var(--serif); letter-spacing:-.055em; position: relative; }
.section-heading h2::after, .about-copy h2::after { content:""; display:block; width:clamp(5rem,14vw,12rem); height:.42rem; margin-top:1rem; background:currentColor; opacity:.18; clip-path:polygon(0 30%,16% 4%,42% 44%,65% 10%,100% 35%,98% 74%,61% 100%,31% 67%,2% 92%); transform:scaleX(0); transform-origin:left; }
.section-heading.is-visible h2::after, .about-copy.is-visible h2::after { animation:brush-draw .65s ease forwards; }
@keyframes brush-draw { to { transform:scaleX(1); } }
h2 em { font-family:var(--hand); font-weight:600; color:var(--pink); }
.section-intro { margin:0; max-width:28rem; font:300 1rem/1.75 var(--sans); }
.gallery { max-width:1300px; margin:auto; display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(1.8rem,4vw,5rem) clamp(1rem,3vw,3rem); align-items:start; }
.art-card { border:0; padding:0; background:none; text-align:left; cursor:pointer; transform-style:preserve-3d; transition:transform .18s ease; }.art-card-one{grid-column:1/7}.art-card-two{grid-column:8/13;margin-top:8rem}.art-card-three{grid-column:2/6}.art-card-four{grid-column:7/12;margin-top:5rem}.art-card-five{grid-column:3/10;margin-top:2rem}
.art-card img { width:100%; height:100%; display:block; object-fit:cover; }
.art-canvas { display:block; position:relative; overflow:hidden; width:100%; aspect-ratio:4/5; border:10px solid #ded0b4; box-shadow:0 20px 45px rgba(53,39,22,.18), inset 0 0 50px rgba(0,0,0,.12); transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s; }
.art-card:hover .art-canvas { transform:translateY(-8px) rotate(.6deg);box-shadow:0 35px 60px rgba(53,39,22,.25); }.art-card:nth-child(even):hover .art-canvas{transform:translateY(-8px) rotate(-.6deg)}
.art-caption { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding-top:1rem; border-top:1px solid rgba(21,21,21,.25); margin-top:.7rem; transition:transform .45s ease; }.art-caption strong{font:500 clamp(1.2rem,2vw,1.7rem) var(--serif)}.art-caption small{font:600 .9rem var(--hand);color:#81542d}
.art-card:hover .art-caption { transform: translateY(-2px); }
.art-one { background:radial-gradient(circle at 25% 30%,#f5c646 0 8%,transparent 9%),radial-gradient(ellipse at 64% 37%,#d44c7d 0 22%,transparent 23%),repeating-radial-gradient(ellipse at 30% 45%,#2753a0 0 8px,#3b73c1 9px 14px,#15264f 15px 20px); }.art-one i{position:absolute;width:55%;height:38%;border:16px solid #efb83c;border-radius:47% 53% 66% 34%;left:21%;top:29%;transform:rotate(-22deg);mix-blend-mode:screen}
.art-two { background:linear-gradient(125deg,#ec9db2,#c44770 38%,#efba52 39% 67%,#43906b 68%); }.art-two::before{content:"";position:absolute;width:68%;height:76%;left:16%;top:12%;background:#e8ad79;clip-path:polygon(25% 0,76% 7%,100% 39%,84% 89%,46% 100%,8% 80%,0 35%);box-shadow:inset 30px 0 #f1c6a0}.face-eye{position:absolute;z-index:2;top:42%;width:18%;height:9%;border:5px solid #3b2c2a;border-radius:50%;background:white}.eye-left{left:26%}.eye-right{right:23%}.face-eye::after{content:"";position:absolute;width:13px;height:13px;background:#326449;border-radius:50%;left:40%;top:12%}.face-mouth{position:absolute;z-index:2;width:27%;height:11%;left:38%;top:68%;border-bottom:8px solid #a33155;border-radius:50%;transform:rotate(-4deg)}
.art-three { aspect-ratio:1/1;background:repeating-radial-gradient(circle at 52% 48%,#172751 0 12px,#ebbd3f 13px 29px,#3d7754 30px 46px,#d44978 47px 64px,#e7d3a9 65px 82px)}.art-three i{position:absolute;inset:18%;border:18px dotted rgba(255,255,255,.52);border-radius:50%}
.art-four { background:linear-gradient(150deg,#7b2659,#d75848 46%,#e3b841 47%); }.dog-head{position:absolute;width:60%;height:54%;left:20%;top:26%;background:#c28b4d;border:7px solid #221d1a;border-radius:42% 44% 50% 50%;}.dog-head::before,.dog-head::after{content:"";position:absolute;top:34%;width:18%;height:20%;border:5px solid #222;border-radius:50%;background:#f8ebd6}.dog-head::before{left:18%}.dog-head::after{right:18%}.dog-head b{position:absolute;width:22%;height:15%;left:39%;top:65%;background:#211d1b;border-radius:50%}.dog-ear{position:absolute;z-index:0;top:9%;width:34%;height:35%;background:#302a28;border:7px solid #211d1b;clip-path:polygon(50% 0,100% 100%,0 85%)}.dog-ear-left{left:12%;transform:rotate(-15deg)}.dog-ear-right{right:12%;transform:rotate(15deg)}
.art-five { aspect-ratio:5/3;background:#c9ad82;filter:sepia(.2)}.art-five::before{content:"";position:absolute;width:38%;height:79%;left:31%;top:10%;border:5px solid #27231f;border-radius:45% 48% 40% 42%;box-shadow:-20px -10px 0 -12px #27231f,22px 3px 0 -15px #27231f}.art-five i::before,.art-five i::after{content:"";position:absolute;top:39%;width:10%;height:4%;border-bottom:5px solid #211d1b}.art-five i::before{left:38%}.art-five i::after{right:38%}
.gallery-footnote { margin:5rem auto 0; max-width:500px; text-align:center; font:600 1.15rem var(--hand);transform:rotate(-2deg);color:#7f4f2c }

.about-section { min-height:90vh; position:relative; overflow:hidden; background:var(--green);color:var(--cream);display:grid;grid-template-columns:2fr 1fr;gap:clamp(3rem,10vw,10rem);align-items:center}.about-section::after{content:"";position:absolute;inset:auto -5% -25% 40%;height:65%;border:3px solid rgba(239,189,70,.24);border-radius:50%;transform:rotate(-10deg)}.about-copy{position:relative;z-index:1}.about-copy h2{margin:1.5rem 0 3rem}.about-copy h2 em{color:var(--gold)}.about-lede{font:400 clamp(1.4rem,2.6vw,2.2rem)/1.45 var(--serif);max-width:800px}.about-copy>p:last-child{max-width:620px;line-height:1.8;color:#e3dbc8}.about-note{position:relative;z-index:2;background:var(--paper);color:var(--ink);padding:2.5rem;transform:rotate(3deg);box-shadow:15px 20px 0 rgba(20,35,27,.25);clip-path:polygon(1% 0,98% 2%,100% 96%,92% 100%,2% 97%,0 45%)}.about-note span{font:600 1.2rem var(--hand);color:var(--pink)}.about-note ul{padding:0;list-style:none;font:500 clamp(1.5rem,3vw,2.4rem)/1.55 var(--serif)}.about-note li::before{content:"× ";color:var(--red)}.about-note p{font:600 1rem var(--hand);transform:rotate(-2deg)}.about-sun{position:absolute;width:30rem;height:30rem;border:4rem solid rgba(239,189,70,.13);border-radius:50%;right:-8rem;top:-11rem}

.riot-invite{position:relative;overflow:hidden;min-height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:7rem 1.5rem;background:var(--pink);color:#fff4df}.riot-invite h2{margin:1.5rem 0 2rem;font:500 clamp(3.3rem,8vw,8rem)/.9 var(--serif);letter-spacing:-.055em}.riot-invite h2 em{color:var(--gold)}.riot-invite>p:not(.eyebrow){max-width:580px;font:300 1.1rem/1.75 var(--sans)}.big-link{margin-top:3rem;width:min(600px,90vw);display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid currentColor;padding:1rem .2rem;font:500 clamp(1.6rem,3vw,2.6rem) var(--serif);transition:padding .3s,color .3s}.big-link:hover{padding-left:1rem;padding-right:1rem;color:var(--gold)}.big-link b{font-family:var(--sans);font-weight:300}.paw-field{position:absolute;inset:0;opacity:.12;background-image:radial-gradient(ellipse at center,#fff 0 12%,transparent 13%),radial-gradient(circle at 36% 25%,#fff 0 7%,transparent 8%),radial-gradient(circle at 64% 25%,#fff 0 7%,transparent 8%);background-size:130px 130px;transform:rotate(-14deg) scale(1.3)}

.shop-section{background:#e2c99e}.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink)}.shop-card{min-height:320px;padding:2.5rem 2rem;border-right:1px solid var(--ink);display:flex;flex-direction:column}.shop-card:last-child{border-right:0}.shop-number{font:600 1.1rem var(--hand);color:var(--red)}.shop-card h3{margin:auto 0 1rem;font:500 clamp(2rem,3vw,3.5rem) var(--serif)}.shop-card p{min-height:4.5rem;line-height:1.6}.status{align-self:flex-start;margin-top:1.5rem;padding:.5rem .8rem;border:1px solid;font:600 .95rem var(--hand);transform:rotate(-2deg)}

.links-section{background:var(--night);color:var(--cream)}.links-section h2{font:500 clamp(3.5rem,9vw,9rem)/1 var(--serif);letter-spacing:-.06em;margin:1rem 0 4rem}.link-list{border-top:1px solid rgba(242,230,204,.35)}.link-list a{display:grid;grid-template-columns:1fr 1fr auto;align-items:center;padding:1.4rem .5rem;border-bottom:1px solid rgba(242,230,204,.35);transition:background .3s,padding .3s}.link-list a:hover{background:rgba(239,189,70,.1);padding-left:1.5rem}.link-list span{font:400 clamp(1.5rem,3vw,2.8rem) var(--serif)}.link-list small{font:400 .8rem var(--sans);letter-spacing:.1em;color:#b8ad98}.link-list b{font-size:1.6rem;color:var(--gold)}.link-note{font:600 1rem var(--hand);color:#afa38e}.site-footer{background:var(--night);color:var(--8f887b);border-top:1px solid #373b49;display:flex;justify-content:space-between;gap:2rem;padding:2rem clamp(1.2rem,6vw,7rem);font-size:.75rem}.site-footer p{margin:0}

.reveal{opacity:0;transform:translateY(38px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}.reveal.is-visible{opacity:1;transform:none}.art-card.reveal:nth-child(even){transition-delay:.12s}
.cursor-brush{position:fixed;z-index:999;pointer-events:none;width:30px;height:30px;border:1px solid var(--gold);border-radius:50%;transform:translate(-50%,-50%);transition:width .25s,height .25s,background .25s;mix-blend-mode:difference}.cursor-brush span{position:absolute;width:5px;height:5px;background:white;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.cursor-brush.is-big{width:55px;height:55px;background:rgba(255,255,255,.12)}.paint-speck,.paw-pop{position:fixed;z-index:998;pointer-events:none;border-radius:50%;animation:speck-out .8s ease-out forwards}.paint-speck{width:var(--s);height:var(--s);background:var(--c)}@keyframes speck-out{to{opacity:0;transform:translate(var(--x),var(--y)) scale(.1)}}

.art-dialog{width:min(1000px,92vw);max-height:90vh;border:0;padding:0;background:var(--cream);box-shadow:0 30px 100px #0009;overflow:visible;border-radius:2px;opacity:0;transform:scale(.96);transition:opacity .2s ease,transform .2s cubic-bezier(.2,.8,.2,1)}.art-dialog[open]{opacity:1;transform:scale(1)}.art-dialog.is-closing{opacity:0;transform:scale(.97)}.art-dialog::backdrop{background:#090d1ccc;backdrop-filter:blur(10px)}.dialog-open{overflow:hidden}.dialog-art{padding:1.5rem;min-height:280px;display:grid;place-items:center}.dialog-art .art-canvas{width:min(60vh,100%);margin:auto;box-shadow:none}.dialog-copy{padding:0 clamp(1.2rem,4vw,3rem) 2.4rem;text-align:center}.dialog-copy h3{font:500 clamp(2rem,5vw,4rem) var(--serif);margin:.5rem;letter-spacing:-.045em}.dialog-copy p{font:600 1rem var(--hand)}.dialog-meta,.dialog-availability{color:#765230}.dialog-close{position:absolute;right:1rem;top:1rem;z-index:5;width:42px;height:42px;border:0;border-radius:50%;background:var(--ink);color:white;font-size:1.8rem;cursor:pointer}.dialog-nav{position:absolute;top:50%;z-index:4;width:48px;height:48px;border:0;border-radius:50%;background:var(--ink);color:white;font-size:1.6rem;cursor:pointer}.dialog-prev{left:-24px}.dialog-next{right:-24px}

/* Riot's paper world */
.riot-page{background:#d7c29a;background-image:linear-gradient(90deg,rgba(76,51,28,.04) 1px,transparent 1px),linear-gradient(rgba(76,51,28,.035) 1px,transparent 1px);background-size:24px 24px}.riot-header{position:fixed;color:var(--ink)}.riot-header .wordmark span{color:var(--pink)}.back-home{font:600 1rem var(--hand);border-bottom:1px solid}.riot-hero{position:relative;min-height:100svh;padding:8rem 5vw 5rem;display:grid;grid-template-columns:1fr minmax(280px,440px) 1fr;align-items:center;gap:4vw;overflow:hidden}.riot-hero::before{content:"";position:absolute;width:55vw;height:55vw;border:7vw solid rgba(207,71,114,.12);border-radius:50%;right:-19vw;top:-22vw}.tape-label{position:absolute;top:17%;left:7%;background:#e4b64a;padding:.7rem 2.8rem;font:600 1.1rem var(--hand);transform:rotate(-7deg);box-shadow:0 3px 8px #68451d33}.riot-title-wrap{text-align:center;z-index:2}.riot-title-wrap>p{font:600 clamp(1.4rem,3vw,2.3rem) var(--hand);margin:0;transform:rotate(-4deg)}.riot-title-wrap h1{margin:0 0 1.5rem;font:700 clamp(6.5rem,17vw,14rem)/.75 var(--hand);color:var(--pink);letter-spacing:-.08em;text-shadow:5px 5px 0 var(--gold),9px 9px 0 var(--ink);transform:rotate(-3deg);padding-bottom:.5rem}.riot-title-wrap>span{display:block;margin-top:1rem;font:500 1.05rem var(--serif)}.hero-polaroid{position:relative;z-index:2;background:#f3e9d5;padding:1rem 1rem 3.8rem;box-shadow:12px 16px 0 rgba(63,45,25,.22);transform:rotate(5deg);transition:transform .2s}.hero-polaroid p{position:absolute;bottom:.8rem;left:0;width:100%;text-align:center;margin:0;font:600 1.2rem var(--hand)}.riot-photo-placeholder svg{display:block;width:100%;height:auto}.riot-doodles{font:600 1.4rem var(--hand);align-self:stretch;display:flex;flex-direction:column;justify-content:space-around;transform:rotate(4deg)}.riot-doodles b{font-size:5rem;color:var(--red)}.riot-doodles i{font-weight:600}.riot-scroll{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);font:600 1rem var(--hand);border-bottom:2px solid}

.riot-chapters{position:relative;padding:10rem max(5vw,1rem);overflow:hidden}.paw-trail{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}.paw-trail span{position:absolute;display:block;opacity:0;transition:opacity 1.4s ease-out;width:var(--ps,22px);height:calc(var(--ps,22px) * .72)}.paw-trail span::before{content:"";position:absolute;inset:0;border-radius:48% 48% 55% 55%;background:var(--pc,rgba(36,31,24,.14))}.paw-trail span::after{content:"";position:absolute;width:30%;height:42%;left:-7%;top:-40%;border-radius:50%;background:var(--pc,rgba(36,31,24,.14));box-shadow:calc(var(--ps,22px) * .34) calc(var(--ps,22px) * -.1) 0 calc(var(--ps,22px) * -.06) var(--pc,rgba(36,31,24,.14)),calc(var(--ps,22px) * .64) 0 0 var(--pc,rgba(36,31,24,.14)),calc(var(--ps,22px) * .92) calc(var(--ps,22px) * -.08) 0 calc(var(--ps,22px) * -.04) var(--pc,rgba(36,31,24,.14))}.story-entry{position:relative;z-index:2;max-width:1150px;margin:0 auto 11rem;display:grid;grid-template-columns:1fr 1.2fr;align-items:center;gap:clamp(2rem,8vw,8rem)}.story-right .scrap-photo{grid-column:2}.story-right .story-copy{grid-column:1;grid-row:1;text-align:right}.scrap-photo{aspect-ratio:4/3;border:13px solid #eee0c5;box-shadow:9px 12px 0 #4c321f33;display:grid;place-items:center;font:600 2rem var(--hand);clip-path:polygon(1% 2%,98% 0,100% 96%,95% 100%,3% 97%,0 30%)}.photo-warm{background:linear-gradient(135deg,#dc734c,#efbd46)}.photo-blue{background:linear-gradient(135deg,#234e8c,#7dafb0)}.photo-green{background:linear-gradient(135deg,#37624b,#b1bd63)}.photo-pink{background:linear-gradient(135deg,#c83f70,#eba69c)}.story-copy{background:#eadab9;padding:clamp(1.4rem,3vw,2.5rem);box-shadow:7px 9px 0 rgba(65,42,22,.15);transform:rotate(-1deg)}.story-right .story-copy{transform:rotate(1.5deg)}.chapter{font:700 1rem var(--hand);color:var(--pink);margin:0}.story-copy h2{margin:.3rem 0 1.2rem;font:500 clamp(2rem,4vw,4rem)/1 var(--serif);letter-spacing:-.04em}.story-copy>p:not(.chapter){line-height:1.75}.hand-note{display:inline-block;margin-top:1rem;font:600 1.1rem var(--hand);color:#89512e;transform:rotate(-3deg)}
.story-entry:nth-child(odd) .scrap-photo{transform:rotate(-2.2deg)}.story-entry:nth-child(even) .scrap-photo{transform:rotate(2.4deg)}
.story-entry.is-visible .scrap-photo{animation:scrap-land .68s cubic-bezier(.2,.8,.2,1) both}.story-entry.is-visible .story-copy{animation:scrap-land .72s .08s cubic-bezier(.2,.8,.2,1) both}
@keyframes scrap-land{from{opacity:0;transform:translateY(28px) rotate(0deg)}to{opacity:1}}

.riot-facts{position:relative;z-index:2;background:var(--blue);color:var(--cream);padding:8rem max(5vw,1rem);isolation:isolate}.riot-facts h2{text-align:center;font:600 clamp(3rem,7vw,6rem) var(--hand);margin:0 0 4rem}.fact-board{max-width:1000px;margin:auto;display:grid;grid-template-columns:1fr 1fr;border:2px solid var(--cream);transform:rotate(-.5deg)}.fact-board p{margin:0;padding:1.5rem;border-bottom:1px solid rgba(242,230,204,.6);display:flex;justify-content:space-between;gap:1rem}.fact-board p:nth-child(odd){border-right:1px solid rgba(242,230,204,.6)}.fact-board span{font:.65rem var(--sans);text-transform:uppercase;letter-spacing:.16em}.fact-board strong{font:600 1.3rem var(--hand);text-align:right;color:var(--gold)}

.riot-ending{min-height:80vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:6rem 1.5rem}.riot-ending>p{font:600 1.4rem var(--hand);color:var(--pink)}.riot-ending h2{font:500 clamp(3rem,7vw,7rem)/.95 var(--serif);letter-spacing:-.055em;margin:1rem}.big-link.dark{color:var(--ink)}.big-link.dark:hover{color:var(--pink)}.riot-footer{display:flex;justify-content:space-between;padding:1.5rem 5vw;background:var(--ink);color:var(--cream);font:600 1rem var(--hand)}.paw-pop{width:var(--s);height:calc(var(--s) * .72);color:var(--c);border-radius:48% 48% 55% 55%;background:currentColor;transform:rotate(var(--r));animation:paw-away 1.2s ease-out forwards}.paw-pop::before{content:"";position:absolute;width:36%;height:45%;left:-8%;top:-48%;border-radius:50%;background:currentColor;box-shadow:calc(var(--s) * .34) calc(var(--s) * -.13) 0 calc(var(--s) * -.02) currentColor,calc(var(--s) * .68) 0 0 currentColor}.paw-pop::after{content:"";position:absolute;width:31%;height:38%;right:-10%;top:-36%;border-radius:50%;background:currentColor}@keyframes paw-away{to{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(.4)}}

/* Progress bars */
.section-progress,.riot-progress{position:fixed;left:0;right:0;top:0;height:4px;z-index:300;pointer-events:none;background:rgba(242,230,204,.16)}.section-progress span,.riot-progress span{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--gold),var(--pink),var(--green));transform:scaleX(0);transform-origin:left center;transition:transform .08s linear;clip-path:polygon(0 0,100% 18%,99% 100%,0 78%)}

/* Page transition — two-phase cross-page color fade */
.page-wipe{position:fixed;inset:0;z-index:500;background:var(--page-transition-color,#11182f);opacity:0;pointer-events:none;transition:opacity .35s ease}
.is-page-leaving .page-wipe{opacity:1}
.is-arriving .page-wipe{opacity:1;background:var(--arrival-color,#11182f)}
.is-arriving .page-wipe.is-faded{opacity:0}

/* Hero entrance choreography */
.hero-kicker,.hero-title span,.hero-title b,.hero-statement,.paint-scroll,.hero-note{opacity:0}
.is-ready .hero-kicker{animation:hero-rise .65s .28s ease forwards}
.is-ready .hero-title span,.is-ready .hero-title b{animation:title-settle .72s cubic-bezier(.2,.8,.2,1) forwards,title-float 4s ease-in-out 1.05s infinite alternate}
.is-ready .hero-title span:nth-child(1){animation-delay:.38s,1.1s}.is-ready .hero-title span:nth-child(2){animation-delay:.43s,1.2s}.is-ready .hero-title span:nth-child(3){animation-delay:.5s,1.05s}.is-ready .hero-title span:nth-child(4){animation-delay:.47s,1.25s}.is-ready .hero-title span:nth-child(5){animation-delay:.57s,1.1s}.is-ready .hero-title span:nth-child(6){animation-delay:.52s,1.22s}.is-ready .hero-title b{animation-delay:.62s,1.16s}.is-ready .hero-title span:nth-child(8){animation-delay:.68s,1.08s}.is-ready .hero-title span:nth-child(9){animation-delay:.72s,1.18s}
.is-ready .hero-statement{animation:hero-rise .7s 1.02s ease forwards}
.is-ready .paint-scroll{animation:hero-rise .55s 1.22s ease forwards}
.is-ready .hero-note{animation:hero-rise .55s 1.35s ease forwards}
@keyframes hero-rise{from{opacity:0;transform:translateY(20px)}to{opacity:1}}
@keyframes title-settle{from{opacity:0;transform:translateY(.28em) rotate(-2deg);filter:blur(5px)}to{opacity:1;transform:translateY(0) rotate(0);filter:blur(0)}}

.hero-orbit-one{transform:translate3d(calc(var(--parallax-x,0px) * .7),calc(var(--parallax-y,0px) * .25),0)}
.hero-orbit-two{transform:translate3d(calc(var(--parallax-x,0px) * -.6),calc(var(--parallax-y,0px) * -.22),0)}

.riot-title-wrap h1{animation:riot-bob 4s ease-in-out infinite alternate}
@keyframes riot-bob{0%{transform:rotate(-3deg) translateY(0)}100%{transform:rotate(-1.5deg) translateY(-.03em)}}

.chapter-nav{position:sticky;top:.7rem;z-index:80;display:flex;justify-content:center;gap:.8rem;flex-wrap:wrap;padding:.7rem 1rem;pointer-events:none}
.chapter-nav a{pointer-events:auto;background:#eadab9;color:var(--ink);border:1px solid rgba(21,21,21,.25);padding:.45rem .8rem;font:600 .9rem var(--hand);transform:rotate(-1deg);box-shadow:3px 4px 0 rgba(65,42,22,.12)}

/* Error page */
.error-page{min-height:100svh;background:radial-gradient(circle at 20% 20%,rgba(239,189,70,.24),transparent 30%),var(--night);color:var(--cream)}.not-found{min-height:100svh;display:grid;place-content:center;gap:1.4rem;padding:clamp(2rem,8vw,8rem);max-width:900px}.not-found h1{margin:0;font:600 clamp(4rem,13vw,10rem)/.8 var(--hand);color:var(--gold);letter-spacing:-.08em}.not-found p{max-width:34rem;font:300 1.15rem/1.7 var(--sans)}

@media (pointer:coarse),(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .cursor-brush{display:none}
  .paper-grain{animation:none}
  .hero-title span,.hero-title b,.hero-orbit,.paint-scroll i,.riot-title-wrap h1{animation:none}
  .hero-kicker,.hero-title span,.hero-title b,.hero-statement,.paint-scroll,.hero-note,.sky-canvas{opacity:1}
  .reveal{opacity:1;transform:none}
  .art-canvas{transition:none}
  .page-wipe{display:none}
  .art-dialog{transition:none}
  .paw-trail span{transition:none;opacity:var(--po,.5)}
}
@media (max-width:800px){
  .site-header{align-items:flex-start}.site-header::before{inset:.75rem}.menu-toggle{display:flex;align-items:center;gap:.6rem;z-index:2;font:600 1rem var(--hand)}.menu-toggle i{width:22px;height:2px;background:currentColor;box-shadow:0 6px currentColor}.site-nav{position:fixed;inset:0;display:flex;flex-direction:column;justify-content:center;background:var(--night);font-size:1rem;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;color:var(--cream)}.site-nav.is-open{opacity:1;visibility:visible}.site-nav a{font:400 2rem var(--serif)}
  .hero-note{display:none}.hero-title{font-size:clamp(5rem,25vw,9rem)}.hero-statement{font-size:1rem}
  .section-heading{grid-template-columns:1fr;gap:1.4rem}.section-heading h2{font-size:clamp(3rem,14vw,5rem)}.section-intro{max-width:100%}
  .gallery{display:block}.art-card{display:block;width:100%;margin:0 0 4rem}.art-card:nth-child(even){margin-left:auto;width:88%}.art-card:nth-child(3){width:82%}.art-card-five{width:95%}.art-caption{align-items:flex-start;flex-direction:column;gap:.2rem}
  .about-section{grid-template-columns:1fr;padding-top:7rem;padding-bottom:7rem}.about-copy h2{font-size:clamp(3rem,13vw,5rem)}.about-note{max-width:90%;margin:auto}.shop-grid{grid-template-columns:1fr}.shop-card{min-height:260px;border-right:0;border-bottom:1px solid}.shop-card:last-child{border-bottom:0}.link-list a{grid-template-columns:1fr auto}.link-list small{display:none}.site-footer{flex-direction:column}
  .dialog-prev{left:.5rem}.dialog-next{right:.5rem}.dialog-nav{top:auto;bottom:1rem}.art-dialog{width:min(94vw,700px)}.riot-header{align-items:center}.back-home{font-size:.85rem}.riot-hero{padding-top:9rem;grid-template-columns:1fr;gap:2.5rem}.tape-label{top:7rem;left:4%;font-size:.9rem}.riot-title-wrap{order:1}.hero-polaroid{order:2;width:min(85%,400px);margin:auto}.riot-doodles{display:none}.riot-scroll{display:none}.chapter-nav{position:relative;top:auto}.paw-trail span{transition:opacity .8s ease-out}.story-entry{grid-template-columns:1fr;gap:1.5rem;margin-bottom:7rem;padding-left:1.5rem}.story-right .scrap-photo,.story-right .story-copy{grid-column:1;grid-row:auto;text-align:left}.story-copy,.story-right .story-copy{transform:rotate(-1deg)}.fact-board{grid-template-columns:1fr}.fact-board p:nth-child(odd){border-right:0}.riot-footer{flex-direction:column}.riot-title-wrap h1{font-size:clamp(7rem,35vw,12rem)}
}
