.computer-fullscreen .modal-backdrop{background:#020506;backdrop-filter:blur(10px)}
.computer-fullscreen-panel{width:100vw;max-width:none;height:100vh;max-height:none;padding:0;overflow:hidden;border:0;outline:0;background:#030607;box-shadow:none;animation:computer-view-enter .48s cubic-bezier(.2,.8,.2,1) both}
.computer-fullscreen-panel:before{display:none}.computer-fullscreen-panel>.modal-close{z-index:30;right:22px;top:17px;width:40px;height:40px;border:1px solid rgba(220,201,159,.48);background:rgba(5,9,11,.72);color:#ddd3bd}
@keyframes computer-view-enter{from{opacity:0;transform:translate(-50%,-48%) scale(.965)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.computer-screen-view{position:absolute;inset:0;background:#020405;overflow:hidden}.computer-screen-view>img{display:block;width:100%;height:100%;object-fit:cover}.desktop-hotspot,.monitor-power-button{position:absolute;border:0;background:transparent;cursor:pointer}.desktop-hotspot:focus-visible,.monitor-power-button:focus-visible{outline:2px solid #75c6e8;outline-offset:3px}.desktop-hotspot.mail{left:10.3%;top:18.2%;width:7.2%;height:13.3%}.desktop-hotspot.cctv{left:10.3%;top:32%;width:7.2%;height:13.8%}.desktop-hotspot.documents{left:10.3%;top:46.2%;width:7.2%;height:13.6%}.computer-screen-view .monitor-power-button{left:47.6%;top:74.4%;width:5%;height:8%;border-radius:50%}.computer-boot-flash{position:absolute;inset:0;opacity:0;pointer-events:none;background:#9dd8ed}.computer-screen-view.booting .computer-boot-flash{animation:computer-boot .72s ease both}@keyframes computer-boot{0%{opacity:0}18%{opacity:.86}32%{opacity:.08;background:#fff}50%{opacity:.8;background:#071927}100%{opacity:1;background:#010406}}
.computer-app{position:absolute;inset:0;background:radial-gradient(circle at 65% 25%,#173850,#07141d 55%,#03080b);color:#e5edf0;animation:computer-app-open .28s ease-out both}@keyframes computer-app-open{from{opacity:0;transform:scale(1.015)}to{opacity:1;transform:none}}.computer-app>header{height:88px;display:flex;align-items:center;gap:18px;padding:0 78px 0 28px;border-bottom:1px solid #294b5c;background:rgba(5,15,21,.9)}.computer-app>header>button:first-child{width:42px;height:42px;border:1px solid #496774;background:#0c202a;color:#dce9ed;font-size:30px;cursor:pointer}.computer-app header small{color:#6f9aae;font:700 9px/1 monospace;letter-spacing:.16em}.computer-app header h2{margin:5px 0 0;font-size:22px}.computer-app header>span{margin-left:auto;color:#68838e;font:10px monospace}
.mail-layout{display:grid;grid-template-columns:360px 1fr;height:calc(100% - 88px)}.mail-layout aside{overflow:auto;border-right:1px solid #294b5c;background:rgba(6,16,22,.86)}.mail-row{display:grid;width:100%;gap:5px;padding:17px 20px;border:0;border-bottom:1px solid #203945;background:transparent;color:#cbd9dd;text-align:left;cursor:pointer}.mail-row:hover,.mail-row.active{background:#153344}.mail-row.active{box-shadow:inset 4px 0 #d2a64d}.mail-row b{font-size:11px}.mail-row strong{font-size:14px}.mail-row small{color:#688792;font:9px monospace}.mail-layout article{padding:48px 7%;overflow:auto;background:rgba(8,20,27,.72)}.mail-layout article>small{color:#7094a1}.mail-layout article h3{margin:12px 0 8px;font-size:31px}.mail-sender{padding-bottom:20px;border-bottom:1px solid #31505d;color:#93aab1}.mail-layout article>div{max-width:780px;margin-top:30px;font-size:16px;line-height:2;color:#d7e0e2}
.security-app{background:radial-gradient(circle,#142d38,#050b0e 62%)}#security-code-form{position:absolute;left:50%;top:50%;width:min(520px,80vw);padding:42px;transform:translate(-50%,-50%);border:1px solid #375666;background:rgba(8,20,26,.94);box-shadow:0 25px 80px #000;text-align:center}#security-code-form span{color:#7193a0;font:9px monospace;letter-spacing:.16em}#security-code-form h3{margin:12px 0 28px;font-size:23px}#security-code-form input{width:100%;padding:16px;border:1px solid #416675;background:#02080b;color:#dceef3;font:26px/1 monospace;text-align:center;letter-spacing:.35em;outline:none}#security-code-form button{margin-top:14px;padding:13px 38px;border:1px solid #b08f4d;background:#173541;color:#e5d3a8;cursor:pointer}#security-message{min-height:20px;color:#d1776c;font-size:11px}
.documents-app{background:#08151c}.file-browser{display:grid;grid-template-columns:repeat(4,minmax(180px,260px));gap:18px;padding:48px}.file-browser button{display:grid;grid-template-columns:52px 1fr;gap:5px 14px;align-items:center;padding:20px;border:1px solid #36515d;background:#102630;color:#dce5e7;text-align:left;cursor:pointer}.file-browser button:hover{border-color:#c19d54;background:#17333d}.file-browser i{grid-row:1/3;display:grid;width:52px;height:64px;place-items:center;background:#d3d0c5;color:#273238;font:700 10px monospace}.file-browser strong{font-size:14px}.file-browser small{color:#6f8b96}
.contract-app{background:#12181a}.document-menu{margin-left:auto!important;width:52px!important;font-size:17px!important;letter-spacing:.18em}.document-metadata{position:absolute;z-index:4;right:40px;top:76px;width:310px;padding:22px;border:1px solid #806b43;background:#10191c;box-shadow:0 18px 50px #000}.document-metadata b{color:#d5b86e}.document-metadata dl{display:grid;grid-template-columns:85px 1fr;gap:11px;margin:18px 0 0;font-size:11px}.document-metadata dt{color:#71838a}.document-metadata dd{margin:0}.contract-paper{width:min(780px,72vw);min-height:calc(100vh - 140px);margin:26px auto;padding:62px 74px;background:#ded9cc;color:#2a2925;box-shadow:0 20px 65px #000;font-family:"AppleMyungjo","Nanum Myeongjo","Batang",serif}.contract-paper>small{color:#796f60;font:700 9px monospace;letter-spacing:.15em}.contract-paper h3{margin:22px 0 8px;padding-bottom:18px;border-bottom:2px solid #514c43;text-align:center;font-size:28px}.contract-date{text-align:right;color:#675f53}.contract-paper>p:not(.contract-date){margin:34px 0;font-size:16px;line-height:2.1}.biometric-seal{display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:70px;padding:20px;border:2px solid #744840;color:#6f332d}.biometric-seal span{font:700 12px monospace}.biometric-seal strong{grid-row:2}.biometric-seal i{grid-column:2;grid-row:1/3;align-self:center;padding:12px;border:2px double #744840;border-radius:50%;font:bold 10px Georgia,serif;transform:rotate(-8deg)}
@media(max-width:850px){.mail-layout{grid-template-columns:280px 1fr}.computer-app>header{padding-left:14px}.contract-paper{padding:42px}.desktop-hotspot.mail,.desktop-hotspot.cctv,.desktop-hotspot.documents{width:9%}}
@media(prefers-reduced-motion:reduce){.computer-fullscreen-panel,.computer-app,.computer-screen-view.booting .computer-boot-flash{animation:none}}

/* Every interactive coordinate is relative to the uncropped 1672×941 image plane. */
.computer-screen-view {
  display: grid;
  place-items: center;
}

.computer-image-plane {
  position: relative;
  width: min(100vw, calc(100vh * 1672 / 941));
  aspect-ratio: 1672 / 941;
  max-height: 100vh;
  overflow: hidden;
  flex: none;
}

.computer-image-plane > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.computer-image-plane .desktop-hotspot,
.computer-image-plane .monitor-power-button,
.computer-image-plane .computer-boot-flash {
  position: absolute;
}

.computer-image-plane .monitor-power-button {
  left: 48.9%;
  top: 65.7%;
  width: 2.2%;
  height: 4.5%;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.computer-image-plane .monitor-power-button:hover {
  border: 0;
  background: transparent;
  box-shadow: none;
}

.computer-image-plane .desktop-hotspot.mail {
  left: 24.7%;
  top: 20.5%;
  width: 4.5%;
  height: 10.5%;
}

.computer-image-plane .desktop-hotspot.cctv {
  left: 24.7%;
  top: 31.5%;
  width: 4.5%;
  height: 10.5%;
}

.computer-image-plane .desktop-hotspot.documents {
  left: 24.7%;
  top: 42.3%;
  width: 4.5%;
  height: 10.5%;
}

.computer-image-plane .computer-boot-flash {
  inset: 0;
}

.computer-image-plane.booting .computer-boot-flash {
  animation: computer-boot .72s ease both;
}

.contract-app .document-menu {
  display: grid;
  grid-auto-flow: row;
  place-content: center;
  gap: 3px;
  width: 40px !important;
  height: 40px;
  margin-left: auto !important;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: #b8c9cf;
  cursor: pointer;
  box-shadow: none;
  appearance: none;
}

.contract-app .document-menu span {
  display: block;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
}

.contract-app .document-menu:hover,
.contract-app .document-menu.active {
  border-color: #44616d;
  background: #17303a;
  color: #f0d690;
}

.contract-app .document-menu:focus-visible {
  outline: 2px solid #d1aa56;
  outline-offset: 2px;
}

.contract-app .document-metadata {
  right: 74px;
  top: 74px;
  width: 330px;
  padding: 0;
  overflow: hidden;
  border: 1px solid #405661;
  border-radius: 8px;
  background: #111d22;
  box-shadow: 0 16px 45px rgba(0,0,0,.62);
  transform-origin: top right;
  animation: metadata-menu-open .16s ease-out both;
}

.metadata-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 17px;
  border-bottom: 1px solid #334850;
  background: #16262c;
}

.metadata-heading span {
  color: #e4d09a;
  font-size: 13px;
  font-weight: 750;
}

.metadata-heading small {
  color: #68828d;
  font: 8px monospace;
  letter-spacing: .12em;
}

.contract-app .document-metadata dl {
  padding: 17px;
  margin: 0;
}

@keyframes metadata-menu-open {
  from { opacity: 0; transform: translateY(-5px) scale(.98); }
  to { opacity: 1; transform: none; }
}

/* Computer inspection remains inside the game HUD and apps open inside the monitor. */
.modal.computer-fullscreen {
  z-index: 13;
}

.game-screen.active .game-command-bar,
.game-screen.active .right-rail,
.game-screen.active .clue-inventory {
  z-index: 14;
}

.computer-fullscreen .modal-backdrop {
  background: rgba(1,5,7,.48);
  backdrop-filter: blur(3px) brightness(.72);
}

.computer-fullscreen-panel {
  background: transparent;
}

.computer-fullscreen-panel > .modal-close {
  position: fixed;
  top: 82px;
  right: calc(50% - min(36vw, calc((100vh - 170px) * .75)) + 8px);
  z-index: 20;
}

.computer-image-plane {
  width: min(72vw, calc((100vh - 170px) * 1.5));
  max-height: calc(100vh - 170px);
}

.monitor-app-window {
  position: absolute;
  z-index: 5;
  left: 23.25%;
  top: 15.2%;
  width: 53.4%;
  height: 50.5%;
  overflow: hidden;
  border: 1px solid rgba(111,160,182,.5);
  border-radius: 2px;
  background: #07141d;
  box-shadow: 0 8px 25px rgba(0,0,0,.58);
}

.monitor-app-window .computer-app {
  position: absolute;
  inset: 0;
}

.monitor-app-window .computer-app > header {
  height: 54px;
  padding: 0 16px;
  gap: 10px;
}

.monitor-app-window .computer-app > header > button:first-child {
  width: 30px;
  height: 30px;
  font-size: 22px;
}

.monitor-app-window .computer-app header h2 {
  margin-top: 2px;
  font-size: 15px;
}

.monitor-app-window .mail-layout {
  grid-template-columns: 31% 1fr;
  height: calc(100% - 54px);
}

.monitor-app-window .mail-row {
  gap: 2px;
  padding: 8px 10px;
}

.monitor-app-window .mail-row b,
.monitor-app-window .mail-row small {
  font-size: 7px;
}

.monitor-app-window .mail-row strong {
  font-size: 9px;
}

.monitor-app-window .mail-layout article {
  padding: 20px 5%;
}

.monitor-app-window .mail-layout article h3 {
  margin: 6px 0 4px;
  font-size: 18px;
}

.monitor-app-window .mail-layout article > div {
  margin-top: 14px;
  font-size: 10px;
  line-height: 1.75;
}

.monitor-app-window #security-code-form {
  width: min(420px,76%);
  padding: 24px;
}

.monitor-app-window #security-code-form h3 {
  margin: 8px 0 15px;
  font-size: 16px;
}

.monitor-app-window #security-code-form input {
  padding: 10px;
  font-size: 18px;
}

.monitor-app-window .file-browser {
  padding: 24px;
  grid-template-columns: minmax(180px,240px);
}

.monitor-app-window .contract-paper {
  width: 74%;
  min-height: 0;
  height: calc(100% - 72px);
  margin: 10px auto;
  padding: 26px 38px;
  overflow: auto;
}

.monitor-app-window .contract-paper h3 {
  margin: 10px 0 5px;
  padding-bottom: 8px;
  font-size: 17px;
}

.monitor-app-window .contract-paper > p:not(.contract-date) {
  margin: 14px 0;
  font-size: 10px;
  line-height: 1.7;
}

.monitor-app-window .biometric-seal {
  margin-top: 18px;
  padding: 9px;
}

.monitor-app-window .contract-app .document-metadata {
  right: 12px;
  top: 50px;
  width: 280px;
}

/* The extended monitor background is a true 16:9 scene, so no side letterboxing is needed. */
.computer-image-plane{width:min(100vw,calc(100vh * 1672 / 941));max-height:100vh}
.computer-fullscreen-panel>.modal-close{top:82px;right:22px}
.monitor-app-window .mail-list{height:calc(100% - 54px);overflow:auto;background:#0a161c}
.monitor-app-window .mail-list-view .mail-row{position:relative;grid-template-columns:30% minmax(0,1fr) auto;align-items:center;gap:14px;min-height:62px;padding:10px 16px;border-bottom:1px solid #2a3d44;background:#0d1d23}
.monitor-app-window .mail-list-view .mail-row:hover,.monitor-app-window .mail-list-view .mail-row:focus-visible{background:#172b32;outline:2px solid #c6a252;outline-offset:-2px}
.monitor-app-window .mail-list-view .mail-row span{display:grid;gap:5px}.monitor-app-window .mail-list-view .mail-row b{font-size:10px}.monitor-app-window .mail-list-view .mail-row small{color:#82949a;font-size:8px}.monitor-app-window .mail-list-view .mail-row strong{overflow:hidden;color:#e2e6e4;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.monitor-app-window .mail-list-view .mail-row em{padding:5px 7px;border:1px solid #9c7f43;color:#d6b76d;font-size:8px;font-style:normal}
.monitor-app-window .mail-reading-pane{position:relative;height:calc(100% - 54px);padding:28px 8%;overflow:auto;background:#0b181e}
.monitor-app-window .mail-reading-pane>small{color:#899da4;font-size:9px}.monitor-app-window .mail-reading-pane h3{margin:8px 0 5px;color:#eef0ea;font-size:22px}.monitor-app-window .mail-reading-pane>div{max-width:720px;margin-top:22px;color:#d8dfdc;font-size:12px;line-height:1.9;word-break:keep-all}.monitor-app-window .mail-reading-pane .mail-sender{padding-bottom:14px;border-bottom:1px solid #35484f;color:#aab8bc;font-size:10px}.monitor-app-window .mail-evidence-icon{float:right;width:86px;height:86px;margin:0 0 18px 28px;object-fit:contain;filter:drop-shadow(0 7px 8px rgba(0,0,0,.48))}
.monitor-app-window .contract-evidence-icon{position:absolute;z-index:3;right:9%;top:75px;width:68px;height:68px;object-fit:contain;filter:drop-shadow(0 7px 8px rgba(0,0,0,.48));pointer-events:none}
@media(max-width:900px){.computer-image-plane{width:min(100vw,calc(100vh * 1672 / 941));max-height:100vh}.monitor-app-window .mail-list-view .mail-row{grid-template-columns:34% minmax(0,1fr)}.monitor-app-window .mail-list-view .mail-row em{display:none}}