/* QuestPick 5.2: Cinematic x Neon atmosphere (presentation only).
   The UI remains accessible and fully functional without image assets. */
:root{--pn-cine:#c972f1;--pn-cine-2:#c389f3;--pn-art-strength:1}
body[data-pn-atmo="subtle"]{--pn-art-strength:.48}
body[data-pn-atmo="off"]{--pn-art-strength:0}
body[data-pn-scene="trophies"]{--pn-cine:#ecc97e;--pn-cine-2:#d188f3}
body[data-pn-scene="vault"]{--pn-cine:#e0aef7;--pn-cine-2:#e07ad9}
body[data-pn-scene="stats"]{--pn-cine:#cc7df0;--pn-cine-2:#ab6dde}
body[data-pn-scene="profile"]{--pn-cine:#d695f4;--pn-cine-2:#ba82f5}
body[data-pn-atmo]:not([data-pn-atmo="off"]){
  background:radial-gradient(ellipse 62vw 480px at 94% 0%,rgba(102,41,130,.23),transparent 74%),
             radial-gradient(ellipse 60vw 600px at 8% 100%,rgba(74,17,101,.15),transparent 70%),
             #15081b;
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .main {background:transparent}
/* Highly legible scene banner: static, on-device .webp artwork. */
body[data-pn-atmo]:not([data-pn-atmo="off"]) .topline{
 position:relative;isolation:isolate;overflow:hidden;min-width:0;
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .topline::before{
 position:absolute;inset:0;content:"";z-index:0;pointer-events:none;opacity:var(--pn-art-strength);
 background-image:linear-gradient(90deg,rgba(22,7,29,.96) 0%,rgba(25,8,33,.82) 45%,rgba(23,8,31,.41) 100%),
                  url("./assets/atmosphere/vista.webp");
 background-size:cover,cover;background-position:center,73% 47%;
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .topline>*{position:relative;z-index:1}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="trophies"] .topline::before{
 background-image:linear-gradient(90deg,rgba(20,9,25,.97),rgba(22,9,27,.48)),url("./assets/atmosphere/hall.webp");
 background-position:center,78% center;
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="vault"] .topline::before{
 background-image:linear-gradient(90deg,rgba(22,9,27,.97),rgba(20,10,29,.44)),url("./assets/atmosphere/memories.webp");
 background-position:center,72% center;
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="stats"] .topline::before,
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="cloud"] .topline::before{
 background-image:linear-gradient(90deg,rgba(21,5,28,.96),rgba(28,8,37,.58)),url("./assets/atmosphere/gate.webp");
 background-position:center,77% center;
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="challenge"] .topline::before{
 background-image:linear-gradient(90deg,rgba(23,6,30,.97),rgba(26,9,35,.53)),url("./assets/atmosphere/gate.webp");
 background-position:center,69% center;
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="journey"] .topline::before{
 background-image:linear-gradient(90deg,rgba(23,9,30,.97),rgba(27,8,36,.55)),url("./assets/atmosphere/vista.webp");
}
/* Scenic banners use local images only where they add context. */
body[data-pn-atmo]:not([data-pn-atmo="off"]):is([data-pn-scene="trophies"],[data-pn-scene="vault"],[data-pn-scene="stats"],[data-pn-scene="journey"]) .topline{
 min-height:173px;display:flex;align-items:center;padding:26px 28px;border:1px solid rgba(205,125,242,.3);
 border-radius:22px;background:#281034;box-shadow:0 14px 42px rgba(12,2,16,.31),inset 0 1px rgba(255,255,255,.08);
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="trophies"] .topline{border-color:rgba(248,205,117,.38)}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="vault"] .topline{border-color:rgba(198,141,254,.33)}
/* The hub/challenge already have dominant hero artwork: keep the upper headings quiet. */
body[data-pn-atmo]:not([data-pn-atmo="off"]):is([data-pn-scene="hub"],[data-pn-scene="challenge"],[data-pn-scene="library"],[data-pn-scene="profile"],[data-pn-scene="tools"],[data-pn-scene="audit"]) .topline::before{display:none}
/* Primary story / challenge art. Text controls stay on top of imagery. */
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-hero{isolation:isolate;background:linear-gradient(130deg,#331142,#220b2d)!important;border-color:rgba(208,133,243,.62)}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-hero::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 opacity:var(--pn-art-strength);border-radius:inherit;
 background-image:linear-gradient(90deg,rgba(28,10,37,.99) 0%,rgba(31,10,41,.92) 45%,rgba(27,8,35,.52) 100%),url("./assets/atmosphere/vista.webp");
 background-position:center,73% center;background-size:cover;
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="challenge"] .xp-hero::before{
 background-image:linear-gradient(90deg,rgba(24,8,32,.99),rgba(26,9,34,.92) 42%,rgba(23,7,30,.53)),url("./assets/atmosphere/gate.webp");
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-hero > *{position:relative;z-index:1}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-hero .xp-hero-glow{z-index:0}
/* Candidate cards stay cover-focused, with rare neon depth. */
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="challenge"] .xp-candidate{
 border-color:rgba(209,134,243,.33);box-shadow:0 10px 35px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.06);
 background:linear-gradient(150deg,rgba(54,24,68,.96),rgba(31,10,40,.96));
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="challenge"] .xp-candidate:nth-child(2){border-color:rgba(198,106,240,.45)}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="challenge"] .xp-candidate:nth-child(3){border-color:rgba(196,124,239,.42)}
/* Game Journey header: scenic image with optional blurred actual game art. */
body[data-pn-atmo]:not([data-pn-atmo="off"]) .pj2-hero{
 background:linear-gradient(125deg,#39154a,#260d31)!important;border-color:rgba(198,107,240,.55);
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .pj2-hero::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 border-radius:inherit;opacity:var(--pn-art-strength);
 background-image:linear-gradient(90deg,rgba(27,10,35,.99) 0%,rgba(26,10,34,.85) 48%,rgba(23,9,30,.44) 100%),url("./assets/atmosphere/vista.webp");
 background-size:cover;background-position:center,75% center;
}
body[data-pn-atmo="cinematic"] .pj2-hero[data-pn-cover-art]::before,
body[data-pn-atmo="subtle"] .pj2-hero[data-pn-cover-art]::before{
 background-image:linear-gradient(90deg,rgba(22,7,29,.99),rgba(24,9,32,.77),rgba(23,8,30,.53)),var(--pn-cover-art);
 background-size:cover;background-position:center;
 filter:saturate(1.22) blur(7px);transform:scale(1.08);
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .pj2-hero>*,
body[data-pn-atmo]:not([data-pn-atmo="off"]) .pj2-hero::after{z-index:1}
/* Hall and personal memories carry their own color language. */
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="trophies"] .xp-hall-links{
 position:relative;isolation:isolate;overflow:hidden;border-color:rgba(240,192,112,.4);
 background:linear-gradient(128deg,#341b3f,#2a1335)!important;
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="trophies"] .xp-hall-links::before{
 content:"";position:absolute;inset:0;pointer-events:none;opacity:var(--pn-art-strength);
 background-image:linear-gradient(90deg,rgba(23,11,28,.97),rgba(25,12,31,.59)),url("./assets/atmosphere/hall.webp");
 background-size:cover;background-position:73% center;z-index:0;
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-hall-links>*{position:relative;z-index:1}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="vault"] .xp-vault-nav{
 border-color:rgba(184,133,243,.37);background:linear-gradient(120deg,rgba(52,27,64,.9),rgba(44,16,56,.98));
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="vault"] .xp-memory{
 border-color:rgba(202,153,242,.37);box-shadow:0 7px 25px rgba(25,8,40,.24);
}
/* Library stays readable; no large images behind cover grids. */
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-library-banner{
 position:relative;isolation:isolate;overflow:hidden;border-color:rgba(201,116,241,.42);
 background:linear-gradient(110deg,#2c1039,#280e33)!important;
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-library-banner::before{
 content:"";position:absolute;inset:0;z-index:0;opacity:calc(var(--pn-art-strength) * .47);pointer-events:none;
 background-image:linear-gradient(90deg,rgba(28,10,37,.97),rgba(29,10,38,.83)),url("./assets/atmosphere/vista.webp");
 background-size:cover;background-position:80% center;
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-library-banner>*{position:relative;z-index:1}
/* Low-noise tech panels for stats; restrained profile & tools. */
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="stats"] .xp-stat{
 box-shadow:0 12px 32px rgba(28,6,39,.3),inset 0 1px rgba(228,186,247,.07);
 border-color:rgba(202,118,241,.35);
}
body[data-pn-atmo]:not([data-pn-atmo="off"])[data-pn-scene="stats"] .xp-analytics-special .xp-quick{
 background:radial-gradient(ellipse at 95% 0%,rgba(142,52,184,.21),transparent 71%),linear-gradient(145deg,#3a174b,#281033);
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .pn51-profile-card{
 background:radial-gradient(ellipse at 100% 0%,rgba(155,78,191,.25),transparent 64%),linear-gradient(145deg,#401a51,#2c1038);
}
/* Keep all forms and ordinary panels easy to read, even on top of scenery. */
body[data-pn-atmo]:not([data-pn-atmo="off"]) .topline .subtitle,
body[data-pn-atmo]:not([data-pn-atmo="off"]) .pj2-hero-copy p{color:#ddc3e9}
/* User setting in Profile (localStorage only, never changes library state). */
.pn-cine-settings{display:grid;gap:13px;padding:18px;margin-top:14px;background:linear-gradient(140deg,#331341,#2c1039);border:1px solid rgba(199,113,239,.38);border-radius:17px}
.pn-cine-title{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:800;color:#f4e3fc}
.pn-cine-title svg{width:21px;height:21px;color:#d187f3}
.pn-cine-settings label{display:grid;gap:8px;font-size:12px;font-weight:750;color:#d8bbe5}
.pn-cine-settings select{width:100%;min-height:45px;font-size:16px!important;background:#290c36;color:#f4e3fc;border:1px solid #9e58be;border-radius:12px;padding:10px}
.pn-cine-settings small{font-size:11px;line-height:1.5;color:#c29dd4}
@media(max-width:740px){
 body[data-pn-atmo]:not([data-pn-atmo="off"]):is([data-pn-scene="trophies"],[data-pn-scene="vault"],[data-pn-scene="stats"],[data-pn-scene="journey"]) .topline{min-height:156px;padding:18px 17px;border-radius:18px;margin-bottom:17px}
 body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-hero::before{background-position:center,78% center}
 body[data-pn-atmo]:not([data-pn-atmo="off"]) .pj2-hero::before{background-position:center,76% center}
 body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-library-banner::before{background-position:center,74% center}
 .pn-cine-settings{padding:15px}
}
@media(prefers-reduced-motion:reduce){body[data-pn-atmo] .xp-hero::before,body[data-pn-atmo] .pj2-hero::before{animation:none!important;transition:none!important}}
@media(prefers-contrast:more){body[data-pn-atmo] .topline::before,body[data-pn-atmo] .xp-hero::before,body[data-pn-atmo] .pj2-hero::before{filter:brightness(.55)}}

/* A welcoming atmosphere for completely new collections, without injecting sample games. */
body[data-pn-atmo]:not([data-pn-atmo="off"]) .pn51-onboard{
 position:relative;isolation:isolate;overflow:hidden;min-height:290px;
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 border-color:rgba(199,111,240,.48);
 background:linear-gradient(145deg,#2f123d,#240c2f)!important;
 box-shadow:0 15px 40px rgba(15,2,21,.34),inset 0 1px rgba(255,255,255,.09);
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .pn51-onboard::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 opacity:var(--pn-art-strength);
 background-image:linear-gradient(0deg,rgba(25,8,33,.93),rgba(26,8,34,.64) 50%,rgba(25,8,32,.4)),url("./assets/atmosphere/vista.webp");
 background-size:cover;background-position:center,80% center;
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .pn51-onboard>*{position:relative;z-index:1}
/* A game detail is the game's own cinematic page. Keep foreground copy fully legible. */
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-detail-root .xp-game-head{
 position:relative;isolation:isolate;overflow:hidden;min-width:0;
 padding:16px;border:1px solid rgba(201,114,241,.32);border-radius:17px;
 background:linear-gradient(115deg,#30133e,#281033);margin-top:9px;
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-detail-root .xp-game-head::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 opacity:var(--pn-art-strength);
 background-image:linear-gradient(90deg,rgba(31,11,40,.98),rgba(32,11,41,.76) 52%,rgba(26,8,34,.58)),url("./assets/atmosphere/vista.webp");
 background-size:cover;background-position:center,76% center;
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-detail-root .xp-game-head[data-pn-cover-art]::before{
 background-image:linear-gradient(90deg,rgba(29,11,37,.97),rgba(27,10,35,.81) 52%,rgba(22,7,29,.62)),var(--pn-cover-art);
 filter:blur(6px) saturate(1.18);transform:scale(1.08);
}
body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-detail-root .xp-game-head>*{position:relative;z-index:1;min-width:0}
@media(max-width:740px){
 body[data-pn-atmo]:not([data-pn-atmo="off"]) .pn51-onboard{min-height:270px}
 body[data-pn-atmo]:not([data-pn-atmo="off"]) .xp-detail-root .xp-game-head{padding:12px}
}