/* Apariencias de ClaseHub. Los identificadores de clase vienen del catálogo validado. */
#theme-toggle { display: none !important; }
.login-name-input { margin: 0 0 10px; }
.name-picker { max-height: 148px; overflow: auto; }
.profile-modal { width: min(610px, 100%); max-height: min(88vh, 920px); overflow-y: auto; }
.profile-settings { display: grid; gap: 15px; margin: 21px 0; padding-top: 17px; border-top: 1px solid var(--line); }
.profile-switch { display: flex; gap: 10px; align-items: center; font-weight: 700; font-size: 13px; }
.profile-switch input { width: 17px; height: 17px; accent-color: var(--primary); }
.profile-theme { display: flex; gap: 18px; border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; }
.profile-theme legend { color: var(--muted); font-size: 11px; font-weight: 800; padding: 0 5px; }
.profile-theme label { display: flex; gap: 6px; align-items: center; font-size: 12px; }
.profile-theme input { accent-color: var(--primary); }
.cosmetic-profile-preview { display:flex; align-items:center; gap:28px; padding:28px 24px; border:1px solid var(--line); border-radius:18px; background:radial-gradient(ellipse at top,#e5edfa,transparent 80%),#f6f8fc; }
.cosmetics-market { margin-bottom:22px; }
.cosmetics-market .card-head { align-items:center; gap:20px; padding-bottom:20px; border-bottom:1px solid var(--line); }
.cosmetics-market .card-head h3 { margin:6px 0; font-size:24px; letter-spacing:-.04em; }
.cosmetics-market .card-head p { margin:0; max-width:430px; color:var(--muted); font-size:12px; line-height:1.6; }
.cosmetic-eyebrow { color:#737f99; font-size:9px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.cosmetic-kind { margin-top:30px; }
.cosmetic-kind h4 { margin:0 0 18px; font:800 18px Manrope,sans-serif; letter-spacing:-.025em; }
.cosmetic-tier { margin:18px 0 26px; }
.cosmetic-tier h5 { display:flex; align-items:center; gap:12px; margin:0 0 12px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.1em; }
.cosmetic-tier h5::after { content:""; height:1px; flex:1; background:var(--line); }
.cosmetic-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.cosmetic-card { --studio:#d8e7f8; display:flex; flex-direction:column; min-width:0; padding:8px 8px 15px; border:1px solid #dce4ee; border-radius:20px; background:#fff; box-shadow:0 4px 10px #17284405; transition:transform .25s,box-shadow .25s,border-color .25s; }
.cosmetic-card:hover { transform:translateY(-4px); box-shadow:0 15px 25px #17284412; border-color:#a9bdd9; }
.cosmetic-card-visual { position:relative; isolation:isolate; display:grid; place-items:center; min-height:164px; padding:43px 22px 24px; border:1px solid #ffffff88; border-radius:13px; overflow:hidden; background:radial-gradient(ellipse at 50% 15%,#fff 0%,transparent 70%),linear-gradient(135deg,var(--studio),#eef2f9); }
.cosmetic-card-visual::before { content:""; position:absolute; z-index:-1; width:180px; height:180px; border:1px solid #fff9; border-radius:50%; box-shadow:0 0 0 22px #ffffff24,0 0 0 44px #ffffff16; pointer-events:none; }
.cosmetic-card[data-cosmetic-motif="menta"] { --studio:#c9eadc; }
.cosmetic-card[data-cosmetic-motif="coral"] { --studio:#f3d6c7; }
.cosmetic-card[data-cosmetic-motif="lila"] { --studio:#e3d5f2; }
.cosmetic-card[data-cosmetic-motif="pizarra"] { --studio:#c8d4e3; }
.cosmetic-card-meta { display:flex; justify-content:space-between; align-items:baseline; gap:6px; padding:15px 8px 0; }
.cosmetic-card-meta strong { font-size:13px; letter-spacing:-.02em; }
.cosmetic-card-meta span { flex:none; font-size:10px; color:var(--muted); }
.cosmetic-card-description { margin:7px 8px 15px; font-size:11px; line-height:1.6; color:var(--muted); }
.cosmetic-card > button,.cosmetic-card > .tag { margin: auto 8px 0; align-self:start; }
.cosmetic-rarity-label { position:absolute; top:12px; left:12px; padding:4px 7px; border:1px solid #fff8; border-radius:6px; color:#526784; background:#ffffff90; font-size:8px; letter-spacing:.08em; text-transform:uppercase; font-weight:800; }
.cosmetic-rarity-epic { border-color:#d6c5f2; }
.cosmetic-rarity-epic .cosmetic-card-visual { background:radial-gradient(ellipse at 50% 100%,#4a3973,transparent 80%),#131a32; border-color:#ffffff0d; }
.cosmetic-rarity-epic .cosmetic-rarity-label { color:#e9d4ff; background:#ae70ec20; border-color:#b880ea44; }
.cosmetic-rarity-vip,.cosmetic-rarity-admin { border-color:#ddc792; background:linear-gradient(125deg,#fffdf8,#fff); }
.cosmetic-rarity-vip .cosmetic-card-visual,.cosmetic-rarity-admin .cosmetic-card-visual { background:radial-gradient(ellipse at 50% 0%,#4c3b4c,transparent 80%),#111727; border-color:#ffe3a522; }
.cosmetic-rarity-vip .cosmetic-rarity-label,.cosmetic-rarity-admin .cosmetic-rarity-label { color:#ffe0a2; background:#ecc17216; border-color:#ecd39944; }
.cosmetic-rarity-epic .cosmetic-card-visual::before,.cosmetic-rarity-vip .cosmetic-card-visual::before,.cosmetic-rarity-admin .cosmetic-card-visual::before { border-color:#ffffff16; box-shadow:0 0 0 22px #ffffff04,0 0 0 44px #ffffff03; }
.cosmetic-tier-vip .cosmetic-grid,.cosmetic-tier-admin .cosmetic-grid { grid-template-columns:minmax(0,580px); }
.cosmetic-tier-vip .cosmetic-card,.cosmetic-tier-admin .cosmetic-card { display:grid; grid-template-columns:1.1fr 1fr; column-gap:12px; padding-bottom:8px; }
.cosmetic-tier-vip .cosmetic-card-visual,.cosmetic-tier-admin .cosmetic-card-visual { grid-row:1 / 4; min-height:190px; }
.cosmetic-tier-vip .cosmetic-card-meta,.cosmetic-tier-admin .cosmetic-card-meta { flex-direction:column; align-items:start; gap:6px; }
.cosmetic-tier-vip .cosmetic-card > button,.cosmetic-tier-admin .cosmetic-card > button,.cosmetic-tier-vip .cosmetic-card > .tag,.cosmetic-tier-admin .cosmetic-card > .tag { align-self:end; margin-bottom:10px; }
.cosmetic-custom-offer { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:21px; border-radius:16px; border:1px solid #c8aef2; background:linear-gradient(110deg,#faf5ff,#edf0ff); }
.cosmetic-custom-offer strong { font-size:13px; }
.cosmetic-custom-offer p { margin:6px 0 0; max-width:570px; color:#574b76; font-size:11px; line-height:1.6; }
.cosmetic-custom-offer button { flex:none; }
.cosmetic-pending { padding:10px 12px; background:#fef3c7; border-radius:10px; font-size:11px; }
.cosmetic-admin-requests { margin-top:18px; }
.cosmetic-request-list { display:grid; gap:10px; }
.cosmetic-request { display:flex; justify-content:space-between; gap:14px; padding:14px; border:1px solid var(--line); border-radius:12px; }
.cosmetic-request p { white-space:pre-wrap; margin:5px 0 0; font-size:12px; color:var(--muted); }
.online-description { color:#64748b; font-style:italic; overflow-wrap:anywhere; }
.online-game { color:#6d28d9 !important; font-weight:800; }

/* Cada motivo mantiene su propio material y contraste en claro y oscuro. */
.cosmetic-chat-azul,.chat-azul { --cb1:#f6fcff; --cb2:#d7eafa; --cb-border:#9bc8e7; --cb-ink:#183e5d; --cb-light:#a9e3ff; --cb-pattern:conic-gradient(from 20deg at 100% 0%,transparent 0 65%,#369cce28 66% 74%,transparent 75%),linear-gradient(148deg,transparent 70%,#ffffffcc 71% 73%,transparent 74%); }
.cosmetic-chat-menta,.chat-menta { --cb1:#f3fff8; --cb2:#d3eddf; --cb-border:#84baa0; --cb-ink:#204c3c; --cb-light:#bbf1d2; --cb-pattern:radial-gradient(ellipse at 105% 10%,transparent 43%,#528c6b23 44% 47%,transparent 48% 53%,#528c6b16 54% 57%,transparent 58%); }
.cosmetic-chat-coral,.chat-coral { --cb1:#fff7ed; --cb2:#f7d1c3; --cb-border:#dda891; --cb-ink:#623c34; --cb-light:#ffddae; --cb-pattern:radial-gradient(circle at 96% 100%,#e9835440 0 19%,transparent 20% 27%,#e9835420 28% 31%,transparent 32% 38%,#e9835415 39% 41%,transparent 42%); }
.cosmetic-chat-lila,.chat-lila { --cb1:#fcf7ff; --cb2:#e4d4f2; --cb-border:#b29acb; --cb-ink:#503663; --cb-light:#f3d5ff; --cb-pattern:repeating-linear-gradient(125deg,transparent 0 16px,#9d73be0b 17px 18px); }
.cosmetic-chat-pizarra,.chat-pizarra { --cb1:#2b3a4c; --cb2:#172130; --cb-border:#64788e; --cb-ink:#ecf3fc; --cb-light:#b4c9df; --cb-pattern:repeating-linear-gradient(0deg,#d7e7ff08 0 1px,transparent 1px 5px),linear-gradient(130deg,transparent 65%,#b9d4ea0a 66%); }
.cosmetic-chat-aurora,.chat-aurora { --cb1:#132b39; --cb2:#282042; --cb-border:#659d9e; --cb-ink:#eafff7; --cb-light:#85f0da; --cb-pattern:radial-gradient(ellipse at 20% 110%,#48e1b45c,transparent 65%),radial-gradient(ellipse at 85% -30%,#b475eb70,transparent 65%); }
.cosmetic-chat-neon,.chat-neon { --cb1:#202039; --cb2:#111c2c; --cb-border:#af79e8; --cb-ink:#f3eaff; --cb-light:#80f1eb; --cb-pattern:linear-gradient(90deg,transparent 94%,#65eee920 95% 96%,transparent 97%),linear-gradient(0deg,transparent 94%,#a977e51a 95% 96%,transparent 97%); }
.cosmetic-chat-galaxia,.chat-galaxia { --cb1:#221c3b; --cb2:#121c33; --cb-border:#c6a76e; --cb-ink:#fff1d8; --cb-light:#edcb8e; --cb-pattern:radial-gradient(ellipse at 90% 100%,#9774d240,transparent 65%),radial-gradient(ellipse at 10% -40%,#365ba069,transparent 60%); }
.cosmetic-chat-admin,.chat-admin { --cb1:#fff9e6; --cb2:#ecd39e; --cb-border:#be9851; --cb-ink:#4c3614; --cb-light:#fff0bd; --cb-pattern:repeating-linear-gradient(115deg,transparent 0 5px,#aa813708 6px 7px),radial-gradient(ellipse at 100% 0%,#ba8a3250,transparent 65%); }
.cosmetic-chat-custom,.cosmetic-bubble-preview.custom-preview { --cb1:color-mix(in srgb,var(--cosmetic-primary,#244de1),#101522 72%); --cb2:color-mix(in srgb,var(--cosmetic-accent,#ffbd36),#101522 85%); --cb-border:var(--cosmetic-accent,#ffbd36); --cb-ink:#fff; --cb-light:var(--cosmetic-accent,#ffbd36); --cb-pattern:radial-gradient(ellipse at 100% 0%,color-mix(in srgb,var(--cosmetic-primary,#244de1),transparent 35%),transparent 70%); }
.cosmetic-bubble-preview { min-width:0; width:100%; max-width:260px; padding:13px 15px; border:1px solid #d4e1f0; border-radius:6px 17px 17px; background:#fff; color:#18304a; font-size:11px; line-height:1.65; }
.cosmetic-bubble-preview strong { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:10px; }
.cosmetic-bubble-preview strong small { opacity:.65; font-size:8px; font-weight:400; }
.cosmetic-bubble-preview span { display:block; margin-top:5px; }
html body .app-shell .chat-message[class*="cosmetic-chat-"] .chat-bubble,.cosmetic-bubble-preview[class*="chat-"],.cosmetic-bubble-preview.custom-preview {
  position:relative; isolation:isolate; overflow:hidden; color:var(--cb-ink); border-color:var(--cb-border); background:var(--cb-pattern),linear-gradient(130deg,var(--cb1),var(--cb2)); box-shadow:inset 0 1px #ffffff30,0 4px 15px #15273a16;
}
.chat-message[class*="cosmetic-chat-"] .chat-bubble > *,.cosmetic-bubble-preview > * { position:relative; z-index:1; }
html body .app-shell .chat-message[class*="cosmetic-chat-"] .chat-bubble p,html body .app-shell .chat-message[class*="cosmetic-chat-"] .chat-bubble header strong { color:var(--cb-ink); }
html body .app-shell .chat-message[class*="cosmetic-chat-"] .chat-bubble header time,html body .app-shell .chat-message[class*="cosmetic-chat-"] .chat-bubble header button { color:var(--cb-ink); opacity:.72; }
html body .app-shell .chat-message[class*="cosmetic-chat-"] .chat-bubble header span,html body .app-shell .chat-message[class*="cosmetic-chat-"] .mention { color:var(--cb-ink); background:color-mix(in srgb,var(--cb-ink),transparent 88%); }
.chat-message[class*="cosmetic-chat-"] .chat-bubble::after,.cosmetic-bubble-preview[class*="chat-"]::after,.cosmetic-bubble-preview.custom-preview::after { content:""; position:absolute; pointer-events:none; z-index:0; inset:-50% -70%; background:linear-gradient(115deg,transparent 42%,#fff2 49%,#fff4 50%,transparent 58%); transform:translateX(-70%); animation:cosmetic-sheen 9s ease-in-out infinite; }
.chat-message[class*="cosmetic-chat-"] .chat-bubble::before,.cosmetic-bubble-preview[class*="chat-"]::before,.cosmetic-bubble-preview.custom-preview::before { content:""; position:absolute; pointer-events:none; z-index:0; inset:0; border-radius:inherit; }
.cosmetic-chat-aurora .chat-bubble::before,.cosmetic-bubble-preview.chat-aurora::before,.cosmetic-chat-custom .chat-bubble::before,.cosmetic-bubble-preview.custom-preview::before { inset:-50%; background:radial-gradient(ellipse at 30% 70%,#74f7d825,transparent 45%),radial-gradient(ellipse at 80% 30%,#d19bff30,transparent 50%); animation:cosmetic-aurora 8s ease-in-out infinite alternate; }
.cosmetic-chat-neon .chat-bubble::before,.cosmetic-bubble-preview.chat-neon::before { border:1px solid #84f1ec88; box-shadow:inset 0 0 12px #54d9e222; animation:cosmetic-neon 3.6s ease-in-out infinite; }
.cosmetic-chat-neon .chat-bubble::after,.cosmetic-bubble-preview.chat-neon::after { background:linear-gradient(110deg,transparent 47%,#98f6f21f 49%,#a0fff855 50%,transparent 52%); animation-duration:5s; }
.cosmetic-chat-galaxia .chat-bubble::before,.cosmetic-bubble-preview.chat-galaxia::before { background:radial-gradient(circle at 12% 18%,#fff4c7 0 1px,transparent 1.7px),radial-gradient(circle at 85% 23%,#fff4c7 0 1.3px,transparent 2px),radial-gradient(circle at 60% 83%,#f2d2ff 0 1px,transparent 1.8px),radial-gradient(circle at 95% 72%,#fff4c7 0 1px,transparent 2px),radial-gradient(ellipse at 95% 110%,transparent 40%,#d6b76e33 41% 41.6%,transparent 42%); animation:cosmetic-starlight 4.5s ease-in-out infinite alternate; }
.cosmetic-chat-galaxia .chat-bubble::after,.cosmetic-bubble-preview.chat-galaxia::after { background:radial-gradient(ellipse at center,#bd8eff20,transparent 60%),linear-gradient(115deg,transparent 46%,#f7d69e28 50%,transparent 55%); animation-duration:7s; }
.cosmetic-chat-admin .chat-bubble::before,.cosmetic-bubble-preview.chat-admin::before { inset:4px; border:1px solid #99712233; border-radius:inherit; }
.cosmetic-chat-admin .chat-bubble::after,.cosmetic-bubble-preview.chat-admin::after { background:linear-gradient(115deg,transparent 43%,#fff5cb66 50%,transparent 58%); animation-duration:6s; }
@keyframes cosmetic-sheen { 0%,48% { transform:translateX(-70%); } 78%,100% { transform:translateX(70%); } }
@keyframes cosmetic-aurora { from { transform:translate(-8%,-4%) rotate(-8deg); opacity:.45; } to { transform:translate(8%,4%) rotate(8deg); opacity:1; } }
@keyframes cosmetic-neon { 0%,100% { opacity:.35; } 50% { opacity:1; } }
@keyframes cosmetic-starlight { 0% { opacity:.35; transform:translateY(-1px); } 100% { opacity:1; transform:translateY(1px); } }

/* Marcos vectoriales: jamás se aplica un filtro o una rotación a la fotografía. */
.cosmetic-frame-preview { --frame-border:#78b9df; --frame-outer:#d5f0ff; display:grid; place-items:center; position:relative; flex:none; width:58px; height:58px; border-radius:17px; color:#fff; font-size:18px; font-weight:800; background:linear-gradient(145deg,#647b9c,#263e61); }
.cosmetic-card-visual .cosmetic-frame-preview { width:68px; height:68px; font-size:22px; }
.avatar[class*="cosmetic-frame-"],.cosmetic-frame-preview[class*="frame-"],.cosmetic-frame-preview.custom-preview { position:relative; border:2px solid color-mix(in srgb,var(--frame-border),transparent 20%); box-shadow:0 0 0 2px #ffffff66,0 6px 20px #17223c26; overflow:visible; }
.avatar[class*="cosmetic-frame-"] img,.cosmetic-frame-preview img { width:100%; height:100%; object-fit:cover; border-radius:inherit; }
.cosmetic-frame-art { position:absolute; z-index:2; inset:-18%; width:136%; height:136%; overflow:visible; fill:none; stroke:var(--frame-border); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
.frame-track { stroke-width:1; opacity:.8; }
.frame-accent { stroke:var(--frame-outer); stroke-width:2; }
.frame-facet,.frame-fill { fill:var(--frame-border); stroke:var(--frame-outer); stroke-width:.7; }
.frame-gem { fill:var(--frame-border); stroke:var(--frame-outer); stroke-width:1.2; }
.frame-spark { fill:var(--frame-outer); stroke:none; }
.frame-mote { fill:var(--frame-outer); stroke:none; }
.frame-ribbon { stroke:var(--frame-border); stroke-width:2.5; }
.frame-orbit-line { stroke:var(--frame-outer); stroke-width:.8; opacity:.7; }
.frame-orbit { transform-origin:50px 50px; animation:cosmetic-orbit 12s linear infinite; }
.frame-orbit-reverse { animation-direction:reverse; animation-duration:9s; }
.frame-spark-a { animation:cosmetic-twinkle 4s ease-in-out infinite; }
.frame-spark-b { animation:cosmetic-twinkle 4s ease-in-out -2s infinite; }
.frame-leaves { transform-origin:50px 90px; animation:cosmetic-leaves 7s ease-in-out infinite; }
.frame-rays { transform-origin:50px 50px; animation:cosmetic-sun 16s ease-in-out infinite; }
.frame-dashes { stroke-dasharray:12 14; animation:cosmetic-circuit 8s linear infinite; }
.frame-laurel { stroke-width:1.5; stroke:var(--frame-outer); }
.frame-crown { fill:#c59b48; stroke:#fff0ba; stroke-width:1.6; }
.frame-crown-jewel { fill:#fcf2d1; stroke:none; animation:cosmetic-twinkle 3s ease-in-out infinite; }
.avatar.cosmetic-frame-azul,.frame-azul { --frame-border:#489bc9; --frame-outer:#d5f4ff; }
.avatar.cosmetic-frame-menta,.frame-menta { --frame-border:#469d7b; --frame-outer:#c3f9d4; border-radius:50%; }
.avatar.cosmetic-frame-coral,.frame-coral { --frame-border:#d88b5d; --frame-outer:#ffd8ac; border-radius:50%; }
.avatar.cosmetic-frame-lila,.frame-lila { --frame-border:#a076c5; --frame-outer:#ecd6ff; }
.avatar.cosmetic-frame-pizarra,.frame-pizarra { --frame-border:#68809d; --frame-outer:#d6e4f1; border-radius:24%; }
.avatar.cosmetic-frame-aurora,.frame-aurora { --frame-border:#60d8be; --frame-outer:#caa7ff; border-radius:50%; }
.avatar.cosmetic-frame-neon,.frame-neon { --frame-border:#cc8aff; --frame-outer:#88fff0; }
.avatar.cosmetic-frame-galaxia,.frame-galaxia { --frame-border:#cbaa65; --frame-outer:#ffe4a5; border-radius:50%; }
.avatar.cosmetic-frame-admin,.frame-admin { --frame-border:#c89a42; --frame-outer:#fff0b9; border-radius:50%; }
.avatar.cosmetic-frame-custom,.cosmetic-frame-preview.custom-preview { --frame-border:var(--cosmetic-primary,#244de1); --frame-outer:var(--cosmetic-accent,#ffbd36); border-radius:50%; }
.cosmetic-frame-aurora .cosmetic-frame-art,.frame-aurora .cosmetic-frame-art { filter:drop-shadow(0 0 3px #6effcf55); }
.cosmetic-frame-neon .cosmetic-frame-art,.frame-neon .cosmetic-frame-art { filter:drop-shadow(0 0 3px #c58aff80); }
.cosmetic-frame-neon .frame-accent,.frame-neon .frame-accent { animation:cosmetic-neon 3.6s ease-in-out infinite; }
.cosmetic-frame-pizarra .frame-accent,.frame-pizarra .frame-accent { animation:cosmetic-neon 6s ease-in-out infinite; }
.cosmetic-frame-galaxia .cosmetic-frame-art,.frame-galaxia .cosmetic-frame-art { filter:drop-shadow(0 0 3px #e6c37166); }
.cosmetic-frame-galaxia .frame-orbit,.frame-galaxia .frame-orbit { animation-duration:20s; }
.cosmetic-frame-admin .cosmetic-frame-art,.frame-admin .cosmetic-frame-art { filter:drop-shadow(0 1px 1px #644a3866); }
@keyframes cosmetic-orbit { to { transform:rotate(360deg); } }
@keyframes cosmetic-twinkle { 0%,100% { opacity:.35; } 50% { opacity:1; } }
@keyframes cosmetic-leaves { 0%,100% { transform:rotate(-2deg); } 50% { transform:rotate(2deg); } }
@keyframes cosmetic-sun { 0%,100% { transform:rotate(-8deg); } 50% { transform:rotate(8deg); } }
@keyframes cosmetic-circuit { to { stroke-dashoffset:-104; } }
html.theme-dark .cosmetic-card,html.theme-dark .cosmetics-market,html.theme-dark .cosmetic-admin-requests { background:#182338; }
html.theme-dark .cosmetic-card { border-color:#35435b; }
html.theme-dark .cosmetic-card-visual,html.theme-dark .cosmetic-profile-preview { background:radial-gradient(ellipse at top,#344661,#1c293f); border-color:#43536d; }
html.theme-dark .cosmetic-rarity-label { background:#ffffff12; border-color:#ffffff18; color:#c9d8ec; }
html.theme-dark .cosmetic-rarity-vip,html.theme-dark .cosmetic-rarity-admin { border-color:#6c5941; }
html.theme-dark .cosmetic-rarity-epic { border-color:#624a87; }
html.theme-dark .cosmetic-rarity-epic .cosmetic-card-visual { background:radial-gradient(ellipse at bottom,#423166,#111629); }
html.theme-dark .cosmetic-rarity-vip .cosmetic-card-visual,html.theme-dark .cosmetic-rarity-admin .cosmetic-card-visual { background:radial-gradient(ellipse at top,#463548,#101626); }
html.theme-dark .cosmetic-custom-offer { background:#29213e; }
html.theme-dark .cosmetic-custom-offer p { color:#d9c9eb; }
@media (max-width:650px) {
  .cosmetic-grid { grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); }
  .cosmetics-market .card-head { align-items:flex-start; }
  .cosmetic-custom-offer,.cosmetic-request { flex-direction:column; align-items:stretch; }
  .cosmetic-profile-preview { gap:23px; padding:24px 18px; }
  .cosmetic-profile-preview .cosmetic-bubble-preview { flex:1; }
  .cosmetic-tier-vip .cosmetic-card,.cosmetic-tier-admin .cosmetic-card { display:flex; padding-bottom:15px; }
  .cosmetic-tier-vip .cosmetic-card-visual,.cosmetic-tier-admin .cosmetic-card-visual { min-height:180px; }
  .cosmetic-tier-vip .cosmetic-card > button,.cosmetic-tier-admin .cosmetic-card > button { align-self:start; margin-bottom:0; }
}
@media (prefers-reduced-motion:reduce) {
  .cosmetic-frame-art *,.chat-message[class*="cosmetic-chat-"] .chat-bubble::before,.chat-message[class*="cosmetic-chat-"] .chat-bubble::after,.cosmetic-bubble-preview::before,.cosmetic-bubble-preview::after { animation:none !important; }
  .cosmetic-card { transition:none; }
  .cosmetic-card:hover { transform:none; }
}