# UnifiedSlide Style Contract - alpha36-fix11

This document records the CSS / Theme / Manifest contract required by the iToolkits general policy v1.10.

## Manifest contract

`PACKAGE_MANIFEST.json` declares runtime CSS in the `styles` section:

```json
{
  "styles": {
    "required": ["themes/base/unified_slide.css"],
    "themes": {
      "base": [],
      "flat": ["themes/flat/unified_slide.css"]
    },
    "hostOptional": ["demo/assets/css/demo.css"]
  },
  "styleScope": {
    "rootClass": ".uslide",
    "overlayClass": ".uslide-floating-ui"
  }
}
```

Host systems must load `styles.required` and the selected theme CSS before calling `createControl`, `createEditorControl`, or `createWorkbenchControl`.

## Root scope

UnifiedSlide runtime CSS is scoped under `.uslide`. The legacy demo workspace root uses:

```html
<div id="app" class="uslide ss-root" data-package="UnifiedSlide" data-theme="light"></div>
```

Floating UI should use `.uslide-floating-ui` when it must be attached outside the root element.

## CSS file names

Package-owned CSS files use package-specific lower_snake_case names:

- `themes/base/unified_slide.css`
- `themes/flat/unified_slide.css`

Generic names such as `app.css`, `style.css`, and `main.css` are not used for runtime package CSS.

## Forbidden runtime selectors

Runtime CSS must not define global selectors such as:

- `body { ... }`
- `html, body { ... }`
- `.toolbar { ... }`
- `.tab { ... }`
- `.grid { ... }`

Equivalent selectors must be scoped, for example `.uslide .ss-toolbar`.


## alpha36-fix12 Floating UI clarification
Body-level popups and presentation overlays use `styleScope.overlayClass` = `.uslide-floating-ui`. These overlays are outside the `.uslide` root by design, so their CSS is scoped to the overlay class and must include explicit `[hidden]` rules such as `.uslide-floating-ui.ss-present[hidden] { display:none !important; }`.