:root{color-scheme:dark;font-family:monospace;background:#100e12;color:#eee}
*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:16px 8px}
#app{width:min(1280px,100%)}#screen{position:relative;width:100%;aspect-ratio:4/3;background:#000;isolation:isolate}
canvas{display:block;width:100%;height:100%;image-rendering:pixelated}#controls,#fields{position:absolute;inset:0;pointer-events:none}
.hit{position:absolute;pointer-events:auto;margin:0;padding:0;border:0;background:transparent;color:transparent;cursor:pointer;border-radius:8px;font-size:0}
.hit:focus-visible{outline:2px solid white;outline-offset:1px}.hit:disabled{cursor:default}.field{border-radius:0}.field:focus-visible{outline-offset:-2px}
.system-bar{display:flex;align-items:center;gap:8px;margin-top:9px;font:12px monospace;flex-wrap:wrap}.system-bar span{margin-right:auto;color:#afa2b3}
button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}.system-bar button{background:#26192b;color:#ddd;border:1px solid #51415a;padding:5px 9px}
#status{min-height:18px;color:#c5b5ca;font-size:12px;margin:8px 0 0;white-space:pre-line}
#requester{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(94%,600px);max-height:94%;overflow:auto;z-index:4;background:#aaa;color:#000;border:3px outset #eee;box-shadow:6px 6px 0 #0009;font:14px/1.3 'Courier New',monospace;outline:none}
#requester[hidden]{display:none}#dialog-title{background:#364b91;color:white;margin:0;padding:3px 7px;font-size:14px;font-weight:bold;border-bottom:2px solid #111}
.dialog-content{padding:12px}.dialog-content p{white-space:pre-line;margin:0 0 12px}.dialog-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.dialog-content button,.dialog-actions button{color:#000;background:#bbb;border:2px outset #eee;padding:4px 12px;min-height:28px}.dialog-content button:active{border-style:inset}.dialog-content input,.dialog-content select{background:#ddd;color:#000;border:2px inset #ddd;padding:4px;max-width:100%}
.dialog-content label{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:5px 0}.dialog-content label input[type=checkbox]{width:20px;height:20px;flex:none}.dialog-content input[type=number]{width:100px}.dialog-content input[type=range]{width:45%;padding:0}.dialog-content fieldset{border:2px groove #eee;margin:8px 0;padding:8px}.dialog-content legend{padding:0 4px}
.players{display:grid;grid-template-columns:1fr 1fr;gap:8px}.players fieldset{min-width:0}.players label{display:block}.players input,.players select{width:100%;margin-top:3px}.notice{color:#762020;font-weight:bold;min-height:16px}.scores{width:100%;border-collapse:collapse}.scores th,.scores td{text-align:left;border-bottom:1px solid #888;padding:4px}.keys{display:grid;grid-template-columns:100px 1fr;gap:4px;margin-bottom:12px}.keys dt{font-weight:bold}.keys dd{margin:0}
.newgame{background:#b6a194 url('assets/gfx/GUI/NEWGAME/BACKGROUND.png') center/cover;color:white;text-shadow:1px 1px #000}.newgame fieldset{background:#330e168a}.newgame input,.newgame select{text-shadow:none}.newgame button{color:#000;text-shadow:none}
.profile-row{display:flex;gap:8px;align-items:center;margin:6px 0}.profile-row span{flex:1}
#requester.native{width:54%;max-width:none;background:#aaa;overflow:visible;container-type:inline-size}#requester.native #dialog-title{background:#6b91b7;font-size:2.8cqw;padding:0 2px;height:3.9cqw;border-bottom:1px solid #111}.native-close{font-size:inherit;float:left;width:5%;padding:0!important;min-height:0!important;height:100%;background:#bbb;color:#000;border:1px outset #ddd;margin-right:5px}
#requester.native .dialog-content{padding:0}#requester.native .dialog-actions{display:none}#requester.native .notice{position:absolute;bottom:-20px;color:#fff;background:#762020;font-size:12px}#requester.native .notice:empty{display:none}
.native-content{position:relative;width:100%;aspect-ratio:338/218}.native-content canvas{width:100%;height:100%}.native-content .native-name{position:absolute;border:2px inset #ddd;background:#bbb;font-size:2.6cqw;padding:0 2px;color:#000;height:7%;font-weight:bold}.native-name:disabled{background:repeating-linear-gradient(45deg,#bbb 0 2px,#888 2px 3px)}
.native-hit{position:absolute!important;background:transparent!important;border:0!important;padding:0!important;min-height:0!important;min-width:0!important;color:transparent!important;font-size:0!important;z-index:1}.native-hit:focus-visible{outline:1px solid white;outline-offset:-1px}.native-roster{position:absolute;left:1.48%;top:1.84%;width:39.65%;height:53.2%;overflow-y:auto;background:#aaa;container-type:inline-size}.native-content .native-profile{display:block;position:static;width:100%;text-align:left;border:0;padding:0;font-size:6cqw;min-height:0;line-height:1.05;background:#aaa;color:#111}.native-content .native-profile.selected{background:#aca4d6}
@media(max-width:600px){#requester.native{width:94%}}
@media(max-width:600px){body{padding:4px}.system-bar{font-size:10px;gap:4px}.system-bar button{padding:4px}.players{grid-template-columns:1fr}#requester{font-size:12px}.dialog-content{padding:8px}.dialog-content label{gap:4px}#dialog-title{font-size:12px}}
:fullscreen{background:#100e12;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;padding:4px}:fullscreen #screen{width:min(100vw,calc((100vh - 72px)*4/3));flex:none}:fullscreen .system-bar,:fullscreen #status{width:min(100vw,calc((100vh - 72px)*4/3))}