#view-profile.has-player-profile-background, #view-public-profile.has-player-profile-background { position: relative; isolation: isolate; }
.player-profile-background { display: none; }
.has-player-profile-background > .player-profile-background { display: none; }
.has-player-profile-background > :not(.player-profile-background) { position: relative; z-index: 1; }
body.has-player-profile-background-page { background: #05061b; }
.global-player-profile-background { display: none; }
body.has-player-profile-background-page > .global-player-profile-background { position: fixed; inset: 0; z-index: 0; display: block; pointer-events: none; background-color: #05061b; background-image: linear-gradient(rgba(4, 6, 27, var(--player-profile-overlay, .52)), rgba(4, 6, 27, .68)), var(--player-profile-background); background-position: center; background-repeat: no-repeat; background-size: cover; }
body.has-player-profile-background-page > .app-header, body.has-player-profile-background-page > .app-content, body.has-player-profile-background-page > .mobile-dock { position: relative; z-index: 1; }
.has-player-profile-background .glass-card { border-color: color-mix(in srgb, var(--player-profile-glow) 32%, rgba(112, 126, 195, .3)); background-color: rgba(7, 8, 35, .8); box-shadow: 0 16px 44px rgba(0,0,20,.34), 0 0 22px color-mix(in srgb, var(--player-profile-secondary) 12%, transparent); backdrop-filter: blur(14px); }
.profile-background-shop { padding: clamp(20px, 3vw, 30px); }
.profile-background-shop__heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.profile-background-shop__heading h2 { margin: 3px 0 6px; color: #fff; font: 900 clamp(1.4rem, 3vw, 2rem)/1.1 "Bungee", sans-serif; }
.profile-background-shop__heading p:last-child { margin: 0; color: #aeb8dc; font-weight: 750; }
.profile-background-shop__wallet { min-width: 110px; padding: 11px 14px; border: 1px solid rgba(255, 209, 83, .35); border-radius: 15px; background: rgba(79, 53, 9, .24); text-align: center; }
.profile-background-shop__wallet small { display: block; color: #b7bdda; font-size: .62rem; font-weight: 950; text-transform: uppercase; }
.profile-background-shop__wallet strong { display: block; margin-top: 3px; color: #ffd45d; font: 900 1.2rem/1 "Bungee", sans-serif; }
.profile-background-shop__grid { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(270px, 38%); grid-template-columns: none; gap: 14px; margin-top: 18px; padding: 3px 2px 12px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scrollbar-color: #6ce8ff rgba(9, 10, 42, .6); }
.profile-background-item { overflow: hidden; border: 1px solid rgba(119, 137, 205, .32); border-radius: 18px; background: rgba(7, 9, 38, .72); }
.profile-background-item { scroll-snap-align: start; }
.profile-background-item.is-equipped { border-color: rgba(255, 210, 91, .76); box-shadow: 0 0 24px rgba(255, 196, 65, .18); }
.profile-background-item > img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.profile-background-item > div { padding: 14px 15px 10px; }
.profile-background-item small { color: #6fe9ff; font-size: .6rem; font-weight: 1000; letter-spacing: .08em; }
.profile-background-item h3 { margin: 4px 0 6px; color: #fff; font: 900 1rem/1.15 "Bungee", sans-serif; }
.profile-background-item p { margin: 0; color: #aeb9dc; font-size: .76rem; font-weight: 750; line-height: 1.4; }
.profile-background-item footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 15px 15px; }
.profile-background-item footer span { color: #ccd3ef; font-size: .72rem; font-weight: 900; }
.profile-background-item footer strong { color: #ffd363; font: 900 .95rem/1 "Bungee", sans-serif; }
.profile-background-item footer button { min-width: 92px; min-height: 38px; padding: 8px 12px; border: 1px solid rgba(92, 228, 255, .55); border-radius: 11px; color: #071025; background: linear-gradient(135deg, #6deaff, #ff77bd); font-weight: 1000; cursor: pointer; }
.profile-background-item footer button:disabled { color: #fff0b5; border-color: rgba(255, 210, 91, .5); background: rgba(86, 56, 8, .52); cursor: default; }
.profile-background-shop__status { margin: 16px 0 0; color: #b8c4e7; font-size: .78rem; font-weight: 800; }
.ticket-booth-shelf-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 22px; padding: 6px; border: 1px solid rgba(101, 131, 205, .28); border-radius: 16px; background: rgba(5, 7, 31, .62); }
.ticket-booth-shelf-tabs button { min-height: 48px; padding: 10px 14px; border: 1px solid transparent; border-radius: 12px; color: #aeb9dc; background: transparent; font: 900 .78rem/1.2 "Bungee", sans-serif; cursor: pointer; }
.ticket-booth-shelf-tabs button.is-active { color: #091025; border-color: rgba(255,255,255,.48); background: linear-gradient(135deg, #68e8ff, #ff79bd); box-shadow: 0 0 22px rgba(91, 222, 255, .2); }
.ticket-booth-portrait-shelf { margin-top: 18px; }
.ticket-booth-portrait-carousel { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(190px, 27%); grid-template-columns: none; gap: 13px; padding: 3px 2px 12px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scrollbar-color: #ff7fc4 rgba(9, 10, 42, .6); }
.ticket-booth-portrait-carousel button, .ticket-booth-portrait-carousel article { display: grid; gap: 10px; min-width: 0; padding: 10px; border: 1px solid rgba(124, 140, 205, .34); border-radius: 17px; color: #fff; background: rgba(7, 9, 38, .78); text-align: left; scroll-snap-align: start; }
.ticket-booth-portrait-carousel button { cursor: pointer; }
.ticket-booth-portrait-carousel button:hover { border-color: rgba(255, 116, 190, .72); transform: translateY(-2px); }
.ticket-booth-portrait-carousel button.is-selected { border-color: #ffd263; box-shadow: 0 0 20px rgba(255, 202, 74, .2); }
.ticket-booth-portrait-carousel img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 13px; }
.ticket-booth-portrait-carousel button > span, .ticket-booth-portrait-carousel article > span { display: grid; gap: 3px; }
.ticket-booth-portrait-carousel small { color: #91eaff; font-size: .64rem; font-weight: 850; }
.ticket-booth-portrait-carousel b { justify-self: start; padding: 6px 9px; border-radius: 999px; color: #09102b; background: #72eaff; font-size: .63rem; }
.ticket-booth-portrait-shelf > p { margin: 8px 2px 0; color: #aeb9dc; font-size: .72rem; font-weight: 800; }
.profile-background-collection { margin-top: 18px; padding: clamp(20px, 3vw, 30px); }
.profile-background-collection > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.profile-background-collection h2 { margin: 3px 0 6px; color: #fff; font: 900 clamp(1.35rem, 3vw, 1.9rem)/1.1 "Bungee", sans-serif; }
.profile-background-collection header p:last-child { margin: 0; color: #aeb8dc; font-weight: 750; }
.profile-background-collection header > span { padding: 8px 12px; border: 1px solid rgba(91, 228, 255, .42); border-radius: 999px; color: #86eeff; background: rgba(20, 90, 114, .26); font-size: .7rem; font-weight: 1000; }
.profile-background-picker-grid, .profile-editor-background-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 20px; }
.profile-background-picker-grid button, .profile-background-picker-grid article, .profile-editor-background-grid button { overflow: hidden; padding: 0; border: 1px solid rgba(124, 140, 205, .34); border-radius: 15px; color: #fff; background: rgba(7, 9, 38, .8); text-align: left; }
.profile-background-picker-grid button, .profile-editor-background-grid button { cursor: pointer; }
.profile-background-picker-grid button:hover, .profile-editor-background-grid button:hover { border-color: rgba(84, 225, 255, .72); }
.profile-background-picker-grid button.is-selected, .profile-background-picker-grid article.is-selected, .profile-editor-background-grid button.is-selected { border-color: #ffd263; box-shadow: 0 0 20px rgba(255, 202, 74, .2); }
.profile-background-picker-grid img, .profile-editor-background-grid img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.profile-background-picker-grid button > span, .profile-background-picker-grid article > span, .profile-editor-background-grid button > span { display: grid; gap: 3px; padding: 10px 12px; }
.profile-background-picker-grid article.is-locked { opacity: .58; filter: saturate(.45); }
.profile-background-picker-grid small, .profile-editor-background-grid small { color: #96eaff; font-size: .65rem; font-weight: 850; }
.profile-background-picker-status, .profile-editor-backgrounds > p { margin: 12px 0 0; color: #aeb9dc; font-size: .72rem; font-weight: 800; }
.profile-background-empty { grid-column: 1 / -1; margin: 0; padding: 16px; border: 1px dashed rgba(110, 129, 199, .35); border-radius: 13px; color: #aeb9dc; }
.profile-editor-backgrounds { min-width: 0; margin: 4px 0 2px; padding: 14px; border: 1px solid rgba(91, 226, 255, .28); border-radius: 16px; background: rgba(7, 10, 38, .58); }
.profile-editor-backgrounds legend { padding: 0 7px; color: #fff; font: 900 .78rem/1 "Bungee", sans-serif; }
.profile-editor-backgrounds > small { display: block; margin: 0 0 11px; color: #9eabd5; font-size: .68rem; line-height: 1.35; }
.profile-editor-background-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 10px; }
@media (max-width: 700px) { .profile-background-shop__heading { align-items: flex-start; flex-direction: column; } .profile-background-shop__grid { grid-auto-columns: minmax(245px, 82%); } .ticket-booth-portrait-carousel { grid-auto-columns: minmax(180px, 68%); } }
@media (max-width: 700px) { .profile-background-collection > header { align-items: flex-start; flex-direction: column; } .profile-background-picker-grid { grid-template-columns: 1fr; } }