style(dashboard): complete design token migration and live view cleanup
Replace remaining hard-coded colors across all CSS files with design tokens from tokens.css. Remove duplicate inline positioning from live.html panels (now in layout.css). Add replay session blob fetch for immediate 3D scene state on seek. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
jedarden
parent
a06be0eaf1
commit
07abc03ef4
24 changed files with 318 additions and 293 deletions
|
|
@ -267,7 +267,7 @@ body.ambient-mode {
|
|||
padding: 6px var(--space-3);
|
||||
background: var(--slate-4);
|
||||
border-radius: var(--radius-card);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
color: var(--text-primary);
|
||||
box-shadow: 0 2px 8px var(--shadow);
|
||||
|
|
@ -289,7 +289,7 @@ body.ambient-mode {
|
|||
}
|
||||
|
||||
.ambient-zone-label .zone-count {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
opacity: 0.8;
|
||||
margin-left: var(--space-1);
|
||||
}
|
||||
|
|
@ -325,7 +325,7 @@ body.ambient-mode {
|
|||
}
|
||||
|
||||
.ambient-alert-icon {
|
||||
font-size: 64px;
|
||||
font-size: var(--text-6xl);
|
||||
margin-bottom: var(--space-5);
|
||||
animation: alert-pulse 1.5s ease-in-out infinite;
|
||||
}
|
||||
|
|
@ -342,7 +342,7 @@ body.ambient-mode {
|
|||
}
|
||||
|
||||
.ambient-alert-title {
|
||||
font-size: 32px;
|
||||
font-size: var(--text-4xl);
|
||||
font-weight: 700;
|
||||
color: var(--text-on-accent);
|
||||
margin-bottom: var(--space-3);
|
||||
|
|
@ -350,7 +350,7 @@ body.ambient-mode {
|
|||
}
|
||||
|
||||
.ambient-alert-message {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
color: var(--text-on-accent);
|
||||
margin-bottom: var(--space-8);
|
||||
text-align: center;
|
||||
|
|
@ -438,9 +438,9 @@ body.ambient-mode {
|
|||
}
|
||||
|
||||
.ambient-briefing-section-label {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
letter-spacing: var(--ls-wide);
|
||||
opacity: 0.7;
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
|
@ -479,12 +479,12 @@ body.ambient-mode {
|
|||
}
|
||||
|
||||
.ambient-secure-icon {
|
||||
font-size: 64px;
|
||||
font-size: var(--text-6xl);
|
||||
margin-bottom: var(--space-4);
|
||||
}
|
||||
|
||||
.ambient-secure-text {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
|
|
@ -502,11 +502,11 @@ body.ambient-mode {
|
|||
|
||||
.ambient-zone-label {
|
||||
padding: var(--space-1) var(--space-2);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.ambient-alert-title {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
}
|
||||
|
||||
.ambient-alert-message {
|
||||
|
|
|
|||
|
|
@ -231,7 +231,7 @@
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
|
|
@ -351,7 +351,7 @@
|
|||
|
||||
.learning-icon {
|
||||
color: var(--blue-10);
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
}
|
||||
|
||||
.learning-text {
|
||||
|
|
@ -483,7 +483,7 @@
|
|||
}
|
||||
|
||||
.alert-banner-icon {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
}
|
||||
|
||||
.alert-banner-content {
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@
|
|||
}
|
||||
|
||||
.ap-detection-title {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
border-radius: var(--radius-card);
|
||||
padding: var(--space-4);
|
||||
color: var(--alert);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
|
@ -54,15 +54,15 @@
|
|||
text-align: center;
|
||||
padding: var(--space-10) var(--space-5);
|
||||
color: var(--text-muted);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
line-height: var(--lh-body);
|
||||
}
|
||||
|
||||
/* Section Header */
|
||||
.ble-section-header {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
letter-spacing: var(--ls-wide);
|
||||
color: var(--text-muted);
|
||||
margin: var(--space-3);
|
||||
padding-bottom: 6px;
|
||||
|
|
@ -108,7 +108,7 @@
|
|||
|
||||
/* Device Icon */
|
||||
.ble-device-icon {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
flex-shrink: 0;
|
||||
width: 24px;
|
||||
text-align: center;
|
||||
|
|
@ -117,7 +117,7 @@
|
|||
/* Device Name */
|
||||
.ble-device-name {
|
||||
flex: 1;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-12);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
@ -126,7 +126,7 @@
|
|||
|
||||
/* Device RSSI */
|
||||
.ble-device-rssi {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
font-family: var(--font-mono);
|
||||
flex-shrink: 0;
|
||||
|
|
@ -183,7 +183,7 @@
|
|||
|
||||
.ble-hint {
|
||||
margin: 0;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-secondary);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
|
@ -208,7 +208,7 @@
|
|||
border: 1px solid var(--border-strong);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-12);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
|
@ -238,7 +238,7 @@
|
|||
border: none;
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-11);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
|
@ -253,7 +253,7 @@
|
|||
border: none;
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--text-on-accent);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
|
|
@ -269,7 +269,7 @@
|
|||
border: 1px solid var(--border-strong);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-11);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
|
@ -285,7 +285,7 @@
|
|||
border: 1px solid var(--alert-border);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--alert);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
|
@ -319,7 +319,7 @@
|
|||
}
|
||||
|
||||
.ble-detail-value {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-12);
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
|
@ -354,7 +354,7 @@
|
|||
padding: 6px var(--space-2);
|
||||
background: var(--border-subtle);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.ble-history-time {
|
||||
|
|
@ -369,7 +369,7 @@
|
|||
|
||||
.ble-history-node {
|
||||
color: var(--text-secondary);
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
|
|
@ -382,7 +382,7 @@
|
|||
border-radius: var(--radius-control);
|
||||
padding: 10px var(--space-3);
|
||||
margin-bottom: var(--space-4);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--blue-10);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@
|
|||
}
|
||||
|
||||
#briefing-card .briefing-content {
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
line-height: 1.6;
|
||||
color: var(--slate-11);
|
||||
white-space: pre-line;
|
||||
|
|
@ -236,7 +236,7 @@
|
|||
}
|
||||
|
||||
#briefing-settings h3 {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
color: var(--blue-10);
|
||||
margin-bottom: var(--space-5);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@
|
|||
border: none;
|
||||
outline: none;
|
||||
color: var(--slate-12);
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
font-family: inherit;
|
||||
line-height: var(--lh-body);
|
||||
}
|
||||
|
|
@ -89,7 +89,7 @@
|
|||
}
|
||||
|
||||
.cp-esc-hint {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--slate-7);
|
||||
background: var(--highlight-subtle);
|
||||
border-radius: var(--radius-control);
|
||||
|
|
@ -124,7 +124,7 @@
|
|||
/* Group header */
|
||||
.cp-group-header {
|
||||
padding: 6px var(--space-4) var(--space-1);
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.08em;
|
||||
|
|
@ -191,7 +191,7 @@
|
|||
}
|
||||
|
||||
.cp-item-arrow {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
color: var(--slate-7);
|
||||
flex-shrink: 0;
|
||||
line-height: 1;
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@
|
|||
min-height: 44px;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
line-height: 44px;
|
||||
padding: 0;
|
||||
}
|
||||
|
|
@ -130,7 +130,7 @@
|
|||
.link-item {
|
||||
min-height: 44px;
|
||||
padding: var(--space-3) var(--space-4);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
/* Ensure all buttons meet 44x44px minimum */
|
||||
|
|
@ -184,7 +184,7 @@
|
|||
min-height: 44px;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
}
|
||||
|
||||
/* Mode toggle buttons */
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@
|
|||
}
|
||||
|
||||
.panel-empty-icon {
|
||||
font-size: 48px;
|
||||
font-size: var(--text-5xl);
|
||||
margin-bottom: var(--space-3);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
|
@ -89,7 +89,7 @@
|
|||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
font-weight: 700;
|
||||
color: var(--blue-10);
|
||||
}
|
||||
|
|
@ -145,7 +145,7 @@
|
|||
.links-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.links-table th,
|
||||
|
|
@ -158,7 +158,7 @@
|
|||
.links-table th {
|
||||
font-weight: 600;
|
||||
color: var(--text-muted);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
|
@ -179,7 +179,7 @@
|
|||
/* ----- Table Cells ----- */
|
||||
.link-cell {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.link-id {
|
||||
|
|
@ -200,7 +200,7 @@
|
|||
min-width: 20px;
|
||||
padding: 2px 6px;
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -235,7 +235,7 @@
|
|||
.contribution-cell {
|
||||
font-family: var(--font-mono);
|
||||
color: var(--blue-9);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
/* ----- BLE Match Card ----- */
|
||||
|
|
@ -260,7 +260,7 @@
|
|||
}
|
||||
|
||||
.ble-match-name {
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -45,11 +45,11 @@ body.fleet-page {
|
|||
text-decoration: none;
|
||||
color: var(--text-primary);
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
}
|
||||
|
||||
.logo-icon {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
}
|
||||
|
||||
.nav-title {
|
||||
|
|
@ -73,7 +73,7 @@ body.fleet-page {
|
|||
border-radius: var(--radius-control);
|
||||
color: var(--text-secondary);
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
transition: all 0.2s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -103,7 +103,7 @@ body.fleet-page {
|
|||
}
|
||||
|
||||
.header-content h1 {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
font-weight: 600;
|
||||
margin-bottom: var(--space-2);
|
||||
}
|
||||
|
|
@ -146,7 +146,7 @@ body.fleet-page {
|
|||
gap: 6px;
|
||||
padding: var(--space-2) var(--space-4);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
|
|
@ -242,7 +242,7 @@ body.fleet-page {
|
|||
border: 1px solid var(--border-default);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--text-primary);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.search-input {
|
||||
|
|
@ -332,7 +332,7 @@ body.fleet-page {
|
|||
.fleet-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.fleet-table thead {
|
||||
|
|
@ -348,7 +348,7 @@ body.fleet-page {
|
|||
font-weight: 600;
|
||||
color: var(--text-secondary);
|
||||
text-transform: uppercase;
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
letter-spacing: 0.5px;
|
||||
border-bottom: 2px solid var(--border-default);
|
||||
white-space: nowrap;
|
||||
|
|
@ -493,7 +493,7 @@ body.fleet-page {
|
|||
}
|
||||
|
||||
.mac-full {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.mac-truncated {
|
||||
|
|
@ -577,7 +577,7 @@ body.fleet-page {
|
|||
padding: 2px 6px;
|
||||
background: var(--warn-bg);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.firmware-arrow {
|
||||
|
|
@ -589,7 +589,7 @@ body.fleet-page {
|
|||
display: inline-block;
|
||||
padding: var(--space-1) var(--space-2);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
|
@ -647,7 +647,7 @@ body.fleet-page {
|
|||
}
|
||||
|
||||
.health-value {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-secondary);
|
||||
min-width: 35px;
|
||||
text-align: right;
|
||||
|
|
@ -739,7 +739,7 @@ body.fleet-page {
|
|||
border: none;
|
||||
color: var(--text-primary);
|
||||
text-align: left;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
display: flex;
|
||||
|
|
@ -801,7 +801,7 @@ body.fleet-page {
|
|||
}
|
||||
|
||||
.empty-icon {
|
||||
font-size: 64px;
|
||||
font-size: var(--text-6xl);
|
||||
margin-bottom: var(--space-4);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
|
@ -853,7 +853,7 @@ body.fleet-page {
|
|||
}
|
||||
|
||||
.modal-header h3 {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
|
|
@ -861,7 +861,7 @@ body.fleet-page {
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-secondary);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
width: 32px;
|
||||
|
|
@ -968,12 +968,12 @@ body.fleet-page {
|
|||
|
||||
.remove-warning ul {
|
||||
margin: 0;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.remove-warning-text {
|
||||
color: var(--alert);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
|
|
@ -1030,7 +1030,7 @@ body.fleet-page {
|
|||
}
|
||||
|
||||
.toast-icon {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
}
|
||||
|
||||
.toast.success .toast-icon { color: var(--ok); }
|
||||
|
|
@ -1040,7 +1040,7 @@ body.fleet-page {
|
|||
|
||||
.toast-message {
|
||||
flex: 1;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.toast-dismiss {
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@
|
|||
font-size: var(--text-sm);
|
||||
color: var(--text-muted);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
letter-spacing: var(--ls-wide);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
|
@ -34,7 +34,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
cursor: pointer;
|
||||
padding: 0 4px;
|
||||
line-height: 1;
|
||||
|
|
@ -54,13 +54,13 @@
|
|||
}
|
||||
|
||||
.floorplan-section h4 {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
margin-bottom: var(--space-2);
|
||||
}
|
||||
|
||||
.floorplan-hint {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
margin-bottom: var(--space-2);
|
||||
}
|
||||
|
|
@ -113,7 +113,7 @@
|
|||
}
|
||||
|
||||
.floorplan-file-name {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
max-width: 180px;
|
||||
overflow: hidden;
|
||||
|
|
@ -192,7 +192,7 @@
|
|||
.floorplan-point-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
||||
|
|
@ -206,7 +206,7 @@
|
|||
|
||||
.floorplan-distance-input label {
|
||||
display: block;
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-secondary);
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
|
@ -218,7 +218,7 @@
|
|||
border: 1px solid var(--border-strong);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-12);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
|
@ -245,7 +245,7 @@
|
|||
.status-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.status-label {
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@
|
|||
}
|
||||
|
||||
.help-icon {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
|
|
@ -65,7 +65,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
|
|
@ -120,7 +120,7 @@
|
|||
}
|
||||
|
||||
.step-title {
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
font-weight: 600;
|
||||
color: var(--blue-10);
|
||||
margin: var(--space-2);
|
||||
|
|
@ -173,7 +173,7 @@
|
|||
.help-btn {
|
||||
padding: var(--space-2) var(--space-4);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
|
|
|
|||
|
|
@ -107,7 +107,7 @@
|
|||
.btn-icon {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
cursor: pointer;
|
||||
padding: 5px;
|
||||
opacity: 0.7;
|
||||
|
|
@ -342,7 +342,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
cursor: pointer;
|
||||
padding: 5px;
|
||||
line-height: 1;
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@
|
|||
|
||||
.panel-title {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
overflow: hidden;
|
||||
|
|
@ -75,7 +75,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
|
|
@ -188,7 +188,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
|
|
@ -442,7 +442,7 @@
|
|||
|
||||
.panel-form-group label {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-secondary);
|
||||
margin-bottom: 6px;
|
||||
font-weight: 500;
|
||||
|
|
@ -526,7 +526,7 @@
|
|||
}
|
||||
|
||||
.panel-form-range-value {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--blue-10);
|
||||
font-weight: 500;
|
||||
text-align: right;
|
||||
|
|
@ -565,7 +565,7 @@
|
|||
.panel-section-header {
|
||||
font-size: var(--text-xs);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
letter-spacing: var(--ls-wide);
|
||||
color: var(--text-muted);
|
||||
margin-bottom: var(--space-3);
|
||||
padding-bottom: 6px;
|
||||
|
|
@ -640,7 +640,7 @@
|
|||
}
|
||||
|
||||
.panel-info-card-title {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
margin-bottom: var(--space-1);
|
||||
|
|
@ -653,7 +653,7 @@
|
|||
}
|
||||
|
||||
.panel-info-card-subtitle {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
margin-top: var(--space-1);
|
||||
}
|
||||
|
|
@ -696,7 +696,7 @@
|
|||
}
|
||||
|
||||
.panel-empty-icon {
|
||||
font-size: 48px;
|
||||
font-size: var(--text-5xl);
|
||||
margin-bottom: var(--space-3);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
|
@ -716,7 +716,7 @@
|
|||
border-radius: var(--radius-modal);
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
|
|
@ -824,7 +824,7 @@
|
|||
border-radius: var(--radius-card);
|
||||
padding: var(--space-3);
|
||||
margin-bottom: var(--space-5);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--warn);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -833,7 +833,7 @@
|
|||
|
||||
#security-dialog .learning-warning::before {
|
||||
content: '⚠';
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
}
|
||||
|
||||
#security-dialog-buttons {
|
||||
|
|
@ -873,7 +873,7 @@
|
|||
}
|
||||
|
||||
.alert-banner-icon {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
animation: alert-shake 0.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
|
|
@ -894,7 +894,7 @@
|
|||
}
|
||||
|
||||
.alert-banner-subtitle {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
|
|
@ -906,7 +906,7 @@
|
|||
.alert-banner-btn {
|
||||
padding: 10px var(--space-4);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
|
|
@ -972,7 +972,7 @@
|
|||
}
|
||||
|
||||
.security-status-badge-value {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
|
@ -983,7 +983,7 @@
|
|||
.security-status-badge.value-alert { color: var(--alert); }
|
||||
|
||||
.security-status-icon {
|
||||
font-size: 32px;
|
||||
font-size: var(--text-4xl);
|
||||
}
|
||||
|
||||
/* Learning Progress Bar */
|
||||
|
|
@ -1004,7 +1004,7 @@
|
|||
}
|
||||
|
||||
.learning-progress-percent {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 600;
|
||||
color: var(--warn);
|
||||
}
|
||||
|
|
@ -1031,7 +1031,7 @@
|
|||
padding: var(--space-1) 10px;
|
||||
background: var(--ok-muted);
|
||||
border-radius: var(--radius-card);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
font-weight: 600;
|
||||
color: var(--ok);
|
||||
margin-top: var(--space-2);
|
||||
|
|
@ -1053,13 +1053,13 @@
|
|||
}
|
||||
|
||||
.security-stat-value {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
font-weight: 600;
|
||||
color: var(--blue-10);
|
||||
}
|
||||
|
||||
.security-stat-label {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
margin-top: var(--space-1);
|
||||
text-transform: uppercase;
|
||||
|
|
@ -1072,18 +1072,18 @@
|
|||
}
|
||||
|
||||
.security-last-event-label {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
||||
.security-last-event-value {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
}
|
||||
|
||||
.security-last-event-time {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
margin-top: var(--space-1);
|
||||
}
|
||||
|
|
@ -1093,7 +1093,7 @@
|
|||
width: 100%;
|
||||
padding: 14px;
|
||||
border-radius: var(--radius-card);
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
|
|
@ -1143,7 +1143,7 @@
|
|||
border: 1px solid var(--border-strong);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-11);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
|
@ -1190,13 +1190,13 @@
|
|||
}
|
||||
|
||||
.anomaly-item-type {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
||||
.anomaly-item-time {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
|
|
@ -1210,7 +1210,7 @@
|
|||
display: inline-block;
|
||||
padding: 2px var(--space-2);
|
||||
border-radius: var(--radius-card);
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 600;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
|
@ -1232,13 +1232,13 @@
|
|||
}
|
||||
|
||||
.anomaly-timeline-empty-icon {
|
||||
font-size: 32px;
|
||||
font-size: var(--text-4xl);
|
||||
margin-bottom: var(--space-2);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.anomaly-timeline-empty-text {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
|
|
@ -1360,7 +1360,7 @@
|
|||
|
||||
.auth-header p {
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
|
|
@ -1388,7 +1388,7 @@
|
|||
border: 1px solid var(--alert-border);
|
||||
border-radius: var(--radius-control);
|
||||
padding: 10px var(--space-4);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--alert);
|
||||
margin: 0;
|
||||
}
|
||||
|
|
@ -1406,7 +1406,7 @@
|
|||
border: 2px solid var(--border-strong);
|
||||
border-radius: var(--radius-card);
|
||||
color: var(--slate-12);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
transition: all 0.2s;
|
||||
|
|
@ -1426,7 +1426,7 @@
|
|||
.auth-button {
|
||||
padding: 14px var(--space-8);
|
||||
border-radius: var(--radius-card);
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
|
|
@ -1468,7 +1468,7 @@
|
|||
}
|
||||
|
||||
.auth-header h1 {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
}
|
||||
|
||||
.pin-digit {
|
||||
|
|
@ -1551,7 +1551,7 @@
|
|||
}
|
||||
|
||||
.confidence-label {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
|
|
@ -1607,7 +1607,7 @@
|
|||
color: var(--text-muted);
|
||||
font-weight: 500;
|
||||
border-bottom: 1px solid var(--bg-hover);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
|
@ -1623,7 +1623,7 @@
|
|||
|
||||
.links-table-detailed {
|
||||
margin-top: var(--space-2);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.link-cell {
|
||||
|
|
@ -1632,7 +1632,7 @@
|
|||
|
||||
.link-id {
|
||||
color: var(--blue-10);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.deltarms-cell {
|
||||
|
|
@ -1648,7 +1648,7 @@
|
|||
display: inline-block;
|
||||
padding: 2px var(--space-2);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 600;
|
||||
color: var(--bg-card);
|
||||
}
|
||||
|
|
@ -1673,7 +1673,7 @@
|
|||
display: inline-block;
|
||||
padding: 2px 6px;
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
font-weight: 600;
|
||||
background: var(--ok-border);
|
||||
color: var(--ok);
|
||||
|
|
@ -1715,13 +1715,13 @@
|
|||
|
||||
.ble-match-name {
|
||||
flex: 1;
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
||||
.ble-match-confidence {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
font-weight: 600;
|
||||
padding: 3px var(--space-2);
|
||||
border-radius: var(--radius-control);
|
||||
|
|
@ -1788,7 +1788,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
transition: background 0.2s, color 0.2s;
|
||||
}
|
||||
|
|
@ -1836,11 +1836,11 @@
|
|||
}
|
||||
|
||||
.confidence-value {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
}
|
||||
|
||||
.links-table {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.links-table th,
|
||||
|
|
@ -1862,7 +1862,7 @@
|
|||
|
||||
.automation-header h3 {
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
|
|
@ -1910,7 +1910,7 @@
|
|||
}
|
||||
|
||||
.trigger-card-title {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
|
|
@ -1920,7 +1920,7 @@
|
|||
}
|
||||
|
||||
.trigger-card-meta {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
margin-top: var(--space-1);
|
||||
}
|
||||
|
|
@ -1937,7 +1937,7 @@
|
|||
align-items: center;
|
||||
gap: 3px;
|
||||
padding: 2px 7px;
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 600;
|
||||
border-radius: var(--radius-control);
|
||||
background: var(--alert-bg);
|
||||
|
|
@ -1951,7 +1951,7 @@
|
|||
align-items: center;
|
||||
gap: 3px;
|
||||
padding: 2px 7px;
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 600;
|
||||
border-radius: var(--radius-control);
|
||||
background: var(--warn-bg);
|
||||
|
|
@ -1965,7 +1965,7 @@
|
|||
align-items: center;
|
||||
gap: 3px;
|
||||
padding: 2px 7px;
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 600;
|
||||
border-radius: var(--radius-control);
|
||||
background: var(--warn-muted);
|
||||
|
|
@ -1997,7 +1997,7 @@
|
|||
|
||||
.btn-sm {
|
||||
padding: 3px var(--space-2);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
|
|
@ -2126,7 +2126,7 @@
|
|||
.form-control {
|
||||
width: 100%;
|
||||
padding: 6px 10px;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
background: var(--border-subtle);
|
||||
border: 1px solid var(--bg-active);
|
||||
border-radius: var(--radius-control);
|
||||
|
|
@ -2158,7 +2158,7 @@
|
|||
|
||||
.text-muted {
|
||||
color: var(--text-muted);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
}
|
||||
|
||||
.volume-shape-info {
|
||||
|
|
@ -2181,7 +2181,7 @@
|
|||
align-items: center;
|
||||
gap: var(--space-2);
|
||||
padding: 4px 0;
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
border-bottom: 1px solid var(--border-subtle);
|
||||
}
|
||||
|
||||
|
|
@ -2208,7 +2208,7 @@
|
|||
|
||||
.trigger-log-entry .log-time {
|
||||
color: var(--slate-7);
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
|
|
@ -2273,7 +2273,7 @@
|
|||
|
||||
.panel-modal-header h2 {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
|
@ -2282,7 +2282,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
|
|
@ -2345,7 +2345,7 @@
|
|||
border: 1px solid var(--alert-border);
|
||||
border-radius: var(--radius-control);
|
||||
padding: 10px var(--space-4);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--alert);
|
||||
margin-bottom: var(--space-4);
|
||||
}
|
||||
|
|
@ -2414,7 +2414,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
cursor: pointer;
|
||||
padding: var(--space-1);
|
||||
width: 28px;
|
||||
|
|
@ -2449,7 +2449,7 @@
|
|||
|
||||
.sim-section h3 {
|
||||
margin: 0;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
color: var(--text-muted);
|
||||
|
|
@ -2467,7 +2467,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
}
|
||||
|
||||
|
|
@ -2478,7 +2478,7 @@
|
|||
border: 1px solid var(--border-strong);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-12);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
|
|
@ -2521,7 +2521,7 @@
|
|||
border: 1px solid var(--border-strong);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-11);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
|
|
@ -2584,7 +2584,7 @@
|
|||
border: 1px solid var(--border-strong);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-12);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
|
@ -2610,12 +2610,12 @@
|
|||
|
||||
.sim-item-name {
|
||||
flex: 1;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
||||
.sim-item-position {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
|
@ -2626,7 +2626,7 @@
|
|||
border: none;
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--alert);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
|
@ -2646,7 +2646,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -2712,7 +2712,7 @@
|
|||
}
|
||||
|
||||
.sim-result-label {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
}
|
||||
|
||||
|
|
@ -2742,7 +2742,7 @@
|
|||
.sim-rec-priority {
|
||||
padding: 2px var(--space-2);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
flex-shrink: 0;
|
||||
|
|
@ -2764,7 +2764,7 @@
|
|||
}
|
||||
|
||||
.sim-rec-text {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
|
@ -2786,7 +2786,7 @@
|
|||
}
|
||||
|
||||
.sim-shopping-item span {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
}
|
||||
|
||||
|
|
@ -2864,7 +2864,7 @@
|
|||
|
||||
.simulator-header h2 {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
|
@ -2873,7 +2873,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
width: 32px;
|
||||
|
|
@ -2936,7 +2936,7 @@
|
|||
border: 1px solid var(--bg-hover);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-12);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.sim-space-controls input:focus {
|
||||
|
|
@ -3006,12 +3006,12 @@
|
|||
|
||||
.sim-item-name {
|
||||
flex: 1;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
||||
.sim-item-position {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
margin-right: var(--space-2);
|
||||
}
|
||||
|
|
@ -3022,7 +3022,7 @@
|
|||
border: 1px solid var(--alert-border);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--alert);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
|
@ -3042,7 +3042,7 @@
|
|||
.sim-gdop-controls label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-muted);
|
||||
gap: 6px;
|
||||
}
|
||||
|
|
@ -3088,7 +3088,7 @@
|
|||
border: 1px solid var(--bg-hover);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-12);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
|
@ -3139,7 +3139,7 @@
|
|||
}
|
||||
|
||||
.sim-result-label {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
|
|
@ -3180,7 +3180,7 @@
|
|||
.sim-rec-priority {
|
||||
padding: 2px 6px;
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
|
@ -3202,7 +3202,7 @@
|
|||
|
||||
.sim-rec-text {
|
||||
flex: 1;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
||||
|
|
@ -3220,7 +3220,7 @@
|
|||
padding: var(--space-2) var(--space-3);
|
||||
background: var(--slate-1);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
||||
|
|
@ -3243,7 +3243,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: var(--space-2);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
|
|
@ -3276,7 +3276,7 @@
|
|||
}
|
||||
|
||||
.gdop-stat-item {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -109,7 +109,7 @@
|
|||
|
||||
.context-title {
|
||||
flex: 1;
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
font-weight: 600;
|
||||
color: var(--context-text, var(--slate-12));
|
||||
white-space: nowrap;
|
||||
|
|
@ -161,7 +161,7 @@
|
|||
}
|
||||
|
||||
.item-icon {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
flex-shrink: 0;
|
||||
width: 24px;
|
||||
text-align: center;
|
||||
|
|
@ -273,7 +273,7 @@
|
|||
.follow-mode-indicator {
|
||||
bottom: 100px;
|
||||
padding: var(--space-3) var(--space-6);
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -91,7 +91,7 @@
|
|||
border-radius: var(--radius-control);
|
||||
color: var(--slate-11);
|
||||
padding: 6px 10px;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
|
@ -179,7 +179,7 @@
|
|||
border-radius: var(--radius-card);
|
||||
color: var(--ok);
|
||||
padding: var(--space-2) 14px;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
|
|
@ -243,7 +243,7 @@
|
|||
|
||||
.replay-tuning-header h2 {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
|
@ -252,7 +252,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
|
|
@ -286,7 +286,7 @@
|
|||
|
||||
.tuning-param label {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
color: var(--slate-11);
|
||||
margin-bottom: var(--space-2);
|
||||
|
|
@ -340,7 +340,7 @@
|
|||
|
||||
.tuning-value {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--blue-10);
|
||||
float: right;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
border-radius: var(--radius-modal);
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
|
|
@ -149,7 +149,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
|
|
@ -173,7 +173,7 @@
|
|||
|
||||
.security-dialog-prompt {
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
color: var(--slate-11);
|
||||
line-height: var(--lh-body);
|
||||
}
|
||||
|
|
@ -188,7 +188,7 @@
|
|||
|
||||
.security-dialog-warning p {
|
||||
margin: 0;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--warn);
|
||||
}
|
||||
|
||||
|
|
@ -212,7 +212,7 @@
|
|||
|
||||
.stat-label {
|
||||
display: block;
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
|
|
@ -221,7 +221,7 @@
|
|||
|
||||
.stat-value {
|
||||
display: block;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--slate-12);
|
||||
}
|
||||
|
|
@ -355,7 +355,7 @@
|
|||
.alert-banner-btn {
|
||||
padding: var(--space-2) var(--space-4);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
|
|
@ -397,7 +397,7 @@
|
|||
border-radius: var(--radius-control);
|
||||
font-size: var(--text-xs);
|
||||
font-weight: 600;
|
||||
letter-spacing: 1px;
|
||||
letter-spacing: var(--ls-wide);
|
||||
z-index: 150;
|
||||
display: none;
|
||||
animation: security-pulse 2s ease-in-out infinite;
|
||||
|
|
@ -465,7 +465,7 @@
|
|||
color: var(--text-on-accent);
|
||||
padding: var(--space-2) var(--space-4);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
display: none;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
|
|
|
|||
|
|
@ -77,7 +77,7 @@ body.simple-mode {
|
|||
border: none;
|
||||
padding: 6px var(--space-3);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
color: var(--simple-text-secondary);
|
||||
cursor: pointer;
|
||||
|
|
@ -132,7 +132,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-alert-banner .alert-icon {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
|
|
@ -159,7 +159,7 @@ body.simple-mode {
|
|||
height: 28px;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
|
@ -200,12 +200,12 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-morning-briefing .briefing-greeting {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.simple-morning-briefing .briefing-date {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
|
@ -222,15 +222,15 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-morning-briefing .section-label {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
letter-spacing: var(--ls-wide);
|
||||
opacity: 0.7;
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
||||
.simple-morning-briefing .section-value {
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
|
|
@ -340,7 +340,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-room-card .room-name {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--simple-text-primary);
|
||||
}
|
||||
|
|
@ -349,7 +349,7 @@ body.simple-mode {
|
|||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
padding: var(--space-1) 10px;
|
||||
border-radius: var(--radius-modal);
|
||||
|
|
@ -390,7 +390,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-room-card .room-activity {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--simple-text-secondary);
|
||||
margin-bottom: var(--space-2);
|
||||
}
|
||||
|
|
@ -426,7 +426,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-activity-feed .feed-title {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--simple-text-primary);
|
||||
}
|
||||
|
|
@ -441,7 +441,7 @@ body.simple-mode {
|
|||
border: none;
|
||||
padding: 6px var(--space-3);
|
||||
border-radius: var(--radius-card);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
color: var(--simple-text-secondary);
|
||||
cursor: pointer;
|
||||
|
|
@ -460,18 +460,18 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-activity-feed .feed-empty-icon {
|
||||
font-size: 48px;
|
||||
font-size: var(--text-5xl);
|
||||
margin-bottom: var(--space-3);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.simple-activity-feed .feed-empty-text {
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
||||
.simple-activity-feed .feed-empty-subtext {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.simple-activity-feed .activity-list {
|
||||
|
|
@ -536,7 +536,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-activity-feed .activity-description {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--simple-text-secondary);
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
|
@ -614,11 +614,11 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-quick-actions .action-icon {
|
||||
font-size: 24px;
|
||||
font-size: var(--text-3xl);
|
||||
}
|
||||
|
||||
.simple-quick-actions .action-label {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
font-weight: 500;
|
||||
color: var(--simple-text-secondary);
|
||||
text-align: center;
|
||||
|
|
@ -630,7 +630,7 @@ body.simple-mode {
|
|||
right: 4px;
|
||||
background: var(--simple-accent-red);
|
||||
color: var(--text-on-accent);
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 600;
|
||||
padding: 2px 6px;
|
||||
border-radius: var(--radius-card);
|
||||
|
|
@ -656,7 +656,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-sleep-summary .sleep-title {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -664,7 +664,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-sleep-summary .sleep-date {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
|
|
@ -681,9 +681,9 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-sleep-summary .metric-label {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
letter-spacing: var(--ls-wide);
|
||||
opacity: 0.7;
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
|
@ -694,7 +694,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-sleep-summary .metric-unit {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
opacity: 0.8;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
|
@ -837,7 +837,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-room-modal .stat-value {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--simple-text-primary);
|
||||
}
|
||||
|
|
@ -871,7 +871,7 @@ body.simple-mode {
|
|||
|
||||
.simple-room-modal .history-time {
|
||||
color: var(--simple-text-secondary);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.simple-room-modal .history-event {
|
||||
|
|
@ -932,7 +932,7 @@ body.simple-mode {
|
|||
|
||||
.simple-security-toggle .security-status {
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--simple-text-secondary);
|
||||
margin-top: var(--space-2);
|
||||
}
|
||||
|
|
@ -962,7 +962,7 @@ body.simple-mode {
|
|||
}
|
||||
|
||||
.simple-loading-text {
|
||||
font-size: 15px;
|
||||
font-size: var(--text-md);
|
||||
}
|
||||
|
||||
/* ===== Responsive Design ===== */
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@
|
|||
|
||||
.simulator-header h2 {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
font-weight: 600;
|
||||
color: var(--text-on-accent);
|
||||
}
|
||||
|
|
@ -113,7 +113,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--space-1);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
}
|
||||
|
||||
|
|
@ -124,7 +124,7 @@
|
|||
border: 1px solid var(--slate-6);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--text-on-accent);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.sim-space-controls input[type="number"]:focus {
|
||||
|
|
@ -182,7 +182,7 @@
|
|||
border: 1px solid var(--slate-6);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--slate-11);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
transition: background 0.2s, border-color 0.2s, color 0.2s;
|
||||
}
|
||||
|
|
@ -245,12 +245,12 @@
|
|||
}
|
||||
|
||||
.sim-item-name {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-on-accent);
|
||||
}
|
||||
|
||||
.sim-item-position {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted);
|
||||
margin-left: var(--space-2);
|
||||
}
|
||||
|
|
@ -259,7 +259,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--alert);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
cursor: pointer;
|
||||
padding: var(--space-1) var(--space-2);
|
||||
border-radius: var(--radius-control);
|
||||
|
|
@ -287,7 +287,7 @@
|
|||
border: 1px solid var(--slate-6);
|
||||
border-radius: var(--radius-control);
|
||||
color: var(--text-on-accent);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
|
|
@ -406,12 +406,12 @@
|
|||
}
|
||||
|
||||
.sim-result-label {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
}
|
||||
|
||||
.sim-result-value {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-on-accent);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
|
@ -448,7 +448,7 @@
|
|||
}
|
||||
|
||||
.sim-rec-text {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
flex: 1;
|
||||
}
|
||||
|
|
@ -471,7 +471,7 @@
|
|||
}
|
||||
|
||||
.sim-shopping-item span {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--slate-11);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@
|
|||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted, var(--text-muted));
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
cursor: pointer;
|
||||
padding: 2px 6px;
|
||||
line-height: 1;
|
||||
|
|
@ -71,13 +71,13 @@
|
|||
}
|
||||
|
||||
.sleep-summary-body > div {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
line-height: var(--lh-body);
|
||||
}
|
||||
|
||||
.sleep-summary-duration {
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
||||
|
|
@ -186,7 +186,7 @@
|
|||
}
|
||||
|
||||
.sleep-panel-section h4 {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
|
|
@ -260,7 +260,7 @@
|
|||
|
||||
.sleep-stat-label {
|
||||
display: block;
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted, var(--text-muted));
|
||||
margin-bottom: var(--space-1);
|
||||
}
|
||||
|
|
@ -287,7 +287,7 @@
|
|||
padding: var(--space-2) 10px;
|
||||
background: var(--bg-card, var(--bg-card));
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
.sleep-history-date {
|
||||
|
|
@ -308,6 +308,6 @@
|
|||
.sleep-history-empty {
|
||||
text-align: center;
|
||||
color: var(--text-muted, var(--text-muted));
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
padding: 24px 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -98,9 +98,9 @@
|
|||
}
|
||||
|
||||
.timeline-filter-section-title {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
letter-spacing: var(--ls-wide);
|
||||
color: var(--text-muted, var(--text-muted));
|
||||
margin: var(--space-2);
|
||||
}
|
||||
|
|
@ -178,7 +178,7 @@
|
|||
color: var(--text-primary, var(--slate-11));
|
||||
padding: 6px 10px;
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
min-width: 100px;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.2s;
|
||||
|
|
@ -200,7 +200,7 @@
|
|||
color: var(--text-primary, var(--slate-11));
|
||||
padding: 6px 10px 6px var(--space-8);
|
||||
border-radius: var(--radius-control);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
min-width: 200px;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
|
||||
background-repeat: no-repeat;
|
||||
|
|
@ -361,7 +361,7 @@
|
|||
|
||||
/* Event Details */
|
||||
.timeline-event-details {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-secondary, var(--text-secondary));
|
||||
margin-top: 6px;
|
||||
line-height: 1.4;
|
||||
|
|
@ -386,7 +386,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--space-1);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted, var(--text-muted));
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
|
@ -439,7 +439,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--space-1);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted, var(--text-muted));
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
|
@ -460,7 +460,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--space-1);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--accent-color, var(--blue-9));
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
|
@ -587,7 +587,7 @@
|
|||
}
|
||||
|
||||
.timeline-empty p {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
margin: 0;
|
||||
max-width: 300px;
|
||||
}
|
||||
|
|
@ -607,7 +607,7 @@
|
|||
border-radius: var(--radius-control);
|
||||
padding: var(--space-2) var(--space-4);
|
||||
color: var(--text-secondary, var(--text-secondary));
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
|
@ -627,7 +627,7 @@
|
|||
.timeline-count {
|
||||
background: var(--accent-color, var(--blue-9));
|
||||
color: var(--text-on-accent);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
font-weight: 600;
|
||||
padding: 2px 6px;
|
||||
border-radius: var(--radius-card);
|
||||
|
|
@ -711,8 +711,8 @@
|
|||
margin-left: var(--space-2);
|
||||
background: color-mix(in srgb, var(--blue-9) 20%, transparent);
|
||||
color: var(--blue-11);
|
||||
border-radius: 9999px;
|
||||
font-size: 11px;
|
||||
border-radius: var(--radius-pill);
|
||||
font-size: var(--text-2xs);
|
||||
font-weight: 600;
|
||||
font-family: var(--font-mono, ui-monospace, monospace);
|
||||
white-space: nowrap;
|
||||
|
|
@ -742,12 +742,12 @@
|
|||
}
|
||||
|
||||
.timeline-event.secondary .timeline-event-title {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--text-secondary, var(--text-secondary));
|
||||
}
|
||||
|
||||
.timeline-event.secondary .timeline-event-meta {
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted, var(--text-muted));
|
||||
}
|
||||
|
||||
|
|
@ -1028,7 +1028,7 @@
|
|||
}
|
||||
|
||||
.sidebar-timeline-event-title {
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
font-weight: 500;
|
||||
color: var(--text-primary, var(--slate-11));
|
||||
line-height: 1.3;
|
||||
|
|
@ -1041,7 +1041,7 @@
|
|||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
color: var(--text-muted, var(--text-muted));
|
||||
}
|
||||
|
||||
|
|
@ -1244,8 +1244,8 @@
|
|||
margin-left: var(--space-2);
|
||||
background: color-mix(in srgb, var(--blue-9) 20%, transparent);
|
||||
color: var(--blue-11);
|
||||
border-radius: 9999px;
|
||||
font-size: 11px;
|
||||
border-radius: var(--radius-pill);
|
||||
font-size: var(--text-2xs);
|
||||
font-weight: 600;
|
||||
font-family: var(--font-mono, ui-monospace, monospace);
|
||||
white-space: nowrap;
|
||||
|
|
|
|||
|
|
@ -81,11 +81,19 @@
|
|||
--font-body: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
|
||||
--font-mono: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace;
|
||||
|
||||
--text-3xs: 10px;
|
||||
--text-2xs: 11px;
|
||||
--text-xs: 12px;
|
||||
--text-sm: 14px;
|
||||
--text-base: 16px;
|
||||
--text-md: 15px;
|
||||
--text-lg: 20px;
|
||||
--text-xl: 18px;
|
||||
--text-2xl: 28px;
|
||||
--text-3xl: 24px;
|
||||
--text-4xl: 32px;
|
||||
--text-5xl: 48px;
|
||||
--text-6xl: 64px;
|
||||
|
||||
--lh-body: 1.5;
|
||||
--lh-heading: 1.2;
|
||||
|
|
@ -108,6 +116,7 @@
|
|||
--radius-control: 6px;
|
||||
--radius-card: 10px;
|
||||
--radius-modal: 16px;
|
||||
--radius-pill: 9999px;
|
||||
|
||||
/* ── Shadows (flat elevation, no drop shadows per §8e) ── */
|
||||
--shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
|
||||
|
|
@ -174,4 +183,18 @@
|
|||
|
||||
/* ── Green glow dot ── */
|
||||
--ok-glow: rgba(70, 167, 88, 0.5);
|
||||
|
||||
/* ── Letter-spacing ── */
|
||||
--ls-wide: 1px;
|
||||
|
||||
/* ── Component sizes ── */
|
||||
--size-icon-sm: 16px;
|
||||
--size-icon: 18px;
|
||||
--size-icon-md: 20px;
|
||||
--size-icon-lg: 24px;
|
||||
--size-icon-xl: 28px;
|
||||
--size-icon-2xl: 32px;
|
||||
--size-touch: 44px;
|
||||
--size-header: 56px;
|
||||
--size-sidebar: 360px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@
|
|||
border-radius: 50%;
|
||||
background: var(--warn-muted);
|
||||
color: var(--warn);
|
||||
font-size: 10px;
|
||||
font-size: var(--text-3xs);
|
||||
font-weight: 700;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -99,7 +99,7 @@
|
|||
|
||||
.troubleshoot-more summary {
|
||||
color: var(--text-muted);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
cursor: pointer;
|
||||
padding: 2px 0;
|
||||
}
|
||||
|
|
@ -117,7 +117,7 @@
|
|||
background: var(--alert-bg);
|
||||
border: 1px solid var(--alert-border);
|
||||
color: var(--alert);
|
||||
font-size: 11px;
|
||||
font-size: var(--text-2xs);
|
||||
padding: 2px var(--space-2);
|
||||
border-radius: var(--radius-control);
|
||||
cursor: pointer;
|
||||
|
|
@ -140,7 +140,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--space-2);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
color: var(--warn);
|
||||
z-index: 150;
|
||||
max-width: 600px;
|
||||
|
|
@ -197,7 +197,7 @@
|
|||
|
||||
.troubleshoot-list {
|
||||
color: var(--text-muted);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
line-height: 1.8;
|
||||
padding-left: var(--space-5);
|
||||
margin-bottom: var(--space-4);
|
||||
|
|
@ -235,7 +235,7 @@
|
|||
|
||||
.spaxel-tooltip-text {
|
||||
color: var(--slate-12);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
|
|
@ -326,7 +326,7 @@
|
|||
}
|
||||
|
||||
.post-cal-card h3 {
|
||||
font-size: 18px;
|
||||
font-size: var(--text-xl);
|
||||
color: var(--slate-12);
|
||||
margin-bottom: var(--space-2);
|
||||
}
|
||||
|
|
@ -340,7 +340,7 @@
|
|||
|
||||
.post-cal-expect {
|
||||
color: var(--text-muted);
|
||||
font-size: 13px;
|
||||
font-size: var(--text-sm);
|
||||
line-height: var(--lh-body);
|
||||
margin-bottom: var(--space-4);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -320,6 +320,25 @@
|
|||
});
|
||||
}
|
||||
|
||||
function fetchSessionBlobs(sessionId) {
|
||||
if (!sessionId) return Promise.resolve();
|
||||
|
||||
return fetch('/api/replay/session/' + encodeURIComponent(sessionId))
|
||||
.then(function(res) {
|
||||
if (!res.ok) throw new Error('Failed to fetch session state');
|
||||
return res.json();
|
||||
})
|
||||
.then(function(data) {
|
||||
// Feed replay blobs to 3D scene
|
||||
if (data.blobs && data.blobs.length > 0 && window.Viz3D && Viz3D.updateReplayBlobs) {
|
||||
Viz3D.updateReplayBlobs(data.blobs, data.timestamp_ms);
|
||||
}
|
||||
})
|
||||
.catch(function(err) {
|
||||
console.warn('[Replay] Failed to fetch session blobs:', err);
|
||||
});
|
||||
}
|
||||
|
||||
function tuneParams(params) {
|
||||
if (!state.activeSessionId) return Promise.resolve();
|
||||
|
||||
|
|
@ -780,8 +799,12 @@
|
|||
Viz3D.enterReplayMode();
|
||||
}
|
||||
|
||||
console.log('[Replay] Jump-to-time session:', data.session_id);
|
||||
return data;
|
||||
// Fetch session state (includes blobs at the seeked timestamp)
|
||||
// so the 3D scene immediately shows the correct state
|
||||
return fetchSessionBlobs(data.session_id).then(function() {
|
||||
console.log('[Replay] Jump-to-time session:', data.session_id);
|
||||
return data;
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1493,18 +1493,12 @@
|
|||
#portal-editor-btn:hover { background: var(--bg-hover); color: var(--text-secondary); }
|
||||
#portal-editor-btn.active { background: var(--warn-muted); color: var(--warn); border-color: var(--warn); }
|
||||
|
||||
/* Portal editor panel */
|
||||
/* Portal editor panel — positioning in layout.css with responsive breakpoints */
|
||||
#portal-editor-panel {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
left: 580px;
|
||||
width: 240px;
|
||||
background: var(--live-status-bg);
|
||||
border: 1px solid var(--bg-hover);
|
||||
border-radius: 8px;
|
||||
padding: 16px;
|
||||
z-index: 100;
|
||||
display: none;
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
|
|
@ -1735,17 +1729,11 @@
|
|||
color: var(--warn);
|
||||
}
|
||||
|
||||
/* Room editor panel */
|
||||
/* Room editor panel — positioning in layout.css with responsive breakpoints */
|
||||
#room-editor-panel {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
left: 320px;
|
||||
width: 240px;
|
||||
background: var(--live-status-bg);
|
||||
border-radius: 8px;
|
||||
padding: 16px;
|
||||
z-index: 100;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#room-editor-panel h3 {
|
||||
|
|
@ -1808,16 +1796,11 @@
|
|||
background: var(--blue-10);
|
||||
}
|
||||
|
||||
/* GDOP legend */
|
||||
/* GDOP legend — positioning in layout.css with responsive breakpoints */
|
||||
#gdop-legend {
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
left: 320px;
|
||||
background: var(--live-status-bg);
|
||||
border-radius: var(--radius-control);
|
||||
padding: 10px 14px;
|
||||
z-index: 100;
|
||||
display: none;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
|
|
@ -2144,11 +2127,8 @@
|
|||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* ===== Security Mode Indicator ===== */
|
||||
/* ===== Security Mode Indicator — positioning in layout.css ===== */
|
||||
#security-mode-indicator {
|
||||
position: fixed;
|
||||
top: 45px;
|
||||
right: 20px;
|
||||
background: var(--alert);
|
||||
color: var(--text-on-accent);
|
||||
padding: 6px 12px;
|
||||
|
|
@ -2156,7 +2136,6 @@
|
|||
font-size: var(--text-xs);
|
||||
font-weight: 600;
|
||||
letter-spacing: 1px;
|
||||
z-index: 150;
|
||||
display: none;
|
||||
animation: security-pulse 2s ease-in-out infinite;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue