.studio-main{max-width:1250px;margin:auto;padding:30px 5% 55px}.studio-top{display:flex;gap:15px;justify-content:space-between;align-items:center}.studio-top h1{font-size:36px;margin:12px 0}.studio-layout{display:grid;grid-template-columns:340px minmax(0,1fr);gap:26px;margin-top:25px}.hero-preview{position:sticky;top:20px;align-self:start;border:1px solid #dacfed;border-radius:24px;background:radial-gradient(ellipse at center,#fff 0,#eee5ff 70%);overflow:hidden;padding:18px;text-align:center}.hero-preview h2{font-size:23px;margin:5px 0}.hero-preview p{font-size:12px;color:#6c6183;margin:3px 0}.hero-preview .custom-avatar{height:360px;width:100%;display:block}.duo-pet{height:100px;margin-top:-27px;text-align:right;pointer-events:none}.duo-pet .companion-image{height:100px;width:155px;object-fit:contain;mix-blend-mode:multiply}.preview-stamp{font-size:10px;color:#716181;border-top:1px solid #dfd5ef;padding-top:12px;margin-top:12px}.studio-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 20px}.studio-tabs button{border:1px solid #d8cbea;border-radius:11px;padding:11px 15px;background:#fff;color:#6b4b93;font-weight:900}.studio-tabs button.active{background:var(--purple);color:white;border-color:var(--purple)}.studio-controls{min-width:0}.control-card{background:white;border:1px solid #e2dbea;border-radius:20px;padding:23px;margin-bottom:17px}.control-card h2{font-size:24px;margin:0 0 15px}.control-card h3{font-size:15px;margin:21px 0 12px}.option-grid{display:flex;gap:8px;flex-wrap:wrap}.option{border:2px solid #e4dced;background:#faf8fd;border-radius:10px;padding:9px 12px;color:var(--navy);font-size:13px;font-weight:800}.option[aria-pressed="true"]{background:#eee4ff;border-color:var(--purple);color:#5c22bc}.swatches{display:flex;gap:9px;flex-wrap:wrap;align-items:center}.swatch{height:35px;width:35px;border-radius:50%;border:2px solid #ddd;position:relative}.swatch[aria-pressed="true"]{outline:3px solid var(--purple);outline-offset:2px}.color-label{display:flex;align-items:center;gap:10px;font-size:12px;margin-top:14px}.color-label input{width:42px;height:33px;border:1px solid #cfc2e2;background:white;border-radius:7px}.toggle-label{display:flex;align-items:center;gap:10px;margin:13px 0;font-size:14px}.toggle-label input,.confirm-label input{width:19px;height:19px;accent-color:var(--purple)}.pet-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.pet-option{background:#faf8fd;border:2px solid #e4dced;border-radius:15px;padding:9px;color:var(--navy);font-weight:900}.pet-option .companion-image{height:110px;width:100%;object-fit:contain;border-radius:10px;display:block}.pet-option[aria-pressed="true"]{border-color:var(--purple);background:#eee4ff}.pet-locked{background:#eaf6ee;padding:15px;border-radius:12px;color:#256742;font-size:13px;line-height:1.7;margin-bottom:18px}.studio-save{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:20px 0}.save-message{font-size:13px;line-height:1.7;color:#276b52;min-height:25px}.input-label{display:grid;gap:7px;font-weight:800;font-size:13px;margin:15px 0}.input-label input{font:inherit;padding:11px;border:1px solid #d7cae7;border-radius:10px}.confirm-label{display:flex;gap:12px;align-items:start;font-size:14px;line-height:1.6}.reward-preview{background:#f2ecfc;border-radius:14px;padding:20px;margin:15px 0}.reward-preview h3{margin:0 0 10px}.locked-copy{font-size:13px;color:#736780}.studio-warning{font-size:12px;background:#fff1d6;padding:12px 15px;border-radius:12px;line-height:1.7;color:#795618}.pet-confirm-preview{text-align:center}.pet-confirm-preview img{max-width:250px;width:100%;border-radius:14px}.custom-avatar{overflow:visible}.hq-hero-custom{height:265px!important;position:absolute;left:5px;bottom:0;width:195px}.hq-hero-pet{position:absolute;right:-8px;bottom:2px;width:130px}.hq-hero-pet img{width:100%;mix-blend-mode:multiply}.studio-empty{max-width:650px;margin:30px auto}.studio-empty h1{font-size:35px}@media(max-width:850px){.studio-layout{grid-template-columns:270px minmax(0,1fr)}.hero-preview .custom-avatar{height:300px}.hero-preview{padding:13px}.pet-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.studio-main{padding:20px 5%}.studio-top{align-items:start}.studio-top h1{font-size:29px}.studio-layout{grid-template-columns:1fr;gap:18px}.hero-preview{position:static;display:grid;grid-template-columns:1fr 1fr;align-items:center;text-align:left;min-height:230px;padding:16px;overflow:hidden}.hero-preview .custom-avatar{height:230px;grid-column:1;grid-row:1/4;width:100%;}.hero-preview h2,.hero-preview>p{grid-column:2}.duo-pet{grid-column:2;height:85px;margin:0;text-align:center}.duo-pet .companion-image{height:85px;width:120px}.preview-stamp{grid-column:1/-1;text-align:center;margin:4px 0 0}.control-card{padding:19px}.pet-option .companion-image{height:90px}.studio-tabs{margin-top:0}.studio-tabs button{flex:1;padding:10px 7px;font-size:12px}}

.hq-sidebar a.nav-item{text-decoration:none}.hq-hero-custom .custom-avatar{width:100%;height:100%}.pet-option:disabled{cursor:default;opacity:.65}.pet-option:disabled[aria-pressed="true"]{opacity:1}@media(max-width:650px){.hero-preview #avatarPreview{grid-column:1;grid-row:1/4}.hero-preview .custom-avatar{grid-column:auto;grid-row:auto}}
@media(max-width:1050px){.hq .hero-panel{display:flex;min-height:280px}.hq .hero-scene{min-height:210px;width:280px;max-width:100%;align-self:center}.hq .hero-panel>h3,.hq .hero-panel>p{text-align:center}.hq .hero-panel .small-link{align-self:center}}
.outfit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.outfit-option{border:2px solid #dfd3ee;border-radius:15px;background:#faf7ff;padding:10px;color:var(--navy);cursor:pointer}.outfit-option[aria-pressed="true"]{border-color:var(--purple);background:#eae0ff}.outfit-option>div{height:145px}.outfit-option .custom-avatar{height:145px;width:100%}.outfit-option b{display:block;font-size:14px;margin-top:8px}.outfit-option span{display:block;font-size:11px;color:#69468f;margin-top:4px}.companion-image{background:transparent!important;mix-blend-mode:normal!important}.pet-option{background:#f6f0ff}.studio-save{position:sticky;bottom:0;background:#faf8f2ef;padding:12px 0;z-index:2;border-top:1px solid #e4dceb}.hero-preview .custom-avatar{height:380px}.hq .hq-hero-custom{height:285px!important}.hq .hq-hero-pet{width:140px}.hq .hero-scene{min-height:240px}@media(max-width:650px){.hero-preview .custom-avatar{height:240px}.outfit-option>div,.outfit-option .custom-avatar{height:140px}.studio-tabs{position:sticky;top:0;background:#faf8f2;padding:9px 0;z-index:3}}
.illustrated-hero{position:relative;height:100%;width:100%;display:flex;align-items:center;justify-content:center}.illustrated-body{width:100%;height:100%;object-fit:contain;display:block}.hero-preview #avatarPreview{height:380px}.outfit-option .illustrated-hero{height:145px}.hq-hero-custom .illustrated-hero{height:100%;width:100%}.equipped-emblem{position:absolute;top:31%;left:48%;font-size:25px;color:#ffda39;filter:drop-shadow(0 0 4px #fff);line-height:1}.outfit-option .equipped-emblem{display:none}@media(max-width:650px){.hero-preview #avatarPreview{height:240px}.outfit-option .illustrated-hero{height:140px}}
.illustrated-hero{position:relative;height:100%;width:100%;display:flex;align-items:center;justify-content:center}.illustrated-body{width:100%;height:100%;object-fit:contain;display:block}.hero-preview #avatarPreview{height:380px}.outfit-option .illustrated-hero{height:145px}.hq-hero-custom .illustrated-hero{height:100%;width:100%}.equipped-emblem{position:absolute;top:31%;left:48%;font-size:25px;color:#ffda39;filter:drop-shadow(0 0 4px #fff);line-height:1}.outfit-option .equipped-emblem{display:none}@media(max-width:650px){.hero-preview #avatarPreview{height:240px}.outfit-option .illustrated-hero{height:140px}}
.hq .hero-scene{min-height:295px}
.original-color{border:1px solid #d8cbea;border-radius:9px;background:white;color:#60458c;padding:8px 12px;font:inherit;font-size:12px;margin:0 0 12px;cursor:pointer}.original-color[aria-pressed="true"]{border:2px solid var(--purple);background:#eee4ff}.swatches .swatch{cursor:pointer}.swatch[aria-pressed="true"]:after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:white;text-shadow:0 1px 3px #111;font-weight:900}.color-label input{cursor:pointer}.studio-controls .color-label{margin-bottom:20px}
@media(max-width:650px){.hero-preview{position:sticky;top:0;z-index:4;height:210px;min-height:210px;box-sizing:border-box;padding:10px 14px;box-shadow:0 8px 20px #21184714}.hero-preview #avatarPreview{height:185px}.hero-preview .preview-stamp{display:none}.hero-preview h2{font-size:20px}.hero-preview>p{font-size:11px}.studio-tabs{top:210px}.studio-save{z-index:5}}
/* Earned equipment: freely removable, with no loss of ownership. */
.equipped-emblem{top:28%;left:38%;width:19px;height:19px;display:grid;place-items:center;border:2px solid #eab746;border-radius:50%;background:radial-gradient(circle,#9657cf,#392169);font-size:15px;color:#ffe190;box-shadow:0 1px 3px #38285488;filter:none;z-index:3}
.has-aura .illustrated-body{filter:drop-shadow(0 0 3px #51e5ed) drop-shadow(0 0 7px #9c68e4)}
.has-aura:before,.has-legendary:after{content:'';position:absolute;inset:5% 7% 1%;border:2px solid #54dce59c;border-left-color:#b48df0;border-right-color:#b48df0;border-radius:50%;box-shadow:0 0 10px #37d5e655,inset 0 0 10px #a970df44;pointer-events:none;animation:power-breathe 3.6s ease-in-out infinite}
.has-aura:after{content:'✦';position:absolute;left:12%;top:28%;color:#edbf4b;text-shadow:0 0 8px #fff5a7,130px 130px 1px #efca5c;pointer-events:none;animation:power-breathe 3s ease-in-out infinite}
.has-legendary:after{inset:1% 0 -1%;border-width:3px;border-color:#c6a2f0 #4ce0e8;box-shadow:0 0 15px #61d9e988,inset 0 0 13px #b375d466;transform:rotate(-10deg)}
.pet-enchanted{filter:drop-shadow(0 0 4px #32d9d5) drop-shadow(0 0 8px #f0cc65);animation:pet-magic 3s ease-in-out infinite}
.duo-pet,.hq-hero-pet{position:relative}.hq .hq-hero-pet{position:absolute}
.duo-pet:has(.pet-enchanted):after,.hq-hero-pet:has(.pet-enchanted):after{content:'✦ · ✧';position:absolute;inset:0;letter-spacing:14px;color:#d7a72e;text-shadow:0 0 5px white;pointer-events:none}
.duo-legendary:after{content:'';position:absolute;inset:0;border:2px solid #71d7e4;border-radius:50%;box-shadow:0 0 14px #b891e4;pointer-events:none;animation:power-breathe 4s ease-in-out infinite}
.cape-choice{margin-top:15px}.reward-preview .tag{font-size:11px}.reward-preview p{line-height:1.6}.has-aura,.has-legendary{isolation:isolate}.illustrated-body{position:relative;z-index:1}
@keyframes power-breathe{0%,100%{opacity:.65}50%{opacity:1;box-shadow:0 0 18px #54dce577,inset 0 0 12px #c89df077}}
@keyframes pet-magic{0%,100%{filter:drop-shadow(0 0 3px #32d9d5) drop-shadow(0 0 5px #f0cc65)}50%{filter:drop-shadow(0 0 7px #32d9d5) drop-shadow(0 0 10px #f0cc65)}}
@media(prefers-reduced-motion:reduce){.has-aura:before,.has-aura:after,.has-legendary:after,.pet-enchanted,.duo-legendary:after{animation:none}}

.reward-test{border:2px dashed #9972d5;border-radius:14px;background:#faf6ff;padding:18px;margin-bottom:22px}.reward-test p{font-size:13px;line-height:1.6}.reward-test button{white-space:normal;text-align:left}.reward-test [role=status]{color:#6635a2;font-weight:800}

/* Animated powers replace the first outline-only prototype. */
.power-host{position:relative;isolation:isolate}.hero-preview.power-host{position:sticky}.power-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.power-back{z-index:-1}.power-front{z-index:4}.power-deploy{position:relative;z-index:5;border:1px solid #7852bd;background:#793bec;color:white;border-radius:10px;padding:9px 12px;font:inherit;font-size:12px;cursor:pointer;margin-top:8px}.power-deploy[hidden]{display:none}.hero-scene .power-deploy{position:absolute;bottom:-30px;left:50%;transform:translateX(-50%);white-space:nowrap}.hero-scene:has(.power-deploy:not([hidden])){margin-bottom:40px}.power-host .has-aura:before,.power-host .has-aura:after,.power-host .has-legendary:after,.power-host.duo-legendary:after{display:none}.power-host .has-aura .illustrated-body{filter:drop-shadow(0 0 4px #43d6df)}
@media(max-width:650px){.hero-preview .power-deploy{position:absolute;bottom:3px;left:10px;padding:6px 10px;min-height:30px;font-size:11px;margin:0}.hero-preview:has(.power-deploy:not([hidden])) #avatarPreview{height:165px}}

/* Trésors de l'armoire superposés au héros : position calculée sur l'image réellement dessinée. */
.treasure-overlay{position:absolute;visibility:hidden;pointer-events:none;filter:drop-shadow(0 3px 3px #402d4755)}
.treasure-art{display:block;width:100%;height:auto}
.treasure-chain{position:absolute;left:50%;bottom:88%;width:140%;height:75%;transform:translateX(-50%);overflow:visible}
