:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#faf9f5;color:#141413}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}
.portfolio-return { font:400 9px var(--px); color:var(--cream); text-decoration:none; padding:8px; }
.portfolio-return:focus-visible { outline:3px solid var(--teal); }

#side .portfolio-return { display:block; margin-top:18px; padding:12px 0; border-top:1px solid #a9b0e855; line-height:1.6; }

.portfolio-mode-switch { position:fixed; right:max(16px,env(safe-area-inset-right)); bottom:max(16px,env(safe-area-inset-bottom)); z-index:100; display:flex; gap:4px; padding:5px; border:1px solid #c9cec7; border-radius:999px; background:#f8f8f6; box-shadow:0 3px 15px #0002; font:500 13px/1.3 Inter,system-ui,sans-serif; letter-spacing:normal; }
.portfolio-mode-switch a, .portfolio-mode-switch span { padding:9px 13px; border-radius:999px; text-decoration:none; color:#1a1a1a; }
.portfolio-mode-switch [aria-current] { background:#2d7a3a; color:white; font-weight:700; }
.portfolio-mode-switch a:focus-visible { outline:3px solid #2d7a3a; outline-offset:2px; }

.portfolio-mode-switch > a, .portfolio-mode-switch > span { display:inline-flex; align-items:center; gap:6px; }
.portfolio-mode-switch .mode-label { padding:0; border-radius:0; color:inherit; }
.portfolio-mode-switch .mode-icon { flex:none; }

.portfolio-mode-switch > a, .portfolio-mode-switch > span { width:44px; height:44px; padding:0; justify-content:center; box-sizing:border-box; }
.portfolio-mode-switch .mode-icon { display:block; }

.pixel-mode-switch { border-radius:0; border:2px solid #f4f0e0; background:#161c6a; padding:4px; gap:4px; box-shadow:0 0 0 2px #0b0d30,4px 4px 0 2px #0b0d30; }
.pixel-mode-switch > a, .pixel-mode-switch > span { border-radius:0; color:#f4f0e0; }
.pixel-mode-switch [aria-current] { background:#2d7a3a; box-shadow:inset 0 0 0 2px #9debb0; }
.pixel-mode-switch a:hover { background:#2a3a9c; }
.pixel-mode-switch a:focus-visible { outline:2px solid #ffd84a; outline-offset:2px; }

.panel.live-case-panel { width:min(900px,100%); height:calc(100% - 12px); max-height:100%; display:flex; flex-direction:column; }
.live-case-panel .panel-body { padding:0; flex:1; min-height:0; overflow:hidden; }
.live-case-frame { display:block; width:100%; height:100%; border:0; background:#161c6a; }
.live-case-panel > .close { flex:none; margin:12px; }

.live-case-panel .panel-body { padding:22px 24px; overflow:auto; }
.live-case-panel .blocks { display:block; }
.live-case-panel .live-case-frame { height:65vh; min-height:350px; }

.panel.live-case-panel { width:min(760px,100%); }
.live-case-panel .meta, .live-case-panel h3 { max-width:62ch; }

.live-case-panel .live-case-frame { background:#252f88; color-scheme:dark; }

.panel .live-content .game-number { font-family:monospace; font-size:.92em; font-weight:600; }
.live-content { color:#f4f0e0; font:400 16px/1.35 var(--txt); background:none; }
.live-content .section { padding:16px 0; border-top:2px dashed #5b64c8; }
.live-content .section:first-child { border-top:0; padding-top:0; }
.live-content h2 { font:400 10px/1.6 var(--px); color:#58b5a8; text-transform:uppercase; margin:0 0 12px; }
.live-content h3 { font:600 17px/1.3 var(--txt); color:#f4f0e0; margin:16px 0 8px; }
.live-content p,.live-content ul,.live-content ol,.live-content blockquote { max-width:62ch; }
.panel .live-content p { margin:0 0 20px; }
.live-content ul,.live-content ol { padding-left:20px; display:grid; gap:6px; }
.live-content li { font:400 16px/1.35 var(--txt); }
.live-content li::marker { color:#58b5a8; }
.live-content a { color:#9debb0; }
.live-content img { max-width:100%; height:auto; }
.live-content .game-illustration { margin:18px 0; }
.live-content .game-illustration figcaption { font-size:14px; color:#a9b0e8; margin-top:8px; }
.live-content .term { border-bottom:1px dotted #9debb0; }
.live-case-panel .panel-body { overflow-y:auto; }

.list button > span:last-child { flex:1; min-width:0; }
.list .quest-meta { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 10px; width:100%; }
.list .quest-location { margin-left:auto; text-align:right; }

.list button { padding-top:12px; padding-bottom:12px; }
.list .quest-meta { margin-top:6px; }

.live-content blockquote { margin:12px 0 20px; padding:10px 14px; background:rgba(0,0,0,.25); box-shadow:inset 4px 0 0 var(--tone,#58b5a8); }
.live-content blockquote p { font-style:italic; margin-bottom:8px; }
.live-content blockquote cite { display:block; font:400 14px/1.35 var(--txt); color:var(--dim); font-style:normal; }

/* Match the original compact game narrative layout. */
.live-content .section { display:block; padding:20px 0; margin:0; border-top:2px dashed #5b64c8; }
.live-content .section:first-child { padding-top:0; border-top:0; }
.live-content h2 { font:400 10px/1.6 var(--px); color:#58b5a8; margin:0 0 18px; text-transform:uppercase; }
.live-content h3 { font:600 17px/1.3 var(--txt); margin:18px 0 10px; letter-spacing:.02em; }
.live-content ul { margin:8px 0 14px; gap:8px; }
.live-content li { line-height:1.35; }
.panel .live-content p { margin:0 0 20px; line-height:1.35; }
.live-content .section > :last-child { margin-bottom:0; }

.panel .live-content .collab-list { max-width:62ch; }
.panel .live-content .collab-item { padding:18px 0; }
.panel .live-content .collab-item + .collab-item { border-top:2px dashed #5b64c8; }
.panel .live-content .collab-role { font:600 17px/1.3 var(--txt); color:var(--cream); margin:0 0 10px; letter-spacing:.02em; }
.panel .live-content .collab-desc { font:400 16px/1.35 var(--txt); }
.panel .live-content h1, .panel .live-content h2, .panel .live-content h4 {
  font:400 10px/1.6 var(--px); color:#58b5a8;
  text-transform:uppercase; text-shadow:none; letter-spacing:.02em; margin:0 0 18px;
}
.panel .live-content h3, .panel .live-content h5, .panel .live-content h6 {
  font:600 17px/1.3 var(--txt); color:var(--cream);
  text-transform:none; text-shadow:none; letter-spacing:.02em; margin:18px 0 10px;
}