/* All artwork is cosmetic. Trade/safety colors and content stay unchanged. */
.skin-art{position:absolute;inset:0;overflow:hidden;background:#111216;pointer-events:none;isolation:isolate}
.skin-art img{width:100%;height:100%;object-fit:cover;object-position:center;filter:blur(var(--skin-blur,0px));transform:scale(1.08)}
.skin-original{background:#111216}
.skin-orb{position:absolute;border-radius:50%;filter:blur(calc(46px + var(--skin-blur,0px)));opacity:.4}
.skin-orb.one{width:340px;height:340px;left:-120px;top:-60px;background:#5B8CFF}
.skin-orb.two{width:300px;height:300px;right:-130px;top:200px;background:#5B8CFF}
.skin-orb.three{width:260px;height:260px;left:40px;bottom:60px;background:#34E0A1;opacity:.22}
.skin-orb.four{width:180px;height:180px;right:20px;bottom:-40px;background:#FFD84D;opacity:.24}
#wallet-sky.custom-skin>.orb2,#wallet-sky.custom-skin>.grain2{display:none}
#wallet-sky>.orb2{filter:blur(calc(46px + var(--original-extra-blur,0px)))}
.prof-cover{height:clamp(160px,42vw,220px);overflow:hidden;isolation:isolate}
.prof-cover .skin-art{z-index:-1}
.skin-banner-art img{object-position:calc(var(--banner-x,50)*1%) calc(var(--banner-y,68)*1%);transform-origin:calc(var(--banner-x,50)*1%) 50%}
.skin-banner-art::after{content:'';position:absolute;inset:65% 0 0;background:linear-gradient(transparent,rgba(17,18,22,.28))}
#skin-picker{position:fixed;inset:0;z-index:100;background:#101114;color:var(--text);overflow-y:auto;overscroll-behavior:contain;padding:calc(env(safe-area-inset-top) + 12px) 0 calc(env(safe-area-inset-bottom) + 18px);animation:skin-enter .22s ease-out}
.skin-picker-head{max-width:480px;margin:auto;padding:0 18px;display:flex;align-items:center;justify-content:space-between}
.skin-picker-head h2{font-size:19px;font-weight:600;margin:0}.skin-picker-head>span{width:50px}
.skin-text-button{background:none;border:0;color:var(--blueb);font:inherit;font-size:13px;padding:10px 0;cursor:pointer}
.skin-help{text-align:center;color:var(--text-low);font-size:12px;margin:8px 16px 16px}
.skin-carousel{position:relative;display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 max(20px,calc((100vw - 240px)/2));scrollbar-width:none;touch-action:pan-x}
.skin-carousel::-webkit-scrollbar{display:none}.skin-slide{flex:0 0 240px;scroll-snap-align:center;text-align:center}
.skin-phone{position:relative;height:min(48vh,450px);min-height:245px;border:1px solid #414653;border-radius:28px;overflow:hidden;background:#111216}
.skin-slide.selected .skin-phone{border-color:var(--blueb);box-shadow:0 0 0 1px var(--blueb)}
.skin-art-slot{position:absolute;inset:0}.skin-preview-wallet{position:absolute;inset:0;width:390px;transform:scale(.615);transform-origin:top left;pointer-events:none;padding:22px 14px;box-sizing:border-box}
.skin-preview-wallet .w-card{background:rgba(17,18,22,.85)}
.skin-name{background:none;border:0;color:var(--text);font:inherit;font-size:15px;font-weight:600;padding:12px 0 4px;cursor:pointer}
.skin-availability{font-size:11px;color:var(--text-low);margin:0 0 12px}.skin-controls{max-width:380px;padding:0 20px;margin:auto}
#skin-deadline,#skin-replace-note{font-size:12px;line-height:1.5;color:var(--text-low);text-align:center;min-height:18px;margin:8px 0}
.skin-controls label{display:flex;justify-content:space-between;font-size:14px}.skin-controls input[type=range]{width:100%;height:36px;accent-color:var(--blueb)}
.skin-range-labels{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--text-low)}
.skin-picker-open #pages{transform:scale(.96);transform-origin:center;transition:transform .2s}
@keyframes skin-enter{from{opacity:0;transform:scale(1.03)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#skin-picker{animation:none}.skin-picker-open #pages{transition:none;transform:none}}

#skin-picker button:focus-visible,#skin-picker input:focus-visible,#skin-picker [role=button]:focus-visible{outline:2px solid var(--blueb);outline-offset:3px}

.skin-text-button,.skin-name{min-height:44px}

/* skin3: shared wallet glass, faithful scaled previews, and accessible blur control. */
#page-wallet .whero,#page-wallet .w-act,#page-wallet .w-tok,#page-wallet .wname,
.skin-preview-wallet .whero,.skin-preview-wallet .w-act,.skin-preview-wallet .w-tok,.skin-preview-wallet .wname{
 background:rgba(17,18,22,.58)!important;backdrop-filter:blur(6px) saturate(1.04);-webkit-backdrop-filter:blur(6px) saturate(1.04);
 border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 5px 16px rgba(0,0,0,.12);
}
#page-wallet .whero,.skin-preview-wallet .whero{background:rgba(17,18,22,.66)!important}
.skin-original-scene.sky2{position:absolute;inset:0;width:var(--skin-source-width,390px);height:var(--skin-source-height,844px);max-width:none;transform:scale(var(--skin-scale,1));transform-origin:top left;opacity:1;visibility:visible}
.skin-original-scene.sky2 .orb2{filter:blur(calc(46px + var(--skin-blur,0px)))}
.skin-banner-art .skin-original-scene{--skin-scale:1;--skin-blur:0px}
.skin-preview-wallet{width:var(--skin-source-width,390px);transform:scale(var(--skin-scale,.615));padding:22px var(--skin-root-pad,14px);text-align:left}
.skin-preview-wallet [data-wallet-id=wchartwrap]{margin-top:-4px;min-height:74px}
.skin-preview-wallet [data-wallet-id=wchart]{width:100%;height:74px}
.skin-mode{display:flex;gap:3px;width:max-content;margin:0 auto 16px;padding:4px;background:rgba(255,255,255,.05);border-radius:99px}
.skin-mode button{font:inherit;font-size:12px;min-height:36px;padding:0 16px;border:0;border-radius:99px;background:transparent;color:var(--text-low)}
.skin-mode button[aria-pressed=true]{background:rgba(91,140,255,.16);color:var(--text)}
.skin-current{color:var(--blueb);font-weight:600}
.skin-profile-preview{display:none;position:absolute;inset:65px 10px auto;background:#111216;border:1px solid var(--border);border-radius:18px;overflow:hidden;text-align:left}
.skin-profile-cover{position:relative;height:135px;overflow:hidden}
.skin-profile-identity{font-size:17px;font-weight:600;padding:18px 12px}
.preview-banner .skin-profile-preview{display:block}.preview-banner .skin-art-slot,.preview-banner .skin-preview-wallet{display:none}
.preview-banner .skin-phone{background:#101114}
.skin-blur-heading{display:flex;gap:10px;align-items:center}.skin-blur-heading label{flex:1}.skin-blur-heading output{font-size:12px;color:var(--text-low);font-variant-numeric:tabular-nums}.skin-blur-heading .skin-text-button{min-height:36px}
.skin-controls input[type=range]{appearance:none;-webkit-appearance:none;background:transparent;margin:0;height:44px;cursor:pointer}
.skin-controls input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:99px;background:linear-gradient(to right,var(--blueb) var(--blur-fill,0%),#343842 var(--blur-fill,0%))}
.skin-controls input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:24px;height:24px;margin-top:-9px;border:2px solid rgba(255,255,255,.65);border-radius:50%;background:var(--blueb);box-shadow:0 2px 6px #0005}
.skin-controls input[type=range]::-moz-range-track{height:6px;border-radius:99px;background:#343842}.skin-controls input[type=range]::-moz-range-progress{height:6px;border-radius:99px;background:var(--blueb)}
.skin-controls input[type=range]::-moz-range-thumb{width:21px;height:21px;border:2px solid rgba(255,255,255,.65);border-radius:50%;background:var(--blueb)}
.skin-controls input[type=range]:focus-visible{outline:none}.skin-controls input[type=range]:focus-visible::-webkit-slider-thumb{outline:2px solid white;outline-offset:3px}.skin-controls input[type=range]:focus-visible::-moz-range-thumb{outline:2px solid white;outline-offset:3px}
#skin-apply:disabled{opacity:.55;box-shadow:none;cursor:default}.skin-range-labels{margin-bottom:12px}
.prof-value{margin-left:auto;text-align:right;min-width:0}#prof-bal{display:block;font-size:28px;font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.prof-change{font-size:12px;margin-top:5px;color:var(--text-low);font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){.skin-original-scene .orb2{animation:none!important}}
.skin-phone{height:min(42vh,420px)}
.skin-controls input[type=range]{border:0;border-radius:0;padding:0;box-shadow:none}
.skin-banner-note{display:none;font-size:12px;line-height:1.5;text-align:center;color:var(--text-low);margin:18px 0}
.preview-banner .skin-banner-note{display:block}
.preview-banner .skin-blur-heading,.preview-banner #skin-blur,.preview-banner .skin-range-labels{display:none}
/* Scale artwork and foreground from the same wallet-sized coordinate space. */
.skin-art-slot>.skin-art{width:var(--skin-source-width,390px);height:var(--skin-source-height,844px);transform:scale(var(--skin-scale,.615));transform-origin:top left}
.skin-art-slot .skin-original-scene.sky2{transform:none}
.skin-preview-wallet{padding-top:var(--skin-root-top,22px)}
.prof-flow-note{font-size:10px;color:var(--text-low);margin-top:3px;line-height:1.4}

/* Account-saved focal point; percentages adapt to each profile viewport. */
.skin-banner-art .skin-original-scene{transform:translate(calc((50 - var(--banner-x,50))*.2%),calc((68 - var(--banner-y,68))*.2%))}
#banner-adjust-preview{height:190px;border:1px solid var(--glass-border);border-radius:18px;margin:14px 0}
.banner-position-controls label{display:block;font-size:13px;margin-top:14px}
.banner-position-controls input[type=range]{width:100%;height:44px;accent-color:var(--blueb);padding:0;border:0;box-shadow:none}
#banner-save-error{font-size:12px;color:var(--text-low);line-height:1.5}
