.locker-builder{max-width:1500px!important;padding-bottom:110px!important}.locker-hero2{display:flex;justify-content:space-between;align-items:center;gap:20px;background:linear-gradient(120deg,#c51f32,#f04b37);color:#fff;border-radius:26px;padding:26px 30px;box-shadow:0 9px 0 #8f1724}.locker-hero2 h1{font-size:clamp(2rem,4vw,3.5rem);margin:5px 0}.locker-hero2 p{max-width:720px;font-weight:700}.wallet2{background:#fff;color:#8a4500;border-radius:22px;padding:15px 25px;font-size:2rem;box-shadow:0 6px 0 #f5b323}.wallet2 small{display:block;font-size:.7rem;text-align:center}.world-tabs{display:flex;gap:9px;margin:22px 0 15px;overflow:auto}.world-tabs button{border:0;border-radius:99px;padding:13px 20px;background:#fff;font-weight:1000;color:#536174;white-space:nowrap;cursor:pointer;box-shadow:0 3px 12px #0001}.world-tabs button.active{background:#176fe5;color:#fff}.world-panel{display:none}.world-panel.active{display:block}.locker-layout{display:grid;grid-template-columns:minmax(300px,430px) 1fr;gap:20px}.avatar-stage{position:sticky;top:90px;min-height:570px;border-radius:30px;background:linear-gradient(#bde8ff 0 55%,#d9efc1 55%);overflow:hidden;text-align:center;box-shadow:0 10px 30px #0001;border:5px solid #fff}.avatar-stage:before{content:"BFP JUNIOR LOCKER";position:absolute;left:10%;right:10%;top:7%;background:#cf2637;color:#fff;border-radius:12px;padding:8px;font-weight:1000}.avatar-stage:after{content:"";position:absolute;left:0;right:0;bottom:0;height:20%;background:repeating-linear-gradient(90deg,#d8d8d8 0 60px,#c9c9c9 60px 63px)}.avatar-name{position:absolute;top:18%;left:0;right:0;font-weight:1000;color:#174a7d}.avatar-person{position:absolute;z-index:4;left:50%;top:48%;width:240px;height:310px;transform:translate(-50%,-50%)}.avatar-base{position:absolute;inset:0;display:grid;place-items:center;font-size:12rem;filter:drop-shadow(0 10px 4px #0002)}.wear{position:absolute;z-index:5;filter:drop-shadow(0 5px 2px #0002);pointer-events:none}.wear-head{font-size:5rem;left:50%;top:8%;transform:translateX(-50%)}.wear-body{font-size:8rem;left:50%;top:43%;transform:translateX(-50%)}.wear-feet{font-size:5rem;left:50%;bottom:2%;transform:translateX(-50%)}.wear-accessory{font-size:3.5rem;right:10%;top:42%}.wear-hand{font-size:5rem;right:-3%;top:49%;transform:rotate(-18deg)}.wear-badge{font-size:2.6rem;left:31%;top:48%}.gear-change{animation:gearPop .55s ease}.gear-spark{position:absolute;inset:20%;background:radial-gradient(circle,#fff8,transparent 65%);animation:pulse 2s infinite}.equipped-list{position:absolute;z-index:6;left:12px;right:12px;bottom:15px;display:flex;gap:5px;flex-wrap:wrap;justify-content:center}.equipped-list span{background:#ffffffdf;border-radius:99px;padding:5px 9px;font-size:.72rem;font-weight:900}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:12px}.section-title small,.station-top small{font-weight:1000;color:#d12c3b}.section-title h2,.station-top h2{margin:3px 0}.gear-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:12px}.gear-card{border:3px solid #fff;background:#fff;border-radius:20px;padding:15px;min-height:155px;cursor:pointer;box-shadow:0 7px 22px #0001;color:#34445a}.gear-card:hover{transform:translateY(-3px)}.gear-card.is-equipped{border-color:#ffbe26;background:#fff8d8;box-shadow:0 6px 0 #e4a51d}.gear-card .gear-emoji{display:block;font-size:3.5rem}.gear-card b,.gear-card small{display:block}.gear-card small{margin-top:5px;color:#667}.station-top{display:flex;justify-content:space-between;align-items:center;background:#fff;padding:16px 20px;border-radius:18px;margin-bottom:12px}.station-top h2{outline:none;border-bottom:2px dashed #ccd6e2}.station-top button{border:0;border-radius:12px;padding:10px 14px;font-weight:900}.station-layout{display:grid;grid-template-columns:1fr 300px;gap:15px}.station-scene{position:relative;height:min(650px,67vh);min-height:520px;overflow:hidden;border-radius:24px;background:linear-gradient(#8edcff 0 55%,#74c65e 55%);border:6px solid #fff;box-shadow:0 10px 30px #0002;touch-action:none}.sky{position:absolute;left:0;right:0;top:7%;display:flex;justify-content:space-around;font-size:4rem;opacity:.8}.station-building{position:absolute;left:8%;right:8%;top:18%;height:49%;background:#f4e6d4;border:8px solid #d7473e;border-radius:12px 12px 4px 4px;box-shadow:0 10px 0 #a82e2e}.station-building:before{content:"";position:absolute;left:-4%;right:-4%;top:-13%;height:18%;background:#d32f3b;clip-path:polygon(5% 100%,15% 0,85% 0,95% 100%)}.station-sign{position:absolute;z-index:2;left:20%;right:20%;top:4%;background:#fff;border:4px solid #164c86;border-radius:8px;text-align:center;padding:7px;color:#164c86;font-weight:1000}.bay{position:absolute;left:8%;bottom:0;width:60%;height:67%;display:flex;gap:4%}.bay div{flex:1;background:repeating-linear-gradient(0deg,#e9edf0 0 28px,#c8ced4 28px 32px);border:5px solid #687b8d}.station-door{position:absolute;right:9%;bottom:0;background:#8a4f35;width:12%;height:42%;display:grid;place-items:center;font-size:2rem}.station-window{position:absolute;right:8%;top:26%;font-size:4rem;color:#4ca6df}.road{position:absolute;left:0;right:0;bottom:0;height:24%;background:#66717e}.road:after{content:"";position:absolute;left:0;right:0;top:55%;border-top:8px dashed #fff}.grass{position:absolute;left:0;right:0;bottom:24%;height:10%;background:#65b34f}.placed{position:absolute;z-index:10;transform:translate(-50%,-50%);border:0;background:transparent;cursor:grab;touch-action:none}.placed span{font-size:4rem;filter:drop-shadow(0 5px 3px #0003)}.placed.large span{font-size:8rem}.placed i{display:none;position:absolute;right:-5px;top:-5px;background:#e33;color:#fff;border-radius:50%;font-style:normal;width:25px;height:25px}.placed:hover i,.placed.moving i{display:grid;place-items:center}.placed.moving{cursor:grabbing;transform:translate(-50%,-50%) scale(1.1)}.station-shop{background:#fff;border-radius:20px;padding:14px;max-height:650px;overflow:auto}.station-items{display:grid;gap:8px}.station-items button{display:flex;align-items:center;gap:10px;border:2px solid #e8edf2;background:#f8fafc;border-radius:14px;padding:10px;text-align:left;cursor:pointer}.station-items button.owned{border-color:#a9ddba;background:#f1fff5}.station-items span{font-size:2.2rem}.station-items b,.station-items small{display:block}.station-items small{color:#667}.color-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}.color-gallery article{background:#fff;border-radius:18px;padding:10px;box-shadow:0 6px 20px #0001}.color-gallery img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:12px;background:#f4f5f7}.color-gallery b,.color-gallery small{display:block;margin-top:5px}.empty-gallery{text-align:center;background:#fff;border-radius:24px;padding:55px;font-size:4rem}.empty-gallery h3{font-size:1.4rem}.empty-gallery p{font-size:1rem}.empty-gallery a{font-size:1rem;font-weight:900}@keyframes gearPop{0%{transform:translate(-50%,-50%) scale(.8) rotate(-5deg)}55%{transform:translate(-50%,-50%) scale(1.13) rotate(3deg)}100%{transform:translate(-50%,-50%) scale(1)}}@keyframes pulse{50%{transform:scale(1.15);opacity:.4}}@media(max-width:900px){.locker-layout,.station-layout{display:block}.avatar-stage{position:relative;top:auto;min-height:480px;margin-bottom:15px}.station-shop{margin-top:12px;max-height:none}.station-items{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.locker-hero2{display:block}.wallet2{display:inline-block;margin-top:10px}.gear-grid{grid-template-columns:repeat(2,1fr)}.station-scene{min-height:440px}.placed.large span{font-size:5rem}.station-items{grid-template-columns:1fr}.world-tabs button{padding:11px 14px}}
/* Connect-the-Dots gallery integration */
.color-gallery .gallery-art{position:relative;overflow:hidden}
.gallery-image{position:relative;background:#fff;border-radius:14px;overflow:hidden}
.gallery-image img{display:block;width:100%;height:auto;aspect-ratio:auto!important;object-fit:contain!important;background:#fff}
.art-type{position:absolute;left:8px;top:8px;background:rgba(255,255,255,.94);border:1px solid #e1e6ea;border-radius:999px;padding:5px 8px;font-size:.62rem;font-weight:900;color:#34495a;box-shadow:0 2px 8px #0001}
.dot-art{border:2px solid #f0c44d!important}
.color-dot-art{width:100%;margin-top:8px;border:0;border-radius:11px;padding:9px 10px;background:#b51f2e;color:#fff;font-weight:900;cursor:pointer}
.color-dot-art:hover{filter:brightness(1.06);transform:translateY(-1px)}
