init: initial commit

2026-04-01 14:09:33 +08:00
commit aef2e152dc
66 changed files with 6540 additions and 0 deletions
@@ -0,0 +1,138 @@
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
+
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* ── Global Reset ────────────────────────────────────── */
+*, *::before, *::after { box-sizing: border-box; }
+
+html, body, #root {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  font-family: 'Inter', system-ui, sans-serif;
+  -webkit-font-smoothing: antialiased;
+}
+
+body {
+  background: transparent;
+  color: #e8e5ff;
+  overflow: hidden;
+  user-select: none;
+}
+
+/* ── Glassmorphism Variables ─────────────────────────── */
+:root {
+  --glass-bg:      rgba(14, 12, 28, 0.88);
+  --glass-border:  rgba(124, 110, 247, 0.25);
+  --glass-blur:    20px;
+  --accent:        #7c6ef7;
+  --accent-light:  #a599f9;
+  --accent-glow:   rgba(124,110,247,0.3);
+  --danger:        #ff5c7c;
+  --success:       #4ade80;
+  --text-primary:  #e8e5ff;
+  --text-muted:    rgba(232,229,255,0.5);
+  --radius:        16px;
+}
+
+/* ── Root Container ──────────────────────────────────── */
+.sidebar-root {
+  width: 350px;
+  height: 700px;
+  background: var(--glass-bg);
+  backdrop-filter: blur(var(--glass-blur)) saturate(180%);
+  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(180%);
+  border: 1px solid var(--glass-border);
+  border-radius: var(--radius);
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  position: relative;
+}
+
+/* ── Drag Region ─────────────────────────────────────── */
+.drag-region {
+  --wails-draggable: drag;
+  cursor: grab;
+}
+.drag-region:active { cursor: grabbing; }
+
+/* ── Scrollbar ───────────────────────────────────────── */
+.results-scroll::-webkit-scrollbar { width: 4px; }
+.results-scroll::-webkit-scrollbar-track { background: transparent; }
+.results-scroll::-webkit-scrollbar-thumb {
+  background: var(--glass-border);
+  border-radius: 4px;
+}
+
+/* ── Card ────────────────────────────────────────────── */
+.result-card {
+  background: rgba(255,255,255,0.04);
+  border: 1px solid rgba(255,255,255,0.08);
+  border-radius: 12px;
+  padding: 14px;
+  transition: all 0.2s ease;
+  cursor: pointer;
+  animation: slideIn 0.3s cubic-bezier(0.34,1.56,0.64,1);
+}
+.result-card:hover {
+  background: rgba(124,110,247,0.12);
+  border-color: rgba(124,110,247,0.4);
+  transform: translateY(-1px);
+  box-shadow: 0 4px 20px var(--accent-glow);
+}
+.result-card:active { transform: translateY(0); }
+
+/* ── Copy Toast ──────────────────────────────────────── */
+.copy-toast {
+  animation: fadeIn 0.15s ease, fadeOut 0.15s ease 0.85s forwards;
+}
+@keyframes fadeOut { to { opacity: 0; transform: translateY(-4px); } }
+@keyframes fadeIn  { from { opacity: 0; transform: translateY(4px); } }
+@keyframes slideIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
+
+/* ── Input ───────────────────────────────────────────── */
+.search-input {
+  background: rgba(255,255,255,0.06);
+  border: 1px solid rgba(255,255,255,0.12);
+  border-radius: 10px;
+  color: var(--text-primary);
+  outline: none;
+  width: 100%;
+  padding: 10px 14px 10px 38px;
+  font-size: 14px;
+  transition: border-color 0.2s, box-shadow 0.2s;
+}
+.search-input:focus {
+  border-color: var(--accent);
+  box-shadow: 0 0 0 3px var(--accent-glow);
+}
+.search-input::placeholder { color: var(--text-muted); }
+
+/* ── AI Panel ────────────────────────────────────────── */
+.ai-panel {
+  background: rgba(124,110,247,0.07);
+  border: 1px solid rgba(124,110,247,0.2);
+  border-radius: 12px;
+  padding: 14px;
+  font-size: 13px;
+  line-height: 1.7;
+  color: var(--text-primary);
+  min-height: 80px;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+/* ── Gradient Orbs ───────────────────────────────────── */
+.orb {
+  position: absolute;
+  border-radius: 50%;
+  filter: blur(60px);
+  pointer-events: none;
+  opacity: 0.18;
+  z-index: 0;
+}
+.orb-purple { width:200px; height:200px; background:#7c6ef7; top:-60px; right:-60px; }
+.orb-blue   { width:160px; height:160px; background:#38bdf8; bottom:-40px; left:-40px; }