/* -------------------------------------------------------------------------- */
/* Theme: JRPG (16-Bit SNES Party & Inventory Screen)                         */
/* Layout: Final Fantasy VI / Chrono Trigger Window Frame                     */
/* Contrast: WCAG AA Pass (Text on Frame 17.8:1)                              */
/* -------------------------------------------------------------------------- */

body[data-theme-layout="jrpg"],
:root[data-theme-layout="jrpg"] body {
  --sky: #0a0814;
  --sky-grad: radial-gradient(circle, rgba(230, 198, 83, 0.18) 1px, transparent 1px) 0 0 / 28px 28px,
              linear-gradient(180deg, #100b24 0%, #0a0814 100%);
  --card: #101438;
  --ink: #ffffff;
  --ink-soft: #c8d4ff;
  --slot: #1a1e4a;
  --shadow-1: #000000;
  --shadow-2: #e6c653;
  --gold: #ffe600;
  --chip-bg: rgba(230, 198, 83, 0.12);
  --dither: rgba(230, 198, 83, 0.04);
  background: var(--sky);
  background-image: var(--sky-grad);
  background-attachment: fixed;
  color: var(--ink);
  font-family: 'Press Start 2P', 'Courier New', monospace;
}

/* Starfield ambient layer */
body[data-theme-layout="jrpg"] .bg,
:root[data-theme-layout="jrpg"] .bg {
  opacity: 0.85;
}

/* JRPG Main Canvas Container */
body[data-theme-layout="jrpg"] main,
:root[data-theme-layout="jrpg"] main {
  max-width: 46rem;
  padding: 2.2rem 1.25rem 8rem;
}

/* SNES Royal Blue Window Frame */
body[data-theme-layout="jrpg"] .player,
:root[data-theme-layout="jrpg"] .player {
  position: relative;
  background: linear-gradient(180deg, #182058 0%, #101438 45%, #0c0e2a 100%);
  border: 3px solid #e6c653;
  box-shadow: inset 0 0 0 2px #7a6320, 0 6px 0 rgba(0, 0, 0, 0.85);
  padding: 1.8rem 1.4rem 1.5rem;
  margin-bottom: 2rem;
  border-radius: 4px;
}

/* Top Window Title Tab */
body[data-theme-layout="jrpg"] .player::before,
:root[data-theme-layout="jrpg"] .player::before {
  content: "★ PARTY STATUS [LEADER] ★";
  position: absolute;
  top: -14px;
  left: 20px;
  background: #101438;
  color: #ffcc00;
  font-size: 0.62rem;
  letter-spacing: 0.15em;
  padding: 0.2rem 0.6rem;
  border: 2px solid #e6c653;
  box-shadow: inset 0 0 0 1px #7a6320;
  z-index: 2;
}

/* Portrait Frame */
body[data-theme-layout="jrpg"] .avatar-slot,
:root[data-theme-layout="jrpg"] .avatar-slot {
  width: 124px;
  height: 124px;
  background: radial-gradient(circle, #242c6c 0%, #101438 85%);
  border: 3px solid #e6c653;
  box-shadow: inset 0 0 0 2px #7a6320, 0 4px 0 rgba(0, 0, 0, 0.6);
  margin-bottom: 0.9rem;
  animation: none;
}

/* Player Name & Vitals */
body[data-theme-layout="jrpg"] h1,
:root[data-theme-layout="jrpg"] h1 {
  color: #ffffff;
  font-size: clamp(1.4rem, 6vw, 1.85rem);
  text-shadow: 2px 2px 0 #000000, 3px 3px 0 #7a6320;
  margin-bottom: 0.35rem;
}

body[data-theme-layout="jrpg"] .kana,
:root[data-theme-layout="jrpg"] .kana {
  color: #e6c653;
  font-size: 0.78rem;
  letter-spacing: 0.3em;
  margin-bottom: 0.5rem;
}

body[data-theme-layout="jrpg"] .tagline,
:root[data-theme-layout="jrpg"] .tagline {
  color: #c8d4ff;
  font-size: 0.68rem;
  line-height: 1.6;
  margin-bottom: 1rem;
}

/* RPG Stats Meter Display */
body[data-theme-layout="jrpg"] .tagline::after,
:root[data-theme-layout="jrpg"] .tagline::after {
  content: "LV 99   HP 9999/9999   MP 999/999";
  display: block;
  margin-top: 0.75rem;
  padding: 0.45rem 0.6rem;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid #7a6320;
  color: #55ffff;
  font-size: 0.6rem;
  letter-spacing: 0.12em;
}

/* Party Battle Command Buttons */
body[data-theme-layout="jrpg"] .socials,
:root[data-theme-layout="jrpg"] .socials {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.65rem;
  margin-top: 0.8rem;
}

body[data-theme-layout="jrpg"] .slot-btn,
:root[data-theme-layout="jrpg"] .slot-btn {
  width: auto;
  min-width: 58px;
  height: 44px;
  padding: 0 0.65rem;
  background: linear-gradient(180deg, #182058 0%, #101438 100%);
  border: 2px solid #e6c653;
  box-shadow: inset 0 0 0 1px #7a6320, 2px 2px 0 #000000;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  text-decoration: none;
  font-size: 0.55rem;
}

body[data-theme-layout="jrpg"] .slot-btn canvas,
:root[data-theme-layout="jrpg"] .slot-btn canvas {
  width: 26px;
  height: 26px;
}

/* Social Battle Command Labels */
body[data-theme-layout="jrpg"] .slot-btn[href*="github"]::after { content: "ATK"; color: #ffe600; }
body[data-theme-layout="jrpg"] .slot-btn[href*="instagram"]::after { content: "LORE"; color: #ffe600; }
body[data-theme-layout="jrpg"] .slot-btn[data-copy*=".furphy"]::after { content: "MAGIC"; color: #ffe600; }
body[data-theme-layout="jrpg"] .slot-btn[data-copy*="furphy#1270"]::after { content: "ITEM"; color: #ffe600; }
body[data-theme-layout="jrpg"] .slot-btn[href*="raider.io"]::after { content: "DEF"; color: #ffe600; }
body[data-theme-layout="jrpg"] .slot-btn[href*="warcraftlogs"]::after { content: "SCAN"; color: #ffe600; }
body[data-theme-layout="jrpg"] .slot-btn[href*="mailto:"]::after { content: "RUN"; color: #ffe600; }

body[data-theme-layout="jrpg"] .slot-btn:hover,
:root[data-theme-layout="jrpg"] .slot-btn:hover {
  transform: translate(-1px, -1px);
  border-color: #ffe600;
  box-shadow: inset 0 0 0 1px #ffe600, 0 0 8px rgba(255, 230, 0, 0.4), 3px 3px 0 #000000;
}

/* Divider / Section Header */
body[data-theme-layout="jrpg"] .divider,
:root[data-theme-layout="jrpg"] .divider {
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  color: #ffcc00;
  margin: 1.6rem 0 1.4rem;
  text-shadow: 1px 1px 0 #000000;
}

body[data-theme-layout="jrpg"] .divider::before,
body[data-theme-layout="jrpg"] .divider::after,
:root[data-theme-layout="jrpg"] .divider::before,
:root[data-theme-layout="jrpg"] .divider::after {
  border-top: 2px solid #7a6320;
  opacity: 0.9;
}

/* World Cards (Equipped Inventory Relic Slots) */
body[data-theme-layout="jrpg"] .worlds,
:root[data-theme-layout="jrpg"] .worlds {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}

body[data-theme-layout="jrpg"] .world,
:root[data-theme-layout="jrpg"] .world {
  position: relative;
  background: linear-gradient(180deg, #182058 0%, #101438 50%, #0c0e2a 100%);
  border: 3px solid #e6c653;
  box-shadow: inset 0 0 0 1px #7a6320, 0 5px 0 rgba(0, 0, 0, 0.75);
  padding: 1rem 1.15rem;
  text-decoration: none;
  color: #ffffff;
  border-radius: 3px;
  transition: transform 0.08s steps(2, end), border-color 0.08s steps(2, end), box-shadow 0.08s steps(2, end);
}

body[data-theme-layout="jrpg"] .world:hover,
:root[data-theme-layout="jrpg"] .world:hover {
  transform: translateX(4px);
  border-color: #ffe600;
  background: linear-gradient(180deg, #202a6c 0%, #131945 100%);
  box-shadow: inset 0 0 0 2px #ffe600, 0 0 14px rgba(255, 230, 0, 0.35), 0 5px 0 rgba(0, 0, 0, 0.85);
}

/* Animated Cursor Arrow on Active Slot */
@keyframes jrpg-cursor {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(-3px); }
}

body[data-theme-layout="jrpg"] .world:hover .wname::before,
:root[data-theme-layout="jrpg"] .world:hover .wname::before {
  content: "► ";
  color: #ffcc00;
  display: inline-block;
  animation: jrpg-cursor 0.5s steps(2, end) infinite;
}

/* Item Relic Icon Slot */
body[data-theme-layout="jrpg"] .icon-slot,
:root[data-theme-layout="jrpg"] .icon-slot {
  width: 60px;
  height: 60px;
  background: #090c24;
  border: 2px solid #e6c653;
  box-shadow: inset 0 0 0 1px #7a6320;
}

/* Inventory Item Details */
body[data-theme-layout="jrpg"] .wname,
:root[data-theme-layout="jrpg"] .wname {
  color: #ffffff;
  font-size: 0.78rem;
  letter-spacing: 0.05em;
  text-shadow: 1px 1px 0 #000000;
}

body[data-theme-layout="jrpg"] .badge,
:root[data-theme-layout="jrpg"] .badge {
  background: #e6c653;
  color: #101438;
  border: 1px solid #7a6320;
  font-size: 0.5rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  box-shadow: 1px 1px 0 #000000;
}

body[data-theme-layout="jrpg"] .blurb,
:root[data-theme-layout="jrpg"] .blurb {
  color: #c8d4ff;
  font-family: 'Press Start 2P', monospace;
  font-size: 0.65rem;
  line-height: 1.6;
  margin: 0.4rem 0 0.65rem;
}

body[data-theme-layout="jrpg"] .chip,
:root[data-theme-layout="jrpg"] .chip {
  background: rgba(16, 20, 56, 0.85);
  color: #e6c653;
  border: 1px solid #7a6320;
  font-size: 0.52rem;
  box-shadow: 1px 1px 0 #000000;
  letter-spacing: 0.04em;
}

/* System Footer */
body[data-theme-layout="jrpg"] footer,
:root[data-theme-layout="jrpg"] footer {
  margin-top: 2.8rem;
  color: #8c9cd0;
  font-size: 0.62rem;
  line-height: 1.7;
}

body[data-theme-layout="jrpg"] .press,
:root[data-theme-layout="jrpg"] .press {
  color: #ffcc00;
  font-size: 0.65rem;
  letter-spacing: 0.18em;
}

/* Accessibility Focus Ring */
body[data-theme-layout="jrpg"] a:focus-visible,
body[data-theme-layout="jrpg"] button:focus-visible,
:root[data-theme-layout="jrpg"] a:focus-visible,
:root[data-theme-layout="jrpg"] button:focus-visible {
  outline: 3px solid #ffe600;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  body[data-theme-layout="jrpg"] *,
  body[data-theme-layout="jrpg"] *::before,
  body[data-theme-layout="jrpg"] *::after {
    animation: none !important;
    transition: none !important;
  }
}
