First commit

popup.css

@@ -0,0 +1,122 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  width: 300px;
+  background: #fff;
+  color: #333;
+}
+
+.container {
+  padding: 20px;
+  text-align: center;
+}
+
+.header {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 16px;
+}
+
+.shield {
+  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.15));
+}
+
+h1 {
+  font-size: 16px;
+  font-weight: 600;
+  color: #222;
+}
+
+.domain {
+  font-size: 14px;
+  font-weight: 500;
+  color: #555;
+  padding: 8px 12px;
+  background: #f5f6fa;
+  border-radius: 6px;
+  margin-bottom: 12px;
+  word-break: break-all;
+}
+
+.status {
+  font-size: 15px;
+  font-weight: 600;
+  margin-bottom: 8px;
+}
+
+.status.secure {
+  color: #27ae60;
+}
+
+.status.insecure {
+  color: #e74c3c;
+}
+
+.status.unknown {
+  color: #95a5a6;
+}
+
+.description {
+  font-size: 12px;
+  color: #777;
+  line-height: 1.5;
+  margin-bottom: 16px;
+}
+
+.recheck-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 8px 16px;
+  font-size: 12px;
+  font-weight: 500;
+  color: #555;
+  background: #f0f0f0;
+  border: 1px solid #ddd;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: all 0.15s;
+}
+
+.recheck-btn:hover {
+  background: #e4e4e4;
+  color: #333;
+}
+
+.recheck-btn:active {
+  transform: scale(0.97);
+}
+
+.recheck-btn.loading svg {
+  animation: spin 0.8s linear infinite;
+}
+
+@keyframes spin {
+  to { transform: rotate(360deg); }
+}
+
+/* Shield colors */
+.shield-green #shield-path {
+  fill: #27ae60;
+  stroke: #1e8449;
+  stroke-width: 1.5;
+}
+
+.shield-red #shield-path {
+  fill: #e74c3c;
+  stroke: #c0392b;
+  stroke-width: 1.5;
+}
+
+.shield-gray #shield-path {
+  fill: #95a5a6;
+  stroke: #7f8c8d;
+  stroke-width: 1.5;
+}