{
  "sessionId": "session-1765032740748-n82tkqspp",
  "exportedAt": "2025-12-06T14:53:21.590Z",
  "logs": [
    {
      "timestamp": 1765032740748,
      "relativeTime": 0,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [App] Initializing application... color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [App] Initializing application...",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032740754,
      "relativeTime": 6,
      "level": "metric",
      "category": "performance",
      "message": "Page load completed",
      "data": {
        "domContentLoaded": 0.4000000059604645,
        "loadComplete": 0.09999999403953552,
        "totalTime": 234.19999998807907,
        "dnsLookup": 0,
        "tcpConnection": 0,
        "requestTime": 191.09999999403954,
        "responseTime": 0.5,
        "renderTime": null
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741055,
      "relativeTime": 307,
      "level": "network",
      "category": "fetch",
      "message": "FETCH https://dss.overbits.luz.uy/api/projects",
      "data": {
        "url": "https://dss.overbits.luz.uy/api/projects",
        "initiatorType": "fetch",
        "duration": 303.2000000178814,
        "transferSize": 527,
        "encodedBodySize": 227,
        "decodedBodySize": 227
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741056,
      "relativeTime": 308,
      "level": "log",
      "category": "console",
      "message": "[ConfigLoader] Configuration loaded successfully [object Object]",
      "data": {
        "args": [
          "[ConfigLoader] Configuration loaded successfully",
          {
            "dssHost": "localhost",
            "dssPort": "3456",
            "storybookPort": 6006
          }
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741056,
      "relativeTime": 308,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [App] Server configuration loaded color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [App] Server configuration loaded",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741057,
      "relativeTime": 309,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [PluginService] Registered plugin: Claude AI Assistant v1.0.0 color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [PluginService] Registered plugin: Claude AI Assistant v1.0.0",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741057,
      "relativeTime": 309,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [Plugin:Claude AI Assistant] Claude plugin initializing... color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [Plugin:Claude AI Assistant] Claude plugin initializing...",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741057,
      "relativeTime": 309,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [Plugin:Claude AI Assistant] Claude plugin initialized color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [Plugin:Claude AI Assistant] Claude plugin initialized",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741057,
      "relativeTime": 309,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [App] Plugins initialized color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [App] Plugins initialized",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741057,
      "relativeTime": 309,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [App] Messaging system initialized color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [App] Messaging system initialized",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741061,
      "relativeTime": 313,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [App] Router initialized with 12 routes color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [App] Router initialized with 12 routes",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741061,
      "relativeTime": 313,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [PluginService] Initialized plugin: Claude AI Assistant color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [PluginService] Initialized plugin: Claude AI Assistant",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741063,
      "relativeTime": 315,
      "level": "network",
      "category": "fetch",
      "message": "FETCH https://dss.overbits.luz.uy/api/config",
      "data": {
        "url": "https://dss.overbits.luz.uy/api/config",
        "initiatorType": "fetch",
        "duration": 307.30000001192093,
        "transferSize": 361,
        "encodedBodySize": 61,
        "decodedBodySize": 61
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741256,
      "relativeTime": 508,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udee1\ufe0f [App] Failed to load initial data color: #F44336; font-weight: bold Error: Health check failed",
      "data": {
        "args": [
          "%c\ud83d\udee1\ufe0f [App] Failed to load initial data",
          "color: #F44336; font-weight: bold",
          {}
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741260,
      "relativeTime": 512,
      "level": "log",
      "category": "console",
      "message": "%c\ud83d\udcad [App] Application initialized successfully color: #2196F3; font-weight: bold",
      "data": {
        "args": [
          "%c\ud83d\udcad [App] Application initialized successfully",
          "color: #2196F3; font-weight: bold"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032741308,
      "relativeTime": 560,
      "level": "network",
      "category": "fetch",
      "message": "FETCH https://dss.overbits.luz.uy/health",
      "data": {
        "url": "https://dss.overbits.luz.uy/health",
        "initiatorType": "fetch",
        "duration": 193.40000000596046,
        "transferSize": 321,
        "encodedBodySize": 21,
        "decodedBodySize": 21
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032747131,
      "relativeTime": 6383,
      "level": "debug",
      "category": "console",
      "message": "[BrowserLogger] Synced 16 logs to server",
      "data": {
        "args": [
          "[BrowserLogger] Synced 16 logs to server"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032747185,
      "relativeTime": 6437,
      "level": "network",
      "category": "fetch",
      "message": "FETCH https://dss.overbits.luz.uy/api/browser-logs",
      "data": {
        "url": "https://dss.overbits.luz.uy/api/browser-logs",
        "initiatorType": "fetch",
        "duration": 537.2999999821186,
        "transferSize": 443,
        "encodedBodySize": 143,
        "decodedBodySize": 143
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032762750,
      "relativeTime": 22002,
      "level": "info",
      "category": "snapshot",
      "message": "Navigation detected",
      "data": {
        "trigger": "navigation",
        "from": "https://dss.overbits.luz.uy/admin-ui/index.html",
        "to": "https://dss.overbits.luz.uy/admin-ui/index.html#settings",
        "snapshot": {
          "timestamp": 1765032762749,
          "url": "https://dss.overbits.luz.uy/admin-ui/index.html#settings",
          "html": "<html lang=\"en\" class=\"light\"><head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n  <title>Design System Server</title>\n  <link rel=\"icon\" type=\"image/svg+xml\" href=\"/admin-ui/favicon.svg\">\n\n  <!-- Design System Styles -->\n  <link rel=\"stylesheet\" href=\"/admin-ui/css/tokens.css\">\n  <link rel=\"stylesheet\" href=\"/admin-ui/css/base.css\">\n  <link rel=\"stylesheet\" href=\"/admin-ui/css/components.css\">\n\n  <!-- Markdown & Syntax Highlighting -->\n  <script src=\"https://cdn.jsdelivr.net/npm/marked/marked.min.js\"></script>\n  <script src=\"https://cdn.jsdelivr.net/npm/dompurify@3.0.6/dist/purify.min.js\"></script>\n  <script src=\"https://cdn.jsdelivr.net/npm/highlight.js@11.9.0/lib/highlight.min.js\"></script>\n\n  <style>\n    /* App Layout */\n    .app-layout {\n      display: grid;\n      grid-template-columns: 240px 1fr;\n      grid-template-rows: auto 1fr;\n      min-height: 100vh;\n    }\n\n    /* Sidebar */\n    .sidebar {\n      grid-row: 1 / -1;\n      background: var(--card);\n      border-right: 1px solid var(--border);\n      display: flex;\n      flex-direction: column;\n    }\n\n    .sidebar__header {\n      padding: var(--space-4) var(--space-5);\n      border-bottom: 1px solid var(--border);\n    }\n\n    .sidebar__logo {\n      display: flex;\n      align-items: center;\n      gap: var(--space-3);\n      font-weight: var(--font-semibold);\n      font-size: var(--text-lg);\n      color: var(--foreground);\n    }\n\n    .sidebar__logo-icon {\n      width: 2rem;\n      height: 2rem;\n      background: var(--primary);\n      border-radius: var(--radius);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: var(--primary-foreground);\n    }\n\n    .sidebar__nav {\n      flex: 1;\n      padding: var(--space-4);\n    }\n\n    .nav-section {\n      margin-bottom: var(--space-6);\n    }\n\n    .nav-section__title {\n      font-size: var(--text-xs);\n      font-weight: var(--font-medium);\n      color: var(--muted-foreground);\n      text-transform: uppercase;\n      letter-spacing: 0.05em;\n      margin-bottom: var(--space-2);\n      padding: 0 var(--space-3);\n    }\n\n    .nav-item {\n      display: flex;\n      align-items: center;\n      gap: var(--space-3);\n      padding: var(--space-2) var(--space-3);\n      border-radius: var(--radius);\n      color: var(--muted-foreground);\n      text-decoration: none;\n      font-size: var(--text-sm);\n      transition: all var(--duration-fast) var(--ease-default);\n      cursor: pointer;\n    }\n\n    .nav-item:hover {\n      background: var(--accent);\n      color: var(--accent-foreground);\n      text-decoration: none;\n    }\n\n    .nav-item.active {\n      background: var(--primary);\n      color: var(--primary-foreground);\n    }\n\n    .nav-item__icon {\n      width: 1.25rem;\n      height: 1.25rem;\n      opacity: 0.7;\n    }\n\n    .nav-item.active .nav-item__icon {\n      opacity: 1;\n    }\n\n    .sidebar__help {\n      padding: var(--space-3);\n      border-top: 1px solid var(--border);\n    }\n\n    .help-panel {\n      font-size: var(--text-xs);\n    }\n\n    .help-panel__toggle {\n      display: flex;\n      align-items: center;\n      gap: var(--space-2);\n      cursor: pointer;\n      color: var(--muted-foreground);\n      padding: var(--space-2);\n      border-radius: var(--radius);\n      list-style: none;\n    }\n\n    .help-panel__toggle:hover {\n      background: var(--accent);\n      color: var(--accent-foreground);\n    }\n\n    .help-panel__toggle::-webkit-details-marker {\n      display: none;\n    }\n\n    .help-panel__content {\n      padding: var(--space-2) var(--space-3);\n    }\n\n    .help-section {\n      margin-bottom: var(--space-3);\n    }\n\n    .help-section strong {\n      color: var(--foreground);\n      font-size: var(--text-xs);\n    }\n\n    .help-section ul, .help-section ol {\n      margin: var(--space-1) 0 0 var(--space-4);\n      padding: 0;\n      color: var(--muted-foreground);\n    }\n\n    .help-section li {\n      margin-bottom: 2px;\n    }\n\n    .sidebar__footer {\n      padding: var(--space-4);\n      border-top: 1px solid var(--border);\n    }\n\n    /* Header */\n    .app-header {\n      display: flex;\n      align-items: center;\n      gap: var(--space-4);\n      padding: var(--space-4) var(--space-6);\n      background: var(--card);\n      border-bottom: 1px solid var(--border);\n    }\n\n    .app-header__project-selector {\n      display: flex;\n      align-items: center;\n      gap: var(--space-2);\n    }\n\n    .project-selector {\n      display: flex;\n      align-items: center;\n      gap: var(--space-2);\n      padding: var(--space-2) var(--space-3);\n      background: var(--muted);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      font-size: var(--text-sm);\n      width: 200px;\n    }\n\n    .project-selector__label {\n      font-weight: var(--font-medium);\n      color: var(--muted-foreground);\n      font-size: var(--text-xs);\n      text-transform: uppercase;\n      letter-spacing: 0.05em;\n    }\n\n    .project-selector__select {\n      flex: 1;\n      background: transparent;\n      border: none;\n      color: var(--foreground);\n      font-size: var(--text-sm);\n      font-weight: var(--font-medium);\n      outline: none;\n      cursor: pointer;\n      padding: var(--space-1) 0;\n    }\n\n    .project-selector__select option {\n      background: var(--popover);\n      color: var(--popover-foreground);\n    }\n\n    .project-selector__icon {\n      width: 16px;\n      height: 16px;\n      color: var(--primary);\n    }\n\n    .app-header__team-selector {\n      display: flex;\n      align-items: center;\n    }\n\n    .team-select {\n      padding: var(--space-2) var(--space-3);\n      background: var(--muted);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      color: var(--foreground);\n      font-size: var(--text-sm);\n      cursor: pointer;\n      width: 200px;\n    }\n\n    .team-select:focus {\n      outline: none;\n      border-color: var(--ring);\n    }\n\n    .app-header__actions {\n      display: flex;\n      align-items: center;\n      gap: var(--space-3);\n      margin-left: auto;\n    }\n\n    /* Main Content */\n    .app-main {\n      display: grid;\n      grid-template-columns: 1fr;\n      overflow: hidden;\n      position: relative;\n    }\n\n    .app-content {\n      padding: var(--space-6);\n      padding-right: 340px;\n      overflow-y: auto;\n    }\n\n    .app-sidebar {\n      width: 320px;\n      height: 100vh;\n      min-height: 100vh;\n      border-left: 1px solid var(--border);\n      background: var(--card);\n      display: flex;\n      flex-direction: column;\n      transition: width 0.2s ease, transform 0.2s ease;\n      position: fixed;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      z-index: 50;\n    }\n\n    .app-sidebar.collapsed {\n      width: 0;\n      overflow: hidden;\n      border-left: none;\n    }\n\n    .sidebar-toggle {\n      position: fixed;\n      right: 320px;\n      bottom: 20px;\n      z-index: 49;\n      width: 48px;\n      height: 48px;\n      background: var(--card);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: var(--muted-foreground);\n      transition: right 0.2s ease, background 0.15s;\n      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n    }\n\n    .sidebar-toggle:hover {\n      background: var(--accent);\n      color: var(--foreground);\n    }\n\n    .sidebar-toggle.collapsed {\n      right: 0;\n    }\n\n    .sidebar-toggle svg {\n      transition: transform 0.2s ease;\n    }\n\n    .sidebar-toggle.collapsed svg {\n      transform: rotate(180deg);\n    }\n\n    /* Page Header */\n    .page-header h1 {\n      font-size: var(--text-2xl);\n      margin-bottom: var(--space-1);\n    }\n\n    /* Docs Layout */\n    .docs-layout {\n      display: grid;\n      grid-template-columns: 200px 1fr;\n      gap: var(--space-6);\n      min-height: 0;\n    }\n\n    .docs-nav {\n      position: sticky;\n      top: 0;\n      height: fit-content;\n    }\n\n    .docs-nav__section {\n      margin-bottom: var(--space-4);\n    }\n\n    .docs-nav__title {\n      font-size: var(--text-xs);\n      font-weight: var(--font-semibold);\n      color: var(--muted-foreground);\n      text-transform: uppercase;\n      letter-spacing: 0.05em;\n      margin-bottom: var(--space-2);\n    }\n\n    .docs-nav__link {\n      display: block;\n      padding: var(--space-1) var(--space-2);\n      font-size: var(--text-sm);\n      color: var(--muted-foreground);\n      text-decoration: none;\n      border-radius: var(--radius);\n      cursor: pointer;\n    }\n\n    .docs-nav__link:hover {\n      color: var(--foreground);\n      background: var(--accent);\n    }\n\n    .docs-nav__link.active {\n      color: var(--primary);\n      background: var(--primary-light, oklch(0.65 0.18 250 / 0.1));\n    }\n\n    .docs-content {\n      max-width: 700px;\n    }\n\n    .docs-content h2 {\n      font-size: var(--text-xl);\n      font-weight: var(--font-semibold);\n      margin-bottom: var(--space-4);\n      padding-bottom: var(--space-2);\n      border-bottom: 1px solid var(--border);\n    }\n\n    .docs-content h3 {\n      font-size: var(--text-base);\n      font-weight: var(--font-semibold);\n      margin: var(--space-4) 0 var(--space-2);\n    }\n\n    .docs-content p {\n      margin-bottom: var(--space-3);\n      line-height: 1.6;\n    }\n\n    .docs-content ul, .docs-content ol {\n      margin: 0 0 var(--space-3) var(--space-4);\n      line-height: 1.6;\n    }\n\n    .docs-content li {\n      margin-bottom: var(--space-1);\n    }\n\n    .docs-content pre {\n      background: var(--muted);\n      padding: var(--space-3);\n      border-radius: var(--radius);\n      overflow-x: auto;\n      margin-bottom: var(--space-3);\n      font-size: var(--text-sm);\n    }\n\n    .docs-content code {\n      font-family: ui-monospace, monospace;\n      font-size: 0.9em;\n    }\n\n    .docs-content a {\n      color: var(--primary);\n    }\n\n    /* Stats */\n    .stat {\n      text-align: center;\n    }\n\n    .stat__label {\n      font-size: var(--text-sm);\n      color: var(--muted-foreground);\n      margin-bottom: var(--space-1);\n    }\n\n    .stat__value {\n      font-size: var(--text-2xl);\n      font-weight: var(--font-bold);\n    }\n\n    /* Status Dot */\n    .status-dot {\n      width: 0.5rem;\n      height: 0.5rem;\n      border-radius: var(--radius-full);\n      background: var(--muted);\n    }\n\n    .status-dot--success { background: var(--success); }\n    .status-dot--warning { background: var(--warning); }\n    .status-dot--error { background: var(--destructive); }\n\n    /* Responsive */\n    @media (max-width: 1024px) {\n      .app-main {\n        grid-template-columns: 1fr;\n      }\n\n      .app-sidebar {\n        display: none;\n      }\n    }\n\n    @media (max-width: 768px) {\n      .app-layout {\n        grid-template-columns: 1fr;\n      }\n\n      .sidebar {\n        display: none;\n      }\n    }\n  </style>\n</head>\n<body>\n  <div id=\"app\" class=\"app-layout\">\n    <!-- Sidebar -->\n    <aside class=\"sidebar\">\n      <div class=\"sidebar__header\">\n        <div class=\"sidebar__logo\">\n          <div class=\"sidebar__logo-icon\">\n            <svg width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M12 2L2 7l10 5 10-5-10-5z\"></path>\n              <path d=\"M2 17l10 5 10-5\"></path>\n              <path d=\"M2 12l10 5 10-5\"></path>\n            </svg>\n          </div>\n          <span>DSS</span>\n        </div>\n      </div>\n\n      <nav class=\"sidebar__nav\" aria-label=\"Main navigation\">\n        <div class=\"nav-section\">\n          <div class=\"nav-section__title\">Overview</div>\n          <a class=\"nav-item\" data-page=\"dashboard\" href=\"#dashboard\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <rect x=\"3\" y=\"3\" width=\"7\" height=\"9\" rx=\"1\"></rect>\n              <rect x=\"14\" y=\"3\" width=\"7\" height=\"5\" rx=\"1\"></rect>\n              <rect x=\"14\" y=\"12\" width=\"7\" height=\"9\" rx=\"1\"></rect>\n              <rect x=\"3\" y=\"16\" width=\"7\" height=\"5\" rx=\"1\"></rect>\n            </svg>\n            Dashboard\n          </a>\n          <a class=\"nav-item\" data-page=\"projects\" href=\"#projects\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M3 3h18v18H3z\"></path>\n              <path d=\"M21 9H3\"></path>\n              <path d=\"M9 21V9\"></path>\n            </svg>\n            Projects\n          </a>\n        </div>\n\n        <div class=\"nav-section\">\n          <div class=\"nav-section__title\">Tools</div>\n          <a class=\"nav-item\" data-page=\"services\" href=\"#services\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <rect x=\"3\" y=\"3\" width=\"7\" height=\"7\" rx=\"1\"></rect>\n              <rect x=\"14\" y=\"3\" width=\"7\" height=\"7\" rx=\"1\"></rect>\n              <rect x=\"3\" y=\"14\" width=\"7\" height=\"7\" rx=\"1\"></rect>\n              <rect x=\"14\" y=\"14\" width=\"7\" height=\"7\" rx=\"1\"></rect>\n            </svg>\n            Services\n          </a>\n          <a class=\"nav-item\" data-page=\"quick-wins\" href=\"#quick-wins\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <polygon points=\"13 2 3 14 12 14 11 22 21 10 12 10 13 2\"></polygon>\n            </svg>\n            Quick Wins\n          </a>\n          <a class=\"nav-item\" data-page=\"chat\" href=\"#chat\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"></path>\n            </svg>\n            Chat\n          </a>\n        </div>\n\n        <div class=\"nav-section\">\n          <div class=\"nav-section__title\">Design System</div>\n          <a class=\"nav-item\" data-page=\"tokens\" href=\"#tokens\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n              <circle cx=\"12\" cy=\"12\" r=\"4\"></circle>\n            </svg>\n            Tokens\n          </a>\n          <a class=\"nav-item\" data-page=\"components\" href=\"#components\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"></rect>\n              <path d=\"M3 9h18\"></path>\n              <path d=\"M9 21V9\"></path>\n            </svg>\n            Components\n          </a>\n          <a class=\"nav-item\" data-page=\"figma\" href=\"#figma\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M5 5.5A3.5 3.5 0 0 1 8.5 2H12v7H8.5A3.5 3.5 0 0 1 5 5.5z\"></path>\n              <path d=\"M12 2h3.5a3.5 3.5 0 1 1 0 7H12V2z\"></path>\n              <path d=\"M12 12.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 1 1-7 0z\"></path>\n              <path d=\"M5 19.5A3.5 3.5 0 0 1 8.5 16H12v3.5a3.5 3.5 0 1 1-7 0z\"></path>\n              <path d=\"M5 12.5A3.5 3.5 0 0 1 8.5 9H12v7H8.5A3.5 3.5 0 0 1 5 12.5z\"></path>\n            </svg>\n            Figma\n          </a>\n          <a id=\"storybook-link\" class=\"nav-item\" href=\"https://localhost/storybook/\" target=\"_blank\" tabindex=\"0\" title=\"Open Storybook at https://localhost/storybook/\" style=\"pointer-events: auto; opacity: 1;\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z\"></path>\n              <path d=\"M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z\"></path>\n            </svg>\n            Storybook\n          </a>\n        </div>\n\n        <div class=\"nav-section\">\n          <div class=\"nav-section__title\">System</div>\n          <a class=\"nav-item\" data-page=\"docs\" href=\"#docs\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M4 19.5A2.5 2.5 0 0 1 6.5 17H20\"></path>\n              <path d=\"M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z\"></path>\n            </svg>\n            Docs\n          </a>\n          <a class=\"nav-item\" data-page=\"teams\" href=\"#teams\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"></path>\n              <circle cx=\"9\" cy=\"7\" r=\"4\"></circle>\n              <path d=\"M22 21v-2a4 4 0 0 0-3-3.87\"></path>\n              <path d=\"M16 3.13a4 4 0 0 1 0 7.75\"></path>\n            </svg>\n            Teams\n          </a>\n          <a class=\"nav-item\" data-page=\"audit\" href=\"#audit\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"></path>\n              <polyline points=\"14 2 14 8 20 8\"></polyline>\n              <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"></line>\n              <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"></line>\n              <polyline points=\"10 9 9 9 8 9\"></polyline>\n            </svg>\n            Audit Log\n          </a>\n          <a class=\"nav-item\" data-page=\"plugins\" href=\"#plugins\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M12 2v4m0 12v4M4.93 4.93l2.83 2.83m8.48 8.48l2.83 2.83M2 12h4m12 0h4M4.93 19.07l2.83-2.83m8.48-8.48l2.83-2.83\"></path>\n              <circle cx=\"12\" cy=\"12\" r=\"3\"></circle>\n            </svg>\n            Plugins\n          </a>\n          <a class=\"nav-item active\" data-page=\"settings\" href=\"#settings\" tabindex=\"0\">\n            <svg class=\"nav-item__icon\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <path d=\"M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z\"></path>\n              <circle cx=\"12\" cy=\"12\" r=\"3\"></circle>\n            </svg>\n            Settings\n          </a>\n        </div>\n      </nav>\n\n      <div class=\"sidebar__help\">\n        <details class=\"help-panel\">\n          <summary class=\"help-panel__toggle\" tabindex=\"0\">\n            <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\">\n              <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n              <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\"></path>\n              <line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\"></line>\n            </svg>\n            Quick Guide\n          </summary>\n          <div class=\"help-panel__content\">\n            <div class=\"help-section\" data-team=\"ui\" style=\"display: none;\">\n              <strong>UI Team</strong>\n              <ul>\n                <li>Extract tokens from Figma</li>\n                <li>Sync to CSS variables</li>\n                <li>Generate components</li>\n                <li>Check token drift</li>\n              </ul>\n            </div>\n            <div class=\"help-section\" data-team=\"ux\">\n              <strong>UX Team</strong>\n              <ul>\n                <li>Add Figma files to project</li>\n                <li>Run visual diff checks</li>\n                <li>Review token consistency</li>\n                <li>Validate components</li>\n              </ul>\n            </div>\n            <div class=\"help-section\" data-team=\"qa\" style=\"display: none;\">\n              <strong>QA Team</strong>\n              <ul>\n                <li>Define ESRE test cases</li>\n                <li>Run component validation</li>\n                <li>Review visual regressions</li>\n                <li>Export audit logs</li>\n              </ul>\n            </div>\n            <div class=\"help-section\" data-team=\"all\">\n              <strong>Getting Started</strong>\n              <ol>\n                <li>Create a project</li>\n                <li>Add Figma file key</li>\n                <li>Extract &amp; sync tokens</li>\n                <li>Use AI chat for help</li>\n              </ol>\n            </div>\n          </div>\n        </details>\n      </div>\n      <div class=\"sidebar__footer\">\n        <ds-badge variant=\"outline\" dot=\"\">v0.8.0</ds-badge>\n      </div>\n    </aside>\n\n    <!-- Header -->\n    <header class=\"app-header\">\n      <div class=\"app-header__project-selector\" id=\"project-selector-container\">\n        <!-- Project selector will be rendered here -->\n      </div>\n      <div class=\"app-header__team-selector\">\n        <label for=\"team-context-select\" class=\"sr-only\">Select team context</label>\n        <select class=\"team-select\" id=\"team-context-select\" aria-label=\"Team context\">\n          <option value=\"all\">All Teams</option>\n          <option value=\"ui\">UI Team</option>\n          <option value=\"ux\">UX Team</option>\n          <option value=\"qa\">QA Team</option>\n        </select>\n      </div>\n      <div class=\"app-header__actions\">\n        <ds-button variant=\"ghost\" size=\"icon\" title=\"Toggle theme\" id=\"theme-toggle\" tabindex=\"0\" aria-label=\"Toggle dark/light theme\">\n          <svg width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n            <path d=\"M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0z\"></path>\n          </svg>\n        </ds-button>\n        <ds-button variant=\"ghost\" size=\"icon\" title=\"Notifications\" tabindex=\"0\" aria-label=\"View notifications\">\n          <svg width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n            <path d=\"M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9\"></path>\n            <path d=\"M10.3 21a1.94 1.94 0 0 0 3.4 0\"></path>\n          </svg>\n        </ds-button>\n        <div class=\"ds-avatar\" tabindex=\"0\" role=\"button\" aria-label=\"User profile menu\">\n          <span>U</span>\n        </div>\n      </div>\n    </header>\n\n    <!-- Main Content Area -->\n    <main class=\"app-main\">\n      <div id=\"page-content\" class=\"app-content\">\n      <div class=\"page-header\">\n        <h1>Settings</h1>\n        <p class=\"text-muted\">Configure your design system server</p>\n      </div>\n\n      <div class=\"mt-6 flex flex-col gap-6\">\n        \n        \n          \n            Server Mode\n            Choose how DSS operates\n          \n          \n            <div class=\"flex gap-4\">\n              <div data-mode=\"local\" data-action=\"setMode\" style=\"background: var(--muted)\" class=\"flex-1 p-4 rounded cursor-pointer ring-2 ring-primary\">\n                <h4 class=\"font-medium mb-1\">Local Dev Companion</h4>\n                <p class=\"text-sm text-muted\">Run alongside your project, provides UI dev assistance, component preview, and local services.</p>\n              </div>\n              <div data-mode=\"server\" data-action=\"setMode\" style=\"background: var(--muted)\" class=\"flex-1 p-4 rounded cursor-pointer\">\n                <h4 class=\"font-medium mb-1\">Remote Server</h4>\n                <p class=\"text-sm text-muted\">Deployed centrally, serves design systems to teams, multi-project management.</p>\n              </div>\n            </div>\n          \n        \n\n        \n        \n          \n            Figma Integration\n            Connect to Figma API\n            \n              Not configured\n            \n          \n          \n            <div class=\"flex flex-col gap-4\">\n              \n              <p class=\"text-xs text-muted\">\n                Get your token from <a class=\"text-primary\" target=\"_blank\" href=\"https://www.figma.com/developers/api#access-tokens\">Figma Settings \u2192 Personal Access Tokens</a>\n              </p>\n              <div class=\"flex gap-2\">\n                \n                  Save Token\n                \n                \n                  Test Connection\n                \n              </div>\n              \n            </div>\n          \n        \n\n        \n        \n          \n            External Tools &amp; Integrations\n            Configure connected tools and services\n          \n          \n            <div class=\"flex flex-col gap-4\">\n              \n      <div style=\"background: var(--muted); border-color: var(--border)\" class=\"p-4 rounded border\">\n        <div class=\"flex items-center justify-between mb-3\">\n          <div class=\"flex items-center gap-2\">\n            <span class=\"font-medium\">Storybook</span>\n            documentation\n          </div>\n          \n            \n              Open\n            \n          \n        </div>\n        <p class=\"text-sm text-muted mb-3\">Component documentation and playground</p>\n        \n          <div class=\"text-xs text-muted\">\n            URL: <code>https://localhost/storybook/</code>\n            Host from server config: <code>localhost</code>\n          </div>\n        \n        \n      </div>\n    \n      <div style=\"background: var(--muted); border-color: var(--border)\" class=\"p-4 rounded border\">\n        <div class=\"flex items-center justify-between mb-3\">\n          <div class=\"flex items-center gap-2\">\n            <span class=\"font-medium\">Figma</span>\n            design\n          </div>\n          \n            \n              Open\n            \n          \n        </div>\n        <p class=\"text-sm text-muted mb-3\">Design file integration and token extraction</p>\n        \n        \n          <div class=\"text-xs text-muted\">\n            Token status: Check connection above\n          </div>\n        \n      </div>\n    \n            </div>\n          \n        \n\n        \n        \n          \n            Companion Services\n            Discovered and configured services\n          \n          \n            <div class=\"grid grid-cols-3 gap-4\">\n              \n      <div style=\"background: var(--muted)\" class=\"p-4 rounded\">\n        <div class=\"flex items-center justify-between mb-2\">\n          <h4 class=\"font-medium\">Storybook</h4>\n          <span class=\"status-dot\"></span>\n        </div>\n        <p class=\"text-sm text-muted mb-2\">\n          Not detected\n        </p>\n        \n      </div>\n    \n              \n      <div style=\"background: var(--muted)\" class=\"p-4 rounded\">\n        <div class=\"flex items-center justify-between mb-2\">\n          <h4 class=\"font-medium\">Vite Dev Server</h4>\n          <span class=\"status-dot\"></span>\n        </div>\n        <p class=\"text-sm text-muted mb-2\">\n          Not detected\n        </p>\n        \n      </div>\n    \n              \n      <div style=\"background: var(--muted)\" class=\"p-4 rounded\">\n        <div class=\"flex items-center justify-between mb-2\">\n          <h4 class=\"font-medium\">Next.js</h4>\n          <span class=\"status-dot\"></span>\n        </div>\n        <p class=\"text-sm text-muted mb-2\">\n          Not detected\n        </p>\n        \n      </div>\n    \n            </div>\n            <div class=\"mt-4\">\n              \n                Refresh Services\n              \n            </div>\n          \n        \n\n        \n        \n          \n            Features\n            Enable or disable DSS features\n          \n          \n            <div class=\"flex flex-col gap-3\">\n              \n      <div style=\"background: var(--muted)\" class=\"flex items-center justify-between p-3 rounded\">\n        <div>\n          <div class=\"font-medium\">Visual QA</div>\n          <div class=\"text-sm text-muted\">Compare Figma designs with implementation</div>\n        </div>\n        \n          Enabled\n        \n      </div>\n    \n              \n      <div style=\"background: var(--muted)\" class=\"flex items-center justify-between p-3 rounded\">\n        <div>\n          <div class=\"font-medium\">Token Sync</div>\n          <div class=\"text-sm text-muted\">Sync design tokens to code</div>\n        </div>\n        \n          Enabled\n        \n      </div>\n    \n              \n      <div style=\"background: var(--muted)\" class=\"flex items-center justify-between p-3 rounded\">\n        <div>\n          <div class=\"font-medium\">Code Generation</div>\n          <div class=\"text-sm text-muted\">Generate component code from Figma</div>\n        </div>\n        \n          Enabled\n        \n      </div>\n    \n              \n      <div style=\"background: var(--muted)\" class=\"flex items-center justify-between p-3 rounded\">\n        <div>\n          <div class=\"font-medium\">AI Advisor</div>\n          <div class=\"text-sm text-muted\">Get AI suggestions for design system improvements</div>\n        </div>\n        \n          Enabled\n        \n      </div>\n    \n            </div>\n          \n        \n\n        \n        \n          \n            Appearance\n            Customize the interface\n          \n          \n            <div class=\"flex items-center justify-between\">\n              <span>Dark Mode</span>\n              \n                Toggle Theme\n              \n            </div>\n          \n        \n\n        \n        \n          \n            Output Configuration\n            Token and component generation settings\n          \n          \n            <div class=\"grid grid-cols-2 gap-4\">\n              \n              \n            </div>\n          \n        \n\n        \n        \n          \n            \u26a0\ufe0f Danger Zone\n            Irreversible operations - use with caution\n          \n          \n            <div class=\"flex flex-col gap-4\">\n              <div>\n                <h4 class=\"font-medium mb-2\">Reset DSS to Fresh State</h4>\n                <p class=\"text-sm text-muted mb-3\">\n                  This will delete all user-created themes, cached data, and project databases.\n                  The DSS structure and default themes will be preserved.\n                </p>\n                \n                  Reset DSS\n                \n              </div>\n            </div>\n          \n        \n\n        \n        \n          \n            API Status\n          \n          \n            <div class=\"flex flex-col gap-2 text-sm\">\n              <div class=\"flex justify-between\">\n                <span>API Mode:</span>\n                \n                  Live\n                \n              </div>\n              <div class=\"flex justify-between\">\n                <span>Base URL:</span>\n                <span class=\"text-muted\">/api</span>\n              </div>\n            </div>\n          \n        \n      </div>\n    </div>\n\n      <!-- Right Sidebar - AI Chat -->\n      <aside class=\"app-sidebar collapsed\" id=\"ai-sidebar\">\n        <ds-ai-chat></ds-ai-chat>\n      </aside>\n      <button class=\"sidebar-toggle collapsed\" id=\"sidebar-toggle\" title=\"Toggle AI Assistant\" tabindex=\"0\" aria-label=\"Toggle AI Assistant sidebar\" aria-controls=\"ai-sidebar\" aria-expanded=\"true\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n          <path d=\"M9 18l6-6-6-6\"></path>\n        </svg>\n      </button>\n    </main>\n  </div>\n\n  <!-- Load Components -->\n  <script type=\"module\">\n    // Import theme manager first (loads saved theme from cookie)\n    import themeManager from '/admin-ui/js/core/theme.js';\n\n    // Import all components\n    import '/admin-ui/js/components/ds-button.js';\n    import '/admin-ui/js/components/ds-card.js';\n    import '/admin-ui/js/components/ds-input.js';\n    import '/admin-ui/js/components/ds-badge.js';\n    import '/admin-ui/js/core/ai.js';\n\n    // Import browser logger for debugging\n    import '/admin-ui/js/core/browser-logger.js';\n\n    // Import and initialize app\n    import app from '/admin-ui/js/core/app.js';\n\n    // Initialize when DOM is ready\n    document.addEventListener('DOMContentLoaded', () => {\n      app.init();\n\n      // Setup theme toggle button\n      const themeToggle = document.getElementById('theme-toggle');\n      if (themeToggle) {\n        themeToggle.addEventListener('click', () => {\n          themeManager.toggle();\n        });\n      }\n\n      // Setup team context selector\n      const teamSelect = document.getElementById('team-context-select');\n      const updateHelpSections = (team) => {\n        document.querySelectorAll('.help-section').forEach(section => {\n          const sectionTeam = section.dataset.team;\n          section.style.display = (team === 'all' || sectionTeam === team || sectionTeam === 'all') ? '' : 'none';\n        });\n      };\n\n      if (teamSelect) {\n        const savedTeam = localStorage.getItem('dss_team_context') || 'all';\n        teamSelect.value = savedTeam;\n        updateHelpSections(savedTeam);\n\n        teamSelect.addEventListener('change', (e) => {\n          const team = e.target.value;\n          localStorage.setItem('dss_team_context', team);\n          updateHelpSections(team);\n          window.dispatchEvent(new CustomEvent('team-context-changed', {\n            detail: { team }\n          }));\n        });\n      }\n\n      // Setup AI sidebar toggle\n      const sidebarToggle = document.getElementById('sidebar-toggle');\n      const aiSidebar = document.getElementById('ai-sidebar');\n      if (sidebarToggle && aiSidebar) {\n        // Restore saved state\n        const sidebarCollapsed = localStorage.getItem('dss_ai_sidebar_collapsed') === 'true';\n        if (sidebarCollapsed) {\n          aiSidebar.classList.add('collapsed');\n          sidebarToggle.classList.add('collapsed');\n        }\n\n        sidebarToggle.addEventListener('click', () => {\n          const isCollapsed = aiSidebar.classList.toggle('collapsed');\n          sidebarToggle.classList.toggle('collapsed', isCollapsed);\n          localStorage.setItem('dss_ai_sidebar_collapsed', isCollapsed);\n        });\n      }\n    });\n  </script>\n\n\n<div id=\"notifications\" class=\"notification-container\">\n        <div class=\"notification notification--error\">\n          Server offline. Start DSS API first.\n        </div>\n      </div></body></html>",
          "viewport": {
            "width": 1244,
            "height": 958,
            "devicePixelRatio": 2
          },
          "title": "Design System Server"
        }
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html#settings",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032771806,
      "relativeTime": 31058,
      "level": "network",
      "category": "fetch",
      "message": "FETCH https://dss.overbits.luz.uy/health",
      "data": {
        "url": "https://dss.overbits.luz.uy/health",
        "initiatorType": "fetch",
        "duration": 204.7000000178814,
        "transferSize": 581,
        "encodedBodySize": 281,
        "decodedBodySize": 281
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html#settings",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032772317,
      "relativeTime": 31569,
      "level": "debug",
      "category": "console",
      "message": "[BrowserLogger] Synced 20 logs to server",
      "data": {
        "args": [
          "[BrowserLogger] Synced 20 logs to server"
        ]
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html#settings",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    },
    {
      "timestamp": 1765032772369,
      "relativeTime": 31621,
      "level": "network",
      "category": "fetch",
      "message": "FETCH https://dss.overbits.luz.uy/api/browser-logs",
      "data": {
        "url": "https://dss.overbits.luz.uy/api/browser-logs",
        "initiatorType": "fetch",
        "duration": 721.1999999880791,
        "transferSize": 443,
        "encodedBodySize": 143,
        "decodedBodySize": 143
      },
      "url": "https://dss.overbits.luz.uy/admin-ui/index.html#settings",
      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
    }
  ],
  "diagnostic": {
    "sessionId": "session-1765032740748-n82tkqspp",
    "uptime": 60842,
    "totalLogs": 22,
    "errorCount": 0,
    "warnCount": 0,
    "networkRequests": 6,
    "memory": {
      "usedJSHeapSize": 194703460,
      "jsHeapSizeLimit": 4294967296,
      "usagePercent": "4.53"
    },
    "url": "https://dss.overbits.luz.uy/admin-ui/index.html#settings",
    "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36",
    "recentErrors": [],
    "recentNetworkRequests": [
      {
        "timestamp": 1765032772369,
        "relativeTime": 31621,
        "level": "network",
        "category": "fetch",
        "message": "FETCH https://dss.overbits.luz.uy/api/browser-logs",
        "data": {
          "url": "https://dss.overbits.luz.uy/api/browser-logs",
          "initiatorType": "fetch",
          "duration": 721.1999999880791,
          "transferSize": 443,
          "encodedBodySize": 143,
          "decodedBodySize": 143
        },
        "url": "https://dss.overbits.luz.uy/admin-ui/index.html#settings",
        "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
      },
      {
        "timestamp": 1765032771806,
        "relativeTime": 31058,
        "level": "network",
        "category": "fetch",
        "message": "FETCH https://dss.overbits.luz.uy/health",
        "data": {
          "url": "https://dss.overbits.luz.uy/health",
          "initiatorType": "fetch",
          "duration": 204.7000000178814,
          "transferSize": 581,
          "encodedBodySize": 281,
          "decodedBodySize": 281
        },
        "url": "https://dss.overbits.luz.uy/admin-ui/index.html#settings",
        "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
      },
      {
        "timestamp": 1765032747185,
        "relativeTime": 6437,
        "level": "network",
        "category": "fetch",
        "message": "FETCH https://dss.overbits.luz.uy/api/browser-logs",
        "data": {
          "url": "https://dss.overbits.luz.uy/api/browser-logs",
          "initiatorType": "fetch",
          "duration": 537.2999999821186,
          "transferSize": 443,
          "encodedBodySize": 143,
          "decodedBodySize": 143
        },
        "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
        "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
      },
      {
        "timestamp": 1765032741308,
        "relativeTime": 560,
        "level": "network",
        "category": "fetch",
        "message": "FETCH https://dss.overbits.luz.uy/health",
        "data": {
          "url": "https://dss.overbits.luz.uy/health",
          "initiatorType": "fetch",
          "duration": 193.40000000596046,
          "transferSize": 321,
          "encodedBodySize": 21,
          "decodedBodySize": 21
        },
        "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
        "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
      },
      {
        "timestamp": 1765032741063,
        "relativeTime": 315,
        "level": "network",
        "category": "fetch",
        "message": "FETCH https://dss.overbits.luz.uy/api/config",
        "data": {
          "url": "https://dss.overbits.luz.uy/api/config",
          "initiatorType": "fetch",
          "duration": 307.30000001192093,
          "transferSize": 361,
          "encodedBodySize": 61,
          "decodedBodySize": 61
        },
        "url": "https://dss.overbits.luz.uy/admin-ui/index.html",
        "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36"
      }
    ]
  }
}