diff --git a/templates/index.html b/templates/index.html index 2463c5c..d9606c8 100644 --- a/templates/index.html +++ b/templates/index.html @@ -2062,10 +2062,11 @@ margin-right: 6px; } .tscm-device-reasons { - font-size: 9px; - color: var(--text-muted); + font-size: 10px; + color: var(--text-secondary); margin-top: 4px; font-style: italic; + line-height: 1.4; } .audio-badge { margin-left: 6px; @@ -2099,7 +2100,7 @@ padding: 2px 6px; border-radius: 3px; background: rgba(255, 255, 255, 0.1); - color: var(--text-muted); + color: var(--text-secondary); white-space: nowrap; } .score-badge { @@ -2221,14 +2222,15 @@ z-index: 10000; } .tscm-modal { - background: var(--panel-bg); - border: 1px solid var(--border-color); + background: var(--bg-card); + border: 1px solid var(--border-light); border-radius: 8px; max-width: 500px; width: 90%; max-height: 80vh; overflow-y: auto; position: relative; + box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5); } .tscm-modal-close { position: absolute; @@ -2307,8 +2309,9 @@ .device-detail-section h4 { margin: 0 0 12px 0; font-size: 12px; - color: var(--text-muted); + color: var(--text-secondary); text-transform: uppercase; + letter-spacing: 0.5px; } .device-detail-table { width: 100%; @@ -2318,7 +2321,7 @@ padding: 4px 0; } .device-detail-table td:first-child { - color: var(--text-muted); + color: var(--text-dim); width: 40%; } .indicator-list { @@ -2349,14 +2352,16 @@ margin: 0; padding-left: 20px; font-size: 12px; + color: var(--text-primary); } .device-reasons-list li { margin-bottom: 4px; + color: var(--text-secondary); } .device-detail-disclaimer { padding: 12px 16px; font-size: 10px; - color: var(--text-muted); + color: var(--text-secondary); background: rgba(74, 158, 255, 0.1); border-top: 1px solid rgba(74, 158, 255, 0.3); }