.story-section{padding:105px 5% 72px;position:relative;overflow:hidden;text-align:center;background:radial-gradient(ellipse at 50% 72%,#35372b44,transparent 62%),#0d100d;scroll-margin-top:100px}
.story-eyebrow{font:10px var(--body);letter-spacing:3px;color:#9a9f91}
.story-heading h2{font:clamp(42px,5.5vw,78px)/.98 var(--display);letter-spacing:-1px;margin:24px 0}
.story-heading h2 em{color:#ff7828;font-style:normal}.story-heading p{font:14px/1.9 var(--body);color:#adb09f;margin:0}
.story-hand{--cw:290px;--ch:426px;position:relative;height:585px;max-width:1080px;margin:25px auto 0;isolation:isolate}
.story-card{--tone:#88c2e0;--tint:#173747;--spread:0px;--rise:0px;--angle:0deg;position:absolute;top:65px;left:50%;width:var(--cw);height:var(--ch);margin-left:calc(var(--cw) / -2);border:1px solid var(--tone);border-radius:18px;padding:0;overflow:hidden;color:#f1eee4;text-align:left;background:radial-gradient(ellipse at 50% 30%,var(--tint),#101512 76%);box-shadow:0 28px 55px #000a,inset 0 0 0 5px #0c100d,inset 0 0 0 6px color-mix(in srgb,var(--tone) 26%,transparent);transform:translateX(var(--spread)) translateY(var(--rise)) rotate(var(--angle));transform-origin:50% 90%;transition:box-shadow .4s,border-color .4s;isolation:isolate}
/* Stable geometry and layer order on hover prevent cards from cutting through the fan. */
.story-police{--spread:-188px;--rise:27px;--angle:-13deg;z-index:1}.story-criminal{--tone:#e58b78;--tint:#512b27;z-index:3}.story-citizen{--tone:#dbbd7f;--tint:#4b4128;--spread:188px;--rise:27px;--angle:13deg;z-index:2}
.story-card::before{content:'';position:absolute;inset:13px;z-index:4;border:1px solid color-mix(in srgb,var(--tone) 22%,transparent);border-radius:10px;pointer-events:none}
.story-card::after{content:'';position:absolute;inset:25% 0 0;z-index:1;background:linear-gradient(transparent 20%,#0b100e 84%);pointer-events:none}
.story-card:hover{box-shadow:0 30px 65px #000b,0 0 30px color-mix(in srgb,var(--tone) 18%,transparent),inset 0 0 0 5px #0c100d,inset 0 0 0 6px var(--tone)}.story-card:focus-visible{outline:2px solid var(--tone);outline-offset:5px}
.story-foil{position:absolute;inset:0;z-index:5;pointer-events:none;background:linear-gradient(110deg,transparent 25%,#ffffff12 45%,#ffffff28 50%,#ffffff0a 55%,transparent 75%);transform:translateX(-140%)}.story-card:hover .story-foil,.story-card:focus-visible .story-foil{animation:story-shine 1.1s ease both}
.story-card-grid{position:absolute;inset:22px;opacity:.16;background:repeating-linear-gradient(45deg,transparent 0 17px,var(--tone) 18px,transparent 19px);mask-image:linear-gradient(#000,transparent 75%)}
.story-corner{position:absolute;top:27px;left:27px;font:15px var(--display);z-index:3;color:var(--tone);display:grid;gap:4px;text-align:center}.story-corner>span{font:28px Georgia,serif}
.story-card-kicker{position:absolute;top:32px;right:26px;font:7px var(--body);letter-spacing:1.1px;z-index:3;color:var(--tone)}
.story-card img{height:91%;width:112%;position:absolute;bottom:-5%;left:-6%;object-fit:contain;filter:saturate(.65);z-index:0}
.story-card-title{position:absolute;bottom:77px;left:27px;right:27px;z-index:2;font:33px var(--display);text-shadow:0 2px 20px #000}.story-card-title small{display:block;font:13px var(--body);color:var(--tone);margin-top:10px;text-align:left}
.story-card-action{position:absolute;bottom:16px;left:27px;right:27px;height:43px;border-top:1px solid color-mix(in srgb,var(--tone) 30%,transparent);display:flex;align-items:center;justify-content:space-between;z-index:3;font:7px var(--body);letter-spacing:1.5px;color:#cad0bf}.story-card-action b{font:23px var(--body);color:var(--tone)}
.citizen-emblem{position:absolute;width:150px;height:150px;left:calc(50% - 75px);top:94px;border:1px solid #dbbd7f70;border-radius:30px;transform:rotate(45deg);font-size:0;background:repeating-linear-gradient(90deg,transparent 0 12px,#dbbd7f0b 13px 14px),#dbbd7f08;box-shadow:0 0 0 9px #dbbd7f05,0 0 0 10px #dbbd7f25,inset 0 0 40px #dbbd7f11}.citizen-mark{position:absolute;top:151px;left:0;right:0;text-align:center;color:#dfc390;font:45px var(--display)}
.story-footnote{font:12px var(--body);letter-spacing:.2px;color:#919786;display:block}
.story-dialog{border:0;padding:20px;margin:0;width:100%;height:100dvh;max-width:none;max-height:none;background:transparent;color:#eeeae2;overflow:hidden;perspective:1800px}.story-dialog[open]{display:grid;place-items:center}
.story-dialog::backdrop{background:#030705a8;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);animation:story-backdrop-in .5s ease both}body.story-open{overflow:hidden}
.story-flight{--tone:#88c2e0;--tint:#173747;width:min(440px,100%);height:min(710px,calc(100dvh - 40px));position:relative;transform-style:preserve-3d}.story-flight[data-story=criminal]{--tone:#e58b78;--tint:#512b27}.story-flight[data-story=citizen]{--tone:#dbbd7f;--tint:#4b4128}
.story-turner{position:absolute;inset:0;transform-style:preserve-3d}
.story-panel,.story-back{position:absolute;inset:0;border:1px solid var(--tone);border-radius:22px;background:#101612;box-shadow:0 30px 100px #000a;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.story-panel{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--tone) transparent;background:radial-gradient(ellipse at 50% 12%,var(--tint),#101612 68%);transform:translateZ(1px)}
.story-detail-top{padding:30px 28px 0 70px;display:grid;gap:10px;text-align:right}.story-detail-edition{font:8px var(--body);letter-spacing:2px;color:#a9ad9d}.story-detail-eyebrow{font:9px var(--body);letter-spacing:1.8px;color:var(--tone)}
.story-close{position:absolute;top:22px;left:22px;width:36px;height:36px;border:1px solid #ffffff35;border-radius:50%;background:#0e1513;color:#eeeae2;font:24px var(--body);z-index:3;transition:background .2s,color .2s}.story-close:hover{background:var(--tone);color:#101512}
.story-detail-art{height:210px;position:relative;overflow:hidden;margin-top:10px;background:repeating-linear-gradient(45deg,transparent 0 24px,#ffffff04 25px,transparent 26px);mask-image:linear-gradient(#000 65%,transparent)}.story-detail-art:before{content:'';position:absolute;width:170px;height:170px;left:calc(50% - 85px);top:24px;border:1px solid color-mix(in srgb,var(--tone) 45%,transparent);transform:rotate(45deg);border-radius:20px}.story-detail-art img{position:absolute;width:240px;height:360px;object-fit:contain;top:0;left:calc(50% - 120px)}.story-detail-art>span{display:block;position:relative;text-align:center;padding-top:75px;font:58px var(--display);color:var(--tone)}
.story-detail-copy{padding:0 30px 26px;position:relative;margin-top:-10px}.story-panel h2{font:46px/1 var(--display);color:var(--tone);margin:0 0 20px;text-align:center}.story-panel p{font:14px/1.9 var(--body);color:#c3c9b7;margin:0 0 22px}.story-panel h3{font:600 14px var(--body);margin:0 0 14px}
.story-paths{counter-reset:path;list-style:none;padding:0;margin:0;display:grid;gap:12px}.story-paths li{position:relative;padding-right:31px;font:13px/1.8 var(--body);color:#b9c2ac}.story-paths li:before{counter-increment:path;content:'0' counter(path);position:absolute;right:0;top:2px;font:10px var(--display);color:var(--tone)}
.story-detail-footer{display:flex;justify-content:space-between;align-items:center;font:8px var(--body);letter-spacing:1.4px;color:var(--tone);border-top:1px solid #ffffff1c;margin-top:25px;padding-top:12px}.story-detail-footer img{object-fit:contain}
.story-back{transform:rotateY(180deg);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:48px 30px;background:repeating-linear-gradient(45deg,transparent 0 18px,#d9b4780a 19px,transparent 20px),repeating-linear-gradient(-45deg,transparent 0 18px,#d9b4780a 19px,transparent 20px),#111711;border-color:#bd9d68;color:#d8be8c}
.story-back:before,.story-back:after{content:'';position:absolute;inset:13px;border:1px solid #bc9c6855;border-radius:13px;pointer-events:none}.story-back:after{inset:23px;border-color:#bc9c6826;border-radius:9px}
.story-back-top,.story-back-bottom{direction:ltr;font:13px/2 var(--display);letter-spacing:1.5px;text-align:center}.story-back small{font:8px/3 var(--body);letter-spacing:3px;color:#a49173}.story-back-crest{width:205px;height:205px;display:grid;place-items:center;position:relative}.story-back-crest:before,.story-back-crest:after{content:'';position:absolute;inset:0;border:1px solid #b89050a0;transform:rotate(45deg);border-radius:30px}.story-back-crest:after{inset:12px;border-color:#b890503d}.story-back-crest img{width:172px;height:172px;object-fit:contain;filter:drop-shadow(0 0 20px #ff722938)}
.site-header .studio-menu a:nth-of-type(4){animation-delay:.5s}.site-header .studio-menu a:nth-of-type(5){animation-delay:.6s}
@keyframes story-shine{to{transform:translateX(140%)}}@keyframes story-backdrop-in{from{opacity:0}to{opacity:1}}
@media(max-width:800px){.story-section{padding:80px 3% 58px}.story-hand{--cw:clamp(162px,48vw,248px);--ch:clamp(280px,72vw,370px);height:calc(var(--ch) + 115px);margin-top:22px}.story-card{top:42px;border-radius:14px}.story-police{--spread:calc(var(--cw) * -.20);--angle:-9deg;--rise:25px}.story-citizen{--spread:calc(var(--cw) * .20);--angle:9deg;--rise:25px}.story-corner{top:22px;left:20px;font-size:11px}.story-corner>span{font-size:20px}.story-card-kicker{top:26px;right:20px;font-size:5px;letter-spacing:.6px}.story-card-title{left:21px;right:21px;font-size:clamp(20px,5.8vw,28px);bottom:69px}.story-card-title small{font-size:11px}.story-card-action{left:21px;right:21px;font-size:5px;letter-spacing:.6px;height:39px}.citizen-emblem{width:104px;height:104px;left:calc(50% - 52px);top:85px;border-radius:20px}.citizen-mark{top:123px;font-size:32px}.story-dialog{padding:16px}.story-flight{height:min(690px,calc(100dvh - 32px))}.story-detail-copy{padding:0 23px 23px}.story-detail-art{height:190px}.story-back-crest{width:160px;height:160px}.story-back-crest img{width:140px;height:140px}}
@media(max-width:380px){.story-police{--spread:-27px;--angle:-8deg}.story-citizen{--spread:27px;--angle:8deg}.story-card-kicker{font-size:4px;letter-spacing:.2px}.story-corner{left:18px}.story-heading h2{font-size:38px}.story-heading p{font-size:12px}.story-card-title{left:19px;right:19px}.citizen-emblem{width:85px;height:85px;left:calc(50% - 42.5px);top:80px}.citizen-mark{top:109px}}
@media(prefers-reduced-motion:reduce){.story-card{transition:none}.story-card .story-foil,.story-dialog::backdrop{animation:none!important}}