.ca-type-scene{--ca-accent:#94a3b8;--ca-light:#f1f5f9;position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(125deg,var(--ca-light),#fff 65%);border:1px solid color-mix(in srgb,var(--ca-accent) 35%,white);}
.ca-type-scene::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(90deg,rgba(255,255,255,.68),rgba(255,255,255,.82)),var(--ca-scene-image,none);background-size:cover;background-position:center;}
.ca-type-scene::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 10% 20%,color-mix(in srgb,var(--ca-accent) 24%,transparent),transparent 55%)}
.ca-type-scene .atlas-image-wrap{background:rgba(255,255,255,.26);backdrop-filter:blur(4px);border-color:rgba(255,255,255,.65)}
.ca-type-scene .atlas-info{padding:18px;border-radius:20px;background:rgba(255,255,255,.83);backdrop-filter:blur(12px);box-shadow:0 8px 35px rgba(15,23,42,.07)}
.ca-type-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:16px 0}.ca-type-label{font-size:.73rem;font-weight:800;letter-spacing:.12em;color:#64748b;margin-right:3px}
.ca-type{--type:#777;display:inline-flex;align-items:center;justify-content:center;padding:5px 15px;min-width:88px;min-height:31px;border:2px solid #1e293b;border-radius:100px;color:white;background:linear-gradient(180deg,color-mix(in srgb,var(--type) 72%,white),var(--type) 56%,color-mix(in srgb,var(--type) 70%,black));box-shadow:inset 0 2px 1px rgba(255,255,255,.7),inset 0 -2px 2px rgba(0,0,0,.22),0 2px 3px rgba(0,0,0,.12);font:900 .78rem/1 system-ui,sans-serif;letter-spacing:.11em;text-shadow:0 1px 2px rgba(0,0,0,.65)}
.ca-type-bug,.ca-scene-bug{--type:#8c9d25;--ca-accent:#8c9d25;--ca-light:#eff5ce}.ca-type-dark,.ca-scene-dark{--type:#55473f;--ca-accent:#55473f;--ca-light:#e5e0dc}.ca-type-dragon,.ca-scene-dragon{--type:#6955bb;--ca-accent:#6955bb;--ca-light:#ece7ff}.ca-type-electric,.ca-scene-electric{--type:#e9b82f;--ca-accent:#e9b82f;--ca-light:#fff4bd}.ca-type-fairy,.ca-scene-fairy{--type:#d783c2;--ca-accent:#d783c2;--ca-light:#fce6f8}.ca-type-fighting,.ca-scene-fighting{--type:#ad563b;--ca-accent:#ad563b;--ca-light:#f8e2d9}.ca-type-fire,.ca-scene-fire{--type:#e45427;--ca-accent:#e45427;--ca-light:#ffe6d6}.ca-type-flying,.ca-scene-flying{--type:#8da9dc;--ca-accent:#8da9dc;--ca-light:#e8f2ff}.ca-type-ghost,.ca-scene-ghost{--type:#665c9d;--ca-accent:#665c9d;--ca-light:#e8e4ff}.ca-type-grass,.ca-scene-grass{--type:#5d9f45;--ca-accent:#5d9f45;--ca-light:#e3f4dc}.ca-type-ground,.ca-scene-ground{--type:#c7a05b;--ca-accent:#c7a05b;--ca-light:#f6edd5}.ca-type-ice,.ca-scene-ice{--type:#69c4d9;--ca-accent:#69c4d9;--ca-light:#e0f8ff}.ca-type-normal,.ca-scene-normal{--type:#9c968e;--ca-accent:#9c968e;--ca-light:#f0eeeb}.ca-type-poison,.ca-scene-poison{--type:#9856a4;--ca-accent:#9856a4;--ca-light:#f5e4f8}.ca-type-psychic,.ca-scene-psychic{--type:#d85586;--ca-accent:#d85586;--ca-light:#ffe3ed}.ca-type-rock,.ca-scene-rock{--type:#aa945b;--ca-accent:#aa945b;--ca-light:#eee6d2}.ca-type-steel,.ca-scene-steel{--type:#8e9cab;--ca-accent:#8e9cab;--ca-light:#e7edf2}.ca-type-water,.ca-scene-water{--type:#378bce;--ca-accent:#378bce;--ca-light:#e0f3ff}
@media(max-width:760px){.ca-type-scene .atlas-info{padding:16px}.ca-type-scene::before{background-image:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.78) 45%,rgba(255,255,255,.9)),var(--ca-scene-image,none)}}

/* v3.3: keep wallpaper visible above panel background but behind card content */
.ca-type-scene > *{position:relative;z-index:1}
.ca-type-scene::before{background-repeat:no-repeat;background-size:cover;background-position:center}

/* v3.6: wallpaper is set directly on body by card.php. */
body.ca-themed-page{min-height:100vh;isolation:isolate;background-color:var(--ca-light, #eaf0f7) !important;background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed}
/* The fixed translucent overlay blurs and fades the actual body wallpaper. */
body.ca-themed-page::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:rgba(248,250,255,.64);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
body.ca-themed-page > :not(script):not(style){position:relative;z-index:1}
body.ca-themed-page .ca-type-scene{background:rgba(255,255,255,.24)!important;border-color:rgba(255,255,255,.42);backdrop-filter:blur(4px)}
body.ca-themed-page .ca-type-scene::before,body.ca-themed-page .ca-type-scene::after{display:none}
body.ca-themed-page .ca-type-scene .atlas-info{background:rgba(255,255,255,.75);backdrop-filter:blur(12px)}
@media(max-width:760px){body.ca-themed-page::before{background:rgba(248,250,255,.70);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}}

/* v3.7: Do not use the background shorthand on the body: it clears the uploaded wallpaper. */

/* v3.8: wide screens show the card and Pokédex information side-by-side. */
@media (min-width: 900px) {
  body.ca-themed-page .atlas-detail.ca-type-scene {
    display: grid !important;
    grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.1fr) !important;
    gap: clamp(24px, 3.5vw, 60px) !important;
    align-items: start !important;
    padding: clamp(20px, 3vw, 42px) !important;
    width: 100%;
    box-sizing: border-box;
  }
  body.ca-themed-page .atlas-detail > .atlas-image-wrap {
    grid-column: 1; grid-row: 1; min-width: 0; width: 100%;
    display: flex; flex-direction: column; align-items: center;
  }
  body.ca-themed-page .atlas-detail > .atlas-info {
    grid-column: 2; grid-row: 1; min-width: 0; width: 100%;
    box-sizing: border-box; margin: 0;
  }
  body.ca-themed-page .atlas-image-wrap > .atlas-foil-card {
    width: min(100%, 430px); max-width: 100%;
  }
}
/* Keep one column on phones and tablets, with comfortable spacing. */
@media (max-width: 899px) {
  body.ca-themed-page .atlas-detail.ca-type-scene {
    display: flex !important; flex-direction: column !important;
    gap: 18px; padding: clamp(12px, 3vw, 22px);
  }
  body.ca-themed-page .atlas-detail > .atlas-image-wrap,
  body.ca-themed-page .atlas-detail > .atlas-info {
    width: 100%; max-width: 100%; box-sizing: border-box; min-width: 0;
  }
  body.ca-themed-page .atlas-detail > .atlas-image-wrap {
    display: flex; flex-direction: column; align-items: center;
  }
  body.ca-themed-page .atlas-image-wrap > .atlas-foil-card {width: min(100%, 380px)}
}
/* The motion-sensor control is for touch devices, not desktop mouse users. */
@media (hover: hover) and (pointer: fine) {
  body.ca-themed-page .atlas-tilt-controls,
  body.ca-themed-page .atlas-portrait-note {display: none !important}
}


/* v3.9: Pokédex layout across desktop, tablet and phone. */
body.ca-themed-page .atlas-detail.ca-type-scene {
  display:grid !important;
  grid-template-columns:minmax(0, .85fr) minmax(0, 1.15fr) !important;
  grid-template-areas:"art summary" "art details" !important;
  gap:clamp(12px,2.5vw,32px) !important;
  align-items:start !important;
  padding:clamp(12px,2.5vw,34px) !important;
  width:100%;box-sizing:border-box;
}
body.ca-themed-page .atlas-detail > .atlas-image-wrap {
  grid-area:art !important;grid-column:auto !important;grid-row:auto !important;
  min-width:0;width:100%;display:flex;flex-direction:column;align-items:center;
}
body.ca-themed-page .atlas-detail > .atlas-info {display:contents !important}
body.ca-themed-page .atlas-detail .atlas-summary,
body.ca-themed-page .atlas-detail .atlas-details {
  min-width:0;width:100%;box-sizing:border-box;padding:clamp(12px,2vw,22px);
  border-radius:18px;background:rgba(255,255,255,.76);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
body.ca-themed-page .atlas-detail .atlas-summary{grid-area:summary}
body.ca-themed-page .atlas-detail .atlas-details{grid-area:details}
body.ca-themed-page .atlas-detail .atlas-image-wrap > .atlas-foil-card{width:min(100%,430px);max-width:100%}
body.ca-themed-page .atlas-detail .atlas-summary h1{overflow-wrap:anywhere}
@media(max-width:899px){
 body.ca-themed-page .atlas-detail.ca-type-scene{
  grid-template-columns:minmax(0, .85fr) minmax(0, 1.15fr) !important;
  grid-template-areas:"art summary" "details details" !important;
 }
 body.ca-themed-page .atlas-detail .atlas-image-wrap > .atlas-foil-card{width:100%;max-width:350px}
}
@media(max-width:420px){
 body.ca-themed-page .atlas-detail.ca-type-scene{
  grid-template-columns:minmax(0, 1fr) !important;
  grid-template-areas:"art" "summary" "details" !important;
 }
 body.ca-themed-page .atlas-detail .atlas-image-wrap > .atlas-foil-card{max-width:290px}
}
/* Tilt button appears only on touch devices without a precision pointer. */
@media(hover:hover) and (pointer:fine){
 body.ca-themed-page .atlas-tilt-controls,
 body.ca-themed-page .atlas-portrait-note{display:none !important}
}