|
|
|
@@ -2364,9 +2364,40 @@ textarea:focus-visible {
|
|
|
|
|
background: color-mix(in srgb, var(--primary-color) 18%, var(--card-bg));
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Spatial corner indicator: a mini "screen" frame with the matching
|
|
|
|
|
corner lit, so the user maps the physical lit LED to a button at a glance. */
|
|
|
|
|
.autocal-corner-glyph {
|
|
|
|
|
font-size: 1.4rem;
|
|
|
|
|
line-height: 1;
|
|
|
|
|
position: relative;
|
|
|
|
|
width: 46px;
|
|
|
|
|
height: 30px;
|
|
|
|
|
border: 1.5px solid var(--border-color);
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
background: color-mix(in srgb, var(--primary-color) 4%, var(--card-bg));
|
|
|
|
|
transition: border-color 0.15s, background 0.15s;
|
|
|
|
|
}
|
|
|
|
|
.autocal-corner-glyph::after {
|
|
|
|
|
content: '';
|
|
|
|
|
position: absolute;
|
|
|
|
|
width: 9px;
|
|
|
|
|
height: 9px;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
background: var(--border-color);
|
|
|
|
|
transition: background 0.15s, box-shadow 0.15s;
|
|
|
|
|
}
|
|
|
|
|
.autocal-corner-btn--top-left .autocal-corner-glyph::after { top: 4px; left: 4px; }
|
|
|
|
|
.autocal-corner-btn--top-right .autocal-corner-glyph::after { top: 4px; right: 4px; }
|
|
|
|
|
.autocal-corner-btn--bottom-left .autocal-corner-glyph::after { bottom: 4px; left: 4px; }
|
|
|
|
|
.autocal-corner-btn--bottom-right .autocal-corner-glyph::after { bottom: 4px; right: 4px; }
|
|
|
|
|
|
|
|
|
|
/* Light the dot on hover/focus so the active target reads as "this corner". */
|
|
|
|
|
.autocal-corner-btn:hover .autocal-corner-glyph,
|
|
|
|
|
.autocal-corner-btn:focus-visible .autocal-corner-glyph {
|
|
|
|
|
border-color: var(--primary-color);
|
|
|
|
|
}
|
|
|
|
|
.autocal-corner-btn:hover .autocal-corner-glyph::after,
|
|
|
|
|
.autocal-corner-btn:focus-visible .autocal-corner-glyph::after {
|
|
|
|
|
background: var(--primary-color);
|
|
|
|
|
box-shadow: 0 0 7px color-mix(in srgb, var(--primary-color) 75%, transparent);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Direction selection grid (1x2) */
|
|
|
|
@@ -3008,9 +3039,6 @@ textarea:focus-visible {
|
|
|
|
|
}
|
|
|
|
|
@keyframes spin { to { transform: rotate(360deg); } }
|
|
|
|
|
|
|
|
|
|
/* Toolbar wizard re-run button */
|
|
|
|
|
.header-btn[id="wizard-rerun-btn"] { }
|
|
|
|
|
|
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
|
|
|
.wizard-progress-fill,
|
|
|
|
|
.wizard-pip,
|
|
|
|
|