/* The field keeps its scale; phone controls sit in the surrounding hand space. */
.direction-pad.joystick{display:block;perspective:none;border-radius:50%;width:116px;height:116px;pointer-events:auto;touch-action:none;cursor:grab;background:radial-gradient(circle at 50% 45%,#0b111b 0 24%,#1b2530 62%,#39434d 64%,#141c25 69%,#424b52 71%,#19212b 75%);box-shadow:0 4px 8px #0006,inset 0 1px 1px #ffffff18;isolation:isolate}
.joystick:active{cursor:grabbing}
.joystick-thumb{position:absolute;left:50%;top:50%;width:48px;height:48px;border-radius:50%;transform:translate(calc(-50% + var(--stick-x,0px)),calc(-50% + var(--stick-y,0px)));background:radial-gradient(circle at 42% 32%,#69737b,#434d57 58%,#27313c 65%,#56616b 69%,#28313c 74%);box-shadow:0 3px 5px #0008,inset 0 1px 1px #cad4dc4d;pointer-events:none}
.joystick[data-active=true] .joystick-thumb{box-shadow:0 2px 3px #000a,inset 0 1px 1px #cad4dc4d}
.touch-controls .joystick button{position:absolute;width:1px;height:1px;min-width:0;min-height:0;padding:0;overflow:hidden;clip-path:inset(50%);pointer-events:none}
.joystick:focus-within{outline:2px solid #b8a478;outline-offset:4px}
.touch-controls .console-actions{width:64px;height:64px;bottom:8px}
.touch-controls #touchInteract{position:static;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle at 42% 28%,#4b5863,#263442 65%,#55616a 68%,#18232d 74%);box-shadow:0 3px 4px #0008}
.touch-controls #touchInteract:active{transform:translateY(2px);box-shadow:0 1px 2px #0008}
.game-header #touchNotebook{flex:none;pointer-events:auto;width:44px;height:44px;padding:3px;display:grid;place-items:center;touch-action:manipulation;background:none;line-height:1}
.game-header #touchNotebook img{width:38px;height:38px}
.game-header #touchNotebook:active{transform:translateY(1px)}
.game-header{gap:4px}
/* Classic large file icons inside the actual handover folder. */
.pc-screen .pc-icon-explorer{display:block;flex:none;min-height:0!important}
.pc-screen .pc-icon-tree{width:100%;flex-direction:row;flex-wrap:wrap;flex:none;border-right:0;border-bottom:1px solid #a8b1aa;padding:4px}
.pc-screen .pc-icon-tree button{flex:1 1 88px;min-height:44px}
.pc-screen .pc-folder-toggle{width:44px;min-width:44px;height:44px;display:grid;place-items:center;margin-left:auto;padding:0!important;flex:none}
.pc-screen .pc-file-icons{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px;padding:4px;flex:none;overflow:visible;align-content:start}
.pc-screen .pc-file-icon{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;width:100%;min-height:96px;padding:4px;background:none;border:0;color:#27353b;text-align:center;font-size:14px;line-height:1.4}
.pc-screen .pc-file-icon .pc-symbol-document{width:34px;height:44px;margin:0;background:linear-gradient(90deg,transparent 7px,#9aa9b44a 7px 8px,transparent 8px),#f9f7ef;box-shadow:1px 2px 0 #a1a8ab,inset 0 -12px #e2e6e6}
.pc-file-icon .pc-symbol-document::before{content:'';position:absolute;right:-1px;top:-1px;width:10px;height:10px;background:linear-gradient(45deg,#b9c7cc 48%,#f2f2e9 50%);border-left:1px solid #81939d;border-bottom:1px solid #81939d}
.pc-file-icon .pc-symbol-document::after{content:'';position:absolute;left:12px;right:5px;top:16px;height:13px;background:repeating-linear-gradient(180deg,#8799a3 0 1px,transparent 1px 5px)}
.pc-screen .pc-icon-label{max-width:100%;padding:0 3px;white-space:normal;overflow-wrap:anywhere;pointer-events:none}
.pc-screen .pc-icon-date{font-size:12px;line-height:1.3;color:#58676b;white-space:nowrap;pointer-events:none}
.pc-screen .pc-file-icon.picked .pc-icon-label{background:#2c557b;color:#fff}
.pc-screen .pc-file-icon:hover:not(:disabled) .pc-icon-label{color:#193c66;text-decoration:underline;text-underline-offset:3px}
.pc-screen .pc-file-icon.picked:hover:not(:disabled) .pc-icon-label{color:#fff}
.pc-screen .pc-file-icon:disabled{opacity:.5;cursor:default}
.pc-screen .pc-file-icon:focus-visible{outline:2px dotted #2c557b;outline-offset:-3px}
/* Text documents open above the monitor, with the complete original on one page. */
.pc-notepad-layer{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:#090e17b8;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));pointer-events:auto}
.pc-notepad{width:min(780px,100%);max-height:100%;display:flex;flex-direction:column;min-height:0;background:#fbfaf5;color:#20282c;box-shadow:0 8px 32px #0008;font-family:Arial,"Malgun Gothic",sans-serif}
.pc-notepad-title{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 0 0 12px;flex:none;background:#dde4e6;border-bottom:1px solid #abb5b9;color:#26343e}
.pc-notepad-title h2{margin:0;flex:1;min-width:0;font-size:14px;font-weight:400;line-height:1.4}
.pc-notepad-title .pc-symbol{flex:none;margin:0}
.pc-notepad-close{display:grid;place-items:center;width:44px;height:44px;min-width:44px;padding:0;background:none;border:0;color:#26343e;flex:none;cursor:pointer}
.pc-notepad-close:hover{background:#c4ced3}
.pc-notepad-close .pc-close-mark::before,.pc-notepad-close .pc-close-mark::after{background:#334853}
.pc-notepad-close:focus-visible{outline:2px solid #365978;outline-offset:-4px}
.pc-notepad .pc-notepad-text{margin:0;padding:16px 20px;font-family:Arial,"Malgun Gothic",sans-serif;font-size:16px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
.archive-query-monitor{flex:none;min-height:0;padding:12px}
.archive-query-pc .archive-pc-icons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px 8px;background:#e6ebeb}
.archive-pc-icons .archive-pc-icon,.archive-record-icons .archive-pc-icon{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:108px;padding:8px;border:0;background:none;color:#283d4b;font:inherit;font-size:14px;line-height:1.4;cursor:pointer;text-align:center}
.archive-pc-icons .archive-pc-icon .pc-symbol-document,.archive-record-icons .archive-pc-icon .pc-symbol-document{width:34px;height:44px;margin:0;background:linear-gradient(90deg,transparent 7px,#9aa9b44a 7px 8px,transparent 8px),#f9f7ef;box-shadow:1px 2px 0 #a1a8ab,inset 0 -12px #e2e6e6}
.archive-pc-icon .pc-symbol-document::after{content:'';position:absolute;left:12px;right:5px;top:16px;height:13px;background:repeating-linear-gradient(180deg,#8799a3 0 1px,transparent 1px 5px)}
.archive-pc-icon-label{overflow-wrap:anywhere;pointer-events:none}
.archive-pc-icon-date{font-size:12px;line-height:1.4;pointer-events:none}
.archive-pc-icons .archive-pc-icon:hover,.archive-pc-icon:hover .archive-pc-icon-label{text-decoration:underline;text-underline-offset:4px;background:none}
.archive-pc-icons .archive-pc-icon:focus-visible,.archive-record-icons .archive-pc-icon:focus-visible{outline:2px dotted #365978;outline-offset:-4px}
.archive-record-icons{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.archive-notepad .archive-notepad-content{font-size:16px;line-height:1.4;min-height:0;overflow:auto;overscroll-behavior:contain;padding:6px 12px;color:#20282c;touch-action:pan-y}
.archive-notepad .archive-notepad-status{position:static;margin:0;padding:0 12px 8px;font-size:14px;line-height:1.4;color:#4c606a;text-align:left;text-shadow:none;flex:none;overflow:visible;max-height:none}
.archive-notepad-status:empty{display:none}
.archive-notepad .archive-account{font-size:14px!important;margin:0 0 4px}
.archive-notepad .archive-record-table{font-size:14px;line-height:1.4;width:100%;min-width:0;white-space:normal}
.archive-notepad .archive-record-table th,.archive-notepad .archive-record-table td{padding:3px 8px}
.archive-notepad .archive-record-select{padding:3px 0;min-height:44px;font-size:14px}
.archive-notepad .archive-record-detail{margin:0;border:0;padding:0}
.archive-notepad .archive-record-detail dl{grid-template-columns:100px minmax(0,1fr) 100px minmax(0,1fr);gap:3px 8px;font-size:14px;line-height:1.5;margin:0}
.archive-notepad .archive-record-detail dt,.archive-notepad .archive-record-detail dd{font-size:14px}
.archive-notepad .archive-record-detail p{font-size:16px;line-height:1.4;margin:10px 0 0}
.archive-notepad .archive-file{min-height:44px;padding:6px 0;font-size:14px}
.archive-notepad .archive-lookup{margin:4px 0;gap:8px;flex-wrap:nowrap;font-size:14px}
.archive-notepad .archive-lookup label{flex:1;min-width:0;gap:2px}
.archive-notepad .archive-lookup input{width:100%;min-width:0;font-size:16px;padding:4px 8px}
.archive-notepad .archive-lookup button{padding:4px 12px}
.archive-notepad-reference{padding:0;min-height:44px;font-size:14px;border:0;background:none;color:#365978;text-decoration:underline;cursor:pointer}
.archive-notepad .archive-trace-note{margin:6px 0 0;padding:0}
.archive-notepad .archive-trace-note h3{display:none}
.archive-notepad .archive-trace-note p{margin:0;font-size:14px;line-height:1.4}
.archive-notepad .archive-trace-verify button{padding:0;min-height:44px;font-size:14px}
.archive-notepad-back{display:grid;place-items:center;min-width:44px;width:44px;height:44px;padding:8px;border:0;background:none;color:#334853;cursor:pointer}
.archive-notepad-back svg{width:28px;height:28px}
.archive-notepad-book{display:grid;place-items:center;min-width:44px;width:44px;height:44px;padding:3px;border:0;background:none;cursor:pointer}
.archive-notepad-book img{width:34px;height:34px;pointer-events:none}
.archive-notepad-book:focus-visible,.archive-notepad-back:focus-visible{outline:2px solid #365978;outline-offset:-4px}
.archive-inspection:has(.archive-notepad)>.inspection-notebook,.archive-inspection:has(.archive-notepad)>.inspection-back{visibility:hidden}
.shade:has(>.campaign-pc-reader),.shade:has(>.campaign-pc-folder){position:fixed;inset:0;z-index:50;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));display:grid;place-items:center;background:#090e17b8}
.campaign-pc-folder.panel{width:min(780px,100%);max-width:none;max-height:100%;border:0;padding:0;display:flex;flex-direction:column;background:#dfe6e7;color:#273842;overflow:hidden;box-shadow:0 8px 32px #0008}
.campaign-pc-folder .panel-content{min-height:0;padding:0;overflow:auto;flex:1}
.campaign-pc-folder .panel-actions{display:flex;flex-wrap:wrap;gap:12px;margin:0;padding:4px 12px;background:#cdd8de;flex:none}
.campaign-pc-folder .pc-notepad-title{padding:8px 12px}
.campaign-pc-file-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;padding:16px 12px;background:#edf0ef}
.campaign-pc-file{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:108px;min-width:44px;padding:8px;border:0;background:none;color:#283d4b;font-size:14px;line-height:1.4;text-align:center;cursor:pointer}
.campaign-pc-file .pc-symbol-document{width:34px;height:44px;margin:0;background:linear-gradient(90deg,transparent 7px,#9aa9b44a 7px 8px,transparent 8px),#f9f7ef;box-shadow:1px 2px 0 #a1a8ab,inset 0 -12px #e2e6e6}
.campaign-pc-file .pc-symbol-document::after{content:'';position:absolute;left:12px;right:5px;top:16px;height:13px;background:repeating-linear-gradient(180deg,#8799a3 0 1px,transparent 1px 5px)}
.campaign-pc-file-name{overflow-wrap:anywhere;pointer-events:none}
.campaign-pc-file:hover{background:none;text-decoration:underline;text-underline-offset:4px}
.campaign-pc-file:focus-visible{outline:2px dotted #365978;outline-offset:-4px}
.campaign-pc-operation,.campaign-pc-exit{min-height:44px;min-width:44px;padding:4px 0;background:none;border:0;font-size:14px;color:#283d4b;cursor:pointer}
.campaign-pc-operation{text-decoration:underline;text-underline-offset:4px}
.campaign-pc-folder button:hover,.campaign-pc-reader button:hover{color:#1a3041;background:none}
.campaign-pc-empty{grid-column:1/-1;padding:16px;font-size:16px;color:#56656b}
.campaign-pc-reader.panel{width:min(780px,100%);max-width:none;max-height:100%;padding:0;border:0;overflow:hidden;box-shadow:0 8px 32px #0008}
.campaign-pc-reader .pc-notepad-title{height:44px;min-height:44px;padding-left:12px;gap:4px}
.campaign-pc-reader .pc-notepad-title h2{font-size:14px;line-height:1.35;max-height:40px;overflow:hidden}
.campaign-pc-reader .campaign-pc-reading-body{padding:8px 12px;min-height:0;max-height:none;overflow:auto;flex:1}
.campaign-pc-reader .campaign-pc-reading-actions{display:none}
.campaign-pc-reader .campaign-pc-text{margin:0;padding:0;background:none;font-family:Arial,"Malgun Gothic",sans-serif;font-size:16px;line-height:1.4;color:#20282c;white-space:pre-wrap;overflow-wrap:anywhere}
.campaign-pc-arrow,.campaign-pc-confirm{display:grid;place-items:center;min-width:44px;width:44px;height:44px;min-height:44px;padding:8px;border:0;background:none;color:#334853;cursor:pointer;flex:none}
.campaign-pc-arrow svg{width:28px;height:28px}
.campaign-pc-confirm{font-size:14px;font-weight:500;padding:0}
.campaign-pc-reader .archive-notepad-book,.campaign-pc-reader .pc-notepad-close{flex:none}
.campaign-pc-photo{float:left;width:100px;height:120px;object-fit:contain;margin:0 12px 8px 0}
@media(orientation:landscape) and (max-height:400px){.campaign-pc-reader .campaign-pc-text{line-height:1.25}.campaign-pc-reader .campaign-pc-reading-body{padding:6px 12px}}
@media(orientation:portrait) and (max-width:480px){
  .archive-notepad .archive-record-detail dl{grid-template-columns:100px minmax(0,1fr)}
}
@media(orientation:landscape) and (max-height:400px){
  .pc-notepad .pc-notepad-text{padding:8px 12px;line-height:1.4}
}
@media(orientation:landscape) and (max-height:280px){
  .pc-notepad-layer{padding:0}
  .pc-notepad .pc-notepad-text{padding:4px 12px;line-height:1.25}
}
@media(orientation:landscape) and (max-height:600px){
  body{min-height:100svh;min-height:100dvh;overflow:hidden;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
  .game-shell,.game-shell:fullscreen{width:min(1280px,calc((100svh - 12px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*var(--room-ratio)),calc(100vw - 208px - env(safe-area-inset-left) - env(safe-area-inset-right)));margin:0 auto}
  .game-shell:fullscreen{height:100dvh;display:grid;place-items:center}
  .game-header{position:fixed;inset:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) auto auto;width:92px;z-index:5}
  .game-header .location{position:fixed;left:50%;top:max(12px,env(safe-area-inset-top));transform:translateX(-50%)}
  .game-header nav{right:0;top:52px}
  .touch-controls{position:fixed;inset:0;width:100%;height:100%;padding:0;z-index:4}
  .direction-pad.joystick{left:max(8px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom));width:96px;height:96px}
  .joystick-thumb{width:42px;height:42px}
  .touch-controls .console-actions{right:max(24px,env(safe-area-inset-right));bottom:max(30px,env(safe-area-inset-bottom));width:64px;height:64px}
  .touch-controls #touchInteract{width:64px;height:64px}
}
@media(orientation:portrait) and (max-width:640px){
  .game-shell{width:100%;margin:max(8px,env(safe-area-inset-top)) auto 0}
  .touch-controls{position:relative;inset:auto;height:140px;padding-bottom:env(safe-area-inset-bottom)}
  .direction-pad.joystick{left:max(22px,env(safe-area-inset-left));bottom:12px;width:112px;height:112px}
  .touch-controls .console-actions{right:max(24px,env(safe-area-inset-right));bottom:30px;width:64px;height:64px}
  .game-header{gap:4px}
}
@media(orientation:landscape) and (min-height:601px){
  .direction-pad.joystick{left:-132px}
  .touch-controls .console-actions{right:-100px}
}
/* Close investigation is a reading view, independent of the field gutters. */
.game-shell:has(.inspection,.archive-inspection) .game-header{visibility:hidden}
.inspection-paper-enlarge{position:absolute;right:max(12px,env(safe-area-inset-right));top:max(8px,env(safe-area-inset-top));width:44px;height:44px;padding:8px;z-index:9}
.inspection-paper-enlarge img{width:28px;height:28px;filter:drop-shadow(0 1px 2px #000);pointer-events:none}
.inspection.paper-reading>*:not(.inspection-paper-viewer){display:none}
.inspection-paper-viewer{position:absolute;inset:0;background:#121820;display:flex;flex-direction:column;padding:52px 56px 12px;color:#ede7d9}
.inspection-paper-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;scrollbar-width:thin;scrollbar-color:#a99b80 #121820}
.inspection-paper-scroll .physical-paper{display:block;width:min(100%,600px);height:auto;max-width:none;max-height:none;margin:0 auto;object-fit:contain;pointer-events:auto;image-rendering:auto}
.inspection-paper-scroll.zoomed .physical-paper{width:max(720px,140%);margin:0}
.inspection-paper-transcript{font-size:16px;line-height:1.8;white-space:pre-line}
.inspection-paper-transcript summary{min-height:44px;cursor:pointer;display:flex;align-items:center}
.inspection-paper-back{position:absolute;left:max(8px,env(safe-area-inset-left));top:max(8px,env(safe-area-inset-top));width:44px;height:44px;padding:6px}
.inspection-paper-back svg{width:32px;height:32px}
.inspection-paper-toggle{position:absolute;right:max(12px,env(safe-area-inset-right));top:max(8px,env(safe-area-inset-top));min-width:44px;min-height:44px;padding:8px 0;font-size:14px}
@media(max-width:640px), (orientation:landscape) and (max-height:600px){
  .inspection,.archive-inspection{position:fixed;inset:0;z-index:30}
  .inspection .inspection-thought,.archive-inspection .archive-thought{font-size:15px;line-height:1.7;max-height:30%;overflow-y:auto;pointer-events:auto;padding-bottom:max(12px,env(safe-area-inset-bottom))}
  .inspection:has(.pc-inspected-monitor) .inspection-thought{display:none}
  .inspection-notebook{width:44px;height:44px;bottom:max(12px,env(safe-area-inset-bottom));right:max(12px,env(safe-area-inset-right))}
  .inspection-paper-viewer{padding-left:max(50px,env(safe-area-inset-left));padding-right:max(50px,env(safe-area-inset-right));padding-bottom:max(12px,env(safe-area-inset-bottom))}
  .pc-screen .pc-document{font-size:16px;line-height:1.8;padding:12px}
  .pc-screen .pc-file-row{font-size:14px;line-height:1.65;min-height:52px!important}
  .pc-screen .pc-file-head,.pc-screen .pc-file-date,.pc-screen .pc-file-type{font-size:12px}
  .pc-screen .pc-tree button{font-size:14px!important}
  .pc-screen .pc-record-info,.pc-screen .pc-record-info strong{font-size:14px;line-height:1.75}
  .pc-screen .pc-address,.pc-screen .pc-title,.pc-screen .pc-record-source,.pc-screen .pc-file-tools{font-size:14px}
  .pc-screen .pc-login h3{font-size:17px}
  .pc-screen .pc-login-form,.pc-screen .pc-account,.pc-screen .pc-login-error,.pc-screen .pc-shortcut,.pc-screen .pc-password-hint{font-size:14px;line-height:1.7}
  .pc-screen .pc-hint-button{font-size:14px!important}
  .pc-screen .pc-document-back,.pc-screen .pc-linked-file,.pc-screen .pc-record-source button{font-size:14px!important}
  .archive-paper-transcript,.archive-reference,.archive-trace-note p,.archive-newspaper-transcript{font-size:16px;line-height:1.8}
  .archive-record-table{font-size:14px;line-height:1.7;min-width:100%;width:max-content}
  .archive-record-table td,.archive-record-table th{padding:10px 8px}
  .archive-investigation{overscroll-behavior:contain;scroll-padding:8px}
  .archive-pair-form,.archive-lookup,.archive-file{font-size:15px;line-height:1.7}
  .archive-pair-form input,.archive-lookup input{font-size:16px}
  .book-left,.book-right{font-size:16px;line-height:1.8}
  .dialogue-shade .dialogue-text{font-size:16px;line-height:1.75}
}
@media(orientation:landscape) and (max-height:600px){
  .pc-inspected-monitor{width:min(calc(100% - 72px),calc((100svh - 32px)*1.68));top:calc(50% - 16px)}
  .pc-screen .pc-status{display:none}
  .legacy-book .book-evidence{grid-template-columns:1fr;gap:12px}
  .legacy-book .book-entry{display:grid;grid-template-columns:48px minmax(0,1fr);gap:8px;align-items:center;text-align:left;transform:none;font-size:14px;line-height:1.6;min-height:64px}
  .legacy-book .book-entry .clue-photo{width:48px;height:60px;object-fit:contain;margin:0}
}
/* A portrait leaf uses exactly half of the spread, with ink inside its paper.
   Keeping the 2:3 leaf ratio prevents the binding from drifting under the text. */
@media(max-width:640px) and (orientation:portrait){
  .investigation-book:is(.legacy-book,.campaign-book,.campaign-compare,[data-page="campaign-notebook"],[data-page="campaign-compare"]){
    width:min(100%,calc((100svh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*2/3));
    height:auto;aspect-ratio:2/3;
    background-size:200% 100%!important;background-position:0% 50%;background-repeat:no-repeat;
    --leaf-ink-left:18%;--leaf-ink-right:10%;
  }
  .investigation-book.legacy-book[data-leaf="right"]{
    background-position:100% 50%;--leaf-ink-left:10%;--leaf-ink-right:18%;
  }
  .investigation-book.legacy-book :is(.book-tools,.book-stage-label,.book-left,.book-right,.book-page-actions){
    left:var(--leaf-ink-left);right:var(--leaf-ink-right);width:auto;
  }
  .investigation-book:is(.campaign-book,.campaign-compare,[data-page="campaign-notebook"],[data-page="campaign-compare"]) :is(.book-tools,.book-page-actions){
    left:var(--leaf-ink-left);right:var(--leaf-ink-right);
  }
  .investigation-book:is(.campaign-book,.campaign-compare,[data-page="campaign-notebook"],[data-page="campaign-compare"]) :is(.book-left,.book-right){
    left:var(--leaf-ink-left);right:var(--leaf-ink-right);width:auto;
  }
  .investigation-book.comparison-readable[data-page="campaign-compare"] .comparison-scroll{
    left:var(--leaf-ink-left);right:var(--leaf-ink-right);
  }
}
/* Size reading space around the real, possibly wrapped, footer controls. */
.book-ink,.book-action-group{display:contents}
.legacy-book .book-note .clue-photo{display:block;width:100%;height:auto;max-width:100%;max-height:none;transform:none;margin:0 0 12px}
/* Let spoken words use their actual height before introducing a reading scroll. */
@media(max-width:640px) and (orientation:portrait), (max-height:600px) and (orientation:landscape){
  .dialogue-shade .dialogue-box{max-height:60svh}
  .dialogue-shade .dialogue-text{max-height:none;min-height:0;font-size:16px;line-height:1.75}
  .dialogue-shade .dialogue-box:has(.dialogue-next[hidden]){max-height:45svh;padding-bottom:max(12px,env(safe-area-inset-bottom))}
  .dialogue-shade .choices .choice{font-size:16px}
  .dialogue-shade .choices{grid-auto-rows:max-content;align-content:start}
}
@media(max-width:640px) and (orientation:portrait), (max-height:600px) and (orientation:landscape){
  .investigation-book .book-ink{
    position:absolute;inset:10% 12% 14% 10%;display:grid;
    grid-template-columns:minmax(0,1fr);grid-template-rows:44px minmax(0,1fr) auto;
    gap:8px;min-width:0;min-height:0;
  }
  .investigation-book .book-ink>.book-tools,
  .investigation-book .book-ink>.book-page-actions,
  .investigation-book .book-ink>:is(.book-left,.book-right,.comparison-scroll){
    position:static!important;inset:auto!important;width:auto!important;height:auto!important;
    min-width:0;min-height:0;max-height:none;margin:0;
  }
  .investigation-book .book-ink>.book-tools{display:flex;justify-content:flex-end;flex-wrap:nowrap;align-items:center;padding:0}
  .investigation-book .book-ink>.book-page-actions{display:flex;flex-wrap:wrap;align-items:center;align-content:end;justify-content:flex-end;gap:0 12px;padding:0}
  .investigation-book .book-ink>.book-page-actions button{min-height:44px;min-width:44px;white-space:normal}
  .investigation-book .book-comparison-ink>.book-page-actions>.book-footer-close{display:none}
  .investigation-book .book-ink>:is(.book-left,.book-right,.comparison-scroll){overflow:auto;overscroll-behavior:contain;touch-action:pan-y pinch-zoom;padding:0 6px 0 0}
  .investigation-book .book-notebook-ink{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:10.25%}
  .book-notebook-ink>.book-tools,.book-notebook-ink>.book-page-actions{grid-column:1/-1}
  .book-notebook-ink>.book-left{grid-column:1;grid-row:2}
  .book-notebook-ink>.book-right{grid-column:2;grid-row:2}
}
@media(max-width:640px) and (orientation:portrait){
  .investigation-book .book-ink{left:var(--leaf-ink-left,18%);right:var(--leaf-ink-right,10%)}
  .investigation-book .book-notebook-ink{grid-template-columns:minmax(0,1fr);grid-template-rows:44px minmax(0,1fr) minmax(0,.8fr) auto}
  .book-notebook-ink>.book-right{grid-column:1;grid-row:3}
}
@media(max-height:600px) and (orientation:landscape){
  .investigation-book.comparison-readable[data-page="campaign-compare"] .comparison-scroll{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:calc(13% + 24px);row-gap:16px}
  .investigation-book .book-ink>.book-page-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:10.25%}
  .investigation-book:is(.campaign-book,.comparison-readable) .book-ink>.book-page-actions{column-gap:calc(13% + 8px)}
  .book-notebook-ink .book-action-group{display:flex;flex-wrap:wrap;align-content:end;justify-content:flex-end;gap:0 10px;min-width:0}
  .book-notebook-ink .book-chapter-actions{grid-column:1}
  .book-notebook-ink .book-record-actions{grid-column:2}
  .investigation-book .book-comparison-ink>.book-page-actions>button{max-width:100%;width:100%;overflow-wrap:anywhere}
  .investigation-book.legacy-book .book-page-actions{left:54%;right:12%;overflow:visible}
  .investigation-book.legacy-book .book-page-actions button{min-width:44px;max-width:100%;white-space:normal;overflow-wrap:anywhere}
  .legacy-book .book-tabs{gap:6px;overflow:visible}
  .legacy-book .book-tabs>button:nth-child(4){position:absolute;left:57%;top:0}
  .save-book .book-tools>span{max-width:45%;flex:0 1 45%}
}
/* Close-up captions and actions reserve space instead of covering the record. */
@media(max-width:640px) and (orientation:portrait), (max-height:600px) and (orientation:landscape){
  .archive-inspection{
    display:grid;grid-template-rows:minmax(0,1fr) auto;gap:8px;
    align-items:stretch;align-content:stretch;
    padding:max(56px,calc(env(safe-area-inset-top) + 48px)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  }
  .archive-inspection .archive-investigation{height:auto;min-height:0;grid-row:1}
  .archive-inspection .archive-thought{
    position:static;inset:auto;grid-row:2;margin:0 52px 0 0;padding:0;
    max-height:30svh;overflow:auto;min-height:0;font-size:16px;line-height:1.65;
  }
  .archive-inspection .archive-thought:empty{display:none}
  .archive-inspection:has(.archive-notepad) .archive-thought{visibility:hidden}
  .archive-inspection .archive-pc-tabs button{min-width:44px;min-height:44px}
  .inspection .inspection-thought{padding-right:68px;padding-left:16px}
  .senior-drawer-inspection{
    display:grid;grid-template-rows:minmax(0,1fr) auto auto;gap:8px;
    padding:56px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  }
  .senior-drawer-inspection .senior-drawer-actions{
    position:relative;inset:auto;grid-row:2;margin:0;gap:4px 12px;
  }
  .senior-drawer-inspection .inspection-thought{
    position:static;inset:auto;grid-row:3;margin:0;padding:0 52px 0 0;
    min-height:0;max-height:30svh;overflow:auto;pointer-events:auto;
  }
  .inspection .inspection-seal{min-width:44px;min-height:44px}
  .campaign-inspection.panel{height:100%}
  .campaign-inspection>.panel-content{align-items:stretch;overflow:hidden}
  .campaign-inspection .campaign-sheet{
    width:100%;height:100%;max-width:none;aspect-ratio:auto;container-type:size;
    background-size:auto 160%;background-position:64% 50%;
  }
  /* Map the source artwork's 32.458564% / 46.961326% ink area through
     the uniform background scale, then keep the viewport's inner margins. */
  .campaign-inspection .campaign-paper-content{
    left:max(8%,calc(64cqw - 67.288397cqh));right:max(8%,calc(36cqw - 32.895765cqh));
    top:8%;width:auto;height:84%;
  }
  .campaign-inspection .campaign-sheet.zoomed{width:100%;height:100%;aspect-ratio:auto;background-size:auto 220%;background-position:64% 50%}
  .campaign-inspection .campaign-sheet.zoomed .campaign-paper-content{
    left:max(8%,calc(64cqw - 92.521546cqh));right:max(8%,calc(36cqw - 45.231677cqh));
  }
}
/* Wide phones use a following camera instead of empty controller gutters. */
@media(orientation:landscape) and (max-height:600px){
  .game-shell,.game-shell:fullscreen{width:100%;min-width:0;max-width:100%;margin:0;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
  .game-shell:fullscreen{height:auto;display:block}
  .game-shell .stage{width:100%;min-width:0;max-width:100%;height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));aspect-ratio:auto}
  .touch-controls .joystick{opacity:.82}
  .touch-controls .joystick[data-active=true]{opacity:1}
}
/* Numeric input stays inside the game, with a separate usable phone surface. */
.pc-screen .numeric-entry-trigger{grid-column:2/4;min-height:44px;font-size:16px!important;padding:6px 12px!important;color:#eee6d2!important}
.archive-lookup .numeric-entry-trigger,.archive-pair-form .numeric-entry-trigger{min-height:44px;font-size:16px;grid-column:1/-1}
.numeric-entry-shade{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#0c131ddd;overscroll-behavior:contain;touch-action:manipulation}
.numeric-entry-panel{width:min(340px,100%);max-height:100%;overflow:auto;background:#1b2c3c;color:#eee8da;padding:16px;box-shadow:0 12px 48px #0008;display:grid;gap:12px;box-sizing:border-box}
.numeric-entry-header{display:flex;align-items:center;gap:8px;min-width:0}
.numeric-entry-header h2{flex:1;font-size:18px;line-height:1.5;margin:0;min-width:0;overflow-wrap:anywhere}
.numeric-entry-panel button{min-width:44px;min-height:44px;border:0;border-radius:3px;background:#334b5e;color:#f3efdf;font:inherit;font-size:16px;line-height:1.5;padding:8px;touch-action:manipulation;cursor:pointer}
.numeric-entry-panel button:active{background:#587288;transform:translateY(1px)}
.numeric-entry-panel button:focus-visible{outline:2px solid #ebce91;outline-offset:2px}
.numeric-entry-panel button:disabled{opacity:.45;cursor:default;transform:none}
.numeric-entry-header .numeric-entry-cancel{background:transparent;padding:8px 0;flex:none}
.numeric-entry-readout{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.numeric-entry-display{display:block;flex:1 1 100%;min-width:0;min-height:44px;background:#10202e;padding:8px 12px;font:24px/1.5 monospace;overflow-wrap:anywhere;box-sizing:border-box}
.numeric-entry-count{flex:1;color:#c6c8bf;font-size:14px}
.numeric-entry-keys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.numeric-entry-key{font-size:22px!important}
.numeric-entry-actions{display:flex;gap:8px}
.numeric-entry-actions button{flex:1;background:#c8bb96;color:#192937}
@media(orientation:landscape) and (max-height:600px){
  .numeric-entry-panel{width:min(620px,100%);grid-template-columns:minmax(0,1fr) minmax(192px,1fr);column-gap:20px;gap:8px 20px;padding:12px 16px}
  .numeric-entry-header{grid-column:1;grid-row:1}
  .numeric-entry-readout{grid-column:1;grid-row:2;align-self:center}
  .numeric-entry-actions{grid-column:1;grid-row:3;align-self:end}
  .numeric-entry-keys{grid-column:2;grid-row:1/4}
}
/* Front-end screens are independent of the exploration field's aspect ratio. */
@media(max-width:640px) and (orientation:portrait), (max-height:600px) and (orientation:landscape){
  .shade:has(>.title-panel),.shade:has(>.settings-panel){
    position:fixed;inset:0;z-index:30;
    padding:max(56px,calc(env(safe-area-inset-top) + 48px)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
    overflow:hidden;
  }
  .title-panel{
    width:min(440px,100%);max-height:100%;padding:24px;
    min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;
  }
  .title-panel .title-kicker{font-size:14px;letter-spacing:4px}
  .title-panel h1{font-size:42px;line-height:1.2;margin:16px 0;letter-spacing:3px}
  .title-panel p{font-size:16px;line-height:1.7;white-space:pre-line;word-break:keep-all;overflow-wrap:anywhere;margin:0 0 20px}
  .title-panel>button{display:block;width:100%;min-width:44px;min-height:48px;padding:10px 0;font-size:16px;line-height:1.6;text-align:left}
  .title-panel>.action{padding:10px 0;font-size:16px;line-height:1.6}
  .title-panel>button+button{margin-top:4px}
  .title-panel>.action+.action{margin-top:4px}
  .game-shell:has(.title-panel) .game-header{z-index:45}
  .game-shell:has(.title-panel) .game-header .location{visibility:hidden}
  .game-shell:has(.settings-panel) .game-header{visibility:hidden}
  .game-header nav{max-height:max(44px,calc(100dvh - max(8px,env(safe-area-inset-top)) - 52px - max(12px,env(safe-area-inset-bottom))))}
  .shade:has(>.settings-panel){padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
  .settings-panel.panel{width:min(780px,100%);height:min(720px,100%);max-height:100%;min-height:0;overflow:hidden}
  .settings-panel .panel-header{flex:none;gap:8px;padding:8px 16px}
  .settings-panel .panel-header h2{flex:1;min-width:0;font-size:20px;line-height:1.5}
  .settings-panel .panel-header .close{flex:none;width:44px;min-width:44px;height:44px;min-height:44px;padding:0}
  .settings-panel .panel-content{flex:1;min-height:0;padding:8px 16px;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;font-size:16px}
  .settings-panel .control-list{margin:0;grid-template-columns:minmax(0,160px) minmax(0,1fr);gap:12px 20px}
  .settings-panel .control-list :is(dt,dd){font-size:16px;line-height:1.65;margin:0;min-width:0;overflow-wrap:anywhere}
  .settings-panel .direction-setting{font-size:16px;min-height:44px}
  .settings-panel .panel-actions{flex:none;padding:4px 16px;min-height:52px}
  .settings-panel .panel-actions button{min-width:44px;min-height:44px;padding:8px 0;font-size:16px}
}
@media(max-width:480px) and (orientation:portrait){
  .settings-panel .control-list{grid-template-columns:minmax(0,1fr);gap:4px}
  .settings-panel .control-list dt:not(:first-child){margin-top:12px}
}
@media(max-height:600px) and (orientation:landscape){
  .title-panel{width:min(660px,100%);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:28px;row-gap:8px;padding:16px 24px}
  .title-panel .title-kicker{grid-column:1;grid-row:1}
  .title-panel h1{grid-column:1;grid-row:2;margin:0;font-size:38px}
  .title-panel p{grid-column:1;grid-row:3;margin:0}
  .title-panel>button{grid-column:2;grid-row:2;align-self:center}
  .title-panel>button+button{grid-column:2;grid-row:3;margin:0;align-self:start}
  .title-panel>.action+.action{margin:0}
}