{
  "id": "glass-panel",
  "name": "GlassPanel",
  "kind": "surface",
  "status": "draft-stable",
  "summary": "Dark matte glass container used for panels, cards, modal shells, dropdown shells, and admin content blocks.",
  "sourceRefs": [
    {
      "project": "nodedc_launcher",
      "file": "src/shared/ui/Glass.tsx"
    },
    {
      "project": "nodedc_launcher",
      "file": "src/styles/globals.css",
      "classes": ["glass-surface", "glass-surface--detail", "nodedc-glass-detail-surface", "admin-panel-nav", "admin-panel-content", "service-content-modal"]
    },
    {
      "project": "nodedc_taskmanager",
      "file": "plane-src/apps/web/styles/globals.css",
      "classes": ["nodedc-work-item-property-button", "nodedc-settings-card", "nodedc-modal-field", "nodedc-dropdown-surface"]
    }
  ],
  "tokens": {
    "radius": "card | modal | control depending on scale",
    "blur": "control | panel | modal | dropdown | detail",
    "background": "dark matte glass gradient over rgba black",
    "border": "none or transparent soft glass only"
  },
  "rules": [
    "Never use hard outline as the main visual boundary.",
    "Use background opacity, pseudo-layer glass, and backdrop blur to separate layers.",
    "For major shells use radius.card or radius.modal.",
    "For controls inside shells use radius.control."
  ]
}