*{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-gutter:stable;background:#f9f2df}body{margin:0;background:#f9f2df}body,button,a{touch-action:manipulation}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}main{max-width:1600px;margin:0 auto}img{display:block;width:100%;height:auto;user-select:none}button{border:0;padding:0;background:transparent}a{display:block}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.stage{position:relative;isolation:isolate;width:100%;aspect-ratio:3/2;overflow:hidden}.art{display:block;width:100%;height:100%}.art img{width:100%;height:100%;object-fit:fill}.blink{position:absolute;inset:0;display:block;opacity:0;pointer-events:none;mask-image:radial-gradient(ellipse 4.5% 3.8% at 45.5% 46.3%,#000 62%,transparent 100%),radial-gradient(ellipse 3.8% 3.8% at 59.2% 45.5%,#000 62%,transparent 100%)}.blink img{width:100%;height:100%;object-fit:fill}.stage.is-blinking .blink{opacity:1}.hotspot{position:absolute;display:block;background:transparent;border:0;padding:0;border-radius:16%;cursor:pointer;color:transparent}.hotspot:focus-visible,.mobile-grid button:focus-visible,.mobile-return:focus-visible{outline:3px dashed #65704b;outline-offset:3px}.hotspot.key:after,.portrait:after{content:'';position:absolute;inset:4%;border-radius:12%;pointer-events:none;opacity:0;box-shadow:inset 0 0 25px #fff8}.hotspot.key:hover:after,.portrait:hover:after{opacity:1}.hotspot.key:active:after{opacity:1;box-shadow:inset 0 0 24px #54513b44}.cat{left:35%;top:37%;width:29%;height:24%;cursor:grab}.cat:active{cursor:grabbing}.buy{left:12.5%;top:81.8%;width:21.2%;height:15%}.pfps{left:40.1%;top:81.8%;width:20%;height:15%}.social{left:66.8%;top:81.8%;width:19.6%;height:15%}.collection{position:relative;background:#fbf4e1;scroll-margin-top:0}.gallery-desktop{position:relative}.gallery-mobile{display:none}.gallery-art{width:100%;height:auto}.portrait{top:38%;height:33.5%;width:21.4%;border-radius:2%}.p1{left:3.9%}.p2{left:27.6%}.p3{left:51.1%}.p4{left:74.6%}.return{left:36.8%;top:78%;width:26.5%;height:19%}.return:hover{box-shadow:inset 0 0 35px #fff3}dialog{position:fixed;width:min(390px,84vw);max-width:none;max-height:90svh;padding:0;border:0;background:#f9f0d9;box-shadow:0 15px 60px #2d322c44;overflow:hidden}dialog::backdrop{background:#24302280}dialog .ok{left:30%;top:55%;width:38%;height:36%;border-radius:10%}dialog .ok:hover{box-shadow:inset 0 0 30px #fff3}dialog img{aspect-ratio:1;object-fit:cover}
@media(max-width:640px){.stage{aspect-ratio:2/3}.blink{mask-image:radial-gradient(ellipse 6% 3.8% at 39.5% 45.1%,#000 65%,transparent 100%),radial-gradient(ellipse 5.6% 3.8% at 65.4% 44.5%,#000 65%,transparent 100%)}.cat{left:26%;top:36%;width:49%;height:23%}.buy{left:3.8%;top:81.8%;width:29.2%;height:10.5%}.pfps{left:36.3%;top:81.8%;width:28.4%;height:10.5%}.social{left:67.7%;top:81.8%;width:28.5%;height:10.5%}.gallery-desktop{display:none}.gallery-mobile{display:block;padding:24px 0 25px}.gallery-title{display:block;width:100%;height:auto}.mobile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:18px 14px}.mobile-grid button{display:block;width:100%;min-width:0;border:0}.mobile-grid svg{display:block;width:100%;height:auto}.mobile-return{width:40%;margin:15px auto 0}.mobile-return svg{width:100%;display:block}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* The entire website is a single scene. The generator lives inside it. */
html,body{height:100%;overflow:hidden;scrollbar-gutter:auto;background:#d1cfc4}body:before{content:'';position:fixed;inset:-30px;background:url('assets/scene-desktop.png') center/cover;filter:blur(22px);pointer-events:none}main{position:relative;width:100%;height:100svh;max-width:none;display:flex;align-items:center;justify-content:center}.stage{width:min(100vw,150svh);height:auto;aspect-ratio:3/2;flex:none}#generator{width:min(760px,92vw,92svh);aspect-ratio:1;max-height:none;overflow:hidden;background:#eae0c6}#generator .generator-art{width:100%;height:100%}#generator .pfp-preview{position:absolute;left:7.6%;top:25.7%;width:50%;height:50%;object-fit:cover;border-radius:1.5%}.generator-close{left:88.2%;top:2.2%;width:10.2%;height:10.4%}.original{left:63%;top:28%;width:32.7%;height:14.7%}.random{left:63%;top:45%;width:32.7%;height:14.6%;cursor:not-allowed;background:#f5ecd255}.reset{left:63%;top:61.8%;width:32.7%;height:14.7%}.save{left:15%;top:82.3%;width:70%;height:15%}.original:hover,.reset:hover,.save:hover,.generator-close:hover{box-shadow:inset 0 0 20px #fff3}.original[aria-pressed=true]{box-shadow:inset 0 0 0 2px #68744855}.pfp-preview.pulse{filter:brightness(1.04)}@media(max-width:640px){body:before{background-image:url('assets/scene-mobile.png')}main{height:100svh}.stage{width:min(100vw,66.6667svh);aspect-ratio:2/3}#generator{width:min(96vw,92svh)}}
body:before{display:none}main{width:100%;height:100dvh}.stage{width:100%;height:100dvh;aspect-ratio:auto}.art,.art img,.blink,.blink img{width:100%;height:100%;object-fit:fill}.blink{mask-image:radial-gradient(ellipse 4% 3.5% at 45.2% 48.3%,#000 60%,transparent 100%),radial-gradient(ellipse 3.6% 3.5% at 59.1% 47.6%,#000 60%,transparent 100%)}.buy{left:13.3%;top:80%;width:21%;height:13.5%}.pfps{left:40%;top:80%;width:20.5%;height:13.5%}.social{left:65.8%;top:80%;width:20.5%;height:13.5%}.cat{left:35%;top:39%;width:30%;height:25%}#generator .pfp-preview{left:5.6%;top:26.3%;width:44.3%;height:47%;object-fit:cover}.generator-close{left:88.5%;top:1.5%;width:8.8%;height:11%}.category{width:20.2%;height:11.5%;border-radius:14%}.category[aria-selected=true]{box-shadow:inset 0 0 0 2px #66764c88}.base{left:54%;top:26%}.head{left:75.8%;top:26%}.outfit{left:54%;top:39.5%}.extras{left:75.8%;top:39.5%}.reset{left:7.8%;top:84%;width:34%;height:12.5%}.save{left:44.8%;top:84%;width:47.5%;height:12.5%}.choice{position:absolute;top:59.4%;width:11.6%;height:11.5%;border-radius:12%;overflow:hidden}.choice-one{left:55.3%}.choice-two{left:68.8%}.choice-three{left:82%}.choice img{width:100%;height:100%;object-fit:cover}.choice:disabled{cursor:default}.choice:focus-visible{outline:2px solid #65704b}.choices.empty .choice-one img{display:none}@media(max-width:640px){main,.stage{height:100dvh;width:100%;aspect-ratio:auto}.blink{mask-image:radial-gradient(ellipse 6% 2.8% at 43.4% 49.1%,#000 60%,transparent 100%),radial-gradient(ellipse 5% 2.8% at 65.8% 48.7%,#000 60%,transparent 100%)}.buy{left:3.8%;top:76%;width:29%;height:8.7%}.pfps{left:35.5%;top:76%;width:29%;height:8.7%}.social{left:67%;top:76%;width:29%;height:8.7%}.cat{left:27%;top:41%;width:47%;height:21%}}
#generator .pfp-preview{left:4.9%;top:23.2%;width:43.6%;height:44.5%;object-fit:fill;border-radius:2%}.generator-close{left:88.3%;top:2.8%;width:8.5%;height:9%}.thumbnail-tray{position:absolute;left:52.8%;top:24.3%;width:41.8%;height:51.4%;overflow:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:7px;padding:5px;scrollbar-width:thin;scrollbar-color:#8e946b #e5d6b7}.thumbnail-tray button{aspect-ratio:1;min-width:0;width:100%;border:2px solid transparent;border-radius:5px;overflow:hidden}.thumbnail-tray button[aria-pressed=true]{border-color:#5d6d3d}.thumbnail-tray button:focus-visible{outline:2px solid #46582c}.thumbnail-tray img{width:100%;height:100%;object-fit:contain}.previous{left:4.5%;top:70.2%;width:10%;height:8.8%}.random-pfp{left:16.5%;top:70.2%;width:20.7%;height:8.8%}.next{left:39.1%;top:70.2%;width:10%;height:8.8%}#generator .save{left:15.5%;top:82.5%;width:68.5%;height:13%}@media(max-width:640px){.thumbnail-tray{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:3px}}
.thumbnail-tray{display:flex;flex-wrap:wrap;align-content:flex-start;align-items:flex-start}.thumbnail-tray button{position:relative;flex:0 0 calc((100% - 14px)/3);aspect-ratio:1;height:auto}.thumbnail-tray img{position:absolute;inset:0;width:100%;height:100%}@media(max-width:640px){.thumbnail-tray button{flex-basis:calc((100% - 4px)/2)}}
/* Engraved CA plaque stays below the three navigation keys. */
.ca-plaque{position:absolute;left:50%;bottom:.4%;transform:translateX(-50%);width:clamp(230px,32vw,530px);height:5.4%;overflow:hidden;pointer-events:none}
.ca-plaque img{position:absolute;left:0;top:-38%;width:100%;height:180%;object-fit:fill}
@media(max-width:640px){.ca-plaque{width:76%;height:7%;bottom:4%}}
.ca-plaque{pointer-events:auto;width:clamp(280px,40vw,620px);cursor:pointer;border-radius:12px}
.ca-plaque:disabled{cursor:default;opacity:1}
.ca-plaque:focus-visible{outline:2px dashed #6c7051;outline-offset:2px}
.ca-text{position:absolute;inset:0 6% 6%;display:flex;align-items:center;justify-content:center;gap:14px;color:#726b59;font-family:'Courier New',monospace;font-weight:700;font-size:clamp(12px,1.3vw,19px);text-shadow:0 1px 0 #fff7,0 -.5px .6px #71675170;filter:blur(.18px)}
.ca-label{opacity:.75;border-right:1px solid #93856b66;padding-right:14px}
#ca-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca-plaque.has-address .ca-text{font-size:clamp(10px,1vw,14px);gap:8px}
.ca-plaque.has-address .ca-label{padding-right:8px}
@media(max-width:640px){.ca-plaque{width:86%}.ca-text{font-size:16px}.ca-plaque.has-address .ca-text{font-size:10px}}
.ca-text{font-size:clamp(16px,1.5vw,21px)}