*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f3ed;color:#20251f;font-family:Arial,'Yu Gothic',Meiryo,sans-serif;line-height:1.8}a{color:inherit;text-decoration:none}a:focus-visible,summary:focus-visible{outline:3px solid #ae602d;outline-offset:5px}.wrap{width:min(1260px,88%);margin:auto}header{border-bottom:1px solid #c9cec2}header .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:94px}.logo{font-size:24px;font-weight:800;letter-spacing:-1px}nav{display:flex;gap:30px;font-size:12px;letter-spacing:.06em}main{overflow:hidden}.eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:700}.hero{padding:90px 0 70px}.hero h1{font-size:clamp(50px,7.7vw,110px);font-weight:500;line-height:1.1;letter-spacing:-.06em;margin:30px 0}.hero p{max-width:540px;font-size:15px}.button{display:inline-flex;align-items:center;gap:45px;border:1px solid currentColor;padding:12px 25px;margin-top:22px;font-size:13px}.button:hover{background:#20251f;color:#fff}.section{padding:65px 0;border-top:1px solid #c9cec2}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:30px}h2{font-size:clamp(28px,4vw,48px);line-height:1.3;font-weight:500;letter-spacing:-.03em;margin:0}h3{font-size:25px;margin:8px 0;font-weight:500}p{margin:15px 0}.small{font-size:12px;color:#62685f}.grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.panel{padding:35px;background:#e6e8de}.panel.dark{background:#233328;color:#f1f1df}.panel p{font-size:14px;max-width:460px}.panel .small{color:inherit}.word-art{background:#d8ddcc;min-height:220px;padding:25px;display:flex;align-items:center;font-size:clamp(50px,8vw,100px);line-height:1;font-weight:800;letter-spacing:-.08em}.stripe{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #c9cec2;padding:22px 0;font-size:14px}.group-hero{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center}.monogram{border:1px solid #aeb8a2;aspect-ratio:1;display:grid;place-items:center;position:relative;background:repeating-linear-gradient(90deg,transparent,transparent 44px,#b9c3ae55 45px),repeating-linear-gradient(0deg,transparent,transparent 44px,#b9c3ae55 45px)}.monogram span{font-size:clamp(100px,19vw,260px);line-height:1;font-family:Georgia,serif;letter-spacing:-.15em;transform:translateX(-.08em)}.monogram small{position:absolute;bottom:20px;left:20px;letter-spacing:.15em;font-size:10px}.cast-art{width:100%;aspect-ratio:1536/485;overflow:hidden;background:#eae3d7}.cast-art img{width:100%;height:auto;display:block}.store{background:#f8f5ed}.store .hero{padding-bottom:40px}.store h1{font-family:Georgia,'Yu Mincho',serif}.store-feature{background:#e9a56f;padding:35px}.store-feature h2{font-weight:800;font-size:clamp(45px,7vw,88px);letter-spacing:-.06em}.tag{display:inline-block;border:1px solid currentColor;border-radius:30px;padding:4px 14px;font-size:10px;letter-spacing:.1em}.backfables{background:#f3d75b;color:#22221f}.backfables header{border-color:#22221f}.backfables .hero h1{font-weight:900;letter-spacing:-.075em;font-size:clamp(50px,10vw,145px)}.backfables .section{border-color:#22221f}.backfables .cast-art{border:2px solid #22221f}.backfables .panel{background:#eee9dc}.backfables .panel.color{background:#ed8e79}.names{display:grid;grid-template-columns:repeat(4,1fr);gap:0 30px}.person{padding:24px 0;border-top:1px solid #22221f}.person h3{font-weight:800}.person p{font-size:12px}.number{font-size:10px;letter-spacing:.12em}.coming{display:flex;justify-content:space-between;gap:30px;align-items:center}.notice{font-size:11px;padding:8px 6%;background:#233328;color:#fff;text-align:center}footer{border-top:1px solid #b5bba9;padding:32px 0;font-size:11px}footer .wrap{display:flex;justify-content:space-between;gap:20px}details{border-top:1px solid #b7bcad;padding:15px 0;font-size:13px}summary{cursor:pointer}.muted{color:#62685f}.series{scroll-margin-top:30px}@media(max-width:760px){header .wrap{min-height:80px;align-items:flex-start;flex-direction:column;justify-content:center;gap:8px}nav{gap:18px;font-size:11px;flex-wrap:wrap}.hero{padding:48px 0}.group-hero{grid-template-columns:1fr}.monogram{max-height:280px;aspect-ratio:auto;min-height:250px}.monogram span{font-size:180px}.grid{grid-template-columns:1fr}.section{padding:40px 0}.names{grid-template-columns:1fr 1fr}.section-head,.coming{align-items:flex-start;flex-direction:column}.panel,.store-feature{padding:23px}.hero h1{font-size:56px}.backfables .hero h1{font-size:clamp(38px,10.5vw,78px)}footer .wrap{flex-direction:column}.stripe{flex-direction:column;gap:3px}.wrap{width:90%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.backfables{--ink:#28251f;--paper:#fff9e9;background:var(--paper);color:var(--ink)}
.backfables header{background:var(--paper);border-bottom:3px solid var(--ink)}
.backfables .logo{font-weight:1000;font-size:28px;letter-spacing:-1.8px;transform:rotate(-2deg)}
.backfables .notice{background:var(--ink);font-size:10px}
.backfables .hero{padding:55px 0 35px;background:#f1d45e;position:relative;border-bottom:3px solid var(--ink)}
.backfables .hero:before{content:'';position:absolute;inset:0;background-image:radial-gradient(#28251f33 1px,transparent 1px);background-size:10px 10px;mask-image:linear-gradient(90deg,#000,transparent 65%);pointer-events:none}
.bf-topline{display:flex;justify-content:space-between;align-items:center;gap:20px;position:relative}.issue{font-weight:800;font-size:11px;border:2px solid var(--ink);padding:5px 12px;background:var(--paper);transform:rotate(3deg)}
.backfables .hero h1{font-size:clamp(50px,11.7vw,160px);letter-spacing:-.075em;font-weight:1000;line-height:1;margin:25px 0 10px;transform:rotate(-2deg);text-shadow:3px 3px 0 var(--paper);position:relative}
.bf-intro{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:25px 0}.bf-intro p{font-weight:700;font-size:15px;margin:0;position:relative}
.bubble{background:var(--paper);border:3px solid var(--ink);border-radius:50%;padding:16px 28px;transform:rotate(5deg);font-size:22px;font-weight:900;box-shadow:4px 5px 0 var(--ink);position:relative;white-space:nowrap}.bubble:after{content:'';width:15px;height:18px;background:var(--paper);border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);position:absolute;bottom:-10px;left:25px;transform:skew(-22deg)}
.backfables .cast-art{border:3px solid var(--ink);box-shadow:7px 7px 0 var(--ink);transform:rotate(.6deg);position:relative;aspect-ratio:1536/485;background:#ece4d7}
.bf-caption{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.1em;font-weight:800;padding-top:20px}
.backfables .button{border:2px solid var(--ink);background:var(--paper);box-shadow:4px 4px 0 var(--ink);font-weight:800;transition:transform .15s,box-shadow .15s;position:relative;margin-top:8px}
.backfables .button:hover{color:var(--ink);background:#f1d45e;transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
.bf-ticker{background:var(--ink);color:var(--paper);padding:12px 0;font-weight:900;font-size:14px;word-spacing:15px;text-align:center;overflow:hidden;white-space:nowrap}
.backfables .section{border:0;padding:65px 0}.backfables h2{font-weight:1000;font-size:clamp(35px,5vw,68px);letter-spacing:-.05em;line-height:1.1}.backfables .section-head .eyebrow{border:2px solid var(--ink);padding:4px 12px;transform:rotate(2deg)}
.bf-story{display:grid;grid-template-columns:.85fr 1.15fr;gap:35px;align-items:center}.bf-note{background:#b2c8b3;border:3px solid var(--ink);padding:35px;box-shadow:7px 7px 0 var(--ink);transform:rotate(-2deg)}.bf-note .eyebrow{font-size:10px}.bf-note h2{margin:20px 0}.bf-story-copy{border:3px solid var(--ink);padding:30px;background:#fffdf6;position:relative}.bf-story-copy:before{content:'MEANWHILE, IN HARBOR GLEN…';display:block;font-size:10px;font-weight:900;background:#f1d45e;border:2px solid var(--ink);padding:7px 12px;position:absolute;top:-20px;left:18px;transform:rotate(2deg)}.bf-story-copy p{font-size:14px;line-height:2.1}
.bf-cast{background:#e9a084;border-top:3px solid var(--ink)!important;border-bottom:3px solid var(--ink)!important}.backfables .names{gap:22px;grid-template-columns:repeat(4,1fr)}.backfables .person{border:3px solid var(--ink);background:var(--paper);box-shadow:5px 5px 0 var(--ink);padding:15px 16px 18px;position:relative;transition:transform .2s}.backfables .person:nth-child(2n){transform:rotate(1.5deg)}.backfables .person:nth-child(2n+1){transform:rotate(-1deg)}.backfables .person:hover{transform:translateY(-5px)}.backfables .person h3{font-size:27px;font-weight:1000;margin:0}.backfables .person p{font-size:12px;margin:8px 0 0;min-height:44px}.backfables .number{position:absolute;top:12px;left:12px;font-weight:800;background:#f1d45e;border:2px solid var(--ink);padding:1px 6px;z-index:1}
.portrait{height:240px;width:92px;margin:0 auto 12px;overflow:hidden;position:relative}.portrait img{position:absolute;width:760px;max-width:none;top:0;height:auto}.portrait.p0 img{left:-2px}.portrait.p1 img{left:-75px}.portrait.p2 img{left:-151px}.portrait.p3 img{left:-225px}.portrait.p4 img{left:-290px}.portrait.p5 img{left:-360px}.portrait.p6 img{left:-436px}.portrait.p7 img{left:-506px}
.backfables .panel{border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:30px;position:relative;background:#f4f0e6}.backfables .panel.color{background:#adc8b5;transform:rotate(-1deg)}.backfables .panel.series:last-child{transform:rotate(1deg)}.backfables .panel h3{font-size:46px;font-weight:1000;letter-spacing:-.05em}.swatches{display:flex;gap:10px;margin:35px 0}.swatches i{width:45px;height:45px;border:2px solid var(--ink);border-radius:50%;background:#eb977e;box-shadow:3px 3px 0 var(--ink)}.swatches i:nth-child(2){background:#f1d45e;transform:translateY(-8px)}.swatches i:nth-child(3){background:#8eafca}.swatches i:nth-child(4){background:#fff9e9}.simple-mark{font-weight:1000;font-size:58px;letter-spacing:-.07em;line-height:1;padding:25px 0;transform:rotate(-4deg)}.backfables .panel .small{font-size:11px;color:#514b42}
.bf-future{background:#b7cce0;border-top:3px solid var(--ink)!important}.bf-future h2{margin:14px 0}.backfables footer{border-top:3px solid var(--ink);background:var(--paper)}
@media(max-width:760px){.backfables .hero{padding-top:30px}.bf-topline{gap:10px}.bf-topline .eyebrow{font-size:9px}.issue{font-size:9px}.backfables .hero h1{font-size:clamp(42px,12vw,90px);text-shadow:2px 2px 0 var(--paper)}.bf-intro{align-items:flex-start}.bf-intro p{font-size:12px}.bubble{font-size:14px;padding:12px 16px}.bf-caption{font-size:8px;letter-spacing:0;gap:15px}.bf-story{grid-template-columns:1fr;gap:38px}.bf-note,.bf-story-copy{padding:25px}.backfables .section{padding:45px 0}.backfables .names{grid-template-columns:1fr 1fr;gap:17px}.backfables .person{padding:10px}.portrait{height:215px;width:84px}.portrait img{width:690px}.portrait.p0 img{left:-2px}.portrait.p1 img{left:-68px}.portrait.p2 img{left:-137px}.portrait.p3 img{left:-205px}.portrait.p4 img{left:-264px}.portrait.p5 img{left:-327px}.portrait.p6 img{left:-396px}.portrait.p7 img{left:-460px}.backfables .person h3{font-size:23px}.backfables .person p{font-size:11px}.backfables .panel h3{font-size:40px}.backfables .grid{gap:28px}}
@media(prefers-reduced-motion:reduce){.backfables .button,.backfables .person{transition:none}}

.backfables{background-color:#fff7e5;background-image:radial-gradient(#b29a6c44 .8px,transparent .8px);background-size:7px 7px}
.backfables header{background-image:repeating-linear-gradient(-45deg,transparent 0 8px,#eeddbb44 8px 9px)}
.backfables .hero{background-color:#a9cede;background-image:linear-gradient(180deg,#fff9e92b 0%,#fff9e977 35%,#f1d45e 78%),url('harbor-glen-v1.png');background-size:cover;background-position:center 45%;}
.backfables .hero:before{background-image:radial-gradient(#28251f55 1px,transparent 1px);mask-image:linear-gradient(90deg,#000,transparent 35%,transparent 65%,#000)}
.backfables .hero h1{-webkit-text-stroke:2px #28251f;color:#fff9e9;text-shadow:5px 5px 0 #28251f,8px 8px 0 #ec936f;transform:rotate(-3deg);padding-bottom:8px}
.backfables .bf-topline .eyebrow{background:#fff9e9;border:2px solid #28251f;padding:5px 10px;box-shadow:3px 3px 0 #28251f;transform:rotate(-2deg)}
.backfables .bf-intro p{background:#fff9e9;border:2px solid #28251f;padding:13px 20px;box-shadow:4px 4px 0 #28251f;transform:rotate(-1deg)}
.backfables .hero .cast-art{border-width:4px;box-shadow:9px 9px 0 #28251f;transform:rotate(1deg)}
.backfables .bf-cast{background-color:#e9a084;background-image:radial-gradient(#28251f40 1px,transparent 1px),repeating-linear-gradient(35deg,transparent 0 65px,#fff4de33 65px 105px);background-size:9px 9px,auto}
.backfables .person{border-radius:6px 12px 5px 9px}.backfables .person:nth-child(3n){background:#f6e7a8}.backfables .person:nth-child(3n+2){background:#e3eddf}
.backfables .person:after{content:'✦';position:absolute;right:13px;top:9px;font-size:24px;color:#b16b43}
.backfables .bf-note{background-image:repeating-linear-gradient(0deg,transparent 0 31px,#28251f15 31px 32px)}
.town-panel{position:relative;border:4px solid #28251f;margin:15px auto 12px;box-shadow:9px 9px 0 #28251f;transform:rotate(-.8deg);background:#9cc6d7;overflow:hidden}
.town-panel img{display:block;width:100%;height:clamp(240px,35vw,470px);object-fit:cover;object-position:center 58%}
.town-label{position:absolute;top:20px;left:20px;background:#f1d45e;border:3px solid #28251f;padding:10px 20px;box-shadow:4px 4px 0 #28251f;transform:rotate(2deg)}.town-label strong{display:block;font-weight:1000;font-size:clamp(24px,4vw,50px);line-height:1.1;letter-spacing:-.05em}.town-label span{font-weight:800;font-size:10px;letter-spacing:.1em}
.town-caption{position:absolute;bottom:18px;right:18px;margin:0;background:#fff9e9;border:2px solid #28251f;padding:9px 16px;font-size:12px;font-weight:700;max-width:75%}
.town-footnote{font-size:10px;margin:20px 0 0;text-align:right;color:#655c4b}
.backfables .bf-future{background-color:#b7cce0;background-image:radial-gradient(#28251f33 1px,transparent 1px);background-size:9px 9px;position:relative}
.backfables .bf-future:before{content:'TO BE CONTINUED…';display:block;font-weight:1000;letter-spacing:.05em;background:#f1d45e;border:3px solid #28251f;padding:8px 20px;transform:rotate(-3deg);position:absolute;top:-22px;left:5%;box-shadow:4px 4px 0 #28251f}
.backfables .swatches i:nth-child(odd){transform:rotate(-10deg);border-radius:10px}.backfables footer{background-image:repeating-linear-gradient(-45deg,transparent 0 8px,#eeddbb66 8px 9px)}
@media(max-width:760px){.backfables .hero h1{-webkit-text-stroke:1px #28251f;text-shadow:3px 3px 0 #28251f,5px 5px 0 #ec936f}.backfables .bf-intro p{padding:10px;max-width:74%;font-size:11px}.town-label{top:12px;left:12px;padding:8px 12px}.town-caption{font-size:10px;bottom:12px;right:12px;padding:6px 9px}.town-panel{box-shadow:5px 5px 0 #28251f}.backfables .bf-topline .eyebrow{max-width:50%;font-size:8px}.backfables .issue{max-width:45%;font-size:8px}}

.backfables button.person{font:inherit;color:inherit;text-align:left;width:100%;cursor:pointer;appearance:none}.profile-invite{display:flex;justify-content:space-between;gap:8px;margin-top:18px;padding-top:10px;border-top:2px dashed #28251f;font-size:10px;font-weight:900}.profile-invite b{font-size:20px;line-height:1}.backfables button.person:focus-visible{outline:4px solid #307aa5;outline-offset:8px}
.backfables .portrait{height:220px}.backfables .portrait img{top:-15px}.backfables .p0{width:75px}.backfables .p0 img{left:-10px}.backfables .p1{width:80px}.backfables .p1 img{left:-75px}.backfables .p2{width:70px}.backfables .p2 img{left:-158px}.backfables .p3{width:74px}.backfables .p3 img{left:-228px}.backfables .p4{width:66px}.backfables .p4 img{left:-303px}.backfables .p5{width:76px}.backfables .p5 img{left:-367px}.backfables .p6{width:73px}.backfables .p6 img{left:-443px}.backfables .p7{width:69px}.backfables .p7 img{left:-513px}
html.profile-open{overflow:hidden}.profile-dialog{--profile:#efbd59;width:min(1120px,94vw);max-width:1120px;max-height:92dvh;border:4px solid #28251f;padding:0;background:#fff8e9;color:#28251f;box-shadow:10px 10px 0 #28251f;border-radius:10px;overflow:auto;overscroll-behavior:contain}.profile-dialog::backdrop{background:#171b23d9;backdrop-filter:blur(5px)}.profile-dialog[open]{animation:profile-in .2s ease-out}.profile-alex{--profile:#adc1b0}.profile-jamal{--profile:#edc556}.profile-tyler{--profile:#9ed2bf}.profile-mia{--profile:#eaa292}.profile-zoe{--profile:#b7aed0}.profile-chris{--profile:#ecb07b}.profile-ryan{--profile:#91c4e2}.profile-lily{--profile:#ead476}
.profile-toolbar{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:15px;background:#28251f;color:#fff9e9;padding:10px 20px;font-size:10px;font-weight:800;letter-spacing:.1em}.profile-close{border:2px solid #fff9e9;background:#fff9e9;color:#28251f;font:inherit;font-size:12px;cursor:pointer;padding:5px 12px;min-height:36px}.profile-close:hover{background:var(--profile)}
.profile-cover{padding:28px 40px 35px;background-color:var(--profile);background-image:radial-gradient(#28251f44 1px,transparent 1px);background-size:8px 8px;border-bottom:3px solid #28251f;position:relative}.profile-cover:after{content:'✳';font-size:100px;line-height:1;position:absolute;right:35px;bottom:24px;transform:rotate(10deg);opacity:.6}.profile-cover .eyebrow{display:inline-block;background:#fff9e9;border:2px solid #28251f;padding:4px 10px;transform:rotate(-2deg)}.profile-cover h2{font-size:clamp(65px,10vw,130px);font-weight:1000;line-height:1;letter-spacing:-.075em;margin:16px 0 8px;text-shadow:3px 3px 0 #fff9e9;position:relative;z-index:1}.profile-cover p{font-weight:800;font-size:clamp(15px,2vw,23px);margin:0;max-width:85%}
.profile-body{padding:30px 40px;background-image:repeating-linear-gradient(0deg,transparent 0 31px,#c4b49820 31px 32px)}.profile-facts{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}.profile-facts span{border:2px solid #28251f;background:#fffdf5;padding:5px 12px;font-size:11px;font-weight:700}.profile-lead{font-size:15px;line-height:2;max-width:850px;margin:20px 0 30px}
.profile-album{margin:20px 0 30px;padding:12px 12px 0;border:3px solid #28251f;background:#fffdf6;box-shadow:6px 6px 0 #28251f;transform:rotate(-.6deg);position:relative}.profile-album:before{content:'';width:110px;height:25px;position:absolute;background:#f0d57cab;top:-13px;left:calc(50% - 55px);transform:rotate(-4deg);border-left:2px dashed #fff9e9;border-right:2px dashed #fff9e9}.profile-album img{width:100%;height:auto;display:block;border:2px solid #28251f;aspect-ratio:3/2;object-fit:contain;background:#ece4d7}.profile-album figcaption{padding:13px 5px 15px;display:flex;align-items:baseline;justify-content:space-between;gap:20px;font-weight:900;font-size:12px}.profile-album figcaption small{font-size:10px;font-weight:400}
.profile-captions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 32px;padding:0;list-style:none}.profile-captions li{border-left:3px solid var(--profile);padding:3px 10px;font-size:11px}.profile-captions b{display:block;font-size:10px;margin-bottom:3px}.profile-captions.two{grid-template-columns:1fr 1fr}
.profile-notes{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:start}.profile-note{border:2px solid #28251f;background:#fffdf6;padding:22px;box-shadow:4px 4px 0 #28251f}.profile-note h3{font-size:23px;font-weight:900;margin:0 0 12px}.profile-note p{font-size:13px;line-height:2;margin:0}.profile-note.highlight{background:var(--profile);transform:rotate(1deg)}.profile-note.full{grid-column:1/-1}.profile-likes{display:flex;gap:8px;flex-wrap:wrap;padding:0;list-style:none;margin:15px 0 0}.profile-likes li{padding:5px 10px;background:#fff9e9;border:2px solid #28251f;border-radius:30px;font-size:11px;font-weight:700}.profile-after{margin-top:28px;padding:22px;border:3px solid #28251f;background:var(--profile)}.profile-after p{margin:6px 0;font-size:13px}.profile-after strong{font-size:12px;letter-spacing:.08em}.profile-switch{display:flex;justify-content:space-between;gap:15px;padding:24px 0 0}.profile-switch button{font:inherit;font-size:12px;font-weight:900;border:2px solid #28251f;box-shadow:3px 3px 0 #28251f;background:#fff9e9;padding:10px 17px;cursor:pointer}.profile-switch button:hover{background:var(--profile)}.profile-source-note{font-size:10px;margin-top:25px;color:#665e51}
@keyframes profile-in{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:760px){.profile-dialog{width:94vw;max-height:94dvh;box-shadow:5px 5px 0 #28251f}.profile-toolbar{padding:8px 12px;font-size:9px;letter-spacing:0}.profile-cover{padding:24px 20px}.profile-cover:after{font-size:65px;right:16px}.profile-cover h2{font-size:75px}.profile-cover p{font-size:16px}.profile-body{padding:24px 17px}.profile-lead{font-size:13px}.profile-notes{grid-template-columns:1fr;gap:18px}.profile-note{padding:18px}.profile-album{padding:7px 7px 0;box-shadow:4px 4px 0 #28251f}.profile-album figcaption{gap:5px;flex-direction:column;font-size:11px}.profile-captions{grid-template-columns:1fr!important;gap:8px}.profile-switch button{padding:10px;font-size:11px}.profile-facts span{font-size:10px}.profile-note.full{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.profile-dialog[open]{animation:none}}
@media(max-width:760px){.backfables .portrait{height:200px}.backfables .p0{width:68px}.backfables .p0 img{left:-9px}.backfables .p1{width:73px}.backfables .p1 img{left:-68px}.backfables .p2{width:64px}.backfables .p2 img{left:-144px}.backfables .p3{width:67px}.backfables .p3 img{left:-207px}.backfables .p4{width:60px}.backfables .p4 img{left:-275px}.backfables .p5{width:69px}.backfables .p5 img{left:-333px}.backfables .p6{width:66px}.backfables .p6 img{left:-402px}.backfables .p7{width:63px}.backfables .p7 img{left:-466px}}
.backfables .profile-alex{--profile:#A8B9C7}.backfables .person[data-profile="alex"]{--person-color:#A8B9C7;background:#A8B9C7}
.backfables .profile-jamal{--profile:#F3C54E}.backfables .person[data-profile="jamal"]{--person-color:#F3C54E;background:#F3C54E}
.backfables .profile-tyler{--profile:#86C6AD}.backfables .person[data-profile="tyler"]{--person-color:#86C6AD;background:#86C6AD}
.backfables .profile-mia{--profile:#EC9990}.backfables .person[data-profile="mia"]{--person-color:#EC9990;background:#EC9990}
.backfables .profile-zoe{--profile:#ACA6C5}.backfables .person[data-profile="zoe"]{--person-color:#ACA6C5;background:#ACA6C5}
.backfables .profile-chris{--profile:#DCA775}.backfables .person[data-profile="chris"]{--person-color:#DCA775;background:#DCA775}
.backfables .profile-ryan{--profile:#7ABCE1}.backfables .person[data-profile="ryan"]{--person-color:#7ABCE1;background:#7ABCE1}
.backfables .profile-lily{--profile:#DFD67B}.backfables .person[data-profile="lily"]{--person-color:#DFD67B;background:#DFD67B}
.backfables .person .card-quote{display:block;font-weight:800;font-size:12px;line-height:1.8;min-height:65px}.person-color{display:block;font-size:9px;font-weight:800;letter-spacing:.07em;border-top:1px solid #28251f66;margin-top:10px;padding-top:8px}.backfables .person .profile-invite{margin-top:8px}.profile-says{display:block;background:#fff9e9;border:3px solid #28251f;padding:15px 20px;box-shadow:4px 4px 0 #28251f;transform:rotate(-1deg);font-size:clamp(15px,2vw,22px);font-weight:900;position:relative;max-width:86%;margin:15px 0 0}.profile-says:after{content:'';position:absolute;bottom:-10px;left:25px;width:15px;height:15px;transform:rotate(45deg);background:#fff9e9;border-right:3px solid #28251f;border-bottom:3px solid #28251f}.profile-cover .voice-label{display:block;font-size:10px;margin-top:19px;font-weight:700}.profile-cover:after{opacity:.3;right:16px}.profile-qa{margin-top:30px}.profile-qa h3{font-size:30px;font-weight:1000;margin:0 0 20px}.qa-item{margin:0 0 20px}.qa-item dt{font-size:11px;font-weight:800;margin-bottom:8px}.qa-item dd{margin:0 12px 0 0;background:var(--profile);border:2px solid #28251f;border-radius:4px 15px 15px 15px;padding:14px 18px;font-size:13px;line-height:1.9;box-shadow:3px 3px 0 #28251f}.character-jump{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 4px}.character-jump a{border:2px solid #28251f;background:#fff9e9;padding:7px 12px;font-size:11px;font-weight:800;box-shadow:2px 2px 0 #28251f}.character-jump a:hover{background:#f1d45e}.bf-bonds{background:#bcd0b3;border-block:3px solid #28251f!important;background-image:radial-gradient(#28251f2c 1px,transparent 1px);background-size:9px 9px}.bond-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.bond-card{border:3px solid #28251f;background:#fff9e9;box-shadow:5px 5px 0 #28251f;padding:23px;position:relative}.bond-card:nth-child(2n){transform:rotate(1deg)}.bond-names{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.bond-names button{font:inherit;font-weight:900;font-size:18px;border:2px solid #28251f;padding:4px 8px;cursor:pointer}.bond-names button:hover{transform:translateY(-2px)}.bond-card h3{font-size:16px;font-weight:900;margin-top:16px}.bond-card p{font-size:12px;line-height:1.9;margin-bottom:0}.color-alex{background:#A8B9C7}.color-jamal{background:#F3C54E}.color-tyler{background:#86C6AD}.color-mia{background:#EC9990}.color-zoe{background:#ACA6C5}.color-chris{background:#DCA775}.color-ryan{background:#7ABCE1}.color-lily{background:#DFD67B}.place-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.place-card{border:3px solid #28251f;box-shadow:5px 5px 0 #28251f;background:#fff9e9;padding:25px}.place-card:nth-child(2){background:#f0cd77;transform:rotate(-1deg)}.place-card:nth-child(3){background:#b7cce0;transform:rotate(1deg)}.place-icon{font-family:Georgia,serif;font-size:70px;font-weight:900;line-height:1.1;color:#5f765e}.place-card h3{font-size:25px;font-weight:900;line-height:1.2}.place-card p{font-size:13px;line-height:1.9}.place-card .eyebrow{font-size:9px}.world-rule{border:3px solid #28251f;padding:25px;background:#f1d45e;display:flex;align-items:center;gap:30px;margin-top:30px;box-shadow:5px 5px 0 #28251f}.world-rule strong{font-size:35px;font-weight:1000;white-space:nowrap;line-height:1.2}.world-rule p{font-size:13px;line-height:1.9;margin:0}.world-intro{font-size:14px;max-width:760px;margin-bottom:30px}.backfables section[id]{scroll-margin-top:25px}
@media(max-width:760px){.bond-grid,.place-grid{grid-template-columns:1fr;gap:22px}.world-rule{flex-direction:column;align-items:flex-start;gap:15px;padding:22px}.world-rule strong{font-size:30px}.profile-says{max-width:95%;padding:12px;font-size:15px}.profile-cover .voice-label{font-size:9px;max-width:90%}.profile-qa h3{font-size:25px}.backfables .person .card-quote{font-size:11px;min-height:62px}.bond-names button{font-size:20px}.character-jump{gap:8px}.character-jump a{font-size:10px}}
