.skins-shell [hidden]{display:none!important}
.v-stage-center.skin-stage{width:min(42vw,470px);aspect-ratio:auto;pointer-events:auto;display:flex;flex-direction:column;gap:27px;isolation:isolate}
.skin-stage:before{content:'';position:absolute;inset:-90px -35px;z-index:-1;background:radial-gradient(ellipse,#92c5df12,transparent 68%);pointer-events:none}
.skin-stage-kicker,.skin-stage-hint{font-size:9px;letter-spacing:.24em;color:#99adba;text-align:center}.skin-stage-hint{margin:0;color:#c1d2dd;font-size:8px}
.skin-lobby-pair{display:flex;align-items:center;justify-content:center;gap:clamp(24px,3vw,48px)}
.skin-lobby-button{display:flex;flex-direction:column;align-items:center;gap:18px;background:none;border:0;padding:0;color:#dce8ee;font-size:10px;letter-spacing:.15em}
.skin-lobby-button:hover{transform:translateY(-4px)}.skin-lobby-button:focus-visible{outline-offset:9px;border-radius:50%}
.skin-lobby-cell{position:relative;width:clamp(110px,12vw,164px);aspect-ratio:1;border-radius:50%;overflow:hidden;display:block;background:#343b3e;filter:drop-shadow(0 15px 25px #0008)}
.cosmetic-base{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%}
.cosmetic-flag{position:absolute;left:7%;top:42%;width:20%;height:16%;object-fit:contain;z-index:1;pointer-events:none}
.flag-card .cosmetic-card-cell{border-radius:5px;background:transparent;max-width:100px}
.flag-card .cosmetic-base{object-fit:contain;border-radius:0}
.flag-card .cosmetic-pick strong{font-size:12px}
.cosmetic-shield{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;border-radius:50%;animation:vintageShieldSpin 10.4719755s linear infinite,vintageShieldPulse 2.855993s ease-in-out infinite;pointer-events:none;will-change:transform}
@keyframes vintageShieldSpin{to{transform:rotate(360deg)}}
@keyframes vintageShieldPulse{0%,100%{opacity:.76}50%{opacity:1}}
#skins-overlay{z-index:42;backdrop-filter:blur(12px);background:#05080fd9}
.skins-shell{width:min(1120px,96vw);height:min(800px,94vh);display:flex;flex-direction:column;overflow:hidden;background:#171c23;border:1px solid #ffffff26;border-radius:14px;box-shadow:0 28px 100px #000a}
.skins-header{display:flex;justify-content:space-between;align-items:center;padding:22px 26px 17px}.skins-header small{font-size:8px;letter-spacing:.21em;color:#a2b4c2}.skins-header h1{margin:7px 0 0;font-size:24px;font-weight:600;letter-spacing:-.03em}
.skins-tabs{display:flex;gap:10px;padding:10px;background:#343a40;border-radius:10px;margin:0 24px 20px}
.skins-tabs button{flex:1;display:flex;align-items:center;justify-content:center;gap:9px;background:#272d33;border:0;border-radius:8px;padding:12px;color:#f4f6f8;font-size:14px;font-weight:700}
.skins-tabs button.active{background:#fa69be;color:#fff}.skins-tabs button span{font-size:18px;line-height:1}
.skins-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 236px;border-top:1px solid #ffffff0e}
.skins-content{min-width:0;min-height:0;display:flex;flex-direction:column;padding:21px 24px 0}
.skins-content-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.skins-content-heading h2{font-size:17px;font-weight:500;margin:0 0 7px}.skins-content-heading p{font-size:10px;line-height:1.7;color:#99aebb;margin:0}.skins-content-heading>span{font-size:8px;letter-spacing:.1em;color:#92a7b5;white-space:nowrap}
.skins-filters{display:flex;gap:10px;margin:17px 0 14px}
.skins-shell input,.skins-shell select{min-width:0;background:#10161d;border:1px solid #ffffff19;color:#d6e1e9;border-radius:6px;padding:11px 12px;font-size:11px}
#skins-search{flex:1;width:100%}.skins-shell select{max-width:180px}
.skins-scroll{flex:1;min-height:0;overflow:auto;padding:0 0 20px;scrollbar-width:thin;scrollbar-color:#526170 #151b23}
.skins-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:12px;align-content:start}
.cosmetic-card{min-width:0;border:1px solid #ffffff12;border-radius:9px;background:#202831;overflow:hidden}.cosmetic-card.selected{border-color:#fa69be;background:#39283a}.cosmetic-card.unavailable{opacity:.45}
.cosmetic-pick{display:flex;flex-direction:column;align-items:center;gap:8px;border:0;background:none;color:#e3e9ef;padding:14px 9px 13px;width:100%;text-align:center}.cosmetic-pick:hover{background:#ffffff05}
.cosmetic-card-cell{position:relative;width:100%;max-width:132px;aspect-ratio:1;border-radius:50%;background:#0d1b25;overflow:hidden;display:block;margin-bottom:3px}
.cosmetic-pick strong{font-size:10px;font-weight:500;line-height:1.5;overflow-wrap:anywhere}.cosmetic-pick small{font-size:7px;letter-spacing:.08em;color:#91a7b7;line-height:1.5}.selected .cosmetic-pick small{color:#fa99d3}
.cosmetic-forget{display:block;margin:0 auto 11px;border:0;background:transparent;color:#cba1b5;font-size:9px}
.skins-preview-panel{display:flex;flex-direction:column;align-items:center;gap:12px;padding:22px 17px;background:#111820;border-left:1px solid #ffffff0e;overflow:auto}.skins-preview-panel>span:first-child{font-size:8px;letter-spacing:.18em;color:#a2b9c9}
.skin-slot-switch{display:flex;gap:8px;width:100%;margin:2px 0 14px}.skin-slot-switch button{flex:1;padding:10px 8px;display:flex;flex-direction:column;align-items:center;gap:8px;background:#1c2731;border:1px solid #ffffff15;border-radius:7px;color:#b7cad7;font-size:8px;letter-spacing:.08em}.skin-slot-switch button.active{border-color:#fa69be;color:#ffd1ec}
.skin-mini-cell{display:block;position:relative;width:48px;aspect-ratio:1;border-radius:50%;overflow:hidden;background:#343b3e}
.skin-live-preview{position:relative;width:172px;aspect-ratio:1;border-radius:50%;overflow:hidden;flex-shrink:0;background:#09759d;box-shadow:0 14px 28px #0004}
.skin-live-preview:after{content:'Vintage';position:absolute;top:50%;left:0;right:0;text-align:center;color:white;font:700 15px Arial;text-shadow:0 1px 3px #000;pointer-events:none}
.skins-preview-panel>strong{margin-top:10px;font-size:12px;text-align:center;line-height:1.6;font-weight:500;overflow-wrap:anywhere;max-width:100%}.skins-preview-panel>span{font-size:10px;color:#ef94ca}.skins-preview-panel>p{font-size:10px;color:#8fa5b6;text-align:center;line-height:1.8;margin:10px 0}
.skin-remove-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:8px}.skin-remove-actions button{border:1px solid #ffffff20;background:transparent;padding:7px 8px;border-radius:5px;color:#b6c8d6;font-size:9px}
.skins-footer{display:flex;align-items:center;justify-content:space-between;padding:15px 24px;border-top:1px solid #ffffff12;gap:12px;background:#131a22}.skins-footer>span{font-size:8px;letter-spacing:.12em;color:#a1b6c5}.skins-footer i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#fa69be;margin-right:6px}.skins-footer button{border:0;border-radius:6px;background:#fa69be;color:#fff;font-size:10px;font-weight:700;letter-spacing:.1em;padding:12px 28px}
.skins-custom-form{display:flex;gap:8px;margin:0 0 14px;flex-wrap:wrap}.skins-custom-form input{flex:1;width:100px}.skins-custom-form #skins-custom-url{flex:2;min-width:150px}.skins-custom-form button,.skins-load-more{border:1px solid #fa69be6b;background:#392a3c;color:#f4c1df;border-radius:5px;padding:10px 12px;font-size:9px;letter-spacing:.04em}.skins-load-more{display:block;margin:18px auto 2px}.skins-empty{color:#98b1c4;font-size:12px;line-height:1.8;padding:20px 0}
@media(max-width:790px){.v-stage-center.skin-stage{width:min(92vw,420px);margin:32px auto 38px;gap:20px}.skin-lobby-cell{width:128px}.skins-shell{width:100%}.skins-body{grid-template-columns:minmax(0,1fr) 185px}.skins-content{padding:17px 16px 0}.skins-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:9px}.skin-live-preview{width:140px}.skins-preview-panel{padding:18px 12px}.skins-tabs{margin:0 16px 14px}.skins-content-heading{align-items:flex-start}.skins-content-heading>span{display:none}.skins-filters{flex-wrap:wrap}.skins-shell select{max-width:none;width:100%}}
@media(max-width:560px){#skins-overlay{padding:10px}.skins-shell{height:96dvh;max-height:96dvh}.skins-header{padding:16px}.skins-header h1{font-size:21px}.skins-tabs{margin:0 10px 12px;padding:7px;gap:7px}.skins-tabs button{padding:10px 6px;font-size:12px;gap:5px}.skins-body{display:flex;flex-direction:column-reverse;overflow:hidden}.skins-preview-panel{display:grid;grid-template-columns:112px minmax(0,1fr);gap:8px 12px;padding:10px 14px;align-items:center;border-left:0;border-bottom:1px solid #ffffff12;overflow:visible}.skins-preview-panel>span:first-child{grid-column:1;grid-row:1;font-size:7px}.skin-slot-switch{grid-column:1;grid-row:2/5;margin:0;gap:5px}.skin-slot-switch button{padding:7px 4px;font-size:7px;gap:5px}.skin-mini-cell{width:36px}.skin-live-preview{grid-column:2;grid-row:1/4;justify-self:center;width:76px}.skins-preview-panel>strong{grid-column:2;grid-row:4;font-size:9px;margin:0}.skins-preview-panel>span#skin-preview-shield{grid-column:2;grid-row:5;font-size:9px;text-align:center}.skin-remove-actions{grid-column:1;grid-row:5/7;gap:4px;margin:0}.skin-remove-actions button{font-size:7px;padding:5px}.skins-preview-panel>p{display:none}.skin-live-preview:after{font-size:10px}.skins-content{flex:1;min-height:0;padding:13px 12px 0}.skins-content-heading h2{font-size:14px}.skins-content-heading p{font-size:9px}.skins-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.skins-filters{margin:10px 0;gap:7px}.skins-shell input,.skins-shell select{padding:9px;font-size:10px}.cosmetic-card-cell{max-width:120px}.cosmetic-pick{padding:11px 8px}.skins-footer{padding:10px 14px}.skins-footer>span{font-size:6px;letter-spacing:.04em}.skins-footer button{padding:10px 21px}.skin-lobby-cell{width:112px}}
@media(max-width:560px){.skins-tabs{gap:5px}.skins-tabs button{font-size:11px;padding-inline:5px;gap:4px}.skins-tabs button span{font-size:15px}#skin-preview-flag{grid-column:2;grid-row:6;font-size:9px;text-align:center}.skin-remove-actions{grid-row:5/8}}

/* Compact metal insignia with a quieter frame. */
.insignia-card{border-radius:16px;background:linear-gradient(145deg,#1d2630,#0c1118);box-shadow:inset 0 1px #ffffff0a}
.insignia-card.selected{border-color:var(--insignia);box-shadow:0 0 0 1px var(--insignia),0 12px 28px #0004}
.insignia-art{background:radial-gradient(ellipse at center,#ffffff08,transparent 68%);padding:12px 4px}
.insignia-card strong{font-size:12px;letter-spacing:.13em}