/* latin */
@font-face {
  font-family: "Space";
  font-style: normal;
  font-weight: 400 900;
  font-display: block;
  src: url(../fonts/orbitron/yMJRMIlzdpvBhQQL_Qq7dy1biN15.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Main";
  font-style: normal;
  font-weight: 200 800;
  font-display: block;
  src: url(../fonts/oxanium/RrQQboN_4yJ0JmiMe2zE0ZJCZ4cQGg.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Main";
  font-style: normal;
  font-weight: 200 800;
  font-display: block;
  src: url(../fonts/oxanium/RrQQboN_4yJ0JmiMe2LE0ZJCZ4c.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 200;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0ONEeeCaExuqGaonvM.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 200;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0ONEeeMaExuqGao.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 300;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0PpEueCaExuqGaonvM.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 300;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0PpEueMaExuqGao.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url(../fonts/turretroad/pxiAypMgpcBFjE84Zv-fE0tMMPKhSkFEkm8.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url(../fonts/turretroad/pxiAypMgpcBFjE84Zv-fE0tCMPKhSkFE.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 500;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0OxE-eCaExuqGaonvM.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 500;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0OxE-eMaExuqGao.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0P5FeeCaExuqGaonvM.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0P5FeeMaExuqGao.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 800;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0PlFueCaExuqGaonvM.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Alien";
  font-style: normal;
  font-weight: 800;
  font-display: block;
  src: url(../fonts/turretroad/pxidypMgpcBFjE84Zv-fE0PlFueMaExuqGao.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Doto";
  font-style: normal;
  font-weight: 100 900;
  font-display: block;
  src: url(../fonts/doto/t5t6IRMbNJ6TQG7Il_EKPqP9zTnvqouPWhoxrW5OD5k.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Doto";
  font-style: normal;
  font-weight: 100 900;
  font-display: block;
  src: url(../fonts/doto/t5t6IRMbNJ6TQG7Il_EKPqP9zTnvqouBWhoxrW5O.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Material Symbols Outlined";
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/material/google-material-icons.woff2) format("woff2");
}
.gicon {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  padding: 0px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  font-feature-settings: "liga";
  font-variant-ligatures: common-ligatures;
  -webkit-font-smoothing: antialiased;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

#main.splash DIV#splashbuttonspanel BUTTON, #main.splash A.aboutbutton, BUTTON {
  font: inherit;
  font-family: "Space", Monospace;
  font-weight: bold;
  font-size: var(--fontsize-norm);
  color: #fff;
  border: 2px solid #666;
  background-color: rgba(119, 119, 119, 0.7333333333);
  touch-action: manipulation;
  cursor: pointer;
}
#main.splash DIV#splashbuttonspanel BUTTON:disabled, #main.splash A.aboutbutton:disabled, BUTTON:disabled {
  cursor: auto;
  color: #666;
  background-color: rgba(34, 34, 34, 0.7333333333);
}
#main.splash DIV#splashbuttonspanel BUTTON:disabled:hover, #main.splash A.aboutbutton:disabled:hover, BUTTON:disabled:hover {
  filter: none;
}
#main.splash DIV#splashbuttonspanel BUTTON:hover, #main.splash A.aboutbutton:hover, BUTTON:hover {
  filter: brightness(150%);
}

#goalpanel, #intelbox .intelframe, #pinnedbox .intelframe, .tooldetail .toolframe, #shipinfobox, #optionspanel, #helppanel, #difficultypanel, #helppanel .inset, #difficultypanel .inset, #map .coord .labelbox .labelframe, .choosercontainer .chooserbox {
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

#gameover #gameovertext, .notepanel .list, #intelbox .description, #pinnedbox .description, #shiplist.animate2 {
  scroll-behavior: smooth;
  -webkit-scroll-behavior: smooth;
}

*, *::before, *::after {
  box-sizing: border-box;
}

input, textarea, select {
  font: inherit;
}

BODY.phone2, BODY.phone1, BODY.big2, BODY.big1, :root {
  --fontsize-splash0: 93px;
  --fontsize-splash1: 50px;
  --fontsize-splash2: 43px;
  --fontsize-title: 25px;
  --fontsize-esig: 8px;
  --fontsize-fine: 12px;
  --fontsize-desc: 14px;
  --fontsize-norm: 19px;
  --fontsize-codenameglyph: 30px;
  --fontsize-toolbutton: 20px;
  --fontsize-shiplist-title: 30px;
  --fontsize-shiplist-name: 19px;
  --fontsize-shiplist-class: 15px;
  --fontsize-options-button: 19px;
  --fontsize-intelbuttons: var(--fontsize-fine);
  --clickfield-height: 36px;
  --clickfield-icon: 25px;
  --note-icon: 30px;
  --esig-width: 80px;
  --esig-height: 16px;
  --esig-tpad: 2px;
  --toolbox-pipsize: 13px;
  --telescope-buttonsize: 30px;
  --map-starsize: 10px;
  --map-starboxsize: 20px;
  --labelbox-pipsize: 16px;
  --d-inset-gap: 5px;
  --d-toolicon: 40px;
  --d-gutter1: 10px;
  --d-gutter2: calc(2 * var(--d-gutter1));
  --d-gutter4: calc(4 * var(--d-gutter1));
  --d-shiplist-left: var(--d-gutter1);
  --d-shiplist-top: var(--d-gutter1);
  --d-shiplist-width: 225px;
  --d-shiplist-height: calc(var(--d-screen-height) - var(--d-optionsbutton-height) - var(--d-goal-height) - 4 * var(--d-gutter1));
  --d-shiplist-leftedge: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  --d-ship-left: calc(var(--d-shiplist-width) + 3 * var(--d-gutter1));
  --d-ship-top: var(--d-gutter1);
  --d-ship-minwidth: 300px;
  --d-ship-width: calc(min(600px, var(--d-screen-width) * 0.5 - var(--d-shiplist-width) - 3 * var(--d-gutter1)));
  --d-ship-height: calc(var(--d-screen-height) - var(--d-optionsbutton-height) - var(--d-goalpanel-height) - 4 * var(--d-gutter1));
  --d-ship-fieldwidth: 345px;
  --d-shipicon-width: 130px;
  --d-goal-left: var(--d-gutter1);
  --d-goal-top: calc(var(--d-screen-height) - var(--d-optionsbutton-height) - var(--d-goal-height) - 2 * var(--d-gutter1));
  --d-goal-width: var(--d-shiplist-width);
  --d-goal-height: calc(var(--fontsize-norm) + 2 * var(--fontsize-title));
  --d-goalpanel-left: var(--d-gutter1);
  --d-goalpanel-top: calc(var(--d-goal-top) + var(--d-goal-height) - var(--d-goalpanel-height));
  --d-goalpanel-minwidth: 400px;
  --d-goalpanel-maxwidth: 600px;
  --d-goalpanel-width: calc(min(var(--d-goalpanel-maxwidth), var(--d-screen-width) * 0.5 - var(--d-shiplist-width)));
  --d-goalpanel-height: 320px;
  --d-optionsbutton-left: var(--d-gutter1);
  --d-optionsbutton-top: calc(var(--d-screen-height) - var(--d-optionsbutton-height) - var(--d-gutter1));
  --d-optionsbutton-width: var(--d-shiplist-width);
  --d-optionsbutton-height: calc(var(--fontsize-shiplist-name) + 20px);
  --d-options-left: var(--d-gutter1);
  --d-options-bottom: calc(var(--d-optionsbutton-height) + 2 * var(--d-gutter1));
  --d-options-width: var(--d-shiplist-width);
  --d-options-height: calc(var(--d-screen-height) - var(--d-optionsbutton-height) - 3 * var(--d-gutter1));
  --d-help-width: calc(var(--d-screen-width) * 0.6);
  --d-clipboard-left: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  --d-clipboard-bottom: var(--d-gutter1);
  --d-clipboard-width: calc(var(--d-screen-width) - var(--d-shiplist-width) - var(--d-intel-width) - 4 * var(--d-gutter1));
  --d-clipboard-height: var(--d-optionsbutton-height);
  --d-toast-left: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  --d-toast-bottom: calc(var(--d-clipboard-height) + 2 * var(--d-gutter1));
  --d-toast-width: var(--d-clipboard-width);
  --d-toast-height: 11.1ex;
  --d-toast-height-intro: calc(var(--d-screen-height) - 2 * var(--d-gutter1));
  --d-map-leftmin: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  --d-map-rightmax: calc(var(--d-screen-width) - var(--d-screen-height) * 0.55 - 2 * var(--d-gutter1));
  --d-map-left: calc(max(var(--d-map-leftmin), (var(--d-map-leftmin) + var(--d-map-rightmax)) * 0.5 - var(--d-map-width) * 0.5));
  --d-map-top: 0;
  --d-map-width: var(--d-map-height);
  --d-map-height: calc(var(--d-screen-height) - var(--d-clipboard-height) - 2 * var(--d-gutter1));
  --d-toolbox-top: var(--d-gutter1);
  --d-toolbox-right: var(--d-gutter1);
  --d-toolbox-width: 80px;
  --d-toolbox-height: calc((var(--d-toolbutton-height) + 5px) * 10 + var(--d-gutter1));
  --d-toolbutton-height: 35px;
  --d-tooldetail-top: var(--d-gutter1);
  --d-tooldetail-right: calc(var(--d-toolbox-width) + 2 * var(--d-gutter1));
  --d-tooldetail-width: calc(min(700px, var(--d-screen-width) * 0.5 - var(--d-toolbox-width) - 3 * var(--d-gutter1)));
  --d-tooldetail-minheight: calc(var(--fontsize-norm) * 10);
  --d-tooldetail-height: calc(var(--d-map-height));
  --d-notebook-height: calc(var(--d-screen-height) - var(--d-intel-height) - 3 * var(--d-gutter1));
  --d-minigame-viewport: 600px;
  --d-minigame-skysize: calc(var(--d-minigame-viewport) * 1.5);
  --d-minigame-starscale: 1;
  --d-telescope-width: calc(var(--fontsize-norm) * 20);
  --d-dstrtool-width: calc(var(--fontsize-norm) * 23);
  --d-esigtool-width: calc(var(--fontsize-norm) * 26);
  --d-commtool-width: calc(var(--fontsize-norm) * 26);
  --d-proxtool-width: calc(var(--fontsize-norm) * 20);
  --d-probe-width: calc(var(--fontsize-norm) * 20);
  --d-headingtool-width: calc(var(--fontsize-norm) * 25);
  --d-findtool-height: 555px;
  --d-intel-bottom: var(--d-gutter1);
  --d-intel-right: var(--d-gutter1);
  --d-intel-width: calc(min(700px, var(--d-screen-width) - var(--d-map-left) - var(--d-map-width) * 0.730 - 2 * var(--d-gutter1)));
  --d-intel-height: calc(var(--d-screen-height) - var(--d-toolbox-height) - 3 * var(--d-gutter1));
  --d-intel-imagewidth: 300px;
  --d-intel-iconwidth: 150px;
  --d-pinnedintel-bottom: calc(var(--d-clipboard-height) + 2 * var(--d-gutter1));
  --d-pinnedintel-right: calc(var(--d-intel-width) + 2 * var(--d-gutter1));
  --d-pinnedintel-width: calc(min(700px, var(--d-screen-width) - var(--d-shiplist-width) - var(--d-intel-width) - 5 * var(--d-gutter1)));
  --d-pinnedintel-height: calc(var(--d-intel-height) - var(--d-clipboard-height) - var(--d-gutter1));
  --d-wordguess-w1: calc(var(--fontsize-norm) * 5.5);
  --d-gameover-left: var(--d-map-left);
  --d-gameover-width: calc(var(--d-screen-width) * 0.5);
  --d-gameover-height: calc(var(--d-screen-height) - 1px);
}

:root {
  --d-screen-width: 1500px;
  --d-screen-height: 1000px;
}

BODY.big1 {
  --fontsize-title: 30px;
  --fontsize-esig: 11px;
  --fontsize-fine: 15px;
  --fontsize-desc: 18px;
  --fontsize-norm: 22px;
  --fontsize-codenameglyph: 45px;
  --fontsize-toolbutton: 22px;
  --fontsize-shiplist-title: 35px;
  --fontsize-shiplist-name: 22px;
  --fontsize-shiplist-class: 18px;
  --fontsize-options-button: 22px;
  --fontsize-intelbuttons: 15px;
  --clickfield-height: 40px;
  --clickfield-icon: 28px;
  --note-icon: 35px;
  --esig-width: 100px;
  --esig-height: 20px;
  --esig-tpad: 3px;
  --toolbox-pipsize: 14px;
  --telescope-buttonsize: 45px;
  --map-starsize: 16px;
  --map-starboxsize: 30px;
  --labelbox-pipsize: 30px;
  --d-inset-gap: 10px;
  --d-minigame-starscale: 1.5;
  --d-wordguess-w1: 120px;
  --d-intel-imagewidth: 300px;
  --d-intel-iconwidth: 150px;
  --d-toast-height: 10.6ex;
  --d-shiplist-width: 250px;
  --d-ship-minwidth: 500px;
  --d-ship-fieldwidth: 470px;
  --d-shipicon-width: 200px;
  --d-goalpanel-height: 400px;
  --d-goalpanel-minwidth: 600px;
  --d-goalpanel-maxwidth: 1000px;
  --d-toolbox-width: 88px;
  --d-ship-width: calc(min(1000px, var(--d-screen-width) * 0.7 - var(--d-shiplist-width) - 3 * var(--d-gutter1)));
  --d-ship-height: calc(var(--d-screen-height) - var(--d-optionsbutton-height) - 4 * var(--d-gutter1));
}

BODY.big2 {
  --fontsize-title: 32px;
  --fontsize-esig: 13px;
  --fontsize-fine: 20px;
  --fontsize-desc: 23px;
  --fontsize-norm: 27px;
  --fontsize-codenameglyph: 60px;
  --fontsize-toolbutton: 25px;
  --fontsize-shiplist-title: 40px;
  --fontsize-shiplist-name: 25px;
  --fontsize-shiplist-class: 22px;
  --fontsize-options-button: 25px;
  --fontsize-intelbuttons: 16px;
  --clickfield-height: 45px;
  --clickfield-icon: 32px;
  --note-icon: 40px;
  --esig-width: 125px;
  --esig-height: 25px;
  --esig-tpad: 4px;
  --toolbox-pipsize: 14px;
  --telescope-buttonsize: 60px;
  --map-starsize: 22px;
  --map-starboxsize: 35px;
  --labelbox-pipsize: 30px;
  --d-inset-gap: 10px;
  --d-minigame-viewport: 700px;
  --d-minigame-starscale: 2;
  --d-wordguess-w1: 150px;
  --d-intel-imagewidth: 260px;
  --d-intel-iconwidth: 150px;
  --d-toolicon: 45px;
  --d-toast-height: 9.9ex;
  --d-shiplist-width: 300px;
  --d-ship-minwidth: 500px;
  --d-ship-fieldwidth: 530px;
  --d-shipicon-width: 200px;
  --d-goalpanel-height: 500px;
  --d-goalpanel-minwidth: 600px;
  --d-goalpanel-maxwidth: 1000px;
  --d-toolbox-width: 94px;
  --d-findtool-height: 630px;
  --d-ship-width: calc(min(1000px, var(--d-screen-width) * 0.7 - var(--d-shiplist-width) - 3 * var(--d-gutter1)));
  --d-ship-height: calc(var(--d-screen-height) - var(--d-optionsbutton-height) - 4 * var(--d-gutter1));
}

BODY.phone2, BODY.phone1 {
  --fontsize-title: 50px;
  --fontsize-esig: 16px;
  --fontsize-fine: 30px;
  --fontsize-desc: 35px;
  --fontsize-norm: 45px;
  --fontsize-codenameglyph: 80px;
  --fontsize-toolbutton: 50px;
  --fontsize-shiplist-title: 56px;
  --fontsize-shiplist-name: 45px;
  --fontsize-shiplist-class: 35px;
  --fontsize-options-button: 40px;
  --fontsize-intelbuttons: 28px;
  --clickfield-height: 60px;
  --clickfield-icon: 50px;
  --note-icon: 50px;
  --esig-width: 200px;
  --esig-height: 40px;
  --esig-tpad: 8px;
  --toolbox-pipsize: 30px;
  --telescope-buttonsize: 75px;
  --map-starsize: 30px;
  --map-starboxsize: 35px;
  --labelbox-pipsize: 40px;
  --d-inset-gap: 10px;
  --d-intel-imagewidth: 400px;
  --d-intel-iconwidth: 200px;
  --d-toolicon: 60px;
  --d-gutter1: 10px;
  --d-shiplist-width: 500px;
  --d-shiplist-height: calc(var(--d-screen-height) - var(--d-goal-height) - 3 * var(--d-gutter1));
  --d-readarea-width: calc(var(--d-screen-width) - var(--d-shiplist-width) - var(--d-toolbox-width) - 5 * var(--d-gutter1));
  --d-readarea-height: calc(var(--d-screen-height) - var(--d-clipboard-height) - 3 * var(--d-gutter1));
  --d-ship-fieldwidth: 720px;
  --d-shipicon-width: 225px;
  --d-ship-minwidth: var(--d-readarea-width);
  --d-ship-width: var(--d-readarea-width);
  --d-ship-height: var(--d-readarea-height);
  --d-goal-left: var(--d-gutter1);
  --d-goal-top: calc(var(--d-screen-height) - var(--d-goal-height) - var(--d-gutter1));
  --d-goal-width: var(--d-shiplist-width);
  --d-goalpanel-left: var(--d-gutter1);
  --d-goalpanel-top: var(--d-gutter1);
  --d-goalpanel-minwidth: var(--d-shiplist-width);
  --d-goalpanel-maxwidth: var(--d-shiplist-width);
  --d-goalpanel-width: var(--d-shiplist-width);
  --d-goalpanel-height: calc(var(--d-screen-height) - 2 * var(--d-gutter1));
  --d-toolbox-width: 180px;
  --d-toolbutton-height: 80px;
  --d-optionsbutton-left: calc(var(--d-screen-width) - var(--d-toolbox-width) - var(--d-gutter1));
  --d-optionsbutton-top: calc(var(--d-screen-height) - var(--d-optionsbutton-height) - var(--d-gutter1));
  --d-optionsbutton-width: var(--d-toolbox-width);
  --d-optionsbutton-height: 120px;
  --d-options-left: calc(var(--d-screen-width) - var(--d-options-width) - var(--d-gutter1));
  --d-options-bottom: calc(var(--d-optionsbutton-height) + 2 * var(--d-gutter1));
  --d-options-width: var(--d-shiplist-width);
  --d-options-height: calc(var(--d-screen-height) - var(--d-optionsbutton-height) - 3 * var(--d-gutter1));
  --d-help-width: calc(var(--d-screen-width) * 0.6);
  --d-clipboard-left: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  --d-clipboard-bottom: var(--d-gutter1);
  --d-clipboard-width: calc(var(--d-screen-width) - var(--d-shiplist-width) - var(--d-toolbox-width) - 4 * var(--d-gutter1));
  --d-clipboard-height: var(--d-optionsbutton-height);
  --d-toast-height: 8.3ex;
  --d-toast-bottom: var(--d-gutter1);
  --d-toast-width: var(--d-clipboard-width);
  --d-map-leftmin: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  --d-map-rightmax: calc(var(--d-screen-width) - var(--d-screen-height) * 0.55 - 2 * var(--d-gutter1));
  --d-map-left: calc(max(var(--d-map-leftmin), (var(--d-map-leftmin) + var(--d-map-rightmax)) * 0.5 - var(--d-map-width) * 0.5));
  --d-map-top: 0;
  --d-map-width: var(--d-map-height);
  --d-map-height: calc(var(--d-screen-height) - var(--d-clipboard-height) - 2 * var(--d-gutter1));
  --d-maplabel-maxwidth: calc(var(--d-readarea-width) - 3 * var(--d-gutter1));
  --d-maplabel-top: calc(4 * var(--d-gutter1));
  --d-maplabel-bottom: calc(var(--d-clipboard-height) + 6 * var(--d-gutter1));
  --d-maplabel-left: calc(var(--d-map-left) + 4 * var(--d-gutter1));
  --d-tooldetail-top: var(--d-gutter1);
  --d-tooldetail-right: calc(var(--d-toolbox-width) + 2 * var(--d-gutter1));
  --d-tooldetail-width: var(--d-readarea-width);
  --d-tooldetail-height: var(--d-readarea-height);
  --d-notebook-height: var(--d-readarea-height);
  --d-minigame-viewport: calc(min(var(--d-screen-width) - var(--d-toolbox-width), var(--d-readarea-height) - var(--fontsize-norm) - 3 * var(--d-gutter1)));
  --d-minigame-starscale: 4;
  --d-findtool-height: 850px;
  --d-intel-bottom: calc(var(--d-clipboard-height) + 2 * var(--d-gutter1));
  --d-intel-right: calc(var(--d-toolbox-width) + 2 * var(--d-gutter1));
  --d-intel-width: var(--d-readarea-width);
  --d-intel-height: calc(var(--d-screen-height) - var(--d-clipboard-height) - 3 * var(--d-gutter1));
  --d-gameover-left: var(--d-gutter1);
  --d-gameover-width: calc(var(--d-screen-width) - var(--d-toolbox-width) - 3 * var(--d-gutter1));
  --d-gameover-height: calc(var(--d-screen-height) - 1px);
}

BODY.phone2 {
  --fontsize-title: 60px;
  --fontsize-esig: 16px;
  --fontsize-fine: 35px;
  --fontsize-desc: 45px;
  --fontsize-norm: 55px;
  --fontsize-codenameglyph: 90px;
  --fontsize-shiplist-title: 60px;
  --fontsize-shiplist-name: 55px;
  --fontsize-shiplist-class: 42px;
  --clickfield-height: 70px;
  --d-shiplist-width: 600px;
  --d-shipicon-width: 0px;
  --d-toast-height: 6ex;
  --d-ship-width: calc(var(--d-screen-width) - var(--d-shiplist-width) - 5 * var(--d-gutter1));
}

@keyframes pausecrawl-pulse {
  0% {
    color: #555;
  }
  50% {
    color: #77a;
  }
  100% {
    color: #555;
  }
}
@keyframes start-game-pulse {
  0% {
    color: #e0e;
    box-shadow: 0 0 40px 20px rgba(255, 0, 255, 0);
  }
  50% {
    color: #f8f;
    box-shadow: 0 0 40px 20px #f0f;
  }
  100% {
    color: #e0e;
    box-shadow: 0 0 40px 20px rgba(255, 0, 255, 0);
  }
}
@keyframes loading-pulse {
  0% {
    color: rgba(255, 255, 255, 0.5333333333);
  }
  50% {
    color: rgba(255, 255, 255, 0.2666666667);
  }
  100% {
    color: rgba(255, 255, 255, 0.5333333333);
  }
}
@keyframes slowstart-fade-in {
  0% {
    opacity: 0;
    pointer-events: none;
  }
  20% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in-60 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 0.6;
  }
}
@keyframes more-bounce {
  0% {
    margin-top: 0;
  }
  50% {
    margin-top: 10px;
  }
  100% {
    margin-top: 0;
  }
}
@keyframes toastfade {
  0% {
    background-color: rgba(255, 0, 0, 0.5333333333);
    opacity: 1;
  }
  5% {
    background-color: rgba(0, 0, 0, 0.5333333333);
    opacity: 1;
  }
  25% {
    opacity: 1;
  }
  45% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes looky-pulse {
  0% {
    box-shadow: 0 0 15px 5px #f00;
  }
  100% {
    box-shadow: 0 0 15px 5px rgba(255, 0, 0, 0);
  }
}
@keyframes biglooky-pulse {
  0% {
    box-shadow: 0 0 300px #f00;
  }
  100% {
    box-shadow: 0 0 300px rgba(255, 0, 0, 0);
  }
}
@keyframes looky-text-pulse {
  0% {
    text-shadow: 0 0 30px #0f0;
  }
  100% {
    text-shadow: 0 0 30px rgba(0, 255, 0, 0);
  }
}
@keyframes slidein-top {
  0% {
    margin-top: -500px;
  }
  100% {
    margin-top: 0px;
  }
}
@keyframes slidein-bottom {
  0% {
    margin-bottom: -500px;
  }
  100% {
    margin-bottom: 0px;
  }
}
@keyframes marked-pulse {
  0% {
    background-color: #0ff;
    box-shadow: 0 0 30px 15px #0ff;
  }
  50% {
    background-color: #ddd;
    box-shadow: 0 0 30px 15px rgba(0, 255, 255, 0.5333333333);
  }
  100% {
    background-color: #0ff;
    box-shadow: 0 0 30px 15px #0ff;
  }
}
@keyframes marked-pip-pulse {
  0% {
    background-color: #0ff;
    box-shadow: 0 0 var(--labelbox-pipsize) 5px #0ff;
  }
  50% {
    background-color: #ddd;
    box-shadow: 0 0 var(--labelbox-pipsize) 5px rgba(0, 255, 255, 0.5333333333);
  }
  100% {
    background-color: #0ff;
    box-shadow: 0 0 var(--labelbox-pipsize) 5px #0ff;
  }
}
@keyframes unread-pulse {
  0% {
    background-color: #0f0;
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #0f0;
    transform: scale(1);
  }
  5% {
    background-color: #ddd;
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) rgba(0, 255, 0, 0.5333333333);
    transform: scale(0.8);
  }
  10% {
    background-color: #0f0;
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #0f0;
    transform: scale(1);
  }
  15% {
    background-color: #ddd;
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) rgba(0, 255, 0, 0.5333333333);
    transform: scale(0.8);
  }
  20% {
    background-color: #0f0;
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #0f0;
    transform: scale(1);
  }
  100% {
    background-color: #0f0;
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #0f0;
    transform: scale(1);
  }
}
@keyframes unread-pip-pulse {
  0% {
    background-color: #0f0;
    box-shadow: 0 0 var(--labelbox-pipsize) 5px #0f0;
    background-image: none;
  }
  5% {
    background-color: #ddd;
    box-shadow: 0 0 var(--labelbox-pipsize) 5px rgba(0, 255, 0, 0.5333333333);
    background-image: none;
  }
  10% {
    background-color: #0f0;
    box-shadow: 0 0 var(--labelbox-pipsize) 5px #0f0;
    background-image: none;
  }
  15% {
    background-color: #ddd;
    box-shadow: 0 0 var(--labelbox-pipsize) 5px rgba(0, 255, 0, 0.5333333333);
    background-image: none;
  }
  20% {
    background-color: #0f0;
    box-shadow: 0 0 var(--labelbox-pipsize) 5px #0f0;
    background-image: none;
  }
  100% {
    background-color: #0f0;
    box-shadow: 0 0 var(--labelbox-pipsize) 5px #0f0;
    background-image: none;
  }
}
@keyframes intro-unread-pulse {
  0% {
    background-color: #0f0;
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #0f0;
    transform: scale(1);
  }
  5% {
    box-shadow: 0 0 calc(3 * var(--map-starsize)) calc(2 * var(--map-starsize)) #0f0;
    transform: scale(1.2);
  }
  10% {
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #0f0;
    transform: scale(1);
  }
  15% {
    box-shadow: 0 0 calc(3 * var(--map-starsize)) calc(2 * var(--map-starsize)) #0f0;
    transform: scale(1.2);
  }
  20% {
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #0f0;
    transform: scale(1);
  }
  100% {
    background-color: #0f0;
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #0f0;
    transform: scale(1);
  }
}
@keyframes star-brighten {
  0% {
    box-shadow: 0 0 calc(0.5 * var(--map-starsize)) calc(0.5 * var(--map-starsize)) rgba(221, 221, 221, 0.2666666667);
  }
  100% {
    box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #fff;
  }
}
@keyframes proxline-pulse {
  0% {
    opacity: 1;
    filter: blur(1.5px) brightness(200%);
  }
  10% {
    opacity: 0.6;
    filter: blur(1.5px) brightness(100%);
  }
  20% {
    opacity: 1;
    filter: blur(1.5px) brightness(200%);
  }
  30% {
    opacity: 0.6;
    filter: blur(1.5px) brightness(100%);
  }
  30% {
    opacity: 1;
    filter: blur(1.5px) brightness(200%);
  }
  80% {
    opacity: 1;
    filter: blur(1.5px) brightness(200%);
  }
  90% {
    opacity: 0.6;
    filter: blur(1.5px) brightness(100%);
  }
  100% {
    opacity: 0.6;
    filter: blur(1.5px) brightness(100%);
  }
}
@keyframes vector-looky-pulse {
  0% {
    filter: blur(5px) brightness(100%) hue-rotate(0deg);
  }
  10% {
    filter: blur(5px) brightness(150%) hue-rotate(0deg);
  }
  100% {
    filter: blur(5px) brightness(100%) hue-rotate(0deg);
  }
}
@keyframes vector-fade-in {
  0% {
    opacity: 0;
    filter: blur(20px);
  }
  100% {
    opacity: 0.15;
    filter: blur(5px);
  }
}
.morescroll.hidden {
  display: none;
}
.morescroll.pfixed {
  position: fixed;
}
.morescroll.pinline {
  width: 100%;
  height: 0;
  position: relative;
}
.morescroll.pinline .icon {
  position: absolute;
  left: calc(50% - var(--fontsize-title) / 2);
  top: calc(-1 * var(--fontsize-title) * 0.5);
}
.morescroll .icon {
  font-size: var(--fontsize-title);
  color: rgba(255, 255, 255, 0.4);
  animation: more-bounce 0.4s linear;
}

@keyframes unread-goal-pulse {
  0% {
    color: #fea;
    filter: drop-shadow(0 0 10px #fea);
  }
  5% {
    color: #fb7;
    filter: drop-shadow(0 0 0 #fea);
  }
  10% {
    color: #fea;
    filter: drop-shadow(0 0 10px #fea);
  }
  15% {
    color: #fb7;
    filter: drop-shadow(0 0 0 #fea);
  }
  20% {
    color: #fea;
    filter: drop-shadow(0 0 10px #fea);
  }
  100% {
    color: #fea;
    filter: drop-shadow(0 0 10px #fea);
  }
}
@keyframes looky-hint-pulse {
  0% {
    background-color: rgba(255, 0, 0, 0.3333333333);
  }
  100% {
    background-color: rgba(0, 0, 0, 0);
  }
}
@keyframes clipboard-clickme-pulse {
  0% {
    color: #bbb;
    filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0));
  }
  50% {
    color: #eee;
    filter: drop-shadow(0 0 10px #fff);
  }
  100% {
    color: #bbb;
    filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0));
  }
}
@keyframes looky-faildecode-pulse {
  0% {
    color: #fff;
    text-shadow: 0 0 30px #fff;
  }
  100% {
    color: #bfb;
    text-shadow: 0 0 10px #0f0;
  }
}
@keyframes looky-decode-pulse {
  0% {
    color: #fff;
    text-shadow: 0 0 30px #fff;
  }
  100% {
    color: #bbf;
    text-shadow: 0 0 10px #00f;
  }
}
@keyframes unused-tool-pulse {
  0% {
    color: #f9f;
    filter: drop-shadow(0 0 10px #f9f);
  }
  5% {
    color: #a4a;
    filter: drop-shadow(0 0 0 #f9f);
  }
  10% {
    color: #f9f;
    filter: drop-shadow(0 0 10px #f9f);
  }
  15% {
    color: #a4a;
    filter: drop-shadow(0 0 0 #f9f);
  }
  20% {
    color: #f9f;
    filter: drop-shadow(0 0 10px #f9f);
  }
  100% {
    color: #f9f;
    filter: drop-shadow(0 0 10px #f9f);
  }
}
@keyframes unused-infotool-pulse {
  0% {
    color: #9ff;
    filter: drop-shadow(0 0 10px #9ff);
  }
  5% {
    color: #4aa;
    filter: drop-shadow(0 0 0 #9ff);
  }
  10% {
    color: #9ff;
    filter: drop-shadow(0 0 10px #9ff);
  }
  15% {
    color: #4aa;
    filter: drop-shadow(0 0 0 #9ff);
  }
  20% {
    color: #9ff;
    filter: drop-shadow(0 0 10px #9ff);
  }
  100% {
    color: #9ff;
    filter: drop-shadow(0 0 10px #9ff);
  }
}
@keyframes tool-progress {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
@keyframes comms-pending-pulse {
  0% {
    filter: brightness(100%);
  }
  50% {
    filter: brightness(50%);
  }
  100% {
    filter: brightness(100%);
  }
}
@keyframes tool-running-pulse {
  0% {
    border-color: #707;
  }
  50% {
    border-color: #ff8;
  }
  100% {
    border-color: #707;
  }
}
@keyframes infotool-running-pulse {
  0% {
    border-color: #077;
  }
  50% {
    color: #fff;
    border-color: #ff8;
  }
  100% {
    border-color: #077;
  }
}
@keyframes logbook-pulse {
  0% {
    border: 2px solid #077;
  }
  50% {
    border: 2px solid #ff8;
  }
  100% {
    border: 2px solid #077;
  }
}
@keyframes probe-flight-ping {
  0% {
    opacity: 1;
    margin-left: calc(var(--map-starsize) * -0.25);
    margin-top: calc(var(--map-starsize) * -0.25);
    width: calc(var(--map-starsize) * 1);
    height: calc(var(--map-starsize) * 1);
    border-radius: calc(var(--map-starsize) * 0.5);
  }
  60% {
    opacity: 0;
    margin-left: calc(var(--map-starsize) * -2.75);
    margin-top: calc(var(--map-starsize) * -2.75);
    width: calc(var(--map-starsize) * 6);
    height: calc(var(--map-starsize) * 6);
    border-radius: calc(var(--map-starsize) * 3);
  }
  100% {
    opacity: 0;
  }
}
@keyframes telescope-focus-start {
  0% {
    filter: blur(10px);
  }
  20% {
    filter: blur(2px);
  }
  60% {
    filter: blur(4px);
  }
  100% {
    filter: blur(0px);
  }
}
@keyframes minigame-success {
  0% {
    filter: brightness(100%);
  }
  50% {
    filter: brightness(200%);
  }
  100% {
    filter: brightness(100%);
  }
}
@keyframes hunt-reveal {
  0% {
    opacity: 0.2;
    filter: blur(2px);
    transform-origin: 50% 50%;
    transform: scale(500%);
  }
  100% {
    opacity: 1;
    filter: blur(0px);
    transform-origin: 50% 50%;
    transform: scale(100%);
  }
}
@keyframes hunt-current-pulse {
  0% {
    box-shadow: 0 0 15px 5px #f00;
  }
  50% {
    box-shadow: 0 0 15px 5px rgba(255, 0, 0, 0);
  }
  100% {
    box-shadow: 0 0 15px 5px #f00;
  }
}
@keyframes hunt-cell-scroll {
  0% {
    transform: translate(0px, 0px);
  }
  100% {
    transform: translate(calc((var(--d-minigame-viewport) * -0.16 - 3px) * 0.5 * 10), calc((var(--d-minigame-viewport) * -0.08 - 3px) * 0.5 * 10));
  }
}
@keyframes picross-reveal {
  0% {
    opacity: 0;
  }
  60% {
    opacity: 1;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0);
  }
  80% {
    opacity: 1;
    text-shadow: 0 0 10px #fff;
  }
  100% {
    opacity: 1;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0);
  }
}
@keyframes picross-set {
  0% {
    background-color: rgba(0, 0, 0, 0);
    text-shadow: 0 0 10px #44f;
  }
  15% {
    background-color: #00f;
    text-shadow: 0 0 30px #fff;
  }
  100% {
    background-color: #006;
    text-shadow: 0 0 10px #44f;
  }
}
@keyframes picross-unset {
  0% {
    background-color: #44f;
    text-shadow: 0 0 10px #eee;
  }
  15% {
    background-color: #fff;
    text-shadow: 0 0 30px #fff;
  }
  100% {
    background-color: #555;
    text-shadow: 0 0 10px #eee;
  }
}
@keyframes checkbox-appear {
  0% {
    opacity: 0;
    box-shadow: 0 0 0px 0px rgba(187, 255, 187, 0);
  }
  8% {
    opacity: 1;
    box-shadow: 0 0 30px 20px #bfb;
  }
  50% {
    opacity: 1;
    box-shadow: 0 0 30px 1px rgba(187, 255, 187, 0);
  }
}
BODY {
  font-family: "Main", Monospace;
  margin: 0;
  padding: 0;
  background-color: #000;
  color: #eee;
  user-select: none;
  -webkit-user-select: none;
  overflow: hidden;
  background-image: var(--url-bg);
  background-size: cover;
}
BODY:fullscreen, BODY::backdrop {
  background-image: var(--url-bg) !important;
  background-size: cover !important;
}
BODY.firefoxios {
  overflow-x: hidden;
  overflow-y: scroll;
}
BODY.firefoxios #__FULLSCREEN_SIZE_BOX__ {
  width: 90vw !important;
  height: 90vh !important;
}

BUTTON.closex {
  align-self: flex-start;
  border: 0;
  background: none;
  font-size: var(--fontsize-norm);
  font-weight: normal;
}

*::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2666666667);
}

*::-webkit-scrollbar {
  background: rgba(0, 0, 0, 0.2666666667);
}

* {
  scrollbar-color: rgba(255, 255, 255, 0.2666666667) rgba(0, 0, 0, 0.2666666667);
}

.inert {
  pointer-events: none;
}

#toastlist {
  position: fixed;
  z-index: 950;
  left: var(--d-toast-left);
  bottom: var(--d-toast-bottom);
  width: var(--d-toast-width);
  max-height: var(--d-toast-height);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  font-size: var(--fontsize-desc);
  pointer-events: none;
}
#toastlist .toast {
  padding: 5px 20px 5px 20px;
  background-color: rgba(0, 0, 0, 0.5333333333);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  pointer-events: none;
  animation: toastfade 20s linear;
}

#bottomedge {
  position: fixed;
  z-index: 899;
  height: 300px;
  width: var(--d-screen-width);
  top: var(--d-screen-height);
  left: 0;
}

#main {
  position: fixed;
  width: var(--d-screen-width);
  height: var(--d-screen-height);
  box-shadow: 0 0 300px 300px #000;
  background-image: var(--url-map);
  background-position: var(--d-map-left) 0;
  background-size: var(--d-map-width) var(--d-map-height);
  background-repeat: no-repeat;
  overflow: hidden;
}
#main.notools #toolbox {
  display: none;
}
#main.notools .tooldetail {
  display: none;
}
#main.noclipboard #currentclip {
  display: none;
}
#main.showhelp .toolhelp {
  display: block;
}
#main.showhelp .helpbutton {
  filter: brightness(150%);
}
#main.wordguess #shiplist, #main.wordguess #shipinfobox {
  display: none;
}
#main.wordguess #wordguess {
  display: flex;
}
#main.wordguess #intelbox .description .alientext BUTTON.aliendecode {
  display: inline-block;
}
#main.wordguess.endgame #wordguess {
  opacity: 0;
  pointer-events: none;
}

.draggable-age {
  cursor: pointer;
  display: inline-block;
  padding: 2px 4px 2px 4px;
  background-color: rgba(0, 0, 0, 0.1333333333);
  border-radius: 4px;
}

.draggable-weapon {
  display: inline-block;
  padding: 2px 4px 2px 4px;
  border-radius: 4px;
  color: #fa2;
  background-color: rgba(255, 0, 0, 0.1333333333);
  font-family: "Main", Monospace;
  font-size: var(--fontsize-desc);
  white-space: nowrap;
  cursor: pointer;
}

.draggable-coord {
  color: #bbb;
  background-color: rgba(0, 0, 0, 0.2666666667);
  font-family: "Space", Monospace;
  font-size: var(--fontsize-desc);
  white-space: nowrap;
  cursor: pointer;
  display: inline-block;
  padding: 3px;
  border: 1px solid rgba(255, 255, 255, 0.2666666667);
  border-radius: 4px;
}

.draggable-heading {
  color: #fea;
  background-color: rgba(0, 0, 0, 0.2666666667);
  display: inline-block;
  padding: 3px;
  border: 1px solid rgba(255, 255, 255, 0.2666666667);
  border-radius: 4px;
  font-family: "Space", Monospace;
  font-size: var(--fontsize-desc);
  white-space: nowrap;
  cursor: pointer;
}

.draggable-channel {
  color: #bbb;
  background-color: rgba(0, 0, 0, 0.2666666667);
  font-size: var(--fontsize-desc);
  font-family: "Space", Monospace;
  white-space: nowrap;
  cursor: pointer;
  display: inline-block;
  padding: 3px;
  border: 1px solid rgba(255, 255, 255, 0.2666666667);
  border-radius: 4px;
}

.draggable-keyword {
  color: #9ee;
  font-family: "Main", Monospace;
  font-weight: bold;
  font-size: var(--fontsize-desc);
  white-space: nowrap;
  cursor: pointer;
}

.draggable-launchcode {
  color: #8f8;
  background-color: rgba(0, 170, 0, 0.2666666667);
  font-size: var(--fontsize-desc);
  font-family: "Space", Monospace;
  white-space: nowrap;
  cursor: pointer;
  display: inline-block;
  padding: 3px;
  border: 1px dashed rgba(0, 255, 0, 0.2666666667);
  border-radius: 4px;
}

.draggable-intel {
  color: #aaa;
  background-color: rgba(34, 34, 34, 0.4);
  font-size: var(--fontsize-fine);
  font-family: "Main", Monospace;
  cursor: pointer;
  display: inline-block;
  padding: 3px 10px 3px 10px;
  border: 1px solid #555;
}
.draggable-intel:hover {
  filter: brightness(150%);
}

.draggable-shipname {
  font-size: calc(var(--fontsize-desc) + 1px);
  font-family: "Main", Monospace;
  cursor: pointer;
  display: inline-block;
  padding: 3px 5px 3px 5px;
  border-radius: 4px;
  cursor: pointer;
}
.draggable-shipname.fleet {
  color: #aaf;
  border: 1px solid #44a;
  background-color: rgba(0, 0, 51, 0.7333333333);
}
.draggable-shipname.fleet:hover {
  color: #eef;
  background-color: rgba(0, 0, 255, 0.7333333333);
}
.draggable-shipname.alien {
  color: #faa;
  border: 1px solid #a44;
  background-color: rgba(51, 0, 0, 0.7333333333);
}
.draggable-shipname.alien:hover {
  color: #fee;
  background-color: rgba(136, 0, 0, 0.7333333333);
}

.draggable-shipclass {
  cursor: pointer;
  display: inline-block;
  padding: 1px 3px 1px 3px;
  border-radius: 4px;
  font-family: "Main", Monospace;
  font-size: var(--fontsize-desc);
}
.draggable-shipclass.fleet {
  color: #aaf;
  background-color: rgba(0, 0, 51, 0.7333333333);
}
.draggable-shipclass.fleet:hover {
  color: #eef;
  background-color: rgba(0, 0, 255, 0.7333333333);
}
.draggable-shipclass.alien {
  color: #faa;
  background-color: rgba(51, 0, 0, 0.7333333333);
}
.draggable-shipclass.alien:hover {
  color: #fee;
  background-color: rgba(136, 0, 0, 0.7333333333);
}

.draggable-electromagnetic {
  cursor: pointer;
  font-family: "Space", Monospace;
  font-size: var(--fontsize-desc);
  white-space: nowrap;
  display: inline-block;
  padding: 2px 4px 2px 4px;
  border: 1px solid rgba(255, 255, 255, 0.2666666667);
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.1333333333), rgba(0, 0, 0, 0.5333333333), rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.4666666667), rgba(255, 255, 255, 0.2666666667), rgba(255, 255, 255, 0.1333333333));
  border-radius: 4px;
}

SPAN.toolname {
  font-family: "Doto", Monospace;
  font-weight: bold;
  font-size: 105%;
  color: #fcf;
}
SPAN.toolname.infotoolname {
  color: #cff;
}

SPAN.enginesignature {
  display: inline-block;
  width: var(--esig-width);
  height: var(--esig-height);
  border: 1px solid rgba(0, 0, 0, 0.6666666667);
  cursor: pointer;
  color: rgba(0, 0, 0, 0);
  font-size: var(--fontsize-esig);
  font-family: "Main", Monospace;
  text-align: center;
  padding-top: var(--esig-tpad);
}
SPAN.enginesignature:hover {
  color: #fff;
  text-shadow: #000 0 0 3px;
}

#main.noesigs SPAN.enginesignature {
  opacity: 0;
  pointer-events: none;
}

SPAN.codenameglyph {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  vertical-align: middle;
  padding: 2px 8px 2px 12px;
  font-family: "Doto", Monospace;
  font-size: var(--fontsize-codenameglyph);
  font-weight: normal;
  color: #d04;
  background-color: #202;
  border-left: 1px solid #d04;
  border-right: 1px solid #d04;
  border-radius: calc(0.5 * var(--fontsize-codenameglyph));
  cursor: pointer;
}
SPAN.codenameglyph SPAN.letter.first {
  margin-left: 0px;
}
SPAN.codenameglyph SPAN.letter SPAN.element {
  filter: drop-shadow(0 0 3px #f00);
  margin-left: calc(-0.6 * var(--fontsize-codenameglyph));
}
SPAN.codenameglyph SPAN.letter SPAN.element.first {
  margin-left: 0px;
}
SPAN.codenameglyph.suffix {
  padding-left: 2px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  border-left: 1px dashed #d04;
}
SPAN.codenameglyph.prefix {
  padding-right: 1px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-right: 1px dashed #d04;
}

SPAN.tonnage {
  font-weight: bold;
  color: #cfc;
  cursor: pointer;
}

SPAN.energy {
  color: #f9a;
  cursor: pointer;
}

SPAN.power {
  color: #faf;
  cursor: pointer;
}

SPAN.residue {
  color: #fda;
  cursor: pointer;
  white-space: nowrap;
  font-weight: bold;
}
SPAN.residue SPAN.box {
  display: inline-block;
  position: relative;
  width: 1.8em;
  height: 1.8em;
  border: 0.1em solid #fda;
  border-radius: 0.2em;
  vertical-align: middle;
}
SPAN.residue SPAN.symbol {
  display: inline-block;
  position: relative;
  width: 1.8em;
  height: 1.8em;
  text-align: center;
  margin-left: -1.8em;
  margin-right: 0.25em;
}
SPAN.residue SPAN.label {
  font-weight: normal;
}
SPAN.residue.square SPAN.box {
  height: 1.65em;
  margin-top: -0.15em;
}
SPAN.residue.circle SPAN.box {
  border-radius: 1em;
}

SPAN.ciphertable {
  color: #ccf;
  font-weight: bold;
  font-family: "Doto", Monospace;
  white-space: nowrap;
}

IMG.tpx {
  z-index: 0;
  position: fixed;
  opacity: 0;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
}

INPUT {
  padding: 4px;
  border: 1px solid rgba(255, 255, 255, 0.2666666667);
  color: #eee;
  background-color: rgba(0, 0, 0, 0.2666666667);
  font-family: "Space", Monospace;
  font-size: var(--fontsize-desc);
}
INPUT.coordinput {
  width: 18em;
}

.clickfield {
  padding: 2px 4px 2px 7px;
  border: 1px solid rgba(255, 255, 255, 0.2666666667);
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 10em;
  height: var(--clickfield-height);
  color: #eee;
  background-color: rgba(0, 0, 0, 0.2666666667);
  font-family: "Space", Monospace;
  font-size: var(--fontsize-desc);
  cursor: pointer;
}
.clickfield.coordinput {
  min-width: 22em;
}
.clickfield.channelinput {
  min-width: 17em;
}
.clickfield.headinginput {
  min-width: 20em;
}
.clickfield.classinput {
  min-width: 14em;
}
.clickfield.classinput .draggable-shipclass {
  font-family: "Space", Monospace;
}
.clickfield.specinput {
  min-width: 16.5em;
}
.clickfield.specinput .empty {
  font-size: var(--fontsize-fine);
}
.clickfield.authinput {
  min-width: 15em;
}
.clickfield .empty {
  color: rgba(255, 255, 255, 0.5333333333);
  font-style: italic;
}
.clickfield BUTTON.clearbutton {
  font-size: var(--clickfield-icon);
  font-weight: normal;
  color: rgba(255, 255, 255, 0.5333333333);
  background: 0;
  border: none;
  padding: 0;
  margin: 0;
}
.clickfield BUTTON.clearbutton:hover {
  color: rgba(255, 255, 255, 0.8);
}

.clicktextfield {
  display: flex;
}
.clicktextfield INPUT {
  padding: 2px 7px 2px 7px;
  border: 1px solid rgba(255, 255, 255, 0.2666666667);
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 10em;
  height: var(--clickfield-height);
  color: #eee;
  background-color: rgba(0, 0, 0, 0.2666666667);
  font-family: "Main", Monospace;
  font-size: var(--fontsize-desc);
}
.clicktextfield INPUT::placeholder {
  font-family: "Space", Monospace;
  font-style: italic;
}
.clicktextfield.topicinput INPUT {
  min-width: 15em;
}
.clicktextfield BUTTON.clearbutton, .clicktextfield BUTTON.pastebutton {
  font-size: var(--clickfield-icon);
  font-weight: normal;
  color: rgba(255, 255, 255, 0.5333333333);
  background: 0;
  border: none;
  margin-left: 4px;
}
.clicktextfield BUTTON.clearbutton:hover, .clicktextfield BUTTON.pastebutton:hover {
  color: rgba(255, 255, 255, 0.8);
}
.clicktextfield BUTTON.pastebutton {
  display: none;
}
.clicktextfield.empty BUTTON.clearbutton {
  display: none;
}
.clicktextfield.empty BUTTON.pastebutton {
  display: block;
}

SPAN.fact:hover {
  filter: brightness(120%);
}

.looky {
  animation: looky-pulse 0.8s linear;
}

.biglooky {
  animation: biglooky-pulse 1s linear;
}

.choosercontainer {
  position: fixed;
  z-index: 996;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
.choosercontainer .chooseroverlay {
  position: fixed;
  z-index: 997;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
.choosercontainer .chooserbox {
  position: fixed;
  z-index: 998;
  padding: 10px;
  overflow-y: scroll;
  color: #eee;
  background-color: rgba(34, 34, 34, 0.7333333333);
  border: 3px solid #666;
}
.choosercontainer .chooserbox .choice {
  font-size: 20px;
  font-weight: bold;
  padding: 8px 20px 8px 20px;
}
.choosercontainer .chooserbox .choice.current {
  color: #fda;
  background-color: rgba(255, 255, 255, 0.1333333333);
}
.choosercontainer .chooserbox .choice:hover {
  color: #fff;
  background-color: rgba(119, 119, 119, 0.7333333333);
}

#main.importer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  padding: 20px;
}
#main.importer TEXTAREA {
  flex-grow: 1;
  height: 100px;
}
#main.importer .buttonrow {
  flex-shrink: 0;
  display: flex;
  justify-content: flex-start;
  column-gap: 10px;
}

DIV.sprite {
  image-rendering: pixelated;
}
DIV.sprite.sprites_74 {
  box-sizing: content-box;
  width: 150px;
  height: 74px;
  background-image: var(--url-sprites_74);
}
DIV.sprite.sprites_100 {
  box-sizing: content-box;
  width: 100px;
  height: 100px;
  background-image: var(--url-sprites_100);
}
DIV.sprite.sprites_150 {
  box-sizing: content-box;
  width: 150px;
  height: 150px;
  background-image: var(--url-sprites_150);
}

#map {
  position: fixed;
  z-index: 80;
  left: var(--d-map-left);
  top: var(--d-map-top);
  width: var(--d-map-width);
  height: var(--d-map-height);
  animation: fade-in 0.8s linear;
}
#map .coord {
  position: fixed;
  z-index: 100;
  width: var(--map-starboxsize);
  height: var(--map-starboxsize);
  margin-top: calc(var(--map-starboxsize) * -0.5);
  margin-left: calc(var(--map-starboxsize) * -0.5);
  cursor: pointer;
}
#map .coord.hidden {
  display: none;
}
#map .coord .dot {
  margin-top: calc((var(--map-starboxsize) - var(--map-starsize)) / 2);
  margin-left: calc((var(--map-starboxsize) - var(--map-starsize)) / 2);
  font-family: "Space", Monospace;
  width: var(--map-starsize);
  height: var(--map-starsize);
  border-radius: calc(var(--map-starsize) / 2);
  background-color: #ddd;
  box-shadow: 0 0 calc(0.5 * var(--map-starsize)) calc(0.5 * var(--map-starsize)) rgba(221, 221, 221, 0.2666666667);
}
#map .coord.selected .dot {
  background-color: #fff;
  box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #fff;
  animation: star-brighten 0.2s linear;
}
#map .coord.unread .dot {
  animation: unread-pulse 3s linear infinite;
}
#map .coord.marked .dot, #map .coord.marked.unread .dot {
  animation: marked-pulse 1s linear infinite;
}
#map .coord .labelbox {
  position: absolute;
  z-index: 110;
  width: 0;
  pointer-events: none;
  display: none;
  justify-content: flex-start;
  animation: fade-in 0.2s linear;
}
#map .coord .labelbox.rightside {
  justify-content: flex-end;
}
#map .coord .labelbox.topside {
  bottom: 0;
}
#map .coord .labelbox .labelframe {
  margin-left: calc(var(--map-starsize) + var(--d-gutter1));
  margin-top: calc(var(--map-starsize) * -1);
  display: flex;
  flex-direction: column;
  padding: var(--d-gutter1);
  pointer-events: auto;
}
#map .coord .labelbox .labelframe .label {
  white-space: nowrap;
  font-family: "Space", Monospace;
  font-size: var(--fontsize-norm);
  font-weight: bold;
}
#map .coord .labelbox .labelframe .navrow {
  display: none;
  margin-top: var(--d-gutter2);
  border-top: 1px solid rgba(255, 255, 255, 0.2666666667);
  padding-top: var(--d-gutter2);
}
#map .coord .labelbox .labelframe BUTTON.starnav {
  padding: 2px var(--fontsize-fine) 2px var(--fontsize-fine);
  margin-right: var(--d-gutter2);
  font-size: var(--fontsize-fine);
}
#map .coord .labelbox .intellist {
  margin-top: var(--d-inset-gap);
  display: flex;
  flex-direction: column;
}
#map .coord .labelbox .intellist .intelrow {
  display: flex;
  flex-wrap: wrap;
  max-width: calc(var(--labelbox-pipsize) * 20);
}
#map .coord .labelbox .intellist .intelrow.goalrow {
  display: none;
}
#map .coord .labelbox .intellist .intelrow.hidden {
  display: none;
}
#map .coord .labelbox .intellist .intelpip {
  margin-top: var(--d-inset-gap);
  margin-right: var(--d-inset-gap);
  width: var(--labelbox-pipsize);
  height: var(--labelbox-pipsize);
  background-color: #ddd;
  border-radius: calc(var(--labelbox-pipsize) / 2);
}
#map .coord .labelbox .intellist .intelpip.tele {
  background-color: #66f;
}
#map .coord .labelbox .intellist .intelpip.esig {
  background: linear-gradient(70deg, #fa0, #ff0, #f00, #ff0, #fa0);
}
#map .coord .labelbox .intellist .intelpip.dstr {
  background-color: #f84;
}
#map .coord .labelbox .intellist .intelpip.probe {
  background-color: #d4d;
}
#map .coord .labelbox .intellist .intelpip.dataset {
  background-color: #aff;
}
#map .coord .labelbox .intellist .intelpip.heading {
  background-color: #999;
}
#map .coord .labelbox .intellist .intelpip.goal {
  background-color: #fb7;
}
#map .coord .labelbox .intellist .intelpip.hidden {
  display: none;
}
#map .coord .labelbox .intellist .intelpip:hover, #map .coord .labelbox .intellist .intelpip.selected {
  border: 2px solid #fff;
  box-shadow: 0 0 calc(1.3 * var(--labelbox-pipsize)) calc(0.5 * var(--labelbox-pipsize)) #fff;
}
#map .coord .labelbox .intellist .intelpip.unread {
  animation: unread-pip-pulse 3s linear infinite;
}
#map .coord .labelbox .intellist .intelpip.marked, #map .coord .labelbox .intellist .intelpip.unread.marked {
  animation: marked-pip-pulse 1s linear infinite;
}
#map .coord .labelbox .intellist .intelrow.commrow .intelpip {
  background-color: #fe9;
}
#map .coord .labelbox .intellist .intelrow.fleetrow {
  min-width: 15em;
}
#map .coord .labelbox .intellist .intelrow.fleetrow .intelpip {
  background-color: #99f;
}
#map .coord .labelbox .intellist .intelrow.alienrow {
  min-width: 15em;
}
#map .coord .labelbox .intellist .intelrow.alienrow .intelpip {
  background-color: #f99;
}
#map .coord .labelbox .intellist .intelrow.techrow {
  min-width: 15em;
}
#map .coord .labelbox .intellist .intelrow.techrow .intelpip {
  background-color: #fc9;
}
#map .coord.selected {
  z-index: 110;
}
#map .coord.selected .labelbox {
  display: flex;
}
#map .coord.selected .labelbox .labelframe {
  border: 1px solid #666;
  background-color: rgba(34, 34, 34, 0.7333333333);
}
#map .coord.selected .labelbox .intellist {
  display: flex;
}

#bgarea {
  position: fixed;
  z-index: 80;
  left: calc(var(--d-map-left) + var(--d-map-width));
  top: 0;
  width: calc(var(--d-screen-width) - var(--d-map-width) - var(--d-map-left));
  height: var(--d-map-height);
}

#headingcurves.fadein .heading {
  animation: vector-fade-in 0.3s linear;
}
#headingcurves.looky .heading {
  animation: vector-looky-pulse 0.8s ease-out;
}
#headingcurves.toolselected .heading {
  display: block;
}
#headingcurves .heading {
  display: none;
  position: fixed;
  z-index: 90;
  left: var(--d-map-left);
  top: var(--d-map-top);
  width: var(--d-map-width);
  height: var(--d-map-height);
  opacity: 0.15;
  pointer-events: none;
  filter: blur(5px);
}
#headingcurves .heading.selected {
  opacity: 0.3;
  display: block;
}

#proxlines.hidden .proxline {
  opacity: 0;
}
#proxlines .pulse .proxline {
  opacity: 0.6;
  animation: proxline-pulse 10s linear;
}
#proxlines .proxline {
  opacity: 0.6;
  position: fixed;
  top: 0;
  left: var(--d-map-left);
  width: var(--d-map-width);
  height: var(--d-map-height);
  filter: blur(1.5px);
  transition: opacity 0.5s linear;
}

#proberange {
  position: fixed;
  z-index: 95;
  width: calc(var(--d-map-width) * 150 * 2 / 1000);
  height: calc(var(--d-map-height) * 150 * 2 / 1000);
  margin-left: calc(-1 * var(--d-map-width) * 150 / 1000);
  margin-top: calc(-1 * var(--d-map-height) * 150 / 1000);
  border: 1px dashed #d4d;
  filter: brightness(150%);
  border-radius: calc(var(--d-map-width) * 150 / 1000);
  pointer-events: none;
}
#proberange.hidden {
  display: none;
}

.flyingprobecontainer {
  position: fixed;
  z-index: 105;
  pointer-events: none;
  animation: flyingprobe_animate 1s linear;
}
.flyingprobecontainer .flyingprobe {
  margin-top: calc(var(--map-starsize) * -0.25);
  margin-left: calc(var(--map-starsize) * -0.25);
  width: calc(var(--map-starsize) * 0.5);
  height: calc(var(--map-starsize) * 0.5);
  background-color: #d4d;
  border-radius: calc(var(--map-starsize) * 0.25);
  filter: drop-shadow(0 0 5px rgba(255, 136, 255, 0.8));
}
.flyingprobecontainer .flyingprobe .ping {
  position: absolute;
  border: 1px solid #d4d;
  animation: probe-flight-ping 1s infinite;
}

BODY.ismobile #map .coord .labelbox .labelframe {
  position: fixed;
  margin: 0;
  padding: var(--d-gutter2);
  top: var(--d-maplabel-top);
  left: var(--d-maplabel-left);
  max-width: var(--d-maplabel-maxwidth);
}
BODY.ismobile #map .coord .labelbox .labelframe .label {
  white-space: normal;
}
BODY.ismobile #map .coord .labelbox.bottomside .labelframe {
  top: auto;
  bottom: var(--d-maplabel-bottom);
}
BODY.ismobile #map .coord.selected .labelbox .navrow {
  display: flex;
}

BODY.nomobile #map .coord:hover {
  z-index: 200;
}
BODY.nomobile #map .coord:hover .dot {
  background-color: #fff;
  box-shadow: 0 0 calc(2 * var(--map-starsize)) var(--map-starsize) #fff;
  animation: star-brighten 0.2s linear;
}
BODY.nomobile #map .coord:hover.unread .dot {
  animation: unread-pulse 3s linear infinite;
}
BODY.nomobile #map .coord:hover .labelbox {
  display: flex;
}
BODY.nomobile #map .coord:hover .labelbox .labelframe {
  background-color: rgba(0, 0, 0, 0.8666666667);
}
BODY.nomobile #map .coord:hover .labelbox .intellist {
  display: none;
}
BODY.nomobile #map .coord.selected .labelbox {
  display: flex;
}
BODY.nomobile #map .coord.selected .labelbox .labelframe {
  background-color: rgba(34, 34, 34, 0.7333333333);
}
BODY.nomobile #map .coord.selected .labelbox .intellist {
  display: flex;
}

#main.introcoords #map .coord.unread .dot {
  animation: intro-unread-pulse 3s linear infinite;
}

#main.splash A.aboutbutton, #main.splash DIV#splashbuttonspanel BUTTON {
  display: block;
  margin-top: var(--d-gutter1);
  padding: var(--d-gutter1) var(--d-gutter2);
  width: 10em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  font-size: 50px;
  font-weight: bold;
  opacity: 0.3;
}
#main.splash A.aboutbutton:hover, #main.splash DIV#splashbuttonspanel BUTTON:hover {
  opacity: 1;
}

#main DIV.splashtitle, #main DIV.splashtips, #main BUTTON.startgame, #main BUTTON.startimport, #main A.aboutbutton, #main #splashloading, #main #splashbuttonspanel, #main #introscreen {
  display: none;
}
#main.splash {
  background: none;
}
#main.splash #shiplist, #main.splash #leftedge, #main.splash #map, #main.splash #toolbox, #main.splash .tooldetail, #main.splash #optionsbutton, #main.splash #optionspanel, #main.splash #goalpanel, #main.splash #currentgoal, #main.splash #currentclip, #main.splash #gameover, #main.splash #bgarea {
  display: none;
}
#main.splash DIV.splashtitle {
  display: block;
  position: fixed;
  top: var(--d-gutter1);
  left: var(--d-gutter1);
  font-family: "Space", Monospace;
  font-size: var(--fontsize-splash0);
  font-weight: bold;
  color: #fff;
}
#main.splash DIV.splashtitle .maintitle {
  filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.5333333333)) drop-shadow(0 0 15px #fff);
}
#main.splash DIV.splashtitle .subtitle {
  font-family: "Main", Monospace;
  font-size: var(--fontsize-splash2);
  font-weight: normal;
  color: #888;
}
#main.splash BUTTON.startgame {
  display: block;
  position: fixed;
  z-index: 920;
  min-width: 10em;
  height: calc(var(--fontsize-splash1) * 1.6);
  left: var(--d-gutter1);
  bottom: var(--d-gutter1);
  font-size: var(--fontsize-splash1);
  font-weight: bold;
  opacity: 1;
  color: #e0e;
  background-color: #000;
  border: 1px solid #c0c;
  box-shadow: inset 0 0 15px #c0c;
  animation: start-game-pulse 3s linear infinite;
}
#main.splash BUTTON.startgame.hidden {
  display: none;
}
#main.splash DIV#splashbuttonspanel {
  position: fixed;
  display: flex;
  flex-direction: column;
  right: var(--d-gutter1);
  bottom: var(--d-gutter1);
}
#main.splash A.aboutbutton {
  margin-top: 50px;
}
#main.splash #splashloading {
  pointer-events: none;
  display: block;
  position: fixed;
  z-index: 920;
  left: var(--d-gutter2);
  bottom: var(--d-gutter2);
  font-family: "Space", Monospace;
  color: rgba(255, 255, 255, 0.5333333333);
  font-size: var(--fontsize-splash1);
  font-weight: bold;
  animation: loading-pulse 1s linear infinite;
}
#main.splash #splashloading.hidden {
  display: none;
}
#main .loadfont {
  color: #000;
  opacity: 0.1;
  font-size: 1px;
}

#mobilewarn {
  display: none;
  width: calc(100% - 80px);
  margin: 300px 40px 40px 40px;
  padding: 40px;
  text-align: center;
  font-size: 50px;
  color: rgba(221, 221, 255, 0.8);
  background-color: rgba(0, 0, 255, 0.2666666667);
  animation: slowstart-fade-in 1s linear;
}

#portraitwarn {
  display: none;
  width: 100%;
  margin-top: 40px;
  padding: 20px;
  text-align: center;
  font-size: 70px;
  color: #fff;
  background-color: rgba(255, 0, 0, 0.2666666667);
  animation: slowstart-fade-in 1s linear;
}

@media (orientation: portrait) {
  #main.splash #portraitwarn {
    display: block;
  }
}
@media (orientation: landscape) and (max-height: 500px) {
  #main.splash #mobilewarn {
    display: block;
  }
}
BODY.introsequence #main #toastlist {
  font-size: var(--fontsize-norm);
  max-height: var(--d-toast-height-intro);
  animation: toast-text-scaledown 5s ease-out 12s;
}
@keyframes toast-text-scaledown {
  0% {
    font-size: var(--fontsize-norm);
  }
  15% {
    font-size: var(--fontsize-desc);
  }
  100% {
    font-size: var(--fontsize-desc);
  }
}
BODY.introsequence #main #introscreen {
  animation: intro-fade-in 5s linear;
  position: fixed;
  z-index: 940;
  left: 0;
  top: 0;
  width: var(--d-screen-width);
  height: var(--d-screen-height);
  user-select: none;
  -webkit-user-select: none;
  overflow: hidden;
  pointer-events: none;
  display: grid;
  grid-template-columns: repeat(16, 1fr);
  grid-template-rows: repeat(10, 1fr);
  column-gap: 0;
  row-gap: 0;
  grid-gap: 0;
  justify-items: stretch;
  align-items: stretch;
  background-color: rgba(0, 0, 0, 0);
}
@keyframes intro-fade-in {
  0% {
    opacity: 0;
    background-color: #000;
  }
  20% {
    opacity: 1;
    background-color: #000;
  }
  100% {
    opacity: 1;
    background-color: #000;
  }
}
BODY.introsequence #main #introscreen .box {
  border-top: 1px solid #444;
  border-left: 1px solid #444;
  background-color: #000;
  animation: introbox-fade-in 4s linear;
}
@keyframes introbox-fade-in {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

BUTTON#optionsbutton {
  position: fixed;
  z-index: 915;
  left: var(--d-optionsbutton-left);
  top: var(--d-optionsbutton-top);
  width: var(--d-optionsbutton-width);
  height: var(--d-optionsbutton-height);
  font-size: var(--fontsize-options-button);
  line-height: var(--fontsize-shiplist-name);
  text-align: center;
  padding: 8px 0 8px 0;
  opacity: 0.6;
}
BUTTON#optionsbutton.hidden {
  display: none;
}
BUTTON#optionsbutton:hover {
  opacity: 0.9;
}
BUTTON#optionsbutton.selected {
  opacity: 1;
  color: #fff;
  background-color: rgba(119, 119, 119, 0.7333333333);
}

#optionspanel {
  position: fixed;
  z-index: 920;
  left: var(--d-options-left);
  bottom: var(--d-options-bottom);
  width: var(--d-options-width);
  max-height: var(--d-options-height);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  row-gap: 5px;
  align-items: stretch;
  animation: slidein-bottom 0.15s linear;
  padding: 10px;
  border: 3px solid #666;
  background-color: rgba(0, 0, 0, 0.6666666667);
}
#optionspanel.hidden {
  display: none;
}
#optionspanel BUTTON {
  font-size: var(--fontsize-shiplist-name);
  text-align: center;
  white-space: nowrap;
  padding: 8px 25px 8px 25px;
  opacity: 0.9;
}
#optionspanel BUTTON:hover {
  opacity: 1;
  color: #fff;
  background-color: rgba(119, 119, 119, 0.7333333333);
}
#optionspanel BUTTON.debug {
  padding: 0;
  font-size: var(--fontsize-fine);
}
#optionspanel BUTTON.disabled {
  color: rgba(255, 255, 255, 0.4666666667);
  background-color: rgba(255, 255, 255, 0.1333333333);
  border-color: rgba(255, 255, 255, 0.1333333333);
  pointer-events: none;
}
#optionspanel BUTTON.autosave, #optionspanel BUTTON.soundvolume {
  margin-bottom: var(--d-gutter2);
}
#optionspanel BUTTON.quit {
  margin-top: var(--d-gutter2);
}
#optionspanel BUTTON.autosave {
  opacity: 1;
  font-size: calc(var(--fontsize-shiplist-name) * 0.9);
  color: rgba(255, 255, 255, 0.4666666667);
  background-color: rgba(255, 255, 255, 0.1333333333);
  border-color: rgba(255, 255, 255, 0.1333333333);
  cursor: auto;
}

#helppanel, #difficultypanel {
  position: fixed;
  z-index: 930;
  left: 0;
  top: 0;
  width: var(--d-screen-width);
  height: var(--d-screen-height);
  display: flex;
  align-items: center;
  justify-content: center;
}
#helppanel .inset, #difficultypanel .inset {
  max-width: var(--d-help-width);
  max-height: calc(var(--d-screen-height) - 60px);
  padding: 20px;
  overflow-y: scroll;
  font-size: var(--fontsize-desc);
  border: 3px solid #eef;
  color: #eef;
  background-color: rgba(0, 17, 51, 0.8);
}
#helppanel .inset H1, #difficultypanel .inset H1 {
  margin-top: 0;
  font-family: "Space", Monospace;
  font-size: var(--fontsize-title);
  font-weight: bold;
}
#helppanel .inset H2, #difficultypanel .inset H2 {
  font-family: "Space", Monospace;
  font-size: var(--fontsize-norm);
  font-weight: bold;
}
#helppanel .inset LI, #difficultypanel .inset LI {
  margin-bottom: 3px;
}
#helppanel .inset A, #difficultypanel .inset A {
  color: #aaf;
}
#helppanel .inset .setting, #difficultypanel .inset .setting {
  margin-top: var(--d-gutter2);
}
#helppanel .inset .setting INPUT[type=checkbox], #difficultypanel .inset .setting INPUT[type=checkbox] {
  width: var(--fontsize-norm);
  height: var(--fontsize-norm);
  vertical-align: sub;
  cursor: pointer;
}
#helppanel .inset .setting LABEL, #difficultypanel .inset .setting LABEL {
  font-size: var(--fontsize-norm);
  font-weight: bold;
  cursor: pointer;
}
#helppanel .inset .setting LABEL:hover, #difficultypanel .inset .setting LABEL:hover {
  filter: brightness(150%);
}
#helppanel .inset .setting .description, #difficultypanel .inset .setting .description {
  margin-left: calc(var(--fontsize-norm) * 1.55);
}
#helppanel .inset .aboutlink, #difficultypanel .inset .aboutlink {
  display: flex;
  justify-content: flex-end;
}
#helppanel.hidden, #difficultypanel.hidden {
  display: none;
}

#shiplist {
  position: fixed;
  z-index: 300;
  top: 0;
  left: 0;
  min-width: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  max-width: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  max-height: var(--d-shiplist-height);
  display: flex;
  flex-direction: column;
  padding: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2666666667);
  overflow-x: hidden;
  overflow-y: auto;
  transition: opacity 0.5s linear;
  opacity: 1;
}
#shiplist .alien {
  color: #faa;
}
#shiplist .fleet {
  color: #aaf;
}
#shiplist #shiplist_animationspacer {
  display: none;
}
#shiplist .header {
  padding: var(--d-gutter1);
  font-family: "Space", Monospace;
  font-size: var(--fontsize-shiplist-title);
  font-weight: bold;
}
#shiplist .header.fleet {
  filter: drop-shadow(0 0 8px #aaf);
}
#shiplist .header.alien {
  filter: drop-shadow(0 0 8px #faa);
  margin-top: 15px;
}
#shiplist .ship {
  flex-shrink: 0;
  padding: 5px var(--d-gutter1) 5px var(--d-gutter1);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  cursor: pointer;
}
#shiplist .ship .name {
  flex-grow: 1;
  font-family: "Space", Monospace;
  font-size: var(--fontsize-shiplist-name);
  font-weight: bold;
  margin-right: 10px;
  white-space: nowrap;
}
#shiplist .ship .name .gicon.confirmed {
  margin-left: 4px;
  color: #bfb;
  filter: drop-shadow(0 0 5px #8f8) drop-shadow(0 0 10px #8f8);
  vertical-align: sub;
}
#shiplist .ship .listattrs {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  max-width: calc(var(--fontsize-shiplist-class) * 4);
  overflow: visible;
}
#shiplist .ship .listattrs .weightclass {
  font-family: "Space", Monospace;
  font-size: var(--fontsize-shiplist-class);
  text-align: right;
  white-space: nowrap;
}
#shiplist .ship .listattrs .esigbox {
  margin-top: 2px;
  min-height: calc(var(--esig-height) * 0.75);
  max-height: calc(var(--esig-height) * 0.75);
  text-align: right;
}
#shiplist .ship .listattrs .esigbox .enginesignature {
  transform-origin: 100% 0;
  transform: scale(0.5);
}
#shiplist .ship.confirmed {
  filter: brightness(70%);
}
#shiplist .ship.alien {
  border-top: 1px solid #a44;
}
#shiplist .ship.alien:hover {
  background-color: rgba(136, 0, 0, 0.5333333333);
}
#shiplist .ship.alien.selected {
  background-color: rgba(136, 0, 0, 0.7333333333);
}
#shiplist .ship.fleet {
  border-top: 1px solid #44a;
}
#shiplist .ship.fleet:hover {
  background-color: rgba(0, 0, 255, 0.4);
}
#shiplist .ship.fleet.selected {
  background-color: rgba(0, 0, 255, 0.7333333333);
}
#shiplist .ship.justsolved .gicon.confirmed {
  animation: checkbox-appear 1s ease-out;
}

#shiplistmorescroll {
  position: fixed;
  left: calc(var(--d-shiplist-width) / 2 - var(--fontsize-title) / 2 + var(--d-gutter1));
  top: calc(var(--d-shiplist-height) - var(--fontsize-title) * 0.5);
}

#leftedge {
  position: fixed;
  z-index: 80;
  top: 0;
  left: 0;
  width: var(--d-shiplist-leftedge);
  height: var(--d-screen-height);
  border-right: 1px solid rgba(255, 255, 255, 0.1333333333);
}

#main.noalien #shiplist {
  opacity: 0;
  pointer-events: none;
}

#main.nofleet #shiplist .fleet {
  display: none;
}

#shiplist.animate1 #shiplist_animationspacer {
  display: block;
  min-height: var(--d-screen-height);
}

#shipinfobox {
  position: fixed;
  z-index: 420;
  left: var(--d-ship-left);
  top: var(--d-ship-top);
  min-width: var(--d-ship-minwidth);
  max-width: var(--d-ship-width);
  max-height: var(--d-ship-height);
  overflow-x: hidden;
  overflow-y: hidden;
  display: flex;
  flex-direction: column;
  padding: 10px;
  animation: fade-in 0.2s linear;
}
#shipinfobox .titlerow {
  display: flex;
  justify-content: space-between;
  padding-bottom: 5px;
  margin-bottom: 5px;
}
#shipinfobox .titlerow .title {
  font-family: "Space", Monospace;
  font-size: var(--fontsize-title);
  font-weight: bold;
}
#shipinfobox .titlerow .title .gicon.confirmed {
  margin-left: 6px;
  color: #bfb;
  filter: drop-shadow(0 0 5px #8f8) drop-shadow(0 0 15px #8f8);
  vertical-align: sub;
}
#shipinfobox .titlerow .title.known SPAN.name {
  cursor: pointer;
}
#shipinfobox .titlerow .closex {
  font-size: var(--fontsize-title);
  padding: 0;
}
#shipinfobox .infogrid {
  display: grid;
  grid-template-columns: 6em calc(var(--d-ship-fieldwidth) - 10px - var(--d-shipicon-width)) var(--d-shipicon-width);
  column-gap: 10px;
  row-gap: 5px;
  align-items: center;
  font-size: var(--fontsize-norm);
}
#shipinfobox .infogrid DIV.shipicon {
  grid-row: 1/span 4;
  grid-column: 3/span 1;
  align-self: flex-start;
  justify-self: flex-end;
}
#shipinfobox .infogrid .label {
  grid-column: 1/span 1;
  white-space: nowrap;
  font-weight: bold;
}
#shipinfobox .infogrid .introvalue {
  display: none;
  grid-column: 2/span 1;
  font-family: "Space", Monospace;
}
#shipinfobox .infogrid .value {
  grid-column: 2/span 1;
  font-family: "Space", Monospace;
  width: auto;
}
#shipinfobox .infogrid .value.location, #shipinfobox .infogrid .value.coords, #shipinfobox .infogrid .value.killer {
  grid-column: 2/span 2;
}
#shipinfobox .infogrid .value.clickfield {
  background-color: rgba(0, 0, 0, 0.2666666667);
}
#shipinfobox .infogrid .value.clickfield .clearbutton:hover {
  color: rgba(255, 255, 255, 0.8);
}
#shipinfobox .infogrid .value.clickfield .contents {
  overflow: hidden;
}
#shipinfobox .infogrid .value.clickfield .draggable-coord {
  font-size: var(--fontsize-fine);
}
#shipinfobox .infogrid .value.unknown.chooser {
  background-color: rgba(0, 0, 0, 0.2666666667);
  border: 1px solid;
  padding: 2px 5px 2px 5px;
}
#shipinfobox .infogrid .value.known.coords {
  font-size: var(--fontsize-fine);
  cursor: pointer;
}
#shipinfobox .infogrid .value.known.shipclass, #shipinfobox .infogrid .value.known.weapons, #shipinfobox .infogrid .value.known.killer {
  cursor: pointer;
}
#shipinfobox .infogrid .value.chooser {
  cursor: pointer;
}
#shipinfobox .infogrid .value.known.esigfield SPAN.enginesignature {
  display: block;
}
#shipinfobox .infogrid .killer {
  display: none;
}
#shipinfobox .description {
  font-size: var(--fontsize-desc);
}
#shipinfobox.hidden {
  display: none;
}
#shipinfobox.alien {
  color: #faa;
  border: 3px solid #a44;
  background-color: rgba(51, 0, 0, 0.7333333333);
  box-shadow: 0 0 15px #a44;
}
#shipinfobox.alien .titlerow {
  border-bottom: 1px solid #a44;
}
#shipinfobox.alien .titlerow .closex {
  color: #faa;
}
#shipinfobox.alien .value.unknown.chooser {
  border-color: #a44;
}
#shipinfobox.alien .value.clickfield {
  border-color: #a44;
}
#shipinfobox.alien .value.clickfield .clearbutton {
  color: #faa;
}
#shipinfobox.alien .value.clickfield .empty {
  color: rgba(255, 170, 170, 0.8);
}
#shipinfobox.fleet {
  color: #aaf;
  border: 3px solid #44a;
  background-color: rgba(0, 0, 51, 0.7333333333);
  box-shadow: 0 0 15px #44a;
}
#shipinfobox.fleet .titlerow {
  border-bottom: 1px solid #44a;
}
#shipinfobox.fleet .titlerow .closex {
  color: #aaf;
}
#shipinfobox.fleet .value.unknown.chooser {
  border-color: #44a;
}
#shipinfobox.fleet .value.clickfield {
  border-color: #44a;
}
#shipinfobox.fleet .value.clickfield .clearbutton {
  color: #aaf;
}
#shipinfobox.fleet .value.clickfield .empty {
  color: rgba(170, 170, 255, 0.8);
}
#shipinfobox.haskiller .killer {
  display: flex;
}
#shipinfobox.justsolved {
  background-repeat: no-repeat;
  background-position: calc(var(--d-ship-width) * 2) 0px;
  animation: background-sweep 1.2s linear;
}
#shipinfobox.justsolved .gicon.confirmed {
  animation: checkbox-appear 1s ease-out;
}
#shipinfobox.justsolved .title .name, #shipinfobox.justsolved .value.known {
  animation: confirmed-fact-appear 1s ease-out;
}
@keyframes confirmed-fact-appear {
  0% {
    filter: brightness(1);
    text-shadow: 0 0 5px rgba(255, 255, 255, 0);
  }
  10% {
    filter: brightness(1.4);
    text-shadow: 0 0 5px #fff;
  }
  100% {
    filter: brightness(1);
    text-shadow: 0 0 5px rgba(255, 255, 255, 0);
  }
}
@keyframes background-sweep {
  0% {
    background-position: calc(var(--d-ship-width) * -0.6) 0px;
  }
  100% {
    background-position: calc(var(--d-ship-width) * 1.5) 0px;
  }
}
#shipinfobox.justsolved.alien {
  background-image: linear-gradient(135deg, rgba(51, 0, 0, 0.7333333333), rgba(51, 0, 0, 0.7333333333), rgba(51, 0, 0, 0.7333333333), rgba(51, 0, 0, 0.7333333333), rgba(255, 170, 170, 0.5333333333), rgba(51, 0, 0, 0.7333333333), rgba(51, 0, 0, 0.7333333333), rgba(51, 0, 0, 0.7333333333), rgba(51, 0, 0, 0.7333333333));
}
#shipinfobox.justsolved.fleet {
  background-image: linear-gradient(135deg, rgba(0, 0, 51, 0.7333333333), rgba(0, 0, 51, 0.7333333333), rgba(0, 0, 51, 0.7333333333), rgba(0, 0, 51, 0.7333333333), rgba(170, 170, 255, 0.5333333333), rgba(0, 0, 51, 0.7333333333), rgba(0, 0, 51, 0.7333333333), rgba(0, 0, 51, 0.7333333333), rgba(0, 0, 51, 0.7333333333));
}

BODY.phone1 #shipinfobox .infogrid, BODY.phone1 #shipinfobox .infogrid {
  grid-template-columns: 6em calc(var(--d-ship-fieldwidth) - 10px - var(--d-shipicon-width)) 1fr;
}

BODY.phone2 #shipinfobox .infogrid .shipicon {
  display: none;
}

#main.noclipboard #shipinfobox .infogrid .introvalue {
  display: block;
}
#main.noclipboard #shipinfobox .infogrid .value.clickfield, #main.noclipboard #shipinfobox .infogrid .value.chooser {
  display: none;
}
#main.noclipboard #shipinfobox .notepanel {
  display: none;
}

#main.noesigs #shipinfobox .infogrid .esigitem {
  opacity: 0;
  pointer-events: none;
}

#toolbox {
  position: fixed;
  z-index: 400;
  top: var(--d-toolbox-top);
  right: var(--d-toolbox-right);
  width: var(--d-toolbox-width);
  height: var(--d-toolbox-height);
  display: grid;
  grid-template-columns: 1fr;
  align-content: start;
  row-gap: 5px;
  overflow: hidden;
  color: #a4a;
}
#toolbox .tool {
  width: var(--d-toolbox-width);
  height: var(--d-toolbutton-height);
  text-align: center;
  line-height: var(--d-toolbutton-height);
  font-size: var(--fontsize-toolbutton);
  font-family: "Doto", Monospace;
  font-weight: bold;
  background-color: rgba(136, 0, 136, 0.6666666667);
  border: 1px solid #707;
  cursor: pointer;
}
#toolbox .tool.introhidden {
  display: none;
}
#toolbox .tool.selected, #toolbox .tool:hover {
  color: #f9f;
  background-color: rgba(153, 0, 153, 0.8666666667);
}
#toolbox .tool.running {
  animation: tool-running-pulse 2s linear infinite;
}
#toolbox .tool.running .btnprogressbar {
  display: block;
}
#toolbox .tool.pending {
  animation: tool-running-pulse 2s linear infinite;
}
#toolbox .tool.useme {
  animation-duration: 3s !important;
  animation: unused-tool-pulse 3s linear infinite;
}
#toolbox .tool.infotool {
  color: #4aa;
  background-color: rgba(0, 136, 136, 0.6666666667);
  border: 1px solid #077;
}
#toolbox .tool.infotool.first {
  margin-top: var(--d-gutter1);
}
#toolbox .tool.infotool.selected, #toolbox .tool.infotool:hover {
  color: #9ff;
  background-color: rgba(0, 153, 153, 0.8666666667);
}
#toolbox .tool.infotool.useme {
  animation: unused-infotool-pulse 3s linear infinite;
}
#toolbox .tool .btnprogressbar {
  display: none;
  position: absolute;
  z-index: 410;
  width: 100%;
  height: 0;
  margin-top: -5px;
}
#toolbox .tool .btnprogressbar .btnprogressbarmover {
  display: flex;
  height: 2px;
  background-color: #e6e;
  animation: tool-progress 1s linear;
}
#toolbox .tool.hasdot {
  text-align: left;
  padding-left: 7px;
}
#toolbox .tool.hasdot .btnprogressbar {
  margin-top: -5px;
  margin-left: -6px;
}
#toolbox .tool.hasdot#telescopebtn .colordot {
  background-color: #66f;
}
#toolbox .tool.hasdot#commsbtn .colordot {
  background-color: #fe9;
}
#toolbox .tool.hasdot#headingbtn .colordot {
  background-color: #999;
}
#toolbox .tool.hasdot#weaponsbtn .colordot {
  background-color: #f84;
}
#toolbox .tool.hasdot#signaturebtn .colordot {
  background: linear-gradient(70deg, #fa0, #ff0, #f00, #ff0, #fa0);
}
#toolbox .tool.hasdot#probebtn .colordot {
  background-color: #d4d;
}
#toolbox .tool.hasdot#proximitybtn .colordot {
  background-color: #fff;
}
#toolbox .tool .colordot {
  position: absolute;
  z-index: 415;
  width: var(--toolbox-pipsize);
  height: var(--toolbox-pipsize);
  margin-top: calc((var(--d-toolbutton-height) + var(--toolbox-pipsize)) * -0.5);
  margin-left: calc(var(--d-toolbox-width) - 7px - var(--toolbox-pipsize) - 9px);
  border-radius: calc(var(--toolbox-pipsize) / 2);
}

.tooldetail {
  position: fixed;
  z-index: 430;
  top: var(--d-tooldetail-top);
  right: var(--d-tooldetail-right);
  width: var(--d-tooldetail-width);
  max-height: var(--d-tooldetail-height);
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  pointer-events: none;
  animation: fade-in 0.2s linear;
}
.tooldetail .toolframe {
  display: flex;
  flex-direction: column;
  pointer-events: auto;
  min-height: var(--d-tooldetail-minheight);
  max-height: var(--d-tooldetail-height);
  font-size: var(--fontsize-norm);
  color: #a4a;
  background-color: rgba(68, 0, 68, 0.6666666667);
  box-shadow: 0 0 15px #a4a;
  border: 3px solid #707;
  padding: var(--d-gutter1);
}
.tooldetail .instructionrow {
  justify-content: space-between;
  column-gap: var(--d-gutter1);
}
.tooldetail .instructionrow BUTTON {
  flex-shrink: 0;
  font-size: var(--fontsize-desc);
}
.tooldetail.idle .minigameitem {
  display: none;
}
.tooldetail.minigame {
  width: auto;
  height: auto;
  max-width: none;
  max-height: none;
  animation: tool-running-pulse 2s linear infinite;
}
.tooldetail.minigame .toolframe {
  width: auto;
  height: auto;
  max-width: none;
  max-height: none;
  background-color: #008;
}
.tooldetail.minigame .titlerow {
  display: none;
}
.tooldetail.minigame.idle .minigameitem {
  display: flex;
}
.tooldetail.minigame .idleitem {
  display: none;
}
.tooldetail.running .minigameitem {
  display: none;
}
.tooldetail.pending .minigameitem {
  display: none;
}
.tooldetail .titlerow {
  flex-shrink: 0;
  align-self: stretch;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #707;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.tooldetail .titlerow .toolicon {
  flex-shrink: 0;
  margin-right: calc(var(--d-toolicon) * 0.3);
  image-rendering: auto;
}
.tooldetail .titlerow .title {
  flex-grow: 1;
  color: rgba(255, 255, 255, 0.8666666667);
  font-family: "Space", Monospace;
  font-size: var(--fontsize-title);
  font-weight: bold;
}
.tooldetail .titlerow BUTTON.closex {
  flex-shrink: 0;
  align-self: flex-start;
  margin-left: calc(var(--d-toolicon) * 0.3);
  color: #a4a;
}
.tooldetail .status {
  color: #e6e;
  font-size: var(--fontsize-desc);
}
.tooldetail .toolhelp {
  display: none;
  margin-top: 10px;
  font-size: var(--fontsize-fine);
  font-style: italic;
}
.tooldetail .controls {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  align-items: flex-start;
}
.tooldetail .controls .label {
  margin-top: 10px;
  color: #e6e;
  font-weight: bold;
}
.tooldetail .controls .buttonrow {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.tooldetail .controls BUTTON:not(.clearbutton):not(.pastebutton) {
  margin-top: 10px;
  font-size: var(--fontsize-norm);
  padding: 4px 15px 4px 15px;
  font-family: "Space", Monospace;
  font-weight: bold;
  color: #e6e;
  border: 2px solid #e6e;
  background-color: rgba(153, 0, 153, 0.8666666667);
  cursor: pointer;
}
.tooldetail.hidden, .tooldetail.introhidden {
  display: none;
}
.tooldetail.idle .runitem {
  display: none;
}
.tooldetail.idle .pendingitem {
  display: none;
}
.tooldetail.running {
  animation: tool-running-pulse 2s linear infinite;
}
.tooldetail.running .idleitem {
  display: none;
}
.tooldetail.running .pendingitem {
  display: none;
}
.tooldetail.pending {
  animation: tool-running-pulse 2s linear infinite;
}
.tooldetail.pending .runitem {
  display: none;
}
.tooldetail.pending .idleitem {
  display: none;
}

#weapons.tooldetail .toolframe {
  width: var(--d-dstrtool-width);
}

#signature.tooldetail .toolframe {
  width: var(--d-esigtool-width);
}

#comms.tooldetail .toolframe {
  width: var(--d-commtool-width);
}
#comms.tooldetail .subpanel {
  align-self: stretch;
  display: flex;
  justify-content: space-between;
}
#comms.tooldetail .subpanel .left {
  flex-grow: 1;
  margin-right: 40px;
}
#comms.tooldetail .subpanel .left, #comms.tooldetail .subpanel .right {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}
#comms.tooldetail .label.hidden {
  display: none;
}
#comms.tooldetail .wordbank {
  font-size: var(--fontsize-norm);
  min-height: 150px;
  max-height: 470px;
  overflow-y: scroll;
}
#comms.tooldetail .wordbank.empty {
  font-style: italic;
}
#comms.tooldetail .wordbank.hidden {
  display: none;
}
#comms.tooldetail BUTTON.start {
  align-self: flex-start;
}
#comms.tooldetail BUTTON.helpbutton {
  align-self: flex-end;
}
#comms.tooldetail INPUT.channelinput {
  width: 10em;
}
#comms.tooldetail .pendingcount {
  margin-top: 10px;
  color: #fff;
  white-space: nowrap;
  animation: comms-pending-pulse 1s linear infinite;
}
#comms.tooldetail .pendingcount.hidden {
  display: none;
}
#comms.tooldetail.pulsepaste .gicon.pastebutton {
  animation: clipboard-clickme-pulse 1s linear infinite;
}

#find.tooldetail .toolframe {
  min-width: auto;
  max-width: none;
  max-height: none;
  height: var(--d-findtool-height);
}
#find.tooldetail .findchoices {
  display: flex;
  flex-direction: column;
}
#find.tooldetail .controls {
  display: flex;
  flex-direction: row;
  column-gap: 10px;
  justify-content: stretch;
  align-items: stretch;
  overflow: hidden;
}
#find.tooldetail .controls .leftpanel, #find.tooldetail .controls .rightpanel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 10px;
}
#find.tooldetail .controls .placelist {
  min-width: 14em;
  flex-grow: 1;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  overflow: scroll;
  background-color: rgba(0, 0, 0, 0.5333333333);
}
#find.tooldetail .controls .placelist .placerow {
  padding: var(--d-gutter1) var(--d-gutter1) 0 var(--d-gutter1);
  font-size: var(--fontsize-norm);
  font-weight: bold;
  cursor: pointer;
}
#find.tooldetail .controls .placelist .placerow:hover {
  filter: brightness(150%);
}
#find.tooldetail .controls .placelist .reportrow {
  padding: 0 var(--d-gutter1) 0 calc(var(--d-gutter1) + var(--d-gutter2));
  font-size: var(--fontsize-desc);
  cursor: pointer;
}
#find.tooldetail .controls .placelist .reportrow:hover {
  filter: brightness(150%);
}
#find.tooldetail .controls BUTTON:not(.clearbutton):not(.pastebutton) {
  margin-top: 6px;
  margin-right: 4px;
  padding: 2px 5px 2px 5px;
  font-size: var(--fontsize-desc);
  line-height: var(--fontsize-desc);
  font-weight: normal;
  border: 1px solid #6ee;
}
#find.tooldetail .controls BUTTON:not(.clearbutton):not(.pastebutton).selected {
  color: #fff;
  background-color: #499;
  border-color: #fff;
}
#find.tooldetail INPUT {
  width: 15em;
}

.progressbar {
  width: 100%;
  background-color: rgba(153, 0, 153, 0.8666666667);
  margin-bottom: 10px;
}
.progressbar .progressbarmover {
  height: 4px;
  background-color: #e6e;
  animation: tool-progress 1s linear;
}

.tooldetail.infotool .toolframe {
  color: #4aa;
  background-color: rgba(0, 68, 68, 0.6666666667);
  box-shadow: 0 0 15px #4aa;
  border-color: #077;
}
.tooldetail.infotool .titlerow {
  border-color: #077;
}
.tooldetail.infotool .titlerow .closex {
  padding: 0;
  color: #4aa;
}
.tooldetail.infotool .status {
  color: #6ee;
}
.tooldetail.infotool .controls .label {
  color: #6ee;
}
.tooldetail.infotool .controls BUTTON:not(.clearbutton):not(.pastebutton) {
  color: #6ee;
  border-color: #6ee;
  background-color: rgba(0, 153, 153, 0.8666666667);
}
.tooldetail.infotool .controls BUTTON:not(.clearbutton):not(.pastebutton).selected {
  color: #fff;
  background-color: #499;
  border-color: #fff;
}

#toolbox #findbtn.running {
  animation: marked-pulse 1s linear infinite;
}

#logbook.tooldetail .loglist {
  overflow-x: hidden;
  overflow-y: scroll;
  display: flex;
  flex-direction: column;
  background-color: rgba(0, 0, 0, 0.5333333333);
  padding: 0;
}
#logbook.tooldetail .loglist .logbox {
  font-size: var(--fontsize-desc);
  display: flex;
  flex-direction: column;
  padding: 15px 15px 40px 15px;
}
#logbook.tooldetail .loglist .logbox.marked {
  animation: logbook-pulse 3s linear infinite;
  background-color: rgba(255, 255, 0, 0.0666666667);
}
#logbook.tooldetail .loglist .logbox.hidden {
  display: none;
}
#logbook.tooldetail .loglist .logtitle {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 1px solid rgba(0, 153, 153, 0.3333333333);
  padding-bottom: 5px;
  margin-bottom: 5px;
}
#logbook.tooldetail .loglist .logtitle .logtitletext {
  font-size: calc(var(--fontsize-norm) * 1.2);
  font-weight: bold;
  cursor: pointer;
}
#logbook.tooldetail .loglist .logtitle .logtitletext:hover {
  filter: brightness(150%);
}
#logbook.tooldetail .loglist .logtitle BUTTON {
  white-space: nowrap;
  font-size: var(--fontsize-fine);
  font-weight: normal;
  border-width: 1px;
}
#logbook.tooldetail .loglist .logentry .titlerow {
  display: none;
}
#logbook.tooldetail .loglist .logentry .buttonrow {
  display: none;
}
#logbook.tooldetail .loglist .logentry LI {
  margin-left: -20px;
  margin-bottom: 3px;
}
#logbook.tooldetail .loglist .logentry .goalstatus.done {
  color: rgba(102, 255, 119, 0.7333333333);
}
#logbook.tooldetail .loglist .logentry .goalhint {
  border-top: 1px solid rgba(255, 255, 255, 0.2666666667);
  padding-top: 5px;
  padding-bottom: 20px;
}
#logbook.tooldetail .loglist .logentry .alientext .decodedword {
  font-weight: bold;
}
#logbook.tooldetail .loglist .logentry .alientext .alienword {
  font-family: "Alien", Serif;
  font-style: italic;
  font-weight: bold;
}
#logbook.tooldetail .loglist .logentry BUTTON.aliendecode {
  display: none;
}

#notebook .notepanel {
  margin-top: 0;
}

BODY.phone2 #find.tooldetail .controls .findchoices {
  flex-direction: row;
  flex-wrap: wrap;
}

BODY.phone2 #signature.tooldetail .titlerow .toolicon {
  align-self: flex-start;
  margin-top: 13px;
}

#telescope.tooldetail {
  align-items: flex-start;
}
#telescope.tooldetail .toolframe {
  width: var(--d-telescope-width);
}
#telescope.tooldetail.minigame .toolframe {
  width: auto;
}
#telescope.tooldetail.running .minigameitem {
  display: none;
}
#telescope.tooldetail .instructionrow .desc {
  margin-left: calc(var(--d-gutter1) + var(--telescope-buttonsize) + 1px);
}
#telescope.tooldetail .focuspanel {
  margin-top: var(--d-gutter1);
  display: flex;
  justify-content: space-between;
  column-gap: var(--d-gutter1);
  background-color: #008;
}
#telescope.tooldetail .focuspanel.hidden {
  display: none;
}
#telescope.tooldetail .focuspanel.starting {
  pointer-events: none;
}
#telescope.tooldetail .focuspanel.starting .planes {
  animation: telescope-focus-start 1s linear;
}
#telescope.tooldetail .focuspanel.finishing {
  animation: minigame-success 0.5s linear infinite;
  pointer-events: none;
}
#telescope.tooldetail .focuspanel.autosolve .buttons {
  display: none;
}
#telescope.tooldetail .focuspanel.lockfirstplane .up2, #telescope.tooldetail .focuspanel.lockfirstplane .down2 {
  display: none;
}
#telescope.tooldetail .focuspanel.twoplanes .plane2 {
  display: none;
}
#telescope.tooldetail .focuspanel.twoplanes .plane3 {
  display: none;
}
#telescope.tooldetail .focuspanel.twoplanes .up3, #telescope.tooldetail .focuspanel.twoplanes .down3 {
  display: none;
}
#telescope.tooldetail .focuspanel.twoplanes .up4, #telescope.tooldetail .focuspanel.twoplanes .down4 {
  display: none;
}
#telescope.tooldetail .focuspanel.threeplanes .plane3 {
  display: none;
}
#telescope.tooldetail .focuspanel.threeplanes .up4, #telescope.tooldetail .focuspanel.threeplanes .down4 {
  display: none;
}
#telescope.tooldetail .focuspanel .planes {
  position: relative;
  display: flex;
  width: var(--d-minigame-viewport);
  height: var(--d-minigame-viewport);
  background-color: #000;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.2);
}
#telescope.tooldetail .focuspanel .planes .plane {
  position: absolute;
  width: 0;
  height: 0;
  top: 0;
  left: 0;
  transition-function: ease-out;
  transition-property: margin-top, margin-left, transform;
  transition-duration: 0.2s;
}
#telescope.tooldetail .focuspanel .planes .plane .starpos {
  position: absolute;
  width: 0;
  height: 0;
  top: 0;
  left: 0;
}
#telescope.tooldetail .focuspanel .planes .plane .starpos .star {
  display: block;
}
#telescope.tooldetail .focuspanel .planes .plane.plane0 .star {
  background-color: rgba(136, 255, 255, 0.5333333333);
}
#telescope.tooldetail .focuspanel .planes .plane.plane1 .star {
  background-color: rgba(255, 136, 136, 0.5333333333);
}
#telescope.tooldetail .focuspanel .planes .plane.plane2 .star {
  background-color: rgba(136, 136, 255, 0.5333333333);
}
#telescope.tooldetail .focuspanel .planes .plane.plane3 .star {
  background-color: rgba(255, 255, 136, 0.6666666667);
}
#telescope.tooldetail .focuspanel .buttons {
  display: flex;
  flex-direction: column;
  row-gap: var(--d-gutter1);
  justify-content: flex-start;
}
#telescope.tooldetail .focuspanel .buttons .spacer {
  flex-shrink: 0;
  min-height: var(--d-gutter2);
}
#telescope.tooldetail .focuspanel .buttons BUTTON.gicon {
  min-width: var(--telescope-buttonsize);
  min-height: var(--telescope-buttonsize);
  font-size: var(--telescope-buttonsize);
  flex-shrink: 0;
  padding: 0;
  border: 0;
  background: none;
}
#telescope.tooldetail .focuspanel .buttons BUTTON.up1, #telescope.tooldetail .focuspanel .buttons BUTTON.down1 {
  color: #aff;
}
#telescope.tooldetail .focuspanel .buttons BUTTON.up2, #telescope.tooldetail .focuspanel .buttons BUTTON.down2 {
  color: #faa;
}
#telescope.tooldetail .focuspanel .buttons BUTTON.up3, #telescope.tooldetail .focuspanel .buttons BUTTON.down3 {
  color: #aaf;
}
#telescope.tooldetail .focuspanel .buttons BUTTON.up4, #telescope.tooldetail .focuspanel .buttons BUTTON.down4 {
  color: #ffa;
}

BODY.phone2 .tooldetail.minigame .instructionrow .desc {
  margin-left: 0px;
}

#heading.tooldetail .toolframe {
  width: var(--d-headingtool-width);
}
#heading.tooldetail.minigame .toolframe {
  width: auto;
  background-color: #212;
}
#heading.tooldetail .picrosspanel {
  margin-top: var(--d-gutter1);
  width: var(--d-minigame-viewport);
  height: var(--d-minigame-viewport);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.2666666667);
  background-color: rgba(0, 0, 0, 0.5333333333);
  font-family: "Space", Monospace;
  font-size: var(--fontsize-norm);
  font-weight: bold;
}
#heading.tooldetail .picrosspanel.hidden {
  display: none;
}
#heading.tooldetail .picrosspanel.starting {
  pointer-events: none;
}
#heading.tooldetail .picrosspanel.finishing {
  animation: minigame-success 0.5s linear infinite;
  pointer-events: none;
}
#heading.tooldetail .picrosspanel .grid {
  margin-top: var(--d-gutter2);
  display: flex;
  flex-direction: column;
}
#heading.tooldetail .picrosspanel .grid .clue {
  font-weight: bold;
  color: #44f;
  text-shadow: 0 0 10px #44f;
}
#heading.tooldetail .picrosspanel .grid .clue.wrong {
  color: #d44;
  text-shadow: 0 0 20px #d44;
}
#heading.tooldetail .picrosspanel .grid .clue.satisfied {
  color: #99f;
  text-shadow: 0 0 20px #99f;
}
#heading.tooldetail .picrosspanel .grid .revealable {
  opacity: 0;
}
#heading.tooldetail .picrosspanel .grid .revealable.revealed {
  opacity: 1;
  animation: picross-reveal 1s linear;
}
#heading.tooldetail .picrosspanel .grid .row {
  display: flex;
}
#heading.tooldetail .picrosspanel .grid .row .cell {
  flex-shrink: 0;
  min-width: calc(var(--d-minigame-viewport) / 10);
  min-height: calc(var(--d-minigame-viewport) / 10);
  max-height: calc(var(--d-minigame-viewport) / 10);
  vertical-align: middle;
  line-height: calc(var(--d-minigame-viewport) / 10);
}
#heading.tooldetail .picrosspanel .grid .row .cell.puzzlecell {
  background-color: rgba(0, 0, 0, 0);
  max-width: calc(var(--d-minigame-viewport) / 10);
  text-align: center;
  cursor: pointer;
}
#heading.tooldetail .picrosspanel .grid .row .cell.clue {
  padding-left: var(--d-gutter1);
}
#heading.tooldetail .picrosspanel .grid .row .cell.clue.cluenone {
  line-height: calc(var(--d-minigame-viewport) * 0.08);
}
#heading.tooldetail .picrosspanel .grid .row .cell.set {
  color: #44f;
  background-color: #006;
  text-shadow: 0 0 10px #44f;
  animation: picross-set 0.3s linear;
}
#heading.tooldetail .picrosspanel .grid .row .cell.unset {
  color: #eee;
  background-color: #555;
  text-shadow: 0 0 10px #eee;
  animation: picross-unset 0.3s linear;
}
#heading.tooldetail .picrosspanel .grid .cluerow .cell.clue {
  transform: rotate(90deg);
  transform-origin: 50% 50%;
}
#heading.tooldetail .picrosspanel .grid .buttonbox {
  flex-grow: 1;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
#heading.tooldetail .picrosspanel .grid .buttonbox BUTTON.gicon {
  font-size: var(--fontsize-norm);
  margin-top: var(--d-gutter1);
  padding: 0;
  color: #44f;
  text-shadow: 0 0 10px #44f;
  border: 0;
  background: none;
}
#heading.tooldetail .picrosspanel .grid .buttonbox BUTTON.gicon:hover {
  color: #99f;
  text-shadow: 0 0 20px #99f;
}
#heading.tooldetail .picrosspanel .instructions {
  font-family: "Main", Monospace;
  font-weight: normal;
  font-size: var(--fontsize-desc);
  padding: calc(var(--d-gutter2) * 2);
}

#proximity.tooldetail .toolframe {
  width: var(--d-proxtool-width);
}
#proximity.tooldetail.looky .toolframe {
  animation: looky-pulse 0.8s linear;
}
#proximity.tooldetail.minigame .toolframe {
  width: auto;
  background-color: #212;
}
#proximity.tooldetail .huntpanel {
  margin-top: var(--d-gutter1);
  width: var(--d-minigame-viewport);
  height: var(--d-minigame-viewport);
  display: flex;
  justify-content: stretch;
  align-items: stretch;
  overflow: hidden;
}
#proximity.tooldetail .huntpanel.hidden {
  display: none;
}
#proximity.tooldetail .huntpanel.starting {
  pointer-events: none;
}
#proximity.tooldetail .huntpanel.starting .choices {
  animation: hunt-reveal 0.5s ease-in;
}
#proximity.tooldetail .huntpanel.finishing {
  animation: minigame-success 0.5s linear infinite;
  pointer-events: none;
}
#proximity.tooldetail .huntpanel .cell {
  min-width: calc(var(--d-minigame-viewport) * 0.16);
  height: calc(var(--d-minigame-viewport) * 0.08);
  font-family: "Space", Monospace;
  font-size: calc(var(--d-minigame-viewport) * 0.05);
  display: inline-block;
  padding: 3px;
  border: 1px solid rgba(255, 255, 255, 0.2666666667);
  border-radius: 4px;
  margin-top: 3px;
  margin-right: 3px;
  text-align: center;
  vertical-align: middle;
  background-color: #113;
}
#proximity.tooldetail .huntpanel .cell.empty {
  color: #444;
}
#proximity.tooldetail .huntpanel .cell.choice0 {
  color: #00f;
}
#proximity.tooldetail .huntpanel .cell.choice1 {
  color: #20d;
}
#proximity.tooldetail .huntpanel .cell.choice2 {
  color: #40b;
}
#proximity.tooldetail .huntpanel .cell.choice3 {
  color: #609;
}
#proximity.tooldetail .huntpanel .cell.choice4 {
  color: #807;
}
#proximity.tooldetail .huntpanel .cell.choice5 {
  color: #946;
}
#proximity.tooldetail .huntpanel .cell.choice6 {
  color: #a05;
}
#proximity.tooldetail .huntpanel .cell.choice7 {
  color: #c03;
}
#proximity.tooldetail .huntpanel .cell.choice8 {
  color: #e01;
}
#proximity.tooldetail .huntpanel .cell.choice9 {
  color: #e01;
}
#proximity.tooldetail .huntpanel .cell.choice10 {
  color: #b84;
}
#proximity.tooldetail .huntpanel .cell.choice11 {
  color: #d82;
}
#proximity.tooldetail .huntpanel .cell.choice12 {
  color: #fa0;
}
#proximity.tooldetail .huntpanel .cell.choice13 {
  color: #ba2;
}
#proximity.tooldetail .huntpanel .cell.choice14 {
  color: #18e;
}
#proximity.tooldetail .huntpanel .cell.choice15 {
  color: #38c;
}
#proximity.tooldetail .huntpanel .cell.choice16 {
  color: #56a;
}
#proximity.tooldetail .huntpanel .cell.choice17 {
  color: #768;
}
#proximity.tooldetail .huntpanel .cell.choice18 {
  color: #999;
}
#proximity.tooldetail .huntpanel .cell.choice19 {
  color: #ccc;
}
#proximity.tooldetail .huntpanel .cell.choice20 {
  color: #fff;
}
#proximity.tooldetail .huntpanel .choices {
  background: linear-gradient(45deg, #444, #000);
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  overflow: hidden;
}
#proximity.tooldetail .huntpanel .choices .row {
  display: flex;
  justify-content: flex-start;
}
#proximity.tooldetail .huntpanel .choices .row .cell {
  animation: hunt-cell-scroll 10s linear;
  cursor: pointer;
}
#proximity.tooldetail .huntpanel .choices .row .cell:hover {
  filter: brightness(130%);
  box-shadow: 0 0 4px 4px rgba(255, 255, 255, 0.5333333333);
}
#proximity.tooldetail .huntpanel .choices.paused .row .cell {
  animation-play-state: paused;
}
#proximity.tooldetail .huntpanel .rightbox {
  background-color: rgba(0, 0, 0, 0.5333333333);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
}
#proximity.tooldetail .huntpanel .rightbox .goal {
  min-width: calc(var(--d-minigame-viewport) * 0.3);
  padding-left: var(--d-gutter2);
  padding-bottom: var(--d-gutter2);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-end;
  overflow: hidden;
}
#proximity.tooldetail .huntpanel .rightbox .goal .cell {
  width: calc(var(--d-minigame-viewport) * 0.3);
  height: auto;
  font-size: calc(var(--d-minigame-viewport) * 0.1);
  padding: 6px;
  border-radius: 8px;
  margin-top: 6px;
  margin-right: 6px;
  pointer-events: none;
}
#proximity.tooldetail .huntpanel .rightbox .goal .cell.correct {
  color: #333;
  background-color: #002;
}
#proximity.tooldetail .huntpanel .rightbox .goal .cell.active {
  animation: hunt-current-pulse 0.8s linear infinite;
}
#proximity.tooldetail .huntpanel .rightbox .goal .cell.future {
  filter: brightness(30%);
}
#proximity.tooldetail .huntpanel .rightbox #pausehuntbutton {
  opacity: 0.5;
  padding: var(--d-gutter1);
  margin: var(--d-gutter1);
}

#probe.tooldetail .toolframe {
  width: var(--d-probe-width);
}
#probe.tooldetail.looky .toolframe {
  animation: looky-pulse 0.8s linear;
}
#probe.tooldetail.minigame .toolframe {
  width: auto;
  background-color: #222;
}
#probe.tooldetail INPUT.authinput {
  width: 18em;
}
#probe.tooldetail.idle .runitem {
  display: none;
}
#probe.tooldetail.idle .pendingitem {
  display: none;
}
#probe.tooldetail.running .idleitem {
  display: none;
}
#probe.tooldetail.running .pendingitem {
  display: none;
}
#probe.tooldetail.pending .titlerow {
  display: none;
}
#probe.tooldetail .flying {
  min-height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}
#probe.tooldetail .flying .message {
  font-size: var(--fontsize-norm);
  font-weight: bold;
  white-space: nowrap;
}
#probe.tooldetail .fuelpanel {
  --d-fuelsize: calc(var(--d-minigame-viewport) / 13);
  margin-top: var(--d-gutter1);
  width: var(--d-minigame-viewport);
  height: var(--d-minigame-viewport);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.2666666667);
  font-family: "Space", Monospace;
  font-size: var(--fontsize-fine);
  font-weight: bold;
}
#probe.tooldetail .fuelpanel.hidden {
  display: none;
}
#probe.tooldetail .fuelpanel.starting {
  pointer-events: none;
}
#probe.tooldetail .fuelpanel .tanks {
  margin-top: var(--d-gutter1);
  flex-shrink: 0;
  flex-grow: 1;
  align-self: center;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
#probe.tooldetail .fuelpanel .tanks .tank {
  display: flex;
  align-items: flex-end;
  border: 1px solid gray;
  padding: var(--d-gutter1);
  border-radius: var(--d-gutter1);
  margin-top: var(--d-gutter1);
  background-color: #000;
}
#probe.tooldetail .fuelpanel .tanks .tank .label {
  width: calc(var(--d-fuelsize) * 1.55);
  height: var(--d-fuelsize);
  text-align: right;
  padding-right: var(--d-gutter1);
  border-right: 1px solid gray;
  color: #888;
  font-size: calc(var(--d-fuelsize) * 0.3);
}
#probe.tooldetail .fuelpanel .tanks .tank .label .stagenum {
  color: #ccc;
  font-size: calc(var(--d-fuelsize) * 0.5);
}
#probe.tooldetail .fuelpanel .tanks .tank.spare {
  background-color: #222;
}
#probe.tooldetail .fuelpanel .tanks .tank.spare .label {
  color: #555;
}
#probe.tooldetail .fuelpanel .tanks .tank .fuel {
  flex-shrink: 0;
  margin-left: var(--d-gutter1);
  min-width: var(--d-fuelsize);
  max-width: var(--d-fuelsize);
  height: var(--d-fuelsize);
  line-height: var(--d-fuelsize);
  overflow: hidden;
  text-align: center;
  vertical-align: middle;
  border-radius: 2px;
  font-size: calc(var(--d-fuelsize) * 0.3);
  color: #fff;
  cursor: pointer;
  transition-property: height;
  transition-duration: 0.5s;
}
#probe.tooldetail .fuelpanel .tanks .tank .fuel .sub {
  vertical-align: sub;
  font-size: 80%;
}
#probe.tooldetail .fuelpanel .tanks .tank .fuel.type0 {
  height: 0px;
  color: rgba(0, 0, 0, 0);
  background-color: rgba(0, 0, 0, 0);
}
#probe.tooldetail .fuelpanel .tanks .tank .fuel.type1 {
  font-size: calc(var(--d-fuelsize) * 0.35);
  background-color: #44f;
  box-shadow: 0 0 4px 4px rgba(68, 68, 255, 0.3333333333);
}
#probe.tooldetail .fuelpanel .tanks .tank .fuel.type2 {
  color: #222;
  background-color: #faf;
  box-shadow: 0 0 4px 4px rgba(255, 170, 255, 0.3333333333);
}
#probe.tooldetail .fuelpanel .tanks .tank .fuel.type3 {
  font-size: calc(var(--d-fuelsize) * 0.5);
  color: #222;
  background-color: #aaf;
  box-shadow: 0 0 4px 4px rgba(170, 170, 255, 0.3333333333);
}
#probe.tooldetail .fuelpanel .tanks .tank .fuel.type4 {
  background-color: #f4f;
  box-shadow: 0 0 4px 4px rgba(255, 68, 255, 0.3333333333);
}
#probe.tooldetail .fuelpanel .tanks .tank .fuel:hover {
  filter: brightness(130%);
  box-shadow: 0 0 4px 4px rgba(255, 255, 255, 0.5333333333);
}
#probe.tooldetail .fuelpanel .tanks .tank .fuel.draining {
  height: 0;
}
#probe.tooldetail .fuelpanel .status {
  color: #f82;
  font-family: "Main", Monospace;
  font-weight: normal;
  font-size: var(--fontsize-fine);
  padding: var(--d-gutter4) var(--d-gutter4) var(--d-gutter1) var(--d-gutter4);
}
#probe.tooldetail .fuelpanel .status.looky {
  animation: probe-status-pulse 0.8s linear;
}
@keyframes probe-status-pulse {
  0% {
    color: #fff;
    text-shadow: 0 0 10px #fff;
  }
  100% {
    color: #f82;
    text-shadow: 0 0 5px rgba(255, 136, 34, 0);
  }
}
#probe.tooldetail .fuelpanel .instructions {
  font-family: "Main", Monospace;
  font-weight: normal;
  font-size: var(--fontsize-desc);
  padding: 0px var(--d-gutter4) var(--d-gutter4) var(--d-gutter4);
}
#probe.tooldetail .fuelpanel.finishing {
  animation: minigame-success 0.5s linear infinite;
  pointer-events: none;
}
#probe.tooldetail .fuelpanel.finishing .status {
  color: #dfd;
}

#intelbox, #pinnedbox {
  position: fixed;
  z-index: 340;
  bottom: var(--d-intel-bottom);
  right: var(--d-intel-right);
  width: var(--d-intel-width);
  max-height: var(--d-intel-height);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  pointer-events: none;
  animation: fade-in 0.15s linear;
}
#intelbox .intelframe, #pinnedbox .intelframe {
  display: flex;
  flex-direction: column;
  padding: 10px;
  overflow: hidden;
  pointer-events: auto;
  color: #eee;
  background-color: rgba(34, 34, 34, 0.7333333333);
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.6666666667);
  border: 3px solid #666;
}
#intelbox .titlerow, #pinnedbox .titlerow {
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  padding-bottom: 5px;
  border-bottom: 1px solid #666;
  margin-bottom: 7px;
}
#intelbox .titlerow .title, #pinnedbox .titlerow .title {
  font-family: "Space", Monospace;
  font-size: var(--fontsize-title);
  font-weight: bold;
}
#intelbox .titlerow .closex, #pinnedbox .titlerow .closex {
  display: none;
  font-size: var(--fontsize-title);
  padding: 0;
}
#intelbox .description, #pinnedbox .description {
  font-size: var(--fontsize-desc);
  overflow-x: hidden;
  overflow-y: scroll;
  height: 100%;
  min-height: 250px;
  padding-bottom: 30px;
}
#intelbox .description LI, #pinnedbox .description LI {
  margin-left: -10px;
  margin-bottom: 1ex;
}
#intelbox .description A, #pinnedbox .description A {
  color: #88f;
}
#intelbox .description A:hover, #pinnedbox .description A:hover {
  color: #ddf;
}
#intelbox .description DIV.intelimage, #pinnedbox .description DIV.intelimage {
  float: right;
  margin: 0 0 var(--d-gutter1) var(--d-gutter1);
  border: 4px solid #000;
  animation: intelimage-blur-in 0.5s linear;
}
@keyframes intelimage-blur-in {
  0% {
    filter: blur(20px);
  }
  100% {
    filter: blur(0px);
  }
}
#intelbox .description DIV.iconimage, #pinnedbox .description DIV.iconimage {
  float: right;
  margin: 0 0 var(--d-gutter1) var(--d-gutter1);
  border: 2px solid #000;
}
#intelbox .description .draggable-coord, #intelbox .description .draggable-channel, #pinnedbox .description .draggable-coord, #pinnedbox .description .draggable-channel {
  margin-top: 1px;
  margin-bottom: 1px;
}
#intelbox .description SPAN.keywords, #pinnedbox .description SPAN.keywords {
  filter: brightness(60%);
}
#intelbox .description .alientext, #pinnedbox .description .alientext {
  font-family: "Alien", Serif;
  font-size: var(--fontsize-norm);
  font-style: italic;
  font-weight: bold;
}
#intelbox .description .alientext .alienword, #pinnedbox .description .alientext .alienword {
  color: #bfb;
  text-shadow: 0 0 10px #0f0;
  padding: 3px;
}
#intelbox .description .alientext .alienword.fleet, #pinnedbox .description .alientext .alienword.fleet {
  padding: 3px 5px 3px 5px;
  border: 1px solid #44a;
  border-radius: 4px;
  color: #aaf;
  background-color: rgba(0, 0, 51, 0.7333333333);
}
#intelbox .description .alientext .alienword.alienship, #pinnedbox .description .alientext .alienword.alienship {
  padding: 3px 5px 3px 5px;
  border: 1px solid #a44;
  border-radius: 4px;
  color: #faa;
  background-color: rgba(51, 0, 0, 0.7333333333);
}
#intelbox .description .alientext .alienword.weapon, #pinnedbox .description .alientext .alienword.weapon {
  padding: 2px 4px 2px 4px;
  border-radius: 4px;
  color: #fa2;
  background-color: rgba(255, 0, 0, 0.1333333333);
}
#intelbox .description .alientext .alienword.guessedword, #pinnedbox .description .alientext .alienword.guessedword {
  color: #bbf;
  text-shadow: 0 0 10px #00f;
}
#intelbox .description .alientext .alienword.guessedword.looky, #pinnedbox .description .alientext .alienword.guessedword.looky {
  animation: looky-decode-pulse 0.8s linear;
}
#intelbox .description .alientext .alienword.looky, #pinnedbox .description .alientext .alienword.looky {
  animation: looky-faildecode-pulse 0.8s linear;
}
#intelbox .description .alientext BUTTON.aliendecode, #pinnedbox .description .alientext BUTTON.aliendecode {
  display: none;
  margin-left: 10px;
  font-size: var(--fontsize-fine);
  border: 1px solid #aaa;
  color: #eee;
  background-color: #555;
  padding: 3px 10px 3px 10px;
}
#intelbox .description .goalhint, #pinnedbox .description .goalhint {
  border-top: 1px solid rgba(255, 255, 255, 0.4);
  padding-top: 5px;
  padding-bottom: 20px;
}
#intelbox .buttonrow, #pinnedbox .buttonrow {
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  border-top: 1px solid #666;
  padding-top: 5px;
}
#intelbox .buttonrow .spacer, #pinnedbox .buttonrow .spacer {
  flex-grow: 1;
}
#intelbox .buttonrow BUTTON, #pinnedbox .buttonrow BUTTON {
  flex-shrink: 1;
  margin-left: 10px;
  font-size: var(--fontsize-intelbuttons);
  font-weight: normal;
  padding: 0.1em 0.5em;
}
#intelbox .buttonrow BUTTON.prev, #pinnedbox .buttonrow BUTTON.prev {
  margin-left: 0;
}
#intelbox.hidden, #pinnedbox.hidden {
  display: none;
}
#intelbox .animatinghidden, #pinnedbox .animatinghidden {
  opacity: 0;
}

#pinnedbox {
  z-index: 325;
  bottom: var(--d-pinnedintel-bottom);
  right: var(--d-pinnedintel-right);
  width: var(--d-pinnedintel-width);
  max-height: var(--d-pinnedintel-height);
  animation: slidein-right 0.1s linear;
}
@keyframes slidein-right {
  0% {
    margin-right: calc(-1 * var(--d-pinnedintel-width));
  }
  100% {
    margin-right: 0px;
  }
}
#pinnedbox .titlerow BUTTON.restore {
  display: none;
}
#pinnedbox .titlerow BUTTON.close {
  display: none;
}
#pinnedbox .buttonrow {
  justify-content: flex-end;
}
#pinnedbox.minimized .titlerow {
  padding-bottom: 0;
  border-bottom: none;
  margin-bottom: 0;
}
#pinnedbox.minimized .titlerow .title {
  font-family: "Space", Monospace;
  font-size: var(--fontsize-desc);
  font-weight: bold;
}
#pinnedbox.minimized .titlerow .spacer {
  flex-grow: 1;
}
#pinnedbox.minimized .titlerow BUTTON {
  font-size: var(--fontsize-intelbuttons);
  font-weight: normal;
  padding: 0.1em 0.5em;
  margin-left: 10px;
  align-self: flex-end;
}
#pinnedbox.minimized .titlerow BUTTON.restore {
  display: block;
}
#pinnedbox.minimized .titlerow BUTTON.close {
  display: block;
}
#pinnedbox.minimized .description {
  display: none;
}
#pinnedbox.minimized .buttonrow {
  display: none;
}

BODY.ismobile #pinnedbox {
  display: none;
}
BODY.ismobile #intelbox {
  height: 100%;
}
BODY.ismobile #intelbox .intelframe {
  height: 100%;
}
BODY.ismobile #intelbox .intelframe .titlerow .closex {
  display: block;
}
BODY.ismobile #intelbox .intelframe .buttonrow .close {
  display: none;
}
BODY.ismobile #intelbox .intelframe .buttonrow .longlabel {
  display: none;
}
BODY.ismobile #intelbox .intelframe .buttonrow .pin {
  display: none;
}

BODY.big2 #intelbox .buttonrow .longlabel {
  display: none;
}

#notebook.tooldetail .toolframe {
  max-height: var(--d-notebook-height);
}
#notebook.tooldetail .subtitle {
  color: #6ee;
  font-family: "Space", Monospace;
  font-weight: bold;
  margin-bottom: var(--d-gutter1);
}
#notebook.tooldetail #clueslist {
  margin-bottom: calc(2 * var(--d-gutter2));
}
#notebook.tooldetail #clueslist.empty {
  font-size: var(--fontsize-fine);
  font-style: italic;
}

.notepanel {
  flex-grow: 1;
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.notepanel .heading {
  flex-shrink: 0;
  font-size: var(--fontsize-norm);
  font-weight: bold;
}
.notepanel .list {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  overflow-y: scroll;
}
.notepanel .list .noteslist {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}
.notepanel .list .noteslist .note {
  flex-shrink: 0;
  background-color: rgba(0, 0, 0, 0.2666666667);
  margin-bottom: 20px;
  padding: 5px;
  font-size: var(--fontsize-desc);
  min-width: 20em;
  display: flex;
  flex-direction: column;
  row-gap: 3px;
}
.notepanel .list .noteslist .note .textrow {
  display: flex;
  align-items: flex-start;
}
.notepanel .list .noteslist .note .textrow .text {
  flex-grow: 1;
  margin-right: 10px;
  cursor: pointer;
}
.notepanel .list .noteslist .note .textrow .text.hidden {
  display: none;
}
.notepanel .list .noteslist .note .textrow .attachment {
  flex-grow: 1;
  margin-right: 10px;
}
.notepanel .list .emptyhelp {
  flex-shrink: 0;
  display: none;
  margin: 10px 0 10px 0;
  font-size: var(--fontsize-fine);
  font-style: italic;
}
.notepanel .list .newnotepanel {
  flex-shrink: 0;
  display: none;
  flex-direction: column;
  row-gap: 5px;
  align-items: flex-start;
}
.notepanel .list .newnotepanel .textrow {
  display: flex;
  column-gap: 5px;
}
.notepanel .list .newnotepanel .textrow TEXTAREA {
  min-width: 20em;
  margin-left: 3px;
  flex-grow: 1;
  font-size: var(--fontsize-desc);
  color: rgba(255, 255, 255, 0.8);
  background-color: rgba(0, 0, 0, 0.2666666667);
}
.notepanel .list .newnotepanel .newrichnote {
  min-height: var(--d-clipboard-height);
}
.notepanel .buttonrow {
  flex-shrink: 0;
  display: flex;
}
.notepanel .buttonrow BUTTON {
  white-space: nowrap;
  font-size: var(--fontsize-fine);
  margin-top: 5px;
  margin-right: 7px;
}
.notepanel .buttonrow BUTTON.savenote, .notepanel .buttonrow BUTTON.cancelnote {
  display: none;
}
.notepanel.startingnote .buttonrow BUTTON.newnote {
  display: none;
}
.notepanel.startingnote .buttonrow BUTTON.pasteasnote {
  display: none;
}
.notepanel.startingnote .buttonrow BUTTON.savenote, .notepanel.startingnote .buttonrow BUTTON.cancelnote {
  display: block;
}
.notepanel.startingnote .newnotepanel {
  display: flex;
}
.notepanel.empty .list .emptyhelp {
  display: block;
}
.notepanel BUTTON.gicon {
  font-size: var(--note-icon);
  font-weight: normal;
  color: rgba(255, 255, 255, 0.5333333333);
  background: 0;
  border: 0;
  padding: 0;
}
.notepanel BUTTON.gicon:hover {
  color: rgba(255, 255, 255, 0.8);
}
.notepanel BUTTON.gicon[disabled] {
  color: rgba(255, 255, 255, 0.2666666667);
  cursor: auto;
}
.notepanel BUTTON.gicon[disabled]:hover {
  color: rgba(255, 255, 255, 0.2666666667);
}

#currentclip {
  position: fixed;
  z-index: 897;
  left: var(--d-clipboard-left);
  bottom: var(--d-clipboard-bottom);
  max-width: var(--d-clipboard-width);
  height: var(--d-clipboard-height);
  display: flex;
  align-items: center;
  padding: 2px 20px 2px 10px;
  overflow: hidden;
  font-size: var(--fontsize-norm);
  background-color: rgba(0, 0, 0, 0.5333333333);
}
#currentclip.used {
  opacity: 0.5;
}
#currentclip .gicon {
  margin-right: var(--d-gutter1);
  color: rgba(255, 255, 255, 0.5333333333);
}
#currentclip .gicon.clear {
  cursor: pointer;
}
#currentclip .gicon.clear:hover {
  color: rgba(255, 255, 255, 0.8);
}
#currentclip .clipitem {
  margin-right: var(--d-gutter1);
  overflow: hidden;
}
#currentclip .clipitem SPAN.enginesignature {
  display: block;
}
#currentclip .clipitem SPAN.residue {
  display: block;
  margin-top: 0.6em;
}
#currentclip .clipitem SPAN.residue.circle {
  margin-top: 0.3em;
}
#currentclip .clipitem SPAN.draggable-intel {
  text-overflow: ellipsis;
}
#currentclip .clipitem SPAN.codenameglyph {
  transform: scale(0.9);
}
#currentclip .empty {
  font-size: var(--fontsize-desc);
  font-style: italic;
  opacity: 0.5;
}
#currentclip .empty .gicon {
  font-style: italic;
  vertical-align: sub;
}

#main.introcoords .draggable-coord.introcoords {
  animation: clipboard-clickme-pulse 1s linear infinite;
}
#main.introcoords.noclipboard .draggable-coord.introcoords {
  animation: none;
}
#main.introcoords #telescope.tooldetail .coordinput {
  animation: clipboard-clickme-pulse 1s linear infinite;
}

#main.introemdata .draggable-electromagnetic {
  animation: clipboard-clickme-pulse 1s linear infinite;
}
#main.introemdata #weapons.tooldetail .specinput {
  animation: clipboard-clickme-pulse 1s linear infinite;
}

#currentgoal {
  position: fixed;
  z-index: 330;
  left: var(--d-goal-left);
  top: var(--d-goal-top);
  width: var(--d-goal-width);
  height: var(--d-goal-height);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fb7;
  cursor: pointer;
}
#currentgoal .label {
  font-family: "Space", Monospace;
  font-weight: bold;
  font-size: var(--fontsize-norm);
}
#currentgoal BUTTON.noobjectives {
  font-size: var(--fontsize-desc);
  line-height: var(--fontsize-desc);
  text-align: center;
  padding: 8px 0 8px 0;
  opacity: 0.6;
  animation: fade-in-60 2s linear;
}
#currentgoal BUTTON.noobjectives:hover {
  opacity: 0.9;
}
#currentgoal .text {
  font-size: var(--fontsize-desc);
}
#currentgoal .text.looky {
  animation: looky-goal-pulse 1s linear;
}
#currentgoal.selected, #currentgoal:hover {
  color: #fea;
}
#currentgoal.unread {
  animation: unread-goal-pulse 3s linear infinite;
}
#currentgoal.hidden {
  display: none;
}

#goalpanel {
  position: fixed;
  z-index: 335;
  left: var(--d-goalpanel-left);
  top: var(--d-goalpanel-top);
  min-width: var(--d-goalpanel-minwidth);
  max-width: var(--d-goalpanel-width);
  height: var(--d-goalpanel-height);
  padding: 10px;
  color: #fb7;
  border: 3px solid #fb7;
  background-color: rgba(51, 17, 0, 0.6666666667);
  box-shadow: 0 0 10px #fb7;
  animation: expand-in-ll 0.15s linear;
  display: flex;
  flex-direction: column;
}
@keyframes expand-in-ll {
  0% {
    transform-origin: bottom left;
    transform: scale(0.01);
  }
  100% {
    transform-origin: bottom left;
    transform: scale(1);
  }
}
#goalpanel .title {
  flex-shrink: 0;
  color: #fea;
  font-size: var(--fontsize-norm);
  font-weight: bold;
}
#goalpanel .subtitle {
  flex-shrink: 0;
  font-family: "Space", Monospace;
  font-size: var(--fontsize-fine);
  font-weight: bold;
  margin-bottom: 8px;
}
#goalpanel .description {
  padding-top: 5px;
  flex-grow: 1;
  font-size: var(--fontsize-desc);
  overflow-y: scroll;
}
#goalpanel .hint {
  border-top: 1px solid rgba(255, 187, 119, 0.5333333333);
  margin-top: 20px;
  padding-top: 5px;
}
#goalpanel .hint.looky {
  animation: looky-hint-pulse 1s linear;
}
#goalpanel .hint.hidden {
  display: none;
}
#goalpanel .hint.irrelevant {
  filter: brightness(70%);
}
#goalpanel .buttonrow {
  flex-shrink: 0;
  border-top: 1px solid #fb7;
  padding-top: 5px;
  display: flex;
  justify-content: space-between;
}
#goalpanel .buttonrow DIV.spacer {
  flex-grow: 1;
}
#goalpanel .buttonrow BUTTON {
  flex-shrink: 0;
  font-size: var(--fontsize-fine);
  font-weight: normal;
}
#goalpanel .buttonrow BUTTON.togglenudges {
  opacity: 0.7;
  margin-left: var(--d-gutter1);
}
#goalpanel .buttonrow BUTTON.hidden {
  display: none;
}
#goalpanel.hidden {
  display: none;
}

BODY.ismobile #goalpanel BUTTON.togglenudges {
  display: none;
}

#wordguess {
  display: none;
  position: fixed;
  z-index: 321;
  top: 0;
  left: 0;
  min-width: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  max-width: calc(var(--d-shiplist-width) + 2 * var(--d-gutter1));
  max-height: var(--d-shiplist-height);
  overflow: hidden;
  flex-direction: column;
  color: #bfb;
}
#wordguess .title {
  padding: var(--d-gutter1);
  font-family: "Space", Monospace;
  font-size: var(--fontsize-title);
  font-weight: bold;
  white-space: nowrap;
}
#wordguess #wordguesslist {
  display: flex;
  flex-direction: column;
  row-gap: var(--d-gutter1);
  padding: var(--d-gutter1);
  overflow-x: hidden;
  overflow-y: auto;
}
#wordguess #wordguesslist .help {
  margin-top: var(--d-gutter1);
  font-size: var(--fontsize-desc);
}
#wordguess #wordguesslist .wordgrid {
  font-size: var(--fontsize-norm);
  display: grid;
  grid-template-columns: var(--d-wordguess-w1) 1fr;
  row-gap: var(--d-gutter1);
  column-gap: 5px;
}
#wordguess #wordguesslist .wordgrid .alienword {
  align-self: baseline;
  font-family: "Alien", Serif;
  font-style: italic;
  font-weight: bold;
  color: #bfb;
  text-shadow: 0 0 10px #0f0;
  cursor: pointer;
}
#wordguess #wordguesslist .wordgrid .known {
  font-size: var(--fontsize-desc);
}
#wordguess #wordguesslist .wordgrid .known .gicon {
  display: inline-block;
  vertical-align: sub;
  margin-right: 3px;
}
#wordguess #wordguesslist .wordgrid .guessfield INPUT {
  font-family: "Main", Monospace;
  align-self: baseline;
  width: calc(var(--d-shiplist-width) - var(--d-wordguess-w1) - 5px - var(--clickfield-icon));
}
#wordguess #wordguesslist .wordgrid .guessfield BUTTON.gicon {
  padding: 0;
}
#wordguess.looky {
  animation: looky-text-pulse 0.8s linear;
}

#wordguessmorescroll {
  position: fixed;
  left: calc(var(--d-shiplist-width) / 2 - var(--fontsize-title) / 2 + var(--d-gutter1));
  top: calc(var(--d-shiplist-height) - var(--fontsize-title) * 0.5);
}

#main.gameoverstarting #toastlist {
  display: none;
}

#main.gameover #shiplist, #main.gameover #map, #main.gameover #toolbox, #main.gameover .tooldetail, #main.gameover #goalpanel, #main.gameover #currentgoal, #main.gameover #currentclip, #main.gameover #toastlist, #main.gameover #intelbox, #main.gameover #pinnedbox {
  display: none;
}

#gameover {
  opacity: 0;
  transition: opacity 3s;
  position: fixed;
  z-index: 910;
  left: 0px;
  bottom: 0px;
  width: var(--d-screen-width);
  height: var(--d-screen-height);
  overflow: hidden;
  background-image: var(--url-bg);
  background-position: bottom;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  padding-left: var(--d-gameover-left);
}
#gameover.hidden {
  display: none;
}
#gameover .animatinghidden {
  opacity: 0;
}
#gameover #gameovertext {
  width: var(--d-gameover-width);
  height: var(--d-gameover-height);
  overflow-x: hidden;
  overflow-y: scroll;
  scrollbar-width: none;
  background-color: rgba(0, 0, 0, 0.4);
  padding: var(--d-gutter1);
  font-size: var(--fontsize-desc);
}
#gameover #gameovertext .item {
  padding-bottom: calc(2 * var(--d-gutter1));
  opacity: 0.7;
}
#gameover #gameovertext .item.currentitem {
  opacity: 1;
}
#gameover #gameovertext .heading {
  font-family: "Space", Monospace;
  font-size: var(--fontsize-norm);
  font-weight: bold;
}
#gameover #gameovertext .draggable-shipname {
  pointer-events: none;
}
#gameover #gameovertext A {
  color: #aaf;
}
#gameover #gameovertext .alientext {
  font-size: var(--fontsize-norm);
  font-family: "Alien", Serif;
  font-style: italic;
  font-weight: bold;
}
#gameover #gameovertext .alientext .alienword {
  color: #bfb;
  text-shadow: 0 0 10px #0f0;
  padding: 3px;
}
#gameover #gameovertext .pausecrawl {
  font-size: var(--fontsize-fine);
  font-style: italic;
  color: #555;
  animation: pausecrawl-pulse 3s linear infinite;
}

/*# sourceMappingURL=all.css.map */
