:root{--x-accent:#d8b36d;--x-danger:#b86262;--x-ink:#0a0d10;--x-panel:#11161b;--x-line:#2b333b;--x-soft:#98a1a8}
body.no-motion *,body.no-motion *::before,body.no-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.start-screen{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:max(20px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:radial-gradient(circle at 50% 18%,rgba(55,63,69,.24),transparent 34%),linear-gradient(180deg,#080b0e 0%,#0d1115 60%,#07090b 100%);overflow:hidden}.start-screen.hidden{display:none!important}.start-noise{position:absolute;inset:-20%;pointer-events:none;opacity:.14;background-image:repeating-radial-gradient(circle at 30% 20%,rgba(255,255,255,.12) 0 1px,transparent 1px 4px);transform:rotate(7deg);animation:xgrain 8s steps(8) infinite}.start-card{position:relative;width:min(560px,100%);padding:38px 34px 30px;border:1px solid rgba(216,179,109,.22);background:linear-gradient(180deg,rgba(19,24,29,.95),rgba(9,12,15,.97));box-shadow:0 35px 100px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.03);text-align:center}.start-time{font:700 clamp(54px,10vw,96px)/1 Georgia,serif;letter-spacing:.12em;color:#efd39b;text-shadow:0 0 28px rgba(216,179,109,.12)}.start-line{width:70px;height:1px;margin:18px auto;background:linear-gradient(90deg,transparent,#8d7854,transparent)}.start-card h1{margin:0 0 12px;font-size:22px;letter-spacing:.22em;font-weight:500}.start-card p{margin:0 auto 24px;max-width:440px;color:#aab1b6;font-size:14px;line-height:1.9}.start-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.start-actions button{min-height:48px;border-radius:3px;border:1px solid #333c44;background:#151b20;color:#e9e8e1;padding:11px 14px;letter-spacing:.08em}.start-actions .start-primary{grid-column:1/-1;background:linear-gradient(180deg,#d7b46f,#b68e4d);border-color:#e0bd77;color:#17130c;font-weight:700}.start-actions .start-danger{color:#d38d8d;border-color:rgba(184,98,98,.38);background:rgba(92,34,34,.13)}.start-actions button:disabled{opacity:.35;cursor:not-allowed}.start-tip{margin-top:20px;color:#68727a;font-size:11px;letter-spacing:.08em}.settings-sheet{position:fixed;inset:0;z-index:2100;display:grid;place-items:center;padding:18px;background:rgba(0,0,0,.72);backdrop-filter:blur(8px)}.settings-card{position:relative;width:min(440px,100%);background:#11161b;border:1px solid #2a323a;padding:28px 24px 22px;box-shadow:0 30px 80px rgba(0,0,0,.5)}.settings-kicker{font:700 12px/1 Georgia,serif;letter-spacing:.22em;color:#b89b64}.settings-card h2{margin:8px 0 20px;font-weight:500}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 0;border-top:1px solid #222a31;color:#cdd1d1;font-size:14px}.setting-range{align-items:center}.setting-range input{width:170px}.settings-note{font-size:12px;color:#7f8990;line-height:1.7;margin:16px 0 0}.danger-ghost{color:#d58f8f!important;border-color:rgba(184,98,98,.35)!important}.bgm-badge{position:absolute;right:10px;bottom:10px;z-index:5;padding:5px 8px;border:1px solid rgba(255,255,255,.12);background:rgba(7,9,11,.62);backdrop-filter:blur(5px);font-size:10px;letter-spacing:.08em;color:#c7c9c5;pointer-events:none}.fact-map{display:grid;gap:18px}.fact-map-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-end;padding-bottom:12px;border-bottom:1px solid #2b333b}.fact-map-head strong{font:700 24px/1 Georgia,serif;color:#e6c27c}.fact-map-head span{font-size:12px;color:#8d969d}.fact-chains{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:12px;overflow-x:auto;padding:3px 2px 12px}.fact-chain{min-width:150px;border:1px solid #273039;background:#0e1317;padding:12px}.fact-chain h3{margin:0 0 11px;font-size:13px;letter-spacing:.08em;color:#d9bd85}.fact-node{position:relative;margin:0 0 9px;padding:9px 9px 9px 12px;border-left:2px solid #35404a;background:#151b20;color:#79838a;font-size:12px;line-height:1.55}.fact-node::after{content:"";position:absolute;left:-2px;bottom:-9px;width:1px;height:9px;background:#323b43}.fact-node:last-child::after{display:none}.fact-node.known{border-left-color:#caa860;color:#e2e2dd;background:#171b1e}.fact-node.cross{box-shadow:inset 0 0 0 1px rgba(216,179,109,.18)}.fact-node small{display:block;color:#738089;margin-top:4px}.chain-status{margin-top:9px;font-size:11px;color:#69737a}.chain-status.done{color:#90b39a}.fact-map-legend{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:12px;color:#89939a}.fact-map-legend span{padding:8px 10px;background:#0e1317;border:1px solid #252d34}.exp-log{border-left:2px solid #b49a68!important;background:linear-gradient(90deg,rgba(180,154,104,.08),transparent)!important}.exp-log .time{color:#b49a68!important}.story-choice{margin-top:10px;padding:10px 12px;border:1px solid #2a333b;background:#10161a;color:#bcc3c6;font-size:12px;line-height:1.6}.ending-route{margin-top:14px;padding:10px 12px;border:1px solid rgba(216,179,109,.24);background:rgba(216,179,109,.06);font-size:12px;color:#c9c6bc}.reset-confirm{display:grid;gap:12px}.reset-confirm .warning{padding:12px;border-left:2px solid #a95757;background:rgba(140,50,50,.08);color:#d2a1a1}.reset-confirm .actions{display:flex;gap:8px;justify-content:flex-end}.reset-confirm button{padding:9px 13px}.life-chip{display:inline-flex;align-items:center;gap:6px;margin:3px 5px 3px 0;padding:5px 8px;border:1px solid #303942;background:#12171c;color:#9ea7ad;font-size:11px}.life-chip b{color:#d7b46f;font-weight:600}
@keyframes xgrain{0%{transform:translate(0,0) rotate(7deg)}25%{transform:translate(2%,-1%) rotate(7deg)}50%{transform:translate(-1%,2%) rotate(7deg)}75%{transform:translate(1%,1%) rotate(7deg)}100%{transform:translate(0,0) rotate(7deg)}}
@media(max-width:900px){.fact-chains{grid-template-columns:repeat(5,220px)}.scene-actions{grid-template-columns:repeat(4,minmax(0,1fr))}.status-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.start-card{padding:30px 18px 22px}.start-actions{grid-template-columns:1fr}.start-actions .start-primary{grid-column:auto}.scene-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.scene-actions button{min-height:42px}.status-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.fact-map-legend{grid-template-columns:1fr}.bgm-badge{font-size:9px}.settings-card{padding:26px 18px 20px}.setting-range{align-items:flex-start;flex-direction:column}.setting-range input{width:100%}}
@media(orientation:landscape) and (max-height:520px){.start-screen{place-items:start center;overflow:auto}.start-card{margin:auto 0;padding:20px 24px}.start-time{font-size:48px}.start-card p{margin-bottom:14px}.start-tip{margin-top:12px}.scene-wrap{max-height:58vh}.settings-sheet{align-items:start;overflow:auto}.settings-card{margin:auto 0}}

/* 2026-08 mobile/tablet release pass */
html{min-height:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-height:100dvh;padding:0 env(safe-area-inset-right) 0 env(safe-area-inset-left)}
button,.idea,.text-btn{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
textarea,input,button{max-width:100%}
.topbar{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right));padding-top:env(safe-area-inset-top);height:calc(64px + env(safe-area-inset-top))}
.modal,.ending,.settings-sheet{padding-top:max(14px,env(safe-area-inset-top));padding-right:max(14px,env(safe-area-inset-right));padding-bottom:max(14px,env(safe-area-inset-bottom));padding-left:max(14px,env(safe-area-inset-left))}
.modal-card,.settings-card{max-height:calc(100dvh - max(28px,env(safe-area-inset-top) + env(safe-area-inset-bottom)))}
.scene-actions button,.start-actions button,.reset-confirm button{min-height:44px}
.input-row textarea{font-size:16px}

/* Tablet portrait: keep the reading flow vertical, but use the width instead of stretching cards edge-to-edge. */
@media (min-width:600px) and (max-width:900px) and (orientation:portrait){
  .layout{max-width:820px;padding:12px;gap:12px}
  .scene-panel,.console-panel{border-radius:12px}
  .scene-meta{grid-template-columns:1fr 1fr}
  .console-panel{height:min(650px,62dvh);min-height:540px}
  .scene-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
  .scene-actions button{width:100%}
  .status-strip{grid-template-columns:repeat(4,minmax(0,1fr))}
  .fact-chains{grid-template-columns:repeat(5,240px);scroll-snap-type:x proximity}
  .fact-chain{scroll-snap-align:start}
}

/* Tablet landscape: restore a deliberate two-panel desk instead of a blown-up phone layout. */
@media (min-width:760px) and (max-width:1180px) and (orientation:landscape){
  .layout{grid-template-columns:minmax(0,1.35fr) minmax(330px,.72fr);max-width:1180px;gap:12px;padding:12px}
  .scene-panel,.console-panel{order:initial}
  .console-panel{height:calc(100dvh - 88px);min-height:560px}
  .scene-wrap{max-height:none}
  .scene-meta{grid-template-columns:1fr}
  .scene-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
  .scene-actions button{width:100%;padding-left:8px;padding-right:8px}
  .status-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .log{min-height:180px}
}

/* Phones in portrait. */
@media (max-width:599px) and (orientation:portrait){
  body{padding-bottom:env(safe-area-inset-bottom)}
  .topbar{height:calc(54px + env(safe-area-inset-top));min-height:calc(54px + env(safe-area-inset-top));padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .layout{padding:8px max(8px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));gap:8px}
  .scene-panel,.console-panel{border-radius:10px}
  .scene-meta{grid-template-columns:1fr}
  .meta-card{min-height:0;padding:9px 10px}
  .scene-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:8px}
  .scene-actions button{width:100%;min-width:0;white-space:normal;line-height:1.25}
  .status-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:8px;gap:6px}
  .status-pill{min-width:0;padding:7px 8px}
  .status-pill span,.status-pill strong{overflow-wrap:anywhere}
  .console-panel{height:min(600px,72dvh);min-height:470px}
  .log{min-height:180px;padding:12px 11px;gap:11px}
  .input-zone{padding:11px max(10px,env(safe-area-inset-right)) max(11px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
  .input-row{grid-template-columns:1fr}
  .input-row .primary{min-height:46px;width:100%}
  .modal{place-items:end center;padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right));padding-bottom:max(8px,env(safe-area-inset-bottom))}
  .modal-card{width:100%;max-height:min(88dvh,760px);border-radius:14px 14px 8px 8px;padding:20px 16px 18px}
  .modal-close{width:44px;height:44px;right:4px;top:3px}
  .fact-chains{display:grid;grid-auto-flow:column;grid-auto-columns:min(82vw,290px);grid-template-columns:none;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding-bottom:14px}
  .fact-chain{min-width:0;scroll-snap-align:center}
  .fact-map-head{align-items:flex-start;flex-direction:column}
  .start-screen{overflow:auto;align-items:start}
  .start-card{margin:auto 0;width:100%;max-width:520px;padding:28px 18px 22px}
  .start-time{font-size:clamp(52px,18vw,78px)}
  .start-actions{grid-template-columns:1fr}
  .start-actions .start-primary{grid-column:auto}
  .settings-sheet{align-items:end;padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right));padding-bottom:max(8px,env(safe-area-inset-bottom))}
  .settings-card{width:100%;border-radius:14px 14px 8px 8px;max-height:88dvh;overflow:auto}
  .ending-card{max-height:calc(100dvh - max(28px,env(safe-area-inset-top) + env(safe-area-inset-bottom)));overflow:auto;padding:8px 2px}
  .ending-card h1{font-size:clamp(30px,10vw,48px)}
}

/* Narrow phones: preserve tap size and prevent the header/status text from colliding. */
@media (max-width:380px) and (orientation:portrait){
  .title{font-size:21px;letter-spacing:.08em}
  .status{font-size:11px;gap:5px}
  .status strong{font-size:21px;min-width:58px}
  .scene-actions{gap:6px}
  .scene-actions button{font-size:11px;padding:7px 5px}
  .status-strip{grid-template-columns:1fr 1fr!important}
  .entry{font-size:12.5px}
  .input-foot{gap:8px;align-items:flex-start}
}

/* Phone landscape: use both axes, with independently scrollable investigation and console panes. */
@media (min-width:600px) and (max-width:950px) and (orientation:landscape) and (max-height:560px){
  .topbar{position:relative;height:calc(48px + env(safe-area-inset-top));min-height:calc(48px + env(safe-area-inset-top));padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .title{font-size:22px}.subtitle{display:none}.status strong{font-size:22px}
  .layout{grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);max-width:none;height:calc(100dvh - 48px - env(safe-area-inset-top));padding:6px max(6px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));gap:7px;overflow:hidden}
  .scene-panel,.console-panel{order:initial;min-height:0;height:100%;overflow:auto;border-radius:9px}
  .scene-wrap{max-height:none;flex:0 0 auto}
  .scene-meta{grid-template-columns:1fr 1fr;gap:6px;padding:6px 6px 0}
  .meta-card{min-height:0;padding:7px 8px}.meta-card p{font-size:11px;line-height:1.45}.meta-label{margin-bottom:3px;font-size:10px}
  .scene-actions{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:6px}
  .scene-actions button{min-height:38px;padding:5px 4px;font-size:10px}
  .objective-title{padding-top:7px}.objective{padding:5px 10px 7px;font-size:11px}
  .status-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:6px;gap:5px}
  .status-pill{padding:5px 7px}.status-pill span{font-size:9px}.status-pill strong{font-size:11px}
  .log{min-height:0;padding:9px;gap:8px}.entry{font-size:11.5px;line-height:1.55}
  .input-zone{padding:7px}.input-zone label{margin-bottom:4px}.input-row{grid-template-columns:1fr auto}.input-row textarea{min-height:48px;max-height:70px}.input-row .primary{min-width:68px;min-height:44px}
  .input-foot{margin-top:4px}
  .modal-card,.settings-card{max-height:calc(100dvh - max(12px,env(safe-area-inset-top) + env(safe-area-inset-bottom)))}
  .start-screen,.settings-sheet{overflow:auto;align-items:start}.start-card,.settings-card{margin:auto 0}
  .start-card{padding:18px 22px}.start-time{font-size:44px}.start-line{margin:9px auto}.start-card h1{font-size:18px;margin-bottom:6px}.start-card p{margin-bottom:10px;line-height:1.55}.start-actions{grid-template-columns:repeat(2,1fr)}.start-actions .start-primary{grid-column:1/-1}.start-actions button{min-height:40px}.start-tip{margin-top:8px}
}


/* Progressive fact graph: undiscovered branches do not reserve visible slots. */
.fact-chains{grid-template-columns:repeat(auto-fit,minmax(170px,220px));justify-content:start;align-items:start}
.fact-map-empty{grid-column:1/-1;display:grid;gap:7px;width:min(100%,560px);padding:20px 18px;border:1px dashed #303942;background:#0e1317;color:#aab2b7;line-height:1.75}
.fact-map-empty b{color:#d8c18f;font-size:13px;letter-spacing:.06em}.fact-map-empty span,.story-muted{color:#7f8990;font-size:12px}.fact-map-note{grid-template-columns:1fr}.locked-life{opacity:.72}
@media(max-width:900px){.fact-chains{grid-template-columns:none!important;grid-auto-flow:column;grid-auto-columns:minmax(210px,78vw);justify-content:start}.fact-map-empty{grid-column:auto;width:min(78vw,520px)}}
@media(max-width:620px){.fact-map-head{align-items:flex-start;flex-direction:column}.fact-map-head>span{align-self:flex-start}.fact-chains{grid-auto-columns:minmax(230px,86vw)}}
