/* Fredoka (SIL Open Font License 1.1, /fonts/fredoka/OFL.txt), self-hosted variable font, Latin subset, weights 500-700. */
@font-face{font-family:'Fredoka';font-style:normal;font-weight:500 700;font-display:swap;src:url('/fonts/fredoka/fredoka-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Panna Legends pages only (14 Oct 2026). Loaded after studio.css on /panna-legends/*. Brand: royal blue #1F4FE0,
   light blue #6CC4FF, deep navy #0E1A3D, white, pitch green #3FA34D, body text #22253A. Headings: Fredoka. */
body.theme-panna{--bg:#fff;--surface:#fff;--surface-2:#eef4ff;--ink:#22253a;--muted:#4b5272;--line:#d8e2f7;--lime:#1f4fe0;--royal:#1f4fe0;--sky:#6cc4ff;--navy:#0e1a3d;--grass:#3fa34d;--round:"Fredoka","Baloo 2","Nunito",ui-rounded,"Arial Rounded MT Bold",system-ui,sans-serif;color-scheme:light;background:#fff;color:#22253a}
.theme-panna ::selection{background:var(--sky);color:var(--navy)}
.theme-panna :focus-visible{outline-color:var(--royal)}
.theme-panna a:hover{color:var(--royal)}
.theme-panna h1,.theme-panna h2,.theme-panna h3,.theme-panna .button,.panna-kicker,.panna-tagline,.play-soon,.panna-subnav{font-family:var(--round)}
.theme-panna h1,.theme-panna h2,.theme-panna h3{letter-spacing:0;line-height:1.08;color:var(--navy)}
.theme-panna h1,.theme-panna h2{font-weight:700}
.theme-panna h2{font-size:clamp(2rem,4.2vw,3.3rem)}
.theme-panna h3{font-weight:600;font-size:clamp(1.25rem,2vw,1.5rem)}
.theme-panna .eyebrow{color:var(--royal);font-family:var(--round);letter-spacing:.12em}
.theme-panna .button{border-radius:999px;border-width:3px}
.theme-panna .button.primary{background:var(--royal);border-color:var(--royal);color:#fff}
.theme-panna .button.primary:hover{background:#1a43c2;border-color:#1a43c2;color:#fff}
.theme-panna .button.secondary{border-color:var(--royal);color:var(--royal)}

/* Shared site header and footer in deep navy on these pages. */
.theme-panna .site-header{background:rgba(14,26,61,.97);border-bottom-color:#22356e;color:#fff;--ink:#fff;--muted:#c9d5f5;--line:#2a3d78;--lime:#6cc4ff}
.theme-panna .site-header a:hover{color:var(--sky)}
.theme-panna .site-footer{background:var(--navy);color:#c9d5f5;border-top:0;--ink:#fff;--muted:#c9d5f5;--line:#2a3d78;--lime:#6cc4ff}
.theme-panna .site-footer a:hover{color:#6cc4ff}

/* Game sub-navigation (Game · Privacy · Terms · Support). */
.panna-subnav{background:var(--royal);color:#fff}
.panna-subnav>.wrap{display:flex;align-items:center;justify-content:space-between;gap:.5rem 1.5rem;flex-wrap:wrap;padding-block:.55rem}
.panna-subnav-brand{display:inline-flex;align-items:center;gap:.6rem;color:#fff;text-decoration:none;font-weight:700;font-size:1.15rem}
.panna-subnav-brand img{width:32px;height:32px;border-radius:9px;border:2px solid #fff}
.theme-panna .panna-subnav-brand:hover{color:#fff}
.panna-subnav ul{display:flex;flex-wrap:wrap;gap:.3rem;list-style:none;margin:0;padding:0}
.panna-subnav ul a{display:inline-flex;align-items:center;min-height:40px;padding:.35rem .95rem;border-radius:999px;color:#fff;text-decoration:none;font-weight:600}
.theme-panna .panna-subnav ul a:hover{background:rgba(255,255,255,.18);color:#fff}
.theme-panna .panna-subnav ul a[aria-current=page]{background:#fff;color:var(--royal)}

/* Hero */
.panna-hero{background:radial-gradient(circle at 78% 18%,#4a78ff 0,#1f4fe0 42%,#0e1a3d 100%);color:#fff;padding-block:clamp(2.5rem,6vw,5rem)}
.panna-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(1.75rem,4vw,4rem);align-items:center}
.panna-icon{width:96px;height:96px;border-radius:24px;border:4px solid #fff;box-shadow:0 6px 0 var(--navy);margin-bottom:1.2rem}
.panna-kicker{color:var(--sky);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;margin-bottom:.4rem}
.theme-panna .panna-hero h1{font-size:clamp(3rem,7.4vw,5.6rem);line-height:.98;color:#fff;text-transform:uppercase;margin-bottom:.9rem;text-shadow:0 5px 0 var(--navy)}
.panna-hero h1 .w2{color:var(--sky)}
.panna-tagline{font-size:clamp(1.2rem,2.3vw,1.6rem);font-weight:600;line-height:1.3}
.theme-panna .panna-hero .lead{color:#e3ebff}
.panna-banner{margin:0}
.panna-banner img{width:100%;border-radius:1.5rem;border:5px solid #fff;box-shadow:0 10px 0 var(--navy)}
.panna-cta{margin-top:1.6rem}
.play-soon{display:inline-flex;align-items:center;gap:.7rem;min-height:56px;margin:0;padding:.75rem 1.5rem;border-radius:999px;background:#fff;color:var(--navy);font-weight:600;font-size:1.15rem;box-shadow:0 5px 0 var(--navy)}
.play-soon:before{content:"";width:12px;height:12px;border-radius:50%;background:var(--grass);flex:none}
.play-badge{display:inline-block}.play-badge img{height:64px;width:auto}
.panna-small{font-size:.9rem;color:#c9d5f5;margin:1.1rem 0 0}

/* Sections */
.panna-section{padding-block:clamp(3rem,6vw,5.5rem)}
.panna-section.alt{background:#eef5ff}
.panna-section .section-head>p{color:var(--muted)}
.panna-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;list-style:none;padding:0;margin:2rem 0 0}
.panna-features>li{min-width:0;background:#fff;border:3px solid var(--line);border-radius:1.4rem;padding:1.4rem 1.5rem;box-shadow:0 6px 0 var(--line)}
.panna-features>li.wide{grid-column:1/-1;border-color:var(--royal);box-shadow:0 6px 0 var(--royal)}
.theme-panna .panna-features h3{color:var(--royal);margin-bottom:.6rem}
.panna-features p{margin-bottom:0}
.positions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;list-style:none;padding:0;margin:1rem 0 0}
.positions li{background:#eef5ff;border-radius:1rem;padding:.9rem 1rem}
.positions strong{display:block;font-family:var(--round);font-weight:600;color:var(--navy);font-size:1.1rem}
.theme-panna .shot{background:#fff;border:3px solid var(--line);border-radius:1.1rem;color:var(--ink)}
.theme-panna .shot span{color:var(--muted);font-size:.85rem}
.theme-panna .shot:hover{border-color:var(--royal)}
.theme-panna dialog#lightbox{background:var(--navy);color:#fff;border-color:#2a3d78;--ink:#fff;--muted:#c9d5f5;--line:#2a3d78;--surface:#1a2a5c}
.panna-know-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(1.5rem,4vw,4rem);align-items:start}
.panna-know{list-style:none;padding:0;margin:0;display:grid;gap:.8rem}
.panna-know li{background:#fff;border:3px solid var(--line);border-radius:1rem;padding:1rem 1.25rem;overflow-wrap:anywhere}
.panna-know a{color:var(--royal)}
.panna-cta-band{background:var(--grass);color:#fff;text-align:center;padding-block:clamp(2.5rem,5vw,4rem)}
.theme-panna .panna-cta-band h2{color:#fff;text-shadow:0 4px 0 #23702e;margin-bottom:1.4rem}
.panna-links{background:#eef5ff;font-size:.92rem}
.panna-links>.wrap{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.4rem;padding-block:1.3rem}
.panna-links a{color:var(--royal);font-weight:600}
.panna-links span{color:var(--muted)}

/* Policy and support pages */
.panna-doc{padding-block:clamp(2.5rem,5vw,4.5rem)}
.panna-prose{overflow-wrap:anywhere}
.theme-panna .panna-prose h1{font-size:clamp(2.1rem,5vw,3.4rem);max-width:none;margin-bottom:1.2rem}
.theme-panna .panna-prose h2{font-size:clamp(1.45rem,2.6vw,2rem);color:var(--royal);margin-top:2.4rem}
.theme-panna .panna-prose h3{font-size:1.2rem;margin:1.8rem 0 .4rem}
.theme-panna .panna-prose p,.theme-panna .panna-prose li{color:#33384f}
.theme-panna .panna-prose strong{color:var(--navy)}
.theme-panna .panna-prose a{color:var(--royal)}
.table-wrap{overflow-x:auto;margin:1.2rem 0 1.6rem;border:2px solid var(--line);border-radius:1rem}
.table-wrap table{border-collapse:collapse;width:100%;font-size:.95rem}
.table-wrap th,.table-wrap td{text-align:left;vertical-align:top;padding:.75rem 1rem;border-bottom:1px solid var(--line);overflow-wrap:normal}
.table-wrap th{background:#eef5ff;color:var(--navy);font-family:var(--round);font-weight:600}
.table-wrap tr:last-child td{border-bottom:0}

@media(max-width:1000px){.panna-features{grid-template-columns:repeat(2,minmax(0,1fr))}.positions{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.panna-hero-grid,.panna-know-grid{grid-template-columns:1fr}.panna-banner{order:-1}.panna-subnav>.wrap{justify-content:center}.panna-subnav-brand{display:none}}
@media(max-width:600px){.panna-features,.positions{grid-template-columns:1fr}.play-soon{font-size:1.02rem;padding:.7rem 1.2rem}.table-wrap th,.table-wrap td{padding:.6rem .7rem}}
.theme-panna .panna-prose code{font-size:.92em;background:#eef5ff;color:var(--navy);padding:.08em .35em;border-radius:.35em;overflow-wrap:anywhere}
@media(max-width:600px){.panna-subnav ul{gap:.1rem}.panna-subnav ul a{padding:.35rem .62rem;min-height:40px}}