:root { /* Basic view variables */ --bg-color: hsl(0, 0%, 15%); --text-color: hsl(0, 0%, 80%); --text-color-disabled: hsl(0, 0%, 55%); --font-family: Verdana, Geneva, sans-serif; --border-color: hsl(0, 0%, 25%); --border-color-focus: hsl(0, 0%, 35%); --border: solid 1px var(--border-color); --border-focus: solid 1px var(--border-color-focus); /* Scrollbars */ --scrollbar-color: hsl(0, 0%, 13%); --scrollbar-thumb-color: hsl(0, 0%, 17%); /* Controls */ --control-bg-color: hsl(0, 0%, 20%); --control-bg-color-hover: hsl(0, 0%, 25%); --control-text-color: hsl(0, 0%, 80%); --control-text-color-hover: hsl(0, 0%, 90%); --control-border: solid 1px hsl(0, 0%, 10%); --control-inner-border: solid 1px hsl(0, 0%, 35%); --control-inner-border-focus: solid 1px hsl(0, 0%, 50%); /* Inputs */ --input-bg-color: hsl(0, 0%, 12%); --input-bg-color-disabled: hsl(0, 0%, 15%); --input-text-color: hsl(0, 0%, 75%); --input-text-color-disabled: var(--text-color-disabled); --input-border: solid 1px hsl(0, 0%, 25%); --input-border-hover: solid 1px hsl(0, 0%, 30%); --input-border-focus: solid 1px hsl(0, 0%, 40%); --input-border-disabled: solid 1px hsl(0, 0%, 20%); --input-inner-border: solid 1px hsl(0, 0%, 5%); } * { scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-color); } ::-webkit-scrollbar { background-color: var(--scrollbar-color); } ::-webkit-scrollbar-track { background-color: var(--scrollbar-color); } ::-webkit-scrollbar-thumb { background-color: var(--scrollbar-thumb-color); } ::-webkit-scrollbar-corner { background-color: var(--scrollbar-color); } body { cursor: default; user-select: none; overflow: hidden; margin: 0; font-size: 13px; background-color: var(--bg-color); color: var(--text-color); font-family: var(--font-family); } h2 { font-size: 1.1em; margin: 0.5em 0; } #root *[hidden] { display: none; } .application_ApplicationView { position: fixed; top: 0; left: 0; } .application_NavigationView { box-sizing: border-box; display: flex; flex-direction: row; align-items: stretch; background-color: hsl(0, 0%, 10%); border-bottom: solid 2px var(--bg-color); } .application_NavigationView_spacer { flex: 1; } .application_NavigationView_server { display: flex; align-items: center; } .application_NavigationView_server > * { margin: 0 2px; } .application_NavigationView_time { display: flex; align-items: center; } .application_NavigationView_github { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 30px; font-size: 16px; color: var(--control-text-color); } .application_NavigationView_github:hover { color: var(--control-text-color-hover); } .application_NavigationButton input { display: none; } .application_NavigationButton label { box-sizing: border-box; display: inline-flex; flex-direction: row; align-items: center; font-size: 13px; height: 100%; padding: 0 20px; color: hsl(0, 0%, 65%); } .application_NavigationButton label:hover { color: hsl(0, 0%, 85%); background-color: hsl(0, 0%, 12%); } .application_NavigationButton input:checked + label { color: hsl(0, 0%, 85%); background-color: var(--bg-color); } .core_Label.disabled { color: var(--text-color-disabled); } .core_Select { position: relative; display: inline-flex; width: 160px; } .core_Select .core_Button { flex: 1; } .core_Select .core_Menu { top: 25px; left: 0; min-width: 100%; } .core_Button { display: inline-flex; flex-direction: row; align-items: stretch; align-content: stretch; box-sizing: border-box; height: 26px; padding: 0; border: var(--control-border); color: var(--control-text-color); outline: none; font-size: 13px; font-family: var(--font-family); overflow: hidden; } .core_Button .core_Button_inner { flex: 1; display: inline-flex; flex-direction: row; align-items: center; box-sizing: border-box; background-color: var(--control-bg-color); height: 24px; padding: 3px 5px; border: var(--control-inner-border); overflow: hidden; } .core_Button:hover .core_Button_inner { background-color: var(--control-bg-color-hover); border-color: hsl(0, 0%, 40%); color: var(--control-text-color-hover); } .core_Button:active .core_Button_inner { background-color: hsl(0, 0%, 20%); border-color: hsl(0, 0%, 30%); color: hsl(0, 0%, 75%); } .core_Button:focus-within .core_Button_inner { border: var(--control-inner-border-focus); } .core_Button:disabled .core_Button_inner { background-color: hsl(0, 0%, 15%); border-color: hsl(0, 0%, 25%); color: hsl(0, 0%, 55%); } .core_Button_inner > * { display: inline-block; margin: 0 3px; } .core_Button_center { flex: 1; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .core_Button_left, .core_Button_right { display: inline-flex; align-content: center; font-size: 11px; } .core_Menu { z-index: 1000; position: absolute; box-sizing: border-box; outline: none; border: var(--control-border); --scrollbar-color: hsl(0, 0%, 18%); --scrollbar-thumb-color: hsl(0, 0%, 22%); } .core_Menu > .core_Menu_inner { overflow: auto; background-color: var(--control-bg-color); max-height: 500px; border: var(--control-inner-border); } .core_Menu > .core_Menu_inner > * { padding: 4px 8px; white-space: nowrap; } .core_Menu > .core_Menu_inner > .core_Menu_hovered { background-color: var(--control-bg-color-hover); color: var(--control-text-color-hover); } .core_TabContainer_Bar { box-sizing: border-box; padding: 3px 3px 0 3px; border-bottom: var(--border); } .core_TabContainer_Tab { box-sizing: border-box; display: inline-flex; align-items: center; height: calc(100% + 1px); padding: 0 10px; border: var(--border); margin: 0 1px -1px 1px; background-color: hsl(0, 0%, 12%); color: hsl(0, 0%, 75%); font-size: 13px; } .core_TabContainer_Tab:hover { background-color: hsl(0, 0%, 18%); color: hsl(0, 0%, 85%); } .core_TabContainer_Tab.active { background-color: var(--bg-color); color: hsl(0, 0%, 90%); border-bottom-color: var(--bg-color); } .hunt_optimizer_WantedItemsView { display: flex; flex-direction: column; align-items: stretch; padding: 0 6px; min-width: 200px; } .hunt_optimizer_WantedItemsView .hunt_optimizer_WantedItemsView_table_wrapper { flex: 1; width: calc(100% + 6px); overflow: auto; margin: 4px -3px; } .hunt_optimizer_WantedItemsView .hunt_optimizer_WantedItemsView_table_wrapper table { width: 100%; border-collapse: collapse; } .hunt_optimizer_WantedItemsView .hunt_optimizer_WantedItemsView_table_wrapper td { padding: 1px 3px; } .hunt_optimizer_MethodsForEpisodeView_table { width: 100%; height: 100%; } .viewer_model_ModelView_container { display: flex; flex-direction: row; } .viewer_model_CharacterClassSelectionView { box-sizing: border-box; list-style: none; padding: 0; margin: 0; overflow: auto; } .viewer_model_CharacterClassSelectionView li { padding: 4px 8px; } .viewer_model_CharacterClassSelectionView li:hover { color: hsl(0, 0%, 90%); background-color: hsl(0, 0%, 18%); } .viewer_model_CharacterClassSelectionView li.active { color: hsl(0, 0%, 90%); background-color: hsl(0, 0%, 21%); } .hunt_optimizer_HelpView p { margin: 1em; max-width: 600px; } .core_Input { display: inline-block; box-sizing: border-box; height: 24px; border: var(--input-border); } .core_Input .core_Input_inner { box-sizing: border-box; width: 100%; height: 100%; padding: 0 3px; border: var(--input-inner-border); background-color: var(--input-bg-color); color: var(--input-text-color); outline: none; font-size: 13px; } .core_Input:hover { border: var(--input-border-hover); } .core_Input:focus-within { border: var(--input-border-focus); } .core_Input.disabled { border: var(--input-border-disabled); } .core_Input.disabled .core_Input_inner { color: var(--input-text-color-disabled); background-color: var(--input-bg-color-disabled); } .core_DurationInput input { text-align: center; } .core_NumberInput { width: 54px; } .core_NumberInput .core_NumberInput_inner { padding-right: 1px; } .core_TextArea { box-sizing: border-box; display: inline-block; border: var(--input-border); } .core_TextArea .core_TextArea_inner { box-sizing: border-box; vertical-align: top; padding: 3px; border: var(--input-inner-border); margin: 0; background-color: var(--input-bg-color); color: var(--input-text-color); outline: none; font-size: 13px; } .core_TextArea:hover { border: var(--input-border-hover); } .core_TextArea:focus-within { border: var(--input-border-focus); } .core_TextArea.disabled { border: var(--input-border-disabled); } .core_TextArea.disabled .core_TextArea_inner { color: var(--input-text-color-disabled); background-color: var(--input-bg-color-disabled); } .quest_editor_QuestInfoView { box-sizing: border-box; padding: 3px; overflow: auto; outline: none; } .quest_editor_QuestInfoView table { width: 100%; } .quest_editor_QuestInfoView th { text-align: left; } .quest_editor_QuestInfoView .core_TextInput { width: 100%; } .quest_editor_QuestInfoView .core_TextArea { width: 100%; } .quest_editor_QuestInfoView textarea { width: 100%; } .quest_editor_UnavailableView { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; text-align: center; } #root .lm_header { box-sizing: border-box; padding: 3px 0 0 0; border-bottom: var(--border); } #root .lm_tabs { padding: 0 3px; } #root .lm_tab { cursor: default; display: inline-flex; align-items: center; height: 23px; padding: 0 10px; border: var(--border); margin: 0 1px -1px 1px; background-color: hsl(0, 0%, 12%); color: hsl(0, 0%, 75%); font-size: 13px; } #root .lm_tab:hover { background-color: hsl(0, 0%, 18%); color: hsl(0, 0%, 85%); } #root .lm_tab.lm_active { background-color: var(--bg-color); color: hsl(0, 0%, 90%); border-bottom-color: var(--bg-color); } #root .lm_header .lm_controls > li { cursor: default; } #root .lm_header .lm_controls .lm_close { /* a white 9x9 X shape */ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAQUlEQVR4nHXOQQ4AMAgCQeT/f6aXpsGK3jSTuCVJAAr7iBdoAwCKd0nwfaAdHbYERw5b44+E8JoBjEYGMBq5gAYP3usUDu2IvoUAAAAASUVORK5CYII=); background-position: center center; background-repeat: no-repeat; cursor: pointer; opacity: 0.4; transition: opacity 300ms ease; } #root .lm_header .lm_controls .lm_close:hover { opacity: 1; } #root .lm_content { overflow: visible; } #root .lm_splitter { box-sizing: border-box; background-color: hsl(0, 0%, 20%); } #root .lm_splitter.lm_vertical { border-top: var(--border); border-bottom: var(--border); } #root .lm_splitter.lm_horizontal { border-left: var(--border); border-right: var(--border); } body .lm_dropTargetIndicator { box-sizing: border-box; background-color: hsla(0, 0%, 100%, 0.2); } .quest_editor_NpcCountsView { box-sizing: border-box; padding: 3px; overflow: auto; } .quest_editor_NpcCountsView table { user-select: text; width: 100%; max-width: 300px; margin: 0 auto; } .quest_editor_NpcCountsView th { cursor: text; text-align: left; } .quest_editor_NpcCountsView td { cursor: text; } .core_ToolBar { box-sizing: border-box; display: flex; flex-direction: row; align-items: center; border-bottom: var(--border); padding: 0 2px; } .core_ToolBar > * { margin: 2px 1px; } .core_ToolBar > .core_ToolBar_group { margin: 2px 3px; display: flex; flex-direction: row; align-items: center; } .core_ToolBar > .core_ToolBar_group > * { margin: 0 2px; } .core_ToolBar .core_Input { height: 26px; } :root { --red-circle-svg: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 4c.367 0 .721.048 1.063.145a3.943 3.943 0 0 1 1.762 1.031 3.944 3.944 0 0 1 1.03 1.762c.097.34.145.695.145 1.062 0 .367-.048.721-.145 1.063a3.94 3.94 0 0 1-1.03 1.765 4.017 4.017 0 0 1-1.762 1.031C8.72 11.953 8.367 12 8 12s-.721-.047-1.063-.14a4.056 4.056 0 0 1-1.765-1.032A4.055 4.055 0 0 1 4.14 9.062 3.992 3.992 0 0 1 4 8c0-.367.047-.721.14-1.063.097-.34.232-.658.407-.953A4.089 4.089 0 0 1 5.98 4.546a3.94 3.94 0 0 1 .957-.401A3.89 3.89 0 0 1 8 4z' fill='%23E51400'/%3E%3C/svg%3E") 50% no-repeat; } .monaco-editor .margin-view-overlays > div:after { cursor: pointer; content: ""; position: absolute; left: 0; /* width of parent - width of icon */ right: 50px; top: 0; bottom: 0; visibility: hidden; opacity: 0.5; background: var(--red-circle-svg); } .monaco-editor .margin-view-overlays > div:hover:after { visibility: visible; } .quest_editor_AsmEditorView_breakpoint-enabled { /* a red circle */ background: var(--red-circle-svg); } .quest_editor_AsmEditorView_execution-location { background: hsla(80, 100%, 60%, 0.3); } .quest_editor_EntityInfoView { outline: none; box-sizing: border-box; padding: 3px; overflow: auto; } .quest_editor_EntityInfoView table { table-layout: fixed; width: 100%; margin: 0 auto; } .quest_editor_EntityInfoView th { text-align: left; } .quest_editor_EntityInfoView th.quest_editor_EntityInfoView_coord { padding-left: 10px; } .quest_editor_EntityInfoView .core_NumberInput { width: 100%; } .quest_editor_EntityListView { outline: none; overflow: auto; } .quest_editor_EntityListView_entity_list { display: grid; grid-template-columns: repeat(auto-fill, 100px); grid-column-gap: 6px; grid-row-gap: 6px; justify-content: center; margin: 6px; } .quest_editor_EntityListView_entity { box-sizing: border-box; display: flex; flex-direction: column; text-align: center; } .quest_editor_EventsView { outline: none; display: flex; flex-direction: column; align-items: stretch; } .quest_editor_EventsView_container { display: flex; flex-direction: column; align-items: stretch; height: 100%; } .quest_editor_EventsView_sub_graph_container { flex: 1; box-sizing: border-box; overflow-y: auto; display: flex; flex-direction: row; flex-wrap: wrap; align-items: start; justify-content: center; padding: 4px; } .quest_editor_EventView { display: flex; flex-direction: column; align-items: center; padding: 4px 8px; border: var(--border); margin: 4px; background-color: hsl(0, 0%, 17%); outline: none; } .quest_editor_EventView:hover { border-color: hsl(0, 0%, 30%); background-color: hsl(0, 0%, 20%); color: hsl(0, 0%, 85%); } .quest_editor_EventView.selected { border-color: hsl(0, 0%, 35%); background-color: hsl(0, 0%, 25%); color: hsl(0, 0%, 90%); } .quest_editor_EventView > table { min-width: 170px; } .quest_editor_EventView th { text-align: left; } .quest_editor_EventView_actions { margin-left: 4px; } .core_DropDown { position: relative; } .core_DropDown .core_Menu { top: 25px; left: 0; min-width: 100%; } .quest_editor_EventSubGraphView { position: relative; display: flex; flex-direction: column; align-items: stretch; } .quest_editor_EventSubGraphView_edge_container { position: absolute; } .quest_editor_EventSubGraphView_edge { box-sizing: border-box; position: absolute; border-left: solid 2px var(--border-color); border-top: solid 2px var(--border-color); border-bottom: solid 2px var(--border-color); } .quest_editor_RegistersView { display: flex; flex-direction: column; } .quest_editor_RegistersView_container { overflow: auto; flex: 1; } .quest_editor_RegistersView_list { display: grid; grid-template-columns: repeat(auto-fill, 124px); justify-content: center; /* One pixel extra padding-top because .quest_editor_RegistersView_register has -1px margin-top. */ padding: 7px 6px 6px 6px; } .quest_editor_RegistersView_register { display: flex; align-items: baseline; margin-top: -1px; } .quest_editor_RegistersView_register > .core_Label { box-sizing: border-box; font-family: monospace; width: 40px; padding-right: 1px; text-align: right; } .quest_editor_RegistersView_register .quest_editor_RegistersView_value { width: 84px; } .quest_editor_RegistersView_register .quest_editor_RegistersView_value > .core_TextInput_inner { text-align: right; font-family: monospace; } .quest_editor_LogView { display: flex; flex-direction: column; outline: none; } .quest_editor_LogView_list_container { flex: 1; overflow: auto; background-color: #181818; user-select: text; } .quest_editor_LogView_message_list { font-family: monospace; margin: 2px 0; cursor: text; } .quest_editor_LogView_message { display: flex; padding: 0 2px; white-space: pre; } .quest_editor_LogView_message > * { padding: 0 2px; } .quest_editor_LogView_message > .quest_editor_LogView_message_timestamp { color: var(--text-color-disabled); } .quest_editor_LogView_message > .quest_editor_LogView_message_contents { overflow-wrap: anywhere; } .quest_editor_LogView .quest_editor_LogView_Error_message .quest_editor_LogView_message_level { color: hsl(0, 80%, 50%); } .quest_editor_LogView .quest_editor_LogView_Warning_message .quest_editor_LogView_message_level { color: hsl(30, 80%, 50%); } .core_ErrorWidget { box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 10%; text-align: center; } .core_Dialog { z-index: 20; display: flex; flex-direction: column; outline: none; position: fixed; background-color: var(--bg-color); border: var(--border); padding: 10px; box-shadow: black 0 0 10px -2px; } .core_Dialog:focus-within { border: var(--border-focus); } .core_Dialog h1 { font-size: 20px; margin: 0 0 10px 0; padding-bottom: 4px; border-bottom: var(--border); } .core_Dialog_description { user-select: text; cursor: text; } .core_Dialog_body { flex: 1; margin: 4px 0; } .core_Dialog_footer { display: flex; flex-direction: row; justify-content: flex-end; } .core_Dialog_footer > * { margin-left: 2px; } .core_Dialog_modal_overlay { outline: none; z-index: 10; position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: black; opacity: 50%; backdrop-filter: blur(5px); } .viewer_model_CharacterClassOptionsView { box-sizing: border-box; border-left: var(--border); border-right: var(--border); padding: 0 2px; } .viewer_model_CharacterClassOptionsView table { table-layout: fixed; width: 100%; } .viewer_model_CharacterClassOptionsView td:first-child { width: 80px; } .viewer_model_CharacterClassOptionsView_section_id { width: 100%; } .viewer_model_CharacterClassOptionsView_body { width: 60px; } .quest_editor_QuestEditorToolBarView_save_as_dialog_content { display: grid; grid-template-columns: 100px max-content; grid-column-gap: 4px; grid-row-gap: 4px; align-items: center; } .quest_editor_QuestEditorToolBarView_save_as_dialog_content .core_Input { margin: 1px; } .core_ComboBox { box-sizing: border-box; position: relative; } .core_ComboBox_inner { box-sizing: border-box; display: flex; align-items: center; } .core_ComboBox_inner input { flex: 1; padding: 0; border: none; margin: 0; color: var(--input-text-color); background-color: transparent; outline: none; } .core_ComboBox.disabled input { color: var(--input-text-color-disabled); } .core_ComboBox .core_Menu { top: 23px; left: -2px; min-width: calc(100% + 4px); } .core_ComboBox_button { padding: 0 2px; } .hunt_optimizer_OptimizerView { display: flex; align-items: stretch; overflow: hidden; } .hunt_optimizer_OptimizerView div:nth-child(2) { flex: 1; overflow: hidden; } .core_Table { position: relative; display: block; box-sizing: border-box; overflow: auto; background-color: var(--bg-color); border-collapse: collapse; } .core_Table tr { display: flex; align-items: stretch; } .core_Table thead { position: sticky; display: inline-block; top: 0; z-index: 2; } .core_Table thead tr { position: sticky; top: 0; } .core_Table thead th { display: flex; flex-direction: column; justify-content: center; overflow: hidden; } .core_Table th, .core_Table td { box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; padding: 3px 6px; border-right: var(--border); border-bottom: var(--border); background-color: var(--bg-color); } .core_Table tbody { user-select: text; cursor: text; } .core_Table tbody th, .core_Table tbody td { white-space: nowrap; } .core_Table tbody th, .core_Table tfoot th { text-align: left; } .core_Table th.fixed { position: sticky; text-align: left; } .core_Table th.input { padding: 0; overflow: visible; } .core_Table th.input .core_DurationInput { z-index: 0; height: 100%; width: 100%; border: none; } .core_Table th.input .core_DurationInput:hover, .core_Table th.input .core_DurationInput:focus-within { margin: -1px; height: calc(100% + 2px); width: calc(100% + 2px); } .core_Table th.input .core_DurationInput:hover { z-index: 4; border: var(--input-border-hover); } .core_Table th.input .core_DurationInput:focus-within { z-index: 6; border: var(--input-border-focus); } .hunt_optimizer_OptimizationResultView { display: flex; flex-direction: column; } .hunt_optimizer_OptimizationResultView_table { flex: 1; border-top: var(--border); border-left: var(--border); }