/******************************** CPU Window *********************************/

.tk.window.cpu .client {
    padding: 1px;
}

.tk.window.cpu .scr-dasm {
    border-right-width: 0;
    box-shadow        : 1px 0 0 var(--tk-control-shadow);
}

.tk.window.cpu .scr-system {
    border-width: 1px 1px 0 0;
    box-shadow  : -0.5px 0.5px 0 0.5px var(--tk-control-shadow);
}

.tk.window.cpu .scr-program {
    border-width: 0 1px 1px 0;
    box-shadow  : -0.5px -0.5px 0 0.5px var(--tk-control-shadow);
}

.tk.window.cpu .disassembler {
    background : var(--tk-window);
    color      : var(--tk-window-text);
}

.tk.window.cpu .disassembler div {
    cursor     : default;
    line-height: calc(1em + 2px);
    isolation  : isolate;
    user-select: none;
}

.tk.window.cpu .disassembler .address {
    margin-left: 2px;
}

.tk.window.cpu .disassembler .byte {
    margin-left: 0.5em;
    text-align : center;
}

.tk.window.cpu .disassembler .operands {
    margin-right: 2px;
}

.tk.window.cpu .disassembler .byte.b0,
.tk.window.cpu .disassembler .mnemonic,
.tk.window.cpu .disassembler .operands {
    margin-left: 1em;
}

.tk.window.cpu .disassembler .pc {
    background: var(--tk-selected-blur);
    left      : 1px;
    right     : 1px;
}
.tk.window.cpu .disassembler:focus-within .pc {
    background: var(--tk-selected);
}

.tk.window.cpu .disassembler .is-pc {
    color: var(--tk-selected-blur-text);
}
.tk.window.cpu .disassembler:focus-within .is-pc {
    color: var(--tk-selected-text);
}

.tk.window.cpu .registers {
    background: var(--tk-window);
    color     : var(--tk-window-text);
}

.tk.window.cpu .registers > * {
    padding: 0 1px;
}
.tk.window.cpu .registers > *:first-child {
    padding-top: 1px;
}
.tk.window.cpu .registers > *:last-child {
    padding-bottom: 1px;
}

.tk.window.cpu .registers .expand .box {
    border       : none;
    border-radius: 2px;
    margin       : 0 1px 0 0;
}
.tk.window.cpu .registers .expand .box:before {
    background: transparent;
    content   : "";
    display   : block;
    height    : 11px;
    width     : 11px;
}

.tk.window.cpu .registers .expand[role="checkbox"] .box:before {
    background  : currentcolor;
    mask        : /**/url("./expand.svg") center no-repeat;
    -webkit-mask: /**/url("./expand.svg") center no-repeat;
}
.tk.window.cpu .registers .expand[aria-checked="true"] .box:before {
    background  : currentcolor;
    mask        : /**/url("./collapse.svg") center no-repeat;
    -webkit-mask: /**/url("./collapse.svg") center no-repeat;
}
.tk.window.cpu .registers .expand:focus .box {
    background: var(--tk-control-active);
}
.tk.window.cpu .registers .main {
    column-gap: 0.5em;
}

.tk.window.cpu .registers .expansion {
    gap    : 1px 1em;
    padding: 2px 2px 2px 1.4em;
}

.tk.window.cpu .registers .main {
    column-gap: 0.5em;
}

.tk.window.cpu .registers .text-box {
    background: transparent;
    border    : none;
    padding   : 0 1px;
}

.tk.window.cpu .registers .text-box:focus {
    outline: 1px solid var(--tk-selected);
}

.tk.window.cpu .registers .text-dec {
    column-gap: 2px;
}

.tk.window.cpu .registers .text-dec .label {
    text-align: center;
    min-width : 13px;
}

.tk.window.cpu .registers *[aria-disabled="true"]:is(.label, .text-box) {
    color: var(--tk-control-shadow);
}



/******************************* Memory Window *******************************/

.tk.window.memory .client {
    gap    : 1px;
    padding: 1px;
}

.tk.window.memory .hex-editor {
    align-items: center;
    background : var(--tk-window);
    color      : var(--tk-window-text);
}

.tk.window.memory .hex-editor div {
    cursor     : default;
    line-height: calc(1em + 2px);
    user-select: none;
}

.tk.window.memory .hex-editor .addr {
    margin-left: 2px;
}

.tk.window.memory .hex-editor .byte {
    margin-left: 0.5em;
    text-align : center;
}

.tk.window.memory .hex-editor .b0,
.tk.window.memory .hex-editor .b8 {
    margin-left: 1em;
}

.tk.window.memory .hex-editor .b15 {
    margin-right: 2px;
}

.tk.window.memory .hex-editor .edit {
    background: var(--tk-selected-blur);
    color     : var(--tk-selected-blur-text);
    outline   : 1px solid var(--tk-selected-blur);
}
.tk.window.memory .hex-editor:focus-within .edit {
    background: var(--tk-selected);
    color     : var(--tk-selected-text);
    outline   : 1px solid var(--tk-selected);
}