@font-face{font-family:DejaVu Mono;font-style:normal;font-display:swap;font-weight:400;src:url(./dejavu-mono-latin-400-normal-CC484euo.woff2) format("woff2"),url(./dejavu-mono-latin-400-normal-R91RS3ZJ.woff) format("woff")}:root{--fg: #d0cfcc;color:var(--fg);font-family:DejaVu Mono;--padding: 7px;--cell-size: 40px;--dir-size: 200px;--main-gap: 8px;-webkit-user-select:none;user-select:none;overflow:hidden;overscroll-behavior:none;background:#333;touch-action:none}@media(max-width:430px){:root{--cell-size: 36px;--dir-size: 180px;--main-gap: 6px}}*{box-sizing:border-box}body{margin:0;height:100dvh;display:grid;place-items:center}#root{width:100%;display:grid;justify-items:center;-webkit-tap-highlight-color:transparent}#footer{text-align:center}#footer a{color:#0ff}#root>main{--bg: #300a24;outline:1px solid grey;background-color:var(--bg);display:grid;grid:auto minmax(0,min-content) auto auto auto / 1fr;place-items:center;align-content:start;height:100dvh;width:min(100vw,calc(80ch + 4 * var(--padding)));padding:var(--padding);padding-top:max(var(--padding),env(safe-area-inset-top));padding-bottom:max(var(--padding),env(safe-area-inset-bottom));padding-left:max(var(--padding),env(safe-area-inset-left));padding-right:max(var(--padding),env(safe-area-inset-right));position:relative;white-space-collapse:preserve;justify-items:stretch}::-webkit-scrollbar{width:calc(var(--padding) - .5px)}::-webkit-scrollbar-track{background:#222}::-webkit-scrollbar-thumb{background:#555}@media(hover:hover){::-webkit-scrollbar-thumb:hover{background:#888}}.copyright{position:absolute;left:0;bottom:0;padding:calc(2 * var(--padding));white-space:normal}.copyright .line{padding-top:2px;padding-bottom:2px;padding-right:var(--padding);padding-left:calc(2ch + var(--padding))}.copyright .line:first-child{padding-left:0}.message{height:3.6lh;border:.5px solid grey;padding:var(--padding);overflow:auto;display:flex;flex-direction:column-reverse;gap:5px;box-sizing:content-box}.message .line,.message .oldline{font-size:.99em}.message .oldline{--fg: #555}.map-container{grid-column:1;grid-row:2;display:grid;place-items:center;overflow:auto;height:100%;padding:var(--padding);border:.5px solid grey;touch-action:pinch-zoom;position:relative}.map-container *{scroll-margin:50px}.map-container::-webkit-scrollbar{width:0px;height:0px}.map{overflow:auto;--height: 2ch;display:grid;grid:repeat(24,var(--height)) / repeat(80,1ch);width:80ch;height:48ch;margin:-1px}.map.displayed{outline:var(--padding) solid grey}.cell.clickable{cursor:pointer}@media(hover:hover){.cell.clickable:hover{--bg: #444455;background-color:var(--bg)}}.cell.clickable:active{--bg: #444455;background-color:var(--bg)}.temporary-windows{position:fixed;top:0;left:0;z-index:10;width:100vw;height:100dvh;display:grid;grid:auto / auto;place-items:center;pointer-events:none;padding:calc(2 * var(--padding))}.temporary-windows.backdrop{pointer-events:auto;-webkit-backdrop-filter:blur(.7px);backdrop-filter:blur(.7px);height:100%}.text{padding:var(--padding);border:.5px solid grey;max-width:100%;max-height:100%;z-index:10;overflow:auto;background-color:#300a24f0;white-space:pre}.text .line{padding-top:2px;padding-bottom:2px}.prompt{align-self:start;justify-self:stretch;padding:var(--padding);border:.5px solid grey;grid-column:1;grid-row:2;display:grid;align-items:start;grid:auto / auto;top:-2px;z-index:1}.prompt *{grid-row:1;grid-column:1}.prompt .autocomplete{color:#616161;z-index:1}.prompt .line{z-index:2}.prompt input{background-color:transparent;width:auto;color:inherit;border:none;outline:none;font:inherit;padding:0;z-index:1}.menu{padding:var(--padding);border:.5px solid grey;z-index:10;margin:calc(2 * var(--padding));max-width:100%;max-height:100%;overflow:auto;--bg: #300a24e0;background-color:var(--bg)}.menu .line{padding-top:2px;padding-bottom:2px}.blocking{border-color:#7474ff;--bg: #1e0c33e0;background-color:var(--bg)}.selected{--bg: #444455;background:var(--bg)}.menu_entry{cursor:pointer;background-color:var(--bg);padding-left:4ch;text-indent:-4ch}@media(hover:hover){.menu_entry:hover{--bg: #444455}}.menu_entry:active{--bg: #666}kbd{background-color:var(--bg);cursor:pointer;font:inherit}@media(hover:hover){kbd:hover{--bg: #444455}}kbd:active{--bg: #666}.status{display:flex;flex-wrap:wrap;column-gap:1ch;row-gap:3px;border:.5px solid grey;padding:var(--padding);min-height:3lh}.status.compact{column-gap:1ch;row-gap:1px;padding:2px var(--padding);min-height:0}.status.compact>span,.status.compact>b{white-space:nowrap}.main-inputs{display:flex;flex-direction:row;align-items:center;justify-content:space-around;padding:var(--padding) 0;gap:var(--main-gap)}.main-inputs .mod-column{display:flex;flex-direction:column;gap:calc(var(--cell-size) / 3)}.main-inputs .mod-button{min-width:var(--cell-size);width:var(--cell-size);height:var(--cell-size);padding:0;border:1px solid #ee7474;border-radius:5px;background-color:#431e0c;display:grid;place-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:1.2em;touch-action:manipulation}.main-inputs .mod-button.armed{background-color:#622;border-color:#faa}.main-inputs .mod-button.locked{background-color:#833;border-color:#fdd;box-shadow:inset 0 0 0 1px #fdd}.main-inputs .mod-button.kbd-button.active{background-color:#622;border-color:#faa}.main-inputs .shortcut-inputs{display:grid;grid:repeat(4,var(--cell-size)) / repeat(3,var(--cell-size));gap:calc(var(--cell-size) / 3)}.main-inputs .direction_input{--border-color: #74ff74;--inactive-bg-color: #020;--active-bg-color: #252;position:relative;width:var(--dir-size);height:var(--dir-size);display:grid;place-items:center}.main-inputs .direction_input .label{z-index:2;position:absolute;font-size:calc(var(--dir-size) * .075);white-space:nowrap;pointer-events:none;transform:rotate(var(--angle)) translateY(calc(var(--dir-size) * -.325)) rotate(calc(360deg - var(--angle)))}.main-inputs .direction_input .center{position:absolute;display:grid;place-items:center;width:calc(var(--dir-size) * .3);height:calc(var(--dir-size) * .3);border-radius:100%;background:#1e0c33;cursor:pointer;font-size:calc(var(--dir-size) * .075)}@media(hover:hover){.main-inputs .direction_input .center:hover{background:#225}}.main-inputs .direction_input .center:active{background:#225}.main-inputs .direction_input .corner{--offset: -.5px;--size: calc(var(--dir-size) * .525);position:absolute;width:calc(var(--size) - var(--offset));height:calc(var(--size) - var(--offset));--border-color: #7474ff;--inactive-bg-color: #1e0c33;--active-bg-color: #225;border:1px solid var(--border-color);background-color:var(--inactive-bg-color);display:grid;border-radius:10px;flex-shrink:0;cursor:pointer;padding:calc(var(--dir-size) * .075);font-size:calc(var(--dir-size) * .075);box-sizing:border-box}@media(hover:hover){.main-inputs .direction_input .corner:hover{background-color:var(--active-bg-color)}}.main-inputs .direction_input .corner:active{background-color:var(--active-bg-color)}.main-inputs .direction_input .corner.top{top:0;align-items:start;border-bottom-width:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.main-inputs .direction_input .corner.bottom{bottom:0;align-items:end;border-top-width:0;border-top-left-radius:0;border-top-right-radius:0}.main-inputs .direction_input .corner.left{left:0;justify-items:start;border-right-width:0;border-top-right-radius:0;border-bottom-right-radius:0}.main-inputs .direction_input .corner.right{right:0;justify-items:end;border-left-width:0;border-top-left-radius:0;border-bottom-left-radius:0}.main-inputs .direction_input svg{--border-color: #74ff74;--inactive-bg-color: #020;--active-bg-color: #252;fill:var(--inactive-bg-color);stroke:var(--border-color);stroke-width:1px;pointer-events:none;z-index:1}.main-inputs .direction_input svg path{pointer-events:auto}@media(hover:hover){.main-inputs .direction_input svg path:hover{fill:var(--active-bg-color);cursor:pointer}}.main-inputs .direction_input svg path:active{fill:var(--active-bg-color);cursor:pointer}.simple_inputs{overflow-x:scroll;width:100%;display:flex;flex-direction:row;gap:1ch;padding:var(--padding);padding-top:10px;padding-bottom:0}.simple_inputs>.simple_input{width:auto;padding:0 8px}.simple_inputs::-webkit-scrollbar{width:0px;height:0px}.simple_inputs.fade-left.fade-right{mask-image:linear-gradient(to right,transparent,black 20px,black calc(100% - 20px),transparent);-webkit-mask-image:linear-gradient(to right,transparent,black 20px,black calc(100% - 20px),transparent)}.simple_inputs.fade-left:not(.fade-right){mask-image:linear-gradient(to right,transparent,black 20px);-webkit-mask-image:linear-gradient(to right,transparent,black 20px)}.simple_inputs.fade-right:not(.fade-left){mask-image:linear-gradient(to left,transparent,black 20px);-webkit-mask-image:linear-gradient(to left,transparent,black 20px)}.simple_input{min-width:var(--cell-size);width:var(--cell-size);height:var(--cell-size);--border-color: #7474ff;--inactive-bg-color: #1e0c33;--active-bg-color: #225;border:1px solid var(--border-color);background-color:var(--inactive-bg-color);display:grid;place-items:center;border-radius:5px;flex-shrink:0;cursor:pointer}@media(hover:hover){.simple_input:hover{background-color:var(--active-bg-color)}}.simple_input:active{background-color:var(--active-bg-color)}.simple_input.numlock{font-size:.8em}.simple_input.toggle,.simple_input.numlock{--border-color: #ee7474;--inactive-bg-color: #431e0c;--active-bg-color: #622}:is(.simple_input.toggle,.simple_input.numlock).active{--inactive-bg-color: #833;--active-bg-color: #a55}.kbd-bar{position:fixed;left:0;right:0;top:var(--bar-top, 200px);z-index:12;display:flex;align-items:center;gap:10px;padding:6px 10px;background-color:#1e0c33;border-top:1px solid #7474ff;box-shadow:0 -4px 12px #00000080}.kbd-bar .mod-button{flex-shrink:0;min-width:var(--cell-size);width:var(--cell-size);height:var(--cell-size);padding:0;border:1px solid #7474ff;border-radius:5px;background-color:#140628;display:grid;place-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:1em;touch-action:manipulation}.kbd-bar .mod-button:not(.kbd-dismiss){border-color:#ee7474;background-color:#2a0e08}.kbd-bar .mod-button.armed{background-color:#622;border-color:#faa}.kbd-bar .mod-button.locked{background-color:#833;border-color:#fdd;box-shadow:inset 0 0 0 1px #fdd}.kbd-bar .kbd-bar-field{flex:1;min-width:0;display:flex;align-items:center;gap:4px;padding:4px 8px;border:1px solid #7474ff;border-radius:5px;background-color:#140628}.kbd-bar .kbd-bar-prefix{color:#aaf;font-weight:700;flex-shrink:0}.kbd-bar .kbd-bar-input{flex:1;min-width:0;background:transparent;color:inherit;border:none;outline:none;font:inherit;padding:0}.play-again-button{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:11;padding:12px 32px;font:inherit;font-size:1.25em;background-color:#225;color:inherit;border:1px solid #7474ff;border-radius:5px;cursor:pointer;box-shadow:0 4px 16px #00000080}@media(hover:hover){.play-again-button:hover{background-color:#336}}.gear-button,.info-button{position:fixed;top:max(var(--padding),env(safe-area-inset-top));z-index:11;width:32px;height:32px;background-color:#2228;color:var(--fg);border:.5px solid grey;border-radius:4px;font-family:inherit;font-size:18px;line-height:1;cursor:pointer;-webkit-user-select:none;user-select:none}:is(.gear-button,.info-button):hover{background-color:#333a}.gear-button{right:max(var(--padding),env(safe-area-inset-right))}.info-button{right:calc(max(var(--padding),env(safe-area-inset-right)) + 40px)}.modal-backdrop{position:fixed;top:0;left:0;z-index:20;width:100vw;height:100dvh;background-color:#0008;-webkit-backdrop-filter:blur(.7px);backdrop-filter:blur(.7px);display:grid;place-items:center;padding:var(--padding)}.modal{background-color:#300a24f0;border:.5px solid grey;max-width:100%;max-height:100%;width:min(560px,100%);display:flex;flex-direction:column;overflow:hidden}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:calc(var(--padding) / 2) var(--padding);border-bottom:.5px solid grey}.modal-header h2{margin:0;font-size:1em;font-weight:400}.modal-close{background:transparent;color:var(--fg);border:none;font-family:inherit;font-size:1.4em;line-height:1;cursor:pointer;padding:0 6px}.modal-body{padding:var(--padding);overflow:auto}.settings-row{margin-bottom:var(--padding);padding-bottom:var(--padding);border-bottom:.5px solid #555}.settings-row:last-child{border-bottom:none}.settings-row input[type=text]{width:100%;background-color:transparent;color:inherit;border:.5px solid grey;font:inherit;padding:4px 6px}.settings-row button{background-color:#2228;color:var(--fg);border:.5px solid grey;font-family:inherit;padding:4px 10px;cursor:pointer}.settings-row button:hover{background-color:#333a}.settings-label{display:block;margin-bottom:4px}.settings-note{font-size:.85em;color:#999;margin-top:4px}.settings-radio{margin-right:var(--padding)}.settings-grid-slots{display:grid;grid-template-columns:repeat(3,42px);gap:4px}.settings-grid-slot{width:42px;height:36px;box-sizing:border-box;background-color:#1e0c33;color:var(--fg);border:1px solid #7474ff;border-radius:4px;font:inherit;font-size:.85em;cursor:pointer;overflow:hidden;padding:0;appearance:none;-webkit-appearance:none;text-align:center;text-align-last:center;line-height:34px}.settings-grid-slot:active{background-color:#225}.settings-toolbar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:4px}.settings-scroll-active{display:flex;flex-direction:column;gap:2px;margin:4px 0}.settings-scroll-row{display:grid;grid-template-columns:auto auto auto 1fr;gap:4px;align-items:center}.settings-scroll-row button{width:28px;height:28px;padding:0;font:inherit;cursor:pointer}.settings-scroll-row button:disabled{opacity:.3;cursor:default}.settings-scroll-available{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.settings-scroll-available button{font:inherit;cursor:pointer;padding:2px 8px}.settings-custom-list{display:flex;flex-direction:column;gap:4px}.settings-custom-row{display:grid;grid-template-columns:1fr 1fr auto;gap:4px;align-items:center}.settings-custom-row input{font:inherit;background-color:transparent;color:inherit;border:.5px solid grey;padding:2px 4px}.settings-custom-header{font-size:.85em;opacity:.7}.settings-rc-textarea{width:100%;min-height:300px;background-color:transparent;color:inherit;border:.5px solid grey;font:inherit;padding:4px 6px;resize:vertical}
