/* Made from app.css by gen_phone_dk.py: the computer's styles for its pages shown on the phone (inside .dk). Don't edit. */
.dk button, .dk input, .dk select, .dk textarea {font: inherit; color: inherit;}
.dk :focus-visible {outline: 2px solid var(--focus); outline-offset: 2px;}
.dk h1, .dk h2, .dk h3 {font-family: var(--cond); font-weight: 600; letter-spacing: 0.005em; margin: 0;}
.dk h1 {font-size: 30px; line-height: 1.15;}
.dk h2 {font-size: 21px; line-height: 1.2;}
.dk h3 {font-size: 16px; line-height: 1.3;}
.dk p {margin: 0 0 10px;}
.dk a {color: var(--focus);}
.dk .num {font-family: var(--cond); font-variant-numeric: tabular-nums;}
.dk .muted {color: var(--ink-2);}
.dk .small {font-size: 13px;}
.dk .hidden, .dk [hidden] {display: none !important;}
.dk .bar {position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 20px; padding: 0 20px; height: 54px; background: var(--sheet); border-bottom: 1px solid var(--rule);}
.dk .brand {display: flex; align-items: center; gap: 10px; font-family: var(--cond); font-weight: 700; font-size: 19px; white-space: nowrap;}
.dk .brand img {width: 26px; height: 26px;}
.dk .brand .wm {font-family: "Outfit", var(--sans); font-size: 22px; letter-spacing: -0.4px; line-height: 1;}
.dk .brand .wm b {font-weight: 800;}
.dk .brand .wm span {font-weight: 500; color: #A87A00;}
.dk .brand .wm .tm {font-size: .42em; vertical-align: super; line-height: 0; margin-left: 2px; font-weight: 600; letter-spacing: 0;}
.dk .nav {display: flex; gap: 2px; overflow-x: auto;}
.dk .nav button {background: none; border: 0; padding: 8px 12px; border-radius: 6px; cursor: pointer; color: var(--ink-2); white-space: nowrap;}
.dk .nav button:hover {background: var(--sheet-2); color: var(--ink);}
.dk .nav button[aria-current="page"] {color: var(--ink); background: var(--sheet-2); box-shadow: inset 0 -2px 0 var(--marigold);}
.dk .bar .spacer {flex: 1;}
.dk .theme-btn {background: none; border: 1px solid var(--rule); border-radius: 6px; padding: 5px 9px; cursor: pointer; color: var(--ink-2);}
.dk main {max-width: 1480px; margin: 0 auto; padding: 24px 20px 60px;}
.dk .view {display: none;}
.dk .view.active {display: block;}
.dk .btn {display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--rule); background: var(--sheet); padding: 9px 15px; border-radius: 7px; cursor: pointer; font-weight: 500;}
.dk .btn:hover {border-color: var(--ink-3);}
.dk .btn.primary {background: var(--ink); color: var(--sheet); border-color: var(--ink);}
.dk .btn.primary:hover {filter: brightness(1.15);}
.dk .btn.primary:disabled {opacity: 0.4; cursor: not-allowed; filter: none;}
.dk .btn.small {padding: 5px 10px; font-size: 13px;}
.dk .btn.ghost {background: transparent;}
.dk .btn.danger {color: var(--bad);}
.dk label.field {display: grid; gap: 4px; font-size: 13px; color: var(--ink-2);}
.dk .field input, .dk .field select, .dk .field textarea {padding: 8px 10px; border-radius: 6px; border: 1px solid var(--rule); background: var(--sheet); color: var(--ink); font-size: 15px;}
.dk .field textarea {resize: vertical; min-height: 60px;}
.dk .start-head {display: flex; align-items: end; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 18px;}
.dk .start-head p {max-width: 62ch; margin: 6px 0 0; color: var(--ink-2);}
.dk .drops {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px;}
.dk .drop {position: relative; background: var(--glass); border: 2px dashed var(--rule); border-radius: 12px; min-height: 360px; display: grid; place-items: center; text-align: center; padding: 18px; cursor: pointer; transition: border-color .15s;}
.dk .drop:hover, .dk .drop.over {border-color: var(--measure);}
.dk .drop.filled {border-style: solid; background: var(--sheet); cursor: default; place-items: stretch;}
.dk .drop .empty-state {display: grid; gap: 10px; justify-items: center; color: var(--ink-2);}
.dk .drop .empty-state .face {font-family: var(--cond); font-size: 24px; font-weight: 600; color: var(--ink);}
.dk .drop .ghost-card {width: 92px; height: 128px; border-radius: 7px; border: 2px solid var(--ink-3); opacity: .45; position: relative;}
.dk .drop .ghost-card::after {content: ""; position: absolute; inset: 9px; border: 1px dashed var(--ink-3); border-radius: 3px;}
.dk .drop input[type=file] {display: none;}
.dk .loaded {display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: start; text-align: left;}
.dk .loaded .thumb {width: 190px; max-height: 300px; object-fit: contain; background: var(--sheet-2); border-radius: 6px; border: 1px solid var(--rule-2);}
.dk .loaded .meta {display: grid; gap: 6px; min-width: 0;}
.dk .loaded .fname {font-weight: 600; overflow-wrap: anywhere;}
.dk .facts {display: grid; gap: 3px; font-size: 13px; color: var(--ink-2);}
.dk .facts .ok {color: var(--good);}
.dk .facts .warn {color: var(--warn);}
.dk .pick {display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px;}
.dk .pick button {border: 2px solid var(--rule); border-radius: 6px; padding: 2px; background: var(--sheet); cursor: pointer; position: relative;}
.dk .pick button img {display: block; width: 46px; height: 64px; object-fit: cover; border-radius: 3px;}
.dk .pick button span {position: absolute; top: 2px; left: 2px; background: var(--ink); color: var(--sheet); font: 600 11px/1 var(--cond); padding: 2px 4px; border-radius: 3px;}
.dk .pick button[aria-pressed="true"] {border-color: var(--measure);}
.dk .start-foot {display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: end; margin-top: 18px;}
.dk .details {display: grid; grid-template-columns: 2fr 1.3fr 1fr; gap: 12px;}
.dk .privacy {margin-top: 14px; font-size: 13px; color: var(--ink-3);}
.dk .working {max-width: 520px; margin: 80px auto; text-align: center;}
.dk .progress {height: 8px; background: var(--rule-2); border-radius: 99px; overflow: hidden; margin: 18px 0 10px;}
.dk .progress > div {height: 100%; width: 0; background: var(--measure); transition: width .2s;}
.dk .result {display: grid; grid-template-columns: minmax(340px, 0.9fr) minmax(0, 1.25fr); gap: 20px; align-items: start;}
.dk .viewer-wrap {position: sticky; top: 74px; display: grid; gap: 10px;}
.dk .viewer-tools {display: flex; gap: 8px; flex-wrap: wrap; align-items: center;}
.dk .seg {display: inline-flex; border: 1px solid var(--rule); border-radius: 7px; overflow: hidden; background: var(--sheet);}
.dk .seg button {border: 0; background: none; padding: 6px 14px; cursor: pointer; color: var(--ink-2);}
.dk .seg button[aria-pressed="true"] {background: var(--ink); color: var(--sheet);}
.dk .toggles {display: flex; gap: 10px; flex-wrap: wrap; font-size: 13px; color: var(--ink-2);}
.dk .toggles label {display: inline-flex; gap: 5px; align-items: center; cursor: pointer;}
.dk .swatch {width: 10px; height: 10px; border-radius: 2px; display: inline-block;}
.dk .viewer {position: relative; height: calc(100vh - 190px); min-height: 460px; background: var(--glass); border-radius: 12px; overflow: hidden; border: 1px solid var(--rule-2); touch-action: none;}
.dk .viewer .stage {position: absolute; left: 0; top: 0; transform-origin: 0 0;}
.dk .viewer canvas, .dk .viewer svg {position: absolute; left: 0; top: 0;}
.dk .viewer svg {overflow: visible;}
.dk .viewer .zoom-ctl {position: absolute; right: 10px; bottom: 10px; display: grid; gap: 4px;}
.dk .viewer .zoom-ctl button {width: 32px; height: 32px; border-radius: 7px; border: 1px solid var(--rule); background: var(--sheet); cursor: pointer; font-size: 17px; line-height: 1;}
.dk .viewer .hint {position: absolute; left: 10px; bottom: 10px; right: 56px; font-size: 12px; color: var(--ink-2); background: color-mix(in srgb, var(--sheet) 85%, transparent); padding: 6px 9px; border-radius: 7px;}
.dk .viewer .scale {position: absolute; left: 10px; top: 10px; font: 500 12px var(--cond); color: var(--ink-2); background: color-mix(in srgb, var(--sheet) 85%, transparent); padding: 3px 7px; border-radius: 5px;}
.dk .label {background: var(--sheet); border-radius: 10px; overflow: hidden; box-shadow: var(--shadow); border: 1px solid var(--rule);}
.dk .label .band {background: var(--marigold); color: var(--marigold-ink); padding: 10px 16px; display: flex; justify-content: space-between; gap: 12px; align-items: baseline;}
.dk .label .band .cname {font: 700 19px/1.2 var(--cond); overflow-wrap: anywhere;}
.dk .label .band .cset {font: 500 14px var(--cond); opacity: .8; white-space: nowrap;}
.dk .label .grades {display: grid; grid-template-columns: 1.1fr 1.5fr 1fr;}
.dk .label .g {padding: 14px 16px 16px; border-right: 1px solid var(--rule-2); min-width: 0;}
.dk .label .g:last-child {border-right: 0;}
.dk .label .g .who {font: 600 14px var(--cond); color: var(--ink-2);}
.dk .label .g .big {font: 700 58px/1 var(--cond); font-variant-numeric: tabular-nums; margin: 6px 0 4px; letter-spacing: -0.01em;}
.dk .label .g .name {font: 600 15px var(--cond);}
.dk .label .g .range {font-size: 13px; color: var(--ink-2);}
.dk .subs {display: grid; grid-template-columns: auto 1fr auto; gap: 3px 8px; align-items: center; margin-top: 8px; font-size: 13px;}
.dk .subs .bar-mini {height: 6px; background: var(--rule-2); border-radius: 9px; overflow: hidden;}
.dk .subs .bar-mini > i {display: block; height: 100%; background: var(--ink-2); border-radius: 9px;}
.dk .subs .v {font: 600 14px var(--cond); font-variant-numeric: tabular-nums; text-align: right;}
.dk .label .foot {border-top: 1px solid var(--rule-2); padding: 8px 16px; font-size: 12px; color: var(--ink-3); display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap;}
.dk .quals {display: flex; gap: 6px; flex-wrap: wrap;}
.dk .qual {font: 600 12px var(--cond); border: 1px solid var(--rule); border-radius: 4px; padding: 1px 6px; color: var(--ink-2);}
.dk .panel {background: var(--sheet); border: 1px solid var(--rule-2); border-radius: 10px; padding: 16px;}
.dk .stack {display: grid; gap: 14px;}
.dk .holding h3 {margin-bottom: 8px;}
.dk .holding ol {margin: 0; padding-left: 20px; display: grid; gap: 6px;}
.dk .holding li .cap {font: 600 13px var(--cond); color: var(--ink-2); margin-left: 6px; white-space: nowrap;}
.dk .warns {display: grid; gap: 6px;}
.dk .warn-item {display: grid; grid-template-columns: 8px 1fr; gap: 10px; font-size: 14px; align-items: start;}
.dk .warn-item::before {content: ""; width: 8px; height: 8px; border-radius: 50%; margin-top: 7px; background: var(--warn);}
.dk .warn-item.high::before {background: var(--bad);}
.dk .warn-item.low::before {background: var(--ink-3);}
.dk .tabs {display: flex; gap: 2px; border-bottom: 1px solid var(--rule); overflow-x: auto;}
.dk .tabs button {border: 0; background: none; padding: 9px 14px; cursor: pointer; color: var(--ink-2); border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; font-weight: 500;}
.dk .tabs button[aria-selected="true"] {color: var(--ink); border-bottom-color: var(--ink);}
.dk .tabs .sc {font: 600 13px var(--cond); margin-left: 6px; color: var(--ink-3);}
.dk .tabpanel {padding-top: 16px;}
.dk .score {display: inline-block; min-width: 34px; text-align: center; font: 700 14px/1.6 var(--cond); border-radius: 5px; padding: 0 6px; background: var(--sheet-2); border: 1px solid var(--rule-2); font-variant-numeric: tabular-nums;}
.dk .score.s10 {color: var(--good);}
.dk .score.s9 {color: var(--good);}
.dk .score.s8 {color: var(--warn);}
.dk .score.s7, .dk .score.s6, .dk .score.s5, .dk .score.s4, .dk .score.s3, .dk .score.s2, .dk .score.s1 {color: var(--bad);}
.dk .score.na {color: var(--ink-3);}
.dk .face-row {display: grid; gap: 10px; margin-bottom: 18px;}
.dk .face-row > h3 {display: flex; align-items: baseline; gap: 10px;}
.dk .corner-grid {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px;}
.dk .ctile {background: var(--sheet-2); border-radius: 8px; padding: 8px; border: 1px solid var(--rule-2); cursor: pointer; text-align: left;}
.dk .ctile:hover {border-color: var(--measure);}
.dk .ctile canvas {width: 100%; height: auto; display: block; border-radius: 5px; background: #fff;}
.dk .ctile .ct {display: flex; justify-content: space-between; align-items: center; margin-top: 6px; font-weight: 500; font-size: 13px;}
.dk .ctile .cd {font-size: 12px; color: var(--ink-2); line-height: 1.4;}
.dk table.data {width: 100%; border-collapse: collapse; font-size: 14px;}
.dk table.data th {text-align: left; font: 600 13px var(--cond); color: var(--ink-2); padding: 6px 8px; border-bottom: 1px solid var(--rule);}
.dk table.data td {padding: 7px 8px; border-bottom: 1px solid var(--rule-2); vertical-align: top;}
.dk table.data td.n {font-family: var(--cond); font-variant-numeric: tabular-nums; white-space: nowrap;}
.dk table.data tr.click {cursor: pointer;}
.dk table.data tr.click:hover td {background: var(--sheet-2);}
.dk .ok-dot, .dk .bad-dot, .dk .na-dot {display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px;}
.dk .ok-dot {background: var(--good);}
.dk .bad-dot {background: var(--bad);}
.dk .na-dot {background: var(--ink-3);}
.dk .strip {width: 100%; height: 34px; display: block; border-radius: 4px; background: var(--sheet-2); cursor: crosshair;}
.dk .cen-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px;}
.dk .cen-card {background: var(--sheet-2); border-radius: 8px; padding: 12px 14px; border: 1px solid var(--rule-2);}
.dk .cen-card .ratios {display: flex; gap: 22px; margin: 6px 0 8px;}
.dk .cen-card .ratio .r {font: 700 34px/1 var(--cond); font-variant-numeric: tabular-nums;}
.dk .cen-card .ratio .k {font-size: 12px; color: var(--ink-2);}
.dk .diagram {width: 100%; max-width: 240px; height: auto; display: block; margin: 6px 0;}
.dk .passes {display: grid; gap: 3px; font-size: 13px;}
.dk .checklist {display: grid; gap: 12px;}
.dk .q {display: grid; gap: 6px;}
.dk .q .opts {display: flex; flex-wrap: wrap; gap: 6px;}
.dk .q .opts label {border: 1px solid var(--rule); border-radius: 6px; padding: 4px 10px; font-size: 13px; cursor: pointer; background: var(--sheet);}
.dk .q .opts input {position: absolute; opacity: 0; pointer-events: none;}
.dk .q .opts label:has(input:checked) {border-color: var(--ink); background: var(--ink); color: var(--sheet);}
.dk .q .opts label:has(input:focus-visible) {outline: 2px solid var(--focus); outline-offset: 2px;}
.dk .check-main {display: flex; gap: 8px; align-items: center; font-weight: 500;}
.dk .finds {display: grid; gap: 8px;}
.dk .find {display: grid; grid-template-columns: 64px 1fr auto; gap: 10px; align-items: center; padding: 6px; border-radius: 7px; cursor: pointer; border: 1px solid transparent;}
.dk .find:hover {border-color: var(--rule); background: var(--sheet-2);}
.dk .find canvas {width: 64px; height: 64px; border-radius: 5px; display: block;}
.dk .actions {display: flex; gap: 8px; flex-wrap: wrap;}
.dk .hist-head {display: flex; justify-content: space-between; align-items: end; gap: 12px; flex-wrap: wrap; margin-bottom: 16px;}
.dk .hist-list {display: grid; gap: 10px;}
.dk .hrow {display: grid; grid-template-columns: 56px 56px minmax(0, 1fr) repeat(3, 84px) auto; gap: 14px; align-items: center; background: var(--sheet); border: 1px solid var(--rule-2); border-radius: 10px; padding: 10px 14px;}
.dk .hrow img {width: 56px; height: 78px; object-fit: cover; border-radius: 4px; background: var(--sheet-2);}
.dk .hrow .hn {font-weight: 600; overflow-wrap: anywhere;}
.dk .hrow .hg {text-align: center;}
.dk .hrow .hg b {display: block; font: 700 26px/1 var(--cond);}
.dk .hrow .hg span {font-size: 12px; color: var(--ink-2);}
.dk .empty-hist {text-align: center; padding: 60px 20px; color: var(--ink-2); background: var(--sheet); border: 2px dashed var(--rule); border-radius: 12px;}
.dk .prose {max-width: 760px;}
.dk .prose h2 {margin: 26px 0 8px;}
.dk .prose ol, .dk .prose ul {padding-left: 22px;}
.dk .prose li {margin-bottom: 6px;}
.dk .prose .tip {background: var(--sheet); border-left: 4px solid var(--marigold); padding: 10px 14px; border-radius: 0 8px 8px 0; margin: 12px 0;}
.dk .toast {position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); background: var(--ink); color: var(--sheet); padding: 10px 16px; border-radius: 8px; font-size: 14px; z-index: 50; box-shadow: var(--shadow);}
@media (max-width: 1080px) {
.dk .result {grid-template-columns: 1fr;}
.dk .viewer-wrap {position: static;}
.dk .viewer {height: 70vh;}
}
@media (max-width: 760px) {
.dk main {padding: 16px;}
.dk .drops {grid-template-columns: 1fr;}
.dk .drop {min-height: 260px;}
.dk .details {grid-template-columns: 1fr;}
.dk .start-foot {grid-template-columns: 1fr;}
.dk .label .grades {grid-template-columns: 1fr;}
.dk .label .g {border-right: 0; border-bottom: 1px solid var(--rule-2);}
.dk .corner-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}
.dk .cen-grid {grid-template-columns: 1fr;}
.dk .hrow {grid-template-columns: 56px minmax(0, 1fr) 70px;}
.dk .hrow .back-thumb, .dk .hrow .hg.bgs, .dk .hrow .hg.cgc {display: none;}
.dk .loaded {grid-template-columns: 1fr;}
.dk .bar {gap: 10px;}
}
.dk #print-root {display: none;}
.dk .holding ol a {color: inherit; text-decoration: none; border-bottom: 1px dotted var(--ink-3);}
.dk .holding ol a:hover {color: var(--focus); border-bottom-color: var(--focus);}
.dk .start-foot .go {display: flex; gap: 8px; flex-wrap: wrap; justify-content: end;}
.dk .details {grid-template-columns: 1.6fr 1.2fr 1.4fr 0.9fr;}
.dk .start-warn {margin-top: 14px; padding: 10px 14px; border-radius: 8px; background: var(--sheet); border-left: 4px solid var(--bad); font-size: 14px;}
.dk .odds-mini {display: flex; gap: 10px; margin-top: 6px; font: 500 13px var(--cond); color: var(--ink-2); font-variant-numeric: tabular-nums;}
.dk .odds-mini b {color: var(--ink); font-weight: 700;}
.dk .odds-block, .dk .value-block {margin-bottom: 18px;}
.dk .odds-bars {display: grid; gap: 2px; margin-top: 8px; max-width: 520px;}
.dk .ob {display: grid; grid-template-columns: 86px 1fr 46px; gap: 10px; align-items: center; font-size: 13px;}
.dk .ob .k {color: var(--ink-2);}
.dk .ob .t {height: 10px; position: relative;}
.dk .ob .t i {display: block; height: 100%; min-width: 2px; background: var(--measure); border-radius: 0 4px 4px 0;}
.dk .ob .v {text-align: right; font: 600 13px var(--cond);}
.dk .vgrid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 8px 0 12px;}
.dk .money-in {position: relative; display: block;}
.dk .money-in i {position: absolute; left: 9px; top: 50%; transform: translateY(-50%); font-style: normal; color: var(--ink-3); pointer-events: none;}
.dk .money-in input {width: 100%; padding-left: 20px !important;}
.dk .verdict {border-radius: 8px; padding: 10px 14px; background: var(--sheet-2); border-left: 4px solid var(--ink-3);}
.dk .verdict b {font: 700 18px var(--cond);}
.dk .verdict ul {margin: 4px 0 0; padding-left: 18px; font-size: 14px;}
.dk .verdict.good {border-left-color: var(--good);}
.dk .verdict.warn {border-left-color: var(--warn);}
.dk .verdict.bad {border-left-color: var(--bad);}
.dk .vnums {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 10px;}
.dk .vnums div {background: var(--sheet-2); border-radius: 7px; padding: 8px 10px; display: grid; gap: 2px;}
.dk .vnums span {font-size: 12px; color: var(--ink-2);}
.dk .vnums b {font: 700 20px var(--cond);}
.dk .vnums b.pos {color: var(--good);}
.dk .vnums b.neg {color: var(--bad);}
.dk .photo-panel {margin-top: 14px;}
.dk .photo-res {display: grid; grid-template-columns: 150px 1fr; gap: 12px; margin-top: 12px; align-items: start;}
.dk .photo-res canvas {width: 150px; height: auto; border-radius: 6px; border: 1px solid var(--rule-2); background: #000;}
.dk .tpl-row {display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center; background: var(--sheet-2); border-radius: 8px; padding: 8px 12px; margin-bottom: 12px;}
.dk .tpl-row select {margin-left: 6px; padding: 4px 6px; border-radius: 6px; border: 1px solid var(--rule); background: var(--sheet);}
.dk .batch-wrap {overflow-x: auto; padding: 6px;}
.dk table.batch th button {background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer;}
.dk table.batch th button[aria-sort]::after {content: " ↓";}
.dk table.batch th button[aria-sort="ascending"]::after {content: " ↑";}
.dk table.batch td {vertical-align: middle;}
.dk table.batch img {width: 40px; height: 56px; object-fit: cover; border-radius: 3px; display: block;}
.dk table.batch input {width: 100%; min-width: 120px; padding: 5px 7px; border: 1px solid var(--rule); border-radius: 5px; background: var(--sheet); color: var(--ink);}
.dk table.batch .big {font: 700 22px var(--cond);}
.dk table.batch .issue {max-width: 300px; font-size: 13px; color: var(--ink-2);}
.dk .hrow {grid-template-columns: 22px 56px 56px minmax(0, 1fr) repeat(3, 76px) 96px auto;}
.dk .hrow .sel {width: 18px; height: 18px;}
.dk .hrow .real {text-align: center; font-size: 12px; color: var(--ink-2);}
.dk .hrow .real b {display: block; font: 700 22px/1 var(--cond); color: var(--ink);}
.dk .real-edit {display: flex; gap: 8px; align-items: end; flex-wrap: wrap; margin-top: 8px;}
.dk .real-edit select, .dk .real-edit input {padding: 5px 7px; border: 1px solid var(--rule); border-radius: 5px; background: var(--sheet); color: var(--ink); width: 90px;}
.dk .real-edit input[data-rcert] {width: 150px;}
.dk .share-ask {margin-bottom: 12px; border-left: 4px solid var(--marigold);}
.dk .stats {display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; margin-bottom: 14px;}
.dk .stat-tiles {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 10px 0;}
.dk .stat-tiles div {background: var(--sheet-2); border-radius: 7px; padding: 8px 10px;}
.dk .stat-tiles b {display: block; font: 700 24px/1.1 var(--cond);}
.dk .stat-tiles span {font-size: 12px; color: var(--ink-2);}
.dk table.cm {border-collapse: collapse; font: 500 12px var(--cond);}
.dk table.cm td, .dk table.cm th {width: 28px; height: 26px; text-align: center; border: 2px solid var(--sheet);}
.dk table.cm td {background: var(--sheet-2);}
.dk table.cm td.diag {outline: 1px solid var(--ink-3); outline-offset: -2px;}
.dk table.cm th {color: var(--ink-2); font-weight: 600;}
.dk .subp {margin-bottom: 14px;}
.dk .subp input {width: 100px; padding: 4px 6px; border: 1px solid var(--rule); border-radius: 5px; background: var(--sheet); color: var(--ink);}
.dk .subp tfoot td {font-weight: 600; border-top: 1px solid var(--rule);}
.dk .settings {max-width: 900px; display: grid; gap: 16px;}
.dk .settings .panel h2 {margin-bottom: 6px;}
.dk .settings table.data input[type=number] {width: 110px; padding: 5px 7px; border: 1px solid var(--rule); border-radius: 5px; background: var(--sheet); color: var(--ink);}
.dk .set-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 10px 0;}
.dk .toggle {display: flex; gap: 8px; align-items: center; font-size: 14px; margin: 6px 0;}
.dk .calib-out {margin-top: 10px;}
@media (max-width: 1080px) {
.dk .hrow {grid-template-columns: 22px 56px minmax(0, 1fr) 70px 90px auto;}
.dk .hrow .back-thumb, .dk .hrow .hg.bgs, .dk .hrow .hg.cgc {display: none;}
}
@media (max-width: 760px) {
.dk .vgrid, .dk .vnums, .dk .set-grid, .dk .stat-tiles {grid-template-columns: repeat(2, minmax(0, 1fr));}
.dk .details {grid-template-columns: 1fr;}
.dk .hrow {grid-template-columns: 22px 56px minmax(0, 1fr) 70px;}
.dk .hrow .real, .dk .hrow .actions {grid-column: 3 / -1;}
.dk .photo-res {grid-template-columns: 1fr;}
.dk .stats {grid-template-columns: 1fr;}
}
.dk .fake-field {display: grid; gap: 4px; font-size: 13px; color: var(--ink-2);}
.dk .photo-res canvas {cursor: zoom-in;}
.dk .photo-res.big {grid-template-columns: 1fr;}
.dk .photo-res.big canvas {width: 100%; max-width: 520px; cursor: zoom-out;}
.dk .price-find {background: var(--sheet-2); border-radius: 8px; padding: 10px 12px; margin: 8px 0 12px;}
.dk .pf-row {display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto; gap: 10px; align-items: end;}
.dk .pf-row input {width: 100%;}
.dk #pfOut {margin-top: 8px;}
.dk .pf-picks {display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px;}
.dk .pf-pick {display: grid; gap: 3px; justify-items: center; text-align: center; padding: 6px; border: 1px solid var(--rule); border-radius: 7px; background: var(--sheet); cursor: pointer; font-size: 12px;}
.dk .pf-pick:hover {border-color: var(--measure);}
.dk .pf-pick img, .dk .pf-pick .noimg {width: 80px; height: 112px; object-fit: contain; border-radius: 4px; background: var(--sheet-2); display: block;}
.dk .pf-pick .pn {font-weight: 600;}
.dk .pf-pick .ps {color: var(--ink-2);}
.dk .pf-done {display: grid; grid-template-columns: 72px 1fr; gap: 12px; align-items: start;}
.dk .pf-done > * {min-width: 0;}
.dk .pf-done .pf-img {margin: 0;}
.dk .pf-done img {width: 72px; border-radius: 4px; display: block;}
.dk .pf-done figcaption {font-size: 10px; line-height: 1.2; color: var(--ink-2); margin-top: 3px; text-align: center;}
.dk .pf-done .pf-noimg, .dk .pf-done .pf-img.pf-noimg {display: block; width: 72px; height: 100px; border-radius: 4px; background: var(--sheet-2);}
.dk .pf-done select {padding: 3px 6px; border: 1px solid var(--rule); border-radius: 5px; background: var(--sheet); color: var(--ink);}
.dk .pf-src, .dk .pf-notes {margin: 4px 0; padding-left: 18px;}
.dk .pf-notes {color: var(--warn);}
.dk .pf-links {margin: 8px 0 0;}
.dk .trend {font-weight: 700;}
.dk .trend.climbing {color: var(--good);}
.dk .trend.falling {color: var(--bad);}
@media (max-width: 760px) {
.dk .pf-row {grid-template-columns: 1fr;}
}
.dk .setup {max-width: 880px;}
.dk .setup-head {display: flex; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: 14px;}
.dk .setup-head p {margin: 6px 0 0;}
.dk .setup-meter {text-align: right;}
.dk .setup-meter b {display: block; font: 700 30px/1 var(--cond);}
.dk .setup-meter span {font-size: 12px; color: var(--ink-2);}
.dk .setup-steps {list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px;}
.dk .setup-step details {background: var(--sheet); border: 1px solid var(--rule-2); border-radius: 10px;}
.dk .setup-step.done details {opacity: .85;}
.dk .setup-step summary {display: grid; grid-template-columns: 30px 1fr auto; gap: 12px; align-items: center; padding: 12px 16px; cursor: pointer; list-style: none; font-weight: 600;}
.dk .setup-step summary::-webkit-details-marker {display: none;}
.dk .setup-step .sn {width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--sheet-2); border: 1px solid var(--rule); font-weight: 700;}
.dk .setup-step.done .sn {background: var(--good); border-color: var(--good); color: var(--sheet);}
.dk .setup-step .sbody {padding: 0 16px 14px 58px; font-size: 14px;}
.dk .setup-step .sbody ol, .dk .setup-step .sbody ul {padding-left: 20px; margin: 6px 0 10px;}
.dk .setup-step .sbody li {margin-bottom: 4px;}
.dk .pill {font: 600 12px var(--cond); border-radius: 99px; padding: 2px 9px; border: 1px solid var(--rule); color: var(--ink-2); white-space: nowrap;}
.dk .pill.done {color: var(--good); border-color: var(--good);}
.dk .pill.todo {color: var(--warn); border-color: var(--warn);}
.dk .share ul {padding-left: 20px;}
.dk .share li {margin-bottom: 6px;}
.dk .setup-banner {display: flex; justify-content: space-between; align-items: center; gap: 12px; background: var(--sheet); border: 1px solid var(--rule-2); border-left: 4px solid var(--marigold); border-radius: 8px; padding: 8px 12px; margin-bottom: 14px; font-size: 14px;}
.dk .panel.flash {box-shadow: 0 0 0 3px var(--marigold); transition: box-shadow .3s;}
@media (max-width: 760px) {
.dk .setup-step .sbody {padding-left: 16px;}
.dk .setup-head {flex-wrap: wrap;}
}
.dk .onewin {position: fixed; inset: 0; z-index: 200; background: rgba(15, 20, 28, 0.55); display: grid; place-items: center; padding: 16px;}
.dk .onewin-box {background: var(--sheet); color: var(--ink); border: 1px solid var(--rule); border-radius: 10px; box-shadow: var(--shadow); max-width: 460px; padding: 22px 24px;}
.dk .onewin-box h2 {margin: 0 0 8px; font-size: 1.15rem;}
.dk .onewin-box p {margin: 0 0 16px; color: var(--ink-2);}
.dk .onewin-act {display: flex; gap: 10px; flex-wrap: wrap;}
.dk .folder-row {display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin: 14px 0 0; padding: 12px 14px; border: 1px dashed var(--rule); border-radius: 8px; background: var(--sheet);}
.dk .folder-row > div {flex: 1 1 420px; color: var(--ink-2);}
.dk .batch-folder {margin-top: 6px; color: var(--ink-2); max-width: 760px;}
.dk .batch-folder ul {margin: 4px 0 0; padding-left: 18px; color: var(--warn);}
.dk .fname-sm {max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px;}
.dk .update-bar {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 16px; background: var(--sheet); border: 1px solid var(--rule-2); border-left: 4px solid var(--good, #2f8f5b); border-radius: 8px; padding: 10px 14px; margin: 0 0 14px; font-size: 14px;}
.dk .update-bar[hidden] {display: none;}
.dk .update-bar.ub-float {position: fixed; right: 18px; bottom: 18px; z-index: 60; width: min(460px, calc(100vw - 36px)); margin: 0; box-shadow: 0 12px 34px -10px rgba(0, 0, 0, .45);}
.dk .update-bar .ub-text {flex: 1 1 320px; min-width: 0;}
.dk .update-bar .ub-notes {margin: 4px 0 0; padding-left: 18px; color: var(--ink-2, inherit); font-size: 13px;}
.dk .update-bar .ub-act {display: flex; gap: 8px; flex-wrap: wrap;}
.dk .upd-status {margin: 6px 0 0;}
.dk .buy-block {margin-top: 18px;}
.dk .bgs-block {margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--rule);}
.dk .bgs-block .vgrid {margin-top: 10px;}
.dk .deal-conds {display: grid; gap: 6px;}
.dk #view-deal .panel {margin-bottom: 14px;}
.dk .folder-btns {display: flex; gap: 8px; flex-wrap: wrap;}
.dk .watch-bar {display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; background: var(--sheet); border: 1px solid var(--rule-2); border-left: 4px solid var(--good); border-radius: 8px; padding: 10px 14px; margin: 0 0 14px;}
.dk .watch-bar .wb-text {flex: 1 1 300px; min-width: 0; overflow-wrap: anywhere;}
.dk .watch-bar .wb-act {display: flex; gap: 8px;}
.dk .watch-bar .dot {width: 10px; height: 10px; border-radius: 50%; background: var(--ink-3); flex: none;}
.dk .watch-bar .dot.on {background: var(--good); animation: wpulse 1.6s ease-in-out infinite;}
@keyframes wpulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
@media (prefers-reduced-motion: reduce) {
.dk .watch-bar .dot.on {animation: none;}
}
.dk .label .cident {font-size: 12px; opacity: 0.85; margin-top: 2px;}
.dk .rnotes:empty {display: none;}
.dk .rnote {margin-top: 4px; padding: 3px 8px; border-radius: 6px; background: var(--sheet-2); border-left: 3px solid var(--ink-3);}
.dk .rnote.ok {border-left-color: var(--good);}
.dk .rnote.warn {border-left-color: var(--warn);}
.dk .rnote a {font-weight: 600;}
.dk tr.merged td {opacity: .72;}
.dk tr.merged td .rnotes, .dk tr.merged td .rnote {opacity: 1;}
.dk .watch-bar .again-note {margin-top: 4px; padding: 4px 8px; border-radius: 6px; background: var(--sheet-2); border-left: 3px solid var(--warn);}
.dk .sr {position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;}
.dk .coll-tiles b.pos {color: var(--good);}
.dk .coll-tiles b.neg {color: var(--bad);}
.dk .coll-bar {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; margin: 4px 0 10px;}
.dk .coll-bar .seg button .muted {font-weight: 400;}
.dk table.coll img {width: 44px; height: 61px; object-fit: cover; border-radius: 3px; background: var(--sheet-2); display: block;}
.dk table.coll td {vertical-align: middle;}
.dk table.coll td:nth-child(3) {min-width: 160px;}
.dk table.coll td:last-child {min-width: 220px;}
.dk .act {display: inline-block; font: 700 14px/1.2 var(--cond); padding: 2px 8px; border-radius: 999px; border: 1px solid var(--rule);}
.dk .act-sell {color: var(--bad); border-color: var(--bad);}
.dk .act-keep {color: var(--good); border-color: var(--good);}
.dk .act-send {color: var(--measure); border-color: var(--measure);}
.dk .act-prices {color: var(--ink-2);}
.dk .act-atpsa {color: var(--warn); border-color: var(--warn);}
.dk .cg-edit {display: flex; gap: 4px; justify-content: flex-end; margin-top: 4px;}
.dk .cg-edit input {width: 64px;}
.dk .at-psa input[type=number] {width: 72px;}
.dk .subp tr.grp td {background: var(--sheet-2); font-size: 13px;}
.dk .subp td .pos, .dk .data .pos {color: var(--good);}
.dk .subp td .neg, .dk .data .neg {color: var(--bad);}
.dk .sub-empty {display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 14px;}
@media (max-width: 760px) {
.dk table.coll td:last-child {min-width: 0;}
}
.dk .seg button[aria-pressed="true"] .muted {color: inherit; opacity: .75;}
.dk .watch-bar .wb-cloud {flex: 1 1 100%; padding: 6px 8px; border-radius: 6px; background: var(--sheet-2); border-left: 3px solid var(--warn); display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center;}
.dk .scan-test {margin-top: 10px; display: grid; gap: 6px;}
.dk .scan-test .st-head {padding: 8px 12px; border-radius: 8px; background: var(--sheet-2); border-left: 4px solid var(--good);}
.dk .scan-test .st-head.bad {border-left-color: var(--bad);}
.dk .scan-test .st-item {display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 8px; align-items: start; padding: 8px 10px; border-radius: 8px; background: var(--sheet-2);}
.dk .scan-test .st-i {width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font: 700 12px/1 var(--sans, system-ui); color: var(--sheet); background: var(--ink-3);}
.dk .scan-test .st-item.bad .st-i {background: var(--bad);}
.dk .scan-test .st-item.warn .st-i {background: var(--warn);}
.dk .scan-test .st-item.tip .st-i {background: var(--measure);}
.dk .scan-test .st-good {display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 4px 2px; color: var(--ink-2);}
.dk .scan-test .st-ok {color: var(--good); font-weight: 700;}
.dk .watch-bar .wb-help {flex: 1 1 100%; padding: 8px 10px; border-radius: 6px; background: var(--sheet-2); border-left: 3px solid var(--measure);}
.dk .watch-bar .wb-help.bad {border-left-color: var(--bad);}
.dk .watch-bar .wb-help ul {margin: 4px 0 6px; padding-left: 18px;}
.dk .watch-bar .wb-help .wb-prob {margin: 4px 0;}
.dk .watch-bar .wb-help .btn {margin-top: 4px;}
.dk .tour-back {position: fixed; inset: 0; z-index: 90; background: transparent;}
.dk .tour-back.dim {background: rgba(10, 14, 20, .55);}
.dk .tour-hole {position: fixed; z-index: 91; border-radius: 10px; box-shadow: 0 0 0 9999px rgba(10, 14, 20, .55); outline: 2px solid var(--marigold); outline-offset: 0; pointer-events: none; transition: left .25s ease, top .25s ease, width .25s ease, height .25s ease;}
.dk .tour-card {position: fixed; z-index: 92; width: min(390px, calc(100vw - 24px)); background: var(--sheet); color: var(--ink); border: 1px solid var(--rule); border-top: 4px solid var(--marigold); border-radius: 10px; box-shadow: 0 14px 44px -14px rgba(0, 0, 0, .55); padding: 12px 16px 12px;}
.dk .tour-card h2 {font: 600 21px var(--cond); margin: 2px 0 6px;}
.dk .tour-card p {margin: 0 0 12px; font-size: 14px; line-height: 1.45;}
.dk .tour-btns {display: flex; gap: 8px; align-items: center;}
.dk .tour-btns .spacer {flex: 1;}
.dk .tour-banner .tb-act {display: flex; gap: 8px; flex-shrink: 0;}
@media (prefers-reduced-motion: reduce) {
.dk .tour-hole {transition: none;}
}
.dk .act-sold {color: var(--ink-2); border-color: var(--ink-3);}
.dk table.coll td .pos, .dk #collProfit .pos {color: var(--good);}
.dk table.coll td .neg, .dk #collProfit .neg {color: var(--bad);}
.dk table.coll tr.money-row td {background: var(--sheet-2);}
.dk .money-edit {display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) auto; gap: 10px; align-items: start;}
.dk .money-edit .field .small {display: block; margin-top: 3px; min-height: 1.2em;}
.dk .money-edit .actions {margin: 21px 0 0; flex-wrap: nowrap;}
.dk .profit-best {display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin-top: 6px;}
.dk .profit-best h3 {margin: 6px 0 4px;}
@media (max-width: 1100px) {
.dk .money-edit {grid-template-columns: repeat(3, minmax(0, 1fr));}
}
.dk .lic-pill {border-color: var(--marigold); color: var(--ink); font-weight: 600; margin-right: 6px;}
.dk .lic-pill.ended {background: var(--marigold); color: var(--marigold-ink);}
.dk .lic-box {max-width: 520px; width: 100%;}
.dk .lic-buy {display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 16px;}
.dk .lic-field {display: flex; flex-direction: column; gap: 6px; margin: 0 0 6px; font-size: 14px; color: var(--ink-2);}
.dk .lic-field input {font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 14px; letter-spacing: 0.02em; width: 100%; box-sizing: border-box;}
.dk .lic-msg {min-height: 1.3em; margin: 0 0 10px; color: var(--ink-2);}
.dk .lic-bad, .dk .lic-msg.lic-bad {color: var(--bad);}
.dk .lic-box p.lic-lost {margin: 0 0 16px;}
.dk .lic-note {display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 8px; padding: 8px 12px; border: 1px solid var(--marigold); border-radius: 8px; background: var(--sheet); color: var(--ink);}
.dk #set-license .row-btns {display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px;}
.dk #set-license #licSetMsg {margin-top: 8px; min-height: 1.2em; color: var(--ink-2);}
.dk .slab-lead {max-width: 820px; color: var(--ink-2);}
.dk .slab-drops {margin-top: 14px;}
.dk .slab-drop {min-height: 300px;}
.dk .slab-drop .slab-ghost {width: 74px; height: 128px;}
.dk .slab-face {display: grid; gap: 8px; justify-items: center; align-content: start; padding: 4px;}
.dk .slab-face img {max-width: 100%; max-height: 420px; border-radius: 6px;}
.dk .slab-bad {color: var(--bad); max-width: 360px;}
.dk .slab-sum {margin-top: 18px;}
.dk .slab-grades {display: flex; gap: 28px; flex-wrap: wrap; margin: 6px 0 10px;}
.dk .slab-grades > div {display: grid; gap: 2px;}
.dk .slab-grades b {font-family: var(--cond); font-size: 34px; line-height: 1.05;}
.dk .slab-list {margin: 0 0 8px; padding-left: 18px;}
.dk .slab-warn {color: var(--warn);}
.dk .slab-tip {max-width: 820px; margin-top: 14px;}
.dk .slab-row {margin-top: 10px;}
.dk .slab-save {margin-top: 14px;}
.dk .slab-form {display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1fr) auto; gap: 10px 12px; align-items: end; margin-top: 10px;}
.dk .slab-form .btn {white-space: nowrap;}
.dk .slab-save-msg {margin: 10px 0 0; min-height: 1.2em;}
.dk .slab-save-msg.bad, .dk .slab-save-msg .bad {color: var(--bad);}
@media (max-width: 900px) {
.dk .slab-form {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);}
.dk .slab-form .btn {justify-self: start;}
}
.dk .batch-saved {color: var(--good); font-weight: 600; margin-left: 4px;}
.dk .del-bar {display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--bad); border-radius: 10px; background: color-mix(in srgb, var(--bad) 8%, var(--sheet));}
.dk .del-bar .actions {display: flex; gap: 8px; flex-wrap: wrap;}
.dk .hrow .sel.del {accent-color: var(--bad);}
.dk .show-bar {display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; background: var(--sheet); border: 1px solid var(--rule-2); border-left: 4px solid var(--marigold, #F3B90C); border-radius: 8px; padding: 9px 14px; margin: 0 0 14px; font-size: 14px;}
.dk .show-bar[hidden] {display: none;}
.dk .show-bar .spacer {flex: 1 1 auto;}
.dk .sh-head h1 {margin-bottom: 4px;}
.dk .sh-head p {max-width: 760px;}
.dk .sh-who {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px;}
.dk .sh-tally {font-size: 16px;}
.dk .sh-tally b {font: 700 22px var(--cond);}
.dk .sh-cards {display: grid; gap: 6px;}
.dk .sh-card {display: grid; grid-template-columns: 22px 40px minmax(0, 1fr) auto auto auto auto; gap: 10px; align-items: center; padding: 6px 8px; border: 1px solid var(--rule); border-radius: 8px; background: var(--sheet);}
.dk .sh-card .n {color: var(--ink-2); font-size: 13px; text-align: right;}
.dk .sh-card img, .dk .sh-card .noimg {width: 40px; height: 56px; object-fit: contain; border-radius: 4px; background: var(--sheet-2); display: block;}
.dk .sh-card .nm {display: grid; min-width: 0;}
.dk .sh-card .nm b {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.dk .sh-card .g {font-size: 12px; color: var(--ink-2); text-align: center;}
.dk .sh-card .g b {display: block; font: 700 18px var(--cond); color: var(--ink);}
@media (max-width: 760px) {
.dk .sh-card {grid-template-columns: 40px minmax(0, 1fr) auto;}
.dk .sh-card .n, .dk .sh-card .g:nth-of-type(n+2) {display: none;}
}
.dk .nav button {position: relative;}
.dk .nav-badge {display: inline-block; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 5px; border-radius: 9px; background: var(--bad); color: #fff; font: 700 11px/18px var(--sans); text-align: center; vertical-align: 1px;}
.dk .new-pill {display: inline-block; padding: 1px 7px; border-radius: 9px; background: var(--marigold); color: var(--marigold-ink); font: 700 11px/16px var(--sans); vertical-align: 2px;}
.dk .watch-head, .dk .vchart-head {display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap;}
.dk .watch-head h2, .dk .vchart-head h2 {margin: 0 0 4px;}
.dk .watch-list td {vertical-align: top;}
.dk .watch-list tr.is-new td {background: var(--sheet-2);}
.dk .watch-up {display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; border-style: dashed;}
.dk .watch-tog {color: var(--ink-2);}
.dk .watch-tog::before {content: "●"; color: var(--measure); margin-right: 4px; font-size: 9px; vertical-align: 1px;}
.dk .watch-tog.off::before {content: "○"; color: var(--ink-3);}
.dk .vchart-sum {color: var(--ink-2);}
.dk .vchart-sum .vnow {color: var(--ink); font: 700 18px/1 var(--cond);}
.dk .vchart-sum .pos {color: var(--good);}
.dk .vchart-sum .neg {color: var(--bad);}
.dk .vchart-wrap {position: relative; margin-top: 6px;}
.dk .vchart svg {display: block; width: 100%; height: auto; max-height: 260px; touch-action: none;}
.dk .vchart .vgrid {stroke: var(--rule-2); stroke-width: 1;}
.dk .vchart .vax {fill: var(--ink-3); font: 11px var(--sans);}
.dk .vchart .vline {fill: none; stroke: var(--measure); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round;}
.dk .vchart .varea {fill: var(--measure); opacity: 0.12;}
.dk .vchart .vend, .dk .vchart .vdot {fill: var(--measure); stroke: var(--sheet); stroke-width: 2;}
.dk .vchart .vcursor {stroke: var(--ink-3); stroke-width: 1; stroke-dasharray: 3 3;}
.dk .vchart .vhit {fill: transparent; cursor: crosshair;}
.dk .vtip {position: absolute; pointer-events: none; background: var(--ink); color: var(--sheet); border-radius: 6px; padding: 5px 9px; font-size: 12px; white-space: nowrap; box-shadow: var(--shadow);}
.dk .vtip b {display: block; font: 700 15px/1.2 var(--cond);}
.dk .vtip span {opacity: 0.8;}
.dk .subco {display: inline-flex; align-items: center; gap: 6px; margin-right: 4px;}
.dk .subco select {padding: 4px 6px;}
.dk .cg-edit select {max-width: 120px; padding: 2px 4px;}
.dk .at-psa td select {padding: 3px 6px;}
.dk .cert-check a {white-space: nowrap;}
.dk .cert-check .ok-tick {color: var(--good, #1a7f37);}
.dk .surface-first {display: grid; gap: 12px; border-left: 4px solid var(--mark);}
.dk .surface-first h2 {margin: 0;}
.dk .scans-gone {border-left: 4px solid var(--warn); background: var(--sheet-2); padding: 8px 10px; border-radius: 6px; margin: 2px 0 8px;}
.dk .scans-gone .btn {margin: 0 2px;}
.dk .acct-tabs {display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 0 0 14px; border: 1px solid var(--rule); border-radius: 8px; overflow: hidden;}
.dk .acct-tabs button {background: var(--sheet-2); border: 0; padding: 9px 10px; font: inherit; font-size: 14px; color: var(--ink-2); cursor: pointer;}
.dk .acct-tabs button.on {background: var(--sheet); color: var(--ink); font-weight: 600; box-shadow: inset 0 -3px 0 var(--marigold);}
.dk .acct-field input {font-family: inherit; letter-spacing: 0;}
.dk .acct-panel {border-top: 1px solid var(--rule-2); margin-top: 14px; padding-top: 10px;}
.dk .acct-panel h3 {margin: 0 0 6px;}
.dk .acct-devs {margin: 4px 0 10px;}
.dk .acct-dev {display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--rule-2);}
.dk .acct-dev:last-child {border-bottom: 0;}
.dk .acct-pw {margin: 8px 0; max-width: 360px;}
.dk .hist-search {display: flex; align-items: center; gap: 12px; margin: 0 0 12px;}
.dk .hist-search[hidden] {display: none;}
.dk .hist-search input, .dk .coll-search {flex: 1 1 260px; max-width: 420px; font: inherit; padding: 8px 12px; border: 1px solid var(--rule-2, #c9d1dc); border-radius: 8px; background: var(--sheet); color: inherit;}
.dk .coll-bar .coll-search {flex: 1 1 200px; min-width: 160px;}
.dk .phone-pics {display: flex; gap: 12px; flex-wrap: wrap; margin: 6px 0 10px;}
.dk .phone-pics figure {margin: 0; text-align: center;}
.dk .phone-pics img {width: 220px; max-width: 42vw; height: auto; border-radius: 8px; border: 1px solid var(--rule); display: block;}
.dk .phone-pics figcaption {font-size: 12px; margin-top: 3px;}
.dk .share-pop {position: fixed; inset: 0; background: rgba(10, 14, 20, .5); display: grid; place-items: center; z-index: 90; padding: 16px;}
.dk .share-pop .sp-box {background: var(--sheet); color: var(--ink); border-radius: 12px; padding: 18px 20px; width: min(540px, 100%); box-shadow: 0 12px 40px rgba(0,0,0,.35);}
.dk .share-pop h3 {margin: 0 0 6px;}
.dk .share-pop .sp-url {width: 100%; font: inherit; font-size: 14px; padding: 8px 10px; border: 1px solid var(--rule); border-radius: 8px; background: var(--sheet-2); color: var(--ink); margin: 8px 0 12px;}
.dk .share-pop .row-btns {display: flex; gap: 8px; flex-wrap: wrap;}
.dk .scan-pic {display: block; height: auto;}
.dk .scan-pic .lid-w {fill: var(--lid-white);}
.dk .scan-pic .sp-rim {stroke: var(--rule);}
.dk .bg-help {background: var(--sheet); border: 1px solid var(--rule-2); border-radius: 10px; margin: 0 0 14px;}
.dk .bg-help > summary {list-style: none; cursor: pointer; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; padding: 10px 42px 10px 14px; position: relative; border-radius: 10px;}
.dk .bg-help > summary::-webkit-details-marker {display: none;}
.dk .bg-help > summary::after {content: ""; position: absolute; right: 18px; top: 50%; width: 8px; height: 8px; border-right: 2px solid var(--ink-2); border-bottom: 2px solid var(--ink-2); transform: translateY(-75%) rotate(45deg); transition: transform .15s;}
.dk .bg-help[open] > summary::after {transform: translateY(-25%) rotate(-135deg);}
.dk .bg-help > summary:hover .bh-t {color: var(--focus);}
.dk .bh-t {font: 600 17px/1.25 var(--cond);}
.dk .bh-sub {font-size: 13px; color: var(--ink-2);}
.dk .bg-tiles {list-style: none; margin: 0; padding: 0 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px;}
.dk .bg-tile {display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px; border-radius: 8px; background: var(--sheet-2);}
.dk .bg-tile .scan-pic {width: 104px;}
.dk .bt-text {display: grid; gap: 3px; min-width: 0;}
.dk .bt-edge {font-weight: 600; font-size: 14px; line-height: 1.3;}
.dk .bt-use {display: inline-flex; align-items: center; gap: 7px; font: 700 18px/1.2 var(--cond);}
.dk .bt-use .sw {width: 14px; height: 14px; border-radius: 4px; border: 1px solid var(--rule); flex: none;}
.dk .sw.black {background: var(--lid-black);}
.dk .sw.white {background: var(--lid-white);}
.dk .sw.both {background: linear-gradient(90deg, var(--lid-black) 50%, var(--lid-white) 50%);}
.dk .bt-how {font-size: 13px; line-height: 1.35; color: var(--ink-2);}
.dk .bh-foot {margin: 10px 14px 12px; font-size: 14px; color: var(--ink-2);}
@media (max-width: 1000px) {
.dk .bg-tile {grid-template-columns: minmax(0, 1fr); align-items: start; align-content: start;}
.dk .bg-tile .scan-pic {width: 100%; max-width: 132px;}
}
@media (max-width: 760px) {
.dk .bg-tiles {grid-template-columns: minmax(0, 1fr);}
.dk .bg-tile {grid-template-columns: 84px minmax(0, 1fr); align-items: center;}
.dk .bg-tile .scan-pic {width: 84px;}
}
.dk .setup-banner.again-start {border-left-color: var(--measure);}
.dk .blend-banner {display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 14px; align-items: center; padding: 14px 16px; border-radius: 10px; background: color-mix(in srgb, var(--measure) 8%, var(--sheet)); border: 1px solid color-mix(in srgb, var(--measure) 35%, var(--rule-2)); border-left: 5px solid var(--measure);}
.dk .blend-banner.nopic {grid-template-columns: minmax(0, 1fr);}
.dk .blend-banner .bb-pic {width: 92px;}
.dk .blend-banner .bb-what {margin: 0 0 4px; font-size: 16px; font-weight: 600; line-height: 1.35;}
.dk .blend-banner .bb-how {margin: 0; font-size: 14.5px; line-height: 1.45;}
.dk .blend-banner .bb-act {margin-top: 10px;}
@media (max-width: 520px) {
.dk .blend-banner {grid-template-columns: 60px minmax(0, 1fr); gap: 10px; padding: 12px;}
.dk .blend-banner .bb-pic {width: 60px;}
}