.cn-card{display:flex;flex-direction:column;gap:.75rem;padding:1rem;border:1px solid hsl(var(--border));border-radius:var(--radius);background:rgba(15,15,20,.94);cursor:pointer;transition:.2s}.cn-card:hover{border-color:hsl(var(--primary));transform:translateY(-2px)}
.cn-card-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.6rem}.cn-card-head strong{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cn-card-head b{font-size:1.2rem;color:#4ade80}.cn-game-icon{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:.55rem;background:linear-gradient(135deg,#f4f4f5,#71717a);font-weight:800;color:#fff}.cn-card-badges,.cn-card-tags{display:flex;flex-wrap:wrap;gap:.35rem}.cn-badge,.cn-tag{display:inline-flex;align-items:center;gap:.3rem;border:1px solid hsl(var(--border));border-radius:999px;padding:.27rem .5rem;font-size:.68rem}.cn-badge svg{width:.75rem;height:.75rem}.cn-badge-warn{color:#f87171;background:#ef44441a}.cn-card-skins{position:relative;display:flex;min-height:3.7rem;overflow:hidden;border:1px solid hsl(var(--border));border-radius:.55rem;background:#08080b}.cn-card-skins img{width:3.7rem;height:3.7rem;object-fit:cover;border-right:1px solid #a1a1aa}.cn-card-skins span{position:absolute;left:.4rem;bottom:.25rem;padding:.1rem .35rem;border-radius:.25rem;background:#000b;font-size:.65rem}.cn-card-foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.cn-card-foot small{color:hsl(var(--muted-foreground));font-size:.68rem}
.cn-cosmetic-search{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.45rem;height:2.65rem;padding:0 .55rem;border:1px solid hsl(var(--border));border-radius:.65rem;background:hsl(var(--background))}.cn-cosmetic-search:focus-within{border-color:hsl(var(--primary));box-shadow:0 0 0 2px hsl(var(--primary)/.18)}.cn-cosmetic-search.selected{border-color:#22c55e}.cn-cosmetic-search>svg{width:1rem;height:1rem;color:hsl(var(--muted-foreground))}.cn-cosmetic-search>input{height:auto!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;min-width:0}.cn-cosmetic-search>[data-cosmetic-clear]{font-size:1.2rem;color:hsl(var(--muted-foreground));padding:.1rem}.cn-suggestions{position:absolute;z-index:80;top:calc(100% + .35rem);left:0;right:0;max-height:19rem;overflow-y:auto;border:1px solid #fff;border-radius:.65rem;background:#15151b;box-shadow:0 15px 35px #000c}.cn-suggestion{display:flex;align-items:center;gap:.65rem;width:100%;padding:.45rem .55rem;text-align:left;border-bottom:1px solid #fff}.cn-suggestion:hover{background:hsl(var(--primary)/.16)}.cn-suggestion img{width:2.4rem;height:2.4rem;border-radius:.4rem;object-fit:cover;background:#27272a}.cn-suggestion span{display:flex;flex-direction:column;min-width:0}.cn-suggestion b{font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cn-suggestion small,.cn-suggestion-status{font-size:.65rem;color:hsl(var(--muted-foreground))}.cn-suggestion-status{padding:.85rem;text-align:center}
.cn-filters{max-height:calc(100vh - 6rem);overflow-y:auto;scrollbar-width:thin}.cn-filter-actions{position:sticky;z-index:10;bottom:-1rem;margin:0 -1rem -1rem;padding:.75rem 1rem;background:linear-gradient(180deg,transparent,#15151b 25%);display:grid;gap:.25rem}.cn-filter-actions .btn-primary{display:flex;align-items:center;justify-content:center;gap:.45rem}.cn-filter-actions svg{width:1rem;height:1rem}
.cn-modal-open{overflow:hidden}.cn-checker{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;padding:1rem}.cn-checker.hidden{display:none}.cn-checker-backdrop{position:absolute;inset:0;background:#000c;backdrop-filter:blur(5px)}.cn-checker-panel{position:relative;width:min(1100px,100%);height:min(92vh,850px);overflow:hidden;border:1px solid #71717a;border-radius:1rem;background:#15151a;box-shadow:0 25px 80px #000}.cn-checker-panel>#cn-checker-content{display:flex;flex-direction:column;height:100%;min-height:0}.cn-checker-head{flex:none;display:grid;grid-template-columns:1fr auto auto;gap:1rem;align-items:center;padding:1rem 1.2rem;border-top:2px solid #f4f4f5;border-bottom:1px solid #ffffff2e;background:linear-gradient(180deg,#18181b,#09090b)}.cn-checker-head>div{display:flex;align-items:center;gap:.7rem;min-width:0}.cn-checker-head h2{font-size:1rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cn-checker-head>strong{font-size:1.55rem;color:#4ade80}.cn-checker-head button{display:grid;place-items:center;width:2rem;height:2rem;border-radius:.45rem;background:#ffffff0d}.cn-checker-tabs{flex:none;display:flex;gap:.4rem;padding:.65rem 1rem;overflow-x:auto;border-bottom:1px solid #fff}.cn-checker-tabs button{white-space:nowrap;border:1px solid hsl(var(--border));border-radius:999px;padding:.35rem .75rem;font-size:.72rem;background:#ffffff08}.cn-checker-tabs button.active{border-color:#f4f4f5;background:linear-gradient(135deg,#f4f4f5,#3b82f6);color:#fff}.cn-checker-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:1rem 1.2rem}.cn-summary-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border:1px solid #ffffff2e;border-radius:.65rem;overflow:hidden;margin-bottom:1.2rem}.cn-stat{display:flex;flex-direction:column;min-height:4.5rem;padding:.75rem;border-right:1px solid hsl(var(--border));border-bottom:1px solid hsl(var(--border))}.cn-stat strong{font-size:.9rem}.cn-stat span{color:hsl(var(--muted-foreground));font-size:.68rem;margin-top:.2rem}.cn-checker-body h3{margin:.5rem 0 .75rem;font-weight:700}.cn-cosmetic-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:.5rem}.cn-cosmetic{position:relative;overflow:hidden;border:1px solid #a1a1aa;border-radius:.55rem;background:linear-gradient(145deg,#3b155f,#111);min-width:0;text-align:left;cursor:copy;transition:transform .15s,border-color .15s,box-shadow .15s}.cn-cosmetic:hover,.cn-cosmetic:focus-visible{z-index:1;transform:translateY(-3px);border-color:#ffffff;box-shadow:0 8px 22px #0009,0 0 0 2px #a1a1aa44}.cn-cosmetic img,.cn-cosmetic-empty{width:100%;aspect-ratio:1/1.15;object-fit:cover}.cn-cosmetic-empty{display:grid;place-items:center;color:#ffffff44}.cn-cosmetic span{display:block;padding:.3rem .35rem;background:#070709;font-size:.62rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cn-cosmetic em{position:absolute;left:50%;top:50%;padding:.3rem .45rem;border-radius:.35rem;background:#09090bea;color:#fff;font-size:.62rem;font-style:normal;white-space:nowrap;opacity:0;transform:translate(-50%,-35%);transition:.15s;pointer-events:none}.cn-cosmetic:hover em,.cn-cosmetic:focus-visible em{opacity:1;transform:translate(-50%,-50%)}#cn-copy-toast{position:fixed;z-index:1200;left:50%;bottom:1.5rem;max-width:calc(100vw - 2rem);padding:.65rem 1rem;border:1px solid #a1a1aa;border-radius:999px;background:#09090b;color:#fff;box-shadow:0 10px 35px #000b;opacity:0;transform:translate(-50%,1rem);transition:.2s;pointer-events:none;font-size:.78rem}#cn-copy-toast.show{opacity:1;transform:translate(-50%,0)}.cn-no-items,.cn-checker-loading,.cn-checker-error{padding:4rem 1rem;text-align:center;color:hsl(var(--muted-foreground))}.cn-checker-loading span{display:block;width:2rem;height:2rem;margin:0 auto 1rem;border:3px solid #ffffff22;border-top-color:#f4f4f5;border-radius:50%;animation:cn-spin .8s linear infinite}.cn-checker-foot{flex:none;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1.2rem;border-top:1px solid hsl(var(--border));background:#111115f5;box-shadow:0 -12px 30px #0008}.cn-checker-foot>div{display:flex;flex-direction:column}.cn-checker-foot b{font-size:.75rem;color:#facc15}.cn-checker-foot small{font-size:.65rem;color:hsl(var(--muted-foreground))}.cn-checker-foot a{min-width:15rem;text-align:center}.cn-checker-error h3{font-size:1.1rem;color:#fff}.cn-checker-error p{margin:.5rem 0 1rem}@keyframes cn-spin{to{transform:rotate(360deg)}}
.cn-cosmetic.rarity-common{background:radial-gradient(circle at 50% 25%,#8d939b,#34383e 72%);border-color:#9ca3af}.cn-cosmetic.rarity-uncommon{background:radial-gradient(circle at 50% 25%,#61c554,#17491c 72%);border-color:#58d04f}.cn-cosmetic.rarity-rare{background:radial-gradient(circle at 50% 25%,#39aaf6,#123d78 72%);border-color:#48b6ff}.cn-cosmetic.rarity-epic{background:radial-gradient(circle at 50% 25%,#c45bff,#54147d 72%);border-color:#d06cff}.cn-cosmetic.rarity-legendary{background:radial-gradient(circle at 50% 25%,#f6aa3c,#7a3511 72%);border-color:#ffb544}.cn-cosmetic.series-marvel{background:radial-gradient(circle at 50% 25%,#f04444,#6f1117 72%);border-color:#ff525b}.cn-cosmetic.series-dc{background:radial-gradient(circle at 50% 25%,#4e8fe8,#172d5f 72%);border-color:#73a8f1}.cn-cosmetic.series-icon{background:radial-gradient(circle at 50% 25%,#32e0df,#087b8d 72%);border-color:#52ffff}.cn-cosmetic.series-gaming{background:radial-gradient(circle at 50% 25%,#4f7fe8,#192650 72%);border-color:#779dff}.cn-cosmetic.series-starwars{background:radial-gradient(circle at 50% 25%,#edf5ff,#35537a 58%,#111827 90%);border-color:#dbeafe}.cn-cosmetic.series-dark{background:radial-gradient(circle at 50% 25%,#d74cff,#45125f 72%);border-color:#ec71ff}.cn-cosmetic.series-shadow{background:radial-gradient(circle at 50% 25%,#d3d6dc,#484b54 72%);border-color:#e5e7eb}.cn-cosmetic.series-slurp{background:radial-gradient(circle at 50% 25%,#34f0dc,#06778b 72%);border-color:#45ffe9}.cn-cosmetic.series-lava{background:radial-gradient(circle at 50% 25%,#ff7a24,#6f1908 72%);border-color:#ff934d}.cn-cosmetic.series-frozen{background:radial-gradient(circle at 50% 25%,#91e9ff,#2161a3 72%);border-color:#b9f3ff}
@media(max-width:800px){.cn-filters{max-height:none;overflow:visible}.cn-filter-actions{bottom:0}.cn-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cn-cosmetic-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.cn-checker{padding:0}.cn-checker-panel{height:100dvh;max-height:100dvh;border-radius:0}.cn-checker-head{grid-template-columns:1fr auto}.cn-checker-head>strong{font-size:1.05rem}.cn-checker-head>button{grid-column:2;grid-row:1}.cn-checker-foot{align-items:stretch;flex-direction:column;gap:.45rem}.cn-checker-foot a{min-width:0}.cn-card-head b{font-size:1rem}}

/* Identidade CN STORE: preto dominante, branco e prata. */
#cn-accounts-app .cn-card{border-color:#29292f;background:linear-gradient(155deg,#121216,#08080a);box-shadow:0 12px 30px #0005}
#cn-accounts-app .cn-card:hover{border-color:#f4f4f5;box-shadow:0 16px 38px #0009,0 0 0 1px #ffffff24}
#cn-accounts-app .cn-card-head b,.cn-checker-actions>strong{color:#fff;text-shadow:0 0 18px #ffffff2b}
#cn-accounts-app .cn-game-icon,.cn-checker .cn-game-icon{border:1px solid #ffffff38;background:linear-gradient(145deg,#fafafa,#777 45%,#111 46%,#050505);box-shadow:inset 0 0 0 1px #000,0 5px 15px #0009;color:#fff}
#cn-accounts-app .cn-card-skins{border-color:#3f3f46;background:#050505;box-shadow:inset 0 0 18px #000}
#cn-accounts-app .cn-card-skins img{border-right-color:#ffffff2e}
#cn-accounts-app .cn-badge,#cn-accounts-app .cn-tag{border-color:#3f3f46;background:#0b0b0e;color:#e4e4e7}
#cn-accounts-app .cn-cosmetic-search:focus-within,#cn-accounts-app .cn-cosmetic-search.selected{border-color:#fff;box-shadow:0 0 0 2px #ffffff18}
#cn-accounts-app .cn-suggestion:hover{background:#ffffff0d}
#cn-accounts-app .cn-sort-btn.bg-primary,#cn-accounts-app .cn-toggle.bg-primary{border-color:#fff!important;background:#fff!important;color:#050505!important;box-shadow:0 4px 14px #0008}
#cn-accounts-app .btn-primary,.cn-checker .btn-primary{border:1px solid #fff!important;background:#fff!important;color:#050505!important;box-shadow:0 7px 20px #0009!important;transition:transform .15s,background .15s,color .15s!important}
#cn-accounts-app .btn-primary:hover,.cn-checker .btn-primary:hover{background:#d4d4d8!important;color:#000!important;transform:translateY(-1px)}
.cn-checker-backdrop{background:#000e;backdrop-filter:blur(8px)}
.cn-checker-panel{border-color:#71717a;background:#09090b;box-shadow:0 28px 100px #000,0 0 0 1px #ffffff18}
.cn-checker-panel::before{content:"";position:absolute;z-index:3;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #ffffff18}
.cn-checker-head{border-top-color:#fff;border-bottom-color:#3f3f46;background:linear-gradient(110deg,#050505 0%,#18181b 55%,#09090b 100%)}
.cn-logo-mark{width:2.5rem!important;font-size:.7rem;letter-spacing:-.04em}
.cn-checker-name{display:flex!important;flex-direction:column;gap:.12rem!important;min-width:0}
.cn-checker-name small{font-size:.55rem;letter-spacing:.18em;color:#a1a1aa;font-weight:800}
.cn-checker-tabs{border-bottom-color:#27272a;background:#0a0a0c}
.cn-checker-tabs button{border-color:#3f3f46;background:#111114;color:#a1a1aa}
.cn-checker-tabs button:hover{border-color:#a1a1aa;color:#fff}
.cn-checker-tabs button.active{border-color:#fff;background:#fff;color:#050505;box-shadow:0 5px 18px #000b}
.cn-checker-body{background:radial-gradient(circle at 50% 0,#1a1a1f 0,#0b0b0e 34rem)}
.cn-summary-grid{border-color:#3f3f46;background:#0b0b0e;box-shadow:0 12px 28px #0005}
.cn-stat{border-color:#303036;background:linear-gradient(145deg,#121216,#09090b)}
.cn-stat span{color:#a1a1aa}
.cn-checker-body h3{letter-spacing:.04em;text-transform:uppercase}
.cn-cosmetic-grid{gap:.7rem}
.cn-cosmetic{padding:3px;border:1px solid #ffffffb8!important;border-radius:.72rem;box-shadow:inset 0 0 0 1px #000,0 8px 18px #0009;isolation:isolate}
.cn-cosmetic::before{content:"";position:absolute;z-index:2;inset:3px;border:1px solid #ffffff2e;border-radius:.48rem;pointer-events:none;box-shadow:inset 0 0 18px #ffffff0b}
.cn-cosmetic::after{content:"CN";position:absolute;z-index:3;right:.48rem;top:.45rem;padding:.12rem .23rem;border:1px solid #ffffff59;border-radius:.2rem;background:#050505b8;color:#fff;font-size:.45rem;font-weight:900;letter-spacing:.08em;pointer-events:none}
.cn-cosmetic:hover,.cn-cosmetic:focus-visible{border-color:#fff!important;box-shadow:inset 0 0 0 1px #000,0 14px 28px #000d,0 0 0 2px #ffffff2b}
.cn-cosmetic img,.cn-cosmetic-empty{border:1px solid #ffffff45;border-radius:.45rem .45rem .12rem .12rem;box-shadow:inset 0 0 20px #0005}
.cn-cosmetic span{margin-top:3px;border-top:1px solid #ffffff24;border-radius:0 0 .38rem .38rem;background:#050506;color:#fafafa;padding:.38rem .4rem;font-weight:650;letter-spacing:.01em}
.cn-cosmetic em{z-index:4;border:1px solid #ffffff55;background:#050505ed}
#cn-copy-toast{border-color:#71717a;background:#09090b}
.cn-checker-foot{border-top-color:#3f3f46;background:#070708f7;box-shadow:0 -14px 34px #000b}
.cn-checker-foot b{color:#fff;letter-spacing:.02em}
.cn-checker-loading span{border-top-color:#fff}
@media(max-width:800px){.cn-checker-name small{display:none}.cn-cosmetic-grid{gap:.45rem}.cn-cosmetic{padding:2px;border-radius:.58rem}.cn-cosmetic::before{inset:2px}.cn-cosmetic::after{right:.35rem;top:.35rem}.cn-cosmetic span{margin-top:2px}}

/* Filtros monocromáticos e ações do checker. */
#cn-accounts-app .cn-filters{border-color:#303036!important;background:linear-gradient(165deg,#111114,#070708)!important;box-shadow:0 16px 35px #0007}
#cn-accounts-app .cn-filters input{border-color:#303036!important;background:#08080a!important;color:#fff!important}
#cn-accounts-app .cn-filters input::placeholder{color:#71717a!important}
#cn-accounts-app .cn-filters input:focus{border-color:#fff!important;box-shadow:0 0 0 2px #ffffff14!important}
#cn-accounts-app .cn-filters .cn-cosmetic-search{border-color:#303036;background:#08080a}
#cn-accounts-app .cn-filters .cn-toggle{border-color:#303036;background:#0b0b0e;color:#a1a1aa}
#cn-accounts-app .cn-filters .cn-toggle:hover{border-color:#a1a1aa;color:#fff}
#cn-accounts-app .cn-filter-actions{background:linear-gradient(180deg,transparent,#09090b 25%)}
#cn-accounts-app .cn-sort-btn{border-color:#303036;background:#0b0b0e;color:#a1a1aa}
#cn-accounts-app .cn-sort-btn:hover{border-color:#a1a1aa;color:#fff}
#cn-accounts-app .cn-card-foot small{color:#e4e4e7!important}
#cn-accounts-app .cn-badge-warn{border-color:#52525b!important;background:#111114!important;color:#fff!important}
#cn-accounts-app .cn-cosmetic-search.selected{background:#0b0b0e!important}
.cn-checker-actions{display:flex!important;align-items:center;justify-content:flex-end;gap:.45rem!important;overflow:visible!important}
.cn-checker-actions>strong{margin-right:.35rem;font-size:1.4rem;white-space:nowrap}
.cn-checker-actions>button,.cn-download-wrap>button{display:flex!important;width:auto!important;align-items:center;gap:.4rem;padding:0 .65rem;border:1px solid #3f3f46;background:#101013!important;color:#fff;transition:.15s}
.cn-checker-actions>button:last-child{width:2rem!important;padding:0!important;justify-content:center}
.cn-checker-actions button span{font-size:.67rem;font-weight:700;white-space:nowrap}
.cn-checker-actions>button:hover,.cn-download-wrap>button:hover{border-color:#fff;background:#fff!important;color:#050505}
.cn-download-wrap{position:relative;display:block!important;overflow:visible!important}
.cn-download-menu{position:absolute;z-index:20;right:0;top:calc(100% + .55rem);width:13.5rem;padding:.45rem;border:1px solid #52525b;border-radius:.65rem;background:#09090bf7;box-shadow:0 18px 45px #000;backdrop-filter:blur(12px)}
.cn-download-menu.hidden{display:none!important}
.cn-download-menu>b{display:block;padding:.45rem .55rem;color:#a1a1aa;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase}
.cn-download-menu>button{display:flex;width:100%!important;height:auto!important;align-items:center;justify-content:space-between;padding:.58rem .6rem;border-radius:.42rem;color:#fff;font-size:.75rem;text-align:left}
.cn-download-menu>button:hover{background:#fff!important;color:#050505}
.cn-download-menu small{color:#71717a;font-size:.65rem}
.cn-download-menu>button:hover small{color:#3f3f46}
@media(max-width:800px){.cn-checker-actions{gap:.3rem!important}.cn-checker-actions>strong{font-size:.92rem;margin-right:0}.cn-checker-actions>button,.cn-download-wrap>button{width:1.85rem!important;height:1.85rem;padding:0!important;justify-content:center}.cn-checker-actions button span{display:none}.cn-download-menu{right:-2.2rem}}

/* Paginação e remoção dos últimos acentos rosas herdados do tema. */
#cn-accounts-app .text-primary,#cn-accounts-app [class*="text-primary"]{color:#fff!important}
#cn-accounts-app [class*="hover:border-primary"]:hover{border-color:#fff!important}
#cn-accounts-app [class*="hover:bg-primary"]:hover{background:#ffffff12!important}
#cn-accounts-app #cn-loading,#cn-accounts-app #cn-empty,#cn-accounts-app #cn-total-count{color:#d4d4d8!important}
#cn-accounts-app .cn-suggestion-status{color:#d4d4d8!important}
.cn-pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.45rem;margin:1.4rem 0 2rem}
.cn-pagination.hidden{display:none!important}.cn-pagination button{min-width:2.35rem;height:2.35rem;padding:0 .65rem;border:1px solid #3f3f46;border-radius:.5rem;background:#0b0b0e;color:#d4d4d8;font-weight:700}
.cn-pagination button:hover{border-color:#fff;color:#fff}.cn-pagination button.active{border-color:#fff;background:#fff;color:#050505}.cn-pagination span{color:#71717a}

/* Branco absoluto nos elementos que ainda herdavam a cor principal do tema. */
#cn-accounts-app .cn-cosmetic-search>svg,#cn-accounts-app .cn-filters svg{color:#fff!important;stroke:#fff!important}
#cn-accounts-app .cn-cosmetic-search>[data-cosmetic-clear]{color:#d4d4d8!important}
.cn-checker-loading,.cn-checker-loading *{color:#fff!important}
.cn-checker-loading span{border-color:#3f3f46!important;border-top-color:#fff!important}

/* Fundos inspirados nas raridades do Fortnite, com luz central atrás do item. */
.cn-cosmetic.rarity-common{background:radial-gradient(circle at 50% 24%,#c5cbd1 0,#7b838d 38%,#363b42 78%,#202328 100%)}
.cn-cosmetic.rarity-uncommon{background:radial-gradient(circle at 50% 24%,#a6f36f 0,#4fbd39 38%,#17651e 76%,#0b3512 100%)}
.cn-cosmetic.rarity-rare{background:radial-gradient(circle at 50% 24%,#8cddff 0,#249ce9 38%,#075394 76%,#06294e 100%)}
.cn-cosmetic.rarity-epic{background:radial-gradient(circle at 50% 24%,#eba3ff 0,#b23ee5 38%,#591482 76%,#2b073f 100%)}
.cn-cosmetic.rarity-legendary{background:radial-gradient(circle at 50% 24%,#ffe083 0,#f59e21 38%,#963b0c 76%,#4b1805 100%)}
.cn-cosmetic.rarity-mythic{background:radial-gradient(circle at 50% 20%,#fffbd0 0,#f8da58 34%,#b87312 70%,#543006 100%)}
.cn-cosmetic.rarity-exotic{background:radial-gradient(circle at 50% 20%,#c8fbff 0,#4cdef4 35%,#0a89a7 70%,#054151 100%)}
.cn-cosmetic.series-marvel{background:radial-gradient(circle at 50% 22%,#ff8b8f 0,#e31d29 40%,#790b12 76%,#350509 100%)}
.cn-cosmetic.series-dc{background:radial-gradient(circle at 50% 22%,#8bc8ff 0,#1976d2 40%,#0b3977 76%,#061a3a 100%)}
.cn-cosmetic.series-icon{background:radial-gradient(circle at 50% 20%,#a6fff9 0,#20d9d5 36%,#087e91 72%,#043844 100%)}
.cn-cosmetic.series-gaming{background:radial-gradient(circle at 50% 22%,#b9b2ff 0,#6b5bed 38%,#30267f 74%,#151137 100%)}
.cn-cosmetic.series-starwars{background:radial-gradient(circle at 50% 18%,#f8fbff 0,#87a9d2 20%,#182841 52%,#05070c 82%)}
.cn-cosmetic.series-dark{background:radial-gradient(circle at 50% 22%,#f0a0ff 0,#c230e4 38%,#64117d 74%,#280334 100%)}
.cn-cosmetic.series-shadow{background:radial-gradient(circle at 50% 20%,#ffffff 0,#bfc3c9 32%,#555a62 68%,#202228 100%)}
.cn-cosmetic.series-slurp{background:radial-gradient(circle at 50% 20%,#a3fff3 0,#24e0cf 36%,#087e8e 72%,#043842 100%)}
.cn-cosmetic.series-lava{background:radial-gradient(circle at 50% 18%,#ffe36e 0,#ff8a18 34%,#b32d08 68%,#4b0903 100%)}
.cn-cosmetic.series-frozen{background:radial-gradient(circle at 50% 18%,#f0fdff 0,#83dcff 34%,#2781c5 68%,#123e72 100%)}

/* ==========================================================================
   Checkout Pix (formulario + tela de pagamento dentro da vitrine)
   Para trocar a cor de destaque, mude so as variaveis --pay-* abaixo.
   ========================================================================== */
#cn-copy-toast{z-index:10500}
.cn-pay{--pay-accent:#2fbfa8;--pay-accent-ink:#04211c;--pay-ok:#4ade80;--pay-warn:#f5c542;--pay-discord:#5865f2;--pay-line:#2a2a30;--pay-surface:#17171b;position:fixed;z-index:10000;inset:0;display:grid;place-items:center;padding:1rem;background:#000d;backdrop-filter:blur(8px)}
.cn-pay.hidden{display:none}
.cn-pay-box{position:relative;width:100%;max-width:25rem;max-height:calc(100vh - 2rem);max-height:calc(100dvh - 2rem);overflow-y:auto;padding:1.5rem 1.25rem 1.25rem;border:1px solid var(--pay-line);border-radius:1rem;background:#0e0e11;color:#f4f4f5;box-shadow:0 28px 90px #000,0 0 0 1px #ffffff0d;scrollbar-width:thin;scrollbar-color:#3f3f46 transparent}
.cn-pay-box *{box-sizing:border-box}
.cn-pay-x{position:absolute;top:.6rem;right:.6rem;width:2rem;height:2rem;border:0;border-radius:999px;background:#ffffff14;color:#fff;font-size:1.2rem;line-height:1;cursor:pointer;transition:background .15s}
.cn-pay-x:hover{background:#ffffff2e}
.cn-pay-title{margin:0;padding-right:1.6rem;font-size:1.05rem;font-weight:700;color:#fff}
.cn-pay-title.center{padding:0;text-align:center}
.cn-pay-account{margin:.2rem 0 0;color:#a1a1aa;font-size:.8rem}
.cn-pay-price,.cn-pay-amount{margin-top:.6rem;color:var(--pay-accent);font-size:2rem;font-weight:800;line-height:1.1;letter-spacing:-.02em}
.cn-pay-amount{margin-top:.5rem;text-align:center}
.cn-pay-unique{display:flex;align-items:center;gap:.6rem;margin-top:.8rem;padding:.7rem .85rem;border:1px solid #5a4b1f;border-radius:.65rem;background:#241e0f;color:var(--pay-warn);font-size:.8rem;font-weight:700}
.cn-pay-unique svg{flex:none;width:1rem;height:1rem;color:var(--pay-warn);stroke:var(--pay-warn)}
.cn-pay-hint{display:flex;align-items:center;flex-wrap:wrap;gap:.3rem;margin:.75rem 0 0;color:#a1a1aa;font-size:.72rem}
.cn-pay-hint svg{width:.8rem;height:.8rem}
.cn-pay-fields{display:grid;gap:.6rem;margin-top:1rem}
.cn-pay-fields input{width:100%;height:2.75rem;padding:0 .85rem;border:1px solid var(--pay-line);border-radius:.6rem;background:var(--pay-surface);color:#fff;font-size:.9rem;outline:0;transition:border-color .15s,box-shadow .15s}
.cn-pay-fields input::placeholder{color:#71717a}
.cn-pay-fields input:focus{border-color:var(--pay-accent);box-shadow:0 0 0 3px #2fbfa826}
.cn-pay-terms{display:flex;align-items:flex-start;gap:.7rem;margin-top:.8rem;padding:.8rem;border:1px solid var(--pay-line);border-radius:.65rem;background:#111114;color:#d4d4d8;font-size:.75rem;line-height:1.45;cursor:pointer}
/* O tema aplica "appearance:none" em todo input (core.css), o que apaga o checkbox nativo. Por isso ele e desenhado aqui. */
.cn-pay-terms input[type=checkbox]{appearance:none;-webkit-appearance:none;display:grid;place-content:center;flex:none;width:1.2rem;height:1.2rem;margin:.05rem 0 0;padding:0;border:1.5px solid #52525b;border-radius:.3rem;background:#0b0b0e;cursor:pointer;transition:background .15s,border-color .15s}
.cn-pay-terms input[type=checkbox]:hover{border-color:var(--pay-accent)}
.cn-pay-terms input[type=checkbox]:checked{border-color:var(--pay-accent);background:var(--pay-accent)}
.cn-pay-terms input[type=checkbox]:checked::after{content:"";width:.32rem;height:.62rem;margin-top:-.08rem;border:solid var(--pay-accent-ink);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.cn-pay-terms input[type=checkbox]:focus-visible{outline:2px solid var(--pay-accent);outline-offset:2px}
.cn-pay-terms a{color:var(--pay-ok);text-decoration:underline}
.cn-pay-terms em{color:#fb7185;font-style:normal;font-weight:600}
.cn-pay-error{margin:.7rem 0 0;padding:.6rem .75rem;border:1px solid #7f1d1d;border-radius:.55rem;background:#2a0f12;color:#fca5a5;font-size:.78rem}
.cn-pay-error.hidden{display:none}
.cn-pay-actions{display:grid;grid-template-columns:1fr 1.5fr;gap:.6rem;margin-top:1rem}
.cn-pay-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:2.9rem;padding:0 1rem;border:1px solid transparent;border-radius:.65rem;font-size:.9rem;font-weight:700;cursor:pointer;transition:filter .15s,transform .15s,opacity .15s}
.cn-pay-btn.full{width:100%;margin-top:.9rem}
.cn-pay-btn.ghost{border-color:var(--pay-line);background:var(--pay-surface);color:#e4e4e7}
.cn-pay-btn.ghost:hover{border-color:#52525b;color:#fff}
.cn-pay-btn.go{background:var(--pay-accent);color:var(--pay-accent-ink)}
.cn-pay-btn.go:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px)}
.cn-pay-btn.go:disabled{background:#1f4f45;color:#ffffff73;cursor:not-allowed}
.cn-pay-btn.go.copied{background:var(--pay-ok)}
.cn-pay-btn svg{width:1rem;height:1rem;stroke:currentColor;color:inherit}
.cn-pay-spin{width:.9rem;height:.9rem;border:2px solid #ffffff59;border-top-color:#fff;border-radius:50%;animation:cn-pay-rot .7s linear infinite}
@keyframes cn-pay-rot{to{transform:rotate(360deg)}}
.cn-pay-sub{margin:.45rem 0 0;color:#a1a1aa;font-size:.78rem;line-height:1.45;text-align:center}
.cn-pay-sub b{color:#e4e4e7;font-variant-numeric:tabular-nums}
.cn-pay-bar{height:4px;margin:.9rem 0 1.1rem;border-radius:999px;background:#ffffff12;overflow:hidden}
.cn-pay-bar span{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--pay-accent),#5fe0cc);transition:width 1s linear}
.cn-pay-qr{display:grid;place-items:center;width:fit-content;margin:0 auto;padding:.9rem;border-radius:1rem;background:#fff}
.cn-pay-qr img{display:block;width:min(14rem,62vw);height:auto;aspect-ratio:1;image-rendering:pixelated}
.cn-pay-qr p{margin:0;padding:2rem 1rem;color:#52525b;font-size:.8rem;text-align:center}
.cn-pay-label{display:block;margin:1.1rem 0 .4rem;color:#a1a1aa;font-size:.72rem;font-weight:600}
.cn-pay-code{display:block;width:100%;padding:.7rem .8rem;border:1px solid var(--pay-line);border-radius:.6rem;background:#08080a;color:#e4e4e7;font:.7rem/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;resize:none;overflow-y:auto;word-break:break-all}
.cn-pay-steps{margin-top:1.1rem;padding:1rem;border:1px solid #2fbfa840;border-radius:.9rem;background:linear-gradient(180deg,#0f1a18,#0d0d10 60%)}
.cn-pay-steps header{display:flex;align-items:center;gap:.6rem;margin-bottom:.9rem}
.cn-pay-steps header svg{width:1.15rem;height:1.15rem;color:var(--pay-accent);stroke:var(--pay-accent)}
.cn-pay-steps h3{margin:0;color:#fff;font-size:.9rem;font-weight:700}
.cn-pay-steps ol{position:relative;display:grid;gap:.95rem;margin:0;padding:0;list-style:none}
.cn-pay-steps ol::before{content:"";position:absolute;left:.85rem;top:1.2rem;bottom:1.2rem;width:1px;background:#2fbfa840}
.cn-pay-steps li{position:relative;display:grid;grid-template-columns:1.7rem 1fr;gap:.8rem;align-items:start}
.cn-pay-steps li>b{display:grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--pay-accent);color:var(--pay-accent-ink);font-size:.75rem;font-weight:800;box-shadow:0 0 0 4px #0e1c19}
.cn-pay-steps strong{display:block;color:#fff;font-size:.85rem}
.cn-pay-steps small{display:block;margin-top:.15rem;color:#a1a1aa;font-size:.75rem;line-height:1.45}
.cn-pay-steps small em{color:#fff;font-style:normal;font-weight:700}
.cn-pay-orderid{display:flex;align-items:center;gap:.7rem;margin-top:1rem;padding:.65rem .75rem;border:1px solid var(--pay-line);border-radius:.65rem;background:#08080a}
.cn-pay-orderid span{color:#71717a;font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.cn-pay-orderid code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;color:var(--pay-ok);font:600 .85rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.cn-pay-orderid button{flex:none;padding:.35rem .7rem;border:1px solid #3f3f46;border-radius:.45rem;background:var(--pay-surface);color:#fff;font-size:.72rem;font-weight:700;cursor:pointer}
.cn-pay-orderid button:hover{border-color:#fff}
.cn-pay-discord{display:flex;align-items:center;justify-content:center;gap:.55rem;height:2.9rem;margin-top:.8rem;border-radius:.7rem;background:var(--pay-discord);color:#fff;font-size:.9rem;font-weight:700;text-decoration:none;box-shadow:0 8px 22px #5865f240;transition:filter .15s,transform .15s}
.cn-pay-discord:hover{filter:brightness(1.1);transform:translateY(-1px)}
.cn-pay-discord svg{width:1.1rem;height:1.1rem;stroke:#fff}
.cn-pay-track{display:block;margin-top:1rem;color:#a1a1aa;font-size:.75rem;text-align:center;text-decoration:underline;text-underline-offset:3px}
.cn-pay-track:hover{color:#fff}
.cn-pay-state{display:grid;place-items:center;width:3.5rem;height:3.5rem;margin:0 auto .8rem;border-radius:50%}
.cn-pay-state svg{width:1.6rem;height:1.6rem}
.cn-pay-state.ok{background:#2fbfa826;color:var(--pay-accent);box-shadow:0 0 0 6px #2fbfa812}
.cn-pay-state.ok svg{stroke:var(--pay-accent)}
.cn-pay-state.warn{background:#f5c54222;box-shadow:0 0 0 6px #f5c54210}
.cn-pay-state.warn svg{stroke:var(--pay-warn)}
@media(max-width:480px){.cn-pay{padding:.5rem}.cn-pay-box{max-height:calc(100dvh - 1rem);padding:1.25rem 1rem 1rem}.cn-pay-price,.cn-pay-amount{font-size:1.75rem}}
.cn-pay-reviews{display:inline-flex;align-items:center;gap:.35rem;margin-top:.5rem;color:#a1a1aa;font-size:.72rem;text-decoration:underline;text-underline-offset:3px}
.cn-pay-reviews:hover,.cn-pay-inline:hover{color:#fff}
.cn-pay-reviews svg{width:.8rem;height:.8rem;stroke:var(--pay-warn);color:var(--pay-warn)}
.cn-pay-inline{color:#e4e4e7;text-decoration:underline;text-underline-offset:3px}

/* Seleção múltipla e disponibilidade */
.cn-cosmetic-search { height:auto; min-height:2.65rem; padding-top:8px; padding-bottom:8px; }
.cn-selected-cosmetics { grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:6px; width:100%; margin-top:8px; }
.cn-selected-cosmetics:empty { display:none; }
.cn-selected-chip { max-width:100%; padding:6px 10px; border:1px solid #555; border-radius:8px; background:#222; color:#fff; text-align:left; overflow-wrap:anywhere; font-size:12px; }
.cn-selected-chip:hover { background:#383838; }
.cn-selected-chip span { margin-left:6px; }
.cn-availability { display:flex; flex-wrap:wrap; gap:8px 16px; padding:12px 20px; color:#fff; background:#202020; border-bottom:1px solid #444; }
.cn-availability span { color:#ccc; font-size:13px; }
.cn-checker-foot button:disabled { opacity:.55; cursor:not-allowed; }

/* Campo de etiquetas: cada seleção e a entrada ocupam espaços separados. */
#cn-accounts-app .cn-cosmetic-search { display:flex!important; flex-wrap:nowrap; align-items:flex-start; height:auto!important; min-height:44px; padding:8px!important; gap:6px; }
#cn-accounts-app .cn-cosmetic-search > svg { flex:0 0 16px; margin-top:6px; }
#cn-accounts-app .cn-cosmetic-tokens { display:flex; flex:1 1 0; min-width:0; flex-wrap:wrap; align-items:center; gap:6px; cursor:text; }
#cn-accounts-app .cn-selected-cosmetics { display:contents; }
#cn-accounts-app .cn-selected-chip { display:inline-flex; flex:0 1 auto; align-items:center; gap:5px; max-width:100%; min-height:28px; margin:0; padding:3px 6px; border:1px solid #777; border-radius:4px; background:#292929; color:#fff; font-size:12px; line-height:20px; }
#cn-accounts-app .cn-selected-chip img { width:20px; height:20px; object-fit:contain; flex-shrink:0; }
#cn-accounts-app .cn-selected-chip span { margin:0; }
#cn-accounts-app .cn-chip-name { overflow-wrap:anywhere; min-width:0; }
#cn-accounts-app .cn-chip-remove { flex-shrink:0; font-size:16px; color:#bbb; }
#cn-accounts-app .cn-cosmetic-tokens > input[data-cosmetic-input] { position:static!important; flex:1 1 120px; min-width:80px!important; width:120px!important; max-width:100%; height:28px!important; margin:0!important; padding:0 3px!important; border:0!important; background:transparent!important; box-shadow:none!important; color:#fff!important; font-size:13px; }
#cn-accounts-app .cn-cosmetic-search > [data-cosmetic-clear] { flex-shrink:0; margin-top:3px; }

/* Cores próprias da raridade na busca de skins, picaretas, asas e emotes. */
#cn-accounts-app .cn-suggestion{--cn-rarity-color:#b8bdc5}
#cn-accounts-app .cn-suggestion[data-rarity="common"]{--cn-rarity-color:#b8bdc5}
#cn-accounts-app .cn-suggestion[data-rarity="uncommon"]{--cn-rarity-color:#58d04f}
#cn-accounts-app .cn-suggestion[data-rarity="rare"]{--cn-rarity-color:#48b6ff}
#cn-accounts-app .cn-suggestion[data-rarity="epic"]{--cn-rarity-color:#d06cff}
#cn-accounts-app .cn-suggestion[data-rarity="legendary"]{--cn-rarity-color:#ffb544}
#cn-accounts-app .cn-suggestion[data-rarity="mythic"]{--cn-rarity-color:#f8da58}
#cn-accounts-app .cn-suggestion[data-rarity="exotic"]{--cn-rarity-color:#4cdef4}
#cn-accounts-app .cn-suggestion[data-rarity="icon"]{--cn-rarity-color:#32e0df}
#cn-accounts-app .cn-suggestion[data-rarity="marvel"]{--cn-rarity-color:#ff525b}
#cn-accounts-app .cn-suggestion[data-rarity="dc"]{--cn-rarity-color:#73a8f1}
#cn-accounts-app .cn-suggestion[data-rarity="gaming"]{--cn-rarity-color:#779dff}
#cn-accounts-app .cn-suggestion[data-rarity="starwars"]{--cn-rarity-color:#dbeafe}
#cn-accounts-app .cn-suggestion[data-rarity="dark"]{--cn-rarity-color:#ec71ff}
#cn-accounts-app .cn-suggestion[data-rarity="shadow"]{--cn-rarity-color:#e5e7eb}
#cn-accounts-app .cn-suggestion[data-rarity="slurp"]{--cn-rarity-color:#45ffe9}
#cn-accounts-app .cn-suggestion[data-rarity="lava"]{--cn-rarity-color:#ff934d}
#cn-accounts-app .cn-suggestion[data-rarity="frozen"]{--cn-rarity-color:#b9f3ff}
#cn-accounts-app .cn-suggestion b,#cn-accounts-app .cn-suggestion small{color:var(--cn-rarity-color)!important}

/* ===== Filtros em gaveta no celular/tablet ===== */
.cn-only-mobile{display:none}
.cn-filters-backdrop{display:none}
@media(max-width:1023px){
.cn-only-mobile{display:inline-flex}
.cn-filters-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;height:2.9rem;margin-bottom:.9rem;padding:0 .95rem;border:1px solid #303036;border-radius:.85rem;background:linear-gradient(165deg,#111114,#070708);color:#fff;font-weight:600;font-size:.95rem;scroll-margin-top:5rem}
.cn-filters-toggle-label,.cn-filters-toggle-side{display:inline-flex;align-items:center;gap:.5rem}
.cn-filters-toggle svg{width:1.05rem;height:1.05rem;color:#fff;stroke:#fff}
.cn-filters-toggle em{font-style:normal;min-width:1.4rem;height:1.4rem;padding:0 .4rem;border-radius:999px;background:#fff;color:#000;font-size:.75rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.cn-filters-toggle em.hidden{display:none}
.cn-filters-toggle[aria-expanded="true"] .cn-filters-toggle-side svg{transform:rotate(180deg)}
.cn-filters-backdrop{display:block;position:fixed;inset:0;z-index:60;background:#000b;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility 0s .25s}
.cn-filters-backdrop.cn-open{opacity:1;visibility:visible;transition:opacity .25s ease}
#cn-accounts-app .cn-filters{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:70;width:100%;max-height:88dvh;overflow-y:auto;overscroll-behavior:contain;border-radius:1.25rem 1.25rem 0 0;transform:translateY(105%);visibility:hidden;transition:transform .28s ease,visibility 0s .28s}
#cn-accounts-app .cn-filters.cn-open{transform:none;visibility:visible;transition:transform .28s ease}
#cn-accounts-app .cn-filters-head{position:sticky;top:-1rem;z-index:11;margin:-1rem -1rem 0;padding:1rem;background:#111114;border-bottom:1px solid #303036}
.cn-filters-close{margin-left:auto;width:2rem;height:2rem;align-items:center;justify-content:center;border:1px solid #303036;border-radius:.6rem;background:#0b0b0e;color:#fff}
.cn-filters-close svg{width:1rem;height:1rem}
#cn-accounts-app .cn-filter-actions{padding-bottom:calc(.75rem + env(safe-area-inset-bottom,0px))}
body.cn-filters-open{overflow:hidden}
}

/* O layout força position:relative nos filhos diretos do body; a tela de pagamento precisa ficar fixa sobre tudo. */
body > .cn-pay:not(#cn-a):not(#cn-b){position:fixed!important;inset:0!important;z-index:10000!important}
/* Promoção: preço antigo riscado + etiqueta de desconto */
.cn-price-box{display:inline-flex;flex-direction:column;align-items:flex-end;line-height:1.1;gap:.1rem}
.cn-price-old{font-size:.7rem;font-weight:500;color:#a1a1aa;text-decoration:line-through;text-shadow:none}
.cn-price-off{font-size:.62rem;font-weight:800;color:#052e16;background:#4ade80;border-radius:999px;padding:.05rem .4rem;text-shadow:none}
.cn-price-now{font-weight:800}

/* Preview sob demanda: a janela mantém o inventário aberto atrás dela. */
.cn-cosmetic{cursor:pointer}
body > dialog#cn-cosmetic-preview.cn-cosmetic-preview{position:fixed!important;inset:0;z-index:11000!important;width:min(720px,calc(100vw - 2rem));max-width:none;max-height:calc(100dvh - 2rem);margin:auto;padding:0;overflow-y:auto;border:1px solid #71717a;border-radius:1rem;background:#09090b;color:#fafafa;font-family:inherit;box-shadow:0 24px 90px #000c;overscroll-behavior:contain}
.cn-cosmetic-preview::backdrop{background:#000c;backdrop-filter:blur(7px)}
.cn-cosmetic-preview *{box-sizing:border-box}
.cn-preview-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.2rem;border-bottom:1px solid #303036;background:linear-gradient(110deg,#050505,#18181b)}
.cn-preview-head>div{min-width:0}
.cn-preview-head small{display:block;margin-bottom:.25rem;color:#a1a1aa;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em}
.cn-preview-head h2{margin:0;color:#fff;font-size:1.1rem;font-weight:750;overflow-wrap:anywhere}
.cn-preview-head button,.cn-preview-foot button{display:flex;align-items:center;justify-content:center;gap:.4rem;flex-shrink:0;border:1px solid #52525b;border-radius:.5rem;background:#111114;color:#fff;cursor:pointer}
.cn-preview-head button{width:2.25rem;height:2.25rem;font-size:1.5rem;line-height:1}
.cn-preview-head svg,.cn-preview-foot svg{width:1rem;height:1rem}
.cn-preview-head button:hover,.cn-preview-foot button:hover{border-color:#fff;background:#fff;color:#09090b}
.cn-preview-head button:focus-visible,.cn-preview-foot button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.cn-preview-stage{position:relative;display:grid;place-items:center;height:min(58dvh,440px);min-height:200px;overflow:hidden;background:#050505}
.cn-preview-poster{position:absolute;inset:0;display:grid;place-items:center}
.cn-preview-poster img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
.cn-preview-stage video{position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;object-fit:contain;background:#050505}
.cn-preview-loading{position:absolute;z-index:3;inset:0;display:grid;place-items:center;background:#0005;pointer-events:none}
.cn-preview-loading span{width:2.25rem;height:2.25rem;border:3px solid #ffffff33;border-top-color:#fff;border-radius:50%;animation:cn-spin .8s linear infinite}
.cn-preview-loading[hidden],.cn-preview-poster[hidden]{display:none!important}
.cn-preview-status{min-height:1.3rem;margin:0;padding:.6rem 1.2rem;color:#a1a1aa;font-size:.75rem;line-height:1.45;text-align:center}
.cn-preview-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1.2rem;border-top:1px solid #303036}
.cn-preview-foot>span{color:#a1a1aa;font-size:.7rem;overflow-wrap:anywhere}
.cn-preview-foot button{min-height:2.25rem;padding:.4rem .75rem;font-size:.75rem;font-weight:650}
@media(max-width:600px){body > dialog#cn-cosmetic-preview.cn-cosmetic-preview{width:calc(100vw - 1rem);max-height:calc(100dvh - 1rem);border-radius:.8rem}.cn-preview-head,.cn-preview-foot{padding:.8rem}.cn-preview-stage{height:min(54dvh,380px)}.cn-preview-head h2{font-size:1rem}.cn-preview-status{padding:.5rem .8rem}.cn-preview-foot{gap:.5rem}}
@media(prefers-reduced-motion:reduce){.cn-preview-loading span{animation:none}}

/* ===== Vídeo travado: o visitante só assiste (sem controles/pausa/barra) ===== */
.cn-locked-video{pointer-events:none!important;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;outline:none}
.cn-locked-video::-webkit-media-controls,
.cn-locked-video::-webkit-media-controls-enclosure,
.cn-locked-video::-webkit-media-controls-panel,
.cn-locked-video::-webkit-media-controls-start-playback-button{display:none!important;-webkit-appearance:none}
.cn-locked-video::-internal-media-controls-overlay-cast-button{display:none!important}
.cn-preview-stage[data-mode="style"] .cn-locked-video{visibility:hidden}

/* ===== Skin destaque: card do tamanho de uma skin, só com preview 3D (sem foto) ===== */
.cn-featured-block{--cn-feat:#60a5fa;display:inline-flex;flex-direction:column;gap:.3rem;margin:0 0 1rem}
.cn-featured-block[hidden]{display:none!important}
.cn-featured-block[data-tier="ultra"]{--cn-feat:#fbbf24}
.cn-featured-block[data-tier="rare"]{--cn-feat:#c084fc}
.cn-featured-tag{color:var(--cn-feat);font-size:.58rem;font-weight:850;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
.cn-featured-card{position:relative;display:block;width:7.5rem;padding:0;overflow:hidden;border:1px solid var(--cn-feat);border-radius:.55rem;background:linear-gradient(145deg,#3b155f,#111);text-align:left;cursor:pointer;transition:transform .15s,box-shadow .15s}
.cn-featured-card:hover,.cn-featured-card:focus-visible{transform:translateY(-3px);box-shadow:0 8px 22px #0009,0 0 0 2px color-mix(in srgb,var(--cn-feat) 40%,transparent)}
.cn-featured-card:focus-visible{outline:2px solid #fff;outline-offset:2px}
.cn-featured-media{position:relative;display:block;width:100%;aspect-ratio:1/1.15;background:#050505}
.cn-featured-media .cn-locked-video{position:absolute;inset:0;z-index:2;width:100%;height:100%;object-fit:contain;background:#050505}
.cn-featured-badge{position:absolute;z-index:3;left:.3rem;top:.3rem;padding:.1rem .3rem;border:1px solid #ffffff55;border-radius:999px;background:#000b;color:#fff;font-size:.45rem;font-weight:900;line-height:1;letter-spacing:.08em;pointer-events:none}
.cn-featured-name{display:block;padding:.3rem .35rem;background:#070709;color:#fff;font-size:.62rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:800px){.cn-featured-card{width:6.5rem}}

.cn-cosmetics-more{display:block;width:min(20rem,calc(100% - 2rem));margin:.9rem auto 1.1rem;padding:.65rem .9rem;border:1px solid #3f3f46;border-radius:.65rem;background:#111114;color:#e4e4e7;font-size:.75rem;font-weight:750;cursor:pointer}
.cn-cosmetics-more:hover{border-color:#71717a;background:#18181b}
.cn-cosmetics-more:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* ===== Estilos disponíveis dentro do preview ===== */
.cn-preview-style-image{position:absolute;inset:0;z-index:4;display:block;width:100%;height:100%;object-fit:contain;background:#050505}
.cn-preview-style-image[hidden]{display:none!important}
.cn-preview-styles{padding:.2rem 1.2rem .9rem;border-top:1px solid #303036}
.cn-preview-styles h3{margin:.8rem 0 .5rem;color:#fff;font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.cn-preview-styles small{display:block;margin:.5rem 0 .25rem;color:#a1a1aa;font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.cn-style-row{display:flex;flex-wrap:wrap;gap:.45rem}
.cn-style-chip{display:flex;flex-direction:column;align-items:center;gap:.25rem;width:4.4rem;padding:.3rem;border:1px solid #3f3f46;border-radius:.6rem;background:#0b0b0e;color:#d4d4d8;font-size:.6rem;line-height:1.2;text-align:center;cursor:pointer}
.cn-style-chip img{width:3.2rem;height:3.2rem;object-fit:contain;border-radius:.4rem;background:#050505}
.cn-style-chip span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cn-style-chip:hover{border-color:#a1a1aa}
.cn-style-chip[aria-pressed="true"]{border-color:#fff;background:#18181b;color:#fff;box-shadow:0 0 0 1px #fff}
.cn-style-chip:focus-visible{outline:2px solid #fff;outline-offset:2px}
.cn-preview-styles-note{margin:.7rem 0 0;color:#71717a;font-size:.65rem;line-height:1.4}
.cn-preview-styles[hidden]{display:none!important}