.hero-section{padding:8.5rem 1.75rem 4.5rem;max-width:var(--content-max-width);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:3.5rem}.hero-content{flex:1 1 540px;display:flex;flex-direction:column;gap:1.35rem}.hero-badge{align-self:flex-start;display:inline-flex;align-items:center;gap:.45rem;padding:.35rem 1rem .35rem .85rem;background:var(--accent-gold-dim);border:1px solid var(--border-gold);border-radius:var(--radius-full);font-size:.86rem;font-weight:600;color:var(--accent-gold);letter-spacing:.02em}.hero-badge>span:first-child{display:inline-flex;align-items:center;justify-content:center;font-size:.8rem;line-height:1}.hero-title{font-size:clamp(2.6rem,5.4vw,3.8rem);line-height:1.14;font-weight:800;letter-spacing:-.035em;color:#fff;text-wrap:balance}.hero-title-phrase{display:inline-block}.hero-title-highlight{display:inline-block;background:linear-gradient(135deg,var(--accent-gold) 15%,var(--accent-rose) 85%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-desc{font-size:1.15rem;color:var(--text-muted);max-width:520px;line-height:1.68}.hero-ctas{display:flex;align-items:center;gap:1rem;margin-top:.75rem;flex-wrap:wrap}.hero-visual{flex:0 0 380px;display:flex;justify-content:center;align-items:center;position:relative;max-width:100%}.avatar-halo{position:relative;width:320px;height:320px;display:flex;align-items:center;justify-content:center}.avatar-img-container{position:relative;width:300px;height:300px;border-radius:var(--radius-full);overflow:hidden;border:2px solid var(--border-gold);box-shadow:0 0 0 4px rgba(246,193,119,.15),0 16px 36px rgba(0,0,0,.6);background:var(--bg-surface)}.avatar-img{width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-select:none;-webkit-user-drag:none;pointer-events:none}.floating-badge{position:absolute;width:44px;height:44px;border-radius:var(--radius-full);background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:center;color:var(--accent-gold);box-shadow:0 4px 14px rgba(0,0,0,.4);user-select:none;-webkit-user-select:none;-webkit-user-drag:none;pointer-events:none;transform:translateY(0)rotate(0)scale(1);animation-fill-mode:both;will-change:transform;z-index:5;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.floating-badge:hover{border-color:var(--accent-gold);box-shadow:0 6px 18px rgba(246,193,119,.25)}.floating-badge img,.floating-badge svg{width:20px;height:20px;user-select:none;-webkit-user-select:none;-webkit-user-drag:none;pointer-events:none}.badge-star{top:6px;left:16px;color:var(--accent-gold);animation:float-star 5.3s cubic-bezier(.42,0,.58,1)infinite alternate;animation-delay:0s}.badge-award{top:22px;right:10px;color:var(--accent-gold);animation:float-award 4.7s cubic-bezier(.37,0,.63,1)infinite alternate;animation-delay:-1.8s}.badge-palette{bottom:65px;left:8px;color:var(--accent-rose);animation:float-palette 6.1s cubic-bezier(.45,.05,.55,.95)infinite alternate;animation-delay:-3.4s}.badge-sparkle{bottom:50px;right:10px;color:var(--accent-gold);animation:float-sparkle 4.3s cubic-bezier(.4,0,.6,1)infinite alternate;animation-delay:-.9s}.badge-trophy{bottom:0;left:calc(50% - 22px);color:var(--accent-gold);animation:float-trophy 5.7s cubic-bezier(.35,.1,.65,.9)infinite alternate;animation-delay:-2.5s}@keyframes float-star{0%{transform:translateY(0)rotate(0)scale(1)}50%{transform:translateY(-5px)rotate(1.5deg)scale(1.02)}100%{transform:translateY(-10px)rotate(-1.5deg)scale(1.045)}}@keyframes float-award{0%{transform:translateY(0)rotate(0)scale(1)}50%{transform:translateY(-4px)rotate(-2deg)scale(1.025)}100%{transform:translateY(-8.5px)rotate(1.8deg)scale(1.04)}}@keyframes float-palette{0%{transform:translateY(0)rotate(0)scale(1)}50%{transform:translateY(-6px)rotate(1.2deg)scale(1.03)}100%{transform:translateY(-11px)rotate(-2deg)scale(1.05)}}@keyframes float-sparkle{0%{transform:translateY(0)rotate(0)scale(1)}50%{transform:translateY(-4.5px)rotate(-1.5deg)scale(1.02)}100%{transform:translateY(-9px)rotate(1.4deg)scale(1.04)}}@keyframes float-trophy{0%{transform:translateY(0)rotate(0)scale(1)}50%{transform:translateY(-5.5px)rotate(1.8deg)scale(1.025)}100%{transform:translateY(-9.5px)rotate(-1.2deg)scale(1.045)}}.trust-section{padding:3rem 1.75rem 3.5rem;text-align:center;max-width:var(--content-max-width);margin:0 auto}.trust-label{font-size:1.05rem;font-weight:700;color:var(--accent-gold);margin-bottom:.5rem}.trust-title{font-size:clamp(1.85rem,3.6vw,2.5rem);font-weight:800;color:#fff;letter-spacing:-.03em;position:relative;display:inline-block;text-wrap:balance}.trust-title-phrase{display:inline-block}.trust-title-underline,.section-title-underline{display:inline-block;font-style:italic;text-decoration:underline wavy var(--accent-gold);text-decoration-skip-ink:none;text-underline-offset:8px}.trust-sub{font-size:1.05rem;color:var(--text-muted);margin-top:1rem}.demo-section{padding:3rem 1.75rem 5rem;max-width:var(--content-max-width);margin:0 auto}.section-header{text-align:center;margin-bottom:2.5rem}.section-subtitle{font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--accent-gold);margin-bottom:.5rem}.section-title{font-size:clamp(1.85rem,3.6vw,2.5rem);font-weight:800;letter-spacing:-.03em;color:#fff}.demo-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:2.25rem;display:flex;flex-direction:column;gap:2rem;box-shadow:0 10px 30px rgba(0,0,0,.4);position:relative;overflow:hidden}.demo-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--accent-gold),var(--accent-rose),var(--accent-purple))}.demo-preview-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center}.discord-mockup{background:#171822;border-radius:var(--radius-md);padding:1.75rem;border:1px solid rgba(255,255,255,6%)}.discord-user-row{display:flex;align-items:center;gap:1.1rem}.discord-mock-avatar{width:52px;height:52px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}.discord-mock-avatar img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-full);display:block;transform:scale(1.1);transform-origin:center;user-select:none;-webkit-user-select:none;-webkit-user-drag:none;pointer-events:none}.discord-user-info{display:flex;flex-direction:column;gap:.55rem}.discord-username{font-weight:600;font-size:1.12rem;transition:color var(--transition-fast)}.discord-roles-list{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .45rem}.discord-role-pill{display:inline-flex;align-items:center;gap:.45rem;padding:.25rem .65rem;background:#232431;border-radius:var(--radius-sm);font-size:.82rem;font-weight:500;color:var(--text-main);width:fit-content}.role-color-dot{width:10px;height:10px;border-radius:var(--radius-full);transition:background-color var(--transition-fast);flex-shrink:0}.role-color-dot-empty{border:1.5px solid rgba(255,255,255,.32);background:0 0!important}.color-controls{display:flex;flex-direction:column;gap:1.25rem}.swatch-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;width:100%}.color-swatch-btn{display:flex;align-items:center;gap:.55rem;padding:.6rem .85rem;background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:var(--text-main);font-size:.88rem;font-weight:500;width:100%;min-width:0;box-sizing:border-box;white-space:nowrap;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.color-swatch-btn span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis}.color-swatch-btn:hover{background:var(--bg-surface-hover);border-color:var(--border-hover)}.color-swatch-btn.active{border-color:var(--accent-gold);background:var(--accent-gold-dim);color:#fff}.swatch-circle{width:14px;height:14px;border-radius:var(--radius-full)}.badge-section{padding:3.5rem 1.75rem 6rem;max-width:var(--content-max-width);margin:0 auto}.badge-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,3.5vw,3.5rem);align-items:start}.badge-copy-side,.badge-interactive-side{display:flex;flex-direction:column;min-width:0}.badge-copy-side{gap:1.5rem}.badge-body-copy{font-size:1.05rem;color:var(--text-muted);line-height:1.68;margin:0}.badge-highlights-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:1.15rem}.badge-highlight-item{display:flex;align-items:flex-start;gap:.75rem;padding:0;margin:0}.highlight-sparkle{color:var(--accent-gold);font-size:.95rem;line-height:1.55;flex-shrink:0}.highlight-text{font-size:.95rem;color:var(--text-muted);line-height:1.55}.highlight-text strong{color:var(--text-main);font-weight:700}.highlight-text code{font-family:var(--font-mono);font-size:.88em;background:var(--bg-surface-elevated);padding:.15rem .35rem;border-radius:var(--radius-sm);color:var(--accent-gold);border:1px solid var(--border-subtle)}.badge-profile-card{display:flex;flex-direction:column;gap:1rem;padding:1.5rem;position:relative;overflow:visible;container-type:inline-size}.badge-profile-top{display:flex;align-items:center;justify-content:space-between;gap:.75rem 1rem;flex-wrap:wrap}.badge-profile-user{display:flex;align-items:center;gap:.85rem}.badge-profile-user .discord-user-info{gap:.15rem}.badge-profile-user .discord-username{line-height:1.25}.badge-join-date{font-size:.78rem;color:var(--text-faint);line-height:1.3}.badge-slots-cluster{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem}.badge-slots-tag{font-size:.72rem;font-weight:700;letter-spacing:.08em;color:var(--accent-gold);text-transform:uppercase}@container(max-width:430px){.badge-slots-cluster {
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding-top: 0.25rem;
  }
}@media(min-width:841px) and (max-width:980px),(max-width:460px){.badge-slots-cluster{width:100%;flex-direction:row;align-items:center;justify-content:space-between;padding-top:.25rem}}.badge-slots-row{display:flex;align-items:center;gap:.5rem}.badge-slot{width:46px;height:46px;border-radius:var(--radius-md);background:var(--bg-surface-elevated);border:1.5px dashed rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;transition:border-color var(--transition-fast),background-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast);padding:2px;user-select:none;overflow:visible}.badge-slot.empty:hover{border-color:var(--border-gold);background:var(--accent-gold-dim)}.badge-slot.slot-dragover{border-color:var(--accent-gold);border-style:solid;background:var(--accent-gold-dim);transform:scale(1.08);box-shadow:0 0 12px var(--accent-gold-glow)}.badge-slot .slot-symbol{font-size:1.15rem;font-weight:600;color:var(--text-faint);transition:color var(--transition-fast)}.badge-slot:hover .slot-symbol{color:var(--accent-gold)}.badge-slot.equipped{border-style:solid;border-color:var(--badge-border-color,var(--border-gold));box-shadow:0 2px 10px var(--badge-glow-color,var(--accent-gold-glow));animation:badgeEquipBounce 300ms cubic-bezier(.175,.885,.32,1.275)}@keyframes badgeEquipBounce{0%{transform:scale(.8);opacity:.5}50%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}.badge-slot.equipped .slot-emoji{font-size:1.45rem;line-height:1;display:block}.badge-emblem-img,.slot-badge-img{width:100%;height:100%;object-fit:contain;object-position:center;display:block;pointer-events:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 2px 5px rgba(0,0,0,.35))}.badge-emblem-img[src*=pixel-parfait],.slot-badge-img[src*=pixel-parfait],.badge-img-parfait{transform:scale(1.18)}.badge-slot.equipped:hover{border-color:#ff6b6b;box-shadow:0 0 10px rgba(255,107,107,.3)}.badge-slot.equipped::after{content:"✕";position:absolute;top:-6px;right:-6px;width:17px;height:17px;border-radius:var(--radius-full);background:#ff5252;box-shadow:0 2px 6px rgba(0,0,0,.45);color:#fff;font-size:.62rem;font-weight:800;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.6);transition:opacity var(--transition-fast),transform var(--transition-fast);pointer-events:none;z-index:10}.badge-slot.equipped:hover::after{opacity:1;transform:scale(1)}.badge-about-section{background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,4%);border-radius:var(--radius-sm);padding:.65rem .85rem;display:flex;flex-direction:column;gap:.25rem}.badge-about-label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint)}.badge-about-text{font-size:.86rem;color:var(--text-muted);line-height:1.45;margin:0}.badge-card-divider{height:1px;background:rgba(255,255,255,6%);margin:.25rem 0}.badge-vault-area{display:flex;flex-direction:column;gap:.75rem}.badge-vault-meta{display:flex;align-items:center;justify-content:space-between}.badge-vault-label{font-size:.72rem;font-weight:700;letter-spacing:.08em;color:var(--accent-gold);text-transform:uppercase}.badge-vault-counter{font-size:.74rem;color:var(--text-muted)}.badge-vault-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;position:relative}.vault-badge-item{background:var(--bg-surface-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:.65rem .45rem;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.35rem;cursor:pointer;position:relative;transition:background-color var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast);user-select:none}.vault-badge-item:hover,.vault-badge-item:focus-visible{background:var(--bg-surface-hover);border-color:var(--border-gold);transform:translateY(-2px);box-shadow:0 4px 14px rgba(0,0,0,.3);outline:none}.vault-badge-item.drag-active{opacity:.4;transform:scale(.95)}.badge-emblem{width:42px;height:42px;display:flex;align-items:center;justify-content:center;transition:transform var(--transition-fast);position:relative}.vault-badge-item:hover .badge-emblem{transform:scale(1.15)}.badge-title{font-size:.76rem;font-weight:600;color:var(--text-main);line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.badge-tooltip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%)translateY(4px);background:#252736;border:1px solid var(--border-gold);border-radius:var(--radius-sm);padding:.45rem .65rem;width:175px;text-align:center;box-shadow:0 8px 20px rgba(0,0,0,.6);opacity:0;pointer-events:none;transition:opacity 160ms ease,transform 160ms ease;z-index:50}.badge-tooltip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border-width:5px;border-style:solid;border-color:#252736 transparent transparent transparent}@media(hover:hover){.vault-badge-item:hover .badge-tooltip,.vault-badge-item:focus-visible .badge-tooltip{opacity:1;transform:translateX(-50%)translateY(0);pointer-events:auto}}.vault-badge-item.show-tooltip .badge-tooltip{opacity:1;transform:translateX(-50%)translateY(0);pointer-events:auto}.tooltip-badge-name{font-size:.8rem;font-weight:700;color:var(--accent-gold);margin-bottom:.15rem}.tooltip-badge-lore{font-size:.72rem;color:var(--text-muted);line-height:1.35}@media(max-width:840px){.hero-section{flex-direction:column-reverse;text-align:center;padding:3.5rem 1.25rem;gap:2.5rem;overflow:hidden}.hero-badge{align-self:center}.hero-desc{margin:0 auto}.hero-ctas{justify-content:center}.hero-visual{flex:none}.avatar-halo{width:250px;height:250px}.avatar-img-container{width:230px;height:230px}.badge-star{top:0;left:10px}.badge-award{top:12px;right:10px}.badge-palette{bottom:45px;left:8px}.badge-sparkle{bottom:40px;right:8px}.badge-trophy{bottom:-4px;left:calc(50% - 22px)}.demo-preview-grid{grid-template-columns:1fr;gap:1.75rem}.swatch-group{grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.trust-section{padding:2.75rem 1.25rem 3rem}.badge-grid{grid-template-columns:1fr;gap:2.5rem}.badge-body-copy{text-align:center;max-width:560px;margin:0 auto}.badge-highlights-list{max-width:480px;margin:0 auto;width:100%}.badge-interactive-side{max-width:480px;margin:0 auto;width:100%}}@media(max-width:610px){.demo-section,.badge-section{padding:2.25rem 1rem 3.75rem}.badge-grid{gap:2rem}.demo-card{padding:1.4rem 1.1rem;gap:1.35rem}.discord-mockup{padding:1.15rem .95rem}.discord-user-row{gap:.85rem}.discord-mock-avatar{width:44px;height:44px}.discord-username{font-size:1.02rem;white-space:nowrap}.discord-role-pill{padding:.2rem .55rem;font-size:.78rem}.swatch-group{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.color-swatch-btn{padding:.55rem;font-size:.8rem;gap:.45rem}.swatch-circle{width:12px;height:12px;flex-shrink:0}.trust-section{padding:2.25rem 1rem 2.75rem}.badge-vault-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.badge-slot{width:40px;height:40px}.badge-slot.equipped .slot-emoji{font-size:1.3rem}.badge-tooltip{width:155px}}@media(max-width:360px){.demo-section,.badge-section{padding:2rem .75rem 3.5rem}.demo-card{padding:1.25rem .85rem;gap:1.25rem}.discord-mockup{padding:1rem .75rem}.discord-user-row{gap:.75rem}.discord-mock-avatar{width:40px;height:40px}.discord-username{font-size:.96rem}.swatch-group{grid-template-columns:1fr;gap:.45rem}.color-swatch-btn{padding:.55rem .75rem;font-size:.84rem}.trust-section{padding:2rem .75rem 2.5rem}.badge-slots-row{gap:.35rem}.badge-slot{width:36px;height:36px}.badge-vault-grid{grid-template-columns:1fr;gap:.45rem}.vault-badge-item{flex-direction:row;padding:.5rem .65rem;gap:.65rem;text-align:left}}