[{"data":1,"prerenderedAt":1070},["ShallowReactive",2],{"navigation:en":3,"\u002Fdocs\u002Fsaas-starter-kit\u002Fconcepts\u002Fdesign-system:en":311},[4],{"title":5,"path":6,"stem":7,"children":8,"icon":10},"Nuxfire Docs","\u002Fdocs","docs\u002F0.index",[9,11,152],{"title":5,"path":6,"stem":7,"icon":10},"i-lucide-layout-grid",{"title":12,"path":13,"stem":14,"children":15,"icon":151},"SaaS Starter Kit","\u002Fdocs\u002Fsaas-starter-kit","docs\u002F1.saas-starter-kit\u002F0.index",[16,19,63,129],{"title":17,"path":13,"stem":14,"icon":18},"What is the SaaS Starter Kit?","i-lucide-info",{"title":20,"icon":21,"hide":22,"path":23,"stem":24,"children":25,"page":62},"Getting Started","i-lucide-play",true,"\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started","docs\u002F1.saas-starter-kit\u002F1.getting-started",[26,30,34,38,42,46,50,54,58],{"title":27,"path":28,"stem":29},"Quick Start","\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started\u002Fquick-start","docs\u002F1.saas-starter-kit\u002F1.getting-started\u002F0.quick-start",{"title":31,"path":32,"stem":33},"Installation","\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started\u002Finstallation","docs\u002F1.saas-starter-kit\u002F1.getting-started\u002F1.installation",{"title":35,"path":36,"stem":37},"Cloudflare Access","\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started\u002Fcloudflare-access","docs\u002F1.saas-starter-kit\u002F1.getting-started\u002F2.cloudflare-access",{"title":39,"path":40,"stem":41},"Configuration","\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started\u002Fconfiguration","docs\u002F1.saas-starter-kit\u002F1.getting-started\u002F3.configuration",{"title":43,"path":44,"stem":45},"Secrets","\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started\u002Fsecrets","docs\u002F1.saas-starter-kit\u002F1.getting-started\u002F4.secrets",{"title":47,"path":48,"stem":49},"Environment Variables","\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started\u002Fenvironment-variables","docs\u002F1.saas-starter-kit\u002F1.getting-started\u002F5.environment-variables",{"title":51,"path":52,"stem":53},"Deploy","\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started\u002Fdeploy","docs\u002F1.saas-starter-kit\u002F1.getting-started\u002F6.deploy",{"title":55,"path":56,"stem":57},"Local Development","\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started\u002Flocal-development","docs\u002F1.saas-starter-kit\u002F1.getting-started\u002F7.local-development",{"title":59,"path":60,"stem":61},"Project Structure","\u002Fdocs\u002Fsaas-starter-kit\u002Fgetting-started\u002Fproject-structure","docs\u002F1.saas-starter-kit\u002F1.getting-started\u002F8.project-structure",false,{"title":64,"icon":65,"hide":22,"path":66,"stem":67,"children":68,"page":62},"Features","i-lucide-box","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures","docs\u002F1.saas-starter-kit\u002F2.features",[69,73,77,81,85,89,93,97,101,105,109,113,117,121,125],{"title":70,"path":71,"stem":72},"Authentication","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fauth","docs\u002F1.saas-starter-kit\u002F2.features\u002F1.auth",{"title":74,"path":75,"stem":76},"Rate Limiting","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Frate-limiting","docs\u002F1.saas-starter-kit\u002F2.features\u002F10.rate-limiting",{"title":78,"path":79,"stem":80},"WebSockets","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fwebsockets","docs\u002F1.saas-starter-kit\u002F2.features\u002F11.websockets",{"title":82,"path":83,"stem":84},"Blog","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fblog","docs\u002F1.saas-starter-kit\u002F2.features\u002F14.blog",{"title":86,"path":87,"stem":88},"Documentation","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fdocumentation","docs\u002F1.saas-starter-kit\u002F2.features\u002F15.documentation",{"title":90,"path":91,"stem":92},"Analytics","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fanalytics","docs\u002F1.saas-starter-kit\u002F2.features\u002F16.analytics",{"title":94,"path":95,"stem":96},"Platform Admin Console","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fplatform-admin","docs\u002F1.saas-starter-kit\u002F2.features\u002F17.platform-admin",{"title":98,"path":99,"stem":100},"Database","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fdatabase","docs\u002F1.saas-starter-kit\u002F2.features\u002F2.database",{"title":102,"path":103,"stem":104},"Payments & Billing","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fpayments","docs\u002F1.saas-starter-kit\u002F2.features\u002F3.payments",{"title":106,"path":107,"stem":108},"Emails","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Femails","docs\u002F1.saas-starter-kit\u002F2.features\u002F4.emails",{"title":110,"path":111,"stem":112},"Notifications","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fnotifications","docs\u002F1.saas-starter-kit\u002F2.features\u002F5.notifications",{"title":114,"path":115,"stem":116},"Role-Based Access Control","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Frbac","docs\u002F1.saas-starter-kit\u002F2.features\u002F6.rbac",{"title":118,"path":119,"stem":120},"Async Jobs","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fasync-jobs","docs\u002F1.saas-starter-kit\u002F2.features\u002F7.async-jobs",{"title":122,"path":123,"stem":124},"Storage","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Fstorage","docs\u002F1.saas-starter-kit\u002F2.features\u002F8.storage",{"title":126,"path":127,"stem":128},"Internationalization","\u002Fdocs\u002Fsaas-starter-kit\u002Ffeatures\u002Finternationalization","docs\u002F1.saas-starter-kit\u002F2.features\u002F9.internationalization",{"title":130,"icon":131,"path":132,"stem":133,"children":134,"page":62},"Concepts","i-lucide-graduation-cap","\u002Fdocs\u002Fsaas-starter-kit\u002Fconcepts","docs\u002F1.saas-starter-kit\u002F3.concepts",[135,139,143,147],{"title":136,"path":137,"stem":138},"Technology Stack","\u002Fdocs\u002Fsaas-starter-kit\u002Fconcepts\u002Ftech-stack","docs\u002F1.saas-starter-kit\u002F3.concepts\u002F0.tech-stack",{"title":140,"path":141,"stem":142},"SST.dev","\u002Fdocs\u002Fsaas-starter-kit\u002Fconcepts\u002Fsst","docs\u002F1.saas-starter-kit\u002F3.concepts\u002F1.sst",{"title":144,"path":145,"stem":146},"NuxtHub","\u002Fdocs\u002Fsaas-starter-kit\u002Fconcepts\u002Fnuxt-hub","docs\u002F1.saas-starter-kit\u002F3.concepts\u002F2.nuxt-hub",{"title":148,"path":149,"stem":150},"Design System & Branding","\u002Fdocs\u002Fsaas-starter-kit\u002Fconcepts\u002Fdesign-system","docs\u002F1.saas-starter-kit\u002F3.concepts\u002F3.design-system","i-lucide-zap",{"title":153,"path":154,"stem":155,"children":156,"icon":159},"Fireskills","\u002Fdocs\u002Ffireskills","docs\u002F2.fireskills\u002F0.index",[157,160,219,249,275,293],{"title":158,"path":154,"stem":155,"icon":159},"What is Fireskills?","i-lucide-flame",{"title":20,"icon":21,"hide":22,"path":161,"stem":162,"children":163,"page":62},"\u002Fdocs\u002Ffireskills\u002Fgetting-started","docs\u002F2.fireskills\u002F1.getting-started",[164,167,171,175,179,183,187,191,195,199,203,207,211,215],{"title":27,"path":165,"stem":166},"\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fquick-start","docs\u002F2.fireskills\u002F1.getting-started\u002F00.quick-start",{"title":168,"path":169,"stem":170},"Workflow & Governance","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fworkflow","docs\u002F2.fireskills\u002F1.getting-started\u002F01.workflow",{"title":172,"path":173,"stem":174},"Project Context","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fproject-context","docs\u002F2.fireskills\u002F1.getting-started\u002F02.project-context",{"title":176,"path":177,"stem":178},"Step 0: Setup","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fstep-setup","docs\u002F2.fireskills\u002F1.getting-started\u002F03.step-setup",{"title":180,"path":181,"stem":182},"Step 1: Inbox","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fstep-inbox","docs\u002F2.fireskills\u002F1.getting-started\u002F04.step-inbox",{"title":184,"path":185,"stem":186},"Step 2: Backlog","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fstep-backlog","docs\u002F2.fireskills\u002F1.getting-started\u002F05.step-backlog",{"title":188,"path":189,"stem":190},"Step 3: Specify","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fstep-specify","docs\u002F2.fireskills\u002F1.getting-started\u002F06.step-specify",{"title":192,"path":193,"stem":194},"Step 4: Validate","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fstep-validate","docs\u002F2.fireskills\u002F1.getting-started\u002F07.step-validate",{"title":196,"path":197,"stem":198},"Step 5: Tasks","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fstep-tasks","docs\u002F2.fireskills\u002F1.getting-started\u002F08.step-tasks",{"title":200,"path":201,"stem":202},"Step 6: TDD\u002FBDD","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fstep-tdd-bdd","docs\u002F2.fireskills\u002F1.getting-started\u002F09.step-tdd-bdd",{"title":204,"path":205,"stem":206},"Step 7: Implement","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fstep-implement","docs\u002F2.fireskills\u002F1.getting-started\u002F10.step-implement",{"title":208,"path":209,"stem":210},"Step 8: Documentator","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fstep-documentator","docs\u002F2.fireskills\u002F1.getting-started\u002F11.step-documentator",{"title":212,"path":213,"stem":214},"Late Changes","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Flate-changes","docs\u002F2.fireskills\u002F1.getting-started\u002F12.late-changes",{"title":216,"path":217,"stem":218},"Other Entry Points","\u002Fdocs\u002Ffireskills\u002Fgetting-started\u002Fother-entry-points","docs\u002F2.fireskills\u002F1.getting-started\u002F13.other-entry-points",{"title":220,"icon":221,"hide":22,"path":222,"stem":223,"children":224,"page":62},"Methodology","i-lucide-git-branch","\u002Fdocs\u002Ffireskills\u002Fmethodology","docs\u002F2.fireskills\u002F2.methodology",[225,229,233,237,241,245],{"title":226,"path":227,"stem":228},"The Three Acts","\u002Fdocs\u002Ffireskills\u002Fmethodology\u002Fthree-acts","docs\u002F2.fireskills\u002F2.methodology\u002F0.three-acts",{"title":230,"path":231,"stem":232},"The Three Gates","\u002Fdocs\u002Ffireskills\u002Fmethodology\u002Fthree-gates","docs\u002F2.fireskills\u002F2.methodology\u002F1.three-gates",{"title":234,"path":235,"stem":236},"The Canonical Spec","\u002Fdocs\u002Ffireskills\u002Fmethodology\u002Fcanonical-spec","docs\u002F2.fireskills\u002F2.methodology\u002F2.canonical-spec",{"title":238,"path":239,"stem":240},"Lifecycle States","\u002Fdocs\u002Ffireskills\u002Fmethodology\u002Flifecycle-states","docs\u002F2.fireskills\u002F2.methodology\u002F3.lifecycle-states",{"title":242,"path":243,"stem":244},"Effort Scale","\u002Fdocs\u002Ffireskills\u002Fmethodology\u002Feffort-scale","docs\u002F2.fireskills\u002F2.methodology\u002F4.effort-scale",{"title":246,"path":247,"stem":248},"Milestones & Governance","\u002Fdocs\u002Ffireskills\u002Fmethodology\u002Fgovernance-and-milestones","docs\u002F2.fireskills\u002F2.methodology\u002F5.governance-and-milestones",{"title":250,"icon":251,"hide":22,"path":252,"stem":253,"children":254,"page":62},"Skills","i-lucide-layers","\u002Fdocs\u002Ffireskills\u002Fskills","docs\u002F2.fireskills\u002F3.skills",[255,259,263,267,271],{"title":256,"path":257,"stem":258},"Catalog","\u002Fdocs\u002Ffireskills\u002Fskills\u002Fcatalog","docs\u002F2.fireskills\u002F3.skills\u002F0.catalog",{"title":260,"path":261,"stem":262},"Act I: Define","\u002Fdocs\u002Ffireskills\u002Fskills\u002Fact-1-define","docs\u002F2.fireskills\u002F3.skills\u002F1.act-1-define",{"title":264,"path":265,"stem":266},"Act II: Design & Prove","\u002Fdocs\u002Ffireskills\u002Fskills\u002Fact-2-design-prove","docs\u002F2.fireskills\u002F3.skills\u002F2.act-2-design-prove",{"title":268,"path":269,"stem":270},"Act III: Deliver","\u002Fdocs\u002Ffireskills\u002Fskills\u002Fact-3-deliver","docs\u002F2.fireskills\u002F3.skills\u002F3.act-3-deliver",{"title":272,"path":273,"stem":274},"Governance & Decisions","\u002Fdocs\u002Ffireskills\u002Fskills\u002Fgovernance-and-decisions","docs\u002F2.fireskills\u002F3.skills\u002F4.governance-and-decisions",{"title":276,"icon":277,"hide":22,"path":278,"stem":279,"children":280,"page":62},"Specialists","i-lucide-sparkles","\u002Fdocs\u002Ffireskills\u002Fspecialists","docs\u002F2.fireskills\u002F4.specialists",[281,285,289],{"title":282,"path":283,"stem":284},"Overview","\u002Fdocs\u002Ffireskills\u002Fspecialists\u002Foverview","docs\u002F2.fireskills\u002F4.specialists\u002F0.overview",{"title":286,"path":287,"stem":288},"Nuxfire Stack","\u002Fdocs\u002Ffireskills\u002Fspecialists\u002Fnuxfire-stack","docs\u002F2.fireskills\u002F4.specialists\u002F1.nuxfire-stack",{"title":290,"path":291,"stem":292},"Engineering Specialists","\u002Fdocs\u002Ffireskills\u002Fspecialists\u002Fengineering-specialists","docs\u002F2.fireskills\u002F4.specialists\u002F2.engineering-specialists",{"title":294,"icon":295,"hide":22,"path":296,"stem":297,"children":298,"page":62},"CLI & Tooling","i-lucide-terminal","\u002Fdocs\u002Ffireskills\u002Fcli","docs\u002F2.fireskills\u002F5.cli",[299,303,307],{"title":300,"path":301,"stem":302},"CLI Overview","\u002Fdocs\u002Ffireskills\u002Fcli\u002Foverview","docs\u002F2.fireskills\u002F5.cli\u002F0.overview",{"title":304,"path":305,"stem":306},"Commands","\u002Fdocs\u002Ffireskills\u002Fcli\u002Fcommands","docs\u002F2.fireskills\u002F5.cli\u002F1.commands",{"title":308,"path":309,"stem":310},"Safety Scripts","\u002Fdocs\u002Ffireskills\u002Fcli\u002Fgovernance-scripts","docs\u002F2.fireskills\u002F5.cli\u002F2.governance-scripts",{"id":312,"title":148,"body":313,"description":1065,"extension":1066,"meta":1067,"navigation":22,"path":149,"seo":1068,"stem":150,"__hash__":1069},"docs\u002Fdocs\u002F1.saas-starter-kit\u002F3.concepts\u002F3.design-system.md",{"type":314,"value":315,"toc":1051},"minimark",[316,345,350,360,363,421,480,570,579,610,624,630,634,671,675,689,711,718,722,765,776,780,795,801,922,938,942,964,968,1037,1047],[317,318,319,320,324,325,328,329,332,333,336,337,340,341,344],"p",{},"Every design token — brand colors, corner radius, dark-mode surface mapping, and Nuxt UI component\noverrides — lives in one workspace package: ",[321,322,323],"code",{},"@nuxfire\u002Ftokens",", consumed by ",[321,326,327],{},"apps\u002Fapp",",\n",[321,330,331],{},"apps\u002Fweb",", and ",[321,334,335],{},"apps\u002Flogin"," alike. Before this package existed, each app duplicated its\nown ",[321,338,339],{},"app.config.ts"," and ",[321,342,343],{},"main.css"," — a real risk of one app quietly drifting from the others. Rebranding\nnow means editing one file, not three.",[346,347,349],"h2",{"id":348},"the-package","The package",[351,352,357],"pre",{"className":353,"code":355,"language":356},[354],"language-text","packages\u002Ftokens\u002F\n├── theme.css   # Tailwind @theme tokens, dark-mode mapping, corner radius\n└── index.ts    # sharedUiConfig (Nuxt UI app.config.ts fragment) + enterpriseTableUi\n","text",[321,358,355],{"__ignoreMap":359},"",[317,361,362],{},"A consuming app wires it up in three places:",[351,364,369],{"className":365,"code":366,"filename":367,"language":368,"meta":359,"style":359},"language-json shiki shiki-themes material-theme-lighter github-light github-dark monokai","{ \"dependencies\": { \"@nuxfire\u002Ftokens\": \"workspace:*\" } }\n","package.json","json",[321,370,371],{"__ignoreMap":359},[372,373,376,380,384,388,391,394,397,399,402,404,406,409,413,415,418],"span",{"class":374,"line":375},"line",1,[372,377,379],{"class":378},"swvn1","{",[372,381,383],{"class":382},"saDeg"," \"",[372,385,387],{"class":386},"sEff5","dependencies",[372,389,390],{"class":382},"\"",[372,392,393],{"class":378},":",[372,395,396],{"class":378}," {",[372,398,383],{"class":382},[372,400,323],{"class":401},"s_MOj",[372,403,390],{"class":382},[372,405,393],{"class":378},[372,407,383],{"class":408},"sh1VR",[372,410,412],{"class":411},"sINAO","workspace:*",[372,414,390],{"class":408},[372,416,417],{"class":378}," }",[372,419,420],{"class":378}," }\n",[351,422,427],{"className":423,"code":424,"filename":425,"language":426,"meta":359,"style":359},"language-css shiki shiki-themes material-theme-lighter github-light github-dark monokai","@import \"tailwindcss\";\n@import \"@nuxt\u002Fui\";\n@import \"@nuxfire\u002Ftokens\u002Ftheme.css\"; \u002F* after @nuxt\u002Fui, so it wins over its defaults *\u002F\n","app\u002Fassets\u002Fcss\u002Fmain.css","css",[321,428,429,447,461],{"__ignoreMap":359},[372,430,431,435,438,442,444],{"class":374,"line":375},[372,432,434],{"class":433},"sRxSC","@import",[372,436,383],{"class":437},"siCPE",[372,439,441],{"class":440},"sLACW","tailwindcss",[372,443,390],{"class":437},[372,445,446],{"class":378},";\n",[372,448,450,452,454,457,459],{"class":374,"line":449},2,[372,451,434],{"class":433},[372,453,383],{"class":437},[372,455,456],{"class":440},"@nuxt\u002Fui",[372,458,390],{"class":437},[372,460,446],{"class":378},[372,462,464,466,468,471,473,476],{"class":374,"line":463},3,[372,465,434],{"class":433},[372,467,383],{"class":437},[372,469,470],{"class":440},"@nuxfire\u002Ftokens\u002Ftheme.css",[372,472,390],{"class":437},[372,474,475],{"class":378},";",[372,477,479],{"class":478},"ss7Ak"," \u002F* after @nuxt\u002Fui, so it wins over its defaults *\u002F\n",[351,481,486],{"className":482,"code":483,"filename":484,"language":485,"meta":359,"style":359},"language-ts shiki shiki-themes material-theme-lighter github-light github-dark monokai","import { sharedUiConfig } from \"@nuxfire\u002Ftokens\";\n\nexport default defineAppConfig({\n  ui: { ...sharedUiConfig }, \u002F\u002F app-specific keys can follow the spread\n});\n","app\u002Fapp.config.ts","ts",[321,487,488,512,517,535,559],{"__ignoreMap":359},[372,489,490,493,495,499,501,504,506,508,510],{"class":374,"line":375},[372,491,492],{"class":433},"import",[372,494,396],{"class":378},[372,496,498],{"class":497},"ss--_"," sharedUiConfig",[372,500,417],{"class":378},[372,502,503],{"class":433}," from",[372,505,383],{"class":437},[372,507,323],{"class":440},[372,509,390],{"class":437},[372,511,446],{"class":378},[372,513,514],{"class":374,"line":449},[372,515,516],{"emptyLinePlaceholder":22},"\n",[372,518,519,522,525,529,532],{"class":374,"line":463},[372,520,521],{"class":433},"export",[372,523,524],{"class":433}," default",[372,526,528],{"class":527},"sD0ED"," defineAppConfig",[372,530,531],{"class":497},"(",[372,533,534],{"class":378},"{\n",[372,536,538,542,544,546,550,553,556],{"class":374,"line":537},4,[372,539,541],{"class":540},"squCx","  ui",[372,543,393],{"class":378},[372,545,396],{"class":378},[372,547,549],{"class":548},"sGXK2"," ...",[372,551,552],{"class":497},"sharedUiConfig ",[372,554,555],{"class":378},"},",[372,557,558],{"class":478}," \u002F\u002F app-specific keys can follow the spread\n",[372,560,562,565,568],{"class":374,"line":561},5,[372,563,564],{"class":378},"}",[372,566,567],{"class":497},")",[372,569,446],{"class":378},[571,572,574,575,578],"h3",{"id":573},"the-source-gotcha","The ",[321,576,577],{},"@source"," gotcha",[317,580,581,582,585,586,588,589,593,594,597,598,601,602,605,606,609],{},"The package reaches each app through a ",[321,583,584],{},"node_modules"," symlink (a Bun workspace), and Tailwind does not\nscan ",[321,587,584],{}," for class names by default. Without the line below, any class that exists ",[590,591,592],"strong",{},"only","\ninside ",[321,595,596],{},"index.ts"," (for example, a ",[321,599,600],{},"compoundVariants"," override like ",[321,603,604],{},"before:bg-primary\u002F15",") renders in the\nDOM with no CSS rule behind it — silently broken, no error. ",[321,607,608],{},"theme.css"," already carries the fix:",[351,611,613],{"className":423,"code":612,"language":426,"meta":359,"style":359},"@source \".\u002Findex.ts\";\n",[321,614,615],{"__ignoreMap":359},[372,616,617,619,622],{"class":374,"line":375},[372,618,577],{"class":433},[372,620,621],{"class":497}," \".\u002Findex.ts\"",[372,623,446],{"class":378},[317,625,626,627,629],{},"If ",[321,628,596],{}," ever grows a genuinely new utility class — not one already used elsewhere in an app's own\nscanned source — this directive is what keeps it from going dead again.",[346,631,633],{"id":632},"brand-accent-shared-across-all-three-apps","Brand accent — shared across all three apps",[317,635,636,639,640,643,644,647,648,651,652,654,655,658,659,662,663,666,667,670],{},[321,637,638],{},"flame"," (red, ",[321,641,642],{},"primary",") and ",[321,645,646],{},"fire"," (orange, ",[321,649,650],{},"secondary",") are defined once in ",[321,653,608],{},", byte-identical\nin every app. ",[321,656,657],{},"ui.colors"," maps ",[321,660,661],{},"primary: 'flame'",", ",[321,664,665],{},"secondary: 'fire'"," in ",[321,668,669],{},"sharedUiConfig",".",[346,672,674],{"id":673},"neutral-scale-intentionally-different-per-app","Neutral scale — intentionally different per app",[317,676,677,678,681,682,685,686,688],{},"Unlike the brand accent, the neutral surface scale (",[321,679,680],{},"night-*",") is ",[590,683,684],{},"not"," shared — each app defines its\nown in its own ",[321,687,343],{},", same token names, different hues:",[690,691,692,700],"ul",{},[693,694,695,699],"li",{},[590,696,697],{},[321,698,327],{}," uses a cold true-gray scale, matching an enterprise reference panel (Linear-style)\nbyte-for-byte — this is the working dashboard and the platform-admin console, where a neutral base and\nthe brand accent reserved for actions\u002Fhighlights is the standard SaaS-utility convention (GitHub,\nLinear, Vercel all do the same).",[693,701,702,340,706,710],{},[590,703,704],{},[321,705,331],{},[590,707,708],{},[321,709,335],{}," use a warm, ember-tinted gray — the public brand\nsite's own identity.",[317,712,713,714,717],{},"Rebranding one app's base tone never touches the other two — edit only that app's ",[321,715,716],{},"--color-night-*"," block.",[346,719,721],{"id":720},"corner-radius-one-token-drives-everything","Corner radius — one token drives everything",[351,723,725],{"className":423,"code":724,"language":426,"meta":359,"style":359},":root {\n  --ui-radius: 0.1875rem; \u002F* 3px *\u002F\n}\n",[321,726,727,739,760],{"__ignoreMap":359},[372,728,729,732,736],{"class":374,"line":375},[372,730,393],{"class":731},"sRsjY",[372,733,735],{"class":734},"s_lYk","root",[372,737,738],{"class":378}," {\n",[372,740,741,745,747,751,755,757],{"class":374,"line":449},[372,742,744],{"class":743},"s94S9","  --ui-radius",[372,746,393],{"class":378},[372,748,750],{"class":749},"sYThS"," 0.1875",[372,752,754],{"class":753},"shWJe","rem",[372,756,475],{"class":378},[372,758,759],{"class":478}," \u002F* 3px *\u002F\n",[372,761,762],{"class":374,"line":463},[372,763,764],{"class":378},"}\n",[317,766,767,768,771,772,775],{},"Nuxt UI derives its entire ",[321,769,770],{},"rounded-*"," scale proportionally from this single variable\n(",[321,773,774],{},"--radius-lg: calc(var(--ui-radius) * 2)",", and so on), so every card, button, input, modal, and badge\ntightens together from one edit — no per-component override needed.",[346,777,779],{"id":778},"shadow-policy","Shadow policy",[317,781,782,783,786,787,790,791,794],{},"Static surfaces (cards, sections, panels) use ",[590,784,785],{},"zero shadow"," — separation comes from a 1px\nborder\u002F",[321,788,789],{},"ring",", never ",[321,792,793],{},"box-shadow",". Floating overlays (modals, dropdowns, popovers, tooltips) keep their\nshadow: they float over content with no backdrop scrim, so the shadow is the only depth cue they have —\nthat's Nuxt UI's own default behavior, left untouched.",[346,796,798,799,567],{"id":797},"component-overrides-shareduiconfig","Component overrides (",[321,800,669],{},[802,803,804,820],"table",{},[805,806,807],"thead",{},[808,809,810,814,817],"tr",{},[811,812,813],"th",{},"Component",[811,815,816],{},"Override",[811,818,819],{},"Why",[821,822,823,846,864,885,905],"tbody",{},[808,824,825,831,840],{},[826,827,828],"td",{},[321,829,830],{},"UCard",[826,832,833,836,837],{},[321,834,835],{},"bg-elevated"," instead of ",[321,838,839],{},"bg-default",[826,841,842,843,845],{},"The stock variant leaves a card the same color as the page (1:1 contrast, measured) — ",[321,844,835],{}," is a raised tone.",[808,847,848,854,861],{},[826,849,850,853],{},[321,851,852],{},"UAvatar"," (neutral, no image)",[826,855,856,836,859],{},[321,857,858],{},"bg-accented",[321,860,835],{},[826,862,863],{},"The stock fallback shares the card's own background, so a photoless avatar inside a card had no visible background at all.",[808,865,866,872,882],{},[826,867,868,871],{},[321,869,870],{},"UNavigationMenu"," (vertical)",[826,873,874,875,878,879,881],{},"24px icons (was 20px), collapsed rows as a centered ",[321,876,877],{},"size-11"," square, active item gets a colored ",[321,880,789],{}," in addition to the tint",[826,883,884],{},"A defined square tap target and a bordered active state, not just a floating glyph and a flat color wash.",[808,886,887,892,902],{},[826,888,889],{},[321,890,891],{},"UTabs",[826,893,894,895,898,899],{},"default ",[321,896,897],{},"link"," variant instead of ",[321,900,901],{},"pill",[826,903,904],{},"A solid brand-color block reads heavier than the underline treatment used across settings screens.",[808,906,907,916,919],{},[826,908,909,912,913,567],{},[321,910,911],{},"UTable"," (",[321,914,915],{},"enterpriseTableUi",[826,917,918],{},"small, muted, uppercase, letter-spaced header",[826,920,921],{},"Matches the column-label convention Linear\u002FStripe\u002FNotion tables use, instead of a heading-sized header.",[317,923,924,926,927,929,930,933,934,937],{},[321,925,915],{}," ships separately from ",[321,928,669],{},", passed explicitly via each ",[321,931,932],{},"\u003CUTable>","'s ",[321,935,936],{},":ui","\nprop — an instance prop always wins, which a global slot override for this particular component had not\nbeen verified to do.",[346,939,941],{"id":940},"accessibility-measured-not-estimated","Accessibility — measured, not estimated",[317,943,944,945,947,948,951,952,955,956,959,960,963],{},"The dark\u002Flight surface mapping in ",[321,946,608],{}," comes from real contrast measurements against the running\napp (WCAG relative-luminance formula), not a guess. The stock Nuxt UI mapping measured a card at ",[590,949,950],{},"1.00:1","\nagainst its own page background (invisible) and inactive icons at ",[590,953,954],{},"2.61:1"," (below the 4.5:1 WCAG AA\nfloor). The current dark-mode text ladder against the ",[321,957,958],{},"#0d0d0d"," canvas: 18.7:1 \u002F 15.6:1 \u002F 12.1:1 \u002F 5.48:1\n— every tier clears AA, with ",[321,961,962],{},"dimmed"," deliberately the tightest since it also drives placeholders.",[346,965,967],{"id":966},"rebranding-checklist","Rebranding checklist",[690,969,970,987,997,1010,1025],{},[693,971,972,975,976,979,980,983,984,670],{},[590,973,974],{},"Change the accent color everywhere",": edit the ",[321,977,978],{},"flame-*","\u002F",[321,981,982],{},"fire-*"," scales in\n",[321,985,986],{},"packages\u002Ftokens\u002Ftheme.css",[693,988,989,992,993,996],{},[590,990,991],{},"Change the corner radius everywhere",": edit ",[321,994,995],{},"--ui-radius"," in the same file.",[693,998,999,992,1002,979,1004,1006,1007,670],{},[590,1000,1001],{},"Change a component's default look everywhere",[321,1003,669],{},[321,1005,915],{}," in\n",[321,1008,1009],{},"packages\u002Ftokens\u002Findex.ts",[693,1011,1012,1015,1016,1018,1019,1021,1022,670],{},[590,1013,1014],{},"Change one app's neutral tone only",": edit that app's own ",[321,1017,716],{}," scale in its own\n",[321,1020,343],{}," — not in ",[321,1023,1024],{},"packages\u002Ftokens",[693,1026,1027,1030,1031,1033,1034,1036],{},[590,1028,1029],{},"Override something for one app only",": spread ",[321,1032,669],{}," in that app's ",[321,1035,339],{},", then add\nkeys after the spread — the later definition wins.",[317,1038,1039,1040,979,1043,1046],{},"Every token is a CSS custom property, never a class hardcoded into a component, which is also the right\nfoundation for a future per-tenant theme editor: overriding a handful of ",[321,1041,1042],{},"--ui-*",[321,1044,1045],{},"--color-*"," variables at\nruntime reaches every component for free.",[1048,1049,1050],"style",{},"html pre.shiki code .swvn1, html code.shiki .swvn1{--shiki-light:#39ADB5;--shiki-default:#24292E;--shiki-dark:#E1E4E8;--shiki-sepia:#F8F8F2}html pre.shiki code .saDeg, html code.shiki .saDeg{--shiki-light:#39ADB5;--shiki-light-font-style:inherit;--shiki-default:#005CC5;--shiki-default-font-style:inherit;--shiki-dark:#79B8FF;--shiki-dark-font-style:inherit;--shiki-sepia:#66D9EF;--shiki-sepia-font-style:italic}html pre.shiki code .sEff5, html code.shiki .sEff5{--shiki-light:#9C3EDA;--shiki-light-font-style:inherit;--shiki-default:#005CC5;--shiki-default-font-style:inherit;--shiki-dark:#79B8FF;--shiki-dark-font-style:inherit;--shiki-sepia:#66D9EF;--shiki-sepia-font-style:italic}html pre.shiki code .s_MOj, html code.shiki .s_MOj{--shiki-light:#E2931D;--shiki-light-font-style:inherit;--shiki-default:#005CC5;--shiki-default-font-style:inherit;--shiki-dark:#79B8FF;--shiki-dark-font-style:inherit;--shiki-sepia:#66D9EF;--shiki-sepia-font-style:italic}html pre.shiki code .sh1VR, html code.shiki .sh1VR{--shiki-light:#39ADB5;--shiki-default:#032F62;--shiki-dark:#9ECBFF;--shiki-sepia:#CFCFC2}html pre.shiki code .sINAO, html code.shiki .sINAO{--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF;--shiki-sepia:#CFCFC2}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html .sepia .shiki span {color: var(--shiki-sepia);background: var(--shiki-sepia-bg);font-style: var(--shiki-sepia-font-style);font-weight: var(--shiki-sepia-font-weight);text-decoration: var(--shiki-sepia-text-decoration);}html.sepia .shiki span {color: var(--shiki-sepia);background: var(--shiki-sepia-bg);font-style: var(--shiki-sepia-font-style);font-weight: var(--shiki-sepia-font-weight);text-decoration: var(--shiki-sepia-text-decoration);}html pre.shiki code .sRxSC, html code.shiki .sRxSC{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#D73A49;--shiki-default-font-style:inherit;--shiki-dark:#F97583;--shiki-dark-font-style:inherit;--shiki-sepia:#F92672;--shiki-sepia-font-style:inherit}html pre.shiki code .siCPE, html code.shiki .siCPE{--shiki-light:#39ADB5;--shiki-default:#032F62;--shiki-dark:#9ECBFF;--shiki-sepia:#E6DB74}html pre.shiki code .sLACW, html code.shiki .sLACW{--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF;--shiki-sepia:#E6DB74}html pre.shiki code .ss7Ak, html code.shiki .ss7Ak{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#6A737D;--shiki-default-font-style:inherit;--shiki-dark:#6A737D;--shiki-dark-font-style:inherit;--shiki-sepia:#88846F;--shiki-sepia-font-style:inherit}html pre.shiki code .ss--_, html code.shiki .ss--_{--shiki-light:#90A4AE;--shiki-default:#24292E;--shiki-dark:#E1E4E8;--shiki-sepia:#F8F8F2}html pre.shiki code .sD0ED, html code.shiki .sD0ED{--shiki-light:#6182B8;--shiki-default:#6F42C1;--shiki-dark:#B392F0;--shiki-sepia:#A6E22E}html pre.shiki code .squCx, html code.shiki .squCx{--shiki-light:#E53935;--shiki-default:#24292E;--shiki-dark:#E1E4E8;--shiki-sepia:#F8F8F2}html pre.shiki code .sGXK2, html code.shiki .sGXK2{--shiki-light:#39ADB5;--shiki-default:#D73A49;--shiki-dark:#F97583;--shiki-sepia:#F92672}html pre.shiki code .sRsjY, html code.shiki .sRsjY{--shiki-light:#39ADB5;--shiki-default:#6F42C1;--shiki-dark:#B392F0;--shiki-sepia:#A6E22E}html pre.shiki code .s_lYk, html code.shiki .s_lYk{--shiki-light:#9C3EDA;--shiki-default:#6F42C1;--shiki-dark:#B392F0;--shiki-sepia:#A6E22E}html pre.shiki code .s94S9, html code.shiki .s94S9{--shiki-light:#90A4AE;--shiki-default:#E36209;--shiki-dark:#FFAB70;--shiki-sepia:#F8F8F2}html pre.shiki code .sYThS, html code.shiki .sYThS{--shiki-light:#F76D47;--shiki-default:#005CC5;--shiki-dark:#79B8FF;--shiki-sepia:#AE81FF}html pre.shiki code .shWJe, html code.shiki .shWJe{--shiki-light:#F76D47;--shiki-default:#D73A49;--shiki-dark:#F97583;--shiki-sepia:#F92672}",{"title":359,"searchDepth":449,"depth":449,"links":1052},[1053,1057,1058,1059,1060,1061,1063,1064],{"id":348,"depth":449,"text":349,"children":1054},[1055],{"id":573,"depth":463,"text":1056},"The @source gotcha",{"id":632,"depth":449,"text":633},{"id":673,"depth":449,"text":674},{"id":720,"depth":449,"text":721},{"id":778,"depth":449,"text":779},{"id":797,"depth":449,"text":1062},"Component overrides (sharedUiConfig)",{"id":940,"depth":449,"text":941},{"id":966,"depth":449,"text":967},"How @nuxfire\u002Ftokens centralizes theming across all three frontend apps, and how to rebrand the starter kit for your own product.","md",{},{"title":148,"description":1065},"r-I-cMsvrpNyocJD2riKMswKXyq0CgjXrCXmg2qf8eM",1790707485288]