/* Mystery Doku page, dressed like the game's "cosy noir" board-game look:
   midnight ink behind, parchment cards with a thick paper lip in front,
   brass gold, the red "case file" stamp, Lilita One headings over Nunito.
   Colours come from the game's src/styles.css. Fonts are SIL OFL (licence
   files alongside them). Buttons and link cards carry no borders: depth
   comes from the bottom lip, as in the game. */
@font-face{font-family:"Lilita One";font-weight:400;font-display:swap;src:url("/assets/fonts/mystery-doku/LilitaOne-400-latin.woff2") format("woff2")}
@font-face{font-family:"Nunito";font-weight:600;font-display:swap;src:url("/assets/fonts/mystery-doku/Nunito-600-latin.woff2") format("woff2")}
@font-face{font-family:"Nunito";font-weight:800;font-display:swap;src:url("/assets/fonts/mystery-doku/Nunito-800-latin.woff2") format("woff2")}

.theme-mystery-doku{
  --md-ink:#12152a; --md-ink-2:#1b2040; --md-ink-3:#262c56; --md-ink-4:#333a6c; --md-line:rgba(255,255,255,.09);
  --md-paper:#f7eedc; --md-paper-2:#ecdcbc; --md-paper-3:#dcc79f; --md-text:#2b2340; --md-text-2:#6a5f7e;
  --md-on-ink:#eef0ff; --md-muted:#9aa0c8; --md-gold:#f6bb47; --md-gold-2:#ffd77e; --md-gold-d:#c4841a; --md-red:#e0533d; --md-red-d:#a8321f;
  --md-display:"Lilita One","Arial Rounded MT Bold",system-ui,sans-serif; --md-body:Nunito,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --md-card-shadow:0 8px 0 var(--md-paper-3),0 16px 34px rgba(0,0,0,.4);
  --md-ruled:repeating-linear-gradient(0deg,rgba(43,35,64,.025) 0 1px,transparent 1px 26px);
  background:radial-gradient(120% 70% at 50% -10%,#2c3470 0%,rgba(44,52,112,0) 60%),radial-gradient(90% 60% at 100% 110%,#3a1f4d 0%,rgba(58,31,77,0) 60%),var(--md-ink);
  background-attachment:fixed;color:var(--md-on-ink);font-family:var(--md-body);font-weight:600;
}
.theme-mystery-doku a:focus-visible,.theme-mystery-doku button:focus-visible{outline-color:var(--md-gold)}
.theme-mystery-doku .site-head{background:rgba(18,21,42,.92);border-color:var(--md-line);color:var(--md-on-ink);box-shadow:0 6px 18px rgba(0,0,0,.35)}
.theme-mystery-doku .site-head .brand span i{color:var(--md-muted)}
.theme-mystery-doku .site-nav a{font-weight:800}
.theme-mystery-doku .site-nav a:hover,.theme-mystery-doku .site-nav a[aria-current="page"]{border-color:var(--md-gold)}

/* Hero: the title screen, wordmark in paper and gold */
.theme-mystery-doku .g-hero{background:transparent;border-color:var(--md-line);color:var(--md-on-ink)}
.theme-mystery-doku .crumbs{font-weight:800;color:var(--md-muted);opacity:1}
.theme-mystery-doku .g-kicker{font-weight:800;font-size:14px;letter-spacing:.08em;color:var(--md-muted);opacity:1}
.theme-mystery-doku .g-hero h1{font-family:var(--md-display);font-weight:400;text-transform:uppercase;letter-spacing:.03em;line-height:.92;
  font-size:clamp(44px,5.4vw,74px);color:var(--md-paper);text-shadow:0 4px 0 #0a0c1c,0 10px 24px rgba(0,0,0,.5)}
.theme-mystery-doku .g-hero h1 span{color:var(--md-gold);text-shadow:0 5px 0 var(--md-gold-d),0 12px 26px rgba(0,0,0,.5)}
.theme-mystery-doku .title img{border-radius:22%;box-shadow:0 5px 0 #0a0c1c,0 10px 22px rgba(0,0,0,.45)}
.theme-mystery-doku .g-hero .lede{color:#d9d4ff;font-weight:600}
.theme-mystery-doku .g-hero .cover{border-radius:22px;transform:rotate(-1.2deg);box-shadow:0 8px 0 #0a0c1c,0 30px 60px rgba(0,0,0,.5)}
/* The gold button from the title screen */
.theme-mystery-doku .soon-note{border:0;border-radius:16px;padding:13px 22px;white-space:nowrap;
  background:linear-gradient(var(--md-gold-2),var(--md-gold));color:#3b2306;font-family:var(--md-display);font-weight:400;font-size:18px;letter-spacing:.02em;
  box-shadow:0 5px 0 var(--md-gold-d),0 8px 18px rgba(0,0,0,.35)}

/* Panels: the parchment dossier */
.theme-mystery-doku .g-body{background:transparent}
.theme-mystery-doku .g-panel{background:var(--md-paper);background-image:var(--md-ruled);border:0;border-radius:24px;box-shadow:var(--md-card-shadow);
  color:var(--md-text);font-size:16.5px;line-height:1.6}
.theme-mystery-doku .g-panel h2{font-family:var(--md-display);font-weight:400;font-size:28px;letter-spacing:.01em}
.theme-mystery-doku .g-about a{color:var(--md-red-d);font-weight:800}
.theme-mystery-doku .g-about .credit{color:var(--md-text-2);font-size:15px}
/* The details card wears the red "Case file" stamp */
.theme-mystery-doku .g-facts h2{display:inline-block;color:var(--md-red);border:2.5px solid var(--md-red);border-radius:8px;padding:2px 12px;
  transform:rotate(-3deg);font-size:19px;letter-spacing:.04em;margin:0 0 14px 2px}
.theme-mystery-doku .g-facts dl div{border-bottom:1px solid rgba(43,35,64,.12)}
.theme-mystery-doku .g-facts dt{font-weight:800;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--md-text-2);align-self:center}
.theme-mystery-doku .g-facts dd{font-weight:800;font-variant-numeric:tabular-nums}
.theme-mystery-doku .g-facts .more{color:var(--md-red-d)}

/* Gallery: phone screens, full 9:16, centred rows */
.theme-mystery-doku .g-gallery h2{font-family:var(--md-display);font-weight:400;letter-spacing:.01em;color:var(--md-on-ink)}
.theme-mystery-doku .shots-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:28px 22px}
.theme-mystery-doku .shots-grid figure{flex:0 0 calc((100% - 66px) / 4);min-width:0}
.theme-mystery-doku .shot-btn img{aspect-ratio:9/16;border:0;border-radius:20px;box-shadow:0 0 0 4px var(--md-ink-3),0 8px 0 4px #0a0c1c,0 18px 36px rgba(0,0,0,.45)}
.theme-mystery-doku .shots-grid figcaption{margin-top:16px;font-weight:800;font-size:14px;color:var(--md-muted);opacity:1}
.theme-mystery-doku .lightbox button{border:0;background:var(--md-ink-3);color:var(--md-on-ink)}

.theme-mystery-doku .others{background:var(--md-ink-2);border-color:var(--md-line)}
.theme-mystery-doku .others h2{font-family:var(--md-display);font-weight:400;letter-spacing:.01em;color:var(--md-on-ink)}
.theme-mystery-doku .others ul{gap:20px 16px}
.theme-mystery-doku .others a{background:var(--md-paper);border:0;border-radius:18px;box-shadow:0 5px 0 var(--md-paper-3),0 10px 20px rgba(0,0,0,.3);
  color:var(--md-text);font-weight:800;transition:transform .1s ease}
.theme-mystery-doku .others a:hover{background:#fff8e8;transform:translateY(-2px)}
.theme-mystery-doku .others small{color:var(--md-text-2);font-weight:600}
.theme-mystery-doku .site-foot{background:var(--md-ink);color:var(--md-on-ink);border-color:var(--md-line)}
.theme-mystery-doku .site-foot h2{font-family:var(--md-display);font-weight:400;letter-spacing:.01em;font-size:17px}
.theme-mystery-doku .site-foot .muted,.theme-mystery-doku .site-foot .legal{color:var(--md-muted)}

@media (max-width:980px){
  .theme-mystery-doku .shots-grid figure{flex-basis:calc((100% - 44px) / 3)}
}
@media (max-width:760px){
  .theme-mystery-doku .shots-grid{gap:22px 14px}
  .theme-mystery-doku .shots-grid figure{flex-basis:calc((100% - 14px) / 2)}
  .theme-mystery-doku .g-hero .cover{transform:none}
  .theme-mystery-doku .soon-note{font-size:17px;padding:12px 18px}
}
@media (prefers-reduced-motion:reduce){.theme-mystery-doku .others a{transition:none}}

/* Loading screen in the game's colours */
.theme-mystery-doku .loader{--loader-bg:var(--md-ink);--loader-ink:var(--md-on-ink);--loader-line:#0a0c1c;--loader-track:var(--md-ink-3);--loader-fill:var(--md-gold);
  background-image:radial-gradient(120% 70% at 50% -10%,#2c3470 0%,rgba(44,52,112,0) 60%),radial-gradient(90% 60% at 100% 110%,#3a1f4d 0%,rgba(58,31,77,0) 60%)}
.theme-mystery-doku .loader-bar{border:0;border-radius:12px;box-shadow:0 5px 0 #0a0c1c}
.theme-mystery-doku .loader-bar i{border-radius:8px}
.theme-mystery-doku .loader-row{font-family:var(--md-display);font-weight:400;font-size:17px;letter-spacing:.06em}