/* PFP controls follow Fello's original wool, moss, cream and gold palette. */
.topbar__menu .pfp-nav-link { line-height:1; font:400 clamp(1rem,1.3vw,1.25rem)/1 var(--font-display); letter-spacing:.045em; padding:.55rem 1rem; border-radius:.8rem; background:#283e14e8; color:#fff5db; border:1px dashed #dac99a; box-shadow:0 4px 0 #192810,0 8px 18px #1c2a1045; }
.pfp-top-badge { font:400 1.2rem/1 var(--font-display); letter-spacing:.04em; color:#fff5db; text-shadow:0 2px 5px #1c2a10; padding-left:.8rem; }
.pfp-top-badge small { display:block; font:700 .55rem/1.3 var(--font-body); letter-spacing:.13em; color:#eee9ce; margin-top:.2rem; }
.topbar__actions { gap:clamp(.5rem,1.3vw,1.1rem); }
.pfp-top-social { width:clamp(4rem,6vw,5.5rem); }
.hero__cta.pfp-hero-cta { display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-end; gap:clamp(.5rem,1.4vw,1.2rem); }
.pfp-hero-main { width:clamp(11rem,24vw,20rem); }
.pfp-hero-break { flex-basis:100%; }
.pfp-hero-social { width:clamp(5.3rem,11vw,9rem); }
.pfp-lab-heading { gap:1rem; }
.pfp-lab-heading .lede { max-width:38ch; }
#lab { scroll-margin-top:100px; }
.pfp-app { width:100%; display:grid; grid-template-columns:1fr 1.08fr; gap:clamp(1rem,2.5vw,2.2rem); align-items:stretch; margin-top:2rem; color:var(--ink); }
.pfp-preview,.pfp-controls { min-width:0; padding:clamp(1.2rem,2.2vw,2rem); border-radius:1.75rem; background:linear-gradient(135deg,#fff7e9f5,#e6d8bdf5); border:2px solid #76674938; box-shadow:0 .65rem 0 #46391e45,0 1.5rem 3rem #21392733; }
.pfp-preview { display:flex; flex-direction:column; justify-content:space-between; gap:1.2rem; }
.pfp-preview-head,.pfp-preview-foot { display:flex; justify-content:space-between; align-items:center; gap:.5rem; }
.pfp-preview-head { font-size:.65rem; font-weight:800; letter-spacing:.15em; color:#5e6848; }
.pfp-preview-foot strong { font:400 clamp(1.5rem,2.6vw,2.1rem)/1 var(--font-display); }
.pfp-preview-foot span { font-size:.65rem; letter-spacing:.1em; font-weight:800; color:#5e6848; }
.pfp-canvas-wrap { border-radius:1.5rem; overflow:hidden; width:100%; max-width:490px; align-self:center; aspect-ratio:1; background:repeating-conic-gradient(#eadbc6 0% 25%,#f6eddb 0% 50%) 0 0 / 22px 22px; box-shadow:inset 0 0 0 1px #6b593626,0 .8rem 2rem #3b432230; }
#pfp-canvas { display:block; width:100%; height:100%; }
.pfp-controls { display:grid; gap:1.35rem; }
.pfp-controls fieldset { border:0; min-width:0; }
.pfp-controls legend { padding:0; margin-bottom:.8rem; font:400 1.5rem/1 var(--font-display); letter-spacing:.03em; }
.pfp-controls legend b { font:700 .7rem/1 var(--font-body); color:#536641; margin-right:.7rem; }
.pfp-picker { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.6rem; }
.pfp-picker button { display:grid; justify-items:center; gap:.3rem; padding:.45rem .3rem; min-width:0; border-radius:.8rem; border:2px solid #7c775233; color:#394426; background:#fffdf498; cursor:pointer; transition:background .15s,transform .15s; }
.pfp-picker button img { width:100%; height:62px; object-fit:contain; }
.pfp-picker button span { font-size:.6rem; line-height:1.15; font-weight:750; }
.pfp-picker button[aria-pressed=true] { border-color:#567641; background:#cbdab9; box-shadow:0 3px 0 #536641; }
.pfp-options { display:flex; gap:.45rem; flex-wrap:wrap; }
.pfp-options button { display:flex; align-items:center; gap:.4rem; padding:.6rem .75rem; border:1px solid #65704b60; border-radius:999px; color:#394426; background:#fffdf48a; font-size:.75rem; font-weight:750; cursor:pointer; }
.pfp-options button[aria-pressed=true] { color:#fff5db; background:#3f5c1f; box-shadow:0 3px 0 #273c16; }
.pfp-swatch { width:1rem; height:1rem; border-radius:50%; border:1px solid #75664f50; }
.pfp-swatch.cream { background:#f2dfbd; }.pfp-swatch.moss { background:#5e8049; }.pfp-swatch.sky { background:#a7d7ef; }.pfp-swatch.solana { background:linear-gradient(135deg,#9945ff,#14f195); }
.pfp-zoom-row { display:flex; align-items:center; gap:1rem; font-weight:700; font-size:.75rem; }
.pfp-zoom-row input { flex:1; width:100%; min-width:0; accent-color:#4d6b32; }
.pfp-zoom-row output { min-width:3.4rem; text-align:right; color:#536641; }
.pfp-actions { display:flex; flex-wrap:wrap; gap:.65rem; }
.pfp-action { flex:1; padding:.8rem 1.1rem; min-height:48px; font:400 1.4rem/1 var(--font-display); letter-spacing:.04em; border-radius:1rem; border:2px dashed #e3d9b9; background:linear-gradient(135deg,#48703a,#2d4b25); box-shadow:0 5px 0 #1e3517,0 9px 18px #33452733; color:#fff5db; cursor:pointer; }
.pfp-action.secondary { flex:0 0 auto; background:#fff6dd; color:#3c502b; border-color:#6b7957; box-shadow:0 4px 0 #8e9477; }
.pfp-action:disabled { opacity:.65; cursor:wait; }.pfp-action:hover:not(:disabled) { filter:brightness(1.08); }
.pfp-status { font-size:.7rem; min-height:1.15rem; line-height:1.5; color:#4b6340; }
.pfp-steps { margin-top:1rem; }
.pfp-step { background:#fff8eae8; color:#2c431d; border:2px dashed #7a835e; border-radius:1.5rem; box-shadow:0 .45rem 0 #64714780,0 1rem 2rem #1c2a1030; padding:1.7rem; text-align:center; }
.pfp-step img { width:110px; height:110px; object-fit:contain; margin:0 auto 1.3rem; border-radius:0; box-shadow:none; }
.pfp-step h3 { font:400 2.1rem/1 var(--font-display); margin-bottom:.75rem; }
.pfp-step p { font-size:.9rem; line-height:1.6; }
.pfp-wall-card { background:linear-gradient(135deg,#eaf2df,#a8bf83); cursor:pointer; border:2px dashed #d5c895; aspect-ratio:1; text-align:left; }
.pfp-wall-card img { padding:1rem; }
.pfp-wall-caption { position:absolute; inset:auto 0 0; display:grid; gap:.25rem; padding:1.4rem 1rem .9rem; background:linear-gradient(transparent,#1b3117e6 55%); color:#fff5db; }
.pfp-wall-caption strong { font:400 1.55rem/1 var(--font-display); letter-spacing:.04em; }.pfp-wall-caption span { font-size:.55rem; font-weight:800; letter-spacing:.14em; color:#e0cf9a; }
.pfp-wall-card[aria-pressed=true] { border-color:#ffe594; }.foot__info { grid-template-columns:1fr; }.foot__legal { color:#f4f2f0ce; }
.pfp-picker button:focus-visible,.pfp-options button:focus-visible,.pfp-wall-card:focus-visible,.pfp-action:focus-visible { outline:3px solid #be962f; outline-offset:4px; }
@media(max-width:1000px){.pfp-app{grid-template-columns:1fr 1.15fr}.pfp-picker{grid-template-columns:repeat(3,minmax(0,1fr))}.pfp-picker button img{height:58px}}
@media(max-width:760px){.pfp-app{grid-template-columns:1fr;max-width:540px;margin-inline:auto}.pfp-top-badge{font-size:1rem}.pfp-top-badge small{font-size:.47rem}.pfp-preview{gap:1rem}.pfp-picker{grid-template-columns:repeat(4,minmax(0,1fr))}.pfp-picker button img{height:64px}.pfp-controls{gap:1.35rem}.pfp-lab-heading .display{font-size:clamp(4rem,18vw,7rem)}.pfp-step{padding:1.4rem}.pfp-top-social{width:clamp(3.6rem,13vw,5rem)}}
@media(max-width:380px){.pfp-picker{grid-template-columns:repeat(3,minmax(0,1fr))}.pfp-top-badge{font-size:.87rem;padding-left:.55rem}.pfp-top-badge small{font-size:.44rem}.pfp-top-social{width:3.7rem}.pfp-preview,.pfp-controls{padding:1.05rem}}