*{box-sizing:border-box}
:root{color-scheme:dark;--text:#d8e0e4;--muted:#8e9ba1;--cyan:#77d8ff;--safe:#a3c477;--orange:#d6ab61;--line:#414b51}
body{margin:0;background:#080b0c;color:var(--text);font:14px/1.4 "Segoe UI",Arial,sans-serif}
button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:linear-gradient(#1a2329,#0e151a);border:1px solid #455159;border-radius:3px;transition:border-color .15s,background .15s,box-shadow .15s}button:hover:not(:disabled){background:linear-gradient(#293842,#15212a);border-color:#95cce5}button:focus-visible{outline:2px solid #85dbff;outline-offset:3px}button:disabled{opacity:.35;cursor:not-allowed}.symbols{position:absolute;width:0;height:0;overflow:hidden}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;pointer-events:none}
.app{height:100vh;height:100dvh;display:grid;grid-template-rows:70px minmax(0,1fr) 31px;gap:0;padding:0 10px 5px;overflow:hidden;background:linear-gradient(90deg,#050809,#1a2023 1%,#11171b 2%,#11171b 98%,#1a2023 99%,#050809)}
.mission-header{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 14px;background:linear-gradient(#151b1f,#080d11 70%,#172129);border:1px solid #3c484f;border-top:0;box-shadow:inset 0 -3px #050709,0 3px 7px #000a;z-index:10;position:relative}
.mission-header:before,.mission-header:after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#838c91,#303638 50%,#0a0d0e 75%);box-shadow:0 0 0 1px #060809;top:5px}.mission-header:before{left:5px}.mission-header:after{right:5px}
.wordmark{display:flex;align-items:center;gap:8px;flex-shrink:0;margin-right:auto;font-size:23px;font-weight:800;letter-spacing:3px;text-shadow:0 2px 2px #000}.wordmark small{display:block;margin-top:2px;font-size:7px;font-weight:500;letter-spacing:1.3px;color:#929fa6}.brand-symbol{font-size:26px;color:#8d9a9f}
.day-card,.current-colonist,.actions-card,.status-card{display:flex;align-items:center;justify-content:center;min-height:42px;flex-shrink:0;border:1px solid #3b474f;border-radius:3px;background:linear-gradient(135deg,#1b2327,#0c1115);padding:8px 12px;box-shadow:inset 0 1px #58676e22,0 2px 5px #0006;white-space:nowrap;font-size:12px;font-weight:600;letter-spacing:.6px;text-transform:uppercase}
.day-card b{font-weight:600;margin-left:5px}.current-colonist{border-color:#5eacd2;box-shadow:inset 0 0 16px #0a8ec329,0 0 10px #138cbe22}.current-main h2{margin:0;font-size:12px;font-weight:600;line-height:1.2;letter-spacing:.5px;white-space:nowrap}.actions-card{gap:8px;position:relative;padding-right:12px}.ap-label{display:flex;align-items:center;gap:10px}.ap-label strong{font-size:14px;font-weight:600;letter-spacing:1px}.ap-track{display:flex;gap:4px;position:absolute;bottom:3px;left:12px}.ap-track span{width:3px;height:3px;background:#34434a;border-radius:50%}.ap-track .available{background:#84ddff;box-shadow:0 0 4px #74d8ff66}.team-stats{display:flex;align-items:center}.team-stats>span:first-child b{margin-left:5px;font-weight:650}.team-stats>span:not(:first-child){display:none}
.team-section{flex:0 1 270px;min-width:170px;padding:0 4px}.team{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px;align-items:center}.team-member{position:relative;min-width:0;height:37px;border:1px solid #54616a;border-radius:3px;background:linear-gradient(135deg,#172126,#080d10);overflow:hidden;opacity:.8}.team-member .crew-portrait{display:block;width:100%;height:100%;background-size:600% 400%;background-repeat:no-repeat;filter:brightness(.95)}.crew-number{position:absolute;right:1px;bottom:0;font-size:8px;font-weight:600;line-height:1;color:#b7c3c8;text-shadow:0 1px 3px #000,1px 0 #000}.team-member.current{border-color:#8fdfff;opacity:1;box-shadow:0 0 9px #51c5f699,inset 0 0 0 1px #4d9fcc}.team-member.current .crew-portrait{filter:brightness(1.15)}.team-member.current .crew-number{color:#c5efff}.team-member.dead{opacity:.3;filter:grayscale(1)}.team-member.dead:after{position:absolute;inset:0;content:'×';color:#e6a49d;font-size:24px;text-align:center}.team-member.protected{border-color:#a4c77b}.team-member.protected .crew-number{color:#d0e5b1}
.navigation-section{display:flex;align-items:center;gap:10px;flex-shrink:0}.direction-pad{display:flex;gap:3px}.direction-pad button{width:30px;height:34px;padding:0;font-size:20px;font-weight:400;line-height:1;color:#b9d1de}.direction-pad .left{order:0}.direction-pad .up{order:1}.direction-pad .down{order:2}.direction-pad .right{order:3}.direction-pad .attack-direction{border-color:#a48959;color:#e6c584;background:linear-gradient(#393024,#201c17)}.pad-center{display:none}.skip-button{display:flex;align-items:center;justify-content:center;gap:8px;padding:9px 13px;min-height:42px;white-space:nowrap;font-size:13px;font-weight:600;border:1px solid #75c5e9;border-radius:4px;background:linear-gradient(#204458,#0d2432);box-shadow:inset 0 1px #a9e6ff44,0 0 10px #5caed822;color:#e0edf5}.skip-button:hover:not(:disabled){background:linear-gradient(#2e607a,#16394b);box-shadow:0 0 10px #51b8ea55}.skip-button kbd{display:none}.utility-buttons{display:flex;align-items:center;gap:5px;margin-left:2px}.sound-button,.icon-button{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:28px;height:31px;padding:4px;font-size:18px;background:#111b21;color:#a8bec9;border-color:#3a505c;border-radius:3px}.sound-button svg{width:17px;height:17px}.sound-button>span{display:none}.sound-button.muted{opacity:.5}
.workspace{min-width:0;min-height:0;display:flex}.field-panel{width:100%;height:100%;position:relative;min-width:0;min-height:0;padding:13px 28px 15px;border:1px solid #252e34;border-top:0;background:linear-gradient(90deg,#080b0d,#384048 2%,#12181b 3.5%,#171d20 96.5%,#384048 98%,#080b0d);box-shadow:inset 0 3px 7px #000,inset 0 -5px 9px #000;overflow:hidden}
.field-panel:before,.field-panel:after{content:"";position:absolute;left:15px;right:15px;z-index:3;height:9px;pointer-events:none;border:1px solid #465056;box-shadow:inset 0 2px #737c7f33,0 3px 4px #0009;background:repeating-linear-gradient(90deg,#1b2226 0 28px,#101619 28px 34px,#4a5358 34px 36px,#151b1f 36px 75px)}.field-panel:before{top:0}.field-panel:after{bottom:0}
.board-coordinate-wrap{width:100%;height:100%;position:relative;min-width:0;min-height:0}.board{width:100%;height:100%;display:grid;grid-template-columns:repeat(16,minmax(0,1fr));grid-template-rows:repeat(15,minmax(0,1fr));position:relative;background:#252b2e;border:1px solid #080c0e;box-shadow:0 0 0 2px #485055,0 0 0 4px #0d1215,0 0 17px 5px #000b;isolation:isolate}
.board:after{content:"SECTOR\a 01";white-space:pre;position:absolute;left:69%;top:46%;font-size:clamp(10px,1.3vw,24px);line-height:1.05;font-weight:800;text-align:center;letter-spacing:1px;color:#b6bdbe22;pointer-events:none;z-index:1;transform:rotate(-.5deg)}
.tile{container-type:size;position:relative;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:transparent;isolation:isolate;overflow:visible}.deck-art{display:block;position:absolute;inset:0;z-index:-2;pointer-events:none;background-image:url('assets/colony-deck.png');background-size:200% 200%;background-repeat:no-repeat;filter:brightness(.87)}
.tile:hover:not(:disabled){background:transparent;box-shadow:inset 0 0 0 1px #8abbd277}.tile:focus-visible{outline:2px solid #8bd9ff;outline-offset:-2px}.tile:hover:not(:disabled) .deck-art{filter:brightness(1.02)}
.tile-art,.colonist-art,.crew-portrait,.legend-art{background-image:url('assets/colony-sprites.png');background-repeat:no-repeat}.tile-art,.colonist-art{background-size:300% 200%;display:block;position:absolute;pointer-events:none}.tile-art{z-index:1}.infection-art{background-position:0 100%;width:min(118cqw,158cqh);height:min(118cqw,158cqh);left:50%;top:50%;translate:-50% -50%;transform:rotate(var(--rotation));filter:drop-shadow(0 3px 2px #0008);animation:organism 5.5s ease-in-out infinite;animation-delay:calc(var(--variation)*-1.2s)}.tile.infected .deck-art{filter:brightness(.53)}.tile.infected{z-index:1}.partition-art{background-position:100% 100%;inset:-2%;filter:drop-shadow(0 3px 3px #000b);z-index:3}.tile.wall{cursor:not-allowed;z-index:2}
.colonist{position:absolute;inset:0;pointer-events:none;z-index:4}.colonist-art{width:min(92cqw,110cqh);height:min(92cqw,110cqh);left:50%;top:48%;translate:-50% -50%;background-position:0 0;filter:drop-shadow(2px 3px 2px #000a)}.colonist-id{position:absolute;left:50%;bottom:2px;translate:-50% 0;min-width:12px;line-height:1;padding:1px 2px;text-align:center;font-size:clamp(7px,.65vw,11px);font-weight:700;border:1px solid #c0d5df66;border-radius:2px;background:#111b20c9;color:#ebf5fa;text-shadow:0 1px #000}.tile.selected{z-index:6}.tile.selected .deck-art{filter:brightness(.93)}.tile.selected:before{content:"";position:absolute;inset:1px;background:radial-gradient(ellipse,#227baa22,#369ed044);box-shadow:inset 0 0 0 2px #80d6ff,0 0 10px #40b9ff77;pointer-events:none;z-index:1}.selection-corner{position:absolute;inset:-1px;border:1px solid #c2eaff99;pointer-events:none;z-index:4;box-shadow:0 0 7px #67c4ff44}
.tile.reachable:after{content:"";position:absolute;inset:3px;border:1px dashed #67c5ff9c;background:#2c88ad18;z-index:3;pointer-events:none}.tile.reachable.infected:after{border-color:#c2ca81c9;background:#bdd07e0c}.target-dot{position:absolute;left:50%;top:50%;width:3px;height:3px;translate:-50% -50%;background:#9dc9df99;border-radius:50%;z-index:3;pointer-events:none}.tile.safe .deck-art{filter:brightness(.9) sepia(.22) hue-rotate(27deg)}.tile.safe:before{content:"";position:absolute;inset:0;background:#718c3826;box-shadow:inset 0 0 0 1px #b3ce7644;pointer-events:none;z-index:0}
.bulkhead{position:absolute;top:9px;bottom:10px;width:24px;pointer-events:none;z-index:8;background:repeating-linear-gradient(0deg,transparent 0 80px,#77848c22 81px 83px,#02040588 84px 89px,transparent 90px 145px),linear-gradient(90deg,#040708,#253139 13%,#080d10 24%,#3d464a 33%,#101619 49%,#05080a 57%,#343c40 70%,#11181c 82%,#05090b);box-shadow:inset 1px 0 #78828b44,3px 0 6px #000b}.bulkhead-left{left:1px}.bulkhead-right{right:1px;transform:scaleX(-1)}.bulkhead-light{position:absolute;width:4px;height:40px;left:11px;top:7%;background:linear-gradient(90deg,#b25a16,#ffca72,#db7f29);border:1px solid #ac713d;border-radius:2px;box-shadow:0 0 6px #ffb348b3,0 0 20px 8px #f49c2f2b}.bulkhead-light:nth-child(2){top:30%}.bulkhead-light:nth-child(3){top:60%}.bulkhead-light:nth-child(4){top:86%}
.status-strip{display:flex;align-items:center;gap:16px;min-width:0;padding:3px 11px;background:#0c1216;border:1px solid #303c43;border-top:0;font-size:10px;color:#a0adb3;white-space:nowrap}.field-caption{display:flex;align-items:center;gap:7px;min-width:0;flex:0 1 auto}.action-hint{margin:0;font-size:10px;overflow:hidden;text-overflow:ellipsis}.field-caption-end{display:none}.signal-bars{display:flex;align-items:end;gap:2px;height:8px;flex-shrink:0}.signal-bars i{width:2px;height:4px;background:#9db27a}.signal-bars i:nth-child(2){height:5px}.signal-bars i:nth-child(3){height:7px}.signal-bars i:nth-child(4){height:8px}.field-topline{display:flex;align-items:center;gap:12px;margin-left:auto;font-size:9px;color:#8f9ba1}.field-topline>.eyebrow{font-size:8px;letter-spacing:1px}.infection-count{white-space:nowrap;font-size:9px}.infection-count i{display:inline-block;width:5px;height:5px;background:#a4b76b;border-radius:50%;box-shadow:0 0 5px #b3cf6b66;margin-right:4px}.infection-count b{font-weight:600;color:#c7d79e;margin-left:3px}.event-panel{display:flex;align-items:center;gap:6px;max-width:35%;min-width:0;overflow:hidden}.event-mark{color:#85b7cc;font-size:14px}.event-panel p{margin:0;overflow:hidden;text-overflow:ellipsis;font-size:9px}.event-phase{display:none}
.spreading .board{box-shadow:0 0 0 2px #55634a,0 0 22px #99b74833}.spreading .tile{cursor:wait}.new-infection .tile-art{animation:grow .55s ease-out,organism 5.5s .55s ease-in-out infinite}@keyframes grow{from{opacity:.1;transform:scale(.5)}to{opacity:1;transform:scale(1)}}
.eyebrow{font-size:10px;font-weight:600;letter-spacing:1.8px;color:#a0b2bb}dialog{width:calc(100% - 32px);max-width:610px;max-height:calc(100dvh - 32px);overflow:auto;padding:34px;border-radius:6px;border:1px solid #64747b;background:linear-gradient(135deg,#242d32,#10171b 75%);box-shadow:0 30px 120px #000c,inset 0 1px #94a3a333;color:var(--text)}dialog::backdrop{background:#03080ac9;backdrop-filter:blur(4px)}dialog h2{font-size:29px;line-height:1.15;margin:14px 0 20px}dialog p,dialog li{font-size:14px;line-height:1.7;color:#bcc7cd}dialog li{margin-bottom:9px}dialog ol{padding-left:22px}.dialog-close{position:absolute;right:12px;top:12px;width:32px;height:32px;border:0;background:transparent;color:#aabcc5;font-size:25px}.dialog-note{margin-top:19px;padding-top:16px;border-top:1px solid #4b585f;color:#9aafb8!important;font-size:12px!important}.briefing-step{display:flex;align-items:start;gap:17px;margin:17px 0}.briefing-step>span{padding-top:4px;font-size:10px;letter-spacing:1px;color:#8dc4dd}.briefing-step p{margin:0;font-size:13px;line-height:1.65;color:#aabcc6}.briefing-step b{font-weight:600;color:#deedf4}#start-dialog h2{font-size:35px;font-weight:600;letter-spacing:-.6px}#start-dialog .skip-button{width:100%;margin-top:25px;font-size:18px}.start-controls{font-size:11px!important;text-align:center;color:#94adb9!important;margin-bottom:0}#result-dialog .skip-button{width:100%}#result-dialog .reset-button{display:block;margin:15px auto 0;padding:3px 10px;color:#a2bbc8;font-size:11px;border:0;background:transparent}.legend-section{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-top:16px}.legend-item{display:flex;align-items:center;gap:8px;font-size:12px;color:#bac9d0}.legend-art{display:block;position:static;width:34px;height:34px;background-size:300% 200%;background-repeat:no-repeat;translate:none;animation:none;transform:none;filter:none}.legend-item svg{width:29px;height:29px}.safe-icon{color:#a9c77b}
@media(min-width:1800px){.app{grid-template-rows:80px minmax(0,1fr) 33px;padding-inline:12px}.mission-header{gap:14px;padding-inline:20px}.wordmark{font-size:29px}.wordmark small{font-size:8px}.day-card,.current-colonist,.actions-card,.status-card{min-height:46px;padding-inline:16px;font-size:14px}.current-main h2{font-size:14px}.ap-label strong{font-size:16px}.team-section{flex-basis:330px}.team-member{height:42px}.team{gap:7px}.direction-pad button{width:36px;height:38px}.skip-button{font-size:15px;min-height:46px;padding-inline:18px}.icon-button,.sound-button{width:33px;height:36px}.utility-buttons{gap:7px}.field-panel{padding-inline:36px}.bulkhead{width:31px}.bulkhead-light{left:16px}.status-strip{font-size:11px}.action-hint{font-size:11px}}
@media(max-width:1430px){.mission-header{gap:7px;padding-inline:10px}.wordmark{font-size:20px;letter-spacing:2px}.wordmark small{font-size:6px}.brand-symbol{font-size:22px}.day-card,.current-colonist,.actions-card,.status-card{padding-inline:9px;font-size:11px}.current-main h2{font-size:11px}.ap-label{gap:7px}.ap-label strong{font-size:13px}.team-section{flex-basis:218px;min-width:165px}.team{gap:4px}.team-member{height:33px}.navigation-section{gap:7px}.direction-pad button{width:27px;height:32px;font-size:19px}.skip-button{font-size:12px;padding-inline:10px}.utility-buttons{gap:4px}.sound-button,.icon-button{width:26px;height:29px}.status-strip .field-topline>.eyebrow{display:none}.status-strip{gap:12px}}
@media(max-width:1200px){.app{grid-template-rows:102px minmax(0,1fr) 29px;padding-inline:7px}.mission-header{display:grid;grid-template-columns:130px 80px 115px 130px 90px minmax(0,1fr);grid-template-rows:42px 37px;gap:5px 8px;padding:8px 12px}.wordmark{grid-row:1;grid-column:1;margin:0}.day-card{grid-row:1;grid-column:2}.current-colonist{grid-row:1;grid-column:3}.actions-card{grid-row:1;grid-column:4}.status-card{grid-row:1;grid-column:5}.day-card,.current-colonist,.actions-card,.status-card{min-height:37px;height:37px}.team-section{grid-row:1;grid-column:6;min-width:0;padding:0;max-width:290px;justify-self:end;width:100%}.team-member{height:35px}.navigation-section{grid-row:2;grid-column:1/6;justify-self:end;gap:14px}.direction-pad button{width:34px;height:31px}.skip-button{min-height:33px;padding:6px 15px;font-size:12px}.utility-buttons{grid-row:2;grid-column:6;justify-self:end}.sound-button,.icon-button{width:28px;height:29px}.event-panel{max-width:33%}.action-hint{font-size:9px}.field-panel{padding-inline:25px}.bulkhead{width:21px}}
@media(max-width:800px){.app{grid-template-rows:105px minmax(0,1fr) 29px;padding-inline:5px}.mission-header{grid-template-columns:110px 68px 98px 111px minmax(0,1fr);gap:5px 6px;padding-inline:9px}.wordmark{font-size:18px}.wordmark small{font-size:5px;letter-spacing:.8px}.brand-symbol{display:none}.status-card{grid-row:2;grid-column:1;justify-self:start;font-size:10px;padding-inline:7px}.team-section{grid-row:1;grid-column:5}.team{gap:3px}.team-member{height:29px}.navigation-section{grid-column:2/5;gap:9px}.direction-pad button{width:28px}.skip-button{font-size:11px;padding-inline:10px}.utility-buttons{grid-column:5;gap:3px}.sound-button,.icon-button{width:25px;height:28px}.current-main h2,.day-card{font-size:10px}.ap-label{font-size:9px}.ap-label strong{font-size:12px}.event-panel{display:none}.field-topline{margin-left:auto}.field-panel{padding:10px 20px 11px}.bulkhead{width:17px}.bulkhead-light{left:7px;width:3px;height:30px}.field-panel:before,.field-panel:after{left:10px;right:10px;height:7px}.status-strip{padding-inline:7px;gap:8px}.action-hint{font-size:9px}}
@media(max-width:600px){.app{grid-template-rows:144px minmax(0,1fr) 31px;padding:0 4px 3px}.mission-header{grid-template-columns:75px 69px minmax(0,1fr) 91px;grid-template-rows:30px 42px 45px;gap:6px;padding:6px 7px 8px}.wordmark{grid-row:1;grid-column:1/3;font-size:18px;letter-spacing:2px}.wordmark small{font-size:5px;letter-spacing:.9px}.day-card{grid-row:2;grid-column:1;min-height:37px;height:37px;padding:7px 3px;font-size:9px}.current-colonist{grid-row:2;grid-column:2/4;min-height:37px;height:37px;padding:7px 5px}.current-main h2{font-size:12px}.actions-card{grid-row:2;grid-column:4;min-height:37px;height:37px;padding:5px}.ap-label{gap:6px;font-size:7px}.ap-label strong{font-size:12px}.ap-track{left:6px;bottom:3px}.status-card{display:none}.team-section{grid-row:1;grid-column:3/5;height:30px;max-width:240px}.team{gap:3px;height:30px}.team-member{height:28px}.crew-number{font-size:7px}.navigation-section{grid-row:3;grid-column:1/4;justify-self:stretch;display:flex;justify-content:space-between;gap:5px}.direction-pad{gap:3px}.direction-pad button{width:26px;height:33px;font-size:18px}.skip-button{font-size:9px;min-height:35px;padding:6px 7px;gap:0}.utility-buttons{grid-row:3;grid-column:4;display:grid;grid-template-columns:repeat(2,27px);gap:3px;justify-self:center}.sound-button,.icon-button{width:27px;height:22px;font-size:15px;padding:2px}.sound-button svg{width:15px;height:15px}.field-panel{padding:9px 12px 10px}.bulkhead{width:9px}.bulkhead-light{left:4px;width:2px;height:22px;box-shadow:0 0 4px #ffb348b3,0 0 10px 3px #f49c2f2b}.field-panel:before,.field-panel:after{left:5px;right:5px;height:6px}.board{box-shadow:0 0 0 1px #485055,0 0 10px #000b}.board:after{font-size:9px}.colonist-art{width:min(115cqw,110cqh);height:min(115cqw,110cqh)}.colonist-id{font-size:6px;min-width:8px;padding:0 1px;bottom:0}.tile.reachable:after{inset:1px}.selection-corner{inset:0}.tile.selected:before{box-shadow:inset 0 0 0 1px #80d6ff,0 0 8px #40b9ff77}.status-strip{padding:3px 6px;gap:7px}.action-hint{font-size:8px;line-height:1.2;max-height:22px;white-space:normal}.infection-count{font-size:8px}.field-topline{gap:0}.infection-count i{width:4px;height:4px}.signal-bars{display:none}dialog{padding:24px}dialog h2{font-size:25px}dialog p,dialog li{font-size:12px}.briefing-step{gap:12px;margin:12px 0}.briefing-step p{font-size:12px}#start-dialog h2{font-size:28px}#start-dialog .skip-button{font-size:16px;min-height:46px}}
@media(max-width:360px){.mission-header{grid-template-columns:64px 54px minmax(0,1fr) 78px;gap:5px}.wordmark{font-size:15px}.wordmark small{font-size:4px;letter-spacing:.8px}.team{gap:2px}.team-member{height:24px}.crew-number{font-size:6px}.current-main h2{font-size:10px}.ap-label{gap:4px;font-size:6px}.ap-label strong{font-size:10px}.direction-pad button{width:22px}.direction-pad{gap:2px}.navigation-section{gap:4px}.navigation-section .skip-button{font-size:8px;padding-inline:5px}.utility-buttons{grid-template-columns:repeat(2,25px)}.sound-button,.icon-button{width:25px}.day-card{font-size:8px}}
@media(max-height:500px) and (min-width:601px){.app{grid-template-rows:79px minmax(0,1fr) 24px;padding-bottom:2px}.mission-header{grid-template-rows:31px 31px;padding-block:4px;gap:4px 6px}.wordmark{font-size:17px}.day-card,.current-colonist,.actions-card,.status-card{height:29px;min-height:29px;padding-block:4px}.team-member{height:27px}.navigation-section .skip-button{min-height:29px;padding-block:4px}.direction-pad button{height:27px}.utility-buttons .icon-button,.utility-buttons .sound-button{height:27px}.field-panel{padding-block:8px}.field-panel:before,.field-panel:after{height:5px}.action-hint{font-size:8px}.bulkhead-light{height:19px}.status-strip{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

@media(max-width:600px){.status-card{display:flex;position:absolute;top:7px;left:108px;min-height:25px;height:25px;max-width:55px;padding:3px 5px;font-size:8px;letter-spacing:0}.status-card .team-stats>span:first-child{font-size:0}.status-card .team-stats>span:first-child:before{content:"ЖИВЫ ";font-size:7px}.status-card .team-stats>span:first-child b{font-size:10px;margin-left:2px}}
@media(max-width:360px){.status-card{left:88px;padding-inline:4px;max-width:45px}.status-card .team-stats>span:first-child:before{font-size:6px}.status-card .team-stats>span:first-child b{font-size:9px}}
@media(max-width:600px){.status-card{grid-area:auto;justify-self:auto}.wordmark{justify-self:start;width:max-content}}
/* Square tactical grid, with the station's machinery occupying the side wings. */
.field-panel{container-type:size;padding:0;--map-width:min(calc(100cqw - 76px),calc((100cqh - 34px)*16/15));background:radial-gradient(ellipse at 50% 45%,#1b2225,#080d10 75%)}
.board-coordinate-wrap{position:absolute;left:50%;top:50%;translate:-50% -50%;width:var(--map-width);height:calc(var(--map-width)*15/16);isolation:isolate;z-index:4}
.board-coordinate-wrap:before{content:"";position:absolute;inset:-12px;z-index:-1;border:1px solid #667176;box-shadow:inset 0 2px #9ea7ab33,inset 0 -4px 6px #000c,0 0 20px #000;background:repeating-linear-gradient(90deg,#1f282e 0 18px,#4d575c 18px 20px,#11191e 20px 33px,#252e34 33px 60px)}
.decorative-wing{position:absolute;top:12px;bottom:12px;width:max(0px,calc((100cqw - var(--map-width))/2 - 25px));overflow:hidden;pointer-events:none;z-index:1;background:repeating-linear-gradient(0deg,transparent 0 122px,#080c0e 122px 126px,#5b62661a 126px 128px),linear-gradient(90deg,#060a0d,#2a3237 17%,#151e24 22%,#10171b 78%,#242e34 84%,#070c0f);box-shadow:inset 0 0 35px 12px #0009}
.decorative-wing-left{left:14px}.decorative-wing-right{right:14px;transform:scaleX(-1)}.decorative-wing-right .wing-label,.decorative-wing-right .wing-console{transform:scaleX(-1)}
.wing-label{position:absolute;top:5%;left:14%;right:14%;text-align:center;font-size:clamp(8px,.8vw,13px);letter-spacing:3px;color:#76838766;white-space:nowrap;overflow:hidden}.wing-vent{position:absolute;left:18%;right:18%;height:16%;top:13%;border:5px solid #202a30;box-shadow:0 0 0 1px #45535c55,inset 0 2px 12px #000,0 4px 7px #000a;background:repeating-linear-gradient(0deg,#04080a 0 5px,#3f4b5266 6px 7px,#141e24 8px 11px)}.wing-vent-bottom{top:auto;bottom:8%;height:19%}.wing-pipes{position:absolute;inset:3% 0;width:100%;display:flex;justify-content:space-around;opacity:.7}.wing-pipes i{display:block;width:7px;height:100%;border:1px solid #29343b;border-radius:3px;box-shadow:2px 0 4px #0009;background:repeating-linear-gradient(0deg,transparent 0 150px,#607079 150px 152px,#10191e 153px 159px,transparent 160px 210px),linear-gradient(90deg,#080c0f,#606b72 35%,#202d35 57%,#060b0f)}
.wing-console{position:absolute;left:15%;right:15%;top:38%;height:23%;min-width:85px;border:1px solid #59697355;outline:5px solid #172229;background:linear-gradient(130deg,#12232c,#060e13);box-shadow:0 6px 12px #000a,inset 0 0 22px #000b;padding:12px 7px;text-align:center;color:#829daa99;white-space:nowrap;overflow:hidden}.wing-console span{font-size:clamp(6px,.65vw,10px);letter-spacing:1.3px}.wing-console b{display:block;font-size:clamp(9px,1.2vw,19px);letter-spacing:2px;font-weight:500;margin-top:7px}.wing-console small{font-size:clamp(5px,.5vw,8px);letter-spacing:.8px}.console-bars{display:flex;justify-content:center;gap:4px;margin:14px auto 12px;align-items:end;height:27px}.console-bars i{width:10px;height:15px;background:#7b9f7455;border-top:2px solid #a9c88766;box-shadow:0 0 6px #b4dc6222;animation:console-signal 8s ease-in-out infinite}.console-bars i:nth-child(2){height:23px;animation-delay:-2s}.console-bars i:nth-child(3){height:19px;animation-delay:-5s}.console-bars i:nth-child(4){height:27px;animation-delay:-3s}.console-bars i:nth-child(5){height:13px;animation-delay:-6s}
/* Region renderers draw continuous surfaces with borders only on exposed sides. */
.wall-network,.infestation-network{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.wall-network{z-index:3;filter:drop-shadow(1px 3px 2px #0009)}.wall-depth{fill:#06090b;transform:translateY(6px)}.wall-face{stroke:none}.wall-sheen{fill:#a4b0b9;opacity:.13}.wall-frame{fill:none;stroke:#263035;stroke-width:11;stroke-linecap:square}.wall-caution{fill:none;stroke:url(#wall-stripes);stroke-width:4.2;stroke-linecap:square}.wall-highlight{fill:none;stroke:#c1cbd0;stroke-width:1;opacity:.65;transform:translate(1px,1px)}.wall-bolts{fill:#a1acb1;stroke:#111a20;stroke-width:1.5}
.infestation-network{z-index:0}.tile.infected .deck-art{visibility:hidden}.biomass-body{fill:none;stroke:#161411;stroke-width:101;stroke-linecap:round;stroke-linejoin:round}.biomass-skin{fill:none;stroke:#29201c;stroke-width:82;stroke-linecap:round;stroke-linejoin:round;opacity:.75;filter:drop-shadow(1px 2px 2px #000)}.biomass-vein-shadow{fill:none;stroke:#080e0b;stroke-width:8;stroke-linecap:round;opacity:.8}.biomass-veins{fill:none;stroke:#594331;stroke-width:2.8;stroke-linecap:round;opacity:.6;animation:tissue-pulse 6.3s ease-in-out infinite;animation-delay:var(--pulse-delay)}
.tile .infection-art{animation:organism 5.5s ease-in-out infinite,tendril-sway 8s ease-in-out infinite;animation-delay:calc(var(--variation)*-1.2s),calc(var(--variation)*-1.8s);transform-origin:50% 53%}
.casualty-person,#board .colonist-art{background-image:url('assets/colonist-idle.png')}
#board .colonist-art{background-size:400% 200%;width:92cqw;height:92cqw;max-width:108cqh;max-height:108cqh;animation:idle-frames var(--idle-duration,7s) steps(1,end) infinite,watchful-sway 9s ease-in-out infinite;animation-delay:var(--idle-delay,0s),var(--idle-delay,0s);transform-origin:50% 70%}
@keyframes tendril-sway{0%,100%{transform:rotate(-1deg) scale(1)}50%{transform:rotate(1deg) scale(1.035,.975)}}@keyframes tissue-pulse{0%,100%{opacity:.42}50%{opacity:.77}}@keyframes console-signal{0%,100%{opacity:.5}50%{opacity:.85}}
@media(max-width:800px){.field-panel{--map-width:min(calc(100cqw - 48px),calc((100cqh - 28px)*16/15))}.decorative-wing{width:max(0px,calc((100cqw - var(--map-width))/2 - 19px))}.wing-console{min-width:50px;padding:6px 2px}.wing-label{letter-spacing:1px}.wing-pipes i{width:4px}.wing-vent{border-width:3px}.board-coordinate-wrap:before{inset:-9px}.console-bars{gap:2px}.console-bars i{width:5px}}
@media(max-width:600px){.field-panel{--map-width:min(calc(100cqw - 30px),calc((100cqh - 22px)*16/15))}.decorative-wing{display:none}.board-coordinate-wrap:before{inset:-6px}.colonist-id{bottom:0}.board:after{font-size:8px}}
@media(prefers-reduced-motion:reduce){.biomass-veins,#board .colonist-art,.tile .infection-art,.console-bars i{animation:none!important}}
.colonist-instance{container-type:size;position:absolute;pointer-events:none}.colonist-instance .colonist-id{top:calc(48% + min(38cqw,42cqh));bottom:auto;font-size:clamp(6px,.65vw,11px)}.colonist-instance.active-colonist .colonist-id{border-color:#9ce2ff;color:#e9faff;background:#17394bd9;box-shadow:0 0 4px #6bcfff66}.colonist-instance.active-colonist .colonist-art{filter:drop-shadow(0 0 2px #64bbdf99) drop-shadow(1px 2px 2px #000a)}
@media(max-width:600px){.colonist-instance .colonist-id{font-size:6px;line-height:1;min-width:7px;padding:0}}
.colonist-instance .colonist-id{top:auto;bottom:1px}
@media(max-width:600px){.decorative-wing{display:block;left:13px;right:13px;width:auto;height:max(0px,calc((100cqh - var(--map-width)*15/16)/2 - 18px))}.decorative-wing-left{top:10px;bottom:auto}.decorative-wing-right{top:auto;bottom:10px;transform:none}.decorative-wing-right .wing-label{transform:none}.wing-label{top:7%;font-size:8px;letter-spacing:3px}.wing-vent{top:28%;height:57%;left:14%;right:14%;border-width:3px}.wing-vent-bottom,.wing-console{display:none}.wing-pipes{opacity:.3}.wing-pipes i{width:3px}}
.effects-layer{position:absolute;inset:0;z-index:12;pointer-events:none;overflow:visible}.casualty{position:absolute;pointer-events:none}.casualty-instance{container-type:size;position:absolute}.casualty-person{display:block;position:absolute;left:50%;top:48%;translate:-50% -50%;width:92cqw;height:92cqw;max-width:108cqh;max-height:108cqh;background-size:400% 200%;background-position-x:0%;background-repeat:no-repeat;transform-origin:50% 70%;animation:colonist-death 1.1s ease-in forwards}.casualty-halo{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(ellipse,#eb67474d,transparent 67%);animation:death-flash 1.1s ease-out forwards}.casualty-number{position:absolute;left:50%;bottom:1px;translate:-50% 0;font-size:9px;line-height:1;color:#f0a08a;background:#301712cc;border:1px solid #a76752;padding:1px 2px;border-radius:2px;animation:death-flash 1.1s ease-out forwards}
@keyframes death-flash{0%{opacity:1;transform:scale(.7)}25%{opacity:.8;transform:scale(1.1)}100%{opacity:0;transform:scale(1.3)}}
@media(prefers-reduced-motion:reduce){.casualty-person{animation:death-reduced 1.1s linear forwards}.casualty-halo{animation:none;opacity:0}.casualty-number{animation:death-reduced 1.1s linear forwards}}@keyframes death-reduced{0%,30%{opacity:1}100%{opacity:0}}
.wall-frame{stroke:#626e75;stroke-width:9}.wall-highlight{stroke-width:1.7;opacity:.8}
.wordmark .mode-button{display:block;padding:0;margin:0;border:0;border-radius:0;background:none;box-shadow:none;font:inherit;color:#bdcc9a;letter-spacing:inherit;text-transform:uppercase;line-height:1.3}.wordmark .mode-button:hover{color:#dbedb3;background:none}.mode-picker{border:1px solid #50606966;border-radius:4px;background:#111b2099;padding:12px 14px;margin:18px 0}.mode-picker label{font-size:9px;letter-spacing:1.4px;color:#a4b8c2;display:block;margin-bottom:8px}.mode-picker select{width:100%;border:1px solid #627a88;border-radius:3px;padding:9px 10px;background:#14252f;color:#e0edf4;font:14px "Segoe UI",Arial,sans-serif}.mode-picker p{font-size:12px;line-height:1.5;margin:9px 0 0;color:#a9bec9}#mode-dialog .skip-button{width:100%}#mode-dialog .reset-button{display:block;margin:15px auto 0;padding:3px 10px;color:#a2bbc8;font-size:11px;border:0;background:transparent}
/* Raster volume materials: continuous tissue and a sliced raised frame. */
.bulkhead-texture-probe{background-image:url('assets/bulkhead-volume.png')}.biomass-texture-probe{background-image:url('assets/biomass-volume.png')}
.colonist-layer{position:absolute;inset:0;z-index:8;pointer-events:none;overflow:visible}.colonist-layer .colonist-group{inset:auto;position:absolute;overflow:visible}.colonist-instance{overflow:visible}.colonist-instance .colonist-id{font-size:clamp(7px,.65vw,11px)}
.wall-network{filter:drop-shadow(1px 4px 2px #000a)}.wall-contact-shadow{fill:#040709;opacity:.75;transform:translateY(13px)}.wall-depth{fill:#283038;transform:translateY(8px)}.wall-outline{fill:none;stroke:#0a1015;stroke-width:3;stroke-linecap:square}.wall-frame-slice{pointer-events:none}.wall-face-light{pointer-events:none}
.biomass-component{filter:drop-shadow(2px 3px 2px #000a)}.biomass-material{animation:biomass-breath 7s ease-in-out infinite;animation-delay:var(--pulse-delay);transform-origin:center}.biomass-arrival{fill:white;animation:biomass-emerge .7s ease-out both}@keyframes biomass-emerge{from{opacity:0}to{opacity:1}}
@media(max-width:600px){.colonist-instance .colonist-id{font-size:6px}}
@media(prefers-reduced-motion:reduce){.biomass-material,.biomass-arrival{animation:none!important}}

/* Neighbour-aware infection: open roots in one-cell branches, raised tissue in 2x2+ areas. */
.tile.infected .deck-art{visibility:visible;filter:brightness(.8)}
.infestation-network{z-index:2}
.biomass-component{filter:none}
.biomass-link path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.root-shadow{stroke:#090709;stroke-width:21;filter:drop-shadow(1px 3px 2px #000c)}
.root-flesh{stroke:url(#biomass-material);stroke-width:14}
.root-glint{stroke:#ad8970;stroke-width:1.8;opacity:.35;transform:translate(-1px,-2px)}
.biomass-node{filter:drop-shadow(1px 3px 2px #000b);animation:biomass-breath 6.7s ease-in-out infinite;animation-delay:var(--node-delay)}
.biomass-raised-shadow{fill:#090709;stroke:#090709;stroke-width:7;transform:translate(3px,9px);filter:blur(3px)}
.biomass-material{filter:drop-shadow(2px 4px 2px #000b)}
.biomass-rim-light{fill:none;stroke:#ab9571;stroke-width:2.2;opacity:.18;transform:translate(-1px,-2px);pointer-events:none}
@media(prefers-reduced-motion:reduce){.biomass-node{animation:none!important}}

/* Crew messenger occupies the right decorative wing; narrow screens use a drawer. */
.crew-chat{position:absolute;right:14px;top:14px;bottom:14px;width:var(--radio-width,320px);z-index:15;display:none;flex-direction:column;min-height:0;border:1px solid #455159;border-radius:5px;background:linear-gradient(145deg,#172025f7,#0a1115fa);box-shadow:0 6px 25px #000b,inset 0 1px #83949e22;overflow:hidden}
.crew-chat.docked,.crew-chat.open{display:flex}.crew-chat.open:not(.docked){box-shadow:0 7px 35px #000e,0 0 0 1px #5e747e}
.radio-heading{display:flex;align-items:center;gap:9px;padding:14px 13px 12px;background:linear-gradient(#253137,#121c22);border-bottom:1px solid #45515988;flex:none}
.radio-channel-icon{font-size:24px;color:#91b6a2;text-shadow:0 0 12px #9cd2ae44}.radio-heading h2{font-size:15px;margin:0;font-weight:600;letter-spacing:.3px}.radio-heading #chat-online{font-size:10px;color:#9eb9a6;display:block;margin-top:2px}.radio-heading button{margin-left:auto;width:26px;height:26px;padding:0;background:none;border:0;font-size:23px;color:#9eb3bb}.crew-chat.docked #chat-close{display:none}
.radio-members{display:flex;gap:4px;align-items:center;padding:8px 12px;border-bottom:1px solid #51646f33;background:#111b20}.radio-members>span{display:flex;align-items:center;justify-content:center;width:18px;height:18px;border:1px solid #60717b66;border-radius:50%;background:#253339;color:#b3c5cb;font-size:9px}.radio-members small{margin-left:auto;font-size:7px;letter-spacing:1px;color:#7a929d}
.radio-history{position:relative;flex:1;min-height:0;display:flex;overflow:hidden;background:radial-gradient(ellipse at 70% 20%,#283b3922,transparent 70%),repeating-linear-gradient(35deg,transparent 0 40px,#8da1a403 40px 41px)}
.radio-messages{flex:1;min-width:0;padding:12px 10px 16px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#53656d #10191e}.radio-messages:focus-visible{outline:1px solid #789cab;outline-offset:-2px}
.radio-message{display:flex;gap:6px;align-items:flex-start;margin:0 0 12px;min-width:0;animation:radio-arrive .2s ease-out}.radio-avatar{width:27px;height:30px;flex:none;border-radius:5px;border:1px solid #5d737a77;background-color:#17252c;background-image:url('assets/colony-sprites.png');background-size:600% 400%;background-repeat:no-repeat;box-shadow:0 2px 4px #0005}
.radio-bubble{position:relative;min-width:0;max-width:calc(100% - 33px);padding:8px 9px 6px;border:1px solid #4d636b66;border-radius:0 9px 9px 9px;background:linear-gradient(135deg,#28373d,#1b292f);box-shadow:0 2px 4px #0003}
.radio-message-heading{display:flex;align-items:baseline;flex-wrap:wrap;gap:3px 8px;margin-bottom:4px}.radio-message-heading b{font-size:10px;font-weight:650;color:#a9d6e2}.radio-time{margin-left:auto;font-size:8px;color:#7d969f;white-space:nowrap}.radio-bubble p{font-size:12px;line-height:1.5;color:#d0dcdf;margin:0;overflow-wrap:anywhere}.radio-read{display:block;text-align:right;color:#8bbbad;font-size:9px;line-height:1;margin-top:3px}
.radio-message.outgoing{flex-direction:row}.outgoing .radio-bubble{background:linear-gradient(130deg,#29413f,#1b3432);border-color:#617b6966;border-radius:0 9px 9px 9px}.outgoing .radio-message-heading b{color:#bfd4a6}
.radio-message.system{margin:8px 0 13px;justify-content:center}.system .radio-bubble{max-width:100%;padding:5px 7px;border:0;background:#111b20a3;box-shadow:none;border-radius:5px}.system .radio-message-heading{justify-content:center;margin-bottom:2px}.system .radio-message-heading b{display:none}.system .radio-time{margin:0;font-size:8px}.system .radio-bubble p{font-size:10px;color:#889fa9;text-align:center;line-height:1.4}
.warning .radio-bubble{border-color:#99784c88;background:linear-gradient(130deg,#3b3427,#2a2922)}.warning .radio-message-heading b{color:#d8bd89}.death .radio-bubble{border-color:#a05b4f99;background:linear-gradient(130deg,#402a28,#291c20)}.death .radio-message-heading b{color:#e0aa95}.death .radio-avatar{filter:saturate(.25);border-color:#9b695c}.radio-signal-lost{display:block;font-size:7px;letter-spacing:.6px;color:#b48074;margin-top:7px}.safe .radio-bubble{border-color:#7c9a6277}.safe .radio-message-heading b{color:#b8d49e}
.radio-new{position:absolute;bottom:7px;left:50%;translate:-50% 0;white-space:nowrap;padding:6px 10px;border-radius:16px;border-color:#6a8b8a;font-size:10px;background:#284b49;box-shadow:0 3px 9px #0007}
.radio-footer{display:flex;align-items:center;gap:6px;flex:none;min-height:33px;padding:8px 10px;border-top:1px solid #52646c44;background:#111b20;font-size:8px;color:#829b9d}.radio-footer i{width:4px;height:4px;flex:none;border-radius:50%;background:#94b287;box-shadow:0 0 5px #b3d39144}.radio-bars{margin-left:auto;font-size:11px;letter-spacing:1px;color:#668b76}.radio-offline .radio-footer i{background:#bb6a5b;box-shadow:none}.radio-offline #chat-online{color:#bd897d}
.chat-toggle{position:absolute;right:18px;bottom:12px;z-index:16;display:flex;align-items:center;gap:7px;padding:7px 11px;border-color:#738d88;background:linear-gradient(#304941,#162922);box-shadow:0 3px 10px #000b;font-size:11px}.chat-toggle[hidden],.radio-new[hidden],#chat-unread[hidden]{display:none}.chat-toggle>span{color:#a7d3af}.chat-toggle b{padding:1px 5px;border-radius:9px;background:#c3b985;color:#172022;font-size:9px}.chat-docked .decorative-wing-right{opacity:.25}
@keyframes radio-arrive{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:600px){.crew-chat{top:10px;bottom:10px;right:10px;max-width:calc(100% - 20px)}.chat-toggle{right:13px;bottom:10px;font-size:10px;padding:6px 9px}.radio-messages{padding:10px 9px}.radio-bubble p{font-size:12px}.radio-heading{padding:11px 12px}}
@media(prefers-reduced-motion:reduce){.radio-message{animation:none!important}}

.radio-members>span.offline{opacity:.3;text-decoration:line-through;border-color:#84615b}

.radio-heading #voice-toggle{width:auto;height:32px;margin-left:auto;padding:3px 7px;border:1px solid #82958c66;border-radius:3px;background:#192722;color:#b9d3c1;font-size:12px;letter-spacing:.2px;white-space:nowrap}
.radio-heading #voice-toggle[aria-pressed=false]{color:#9aa9ad;border-color:#59656a;background:#161d20}
.radio-heading #chat-close{margin-left:0;flex:none}
.score-stat{margin-left:9px;padding-left:9px;border-left:1px solid #56636b;color:#91aebb;font-size:10px;letter-spacing:.4px}
.score-stat b{font-size:13px;color:#d5e2e7;margin-left:4px}
.field-panel.death-flash{animation:field-death-flash .6s ease-out 1}
.field-panel.death-shake{animation:field-death-shake .25s linear 1}
.field-panel.death-flash.death-shake{animation:field-death-shake .25s linear 1,field-death-flash .6s ease-out 1}
.death-notice{position:absolute;left:50%;top:24px;translate:-50% 0;z-index:22;max-width:min(80%,720px);padding:14px 24px;border:2px solid #b94f4f;border-radius:4px;background:linear-gradient(135deg,#321d20f2,#171719f4);box-shadow:0 8px 28px #000d,0 0 20px #ba343466;color:#f1d5cf;font-size:clamp(18px,2.1vw,31px);font-weight:750;letter-spacing:.3px;text-align:center;text-shadow:0 2px 3px #000;pointer-events:none;animation:death-notice-in .18s ease-out}
.death-notice[hidden]{display:none}
.death-helmet-trace{position:absolute;z-index:6;left:var(--left);top:var(--top);width:6.25%;height:6.6667%;pointer-events:none}
.death-helmet-trace:before,.death-helmet-trace:after{content:none}
/* Original suit and organic sprites share a static contact silhouette. */
.death-suit-remains{position:absolute;inset:0;pointer-events:none}
.death-suit-contact{position:absolute;left:5%;top:24%;width:90%;height:66%;border-radius:50%;background:radial-gradient(ellipse,#040705b3,transparent 70%);transform:rotate(var(--fallen-angle))}
.death-suit-body{position:absolute;z-index:1;left:1%;top:0;width:98%;height:98%;background-image:url('assets/perf-colonist.png');background-size:400% 200%;background-position:var(--fallen-frame);background-repeat:no-repeat;filter:grayscale(.3) brightness(.86) sepia(.18);transform:rotate(var(--fallen-angle));mask-image:linear-gradient(#000 0 58%,#000c 72%,#0007 84%,transparent 96%)}
.death-suit-growth{position:absolute;z-index:0;left:-8%;top:5%;width:116%;height:108%;background-image:url('assets/perf-cluster.png');background-size:300% 100%;background-position:50% 0;background-repeat:no-repeat;mask-image:radial-gradient(ellipse 31% 33% at var(--fallen-head-x) 36%,transparent 0 74%,#000d 100%);opacity:.94}
.death-suit-tendrils{position:absolute;z-index:2;left:-10%;top:-9%;width:120%;height:118%;background-image:url('assets/perf-creeper.png');background-size:300% 100%;background-position:100% 0;background-repeat:no-repeat;mask-image:radial-gradient(ellipse 24% 23% at 51% 48%,transparent 75%,#000 100%);opacity:.65}
.team-member.death-pulse{animation:portrait-death-pulse .66s steps(6,end) 1}

@keyframes field-death-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-4px)}40%{transform:translateX(4px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}

@keyframes death-notice-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.radio-heading{gap:6px}.radio-heading #voice-toggle{font-size:12px;padding-inline:5px}.death-notice{top:12px;max-width:calc(100% - 32px);width:max-content;padding:10px 14px;font-size:18px}.status-card{left:86px;max-width:122px;width:auto}.score-stat{margin-left:5px;padding-left:5px;font-size:8px}.score-stat b{font-size:10px;margin-left:2px}}
@media(prefers-reduced-motion:reduce){.field-panel.death-flash,.field-panel.death-shake,.team-member.death-pulse,.death-notice{animation:none!important}.field-panel.death-flash{box-shadow:inset 0 0 0 3px #d96666aa,inset 0 0 25px #d9666644}}
/* Readable crew chat and the original eight unhelmeted face portraits. */
.crew-portrait,.team-member .crew-portrait,.radio-avatar{background-image:url('assets/crew-portraits.png');background-size:400% 200%;background-repeat:no-repeat}
.radio-avatar{width:52px;height:52px;border-radius:7px;box-shadow:0 3px 8px #0008}
.radio-message{gap:9px;margin-bottom:18px}
.radio-bubble{max-width:calc(100% - 61px);padding:11px 11px 8px}
.radio-bubble p{font-size:16px;line-height:1.5;color:#e1e9eb}
.radio-message-heading{gap:3px 8px;margin-bottom:7px}.radio-message-heading b{font-size:13px}.radio-time{font-size:10px;color:#a8bdc5}.radio-read{font-size:11px;margin-top:5px}
.system .radio-bubble{max-width:100%;padding:7px 8px}.system .radio-bubble p{font-size:13px;color:#a9bdc5}.system .radio-time{font-size:10px}
.radio-signal-lost{font-size:10px;line-height:1.4}.radio-heading h2{font-size:18px}.radio-heading #chat-online{font-size:12px}.radio-footer{font-size:10px;line-height:1.4}
@media(max-width:600px){.radio-avatar{width:52px;height:52px}.radio-bubble p{font-size:16px}.system .radio-bubble p{font-size:13px}.radio-message-heading b{font-size:13px}}

/* Transparent individual frontier creatures and intertwined mature clusters. */
.single-creeper-probe{background-image:url('assets/single-creeper.png')}
.root-shadow{stroke-width:calc(var(--root-width) + 2px);filter:drop-shadow(1px 2px 1px #000a)}.root-flesh{stroke:#382323;stroke-width:var(--root-width)}.root-glint{stroke:#aa8271;stroke-width:1;opacity:.38;transform:translate(-.5px,-1px)}
.biomass-cluster{filter:drop-shadow(1px 4px 2px #000c);animation:biomass-breath 8s ease-in-out infinite;animation-delay:var(--node-delay)}
.biomass-node{filter:drop-shadow(1px 2px 1px #000b);animation:none}
.creeper-idle{animation:creeper-breathe 7s ease-in-out infinite;animation-delay:var(--node-delay);transform-box:fill-box;transform-origin:center}
.biomass-node.creeping-in{animation:creeper-arrival .95s cubic-bezier(.15,.5,.25,1) both;animation-delay:var(--arrival-delay)}
@keyframes creeper-arrival{0%{opacity:0;transform:translate(var(--from-x),var(--from-y))}25%{opacity:.9}100%{opacity:1;transform:translate(0,0)}}

@media(prefers-reduced-motion:reduce){.biomass-cluster,.creeper-idle,.biomass-node.creeping-in{animation:none!important}}
/* Mission briefing: the approved colony artwork and a full-size industrial console. */
#start-dialog{padding:0;width:min(1680px,calc(100vw - 56px));height:min(1040px,calc(100dvh - 56px));max-width:none;max-height:none;overflow:hidden;border:4px solid #11191d;border-radius:7px;outline:1px solid #69777c;background:#172024;box-shadow:0 28px 100px #000e,0 0 0 7px #080d10,inset 0 2px #a8b2b444;color:#e1e7e8}
#start-dialog[open]{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr)}
#start-dialog::backdrop{background:#020608dc;backdrop-filter:blur(7px)}
.briefing-art{position:relative;min-width:0;overflow:hidden;isolation:isolate;border-right:2px solid #070d10;background:#151c20}
.briefing-scene{position:absolute;inset:-9% -3% 0 -3%;background-image:url('assets/briefing-colony.png');background-size:cover;background-position:14% 100%;filter:brightness(.85)}
.briefing-art-shade{position:absolute;inset:0;background:linear-gradient(180deg,#050a0ddd,transparent 29%,transparent 50%,#080f14e8 79%,#080e12 100%),linear-gradient(90deg,#080c1055,transparent 22%,transparent 75%,#060d1477)}
.briefing-brand{position:absolute;top:clamp(30px,4vw,60px);left:clamp(28px,3.8vw,64px);right:24px;text-shadow:0 3px 12px #000}
.briefing-signal{font-size:13px;letter-spacing:3px;color:#d0b482;font-weight:650;display:block;margin-bottom:18px}
.briefing-wordmark{font-size:clamp(68px,7vw,126px);font-weight:850;line-height:.95;letter-spacing:.055em;color:#e0e8ea;text-shadow:0 2px #869296,0 6px 2px #000c,0 0 25px #0d151c;white-space:nowrap}
.briefing-subtitle{font-size:clamp(16px,1.7vw,27px);font-weight:600;letter-spacing:clamp(2px,.4vw,6px);color:#bdc9cd;margin-top:19px;padding-top:17px;border-top:1px solid #9faab34d}
.briefing-art-caption{position:absolute;left:clamp(28px,3.8vw,64px);right:28px;bottom:clamp(28px,3.8vw,56px)}
.briefing-location{font-size:13px;font-weight:650;letter-spacing:2px;color:#bdad88}
.briefing-art-caption h3{font-size:clamp(27px,2.7vw,43px);line-height:1.2;font-weight:650;color:#d6dee1;margin:14px 0 25px;letter-spacing:-.5px;text-shadow:0 3px 10px #000}
.briefing-crew{display:flex;gap:8px}.briefing-crew .crew-portrait{width:clamp(35px,3.6vw,58px);height:clamp(35px,3.6vw,58px);border-radius:4px;flex:none;border:1px solid #72848a99;box-shadow:0 3px 8px #000b;filter:saturate(.7)}
#start-dialog .briefing-art-caption p{color:#a7b9c1;font-size:17px;line-height:1.5;margin:15px 0 0}
.briefing-lamp{position:absolute;top:36%;height:23%;width:4px;border-radius:2px;background:#edbb6d;box-shadow:0 0 9px #ffcb78,0 0 30px 7px #d994342b}.briefing-lamp-left{left:6px}.briefing-lamp-right{right:6px;top:14%;height:11%}
.briefing-content{position:relative;display:flex;flex-direction:column;gap:22px;min-height:0;min-width:0;padding:clamp(26px,2.8vw,52px);background:radial-gradient(ellipse at 100% 0,#71818a20,transparent 70%),repeating-linear-gradient(110deg,transparent 0 5px,#dde5e901 5px 6px),linear-gradient(135deg,#293238,#1d262b 45%,#131b20)}
.briefing-content:before{position:absolute;content:"";left:0;right:0;top:0;height:5px;opacity:.65;background:repeating-linear-gradient(135deg,#bb9555 0 9px,#121a1e 9px 18px)}
.briefing-copy{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:8px;scrollbar-width:thin;scrollbar-color:#70818a #172126}.briefing-copy:focus-visible{outline:1px solid #8b9ca4;outline-offset:5px}
.briefing-eyebrow{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:650;letter-spacing:2px;color:#cbb584}.briefing-eyebrow i{width:6px;height:6px;border-radius:50%;background:#d8b06c;box-shadow:0 0 8px #dbab5d77}
#start-dialog h2{font-size:clamp(35px,2.7vw,52px);font-weight:650;line-height:1.13;letter-spacing:-1px;margin:23px 0 17px;color:#f0f3f2;text-shadow:0 2px 3px #0006}
#start-dialog #start-intro{font-size:clamp(18px,1.25vw,22px);line-height:1.55;color:#b8c6cd;margin:0 0 27px;max-width:38em}
#start-dialog .briefing-steps{list-style:none;margin:0;padding:0;display:grid;gap:20px}
#start-dialog .briefing-step{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:start;gap:16px;margin:0;padding:0}
#start-dialog .briefing-step>span{display:grid;place-items:center;height:42px;padding:0;border:1px solid #81909166;border-radius:3px;background:linear-gradient(#333e43,#202a30);box-shadow:inset 0 1px #e6f0f21c,0 3px 5px #0005;color:#d3b67f;font-size:16px;font-weight:600;letter-spacing:1px}
#start-dialog .briefing-step h3{font-size:clamp(19px,1.35vw,23px);font-weight:650;color:#e2e8e9;line-height:1.3;margin:0 0 6px}
#start-dialog .briefing-step p{font-size:clamp(17px,1.15vw,20px);line-height:1.5;color:#b4c2c9;margin:0}
.briefing-launch{margin-top:auto;flex:none;padding-top:20px;border-top:1px solid #7d8b8f44}
#start-dialog .mode-picker{padding:0;margin:0 0 18px;border:0;border-radius:0;background:none}
#start-dialog .mode-picker label{font-size:13px;letter-spacing:1.8px;font-weight:650;color:#c8b68d;margin-bottom:10px}
.briefing-select{position:relative}.briefing-select:after{content:"";position:absolute;width:9px;height:9px;right:22px;top:21px;border-right:2px solid #c2cdd2;border-bottom:2px solid #c2cdd2;transform:rotate(45deg);pointer-events:none}
#start-dialog .mode-picker select{appearance:none;height:60px;font:600 21px "Segoe UI",Arial,sans-serif;line-height:1.3;padding:12px 50px 12px 17px;background:linear-gradient(#2a373e,#19272e);border:1px solid #84949b;border-radius:3px;color:#e2e9ec;box-shadow:inset 0 2px 5px #0006,0 1px #c1d0d51a}
#start-dialog .mode-picker select:focus-visible{outline:2px solid #cfb57a;outline-offset:3px}
#start-dialog .mode-picker p{font-size:16px;line-height:1.45;margin:10px 0 0;color:#abbfc8;min-height:2.9em}
#start-dialog #start-button{width:100%;margin:0;min-height:70px;gap:22px;padding:17px 20px;font-size:23px;font-weight:650;border:1px solid #c8ad74;border-radius:4px;background:linear-gradient(#53636a,#2d3c44);box-shadow:inset 0 2px #dae3e64d,inset 0 -4px #0e1b2499,0 4px 13px #0008,0 0 16px #b6975422;color:#f8f1df;text-shadow:0 2px 2px #0008}
#start-dialog #start-button:hover{background:linear-gradient(#64767d,#3a4d57);border-color:#e1c58b;box-shadow:inset 0 2px #ecf5f74d,0 0 20px #bd944d44}
#start-dialog #start-button:focus-visible{outline:2px solid #e0c58b;outline-offset:4px}
#start-dialog #start-button>span{font-size:28px;font-weight:400;color:#e1c58b}
#start-dialog .start-controls{display:flex;justify-content:center;gap:10px 20px;flex-wrap:wrap;font-size:14px!important;color:#a9bcc6!important;margin:16px 0 0;line-height:1.6}
#start-dialog .start-controls>span{display:flex;align-items:center;gap:4px;white-space:nowrap}
#start-dialog .start-controls kbd{font:12px "Segoe UI",Arial,sans-serif;color:#d4dee2;padding:1px 5px;border:1px solid #70838b88;border-radius:3px;background:#152127;box-shadow:0 2px #080f14}
.briefing-bolt{position:absolute;z-index:5;width:12px;height:12px;border:1px solid #10191e;border-radius:50%;background:radial-gradient(circle at 35% 25%,#b4bfc2,#5b686d 40%,#1d282e 75%);box-shadow:0 1px 3px #000c;pointer-events:none}.briefing-bolt:after{content:"";position:absolute;left:2px;right:2px;top:5px;height:1px;background:#141c20;transform:rotate(-35deg)}.bolt-tl{top:7px;left:7px}.bolt-tr{top:7px;right:7px}.bolt-bl{bottom:7px;left:7px}.bolt-br{bottom:7px;right:7px}
@media(max-height:900px) and (min-width:901px){.briefing-content{gap:16px;padding:28px}.briefing-brand{top:32px;left:32px}.briefing-art-caption{left:32px;bottom:28px}.briefing-art-caption h3{font-size:32px;margin-bottom:18px}#start-dialog h2{font-size:36px;margin:17px 0 13px}#start-dialog #start-intro{font-size:18px;margin-bottom:20px}#start-dialog .briefing-steps{gap:15px}#start-dialog .briefing-step h3{font-size:19px}#start-dialog .briefing-step p{font-size:17px;line-height:1.45}.briefing-launch{padding-top:15px}#start-dialog .mode-picker select{height:53px;font-size:20px}#start-dialog .mode-picker p{font-size:15px;min-height:0}#start-dialog .mode-picker{margin-bottom:14px}#start-dialog #start-button{min-height:62px;font-size:21px;padding:13px}#start-dialog .start-controls{font-size:12px!important;margin-top:12px}.briefing-select:after{top:17px}}
@media(max-width:1100px) and (min-width:901px){#start-dialog[open]{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}.briefing-wordmark{font-size:64px}.briefing-subtitle{font-size:16px;letter-spacing:2px}.briefing-brand{left:25px;right:20px}.briefing-art-caption{left:25px;right:20px}.briefing-crew{gap:5px}.briefing-crew .crew-portrait{width:30px;height:36px}.briefing-art-caption h3{font-size:28px}}
@media(max-width:900px){#start-dialog{width:calc(100vw - 24px);height:calc(100dvh - 24px)}#start-dialog[open]{display:flex;flex-direction:column}.briefing-art{flex:none;height:205px;border-right:0;border-bottom:2px solid #080f14}.briefing-scene{inset:-100% -2% -35%;background-position:0% 60%}.briefing-brand{top:25px;left:28px;right:25px}.briefing-signal{font-size:10px;margin-bottom:13px;letter-spacing:2px}.briefing-wordmark{font-size:66px}.briefing-subtitle{font-size:17px;letter-spacing:3px;display:inline-block;margin-top:12px;padding-top:10px}.briefing-art-caption{display:none}.briefing-art-shade{background:linear-gradient(90deg,#050d12ee,#050c1177 48%,#050c1122),linear-gradient(0deg,#050c1199,transparent)}.briefing-lamp{top:20%;height:60%}.briefing-content{flex:1;gap:18px;padding:25px;min-height:0}#start-dialog h2{font-size:34px;margin:17px 0 13px}#start-dialog #start-intro{font-size:18px;margin-bottom:22px}#start-dialog .briefing-step h3{font-size:20px}#start-dialog .briefing-step p{font-size:18px}.briefing-launch{padding-top:18px}#start-dialog .mode-picker p{min-height:0;font-size:16px}#start-dialog .mode-picker select{font-size:20px;height:56px}#start-dialog #start-button{min-height:62px;font-size:21px;padding:13px}.briefing-select:after{top:19px}}
@media(max-width:600px){#start-dialog{width:calc(100vw - 16px);height:calc(100dvh - 16px);border-width:3px}.briefing-art{height:160px}.briefing-brand{top:20px;left:23px}.briefing-wordmark{font-size:54px}.briefing-signal{font-size:8px;letter-spacing:1.5px;margin-bottom:10px}.briefing-subtitle{font-size:13px;margin-top:10px;padding-top:8px;letter-spacing:2.2px}.briefing-content{padding:22px 18px 18px;gap:14px}.briefing-eyebrow{font-size:10px;letter-spacing:1.4px}#start-dialog h2{font-size:29px;letter-spacing:-.6px;margin-top:16px}#start-dialog #start-intro{font-size:17px;line-height:1.5}#start-dialog .briefing-step{grid-template-columns:32px minmax(0,1fr);gap:11px}#start-dialog .briefing-step>span{width:32px;height:32px;font-size:13px}#start-dialog .briefing-step h3{font-size:18px}#start-dialog .briefing-step p{font-size:17px}.briefing-launch{padding-top:14px}#start-dialog .mode-picker label{font-size:11px}#start-dialog .mode-picker select{height:53px;font-size:19px}#start-dialog .mode-picker p{font-size:14px}#start-dialog .mode-picker{margin-bottom:14px}#start-dialog #start-button{min-height:58px;font-size:19px}#start-dialog .start-controls{font-size:11px!important;gap:7px 12px;margin-top:12px}.briefing-select:after{top:17px}}
@media(max-height:550px) and (min-width:601px),(max-height:760px) and (min-width:601px) and (max-width:900px){#start-dialog{width:calc(100vw - 20px);height:calc(100dvh - 20px)}#start-dialog[open]{display:block}.briefing-art{display:none}.briefing-content{height:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.8fr);gap:22px;padding:20px}.briefing-copy{height:100%}.briefing-launch{border-top:0;border-left:1px solid #7d8b8f44;padding-top:0;padding-left:20px;margin:0;align-self:center}#start-dialog h2{font-size:27px;margin:12px 0}#start-dialog #start-intro{font-size:16px}#start-dialog .briefing-eyebrow{font-size:10px}#start-dialog .briefing-step h3{font-size:17px}#start-dialog .briefing-step p{font-size:16px}#start-dialog .briefing-step{grid-template-columns:29px minmax(0,1fr);gap:10px}#start-dialog .briefing-step>span{height:29px;font-size:12px}#start-dialog .mode-picker select{height:48px;font-size:18px}#start-dialog .mode-picker p{font-size:14px}#start-dialog .mode-picker label{font-size:11px}#start-dialog #start-button{min-height:52px;font-size:18px}#start-dialog .start-controls{font-size:11px!important}.briefing-select:after{top:15px}}

#start-dialog .briefing-scroll-note{display:none;font-size:13px;line-height:1.3;color:#c0b18d;margin:0 0 12px}
.briefing-copy::-webkit-scrollbar{width:6px}.briefing-copy::-webkit-scrollbar-track{background:#101a2080}.briefing-copy::-webkit-scrollbar-thumb{background:#819299;border-radius:3px}
@media(max-width:600px){#start-dialog .briefing-scroll-note{display:block}}
/* The whole crew uses two visible mode choices, without a native popup menu. */
.mode-picker{min-inline-size:0}
.mode-picker legend{padding:0 0 10px;font-size:11px;letter-spacing:1.5px;font-weight:650;color:#c8b68d}
.mode-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0}
.mode-picker .mode-option{display:block;position:relative;min-width:0;margin:0;padding:0;letter-spacing:0;cursor:pointer}
.mode-option input{position:absolute;width:1px;height:1px;margin:0;clip-path:inset(50%);overflow:hidden}
.mode-option-surface{display:flex;flex-direction:column;gap:8px;min-height:98px;padding:16px 15px;border:1px solid #6b7f8799;border-radius:4px;background:linear-gradient(140deg,#29363d,#17242b);box-shadow:inset 0 1px #b9ccd51c,inset 0 -2px #090f144d,0 2px 4px #0004;transition:background .15s,border-color .15s,box-shadow .15s}
.mode-option-top{display:flex;align-items:center;gap:10px;min-width:0}
.mode-option strong{font-size:18px;font-weight:650;line-height:1.3;color:#d7e1e5;letter-spacing:0}
.mode-option small{display:block;font-size:13px;font-weight:400;line-height:1.45;color:#a9bdc7;letter-spacing:0}
.mode-radio{display:block;position:relative;width:15px;height:15px;flex:none;border:1px solid #8a9ba2;border-radius:50%;background:#111d24;box-shadow:inset 0 1px 3px #000b}
.mode-option input:checked+.mode-option-surface{border-color:#cfb278;background:linear-gradient(140deg,#48534a,#27392f);box-shadow:inset 0 1px #e2e1ba2c,inset 0 -2px #11201a66,0 0 0 1px #d2b77c33,0 3px 9px #0006}
.mode-option input:checked+.mode-option-surface strong{color:#f1ead7}
.mode-option input:checked+.mode-option-surface small{color:#bfcdbc}
.mode-option input:checked+.mode-option-surface .mode-radio{border-color:#d5bb81}
.mode-option input:checked+.mode-option-surface .mode-radio:after{content:"";position:absolute;inset:3px;border-radius:50%;background:#e5c78a;box-shadow:0 0 6px #ddc38677}
.mode-option:hover .mode-option-surface{border-color:#b4c2c5;background:linear-gradient(140deg,#34434b,#24343d)}
.mode-option:hover input:checked+.mode-option-surface{border-color:#e5cb91;background:linear-gradient(140deg,#556151,#304337)}
.mode-option input:focus-visible+.mode-option-surface{outline:2px solid #e1c68b;outline-offset:3px}
.mode-picker .mode-description{display:none}
#start-dialog .mode-picker{min-inline-size:0;margin:0 0 18px}
#start-dialog .mode-picker legend{font-size:13px;letter-spacing:1.8px;padding-bottom:11px}
#start-dialog .mode-picker .mode-option{font-size:inherit;font-weight:400;letter-spacing:0;margin:0;padding:0;color:inherit}
#start-dialog .mode-option-surface{min-height:104px;padding:17px 18px}
#start-dialog .mode-option strong{font-size:21px}
#start-dialog .mode-option small{font-size:15px}
#start-dialog .briefing-input-guide{flex:none;padding:16px 0 0;border-top:1px solid #76888e44}
#start-dialog .briefing-input-guide h3{font-size:13px;line-height:1.3;font-weight:650;letter-spacing:1.7px;text-transform:uppercase;color:#c8b68d;margin:0 0 10px}
#start-dialog .briefing-input-guide .start-controls{justify-content:flex-start;font-size:16px!important;line-height:1.5;margin:0;gap:10px 22px;color:#c0cfd5!important}
#start-dialog .briefing-input-guide kbd{min-width:24px;text-align:center;font-size:14px;line-height:1.5;padding:2px 5px;border-color:#879ba488;background:linear-gradient(#2b3c44,#16262e);box-shadow:0 2px #060e14}
@media(max-height:900px) and (min-width:901px){#start-dialog .mode-option-surface{min-height:87px;padding:12px 13px;gap:6px}#start-dialog .mode-option strong{font-size:19px}#start-dialog .mode-option small{font-size:13px}#start-dialog .briefing-input-guide{padding-top:10px}#start-dialog .briefing-input-guide h3{display:none}#start-dialog .briefing-input-guide .start-controls{font-size:14px!important;gap:8px 16px}#start-dialog .briefing-input-guide kbd{min-width:20px;font-size:12px}}
@media(max-width:600px){.mode-options{gap:10px}.mode-option-surface,#start-dialog .mode-option-surface{min-height:58px;padding:15px 7px;justify-content:center;gap:0}.mode-option-top{justify-content:center;gap:0}.mode-option strong,#start-dialog .mode-option strong{font-size:16px;text-align:center}.mode-option small,.mode-radio{display:none}.mode-picker .mode-description{display:block}#start-dialog .mode-picker .mode-description{font-size:14px;line-height:1.45;margin:10px 0 0}#start-dialog .mode-picker legend{font-size:11px}#start-dialog .briefing-input-guide{padding-top:10px}#start-dialog .briefing-input-guide h3{display:none}#start-dialog .briefing-input-guide .start-controls{font-size:13px!important;gap:7px 12px}#start-dialog .briefing-input-guide kbd{font-size:12px;min-width:20px;padding:1px 4px}}
@media(max-height:550px) and (min-width:601px),(max-height:760px) and (min-width:601px) and (max-width:900px){.briefing-content{grid-template-rows:auto minmax(0,1fr);gap:12px 22px}.briefing-copy{grid-column:1;grid-row:1/3}#start-dialog .briefing-input-guide{grid-column:2;grid-row:1;border-top:0;border-left:1px solid #7d8b8f44;padding:0 0 0 20px}#start-dialog .briefing-input-guide h3{display:none}#start-dialog .briefing-input-guide .start-controls{font-size:12px!important;gap:6px;flex-direction:column;align-items:flex-start}#start-dialog .briefing-input-guide kbd{font-size:11px;min-width:18px}.briefing-launch{grid-column:2;grid-row:2;align-self:start}#start-dialog .mode-options{gap:8px}#start-dialog .mode-option-surface{padding:13px 6px;min-height:55px;justify-content:center}#start-dialog .mode-option-top{justify-content:center}#start-dialog .mode-option strong{font-size:15px}#start-dialog .mode-option small,#start-dialog .mode-radio{display:none}#start-dialog .mode-description{display:block;font-size:13px;min-height:0}}
/* Keep the live score between the wordmark and portraits on a phone. */
@media(max-width:600px){.status-card{left:94px;max-width:64px;min-width:64px;padding:3px 4px}.status-card .team-stats{display:none}.status-card .score-stat{border:0;margin:0;padding:0;font-size:8px;letter-spacing:0}.status-card .score-stat b{font-size:11px;margin-left:2px}}
@media(max-width:360px){.status-card{left:82px;min-width:51px;max-width:51px;padding-inline:2px}.status-card .score-stat{font-size:7px}.status-card .score-stat b{font-size:10px}}

/* Memorials stay within actual wall faces; each person has a separate plate. */
.death-traces{position:absolute;inset:0;pointer-events:none}
.memorial-cell{position:absolute;left:var(--left);top:var(--top);width:6.25%;height:6.6667%;container-type:size;pointer-events:none}
.memorial-surface{position:absolute;pointer-events:none;overflow:hidden}
.memorial-cell[data-face=front] .memorial-surface{transform:skewX(8.13deg);transform-origin:top left}
.memorial-group{position:absolute;display:flex;flex-direction:column;pointer-events:auto;cursor:help}
.memorial-plates{display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));grid-template-rows:repeat(var(--rows),minmax(0,1fr));gap:var(--memorial-gap);width:100%;height:calc(100% - var(--memorial-caption));flex:none}
.memorial-plaque{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;min-height:0;gap:.5cqw;padding:1.7cqw 2cqw 1.2cqw;border:.75px solid #283033;border-radius:1cqw;background:linear-gradient(110deg,#b3b9b5,#c5c9c2 48%,#a1aaa7);box-shadow:inset 0 0 0 .5px #e0e2d077,inset 0 -1px 1px #45504e,.5px 1px 1px #000b;color:#26312e;pointer-events:auto;cursor:help;overflow:hidden;isolation:isolate}
.memorial-plaque:before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(97deg,#eef0d90c 0 1px,#33423b09 1px 2px,transparent 2px 4px);pointer-events:none}
.memorial-portrait{display:block;height:66%;aspect-ratio:1;flex:none;background-image:url('assets/crew-engravings.png');background-size:400% 200%;background-repeat:no-repeat;mix-blend-mode:multiply;filter:contrast(1.3);cursor:help}
.memorial-name{font-size:5.1cqw;font-weight:650;line-height:1;letter-spacing:-.04em;text-align:center;text-shadow:0 1px #ecf0dc70;white-space:nowrap}
.memorial-days{font-size:4.7cqw;font-weight:600;line-height:1;white-space:nowrap;text-shadow:0 1px #ecf0dc70}
.memorial-rivet{position:absolute;width:2cqw;height:2cqw;border-radius:50%;background:radial-gradient(circle at 30% 25%,#d3d8d0,#67716e 55%,#303c38 80%);box-shadow:0 0 0 .4px #38433d}
.memorial-rivet.tl{left:1cqw;top:1cqw}.memorial-rivet.tr{right:1cqw;top:1cqw}.memorial-rivet.bl{left:1cqw;bottom:1cqw}.memorial-rivet.br{right:1cqw;bottom:1cqw}
.memorial-group:not([data-count="1"]) .memorial-plaque{padding:calc(1.5cqw * var(--memorial-scale));gap:0;border-width:.5px;border-radius:calc(1cqw * var(--memorial-scale))}
.memorial-group:not([data-count="1"]) .memorial-portrait{height:94%}
.memorial-group:not([data-count="1"]) .memorial-rivet{width:max(.7px,calc(2cqw * var(--memorial-scale)));height:max(.7px,calc(2cqw * var(--memorial-scale)));box-shadow:none}
.memorial-group:not([data-count="1"]) .memorial-rivet.tl,.memorial-group:not([data-count="1"]) .memorial-rivet.tr{top:calc(1cqw * var(--memorial-scale))}
.memorial-group:not([data-count="1"]) .memorial-rivet.bl,.memorial-group:not([data-count="1"]) .memorial-rivet.br{bottom:calc(1cqw * var(--memorial-scale))}
.memorial-group:not([data-count="1"]) .memorial-rivet.tl,.memorial-group:not([data-count="1"]) .memorial-rivet.bl{left:calc(1cqw * var(--memorial-scale))}
.memorial-group:not([data-count="1"]) .memorial-rivet.tr,.memorial-group:not([data-count="1"]) .memorial-rivet.br{right:calc(1cqw * var(--memorial-scale))}
.memorial-caption{display:block;min-width:0;height:var(--memorial-caption);flex:none;width:max-content;min-width:100%;align-self:center;font-size:6cqw;line-height:1.15;text-align:center;white-space:nowrap;color:#d1d4c8;text-shadow:0 1px #111b18}
.memorial-group:focus-visible,.memorial-plaque:focus-visible{outline:1px solid #b9e5f0;outline-offset:1px}

/* Reopen the completed operation from the existing header card. */
.current-colonist{position:relative}
.outcome-button{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:inherit;background:transparent;cursor:pointer}
/* Keep the transparent hit area above the heading clear on hover. */
.outcome-button:hover:not(:disabled){background:transparent}
.outcome-button:focus-visible{outline:2px solid #84ddff;outline-offset:3px}

/* Readable crew identifiers, matched between the field and header portraits. */
.colonist-instance .colonist-id,.colonist-instance.active-colonist .colonist-id{left:50%;top:8%;bottom:auto;translate:-50% -100%;display:block;min-width:0;height:auto;padding:0;font-size:clamp(13px,24cqw,18px);line-height:1;font-weight:700;border:0;border-radius:0;background:transparent;color:#ffdc65;text-shadow:0 1px 2px #000,0 0 3px #000;box-shadow:none;pointer-events:none}
.colonist-instance.active-colonist{z-index:3}
.colonist-instance.active-colonist .colonist-id{color:#75e6ff;text-shadow:0 1px 2px #000,0 0 3px #000,0 0 7px #75e6ff99}
.team-member{opacity:1}
.team-member .crew-number{left:1px;right:auto;top:1px;bottom:auto;z-index:3;display:grid;place-items:center;min-width:18px;height:18px;padding:0 2px;font-size:13px;line-height:1;font-weight:800;letter-spacing:0;border:1px solid #fff0b0;border-radius:3px;background:#f4cc63;color:#111b23;text-shadow:none;box-shadow:0 1px 3px #000b}
.team-member.current{border-color:#b2f5ff;box-shadow:inset 0 0 0 2px #75e6ff,0 0 0 1px #183e51,0 0 12px #75e6ff88}
.team-member.current .crew-number{background:#75e6ff;color:#071a23;border-color:#effcff}
.team-member.protected .crew-number{color:#111b23}
.team-member.dead{opacity:1;filter:none}
.team-member.dead .crew-portrait{filter:grayscale(1) brightness(.4);opacity:.65}
.team-member.dead .crew-number{background:#38444c;color:#e1e7eb;border-color:#81909a}
@media(max-width:600px){.team-member .crew-number{min-width:14px;height:15px;font-size:11px;padding:0 1px}}

/* Portrait and identifier occupy separate rows; retain the original image height. */
.app{grid-template-rows:84px minmax(0,1fr) 31px}
.team-member{display:grid;grid-template-rows:minmax(0,1fr) 14px;height:51px}
.team-member .crew-number{position:static;width:100%;min-width:0;height:14px;padding:0;font-size:12px;border:0;border-top:1px solid #fff0b0;border-radius:0;box-shadow:none}
@media(min-width:1800px){.app{grid-template-rows:94px minmax(0,1fr) 33px}.team-member{height:56px}}
@media(max-width:1430px){.team-member{height:47px}}
@media(max-width:1200px){.app{grid-template-rows:116px minmax(0,1fr) 29px}.mission-header{grid-template-rows:56px 37px}.team-member{height:49px}}
@media(max-width:800px){.app{grid-template-rows:119px minmax(0,1fr) 29px}.team-member{height:43px}}
@media(max-width:600px){.app{grid-template-rows:158px minmax(0,1fr) 31px}.mission-header{grid-template-rows:44px 42px 45px}.team-section,.team{height:44px}.team-member{height:42px}.team-member .crew-number{font-size:11px}}
@media(max-width:360px){.team-member{height:38px}}
@media(max-height:500px) and (min-width:601px){.app{grid-template-rows:93px minmax(0,1fr) 24px}.mission-header{grid-template-rows:45px 31px}.team-member{height:41px}}
