/* Full-screen game title, then a quiet interface around the pixel-art adventure. */
.journey-page{--ui-font:-apple-system,BlinkMacSystemFont,"Segoe UI","Yu Gothic UI","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-family:var(--ui-font);background-image:none;background:#090e16;color:#edf1f5}
.journey-page .topbar{border-bottom-color:#ffffff13;background:#090e16f5;padding-block:15px;max-width:1200px}
.journey-page .brand{font-size:19px;color:#eee7d5;letter-spacing:.03em}
.journey-page .brand{display:inline-flex;align-items:center;flex-shrink:0}
.journey-page .brand img{display:block;width:164px;height:auto}
.journey-page[data-screen="intro"] .brand img{width:190px}
.journey-page:not([data-screen="intro"]) .topbar{padding-block:6px;min-height:60px}
.journey-page:not([data-screen="intro"]) .brand img{width:116px}
.journey-page .local-label{font:11px/1.5 var(--ui-font);letter-spacing:.04em;background:transparent;border:0;color:#afbac9;padding:0}
.journey-page .sound-toggle{width:40px;height:40px;border:1px solid #ffffff25;border-radius:50%;background:#0b142480;box-shadow:none;font:18px var(--ui-font)}
.journey-page .sound-toggle:hover{background:#ffffff15;outline:none;border-color:#d7dfeb}
.journey-page .primary,.journey-page .secondary{font:500 14px/1.5 var(--ui-font);letter-spacing:.02em;box-shadow:none;border-radius:3px;min-height:44px;padding:11px 21px;transition:background .18s,border-color .18s,color .18s}
.journey-page .primary{background:#e9dfc8;color:#16202d;border-color:#e9dfc8}
.journey-page .primary:hover{background:#fff2d8;border-color:#fff2d8}
.journey-page .secondary{background:#ffffff05;color:#d4deeb;border-color:#ffffff30}
.journey-page .secondary:hover{background:#ffffff0d;border-color:#a2b7cc}
.journey-page .text-button{font:13px/1.5 var(--ui-font);color:#afc0d0}
.journey-page .panel{background:#101925;border-color:#ffffff28;box-shadow:none}
.journey-page .profile-panel,.journey-page .condition-panel{margin:45px auto 24px;padding:clamp(24px,4vw,44px);border-radius:5px}
.journey-page h1[tabindex="-1"]:focus{outline:none}
.journey-page .profile-panel{max-width:680px;margin-top:28px;padding:30px 40px}
.journey-page .profile-panel>.eyebrow,.journey-page .profile-panel>h1{text-align:center}
.journey-page .profile-panel form{max-width:440px;margin:24px auto 0}
.journey-page .player-name-field{display:block;max-width:none;margin:0;font:500 12px/1.7 var(--ui-font);color:#b5c2d2}
.journey-page .avatar-field{border:0;padding:0;margin:24px 0}
.journey-page .avatar-field legend{padding:0;margin-bottom:12px;font:500 12px/1.7 var(--ui-font);color:#b5c2d2}
.journey-page .profile-panel form>.primary{width:100%}
.journey-page .player-name-field input{border:1px solid #566476;background:#080f18;border-radius:3px;padding:13px 15px;color:#f3f4f6;font:18px/1.5 var(--ui-font)}
.journey-page .avatar-option{background:#0b131e;border:1px solid #ffffff24;border-radius:4px;box-shadow:none}
.journey-page .avatar-option:has(input:checked){border-color:#e9dfc8;background:#dfc58e0a;box-shadow:inset 0 0 0 1px #e9dfc860}
.journey-page .condition-option{border-radius:3px;border-color:#ffffff24;background:#0c1521;box-shadow:none;font:14px/1.7 var(--ui-font)}
.journey-page .condition-option:has(input:checked){border-color:#d6c399;background:#dfc58e0a}
.journey-page .game-screen{border-color:#5d7085;box-shadow:0 16px 50px #0004;background:#0c1623;border-radius:2px}
.journey-page .novel-dialogue{background:#111e30;border-color:#53647b;box-shadow:none}
.journey-page .novel-dialogue .scene-actions .primary{font:500 13px/1.5 var(--ui-font);border:1px solid #6a8097;background:#25384d;box-shadow:none;border-radius:2px}
.journey-page .choice{box-shadow:none;border-radius:2px;transition:background .15s,border-color .15s}
.journey-page .result-section.panel,.journey-page .job{border-radius:4px;box-shadow:none}
.journey-page footer{border-top-color:#ffffff14;font:11px/1.8 var(--ui-font);color:#91a0b3;margin-top:32px}
.journey-page .source-drawer{font:12px/1.85 var(--ui-font)}

.journey-page[data-screen="intro"] .topbar{position:absolute;inset:0 0 auto;z-index:10;max-width:none;width:100%;margin:0;border:0;background:transparent;padding:25px 5vw}
.journey-page[data-screen="intro"] main{max-width:none;margin:0;padding:0;scroll-margin-top:0}
.title-screen{position:relative;isolation:isolate;display:flex;align-items:center;min-height:100svh;padding:120px 7vw 110px;overflow:hidden;background:#070d16}
.title-movie{position:absolute;z-index:-3;inset:0;width:100%;height:100%;object-fit:cover;object-position:66% center;pointer-events:none}
.title-scrim{position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,#03080fe8 0%,#03080fc9 30%,#03080f52 64%,#03080f26),linear-gradient(0deg,#070d16 0%,transparent 23%,#03080f40 100%)}
.title-scrim:after{content:"";position:absolute;inset:0;background-image:radial-gradient(#0008 .7px,transparent .8px);background-size:3px 3px;opacity:.65}
.title-copy{position:relative;width:min(760px,65vw);text-shadow:0 2px 18px #0008}
.title-kicker{display:flex;align-items:center;gap:13px;color:#e2d3b3;font:500 14px/1.6 var(--ui-font);letter-spacing:.12em;margin-bottom:24px}
.title-kicker:before{content:"";flex:0 0 34px;height:1px;width:34px;background:#c7b389}
.title-copy h1{font:400 clamp(38px,5.1vw,66px)/1.45 var(--pixel);letter-spacing:.025em;color:#fff9ec;margin:0 0 25px}
.title-copy h1.title-logo{width:min(650px,100%);line-height:0;margin:0 0 22px}
.title-logo img{display:block;width:100%;height:auto;filter:drop-shadow(0 5px 14px #0009)}
.title-lead{font:400 clamp(16px,1.5vw,20px)/2 var(--ui-font);color:#d2d9e2;letter-spacing:.025em;max-width:590px}
.journey-page .title-start{display:inline-flex;align-items:center;justify-content:space-between;gap:38px;min-width:286px;min-height:58px;margin-top:35px;padding:15px 25px;border-radius:2px;font:600 17px/1.5 var(--ui-font);letter-spacing:.08em;background:#ece2cc;color:#17202c;border:1px solid #f9ecd0;text-shadow:none;box-shadow:0 8px 32px #0003}
.title-duration{margin:13px 0 0;color:#b8c3d0;font:400 14px/1.6 var(--ui-font);letter-spacing:.04em}
.title-start svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.4;transition:transform .18s}
.title-start:hover svg{transform:translateX(4px)}
.title-motion{position:absolute;right:5vw;bottom:34px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid #ffffff50;background:#07101b70;color:#fff;font:18px/1 var(--ui-font);box-shadow:none}
.title-motion:hover{background:#ffffff20}
.title-motion[hidden]{display:none}
.title-notes{max-width:1100px;margin:0 auto;padding:12px 24px 0}
.journey-page .title-notes .source-drawer{margin:0;padding:14px 0;border-bottom:1px solid #ffffff15;color:#92a3b7}
.rules-panel{max-width:650px;margin:52px auto;padding:clamp(28px,5vw,54px)!important;border-radius:5px}
.rules-panel .eyebrow{font:500 11px/1.5 var(--ui-font);letter-spacing:.13em;color:#b9c5d6}
.rules-panel h1{font:30px/1.6 var(--pixel);color:#f0e3c6;margin:0 0 28px}
.rules-copy{font:16px/2.1 var(--ui-font);color:#d7dfe9;max-width:470px}
.rules-copy p+p{margin-top:16px;color:#aebed0;font-size:14px}
.rules-panel .scene-actions{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:36px}
.rules-panel .text-button{background:none;border:0;padding-inline:0}
@media(min-width:1600px){.title-copy{margin-left:max(0px,calc((100vw - 1480px)/2 - 7vw))}}
@media(max-width:700px){
  .journey-page[data-screen="intro"] .topbar{padding:20px 22px}
  .journey-page[data-screen="intro"] .brand{font-size:16px}.journey-page[data-screen="intro"] .local-label{display:none}
  .journey-page .brand img{width:140px}.journey-page[data-screen="intro"] .brand img{width:160px}
  .title-screen{align-items:flex-end;min-height:100svh;padding:105px 26px 88px}
  .title-movie{object-position:center center}
  .title-scrim{background:linear-gradient(0deg,#070d16 0%,#050c15e6 17%,#050c159c 48%,#050c1533 78%,#050c1566 100%)}
  .title-copy{width:100%;text-shadow:0 2px 16px #0009}
  .title-kicker{font-size:12px;letter-spacing:.06em;gap:10px;margin-bottom:17px}.title-kicker:before{width:24px;flex-basis:24px}
  .title-copy h1{font-size:clamp(29px,8.2vw,46px);line-height:1.55;letter-spacing:.015em;margin-bottom:16px}
  .title-copy h1.title-logo{width:100%;margin-bottom:18px;line-height:0}
  .title-lead{font-size:15px;line-height:1.9;letter-spacing:.01em}
  .journey-page .title-start{min-width:0;width:100%;min-height:54px;margin-top:25px;font-size:16px;padding:14px 20px}
  .title-motion{right:24px;bottom:24px;width:32px;height:32px;font-size:15px}
  .journey-page .profile-panel,.journey-page .condition-panel,.rules-panel{margin:18px auto;padding:25px}
  .rules-panel h1{font-size:26px}.rules-copy{font-size:15px}.rules-panel .scene-actions{gap:12px}
  .journey-page footer{padding-inline:24px}
}
@media(max-height:620px) and (min-width:701px){.title-screen{padding-block:100px 65px}.title-copy h1{font-size:44px;margin-bottom:16px}.title-kicker{margin-bottom:14px}.journey-page .title-start{margin-top:22px}}
@media(max-height:620px) and (min-width:701px){.title-copy h1.title-logo{width:min(480px,100%);margin-bottom:16px}}
@media(prefers-reduced-motion:reduce){.title-start svg,.journey-page .choice,.journey-page .primary{transition:none}}

/* Dialogue commands keep the familiar lower-right position of the RPG window. */
.journey-page :is(.novel-dialogue,.era-caption) .scene-actions .primary{
  position:relative;isolation:isolate;min-height:44px;max-width:100%;
  padding:9px 22px;border:0;border-radius:0;
  font:400 16px/1.35 var(--pixel);letter-spacing:.05em;
  color:#e9f8ff;background:#76bfd4;text-shadow:0 1px 2px #0009;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  box-shadow:none;filter:drop-shadow(0 0 5px #65c7e52b);
  transition:background .16s,filter .16s,color .16s;
}
.journey-page :is(.novel-dialogue,.era-caption) .scene-actions .primary:before{
  content:"";position:absolute;z-index:-1;inset:1px;pointer-events:none;
  background:linear-gradient(180deg,#23485f,#10293d 55%,#0b1b2c);
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);
  box-shadow:inset 0 1px #c4f3ff33,inset 0 -3px #0005;
}
.journey-page :is(.novel-dialogue,.era-caption) .scene-actions .primary:after{
  content:"";position:absolute;inset:4px;pointer-events:none;
  border-top:1px solid #c0f1ff30;border-bottom:1px solid #8ed5e836;
}
.journey-page :is(.novel-dialogue,.era-caption) .scene-actions .primary:hover{
  background:#b8efff;color:#fff;filter:drop-shadow(0 0 7px #65c7e55c);
}
.journey-page :is(.novel-dialogue,.era-caption) .scene-actions .primary:focus-visible{
  background:#f2d39b;outline:1px solid #ffefc1;outline-offset:-4px;
  filter:drop-shadow(0 0 7px #e9c99066);
}
.journey-page :is(.novel-dialogue,.era-caption) .scene-actions .primary:active:before{
  background:linear-gradient(180deg,#102b40,#1e4257);
}
.journey-page :is(.novel-dialogue,.era-caption) .scene-actions .primary:disabled{
  background:#537282;color:#a0b6c1;filter:none;
}
@media(max-width:700px){
  .journey-page :is(.novel-dialogue,.era-caption) .scene-actions .primary{font-size:14px;padding:9px 18px}
}

/* A story cut replaces the scene, using the same dialogue and advance control. */
.journey-page .port-terminal{position:absolute;inset:0;z-index:12;background:#060d17;overflow:hidden}
.journey-page .port-terminal[hidden]{display:none}
.journey-page .port-terminal>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 43.4%;image-rendering:pixelated}
.journey-page .port-terminal-log{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(8px,1.6vh,16px);text-align:center;color:#a9d5e0;font-family:var(--pixel);text-shadow:0 0 9px #69deff4d}
.journey-page .port-terminal-log>span{font-size:clamp(13px,1.5vw,18px);letter-spacing:.12em}
.journey-page .port-terminal-log>strong{font-size:clamp(22px,3.3vw,38px);font-weight:400;color:#f8d193;white-space:nowrap;letter-spacing:.06em}
.journey-page .port-terminal-log>small{font-size:clamp(11px,1.2vw,14px);color:#7e9baa}
.journey-page [data-port-mode="terminal"]>:is(.standing-hero,.standing-companion,.journey-boss,.actor-name,.actor-shadow,.gift-effects,.scene-effects){visibility:hidden}