/* Jason's Place: storybook world design system (Oct 2026). Loaded last on every page. */
@import url("https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@700&family=Fraunces:opsz,wght@9..144,600;9..144,800&family=Nunito:wght@500;700;800;900&display=swap");
:root{
  --w-night:#1b1030;--w-plum:#2c1745;--w-wine:#5a1f3c;--w-rose:#f3b4a6;--w-gold:#f0c46a;--w-gold-d:#9a6a1f;
  --w-cream:#fff4e2;--w-parch:#fbf1de;--w-ink:#2a1a14;--w-ink2:#5a4033;--w-teal:#1f6b63;
  --w-brass:linear-gradient(180deg,#fbe3a2 0%,#e8b65a 45%,#b27a26 100%);
  --w-display:"Fraunces","Iowan Old Style",Georgia,serif;--w-magic:"Cinzel Decorative","Fraunces",Georgia,serif;
  --w-sans:"Nunito",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --w-ease:cubic-bezier(.2,.8,.2,1);--w-r:20px;
  --jp-serif:var(--w-display);--jp-sans:var(--w-sans);
}
html.jpw-lock{overflow:hidden}
body.jpw{font-family:var(--w-sans)}
body.jpw h1,body.jpw h2,body.jpw h3{font-family:var(--w-display);letter-spacing:-.01em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.jpw-eyebrow{margin:0;font:900 11px/1.2 var(--w-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--w-gold)}

/* ---------- header ---------- */
.jpw-bar{position:sticky;top:0;z-index:900;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:calc(8px + env(safe-area-inset-top,0px)) 14px 8px;
  background:linear-gradient(180deg,#24123c 0%,#1b1030 100%);color:var(--w-cream);
  box-shadow:0 1px 0 rgba(240,196,106,.45),0 10px 30px rgba(10,4,20,.35)}
.jpw-bar::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:linear-gradient(90deg,transparent,#f0c46a 20%,#fbe3a2 50%,#f0c46a 80%,transparent);opacity:.7}
.jpw-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;min-width:0}
.jpw-brand img{width:46px;height:46px;flex:none;border-radius:50%;background:radial-gradient(circle,#fff6e0 0 58%,#f0c46a 60% 66%,transparent 68%);padding:4px;filter:drop-shadow(0 3px 8px rgba(0,0,0,.4))}
.jpw-brand b{display:block;font:800 21px/1 var(--w-display);color:#fff4e2;white-space:nowrap}
.jpw-brand small{display:block;margin-top:3px;font:800 10px/1 var(--w-sans);letter-spacing:.22em;text-transform:uppercase;color:var(--w-gold);white-space:nowrap}
.jpw-bar-r{display:flex;align-items:center;gap:8px}
.jpw-keys{display:inline-flex;align-items:center;gap:5px;padding:7px 10px;border-radius:999px;background:rgba(240,196,106,.14);box-shadow:inset 0 0 0 1px rgba(240,196,106,.5);color:#fbe3a2;font:900 13px var(--w-sans)}
.jpw-mapbtn,.jpw-btn,body.jpw .jpx-btn,body.jpw .jp-btn,body.jpw .btn-gold,body.jpw .cta,body.jpw .jp-explore-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:10px 18px;border:0;border-radius:14px;cursor:pointer;
  font:900 15px/1.1 var(--w-sans) !important;letter-spacing:.02em;text-decoration:none !important;color:#2a1606 !important;
  background:var(--w-brass) !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 0 rgba(120,70,10,.45),0 0 0 1px #8a5a1c,0 6px 16px rgba(60,30,0,.35) !important;
  transition:transform .2s var(--w-ease),filter .2s}
.jpw-mapbtn:hover,.jpw-btn:hover,body.jpw .jpx-btn:hover,body.jpw .jp-btn:hover{transform:translateY(-2px);filter:brightness(1.06)}
.jpw-mapbtn:focus-visible,.jpw-btn:focus-visible,body.jpw a:focus-visible,body.jpw button:focus-visible{outline:3px solid #fbe3a2;outline-offset:3px;box-shadow:0 0 0 6px #1b1030}
.jpw-mapbtn{min-height:40px;padding:8px 14px;font-size:14px !important}
/* secondary: velvet door-plaque */
.jpw-btn.alt,body.jpw .jpx-btn.alt,body.jpw .btn-outline{background:linear-gradient(180deg,#6a2a4c,#40163a) !important;color:#fff4e2 !important;box-shadow:inset 0 0 0 1px rgba(240,196,106,.7),0 6px 16px rgba(20,5,20,.35) !important}
@media(max-width:380px){.jpw-brand b{font-size:18px}.jpw-brand small{letter-spacing:.14em}.jpw-keys{display:none}}

/* ---------- legacy content on parchment ---------- */
body.jpw .btn,body.jpw .room-button,body.jpw .me-btn,body.jpw .gp-btn{border-radius:14px;font-family:var(--w-sans);font-weight:900}
body.jpw .btn:not(.alt):not(.ghost),body.jpw .room-button{background:var(--w-brass);color:#2a1606;border:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 0 0 1px #8a5a1c,0 6px 14px rgba(60,30,0,.25)}
body.jpw .btn.alt{background:linear-gradient(180deg,#6a2a4c,#40163a);color:#fff4e2;border:0;box-shadow:inset 0 0 0 1px rgba(240,196,106,.7)}
body.jpw .pill{border-radius:999px;background:#fff8ec;color:var(--w-ink);box-shadow:inset 0 0 0 1px #d9b77a}
body.jpw .jp-bar,body.jpw .game-bar,body.jpw .arcade-bar,body.jpw .gp-bar,body.jpw .qp-bar{background:linear-gradient(180deg,#3a1c4f,#2c1745) !important;color:#fff4e2 !important;border:0 !important;box-shadow:inset 0 -1px 0 rgba(240,196,106,.4) !important;top:62px}
body.jpw .jp-bar a,body.jpw .jp-bar button{color:#fff4e2 !important}
body.jpw .jp-bar a,body.jpw .jp-bar button{background:rgba(255,244,226,.1) !important;border-radius:12px;box-shadow:inset 0 0 0 1px rgba(240,196,106,.45)}
body.jpw .jp-panel{background:#fffaf0;border-radius:24px;box-shadow:0 0 0 1px #e5cf9f,0 18px 40px rgba(60,30,10,.12)}
body.jpw .jp-h1{font-family:var(--w-display);color:#3b1838}

/* ---------- mansion map ---------- */
.jpw-map{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:12px;background:rgba(14,6,26,.72);opacity:0;transition:opacity .3s}
.jpw-map.on{opacity:1}
.jpw-map[hidden]{display:none}
.jpw-map-card{position:relative;width:min(560px,100%);max-height:calc(100svh - 24px);overflow:auto;padding:20px 16px 18px;border-radius:26px;color:var(--w-cream);
  background:radial-gradient(120% 60% at 50% 0%,#3d2160,#1b1030 70%);box-shadow:0 0 0 1px rgba(240,196,106,.55),0 30px 80px rgba(0,0,0,.6);transform:translateY(16px) scale(.97);transition:transform .35s var(--w-ease)}
.jpw-map.on .jpw-map-card{transform:none}
.jpw-map-card h2{margin:4px 0 10px;font:800 30px/1.05 var(--w-display);color:#fff4e2}
.jpw-x{position:absolute;right:12px;top:12px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,244,226,.12);color:#fff4e2;font-size:26px;cursor:pointer}
.jpw-meter{display:flex;align-items:center;gap:10px;margin-bottom:12px;font:800 13px var(--w-sans);color:#fbe3a2}
.jpw-meter-bar{flex:1;height:10px;border-radius:9px;background:rgba(255,244,226,.14);overflow:hidden;box-shadow:inset 0 0 0 1px rgba(240,196,106,.4)}
.jpw-meter-bar i{display:block;height:100%;background:var(--w-brass);border-radius:9px}
.jpw-plan{position:relative;aspect-ratio:3/4;border-radius:18px;margin-bottom:12px;
  background:
   linear-gradient(rgba(240,196,106,.18) 2px,transparent 2px) 0 0/25% 22% ,
   linear-gradient(90deg,rgba(240,196,106,.18) 2px,transparent 2px) 0 0/25% 22%,
   radial-gradient(80% 60% at 50% 50%,#f6e3bd,#e2c38c);box-shadow:inset 0 0 0 3px #8a5a1c,inset 0 0 40px rgba(110,60,10,.4)}
.jpw-plan::before{content:"";position:absolute;left:50%;top:44%;width:34%;height:30%;transform:translate(-50%,0);border:3px dashed rgba(110,60,10,.45);border-radius:50% 50% 8px 8px}
.jpw-pin{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:3px;width:84px;text-align:center;text-decoration:none;color:#2a1606}
.jpw-pin-door{display:grid;place-items:center;width:46px;height:58px;border-radius:24px 24px 6px 6px;background:#5a1f3c center/cover;box-shadow:0 0 0 3px #b27a26,0 6px 12px rgba(60,30,0,.4);color:#fbe3a2}
.jpw-pin b{font:900 11px/1.15 var(--w-sans);color:#2a1606 !important;background:#fff8ec;padding:2px 6px;border-radius:8px;box-shadow:0 0 0 1px #c99a4e}
.jpw-pin em{font:900 10px var(--w-sans);font-style:normal;color:#fff;background:#8a1f3a;padding:2px 6px;border-radius:8px}
.jpw-pin.here .jpw-pin-door{box-shadow:0 0 0 3px #fff,0 0 0 6px #e8b65a,0 0 22px 6px rgba(255,214,120,.9);animation:jpwPulse 1.8s ease-in-out infinite}
.jpw-pin.seen .jpw-pin-door::after{content:"✓";position:relative;top:20px;left:18px;width:18px;height:18px;border-radius:50%;background:#1f6b63;color:#fff;font:900 11px/18px var(--w-sans)}
.jpw-pin.locked .jpw-pin-door{background:#3a2f45;filter:saturate(.3)}
.jpw-pin.locked em{background:#4a3a5a}
@keyframes jpwPulse{50%{box-shadow:0 0 0 3px #fff,0 0 0 6px #e8b65a,0 0 34px 12px rgba(255,214,120,.6)}}
.jpw-maplinks{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.jpw-maplinks .jpw-eyebrow{width:100%}
.jpw-maplinks a{padding:9px 13px;border-radius:12px;background:rgba(255,244,226,.1);box-shadow:inset 0 0 0 1px rgba(240,196,106,.5);color:#fff4e2;font:800 14px var(--w-sans);text-decoration:none}
.jpw-maplinks.page{margin-bottom:8px}

/* ---------- room scene (room pages) ---------- */
.jpw-scene{position:relative;height:min(78svh,640px);min-height:440px;overflow:hidden;background:#1b1030;isolation:isolate}
.jpw-scene-art{position:absolute;inset:0;z-index:-2;background:center/cover no-repeat;animation:jpwWalk 1.2s var(--w-ease) both}
.jpw-scene::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(27,16,48,.55) 0%,rgba(27,16,48,0) 30%,rgba(27,16,48,0) 55%,rgba(27,16,48,.92) 100%)}
@keyframes jpwWalk{from{transform:scale(1.18);filter:brightness(.6)}to{transform:none;filter:none}}
.jpw-scene-cap{position:absolute;left:16px;right:16px;top:16px;color:#fff4e2}
.jpw-scene-t{margin:4px 0 0;font:800 clamp(32px,9vw,56px)/1 var(--w-display) !important;color:#fff4e2;text-shadow:0 3px 16px rgba(10,4,20,.85)}
.jpw-spot{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none}
.jpw-spot i{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle,#fff 0 25%,#fbe3a2 40%,rgba(240,196,106,.0) 72%);box-shadow:0 0 0 2px rgba(255,244,226,.9),0 0 18px 6px rgba(255,214,120,.75);animation:jpwGlow 2s ease-in-out infinite}
.jpw-spot b{padding:6px 10px;border-radius:12px;background:rgba(27,16,48,.9);color:#fff4e2;font:900 13px/1.15 var(--w-sans);white-space:nowrap;box-shadow:inset 0 0 0 1px rgba(240,196,106,.6)}
.jpw-spot:hover b,.jpw-spot:focus-visible b{background:#5a1f3c}
@keyframes jpwGlow{50%{transform:scale(1.25);box-shadow:0 0 0 2px #fff,0 0 28px 10px rgba(255,214,120,.55)}}
.jpw-guide{position:absolute;left:12px;right:12px;bottom:14px;display:flex;align-items:flex-end;gap:10px}
.jpw-guide img{width:64px;height:64px;flex:none;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px #e8b65a,0 8px 20px rgba(0,0,0,.5)}
.jpw-guide p{position:relative;margin:0;padding:10px 13px;border-radius:16px 16px 16px 4px;background:#fff8ec;color:#2a1a14;font:700 14px/1.35 var(--w-sans);box-shadow:0 10px 26px rgba(0,0,0,.35)}
.jpw-guide p b{display:block;font:800 15px var(--w-display);color:#5a1f3c}

/* ---------- door transition veil ---------- */
.jpw-veil{position:fixed;inset:0;z-index:2000;pointer-events:none;display:flex}
.jpw-veil span{flex:1;background:linear-gradient(90deg,#2a1406,#5a3212 50%,#2a1406);box-shadow:inset 0 0 0 6px #8a5a1c;transition:transform .42s var(--w-ease)}
.jpw-veil .l{transform:translateX(-101%)}.jpw-veil .r{transform:translateX(101%)}
.jpw-veil.on{pointer-events:auto}.jpw-veil.on span{transform:none}
@media(prefers-reduced-motion:reduce){.jpw-scene-art,.jpw-spot i,.jpw-pin.here .jpw-pin-door{animation:none}.jpw-veil{display:none}}

/* ---------- atmosphere: dust motes, candle flicker, parallax, tap feedback ---------- */
.jpw-motes{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.jpw-motes i{position:absolute;bottom:-10px;width:var(--s,4px);height:var(--s,4px);border-radius:50%;background:radial-gradient(circle,#fff6d8,rgba(255,214,140,0) 70%);opacity:0;animation:jpwMote var(--t,14s) linear infinite;animation-delay:var(--d,0s)}
@keyframes jpwMote{0%{transform:translate(0,0);opacity:0}10%{opacity:.9}50%{transform:translate(var(--x,20px),-50vh)}90%{opacity:.7}100%{transform:translate(calc(var(--x,20px)*-1),-100vh);opacity:0}}
.jpw-flicker{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(60% 40% at 50% 22%,rgba(255,190,110,.32),transparent 70%);mix-blend-mode:screen;animation:jpwFlicker 3.2s infinite}
@keyframes jpwFlicker{0%,100%{opacity:.85}12%{opacity:.6}20%{opacity:.95}34%{opacity:.7}48%{opacity:1}63%{opacity:.75}80%{opacity:.92}}
.jpw-spot,.jph-hot{z-index:2}
.jpw-ripple{position:fixed;z-index:3000;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;pointer-events:none;box-shadow:0 0 0 2px #fbe3a2,0 0 24px 8px rgba(255,214,120,.8);animation:jpwRip .6s ease-out forwards}
@keyframes jpwRip{to{transform:scale(7);opacity:0}}
.jpw-scene .jpw-scene-art,.jph-foyer-art{will-change:transform;transform:translate3d(var(--px,0),var(--py,0),0) scale(1.08)}
@media(prefers-reduced-motion:reduce){.jpw-motes,.jpw-flicker{display:none}.jpw-ripple{display:none}.jpw-scene .jpw-scene-art,.jph-foyer-art{transform:none}}

.jpw-scene-t,body.jpw .jpw-scene-t{color:#fff4e2 !important;-webkit-text-fill-color:#fff4e2;background:none !important}
/* AA fixes for legacy page styles */
body.jpw .story .ey{color:#6e5418 !important}
body.jpw .footin span{color:#4f5a6a !important}
body.jpw .actions a[href$="creation-lab/"]{background:#1f6b78 !important}
body.jpw footer,body.jpw footer a[href$="kids/"]{color:#4a5a6c !important}
body.jpw .rb-tag,body.jpw #rb-enter{background:#b54a28 !important;color:#fff !important}
body.jpw .eyebrow{color:#a8432e}

/* ---------- polish: Store, Companions, Wings into the storybook mansion (Oct 21) ---------- */
html body.jpw.jpw-store,body.jpw-friends{background:radial-gradient(120% 50% at 50% 0%,#3d2160,#1b1030 60%) fixed !important;color:#fff4e2}
html body.jpw.jpw-store .hero{background:linear-gradient(180deg,rgba(27,16,48,.35),#1b1030),url(/jasons-place/assets/premium/hero-foyer-portrait-648x864.webp) center/cover !important}
html body.jpw.jpw-store .hero h1,html body.jpw.jpw-store .section h2,html body.jpw.jpw-store .shelf,html body.jpw.jpw-store .featurebox h2,body.jpw-friends h1{font-family:var(--w-display) !important;color:#fff4e2 !important}
html body.jpw.jpw-store .ey{color:#fbe3a2 !important}
html body.jpw.jpw-store .trust{background:rgba(255,244,226,.06) !important;border:0 !important;box-shadow:inset 0 -1px 0 rgba(240,196,106,.35)}
html body.jpw.jpw-store .trustitem{color:#e9dcc6 !important;border-color:rgba(240,196,106,.25) !important}
html body.jpw.jpw-store .trustitem b{color:#fbe3a2 !important}
html body.jpw.jpw-store .intro,html body.jpw.jpw-store .featurebox p{color:#e9dcc6 !important}
html body.jpw.jpw-store .feature{background:transparent !important}
html body.jpw.jpw-store .featurebox{background:linear-gradient(180deg,#3a1c4f,#2c1745) !important;border:0 !important;box-shadow:0 0 0 1px rgba(240,196,106,.55),0 20px 50px rgba(0,0,0,.4)}
html body.jpw.jpw-store .featureprice{color:#fbe3a2 !important}
html body.jpw.jpw-store .card{background:#fffaf0 !important;border:0 !important;border-radius:22px !important;box-shadow:0 0 0 2px #c99a4e,0 0 0 5px #3a1c4f,0 18px 40px rgba(0,0,0,.45) !important;color:var(--w-ink)}
html body.jpw.jpw-store .card picture{background:#f3e3c4 !important}
html body.jpw.jpw-store .card h3{font-family:var(--w-display);color:#3b1838}
html body.jpw.jpw-store .card .type{color:#6e3a1c !important}
html body.jpw.jpw-store .card .price{color:#5a1f3c !important;font-weight:900}
html body.jpw.jpw-store .card .buy{background:var(--w-brass) !important;color:#2a1606 !important;border:0 !important;border-radius:14px !important;font-weight:900;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 0 0 1px #8a5a1c}
html body.jpw.jpw-store .footer{background:#12091f !important;color:#e9dcc6 !important;box-shadow:inset 0 1px 0 rgba(240,196,106,.35)}
body.jpw-friends .lead,body.jpw-friends small{color:#e9dcc6;opacity:1 !important}
body.jpw-friends .card,body.jpw-friends form,body.jpw-friends .cart{background:linear-gradient(180deg,#3a1c4f,#2c1745) !important;border:0 !important;border-radius:22px !important;box-shadow:0 0 0 1px rgba(240,196,106,.6),0 16px 36px rgba(0,0,0,.4)}
body.jpw-friends .card b{font-family:var(--w-display);color:#fbe3a2}
body.jpw-friends .card .media img{border-color:#e8b65a !important}
body.jpw-friends button.save{background:var(--w-brass) !important;color:#2a1606 !important;font-weight:900}
body.jpw-friends input,body.jpw-friends select{background:#fff8ec;color:#2a1a14;border-color:#c99a4e}
body.jpw-friends a{color:#fbe3a2}
body.jpw footer.jpw-retired{display:none}

/* ---------- one concept (Oct 21): founder reference look — dark glass + gold, photoreal ---------- */
.jpw-retired,header.jpw-retired{display:none !important}
.jpw-bar{background:rgba(14,9,12,.72) !important;backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);box-shadow:inset 0 -1px 0 rgba(240,196,106,.35) !important}
.jpw-brand b{font-family:"Cinzel Decorative",var(--w-display) !important;color:#f0c46a !important;letter-spacing:.02em}
.jpw-brand small{color:#d9c39a !important}
.jpw-nav{display:none}
.jpw-nav a{color:#f4ead8;text-decoration:none;font:700 14px/1 var(--w-sans);padding:8px 2px;margin:0 9px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.jpw-nav a:hover,.jpw-nav a:focus-visible,.jpw-nav a[aria-current]{color:#f0c46a;border-bottom-color:rgba(240,196,106,.8)}
.jpw-join{display:none;margin-left:8px;padding:9px 16px;border-radius:12px;background:var(--w-brass);color:#2a1606 !important;font:900 14px var(--w-sans);text-decoration:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 0 0 1px #8a5a1c,0 6px 18px rgba(240,196,106,.25)}
@media(min-width:980px){.jpw-nav{display:flex;margin:0 auto}.jpw-join{display:inline-block}}
.jpw-mapbtn{background:rgba(255,244,226,.08) !important;color:#f0c46a !important;box-shadow:inset 0 0 0 1px rgba(240,196,106,.6) !important}
/* readable gold CTAs: dark text on brass, always */
body.jpw a[style*="gradient"],body.jpw [data-jpw="btn"]{color:#2a1606 !important}
html body.jpw.jpw-store section,html body.jpw.jpw-store .hero,html body.jpw.jpw-store main{background-color:transparent !important}
html body.jpw.jpw-store .btn,html body.jpw.jpw-store a.btn{background:linear-gradient(180deg,#fbe3a2,#e8b65a 45%,#b27a26) !important;color:#2a1606 !important;border:0 !important;border-radius:12px !important}
html body.jpw.jpw-store .btn.alt,html body.jpw.jpw-store .btn.ghost,html body.jpw.jpw-store .btn-outline{background:transparent !important;color:#fbf3e4 !important;box-shadow:inset 0 0 0 1px rgba(240,196,106,.6) !important}
html body.jpw.jpw-store h1,html body.jpw.jpw-store p{color:inherit}
html body.jpw.jpw-store .hero p,html body.jpw.jpw-store .hero .lead,html body.jpw.jpw-store .hero li{color:#ecdfc8 !important}
