/* Ocean-blue menus and glass-like movement, inspired by Persona 3 Reload. */
:root { --game-cyan:#45e6ff; --game-blue:#0958ec; }
.chapter-nav { display:flex; flex-wrap:wrap; align-items:center; gap:7px; padding:12px 32px; background:rgba(2,12,44,.7); border-bottom:1px solid #3adcff44; }
.chapter-nav a { display:flex; align-items:center; gap:10px; position:relative; min-height:44px; padding:9px 21px 9px 13px; color:#beeefe; background:#071c4dc9; border-left:2px solid #40caff66; text-decoration:none; font-size:16px; font-weight:700; font-style:italic; text-transform:uppercase; letter-spacing:1px; transition:background .16s,color .16s,transform .16s; }
.chapter-nav a span { font-size:12px; font-style:normal; opacity:.65; }
.chapter-nav a:hover,.chapter-nav a:focus-visible { background:#36dfff;color:#031632;transform:translateY(-2px); }
.chapter-nav a[aria-current] { color:#071331; background:#f3fbff; border-left-color:#ed2647; box-shadow:5px 4px 0 #065fec; }
.chapter-nav a[aria-current]::after { content:'';position:absolute;right:0;top:0;border-top:10px solid #31d9f8;border-left:10px solid transparent; }
.page-title { text-shadow:3px 3px 0 #0059be; }
.page-back,.read-more-btn,.persona-btn,.site-setting-btn { position:relative;overflow:hidden; }
.page-back,.read-more-btn { background:#053c85b3;border-color:#4edcff99; }
.page-back:hover,.read-more-btn:hover,.site-setting-btn:hover { background:#38ddff;color:#041432;border-color:#ecfbff; }
.page-back::after,.read-more-btn::after,.persona-btn::after { content:'';position:absolute;pointer-events:none;inset:-70% -20%;background:linear-gradient(110deg,transparent 42%,#c4ffff77 49%,transparent 55%);transform:translateX(-120%); }
.page-back:hover::after,.read-more-btn:hover::after,.persona-btn:hover::after { animation:buttonShine .55s ease-out; }
@keyframes buttonShine { to {transform:translateX(120%);} }
.menu-number { position:relative;z-index:2;color:#45dcff;font-size:13px;min-width:26px;margin-right:6px;font-weight:700; }
.menu-item.active .menu-number { color:#031b54; }
.menu-item.active::before { background:linear-gradient(105deg,#fff 0 5%,#3ddfff 5% 83%,#72f1ff 83%) !important; }
.menu-item.active .menu-item-text { color:#061b51;text-shadow:2px 2px 0 #b3faff; }
.menu-item.active .cursor-tri { border-left-color:#fff; }
.menu-hint { display:flex;align-items:center;gap:8px;margin:22px 0 0 29px;color:#b9eaff;font-size:14px;letter-spacing:1px; }
.menu-hint kbd { display:inline-flex;align-items:center;justify-content:center;min-width:24px;padding:3px 6px;background:#021a43b3;border:1px solid #66cefa77;font:inherit;color:#fff; }
.prism-effects { position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden; }
.prism-effects::before { content:'';position:absolute;inset:-30%;background:conic-gradient(from 180deg at 75% 0%,transparent 0deg,#58dcff14 12deg,transparent 24deg,#69dfff18 36deg,transparent 50deg);animation:refractionDrift 18s ease-in-out infinite alternate; }
.prism-shard { position:absolute;left:var(--shard-x);top:var(--shard-y);width:var(--shard-size);height:calc(var(--shard-size) * 1.8);background:linear-gradient(125deg,#bcfbff88,#17d7ef22 55%,#0c60db77);clip-path:polygon(30% 0,100% 20%,63% 100%,0 75%);animation:prismDrift var(--shard-time) ease-in-out var(--shard-delay) infinite;opacity:.5; }
.prism-shard:nth-child(3n) { background:linear-gradient(145deg,#ff90d966,#187aff22); }
@keyframes prismDrift { 0%,100% {transform:translate3d(0,10px,0) rotate(-14deg);opacity:.18;} 50% {transform:translate3d(22px,-50px,0) rotate(20deg);opacity:.6;} }
@keyframes refractionDrift { from {transform:translateX(-3%) rotate(-6deg);opacity:.3;} to {transform:translateX(3%) rotate(6deg);opacity:.8;} }
.selection-ring { position:fixed;width:24px;height:24px;margin:-12px 0 0 -12px;z-index:10001;border:2px solid #76efff;border-radius:50%;pointer-events:none;animation:selectionPulse .6s ease-out forwards; }
@keyframes selectionPulse { to {transform:scale(3.5);opacity:0;} }
.site-controls { gap:8px;background:#020b24c9;padding:6px;border-top:1px solid #32dfff55;backdrop-filter:blur(10px); }
.site-setting-btn { font-size:13px;letter-spacing:1px;padding:10px 12px; }
.scene-toggle { color:#7decff; }
.scene-toggle[aria-pressed=true] { background:#e1faff;color:#00244c; }
.scene-view .page-wrap,.scene-view .menu-side,.scene-view .identity-tag,.scene-view .mobile-hero-spacer { visibility:hidden;pointer-events:none; }
.scene-view .menu-preview { opacity:0; }
.scene-view .bg-grid { opacity:0; }
.scene-view .scene-background::after { opacity:.3; }
.scene-background::after { transition:opacity .3s; }
.quest-grid { align-items:start; }
.has-scene .page-body { padding-bottom:110px; }
@media (max-width:768px) {
  .chapter-nav { padding:10px 16px;gap:7px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)); }
  .chapter-nav a { font-size:14px;padding:9px 7px;gap:6px;letter-spacing:0; }
  .chapter-nav a span { font-size:12px; }
  .site-controls { right:8px;bottom:8px;gap:4px;max-width:calc(100vw - 16px); }
  .site-setting-btn { font-size:12px;padding:9px 10px; }
  .menu-item { padding-left:17px; }
  .menu-number { min-width:18px;margin-right:5px; }
  .menu-item.active .menu-item-text { font-size:30px !important; }
  .menu-hint { display:none; }
  .scene-view .hero-artwork,.scene-view .hero-character-layer { position:fixed; }
  .scene-view.home-page #mainScreen { position:fixed;inset:0; }
  .scene-view .hero-artwork,.scene-view .hero-character-layer { background-size:auto 100vh;background-position:22% center; }
  .prism-shard:nth-child(n+5) { display:none; }
}
@media (max-width:360px) {
  .menu-item .menu-item-text { font-size:25px !important;letter-spacing:2px; }
  .menu-item.active .menu-item-text { font-size:27px !important;letter-spacing:2px; }
}
html[data-motion=reduced] .selection-ring { display:none; }
