@import "https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,600;0,700;0,800;0,900;1,800;1,900&family=Inter:wght@500;600;700;800&display=swap";.pipeline-screen{height:100vh;min-height:560px;color:var(--ink);background:linear-gradient(100deg, transparent 0 82%, var(--yellow) 82.1% 100%), linear-gradient(176deg, transparent 0 93%, var(--red) 93.1%), var(--paper);grid-template:"header header""stage log"minmax(0,1fr)"timeline timeline"/minmax(0,1fr) clamp(240px,22vw,340px);gap:18px 26px;padding:22px clamp(18px,3vw,48px) 24px;display:grid;overflow:hidden}.pipeline-screen:after{opacity:.16;-webkit-mask-image:radial-gradient(at 45%,#0000 35%,#000 100%);mask-image:radial-gradient(at 45%,#0000 35%,#000 100%)}.pipeline-header{grid-area:header;justify-items:start;gap:6px;display:grid}.pipeline-eyebrow{background:var(--yellow);border:2px solid var(--ink);letter-spacing:.16em;padding:5px 10px 4px;font:800 11px/1 Inter,sans-serif;transform:rotate(-1.5deg)}.pipeline-header h1{letter-spacing:-.01em;text-shadow:4px 4px 0 var(--red);margin:0;font:italic 900 clamp(34px,4.4vw,66px)/.9 Barlow Condensed,sans-serif}.pipeline-stage{border:4px solid var(--ink);min-height:0;box-shadow:12px 12px 0 var(--ink);clip-path:polygon(0 0,100% .8%,99.4% 100%,.5% 99%);background:radial-gradient(#0a0b0f12 1px,#0000 1.3px) 0 0/9px 9px,#fffdf6;grid-area:stage;position:relative;overflow:hidden;transform:rotate(-.5deg)}.pipeline-caption{z-index:6;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:#fff3b8;padding:7px 12px 6px;animation:.45s cubic-bezier(.18,.9,.25,1.3) both pl-caption-in;display:grid;position:absolute;top:16px;left:18px;transform:rotate(-1deg)}.pipeline-caption small{color:var(--red);letter-spacing:.14em;font:800 10px/1.2 Inter,sans-serif}.pipeline-caption strong{font:italic 900 clamp(20px,2.1vw,32px)/1 Barlow Condensed,sans-serif}@keyframes pl-caption-in{0%{opacity:0;transform:translate(-24px)rotate(-4deg)}}.pl-layer{opacity:0;pointer-events:none;grid-template-rows:minmax(0,1fr);place-items:center;transition:opacity .55s,transform .7s cubic-bezier(.18,.9,.25,1);display:grid;position:absolute;inset:78px 28px 26px;transform:scale(.96)}.pl-layer.is-on{opacity:1;transform:none}.pl-layer.is-past{transform:scale(1.04)}.pl-extracted,.pl-sfx,.pl-view,.pl-tags li,.pl-clips li{opacity:0;transform:scale(.7) rotate(var(--tilt,0deg));transition:opacity .3s,transform .5s cubic-bezier(.18,.9,.25,1.35)}.pl-pop{opacity:1;transform:scale(1) rotate(var(--tilt,0deg))}.pl-sfx{--tilt:10deg;z-index:4;color:var(--yellow);letter-spacing:.03em;-webkit-text-stroke:2px var(--ink);text-shadow:4px 4px 0 var(--ink);font:400 clamp(34px,4vw,64px)/1 Bangers,Impact,sans-serif;position:absolute;top:6%;right:6%}.pl-page{transform-origin:54.7% 31.5%;max-width:100%;height:100%;transition:transform 1.1s cubic-bezier(.6,0,.3,1),opacity .6s .5s;position:relative}.pl-page img{border:3px solid var(--ink);background:#fff;width:100%;height:100%;display:block;box-shadow:6px 6px #0a0b0f59}.pl-page--lift{opacity:0;transform:scale(2.8)}.pl-scan{background:linear-gradient(to bottom, transparent, #1d72ea52 85%, var(--blue) 86% 88%, transparent 88%);height:14%;animation:1.5s ease-in-out 2 both pl-scan;position:absolute;inset:0 0 auto}@keyframes pl-scan{0%{transform:translateY(-100%)}to{transform:translateY(715%)}}.pl-box{border:3px solid var(--blue);opacity:0;background:#1d72ea14;transition:opacity .2s,transform .35s cubic-bezier(.18,.9,.25,1.2);position:absolute;transform:scale(1.4)}.pl-box--on{opacity:1;transform:none}.pl-box b{background:var(--blue);color:#fff;letter-spacing:.08em;white-space:nowrap;padding:2px 5px 1px;font:800 9px/1.2 Inter,sans-serif;position:absolute;bottom:100%;left:-3px}.pl-box--hero{border-color:var(--red);background:#f044311a}.pl-box--hero b{background:var(--red)}.pl-extracted{mix-blend-mode:multiply;height:92%;position:absolute}.pl-views{grid-template-rows:minmax(0,1fr) auto;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:18px 16px}.pl-view{--tilt:-1.5deg;border:3px solid var(--ink);min-height:0;box-shadow:5px 5px 0 var(--ink);background:#fff;margin:0;display:grid;position:relative}.pl-view:nth-child(2n){--tilt:1.5deg}.pl-view img{object-fit:contain;mix-blend-mode:multiply;width:100%;height:100%;min-height:0}.pl-view figcaption{background:var(--ink);color:var(--cream);letter-spacing:.14em;padding:3px 7px 2px;font:800 10px/1 Inter,sans-serif;position:absolute;top:8px;left:8px}.pl-meter{grid-column:1/-1;grid-template-columns:auto 1fr;align-items:baseline;gap:4px 14px;width:min(520px,100%);display:grid}.pl-meter span{letter-spacing:.16em;font:800 11px/1 Inter,sans-serif}.pl-meter strong{font-variant-numeric:tabular-nums;justify-self:end;font:italic 900 30px/1 Barlow Condensed,sans-serif}.pl-meter i{border:3px solid var(--ink);background:linear-gradient(90deg, var(--blue) calc(var(--fill) * 100%), #fff calc(var(--fill) * 100%));grid-column:1/-1;height:12px}.pl-live{z-index:2;pointer-events:none;width:calc(60% - 28px);position:absolute;top:78px;bottom:26px;left:28px}.pipeline-stage--live .pl-sprite{visibility:hidden}.pl-turn,.pl-run{grid-template-columns:60% minmax(0,1fr);gap:clamp(16px,3vw,40px)}.pl-sprite{aspect-ratio:1;background-repeat:no-repeat;height:min(100%,52vh)}.pl-sprite--24{background-size:2400% 100%;animation:2.8s steps(24,end) infinite pl-sprite-24}.pl-sprite--16{background-size:1600% 100%;animation:.62s steps(16,end) infinite pl-sprite-16}@keyframes pl-sprite-24{0%{background-position:0 0}to{background-position:104.348% 0}}@keyframes pl-sprite-16{0%{background-position:0 0}to{background-position:106.667% 0}}.pl-tags{gap:12px;margin:0;padding:0;list-style:none;display:grid}.pl-tags li{--tilt:-1deg;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);letter-spacing:.14em;background:#fff;justify-self:start;padding:7px 11px 6px;font:800 10px/1.2 Inter,sans-serif;display:grid}.pl-tags li:nth-child(2n){--tilt:1deg}.pl-tags b{letter-spacing:0;font-variant-numeric:tabular-nums;font:italic 900 30px/1 Barlow Condensed,sans-serif}.pl-run .pl-sprite{z-index:1;height:min(100%,46vh);position:relative}.pl-speed{background:repeating-linear-gradient(#0000 0 22px,#0a0b0f38 22px 25px,#0000 25px 46px);animation:.35s linear infinite pl-speed;position:absolute;inset:22% 42% 26% 4%;-webkit-mask-image:linear-gradient(90deg,#0000,#000 30% 55%,#0000);mask-image:linear-gradient(90deg,#0000,#000 30% 55%,#0000)}@keyframes pl-speed{0%{background-position:0 0}to{background-position:0 46px}}.pl-clips{flex-wrap:wrap;justify-content:flex-start;gap:8px;max-width:300px;margin:0;padding:0;list-style:none;display:flex}.pl-clips li{border:2px solid var(--ink);letter-spacing:.08em;background:#fff;padding:5px 9px 4px;font:800 11px/1 Inter,sans-serif}.pl-clips li.pl-clip--live{background:var(--yellow);box-shadow:3px 3px 0 var(--ink)}.pl-sfx--woof{--tilt:-8deg;color:var(--red);top:10%;left:8%;right:auto}.pipeline-log{background:var(--ink);min-height:0;color:var(--cream);border:4px solid var(--ink);box-shadow:10px 10px 0 var(--red);grid-area:log;padding:34px 16px 16px;position:relative;overflow:hidden;transform:rotate(.8deg)}.pipeline-log__title{background:var(--yellow);color:var(--ink);letter-spacing:.16em;padding:5px 9px 4px;font:800 10px/1 Inter,sans-serif;position:absolute;top:-4px;left:12px;transform:rotate(-2deg)}.pipeline-log ol{gap:9px;margin:0;padding:0;font:600 12px/1.35 ui-monospace,Cascadia Mono,Consolas,monospace;list-style:none;display:grid}.pipeline-log li{animation:.35s both pl-log-in}.pipeline-log time{color:var(--yellow)}.pipeline-log li:last-child:after{content:"▍";color:var(--yellow);animation:.8s steps(2,end) infinite pl-blink}@keyframes pl-log-in{0%{opacity:0;transform:translate(10px)}}@keyframes pl-blink{to{visibility:hidden}}.pipeline-timeline{grid-area:timeline;grid-template-columns:repeat(6,1fr);margin:0;padding:0 4%;list-style:none;display:grid;position:relative}.pipeline-timeline:before,.pipeline-timeline__fill{content:"";background:#0a0b0f26;height:6px;position:absolute;top:19px;left:12%;right:12%}.pipeline-timeline__fill{background:var(--ink);transform-origin:0;transform:scaleX(var(--progress))}.pipeline-timeline li{color:#0a0b0f73;justify-items:center;gap:6px;font:italic 900 clamp(14px,1.4vw,20px)/1 Barlow Condensed,sans-serif;transition:color .3s;display:grid;position:relative}.pipeline-timeline li span{background:var(--paper);border:4px solid;border-radius:50%;place-items:center;width:44px;height:44px;font:italic 900 22px/1 Barlow Condensed,sans-serif;transition:background .3s,transform .4s cubic-bezier(.18,.9,.25,1.4);display:grid}.pipeline-timeline li.is-on,.pipeline-timeline li.is-past{color:var(--ink)}.pipeline-timeline li.is-on span{background:var(--yellow);box-shadow:3px 3px 0 var(--ink);transform:scale(1.15)rotate(-6deg)}.pipeline-timeline li.is-past span{background:var(--ink);color:var(--yellow);border-color:var(--ink)}.pipeline-skip{border:2px solid var(--ink);background:var(--paper);letter-spacing:.14em;cursor:pointer;padding:6px 10px 5px;font:800 11px/1 Inter,sans-serif;position:absolute;top:26px;right:clamp(18px,3vw,48px)}.pipeline-skip:hover{background:var(--yellow)}@media (max-width:900px){.pipeline-screen{grid-template:"header""stage"60vh"timeline""log"/1fr;height:auto;min-height:100vh}.pipeline-log{max-height:220px}.pl-views{grid-template-columns:repeat(2,minmax(0,1fr))}.pl-turn{grid-template-columns:1fr}.pl-tags{display:none}}@media (prefers-reduced-motion:reduce){.pl-scan,.pl-speed{animation:none}}.wp-dim{z-index:4;pointer-events:none;background:radial-gradient(#0a0b0f26,#0a0b0f8c 75%);position:absolute;inset:0}.wp-card{z-index:5;width:min(860px,84vw,149.333vh - 213.333px);color:var(--ink);border:4px solid var(--ink);box-shadow:12px 12px 0 var(--ink);background:radial-gradient(#0a0b0f12 1px,#0000 1.3px) 0 0/9px 9px,#fffdf6;padding:62px 18px 16px;animation:.45s cubic-bezier(.18,.9,.25,1.2) both wp-card-in;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(-.6deg)}@keyframes wp-card-in{0%{opacity:0;transform:translate(-50%,-46%)rotate(-3deg)scale(.92)}}.wp-caption{border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:#fff3b8;padding:6px 11px 5px;animation:.4s cubic-bezier(.18,.9,.25,1.3) both pl-caption-in;display:grid;position:absolute;top:12px;left:16px;transform:rotate(-1deg)}.wp-caption small{color:var(--red);letter-spacing:.14em;font:800 10px/1.2 Inter,sans-serif}.wp-caption strong{font:italic 900 clamp(18px,1.8vw,26px)/1 Barlow Condensed,sans-serif}.wp-stage{aspect-ratio:16/9;border:3px solid var(--ink);background:#0d1420;position:relative;overflow:hidden}.wp-views{transition:opacity .4s;position:absolute;inset:0}.wp-views--gone{opacity:0}.wp-view{left:calc(1% + var(--col) * 50%);top:calc(1% + var(--row) * 50%);opacity:0;width:48%;height:48%;margin:0;transition:left .6s cubic-bezier(.6,0,.3,1),top .6s cubic-bezier(.6,0,.3,1),width .6s cubic-bezier(.6,0,.3,1),height .6s cubic-bezier(.6,0,.3,1),opacity .25s,transform .35s cubic-bezier(.18,.9,.25,1.4);position:absolute;transform:scale(.8)}.wp-view.is-on{opacity:1;transform:none}.wp-views--strip .wp-view{left:calc(var(--i) * 25%);width:25%;height:25%;top:37.5%}.wp-view img{object-fit:cover;border:2px solid var(--ink);width:100%;height:100%;display:block}.wp-view figcaption{background:var(--yellow);border:2px solid var(--ink);padding:2px 6px 1px;font:italic 900 14px/1 Barlow Condensed,sans-serif;transition:opacity .3s;position:absolute;top:6px;left:6px}.wp-views--strip figcaption{opacity:0}.wp-seams{opacity:0;height:30%;transition:opacity .25s;position:absolute;top:35%;left:0;right:0}.wp-seams.is-on{opacity:1}.wp-seams i{border-left:3px dashed var(--red);width:0;position:absolute;top:0;bottom:0}.wp-seams i:first-child{left:25%}.wp-seams i:nth-child(2){left:50%}.wp-seams i:nth-child(3){left:75%}.wp-pano{object-fit:cover;opacity:0;width:100%;height:89%;transition:opacity .4s,transform .6s cubic-bezier(.6,0,.3,1);position:absolute;top:5.5%;left:0;transform:scaleY(.3)}.wp-pano.is-on{opacity:1;transform:none}.wp-world{object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .6s;position:absolute;inset:0}.wp-world.is-on{opacity:1}.wp-meter{z-index:2;background:var(--ink);color:var(--cream);font-variant-numeric:tabular-nums;padding:4px 9px 3px;font:600 12px/1.2 ui-monospace,Cascadia Mono,Consolas,monospace;position:absolute;bottom:10px;right:10px}.wp-steps{justify-content:center;gap:54px;margin:14px 0 0;padding:0;list-style:none;display:flex;position:relative}.wp-steps:before{content:"";background:#0a0b0f33;height:4px;position:absolute;top:50%;left:calc(50% - 64px);right:calc(50% - 64px)}.wp-steps li span{color:#0a0b0f73;background:#fffdf6;border:3px solid #0a0b0f66;border-radius:50%;place-items:center;width:34px;height:34px;font:italic 900 17px/1 Barlow Condensed,sans-serif;transition:background .3s,transform .35s cubic-bezier(.18,.9,.25,1.4);display:grid;position:relative}.wp-steps li.is-on span{border-color:var(--ink);background:var(--yellow);color:var(--ink);transform:scale(1.15)rotate(-6deg)}.wp-steps li.is-past span{border-color:var(--ink);background:var(--ink);color:var(--yellow)}@layer theme{@theme default{--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --color-red-50: oklch(97.1% .013 17.38); --color-red-100: oklch(93.6% .032 17.717); --color-red-200: oklch(88.5% .062 18.334); --color-red-300: oklch(80.8% .114 19.571); --color-red-400: oklch(70.4% .191 22.216); --color-red-500: oklch(63.7% .237 25.331); --color-red-600: oklch(57.7% .245 27.325); --color-red-700: oklch(50.5% .213 27.518); --color-red-800: oklch(44.4% .177 26.899); --color-red-900: oklch(39.6% .141 25.723); --color-red-950: oklch(25.8% .092 26.042); --color-orange-50: oklch(98% .016 73.684); --color-orange-100: oklch(95.4% .038 75.164); --color-orange-200: oklch(90.1% .076 70.697); --color-orange-300: oklch(83.7% .128 66.29); --color-orange-400: oklch(75% .183 55.934); --color-orange-500: oklch(70.5% .213 47.604); --color-orange-600: oklch(64.6% .222 41.116); --color-orange-700: oklch(55.3% .195 38.402); --color-orange-800: oklch(47% .157 37.304); --color-orange-900: oklch(40.8% .123 38.172); --color-orange-950: oklch(26.6% .079 36.259); --color-amber-50: oklch(98.7% .022 95.277); --color-amber-100: oklch(96.2% .059 95.617); --color-amber-200: oklch(92.4% .12 95.746); --color-amber-300: oklch(87.9% .169 91.605); --color-amber-400: oklch(82.8% .189 84.429); --color-amber-500: oklch(76.9% .188 70.08); --color-amber-600: oklch(66.6% .179 58.318); --color-amber-700: oklch(55.5% .163 48.998); --color-amber-800: oklch(47.3% .137 46.201); --color-amber-900: oklch(41.4% .112 45.904); --color-amber-950: oklch(27.9% .077 45.635); --color-yellow-50: oklch(98.7% .026 102.212); --color-yellow-100: oklch(97.3% .071 103.193); --color-yellow-200: oklch(94.5% .129 101.54); --color-yellow-300: oklch(90.5% .182 98.111); --color-yellow-400: oklch(85.2% .199 91.936); --color-yellow-500: oklch(79.5% .184 86.047); --color-yellow-600: oklch(68.1% .162 75.834); --color-yellow-700: oklch(55.4% .135 66.442); --color-yellow-800: oklch(47.6% .114 61.907); --color-yellow-900: oklch(42.1% .095 57.708); --color-yellow-950: oklch(28.6% .066 53.813); --color-lime-50: oklch(98.6% .031 120.757); --color-lime-100: oklch(96.7% .067 122.328); --color-lime-200: oklch(93.8% .127 124.321); --color-lime-300: oklch(89.7% .196 126.665); --color-lime-400: oklch(84.1% .238 128.85); --color-lime-500: oklch(76.8% .233 130.85); --color-lime-600: oklch(64.8% .2 131.684); --color-lime-700: oklch(53.2% .157 131.589); --color-lime-800: oklch(45.3% .124 130.933); --color-lime-900: oklch(40.5% .101 131.063); --color-lime-950: oklch(27.4% .072 132.109); --color-green-50: oklch(98.2% .018 155.826); --color-green-100: oklch(96.2% .044 156.743); --color-green-200: oklch(92.5% .084 155.995); --color-green-300: oklch(87.1% .15 154.449); --color-green-400: oklch(79.2% .209 151.711); --color-green-500: oklch(72.3% .219 149.579); --color-green-600: oklch(62.7% .194 149.214); --color-green-700: oklch(52.7% .154 150.069); --color-green-800: oklch(44.8% .119 151.328); --color-green-900: oklch(39.3% .095 152.535); --color-green-950: oklch(26.6% .065 152.934); --color-emerald-50: oklch(97.9% .021 166.113); --color-emerald-100: oklch(95% .052 163.051); --color-emerald-200: oklch(90.5% .093 164.15); --color-emerald-300: oklch(84.5% .143 164.978); --color-emerald-400: oklch(76.5% .177 163.223); --color-emerald-500: oklch(69.6% .17 162.48); --color-emerald-600: oklch(59.6% .145 163.225); --color-emerald-700: oklch(50.8% .118 165.612); --color-emerald-800: oklch(43.2% .095 166.913); --color-emerald-900: oklch(37.8% .077 168.94); --color-emerald-950: oklch(26.2% .051 172.552); --color-teal-50: oklch(98.4% .014 180.72); --color-teal-100: oklch(95.3% .051 180.801); --color-teal-200: oklch(91% .096 180.426); --color-teal-300: oklch(85.5% .138 181.071); --color-teal-400: oklch(77.7% .152 181.912); --color-teal-500: oklch(70.4% .14 182.503); --color-teal-600: oklch(60% .118 184.704); --color-teal-700: oklch(51.1% .096 186.391); --color-teal-800: oklch(43.7% .078 188.216); --color-teal-900: oklch(38.6% .063 188.416); --color-teal-950: oklch(27.7% .046 192.524); --color-cyan-50: oklch(98.4% .019 200.873); --color-cyan-100: oklch(95.6% .045 203.388); --color-cyan-200: oklch(91.7% .08 205.041); --color-cyan-300: oklch(86.5% .127 207.078); --color-cyan-400: oklch(78.9% .154 211.53); --color-cyan-500: oklch(71.5% .143 215.221); --color-cyan-600: oklch(60.9% .126 221.723); --color-cyan-700: oklch(52% .105 223.128); --color-cyan-800: oklch(45% .085 224.283); --color-cyan-900: oklch(39.8% .07 227.392); --color-cyan-950: oklch(30.2% .056 229.695); --color-sky-50: oklch(97.7% .013 236.62); --color-sky-100: oklch(95.1% .026 236.824); --color-sky-200: oklch(90.1% .058 230.902); --color-sky-300: oklch(82.8% .111 230.318); --color-sky-400: oklch(74.6% .16 232.661); --color-sky-500: oklch(68.5% .169 237.323); --color-sky-600: oklch(58.8% .158 241.966); --color-sky-700: oklch(50% .134 242.749); --color-sky-800: oklch(44.3% .11 240.79); --color-sky-900: oklch(39.1% .09 240.876); --color-sky-950: oklch(29.3% .066 243.157); --color-blue-50: oklch(97% .014 254.604); --color-blue-100: oklch(93.2% .032 255.585); --color-blue-200: oklch(88.2% .059 254.128); --color-blue-300: oklch(80.9% .105 251.813); --color-blue-400: oklch(70.7% .165 254.624); --color-blue-500: oklch(62.3% .214 259.815); --color-blue-600: oklch(54.6% .245 262.881); --color-blue-700: oklch(48.8% .243 264.376); --color-blue-800: oklch(42.4% .199 265.638); --color-blue-900: oklch(37.9% .146 265.522); --color-blue-950: oklch(28.2% .091 267.935); --color-indigo-50: oklch(96.2% .018 272.314); --color-indigo-100: oklch(93% .034 272.788); --color-indigo-200: oklch(87% .065 274.039); --color-indigo-300: oklch(78.5% .115 274.713); --color-indigo-400: oklch(67.3% .182 276.935); --color-indigo-500: oklch(58.5% .233 277.117); --color-indigo-600: oklch(51.1% .262 276.966); --color-indigo-700: oklch(45.7% .24 277.023); --color-indigo-800: oklch(39.8% .195 277.366); --color-indigo-900: oklch(35.9% .144 278.697); --color-indigo-950: oklch(25.7% .09 281.288); --color-violet-50: oklch(96.9% .016 293.756); --color-violet-100: oklch(94.3% .029 294.588); --color-violet-200: oklch(89.4% .057 293.283); --color-violet-300: oklch(81.1% .111 293.571); --color-violet-400: oklch(70.2% .183 293.541); --color-violet-500: oklch(60.6% .25 292.717); --color-violet-600: oklch(54.1% .281 293.009); --color-violet-700: oklch(49.1% .27 292.581); --color-violet-800: oklch(43.2% .232 292.759); --color-violet-900: oklch(38% .189 293.745); --color-violet-950: oklch(28.3% .141 291.089); --color-purple-50: oklch(97.7% .014 308.299); --color-purple-100: oklch(94.6% .033 307.174); --color-purple-200: oklch(90.2% .063 306.703); --color-purple-300: oklch(82.7% .119 306.383); --color-purple-400: oklch(71.4% .203 305.504); --color-purple-500: oklch(62.7% .265 303.9); --color-purple-600: oklch(55.8% .288 302.321); --color-purple-700: oklch(49.6% .265 301.924); --color-purple-800: oklch(43.8% .218 303.724); --color-purple-900: oklch(38.1% .176 304.987); --color-purple-950: oklch(29.1% .149 302.717); --color-fuchsia-50: oklch(97.7% .017 320.058); --color-fuchsia-100: oklch(95.2% .037 318.852); --color-fuchsia-200: oklch(90.3% .076 319.62); --color-fuchsia-300: oklch(83.3% .145 321.434); --color-fuchsia-400: oklch(74% .238 322.16); --color-fuchsia-500: oklch(66.7% .295 322.15); --color-fuchsia-600: oklch(59.1% .293 322.896); --color-fuchsia-700: oklch(51.8% .253 323.949); --color-fuchsia-800: oklch(45.2% .211 324.591); --color-fuchsia-900: oklch(40.1% .17 325.612); --color-fuchsia-950: oklch(29.3% .136 325.661); --color-pink-50: oklch(97.1% .014 343.198); --color-pink-100: oklch(94.8% .028 342.258); --color-pink-200: oklch(89.9% .061 343.231); --color-pink-300: oklch(82.3% .12 346.018); --color-pink-400: oklch(71.8% .202 349.761); --color-pink-500: oklch(65.6% .241 354.308); --color-pink-600: oklch(59.2% .249 .584); --color-pink-700: oklch(52.5% .223 3.958); --color-pink-800: oklch(45.9% .187 3.815); --color-pink-900: oklch(40.8% .153 2.432); --color-pink-950: oklch(28.4% .109 3.907); --color-rose-50: oklch(96.9% .015 12.422); --color-rose-100: oklch(94.1% .03 12.58); --color-rose-200: oklch(89.2% .058 10.001); --color-rose-300: oklch(81% .117 11.638); --color-rose-400: oklch(71.2% .194 13.428); --color-rose-500: oklch(64.5% .246 16.439); --color-rose-600: oklch(58.6% .253 17.585); --color-rose-700: oklch(51.4% .222 16.935); --color-rose-800: oklch(45.5% .188 13.697); --color-rose-900: oklch(41% .159 10.272); --color-rose-950: oklch(27.1% .105 12.094); --color-slate-50: oklch(98.4% .003 247.858); --color-slate-100: oklch(96.8% .007 247.896); --color-slate-200: oklch(92.9% .013 255.508); --color-slate-300: oklch(86.9% .022 252.894); --color-slate-400: oklch(70.4% .04 256.788); --color-slate-500: oklch(55.4% .046 257.417); --color-slate-600: oklch(44.6% .043 257.281); --color-slate-700: oklch(37.2% .044 257.287); --color-slate-800: oklch(27.9% .041 260.031); --color-slate-900: oklch(20.8% .042 265.755); --color-slate-950: oklch(12.9% .042 264.695); --color-gray-50: oklch(98.5% .002 247.839); --color-gray-100: oklch(96.7% .003 264.542); --color-gray-200: oklch(92.8% .006 264.531); --color-gray-300: oklch(87.2% .01 258.338); --color-gray-400: oklch(70.7% .022 261.325); --color-gray-500: oklch(55.1% .027 264.364); --color-gray-600: oklch(44.6% .03 256.802); --color-gray-700: oklch(37.3% .034 259.733); --color-gray-800: oklch(27.8% .033 256.848); --color-gray-900: oklch(21% .034 264.665); --color-gray-950: oklch(13% .028 261.692); --color-zinc-50: oklch(98.5% 0 none); --color-zinc-100: oklch(96.7% .001 286.375); --color-zinc-200: oklch(92% .004 286.32); --color-zinc-300: oklch(87.1% .006 286.286); --color-zinc-400: oklch(70.5% .015 286.067); --color-zinc-500: oklch(55.2% .016 285.938); --color-zinc-600: oklch(44.2% .017 285.786); --color-zinc-700: oklch(37% .013 285.805); --color-zinc-800: oklch(27.4% .006 286.033); --color-zinc-900: oklch(21% .006 285.885); --color-zinc-950: oklch(14.1% .005 285.823); --color-neutral-50: oklch(98.5% 0 none); --color-neutral-100: oklch(97% 0 none); --color-neutral-200: oklch(92.2% 0 none); --color-neutral-300: oklch(87% 0 none); --color-neutral-400: oklch(70.8% 0 none); --color-neutral-500: oklch(55.6% 0 none); --color-neutral-600: oklch(43.9% 0 none); --color-neutral-700: oklch(37.1% 0 none); --color-neutral-800: oklch(26.9% 0 none); --color-neutral-900: oklch(20.5% 0 none); --color-neutral-950: oklch(14.5% 0 none); --color-stone-50: oklch(98.5% .001 106.423); --color-stone-100: oklch(97% .001 106.424); --color-stone-200: oklch(92.3% .003 48.717); --color-stone-300: oklch(86.9% .005 56.366); --color-stone-400: oklch(70.9% .01 56.259); --color-stone-500: oklch(55.3% .013 58.071); --color-stone-600: oklch(44.4% .011 73.639); --color-stone-700: oklch(37.4% .01 67.558); --color-stone-800: oklch(26.8% .007 34.298); --color-stone-900: oklch(21.6% .006 56.043); --color-stone-950: oklch(14.7% .004 49.25); --color-mauve-50: oklch(98.5% 0 none); --color-mauve-100: oklch(96% .003 325.6); --color-mauve-200: oklch(92.2% .005 325.62); --color-mauve-300: oklch(86.5% .012 325.68); --color-mauve-400: oklch(71.1% .019 323.02); --color-mauve-500: oklch(54.2% .034 322.5); --color-mauve-600: oklch(43.5% .029 321.78); --color-mauve-700: oklch(36.4% .029 323.89); --color-mauve-800: oklch(26.3% .024 320.12); --color-mauve-900: oklch(21.2% .019 322.12); --color-mauve-950: oklch(14.5% .008 326); --color-olive-50: oklch(98.8% .003 106.5); --color-olive-100: oklch(96.6% .005 106.5); --color-olive-200: oklch(93% .007 106.5); --color-olive-300: oklch(88% .011 106.6); --color-olive-400: oklch(73.7% .021 106.9); --color-olive-500: oklch(58% .031 107.3); --color-olive-600: oklch(46.6% .025 107.3); --color-olive-700: oklch(39.4% .023 107.4); --color-olive-800: oklch(28.6% .016 107.4); --color-olive-900: oklch(22.8% .013 107.4); --color-olive-950: oklch(15.3% .006 107.1); --color-mist-50: oklch(98.7% .002 197.1); --color-mist-100: oklch(96.3% .002 197.1); --color-mist-200: oklch(92.5% .005 214.3); --color-mist-300: oklch(87.2% .007 219.6); --color-mist-400: oklch(72.3% .014 214.4); --color-mist-500: oklch(56% .021 213.5); --color-mist-600: oklch(45% .017 213.2); --color-mist-700: oklch(37.8% .015 216); --color-mist-800: oklch(27.5% .011 216.9); --color-mist-900: oklch(21.8% .008 223.9); --color-mist-950: oklch(14.8% .004 228.8); --color-taupe-50: oklch(98.6% .002 67.8); --color-taupe-100: oklch(96% .002 17.2); --color-taupe-200: oklch(92.2% .005 34.3); --color-taupe-300: oklch(86.8% .007 39.5); --color-taupe-400: oklch(71.4% .014 41.2); --color-taupe-500: oklch(54.7% .021 43.1); --color-taupe-600: oklch(43.8% .017 39.3); --color-taupe-700: oklch(36.7% .016 35.7); --color-taupe-800: oklch(26.8% .011 36.5); --color-taupe-900: oklch(21.4% .009 43.1); --color-taupe-950: oklch(14.7% .004 49.3); --color-black: #000; --color-white: #fff; --spacing: .25rem; --breakpoint-sm: 40rem; --breakpoint-md: 48rem; --breakpoint-lg: 64rem; --breakpoint-xl: 80rem; --breakpoint-2xl: 96rem; --container-3xs: 16rem; --container-2xs: 18rem; --container-xs: 20rem; --container-sm: 24rem; --container-md: 28rem; --container-lg: 32rem; --container-xl: 36rem; --container-2xl: 42rem; --container-3xl: 48rem; --container-4xl: 56rem; --container-5xl: 64rem; --container-6xl: 72rem; --container-7xl: 80rem; --text-xs: .75rem; --text-xs--line-height: calc(1 / .75); --text-sm: .875rem; --text-sm--line-height: calc(1.25 / .875); --text-base: 1rem; --text-base--line-height: calc(1.5 / 1); --text-lg: 1.125rem; --text-lg--line-height: calc(1.75 / 1.125); --text-xl: 1.25rem; --text-xl--line-height: calc(1.75 / 1.25); --text-2xl: 1.5rem; --text-2xl--line-height: calc(2 / 1.5); --text-3xl: 1.875rem; --text-3xl--line-height: calc(2.25 / 1.875); --text-4xl: 2.25rem; --text-4xl--line-height: calc(2.5 / 2.25); --text-5xl: 3rem; --text-5xl--line-height: 1; --text-6xl: 3.75rem; --text-6xl--line-height: 1; --text-7xl: 4.5rem; --text-7xl--line-height: 1; --text-8xl: 6rem; --text-8xl--line-height: 1; --text-9xl: 8rem; --text-9xl--line-height: 1; --font-weight-thin: 100; --font-weight-extralight: 200; --font-weight-light: 300; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --font-weight-extrabold: 800; --font-weight-black: 900; --tracking-tighter: -.05em; --tracking-tight: -.025em; --tracking-normal: 0em; --tracking-wide: .025em; --tracking-wider: .05em; --tracking-widest: .1em; --leading-tight: 1.25; --leading-snug: 1.375; --leading-normal: 1.5; --leading-relaxed: 1.625; --leading-loose: 2; --radius-xs: .125rem; --radius-sm: .25rem; --radius-md: .375rem; --radius-lg: .5rem; --radius-xl: .75rem; --radius-2xl: 1rem; --radius-3xl: 1.5rem; --radius-4xl: 2rem; --shadow-2xs: 0 1px #0000000d; --shadow-xs: 0 1px 2px 0 #0000000d; --shadow-sm: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a; --shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a; --shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a; --shadow-xl: 0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a; --shadow-2xl: 0 25px 50px -12px #00000040; --inset-shadow-2xs: inset 0 1px #0000000d; --inset-shadow-xs: inset 0 1px 1px #0000000d; --inset-shadow-sm: inset 0 2px 4px #0000000d; --drop-shadow-xs: 0 1px 1px #0000000d; --drop-shadow-sm: 0 1px 2px #00000026; --drop-shadow-md: 0 3px 3px #0000001f; --drop-shadow-lg: 0 4px 4px #00000026; --drop-shadow-xl: 0 9px 7px #0000001a; --drop-shadow-2xl: 0 25px 25px #00000026; --text-shadow-2xs: 0px 1px 0px #00000026; --text-shadow-xs: 0px 1px 1px #0003; --text-shadow-sm: 0px 1px 0px #00000013, 0px 1px 1px #00000013, 0px 2px 2px #00000013; --text-shadow-md: 0px 1px 1px #0000001a, 0px 1px 2px #0000001a, 0px 2px 4px #0000001a; --text-shadow-lg: 0px 1px 2px #0000001a, 0px 3px 2px #0000001a, 0px 4px 8px #0000001a; --ease-in: cubic-bezier(.4, 0, 1, 1); --ease-out: cubic-bezier(0, 0, .2, 1); --ease-in-out: cubic-bezier(.4, 0, .2, 1); --animate-spin: spin 1s linear infinite; --animate-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite; --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; --animate-bounce: bounce 1s infinite; @keyframes spin { to { transform: rotate(360deg); } } @keyframes ping { 75%, 100% { transform: scale(2); opacity: 0; } } @keyframes pulse { 50% { opacity: .5; } } @keyframes bounce { 0%, 100% { transform: translateY(-25%); animation-timing-function: cubic-bezier(.8, 0, 1, 1); } 50% { transform: none; animation-timing-function: cubic-bezier(0, 0, .2, 1); } } --blur-xs: 4px; --blur-sm: 8px; --blur-md: 12px; --blur-lg: 16px; --blur-xl: 24px; --blur-2xl: 40px; --blur-3xl: 64px; --perspective-dramatic: 100px; --perspective-near: 300px; --perspective-normal: 500px; --perspective-midrange: 800px; --perspective-distant: 1200px; --aspect-video: 16 / 9; --default-transition-duration: .15s; --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1); --default-font-family: --theme(--font-sans, initial); --default-font-feature-settings: --theme(--font-sans--font-feature-settings, initial); --default-font-variation-settings: --theme(--font-sans--font-variation-settings, initial); --default-mono-font-family: --theme(--font-mono, initial); --default-mono-font-feature-settings: --theme(--font-mono--font-feature-settings, initial); --default-mono-font-variation-settings: --theme(--font-mono--font-variation-settings, initial);}@theme default inline reference{--blur: 8px; --shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a; --shadow-inner: inset 0 2px 4px 0 #0000000d; --drop-shadow: 0 1px 2px #0000001a, 0 1px 1px #0000000f; --radius: .25rem; --max-width-prose: 65ch;}}@layer base{*,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:--theme(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:--theme(--default-font-feature-settings, normal);font-variation-settings:--theme(--default-font-variation-settings, normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:--theme(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:--theme(--default-mono-font-feature-settings, normal);font-variation-settings:--theme(--default-mono-font-variation-settings, normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{@tailwind utilities;}:root{--ink:#0a0b0f;--paper:#f3eedf;--yellow:#ffd322;--red:#f04431;--blue:#1d72ea;--cream:#fff9e9;--muted:#a6a8ad;--line:3px;color:var(--ink);background:var(--ink);font-synthesis:none;font-family:Inter,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-width:320px;overflow-x:hidden}button,input{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible{outline:3px solid var(--blue);outline-offset:4px}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.game-shell{min-height:100vh;position:relative;overflow:hidden}.screen{isolation:isolate;min-height:100vh;animation:.65s cubic-bezier(.16,1,.3,1) both screen-in;position:relative}.screen:after{content:"";z-index:-1;pointer-events:none;opacity:.12;background-image:radial-gradient(circle, var(--ink) 1.2px, transparent 1.4px);background-size:8px 8px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(115deg,#000,#0000 55%);mask-image:linear-gradient(115deg,#000,#0000 55%)}.topbar{z-index:30;justify-content:space-between;align-items:center;height:78px;padding:0 clamp(24px,4vw,72px);display:flex;position:relative}.brand{cursor:pointer;letter-spacing:-.04em;text-align:left;background:0 0;border:0;align-items:center;gap:14px;padding:0;font:900 29px/.8 Barlow Condensed,sans-serif;display:flex}.brand b{letter-spacing:.18em;font-size:18px;display:block}.brand-bolt{background:var(--yellow);border:3px solid var(--ink);clip-path:polygon(8% 12%,85% 0,100% 84%,17% 100%);place-items:center;width:54px;height:54px;font-size:38px;display:grid;transform:rotate(-5deg)}.progress{align-items:baseline;gap:8px;font-family:Barlow Condensed,sans-serif;display:flex}.progress span{letter-spacing:.16em;font-size:10px;font-weight:800}.progress strong{font-size:28px;font-style:italic}.progress i{font-size:12px;font-style:normal;font-weight:800}.comic-heading .eyebrow{background:var(--ink);color:var(--paper);letter-spacing:.18em;margin-bottom:10px;padding:6px 12px;font:800 11px/1 Inter,sans-serif;display:inline-block;transform:rotate(-1deg)}.comic-heading h1{letter-spacing:-.055em;text-transform:uppercase;text-wrap:balance;max-width:780px;margin:0;font:italic 900 clamp(48px,6.8vw,98px)/.8 Barlow Condensed,sans-serif}.comic-heading p{margin:17px 0 0;font:600 clamp(16px,1.5vw,21px)/1.3 Inter,sans-serif}.comic-heading--light{color:var(--cream)}.comic-heading--light .eyebrow{color:var(--ink);background:var(--yellow)}.game-cta{border:var(--line) solid var(--ink);background:var(--yellow);cursor:pointer;min-height:58px;box-shadow:7px 7px 0 var(--ink);clip-path:polygon(0 0,95% 0,100% 23%,97% 100%,5% 100%,0 74%);letter-spacing:.02em;justify-content:space-between;align-items:center;gap:28px;padding:0 25px 0 29px;font:italic 900 19px/1 Barlow Condensed,sans-serif;transition:transform .2s,box-shadow .2s,background .2s;display:inline-flex}.game-cta:hover{box-shadow:10px 10px 0 var(--ink);background:#ffe35d;transform:translate(-2px,-2px)skew(-1deg)}.game-cta:active{box-shadow:2px 2px 0 var(--ink);transform:translate(4px,4px)}.upload-screen{background:var(--paper)}.upload-screen:before{content:"";z-index:-1;background:linear-gradient(108deg, transparent 0 62%, var(--yellow) 62.1% 100%), linear-gradient(172deg, transparent 0 84%, var(--red) 84.2% 100%);position:absolute;inset:0}.upload-grid{grid-template-columns:minmax(420px,.85fr) minmax(420px,1.15fr);align-items:center;gap:clamp(55px,8vw,130px);min-height:calc(100vh - 78px);padding:clamp(30px,5vh,70px) clamp(24px,7vw,118px) clamp(45px,7vh,90px);display:grid}.upload-content{z-index:3;position:relative}.upload-content .comic-heading h1{font-size:clamp(62px,7vw,105px)}.upload-zone{border:3px dashed var(--ink);text-align:left;cursor:pointer;background:linear-gradient(135deg,#0000 12px,#ffffff85 13px),#ffffff59;grid-template-rows:1fr 1fr;grid-template-columns:64px 1fr auto;align-items:center;column-gap:18px;width:min(100%,570px);min-height:176px;margin-top:34px;padding:30px;transition:transform .2s,background .2s;display:grid;position:relative}.upload-zone:after{content:"";border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);z-index:-1;position:absolute;inset:6px -8px -8px 6px}.upload-zone:hover,.upload-zone--dragging{background-color:#fff;transform:rotate(-.5deg)scale(1.01)}.upload-burst{width:62px;height:62px;color:var(--cream);background:var(--red);border:3px solid var(--ink);clip-path:polygon(50% 0,61% 21%,85% 10%,81% 37%,100% 50%,78% 61%,88% 87%,61% 80%,50% 100%,39% 79%,12% 89%,21% 61%,0 50%,22% 39%,12% 12%,39% 21%);grid-row:1/3;place-items:center;display:grid}.upload-thumb{border:3px solid var(--ink);object-fit:cover;width:62px;height:62px;box-shadow:3px 3px 0 var(--red);grid-row:1/3;transform:rotate(-4deg)}.upload-zone strong{letter-spacing:.04em;align-self:end;font:800 18px/1 Barlow Condensed,sans-serif}.file-type{color:#68635a;letter-spacing:.14em;align-self:end;font-size:10px;font-weight:800}.upload-tip{color:#68635a;grid-column:2/4;align-self:start;margin-top:7px;font-size:12px;font-weight:600}.upload-actions{align-items:center;gap:31px;margin-top:30px;display:flex}.photo-intro{place-items:center;min-height:580px;display:grid;position:relative}.photo-frame{width:min(36vw,510px);height:min(65vh,620px);color:inherit;font:inherit;cursor:pointer;background:var(--ink);clip-path:polygon(4% 3%,100% 0,95% 92%,12% 100%,0 17%);filter:drop-shadow(18px 22px #0a0b0f2e);border:0;padding:10px;display:block;transform:rotate(4deg)}.photo-frame:before{content:"";background:var(--red);z-index:-1;clip-path:polygon(0 7%,95% 0,100% 90%,9% 100%);position:absolute;inset:-20px;transform:rotate(-3deg)}.photo-frame__inner{clip-path:polygon(3% 3%,100% 0,96% 91%,10% 100%,0 15%);background:#1c2230;width:100%;height:100%;position:relative;overflow:hidden}.photo-frame img{object-fit:cover;filter:saturate(1.08)contrast(1.05);width:100%;height:100%}.photo-frame img.photo-placeholder{object-fit:cover;object-position:center 30%;filter:none}.photo-frame__cta{z-index:2;border:3px solid var(--ink);background:var(--yellow);color:var(--ink);letter-spacing:.03em;white-space:nowrap;box-shadow:4px 4px 0 var(--ink);opacity:0;align-items:center;gap:7px;padding:9px 13px;font:italic 900 15px/1 Barlow Condensed,sans-serif;transition:opacity .2s,transform .2s;display:flex;position:absolute;bottom:13%;left:50%;transform:translate(-50%,8px)rotate(-3deg)}.photo-frame:hover .photo-frame__cta,.photo-frame:focus-visible .photo-frame__cta,.photo-frame--dragging .photo-frame__cta{opacity:1;transform:translate(-50%)rotate(-3deg)}.photo-frame:focus-visible{outline:4px solid var(--blue);outline-offset:6px}.photo-frame--dragging .photo-frame__inner{box-shadow:inset 0 0 0 6px var(--yellow)}.comic-file{color:var(--cream);text-align:center;border:3px dashed #fffaf059;flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex;position:absolute;inset:8% 10%}.comic-file svg{color:var(--yellow)}.comic-file strong{font:italic 900 clamp(28px,3.4vw,46px)/.9 Barlow Condensed,sans-serif}.comic-file small{color:#fffaf0b3;text-overflow:ellipsis;white-space:nowrap;max-width:85%;font-size:11px;font-weight:700;overflow:hidden}.photo-frame__inner:after{content:"";opacity:.18;mix-blend-mode:multiply;background-image:radial-gradient(circle,#0000 0 1px,#080a0e80 1.5px);background-size:7px 7px;position:absolute;inset:0}.scan-line{background:var(--yellow);height:3px;box-shadow:0 0 18px var(--yellow);z-index:2;animation:3.5s ease-in-out infinite scan;position:absolute;top:15%;left:0;right:0}.scribble{letter-spacing:.12em;font:italic 900 13px/1 Barlow Condensed,sans-serif;position:absolute;top:0;right:2%;transform:rotate(7deg)}.scribble:after{content:"";border-top:3px solid;border-radius:50%;width:90px;height:12px;display:block;transform:rotate(-7deg)}.impact-word{background:var(--red);border:4px solid var(--ink);color:var(--cream);box-shadow:8px 8px 0 var(--ink);padding:10px 22px;font:italic 900 clamp(28px,3vw,48px)/.9 Barlow Condensed,sans-serif;position:absolute;top:30%;right:-6%;transform:translateZ(150px)rotate(-8deg)}.transform-arrow{background:var(--cream);border:2px solid var(--ink);align-items:center;gap:6px;padding:8px 11px;font:800 11px/1 Inter,sans-serif;display:flex;position:absolute;bottom:17%;left:-65px;transform:rotate(-5deg)}.transform-arrow strong{color:var(--red)}.red-slash{z-index:-1;background:var(--red);border-top:4px solid var(--ink);width:52vw;height:24vh;position:absolute;bottom:-11vh;right:-3vw;transform:rotate(-8deg)}.corner-mascot{z-index:8;pointer-events:none;filter:drop-shadow(6px 8px #11111140);width:clamp(150px,15vw,230px);position:absolute;bottom:clamp(-4px,1vh,12px);right:clamp(0px,1.5vw,24px)}@media (max-width:1100px){.corner-mascot{width:125px;bottom:6px;right:4px}}@media (max-width:620px){.upload-screen{padding-bottom:150px}.corner-mascot{width:140px;right:6px}}.name-button{color:var(--cream);cursor:pointer;background:0 0;border:0;align-items:center;gap:11px;margin:3px 0 5px;padding:0;display:flex}.name-button span,.name-input{font:italic 900 39px/1 Barlow Condensed,sans-serif}.name-input{border:0;border-bottom:2px solid var(--yellow);width:180px;color:var(--cream);text-transform:uppercase;background:0 0}.hub-screen{background:var(--paper);min-height:100vh}.hub-screen:before{content:"";z-index:-1;background:linear-gradient(100deg, transparent 0 78%, var(--yellow) 78.1% 100%), linear-gradient(174deg, transparent 0 92%, var(--red) 92.1%);position:absolute;inset:0}.hub-header{padding:12px clamp(24px,5vw,80px) 22px}.hub-header .comic-heading{grid-template-columns:1fr auto;align-items:end;display:grid}.hub-header .eyebrow{width:-moz-fit-content;width:fit-content}.hub-header .comic-heading h1{white-space:nowrap;grid-column:1;font-size:clamp(49px,6vw,86px)}.hub-header .comic-heading p{grid-area:2/2;margin:0 0 5px 30px;font-size:14px}.hub-caption{letter-spacing:.13em;font:italic 900 11px/1 Barlow Condensed,sans-serif;position:absolute;bottom:16px;right:clamp(24px,5vw,80px)}.intro-screen{color:var(--cream);background:var(--ink);padding:18px}.intro-screen .topbar{color:var(--cream);position:absolute;top:18px;left:18px;right:18px}.intro-screen .brand-bolt{color:var(--ink)}.world-panel{border:4px solid var(--cream);clip-path:polygon(0 0,100% 0,98.5% 96%,1% 100%);background:#26220f;min-height:calc(100vh - 36px);transition:clip-path .8s,border .8s,transform .8s;position:relative;overflow:hidden}.world-panel>img{object-fit:cover;object-position:center 52%;filter:saturate(1.08)contrast(1.12);width:100%;height:100%;transition:transform 2.1s cubic-bezier(.16,1,.3,1),filter 1s;position:absolute;inset:0;transform:scale(1.03)}.world-vignette{background:linear-gradient(90deg,#07080ce6,#07080c26 58%,#07080c59),linear-gradient(#0000 45%,#07080c99);position:absolute;inset:0}.world-vignette:after{content:"";opacity:.17;background-image:radial-gradient(circle,#050609 1.4px,#0000 1.5px);background-size:8px 8px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(90deg,#000,#0000 70%);mask-image:linear-gradient(90deg,#000,#0000 70%)}.speed-streaks{opacity:.3;background:repeating-linear-gradient(170deg,#0000 0 55px,#ffffff1c 57px 59px,#0000 61px 100px);animation:4s linear infinite streaks;position:absolute;inset:0}.issue-badge{width:105px;height:105px;color:var(--ink);background:var(--yellow);border:4px solid var(--ink);clip-path:polygon(50% 0,61% 19%,81% 7%,82% 30%,100% 35%,87% 52%,100% 69%,78% 73%,76% 96%,57% 82%,44% 100%,34% 79%,11% 88%,18% 64%,0 55%,18% 40%,4% 22%,29% 23%);align-content:center;justify-items:center;display:grid;position:absolute;top:105px;right:clamp(30px,6vw,100px);transform:rotate(6deg)}.issue-badge small{font:800 7px/1 Inter,sans-serif}.issue-badge strong{font:italic 900 22px/.9 Barlow Condensed,sans-serif}.intro-copy{z-index:3;max-width:700px;position:absolute;top:24%;left:clamp(35px,7vw,115px)}.chapter-label{background:var(--red);border:2px solid var(--ink);letter-spacing:.2em;margin-bottom:15px;padding:7px 13px;font:800 10px/1 Inter,sans-serif;display:inline-block;transform:rotate(-1deg)}.intro-copy h1{max-width:640px;color:var(--cream);letter-spacing:-.055em;text-shadow:7px 7px 0 var(--ink);margin:0;font:italic 900 clamp(67px,9vw,142px)/.72 Barlow Condensed,sans-serif}.intro-copy h1 em{color:var(--yellow);font-style:inherit;display:block}.narration-box{border:3px solid var(--ink);background:var(--paper);max-width:520px;color:var(--ink);box-shadow:7px 7px 0 var(--ink);margin-top:32px;padding:19px 24px;font:700 15px/1.45 Inter,sans-serif;transform:rotate(-.6deg)}.controls{z-index:4;gap:20px;display:flex;position:absolute;bottom:48px;left:clamp(35px,7vw,115px)}.control-hint{color:var(--cream);align-items:center;gap:8px;display:flex}.control-hint kbd{text-align:center;background:#07080cad;border:1px solid #ffffff73;min-width:35px;padding:7px 8px;font:900 10px/1 Inter,sans-serif;box-shadow:0 3px #fff3}.control-hint span{letter-spacing:.13em;font-size:8px;font-weight:800}.enter-quest{z-index:4;min-width:230px;position:absolute;bottom:44px;right:clamp(35px,7vw,115px)}.intro-screen--entered{padding:0}.intro-screen--entered .world-panel{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);border:0;min-height:100vh;transform:scale(1.015)}.intro-screen--entered .world-panel>img{filter:saturate(1.2)contrast(1.08);transform:scale(1.18)}.intro-screen--entered .intro-copy,.intro-screen--entered .controls,.intro-screen--entered .enter-quest,.intro-screen--entered .issue-badge,.intro-screen--entered .topbar{opacity:0;transition:opacity .35s}.quest-started{z-index:10;color:var(--cream);text-shadow:5px 5px 0 var(--ink);justify-items:center;animation:1.3s .5s both quest-start;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.quest-started span{color:var(--yellow);letter-spacing:.35em;font:900 16px/1 Inter,sans-serif}.quest-started strong{white-space:nowrap;margin-top:8px;font:italic 900 clamp(42px,7vw,90px)/1 Barlow Condensed,sans-serif}.intro-splash{z-index:200;cursor:pointer;position:fixed;inset:0}.splash-half{background:radial-gradient(circle, #0a0b0f1f 1.2px, transparent 1.5px) 0 0 / 8px 8px, var(--paper);place-items:center;display:grid;position:absolute;inset:0}.splash-half:after{content:"";background:var(--ink);opacity:0;height:10px;animation:.12s 1.3s forwards splash-edge;position:absolute;top:calc(50% - 5px);left:0;right:0}.splash-half--top{clip-path:inset(0 0 50%);animation:.8s cubic-bezier(.7,0,.2,1) 1.35s forwards splash-pull-up}.splash-half--bottom{clip-path:inset(50% 0 0);animation:.8s cubic-bezier(.7,0,.2,1) 1.35s forwards splash-pull-down}.splash-logo{letter-spacing:-.04em;align-items:center;gap:clamp(14px,2.4vw,28px);font:900 clamp(54px,10vw,120px)/.8 Barlow Condensed,sans-serif;animation:.6s cubic-bezier(.18,.9,.25,1.2) .1s both splash-logo-in;display:flex}.splash-logo b{letter-spacing:.18em;font-size:.62em;display:block}.splash-logo .brand-bolt{border-width:clamp(4px,.6vw,7px);width:clamp(92px,17vw,210px);height:clamp(92px,17vw,210px);font-size:clamp(64px,12vw,148px)}.splash-seam{background:var(--yellow);width:100%;height:6px;margin-top:-3px;animation:1.15s .75s forwards splash-seam;position:absolute;top:50%;left:0;transform:scaleX(0);box-shadow:0 0 18px #ffd322cc}@keyframes splash-logo-in{0%{opacity:0;transform:scale(.82)rotate(-3deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes splash-seam{0%{opacity:1;transform:scaleX(0)}52%{opacity:1;transform:scaleX(1)}70%{opacity:1;transform:scaleX(1)}to{opacity:0;transform:scaleX(1)}}@keyframes splash-edge{to{opacity:1}}@keyframes splash-pull-up{to{transform:translateY(-55%)}}@keyframes splash-pull-down{to{transform:translateY(55%)}}.screen-wipe{z-index:100;pointer-events:none;position:fixed;inset:0;overflow:hidden}.screen-wipe__panel{background:var(--ink);animation:.95s cubic-bezier(.77,0,.18,1) forwards screen-wipe;position:absolute;inset:0 -25vw;transform:translate(110%)skew(-12deg)}.screen-wipe__panel:before,.screen-wipe__panel:after{content:"";background:var(--yellow);width:14px;position:absolute;top:0;bottom:0}.screen-wipe__panel:before{left:0}.screen-wipe__panel:after{background:var(--red);right:0}.screen-wipe__label{color:var(--cream);opacity:0;place-content:center;justify-items:center;animation:.95s forwards screen-wipe-label;display:grid;position:absolute;inset:0}.screen-wipe__label small{color:var(--yellow);letter-spacing:.3em;font-size:11px;font-weight:800}.screen-wipe__label strong{font:italic 900 clamp(64px,10vw,120px)/.9 Barlow Condensed,sans-serif}@keyframes screen-wipe{0%{transform:translate(110%)skew(-12deg)}42%,58%{transform:translate(0)skew(-12deg)}to{transform:translate(-110%)skew(-12deg)}}@keyframes screen-wipe-label{0%,30%{opacity:0;transform:scale(.92)}45%,58%{opacity:1;transform:scale(1)}72%,to{opacity:0;transform:scale(1.04)}}@keyframes screen-in{0%{opacity:0;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}@keyframes scan{0%,to{opacity:0;top:10%}12%,88%{opacity:1}50%{top:88%}}@keyframes dog-breathe{0%,to{transform:scale(1)translateY(0)}50%{transform:scale(1.006,1.012)translateY(-3px)}}@keyframes platform-spin{to{transform:rotate(360deg)}}@keyframes streaks{to{transform:translate(100px)}}@keyframes quest-start{0%{opacity:0;transform:translate(-50%,-50%)scale(1.5)}25%,75%{opacity:1;transform:translate(-50%,-50%)scale(1)}to{opacity:0;transform:translate(-50%,-50%)scale(.95)}}@media (max-width:1050px){.upload-grid{grid-template-columns:1fr .9fr;gap:35px;padding-left:44px;padding-right:44px}.photo-frame{width:39vw}.hub-header{padding-inline:35px}}@media (max-width:760px){.topbar{height:64px;padding-inline:18px}.progress span{display:none}.brand{gap:10px;font-size:23px}.brand b{font-size:14px}.brand-bolt{width:42px;height:42px;font-size:29px}.upload-screen{min-height:100svh;overflow:auto}.upload-screen:before{background:linear-gradient(165deg, transparent 0 63%, var(--yellow) 63.2% 100%)}.upload-grid{flex-direction:column;gap:35px;min-height:auto;padding:30px 22px 70px;display:flex}.upload-content .comic-heading h1,.comic-heading h1{font-size:clamp(49px,16vw,72px)}.comic-heading p{margin-top:12px;font-size:15px}.upload-zone{grid-template-columns:50px 1fr;min-height:143px;margin-top:24px;padding:20px}.upload-burst,.upload-thumb{width:48px;height:48px}.file-type{display:none}.upload-tip{grid-column:2}.upload-actions{flex-direction:column;align-items:stretch;gap:18px}.upload-actions .game-cta{width:100%}.photo-intro{width:100%;min-height:440px}.photo-frame{width:min(78vw,390px);height:420px}.transform-arrow{bottom:7%;left:0}.impact-word{top:26%;right:0}.hub-screen{min-height:100svh;padding-bottom:30px;overflow:auto}.hub-header{padding:20px 19px 25px}.hub-header .comic-heading{display:block}.hub-header .comic-heading h1{white-space:normal;font-size:53px}.hub-header .comic-heading p{margin-top:12px}.hub-caption{display:none}.intro-screen{min-height:100svh;padding:9px}.intro-screen .topbar{top:9px;left:9px;right:9px}.world-panel{min-height:calc(100svh - 18px)}.world-panel>img{object-position:58% 50%}.world-vignette{background:linear-gradient(#07080c2e 20%,#07080ceb)}.issue-badge{width:84px;height:84px;top:77px;right:22px}.intro-copy{top:27%;left:25px;right:25px}.intro-copy h1{font-size:clamp(66px,21vw,98px)}.narration-box{margin-top:24px;padding:15px 17px;font-size:12px}.controls{grid-template-columns:1fr 1fr;gap:11px;display:grid;bottom:116px;left:25px;right:25px}.enter-quest{width:calc(100% - 50px);bottom:28px;left:25px;right:25px}.quest-started strong{white-space:normal;text-align:center;font-size:37px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.screen{--pointer-x:0;--pointer-y:0;perspective:1400px}.spatial-layers{z-index:-1;pointer-events:none;transform-style:preserve-3d;position:absolute;inset:0;overflow:hidden}.depth-layer{transform-style:preserve-3d;will-change:transform;position:absolute;inset:-8%}.depth-layer--far{transform:translate3d(calc(var(--pointer-x) * -7px), calc(var(--pointer-y) * -5px), -180px) scale(1.14)}.depth-layer--mid{transform:translate3d(calc(var(--pointer-x) * -15px), calc(var(--pointer-y) * -10px), -60px)}.depth-layer--near{z-index:8;transform:translate3d(calc(var(--pointer-x) * 25px), calc(var(--pointer-y) * 18px), 150px)}.depth-word{color:currentColor;opacity:.035;letter-spacing:-.08em;white-space:nowrap;font:italic 900 clamp(150px,24vw,380px)/.7 Barlow Condensed,sans-serif;position:absolute;top:30%;left:-2%;transform:rotate(-7deg)}.distant-panel{opacity:.055;filter:blur(1.5px);background:repeating-linear-gradient(135deg,#0000 0 11px,currentColor 12px 13px);border:5px solid;width:28vw;height:40vh;position:absolute}.distant-panel--one{top:6%;right:8%;transform:rotateY(-24deg)rotate(8deg)}.distant-panel--two{bottom:-14%;left:8%;transform:rotateY(30deg)rotate(-11deg)scale(.75)}.ink-orbit{opacity:.08;border:5px solid;border-radius:50%;position:absolute}.ink-orbit--one{width:42vw;height:42vw;top:8%;right:-13vw}.ink-orbit--two{border-style:dashed;width:24vw;height:24vw;bottom:-14vw;left:28%}.foreground-slash{opacity:.1;filter:blur(.5px);background:currentColor;width:4vw;height:44vh;position:absolute}.foreground-slash--one{top:53%;left:-1%;transform:rotate(24deg)}.foreground-slash--two{top:-17%;right:2%;transform:rotate(54deg)}.upload-content{transform:translate3d(calc(var(--pointer-x) * -7px), calc(var(--pointer-y) * -5px), 45px);transition:transform .2s ease-out}.upload-zone{transform:perspective(800px)rotateY(-3deg)rotateX(1deg)translateZ(24px);box-shadow:14px 18px #0a0b0f24,0 30px 50px #0a0b0f1f}.upload-zone:hover,.upload-zone--dragging{transform:perspective(800px)rotateY(0)rotateX(0)translate3d(0,-7px,48px);box-shadow:18px 25px #0a0b0f24,0 45px 65px #0a0b0f2e}.photo-intro{transform-style:preserve-3d;transform:translate3d(calc(var(--pointer-x) * 11px), calc(var(--pointer-y) * 8px), 80px);transition:transform .2s ease-out}.photo-frame{transform-style:preserve-3d;filter:drop-shadow(32px 40px 18px #0a0b0f40);transition:transform .6s cubic-bezier(.18,.9,.25,1),filter .6s;transform:rotateY(-8deg)rotateX(2deg)rotate(4deg)translateZ(75px)}.photo-frame:hover,.photo-frame--dragging{transform:rotateY(-4deg)rotateX(0)rotate(3deg)translate3d(0,-8px,95px)}.photo-frame--loaded{filter:drop-shadow(40px 52px 22px #0a0b0f4d);animation:.65s cubic-bezier(.18,.9,.25,1) photo-impact;transform:rotateY(-3deg)rotateX(-1deg)rotate(2deg)translate3d(0,-14px,115px)}.future-dog-silhouette{z-index:-2;opacity:.18;filter:saturate(0)contrast(3)blur(2px);clip-path:polygon(5% 0,100% 8%,89% 100%,0 91%);width:min(37vw,520px);height:min(62vh,610px);position:absolute;overflow:hidden;transform:translate3d(9%,-2%,-80px)rotate(11deg)scale(1.08)}.future-dog-silhouette img{object-fit:cover;width:100%;height:100%}.photo-speed-lines{z-index:-1;opacity:.24;background:repeating-linear-gradient(167deg, transparent 0 15px, var(--ink) 17px 19px, transparent 21px 38px);position:absolute;inset:10% -20% 8% 8%;transform:translateZ(-30px)skew(-10deg);-webkit-mask-image:radial-gradient(#000,#0000 72%);mask-image:radial-gradient(#000,#0000 72%)}.gaussian-cloud{z-index:6;pointer-events:none;position:absolute;inset:3% -4%;transform:translateZ(130px)}.gaussian-cloud i{background:var(--blue);opacity:.45;border-radius:50%;width:8px;height:8px;animation:3s ease-in-out infinite alternate particle-float;position:absolute;box-shadow:0 0 13px}.gaussian-cloud i:nth-child(3n){color:var(--red);background:var(--red)}.gaussian-cloud i:nth-child(4n){color:var(--yellow);background:var(--yellow)}.gaussian-cloud i:first-child{top:18%;left:4%}.gaussian-cloud i:nth-child(2){animation-delay:-.5s;top:5%;left:14%}.gaussian-cloud i:nth-child(3){animation-delay:-1s;top:13%;left:91%}.gaussian-cloud i:nth-child(4){top:4%;left:82%}.gaussian-cloud i:nth-child(5){animation-delay:-.8s;top:38%;left:97%}.gaussian-cloud i:nth-child(6){top:46%;left:4%}.gaussian-cloud i:nth-child(7){animation-delay:-1.2s;top:75%;left:12%}.gaussian-cloud i:nth-child(8){top:76%;left:88%}.gaussian-cloud i:nth-child(9){animation-delay:-.4s;top:92%;left:73%}.gaussian-cloud i:nth-child(10){top:94%;left:28%}.gaussian-cloud i:nth-child(11){animation-delay:-.7s;top:88%;left:3%}.gaussian-cloud i:nth-child(12){top:62%;left:102%}.gaussian-cloud i:nth-child(13){top:4%;left:35%}.gaussian-cloud i:nth-child(14){animation-delay:-1.1s;top:-2%;left:62%}.gaussian-cloud i:nth-child(15){top:92%;left:95%}.gaussian-cloud i:nth-child(16){animation-delay:-.3s;top:62%;left:-2%}.gaussian-cloud i:nth-child(17){top:97%;left:53%}.gaussian-cloud i:nth-child(18){animation-delay:-.9s;top:25%;left:104%}.upload-screen--loaded .gaussian-cloud i{animation:.9s cubic-bezier(.18,.9,.25,1) both particle-impact}.upload-screen--loaded .game-cta{animation:.55s cubic-bezier(.18,.9,.25,1) .15s both cta-impact}.hub-screen{min-height:100vh;color:var(--cream);background:radial-gradient(circle at 64% 47%, #27344a 0, #121824 38%, #07090e 76%), var(--ink);transform-style:preserve-3d;overflow:hidden}.hub-screen:before{background:linear-gradient(112deg,#0000 0 34%,#1d72ea17 34.2% 35%,#0000 35.2%),linear-gradient(74deg,#0000 0 77%,#f0443117 77.2% 78%,#0000 78.2%)}.hub-screen .topbar,.hub-screen .hub-header,.hub-screen .hub-companion,.hub-screen .page-zone{position:absolute}.hub-screen .topbar{color:var(--cream);inset:0 0 auto}.hub-screen .brand-bolt{color:var(--ink)}.hub-header{z-index:7;transform:translate3d(calc(var(--pointer-x) * -6px), calc(var(--pointer-y) * -4px), 80px);padding:0;top:104px;left:clamp(24px,4vw,70px)}.hub-header .comic-heading{display:block}.hub-header .comic-heading h1{color:var(--cream);white-space:normal;font-size:clamp(42px,5vw,76px)}.hub-header .eyebrow{color:var(--ink);background:var(--yellow)}.hub-companion{z-index:5;width:41%;transform-style:preserve-3d;transform:translate3d(calc(var(--pointer-x) * -11px), calc(var(--pointer-y) * -7px), 30px);transition:transform .2s ease-out;top:max(22%,205px);bottom:6%;left:2.5%}.hub-screen .hub-companion{width:34%;left:max(106px,7.4vw)}.companion-rail{z-index:40;gap:13px;width:78px;display:grid;position:absolute;top:46%;left:18px;transform:translateY(-25%)}.companion-rail__title,.companion-rail__hint{text-align:center;color:var(--yellow);letter-spacing:.1em;font:800 10px/1.2 Barlow,sans-serif}.companion-rail__hint{color:#c2c3bc}.companion-rail__hint kbd{color:var(--yellow)}.companion-card{color:#e2dfd2;cursor:pointer;background:#14181f;border:2px solid #64676b;padding:4px 4px 0;transition:transform .15s,border-color .15s;position:relative;transform:rotate(-3deg);box-shadow:4px 4px #080b11}.companion-card:nth-of-type(2){transform:rotate(2deg)}.companion-card:hover:not(:disabled){transform:translate(4px)rotate(0)}.companion-card:focus-visible{outline-offset:4px;outline:3px solid #fff9e9}.companion-card.is-selected{border-color:var(--yellow);background:var(--yellow);color:#161920}.companion-card:disabled{cursor:wait}.companion-card img{object-fit:cover;object-position:50% 27%;width:100%;height:75px;display:block}.companion-card__portrait{display:block;overflow:hidden}.companion-card__portrait--tricolor img{transform-origin:50% 20%;transform:scale(2.2)}.companion-card__name{letter-spacing:.04em;padding:7px 0;font:17px/1 Bangers,Impact,sans-serif;display:block}.companion-card__number{color:#fff9e9;background:#10151e;padding:3px 5px;font:12px/1 Bangers,sans-serif;position:absolute;top:-6px;left:0}.companion-card__selected{background:var(--yellow);color:#161920;border:2px solid #161920;border-radius:50%;width:21px;height:21px;font:900 14px/17px system-ui;position:absolute;top:-7px;right:-7px}.companion-switch-status{z-index:41;color:#fff9e9;max-width:350px;font:700 13px/1.4 Barlow,sans-serif;position:absolute;top:87%;left:110px}.companion-switch-status:empty{display:none}.hub-screen--entering .companion-rail{opacity:0;pointer-events:none}.hub-companion-label{z-index:8;border-left:4px solid var(--yellow);padding-left:13px;display:grid;position:absolute;top:3%;left:7%;transform:translateZ(100px)rotate(-2deg)}.hub-companion-label small{color:var(--yellow);letter-spacing:.2em;font-size:8px;font-weight:800}.hub-companion-label .name-button span,.hub-companion-label .name-input{color:var(--cream);letter-spacing:0;margin:0;font:italic 900 38px/.95 Barlow Condensed,sans-serif}.hub-companion-label .name-button{margin:2px 0 0}.hub-companion-label .name-input{width:200px}.hub-companion-label .name-button svg{color:var(--yellow);opacity:.6;transition:opacity .2s}.hub-companion-label .name-button:hover svg,.hub-companion-label .name-button:focus-visible svg{opacity:1}.hub-companion-label span{color:#9097a4;letter-spacing:.15em;text-transform:uppercase;margin-top:5px;font-size:7px;font-weight:800}.hub-dog-stage{perspective:900px;pointer-events:none;place-items:center;display:grid;position:absolute;inset:7% 0 12%}.dog-viewer{cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;position:absolute;inset:0}.dog-viewer--dragging{cursor:grabbing}.dog-viewer:focus-visible{outline:3px solid var(--yellow);outline-offset:-6px}.hub-dog{z-index:3;perspective:1200px;filter:drop-shadow(0 35px 24px #0000009e);width:min(33vw,450px);height:min(60vh,590px);transition:transform .45s cubic-bezier(.18,.9,.25,1),filter .3s;position:relative}.dog-spinner{transform-style:preserve-3d;will-change:transform;position:absolute;inset:0}.dog-layer{position:absolute;inset:0}.hub-dog .dog-layer--core img{filter:brightness(.32)saturate(.6)}.hub-dog .dog-layer--back img{filter:brightness(.55)saturate(.75)sepia(.2)}.hub-dog img{object-fit:cover;filter:saturate(1.03)contrast(1.1);pointer-events:none;width:100%;height:100%;animation:4.2s ease-in-out infinite dog-breathe;-webkit-mask-image:radial-gradient(72% 66% at 50% 52%,#000 50%,#000000f5 66%,#0000 84%);mask-image:radial-gradient(72% 66% at 50% 52%,#000 50%,#000000f5 66%,#0000 84%)}.dog-placeholder{color:#fffaf0b3;background:radial-gradient(#ffd32214,#0000 70%);border:3px dashed #fffaf04d;border-radius:50% 50% 46% 46%;flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex;position:absolute;inset:14% 16% 18%}.dog-placeholder svg{color:var(--yellow)}.dog-placeholder strong{letter-spacing:.02em;font:italic 900 26px/1 Barlow Condensed,sans-serif}.dog-viewer-hint{z-index:9;color:#c9ced6;letter-spacing:.14em;white-space:nowrap;pointer-events:none;background:#06080cb3;border:1px solid #ffd32259;align-items:center;gap:7px;margin:0;padding:7px 12px;font-size:9px;font-weight:800;display:flex;position:absolute;bottom:4%;left:50%;transform:translate(-50%)}.dog-viewer-hint svg{color:var(--yellow)}.hub-platform{z-index:1;background:radial-gradient(#ffd32238,#1d72ea1f 50%,#0000 72%);border:2px solid #ffd32280;border-radius:50%;width:76%;height:95px;position:absolute;bottom:7%;transform:rotateX(68deg)translateZ(-100px);box-shadow:0 35px 45px #00000073}.hub-platform i{border:1px dashed #ffffff38;border-radius:50%;animation:10s linear infinite platform-spin;position:absolute;inset:15px}.hub-platform i:last-child{animation-direction:reverse;inset:31px}.hub-dog--backyard{filter:drop-shadow(0 35px 24px #0000009e)saturate(1.2);animation:.6s ease-in-out infinite alternate dog-excited}.hub-dog--forest{transform:rotateY(11deg)translate(12px)rotate(1deg)}.hub-dog--beach{filter:drop-shadow(0 35px 24px #0000009e)brightness(1.14);animation:.7s ease-in-out infinite alternate dog-playful}.hub-dog--locked{transform:rotateY(9deg)rotate(-3deg)}.hub-dog--petted{filter:drop-shadow(0 35px 24px #0000009e)saturate(1.3)brightness(1.1)}.hub-heart{color:var(--red);text-shadow:3px 3px 0 var(--ink);font-size:42px;animation:.85s both world-impact;position:absolute;top:16%;right:10%}.page-zone{z-index:6;width:56%;top:22%;bottom:5%;right:2.5%}.page-zone-title{z-index:12;justify-items:end;display:grid;position:absolute;top:-8px;right:3%;transform:rotate(2deg)}.page-zone-title span{background:var(--red);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:6px 10px;font:italic 900 18px/1 Barlow Condensed,sans-serif}.floating-quest-caption{z-index:25;border:3px solid var(--ink);background:var(--paper);color:var(--ink);box-shadow:8px 8px 0 var(--red), 0 25px 35px #00000059;pointer-events:none;padding:11px 16px;animation:.35s cubic-bezier(.18,.9,.25,1) both caption-pop;display:grid;position:absolute;top:-14px;left:3%;transform:rotate(-3deg)}.floating-quest-caption small{color:var(--red);letter-spacing:.15em;font-size:7px;font-weight:800}.floating-quest-caption strong{font:italic 900 27px/1 Barlow Condensed,sans-serif}.hub-caption{z-index:12;color:#858c97}.storyboard-wrap{place-items:center;display:grid;position:absolute;inset:34px 0 0;container-type:size}.storyboard{aspect-ratio:1.22;background:var(--paper);border:4px solid var(--ink);grid-template:"backyard backyard forest"minmax(0,1fr)"beach locked forest"minmax(0,1fr)/1.2fr .85fr .95fr;gap:10px;width:min(100cqw - 24px,122cqh - 29.28px,780px);padding:12px;display:grid;position:relative;box-shadow:18px 22px #00000073,9px 9px #9c978b}.story-panel{border:3px solid var(--ink);min-width:0;min-height:0;color:var(--cream);text-align:left;cursor:pointer;background:#25262a;padding:0;transition:transform .3s cubic-bezier(.18,.9,.25,1),box-shadow .3s,filter .3s;position:relative;overflow:hidden}.story-panel--backyard{grid-area:backyard}.story-panel--forest{grid-area:forest}.story-panel--beach{grid-area:beach}.story-panel--locked{grid-area:locked}.story-panel img{object-fit:cover;filter:saturate(.8)contrast(1.1);pointer-events:none;width:100%;height:100%;transition:transform .6s cubic-bezier(.18,.9,.25,1),filter .3s;position:absolute;inset:0}.story-panel:hover,.story-panel:focus-visible{z-index:5;box-shadow:0 0 0 3px var(--yellow), 0 0 30px 8px #ffd322a6, 0 24px 36px #0000008c;outline:none;transform:scale(1.06)rotate(-.6deg)}.story-panel:hover img,.story-panel:focus-visible img{filter:saturate(1.1)contrast(1.05)brightness(1.08);transform:scale(1.08)}.storyboard:has(.story-panel:hover) .story-panel:not(:hover){filter:brightness(.55)saturate(.7)}.story-panel--locked{cursor:not-allowed;background:repeating-linear-gradient(135deg, #ffffff0d 0 2px, transparent 2px 9px), var(--ink)}.story-panel--locked:hover{box-shadow:0 0 0 3px var(--red), 0 0 26px 6px #f0443180, 0 20px 30px #00000080;transform:scale(1.04)rotate(.5deg)}.story-shade{background:linear-gradient(10deg,#06070aeb,#0000 68%);position:absolute;inset:0}.story-status{background:var(--yellow);border:2px solid var(--ink);color:var(--ink);letter-spacing:.16em;padding:5px 7px;font-size:7px;font-weight:800;position:absolute;top:9px;left:9px}.story-copy{gap:2px;display:grid;position:absolute;bottom:12px;left:13px;right:12px}.story-copy small{color:var(--yellow);letter-spacing:.2em;font-size:7px;font-weight:800}.story-copy strong{letter-spacing:-.02em;font:italic 900 clamp(19px,2.3vw,36px)/.9 Barlow Condensed,sans-serif}.story-copy em{color:#d6d7d9;opacity:0;max-height:0;font:600 10px/1.3 Inter,sans-serif;transition:max-height .3s,opacity .3s,margin .3s;overflow:hidden}.story-panel:hover .story-copy em,.story-panel:focus-visible .story-copy em{opacity:1;max-height:40px;margin-top:5px}.story-enter{background:var(--yellow);border:2px solid var(--ink);width:-moz-fit-content;width:fit-content;color:var(--ink);box-shadow:3px 3px 0 var(--red);opacity:0;align-items:center;gap:4px;margin-top:8px;padding:6px 8px;font:italic 900 11px/1 Barlow Condensed,sans-serif;transition:transform .25s,opacity .25s;display:flex;transform:translateY(6px)}.story-panel:hover .story-enter,.story-panel:focus-visible .story-enter{opacity:1;transform:none}.story-lock{color:#666a73;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:7px;display:flex;position:absolute;inset:0}.story-lock strong{color:#b2b5bb;font:italic 900 17px/1 Barlow Condensed,sans-serif}.story-lock small{letter-spacing:.13em;font-size:6px;font-weight:800}.storyboard--entering .story-panel--chosen{z-index:10;animation:.82s cubic-bezier(.6,0,.3,1) forwards story-enter}.storyboard--entering .story-panel:not(.story-panel--chosen){opacity:0;transition:opacity .4s,transform .4s;transform:scale(.92)}.hub-screen--entering .hub-companion{opacity:.3;transition:transform .8s,opacity .5s;transform:translate3d(-15vw,4vh,-250px)scale(.75)}.intro-screen .spatial-layers{z-index:1;color:var(--cream)}.intro-screen .world-panel{transform:translate3d(calc(var(--pointer-x) * 4px), calc(var(--pointer-y) * 3px), 0);box-shadow:inset 0 0 0 7px var(--ink), 0 0 0 10px var(--paper), 0 35px 80px #000000b3}.intro-screen .world-panel>img{transform:translate3d(calc(var(--pointer-x) * -10px), calc(var(--pointer-y) * -6px), -20px) scale(1.09)}.quest-dog{z-index:2;width:min(35vw,520px);height:min(66vh,670px);transform:translate3d(calc(var(--pointer-x) * 18px), calc(var(--pointer-y) * 10px), 65px);filter:drop-shadow(0 35px 28px #00000094);transition:transform .2s ease-out;position:absolute;bottom:1%;right:10%}.quest-dog img{object-fit:cover;filter:saturate(1.05)contrast(1.1);width:100%;height:100%;animation:4.2s ease-in-out infinite dog-breathe;-webkit-mask-image:radial-gradient(72% 66% at 50% 52%,#000 49%,#000000f5 65%,#0000 84%);mask-image:radial-gradient(72% 66% at 50% 52%,#000 49%,#000000f5 65%,#0000 84%)}.intro-screen .narration-box{transform:translate3d(calc(var(--pointer-x) * 16px), calc(var(--pointer-y) * 10px), 120px) rotate(-.6deg);box-shadow:12px 15px 0 var(--ink), 0 32px 45px #00000052;gap:7px;display:grid}.intro-screen .narration-box strong{color:var(--red);font:italic 900 31px/1 Barlow Condensed,sans-serif}.intro-screen .narration-box span{display:block}.intro-screen--entered .world-panel{box-shadow:none;transform:scale(1.04)}.intro-screen--entered .world-panel>img{transform:scale(1.2)}.intro-screen--entered .quest-dog{transform:translate3d(5vw,2vh,140px)scale(1.08)}@keyframes photo-impact{0%{transform:rotateY(-8deg)rotateX(2deg)rotate(4deg)translateZ(75px)scale(.96)}65%{transform:rotateY(-2deg)rotateX(-1deg)rotate(1deg)translate3d(0,-19px,128px)scale(1.025)}to{transform:rotateY(-3deg)rotateX(-1deg)rotate(2deg)translate3d(0,-14px,115px)scale(1)}}@keyframes particle-float{to{opacity:.75;transform:translate3d(10px,-14px,30px)scale(1.4)}}@keyframes particle-impact{0%{opacity:0;transform:translate(0)scale(.4)}55%{opacity:1;transform:translate(calc(15% - 3px),-20px)scale(1.7)}to{opacity:.6;transform:translate(0)scale(1)}}@keyframes cta-impact{0%{opacity:0;transform:translate(-25px)skew(-8deg)scale(.8)}70%{transform:translate(4px)skew(2deg)scale(1.05)}to{opacity:1;transform:none}}@keyframes world-impact{0%{opacity:0;transform:translateY(18px)scale(.4)rotate(-12deg)}55%{opacity:1;transform:translateY(-8px)scale(1.25)rotate(6deg)}to{opacity:0;transform:translateY(-34px)scale(.9)rotate(-2deg)}}@keyframes caption-pop{0%{opacity:0;transform:translate(-25px,15px)rotate(-8deg)scale(.7)}70%{transform:translate(5px,-3px)rotate(-2deg)scale(1.06)}to{opacity:1;transform:rotate(-3deg)scale(1)}}@keyframes dog-excited{to{translate:0 -6px;rotate:0 2deg}}@keyframes dog-playful{to{translate:4px -5px;rotate:0 -2deg}}@keyframes story-enter{0%{transform:scale(1.06)rotate(-.6deg)}35%{filter:brightness(1.25);transform:scale(1.14)rotate(-1.5deg)}to{opacity:0;filter:brightness(1.6);transform:scale(1.5)}}@media (max-width:900px){.depth-layer--near{display:none}.hub-screen{min-height:1100px;overflow-y:auto}.hub-header{top:98px;left:20px;right:20px}.hub-header .comic-heading h1{font-size:clamp(43px,10vw,67px)}.hub-companion{width:51%;height:430px;top:220px;bottom:auto;left:-3%}.hub-dog{width:45vw;height:390px}.page-zone{width:56%;height:500px;top:235px;bottom:auto;right:2%}}@media (max-width:620px){.upload-content{transform:translateZ(25px)}.photo-intro{transform:translateZ(45px)}.future-dog-silhouette{width:78vw;height:430px}.hub-screen{min-height:1255px}.hub-header{top:92px}.hub-header .comic-heading h1{font-size:49px}.hub-companion{width:100%;height:420px;top:240px;left:0}.hub-companion-label{left:20px}.hub-dog{width:min(80vw,390px);height:390px}.hub-platform{width:70%}.page-zone{width:100%;height:510px;top:695px;left:0;right:0}.page-zone-title{top:-20px;right:20px}.storyboard{aspect-ratio:auto;grid-template:"backyard backyard"1.2fr"forest beach"1fr"forest locked"1fr/1fr 1fr;width:calc(100cqw - 24px);height:calc(100cqh - 12px)}.story-copy em,.floating-quest-caption,.hub-caption{display:none}.intro-screen .narration-box{transform:translateZ(70px)rotate(-.6deg)}.quest-dog{opacity:.82;width:86vw;height:58vh;bottom:7%;right:-18%}}.progress .world-status{opacity:.75;border:2px solid;margin-right:14px;padding:4px 8px;font-size:9px;animation:1.4s ease-in-out infinite status-pulse}.progress .world-status--ready{color:var(--yellow);opacity:1;animation:none}@keyframes status-pulse{50%{opacity:.35}}.live-dog{z-index:3;place-items:center;width:min(33vw,450px);height:min(60vh,590px);transition:transform .65s cubic-bezier(.55,-.25,.4,1);display:grid;position:relative}.live-dog__waking{color:#8d94a1;letter-spacing:.02em;font:italic 900 22px/1 Barlow Condensed,sans-serif;animation:1.4s ease-in-out infinite status-pulse}.live-dog--leap{transform:translate(var(--leap-x), var(--leap-y)) scale(.22)}.hub-screen--entering .hub-companion{opacity:1}.hub-screen--entering .hub-companion-label,.hub-screen--entering .dog-viewer-hint,.hub-screen--entering .hub-platform{opacity:0;transition:opacity .3s}.storyboard.comic-page{aspect-ratio:.98;grid-template:"one one"minmax(0,1.08fr)"two three"minmax(0,1fr)/1fr 1fr;width:min(100cqw - 24px,98cqh - 23.52px,760px)}.story-panel--one{grid-area:one}.story-panel--two{grid-area:two}.story-panel--three{grid-area:three}.story-panel--one img{filter:saturate(.95)contrast(1.05)}.story-panel--outcome{cursor:default}.story-panel--outcome:hover{box-shadow:0 0 0 3px var(--cream), 0 20px 30px #00000080;transform:scale(1.03)rotate(.4deg)}.story-panel--outcome img{filter:saturate(.9)contrast(1.05)}.comic-caption{z-index:2;border:2px solid var(--ink);max-width:calc(100% - 18px);color:var(--ink);letter-spacing:.01em;box-shadow:3px 3px 0 var(--ink);background:#fff3b8;padding:5px 8px 4px;font:italic 800 clamp(11px,1.15vw,15px)/1.1 Barlow Condensed,sans-serif;position:absolute;bottom:10px;left:9px}.comic-caption--top{inset:10px 10px auto auto}.end-badge{z-index:2;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:6px 9px 4px;font:italic 900 clamp(16px,1.9vw,26px)/1 Barlow Condensed,sans-serif;position:absolute;top:10px;right:8px;transform:rotate(4deg)}.end-badge--bad{background:var(--red);color:var(--cream)}.end-badge--good{background:var(--yellow);color:var(--ink)}.story-panel--redraw{animation:1.1s cubic-bezier(.6,0,.3,1) both panel-redraw}.story-panel--redraw .end-badge{animation:.45s cubic-bezier(.18,.9,.25,1) 1.4s both caption-pop}@keyframes panel-redraw{0%{clip-path:polygon(0 0,0 0,0 100%,0 100%);filter:brightness(2.2)contrast(.6)}70%{filter:brightness(1.3)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);filter:none}}.page-zone .floating-quest-caption{top:auto;bottom:-26px;left:6%}.panel-portal{z-index:500;border:4px solid var(--ink);background:var(--ink);pointer-events:none;transition:left .75s cubic-bezier(.7,0,.2,1),top .75s cubic-bezier(.7,0,.2,1),width .75s cubic-bezier(.7,0,.2,1),height .75s cubic-bezier(.7,0,.2,1),border-width .75s,opacity 1s;position:fixed;overflow:hidden}.panel-portal--fill,.panel-portal--morph,.panel-portal--fade{border-width:0;width:100vw;height:100vh;top:0;left:0}.panel-portal--fade{opacity:0}.quest-complete{z-index:500;background:#07090e8c;place-items:center;padding:20px;animation:.4s both fade-in;display:grid;position:fixed;inset:0}.quest-complete__card{background:var(--paper);border:4px solid var(--ink);width:min(430px,100%);color:var(--ink);box-shadow:12px 12px 0 var(--yellow), 12px 12px 0 4px var(--ink);justify-items:start;gap:10px;padding:18px 20px 22px;animation:.5s cubic-bezier(.18,.9,.25,1) .15s both caption-pop;display:grid;transform:rotate(-1.5deg)}.quest-complete__eyebrow{background:var(--ink);color:var(--yellow);letter-spacing:.18em;padding:4px 8px;font-size:9px;font-weight:800}.quest-complete__card img{aspect-ratio:16/10;object-fit:cover;border:3px solid var(--ink);width:100%}.quest-complete__card strong{font:italic 900 clamp(30px,6vw,44px)/.95 Barlow Condensed,sans-serif}.quest-complete__card p{margin:0 0 6px;font:600 14px/1.4 Inter,sans-serif}@keyframes fade-in{0%{opacity:0}}@media (max-width:900px){.live-dog{width:45vw;height:390px}}@media (prefers-reduced-motion:reduce){.live-dog--leap{opacity:0}}.comic-page.storyboard--entering .story-panel--chosen{box-shadow:0 0 0 3px var(--yellow), 0 0 40px 12px #ffd322b3;animation:none;transform:scale(1.03)}.comic-page.storyboard--entering .story-panel:not(.story-panel--chosen){opacity:.3;transform:none}.storyboard.comic-page{aspect-ratio:1.14;grid-template-rows:minmax(0,1.85fr) minmax(0,1fr);grid-template-columns:repeat(4,minmax(0,1fr));grid-template-areas:"one one one one""two three four five";width:min(100cqw - 24px,114cqh - 27.36px,860px)}.story-panel--four{grid-area:four}.story-panel--five{grid-area:five}.story-panel--outcome .comic-caption{max-width:calc(100% - 10px);box-shadow:2px 2px 0 var(--ink);padding:3px 5px 2px;font-size:clamp(9px,.85vw,12px);bottom:6px;left:5px}.story-panel--outcome .story-status{padding:3px 5px;font-size:6px;top:5px;left:5px}.story-panel--outcome .end-badge{box-shadow:3px 3px 0 var(--ink);border-width:2px;padding:4px 6px 3px;font-size:clamp(12px,1.2vw,18px);top:6px;right:4px}.story-panel--two.story-panel--redraw{animation-delay:0s}.story-panel--three.story-panel--redraw{animation-delay:.3s}.story-panel--four.story-panel--redraw{animation-delay:.6s}.story-panel--five.story-panel--redraw{animation-delay:.9s}.story-panel--redraw .end-badge{animation-delay:2s}.upload-screen .progress .world-status--ready{color:var(--ink)}.portal-frame{object-fit:cover;width:100%;height:100%;transition:opacity .55s,transform .7s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.portal-frame--gone{opacity:0}.portal-frame--panel.portal-frame--gone{transform:scale(.78)}.panel-portal--fade{transition:opacity .6s}.comic-sheet{aspect-ratio:1.36;background:radial-gradient(#0a0b0f17 1px,#0000 1.25px) 0 0/9px 9px,#f6f1e3;grid-template-rows:minmax(0,1.25fr) minmax(0,1fr);grid-template-columns:repeat(6,minmax(0,1fr));grid-template-areas:"one one one one two two""three three four four five five";gap:10px 8px;width:min(100cqw - 30px,136cqh - 40.8px,900px);padding:16px 18px 18px;display:grid;position:relative;transform:rotate(-1deg);box-shadow:14px 18px #00000080,0 30px 60px #00000073}.comic-cell{min-width:0;min-height:0;color:inherit;font:inherit;text-align:left;background:0 0;border:0;padding:0;transition:transform .3s cubic-bezier(.18,.9,.25,1),filter .3s,opacity .4s;position:relative}.comic-cell--one{--shape:polygon(0 0, 100% 0, 96% 100%, 0 97%);cursor:pointer;grid-area:one}.comic-cell--two{--shape:polygon(4% 0, 100% 0, 100% 94%, 0 100%);grid-area:two}.comic-cell--three{--shape:polygon(0 3%, 100% 0, 94% 100%, 0 100%);grid-area:three}.comic-cell--four{--shape:polygon(0 0, 100% 5%, 100% 100%, 5% 100%);grid-area:four}.comic-cell--five{--shape:polygon(4% 5%, 100% 0, 100% 100%, 0 100%);grid-area:five}.comic-frame{background:var(--ink);clip-path:var(--shape);position:absolute;inset:0}.comic-art{clip-path:var(--shape);background:#1c1d22;position:absolute;inset:4px;overflow:hidden}.comic-art img{object-fit:cover;pointer-events:none;width:100%;height:100%;transition:transform .6s cubic-bezier(.18,.9,.25,1);display:block}.comic-cell--one:hover,.comic-cell--one:focus-visible{z-index:5;filter:drop-shadow(0 0 #ffd322)drop-shadow(0 0 3px #ffd322)drop-shadow(0 0 16px #ffd322bf);outline:none;transform:scale(1.025)rotate(-.4deg)}.comic-cell--one:hover .comic-art img{transform:scale(1.04)}.comic-cell--outcome:hover{z-index:4;transform:scale(1.04)rotate(.5deg)}.comic-cell .comic-caption{font-size:clamp(10px,1vw,15px);bottom:12px;left:12px}.comic-cell .comic-caption--top{inset:12px 26px auto auto}.comic-cell--outcome .comic-caption{max-width:calc(100% - 22px);box-shadow:2px 2px 0 var(--ink);padding:3px 6px 2px;font-size:clamp(9px,.85vw,13px);bottom:9px;left:9px}.comic-bubble{z-index:2;border:2.5px solid var(--ink);max-width:78%;color:var(--ink);letter-spacing:.04em;white-space:nowrap;background:#fff;border-radius:50%;padding:6px 13px 5px;font:400 clamp(12px,1.3vw,19px)/1 Bangers,Barlow Condensed,sans-serif;position:absolute;top:9%;left:12%}.comic-bubble:after{content:"";border:7px solid #0000;border-top:12px solid var(--ink);border-bottom:0;position:absolute;bottom:-12px;left:38%;transform:skew(-25deg)}.comic-sfx{z-index:2;color:var(--yellow);letter-spacing:.03em;-webkit-text-stroke:2px var(--ink);text-shadow:3px 3px 0 var(--ink);pointer-events:none;font:400 clamp(28px,3.4vw,54px)/1 Bangers,Impact,sans-serif;position:absolute;top:7%;left:21%;transform:rotate(-12deg)}.comic-sfx--small{font-size:clamp(18px,2vw,30px);top:9%;left:auto;right:10%;transform:rotate(-9deg)}.comic-cell .end-badge{top:10px;right:4px}.comic-burst{z-index:3;aspect-ratio:1;background:var(--ink);clip-path:polygon(50% 0,61% 18%,82% 8%,80% 30%,100% 36%,85% 52%,98% 70%,77% 72%,74% 94%,57% 82%,42% 100%,36% 79%,14% 88%,20% 66%,0 58%,17% 44%,5% 24%,27% 24%,28% 3%,43% 17%);place-items:center;width:clamp(92px,9vw,130px);animation:1.6s ease-in-out infinite burst-beat;display:grid;position:absolute;bottom:9%;left:4%}.comic-burst:before{content:"";background:var(--yellow);clip-path:inherit;position:absolute;inset:5px}.comic-burst span{color:var(--ink);letter-spacing:.04em;font:400 clamp(14px,1.45vw,21px)/1 Bangers,Impact,sans-serif;position:relative;transform:rotate(-8deg)}.comic-cell--one:hover .comic-burst{animation:none;transform:scale(1.15)rotate(6deg)}@keyframes burst-beat{50%{transform:scale(1.08)rotate(-4deg)}}.comic-sheet--entering .comic-cell--outcome{opacity:.3}.comic-sheet--entering .comic-cell--chosen{z-index:5;filter:drop-shadow(0 0 #ffd322)drop-shadow(0 0 3px #ffd322)drop-shadow(0 0 22px #ffd322cc)}.comic-sheet--entering .comic-burst,.comic-sheet--entering .comic-sfx,.comic-sheet--entering .comic-caption{opacity:0;transition:opacity .25s}.comic-cell--redraw .comic-art:after{content:"";transform-origin:100%;background:linear-gradient(90deg,#0a0b0f 0 6px,#f6f1e3 6px);animation:1s cubic-bezier(.6,0,.3,1) both ink-in;position:absolute;inset:0}.comic-cell--three.comic-cell--redraw .comic-art:after{animation-delay:.3s}.comic-cell--four.comic-cell--redraw .comic-art:after{animation-delay:.6s}.comic-cell--five.comic-cell--redraw .comic-art:after{animation-delay:.9s}.comic-cell--redraw .comic-caption,.comic-cell--redraw .comic-bubble,.comic-cell--redraw .comic-sfx,.comic-cell--redraw .end-badge{animation:.45s cubic-bezier(.18,.9,.25,1) 1.6s both caption-pop}@keyframes ink-in{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.panel-portal{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.panel-portal--start{clip-path:polygon(0 0,100% 0,96% 100%,0 97%)}.panel-portal--fill{transition:left .75s cubic-bezier(.7,0,.2,1),top .75s cubic-bezier(.7,0,.2,1),width .75s cubic-bezier(.7,0,.2,1),height .75s cubic-bezier(.7,0,.2,1),border-width .75s,clip-path .75s cubic-bezier(.7,0,.2,1)}:root{--rain-tile:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cg stroke='%23b8cdf0' stroke-width='1.3' stroke-linecap='round'%3E%3Cpath d='M30 12l-6 30M96 70l-6 30M168 22l-6 30M206 120l-6 30M58 140l-6 30M132 168l-6 30M12 196l-5 24M150 96l-4 20M80 20l-4 20M190 186l-4 20'/%3E%3C/g%3E%3C/svg%3E");--grain-tile:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E")}.photo-frame img.photo-placeholder{object-fit:contain;background:#fff;padding:5% 6% 11% 10%}@media (min-width:901px){.hub-screen .page-zone{width:60%;top:13%;bottom:4%;right:2%}.hub-screen .hub-companion{width:34%}}.comic-sheet{width:min(100cqw - 30px,136cqh - 40.8px,1500px)}.comic-cell--one .comic-caption--top{max-width:46%}.comic-cell--one .comic-sfx{top:14%;left:14%}.hub-texture{z-index:-1;pointer-events:none;position:absolute;inset:0;overflow:hidden}.hub-texture:before{content:"";background:radial-gradient(circle, #f6f1e333 1.1px, transparent 1.6px) 0 0 / 10px 10px, var(--grain-tile) 0 0 / 180px 180px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(at 62% 52%,#0000 30%,#000 95%);mask-image:radial-gradient(at 62% 52%,#0000 30%,#000 95%)}.hub-texture:after{content:"";background-image:var(--rain-tile);opacity:.45;will-change:transform;background-size:220px 220px;animation:1.1s linear infinite hub-rain;position:absolute;inset:-220px 0}@keyframes hub-rain{0%{transform:translate(0,0)}to{transform:translateY(220px)}}.hub-screen:after{opacity:0;background:radial-gradient(at 82% -10%,#c8dcff8c,#0000 62%);animation:12s linear infinite hub-lightning;-webkit-mask-image:none;mask-image:none}@keyframes hub-lightning{0%,90%,95%,to{opacity:0}91%{opacity:.9}92%{opacity:.2}93.5%{opacity:.7}}.portal-rain{z-index:3;pointer-events:none;opacity:.6;position:absolute;inset:0;overflow:hidden}.portal-rain:before{content:"";background-image:var(--rain-tile);will-change:transform;background-size:260px 260px;animation:.55s linear infinite portal-rain;position:absolute;inset:-260px 0}@keyframes portal-rain{0%{transform:translate(0,0)}to{transform:translateY(260px)}}.portal-frame{transition:opacity .5s,transform .7s cubic-bezier(.4,0,.2,1)}@media (prefers-reduced-motion:reduce){.hub-texture:after,.hub-screen:after,.portal-rain:before{animation:none}}.topbar-right{align-items:center;gap:clamp(14px,2vw,26px);display:flex}.volume-control{border:2px solid;align-items:center;gap:8px;padding:5px 12px 5px 5px;display:inline-flex}.volume-control__mute{width:30px;height:30px;color:inherit;cursor:pointer;background:0 0;border:0;place-items:center;padding:0;transition:background .2s,color .2s;display:grid}.volume-control__mute:hover{background:var(--yellow);color:var(--ink)}.volume-control__mute:focus-visible,.volume-slider:focus-visible{outline:3px solid var(--blue);outline-offset:2px}.volume-control--muted{opacity:.7}.volume-slider{--fill:45%;cursor:pointer;appearance:none;background:0 0;width:92px;height:18px;margin:0}.volume-slider::-webkit-slider-runnable-track{background:linear-gradient(90deg, currentColor var(--fill), transparent var(--fill));border:1.5px solid;height:6px}.volume-slider::-moz-range-track{background:linear-gradient(90deg, currentColor var(--fill), transparent var(--fill));border:1.5px solid;height:6px}.volume-slider::-webkit-slider-thumb{border:2px solid var(--ink);background:var(--cream);width:14px;height:18px;box-shadow:2px 2px 0 var(--ink);-webkit-appearance:none;margin-top:-7.5px;transform:rotate(-6deg)}.volume-slider::-moz-range-thumb{border:2px solid var(--ink);background:var(--cream);width:12px;height:16px;box-shadow:2px 2px 0 var(--ink);border-radius:0}@media (max-width:760px){.volume-control{gap:4px;padding:3px 8px 3px 3px}.volume-slider{width:58px}}.photo-frame--fit{--fit-w:min(36vw, 510px);--fit-h:min(74vh, 680px);clip-path:polygon(1.5% 1%,100% 0,98.5% 99%,0 100%);width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content}.photo-frame--fit .photo-frame__inner{width:min(var(--fit-w) - 20px, (var(--fit-h) - 20px) * var(--comic-aspect));height:auto;aspect-ratio:var(--comic-aspect);clip-path:polygon(.8% .6%,100% 0,99.2% 99.4%,0 100%)}.photo-frame--fit img{object-fit:contain}@media (max-width:1050px){.photo-frame--fit{--fit-w:39vw}}@media (max-width:760px){.photo-frame--fit{--fit-w:min(78vw, 390px);--fit-h:420px}}