/* ecosystem-tokens:start | source: /Users/erickimberlin/ANSIBLE-HUB/ecosystem/contract.json | version: 1.1.0 */
:root {
  --eco-canvas: #f5f5f7;
  --eco-surface: #ffffff;
  --eco-ink: #1d1d1f;
  --eco-muted: #6e6e73;
  --eco-action: #0066cc;
  --eco-identity-field: #075cae;
  --eco-invention: #f4bd22;
  --eco-danger: #d62f3a;
  --eco-positive: #16865b;
  --eco-focus: #0066cc;
  --eco-type-micro: 10px;
  --eco-type-meta: 11px;
  --eco-type-label: 12px;
  --eco-type-ui: 13px;
  --eco-type-nav: 14px;
  --eco-type-body: 15px;
  --eco-target-min: 44px;
  --eco-target-primary-mobile: 48px;
  --eco-radius-control: 10px;
  --eco-radius-surface: 16px;
  --eco-mark-desktop: 38px;
  --eco-mark-compact: 34px;
  --eco-radius-mark: 12px;
  --eco-header-operational: 64px;
}

:root[data-theme="dark"] {
  --eco-canvas: #111113;
  --eco-surface: #1c1c1e;
  --eco-ink: #f5f5f7;
  --eco-muted: #b2b2b7;
  --eco-action: #409cff;
  --eco-identity-field: #0b559d;
  --eco-invention: #ffd45a;
  --eco-danger: #ff6961;
  --eco-positive: #4cc38a;
  --eco-focus: #66aaff;
}
/* ecosystem-tokens:end */

/* ecosystem-components:start | canonical */
/* Canonical ecosystem primitives. Product layout and composition stay local. */
:where(.eco-button,.eco-icon-button,.eco-family-home) {
  align-items:center; border:1px solid color-mix(in srgb,var(--eco-ink) 14%,transparent);
  border-radius:var(--eco-radius-control); box-sizing:border-box; color:var(--eco-ink);
  display:inline-flex; font:600 var(--eco-type-ui)/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  justify-content:center; min-height:var(--eco-target-min); text-decoration:none; transition:background-color .16s ease,border-color .16s ease,transform .16s ease;
}
:where(.eco-button,.eco-family-home) { gap:8px; padding:0 14px; }
.eco-icon-button { inline-size:var(--eco-target-min); padding:0; }
:where(.eco-button,.eco-icon-button,.eco-family-home):hover { background:color-mix(in srgb,var(--eco-action) 9%,transparent); border-color:color-mix(in srgb,var(--eco-action) 38%,transparent); }
:where(.eco-button,.eco-icon-button,.eco-family-home):active { transform:scale(.98); }
:where(.eco-button,.eco-icon-button,.eco-family-home):focus-visible,
:where(button,a,input,select,textarea):focus-visible { outline:3px solid color-mix(in srgb,var(--eco-focus) 55%,transparent); outline-offset:2px; }
.eco-button[data-variant="primary"] { background:var(--eco-action); border-color:var(--eco-action); color:#fff; }
.eco-button:disabled,.eco-button[aria-disabled="true"] { cursor:not-allowed; opacity:.48; }
.eco-status { align-items:center; display:inline-flex; font-size:var(--eco-type-label); font-weight:750; gap:7px; letter-spacing:.03em; }
.eco-status::before { background:currentColor; border-radius:50%; content:""; block-size:7px; inline-size:7px; }
.eco-status[data-state="positive"] { color:var(--eco-positive); }
.eco-status[data-state="danger"] { color:var(--eco-danger); }
.eco-status[data-state="neutral"] { color:var(--eco-muted); }
.eco-app-lockup { align-items:center; display:flex; gap:11px; min-width:0; }
.eco-app-lockup img { block-size:var(--eco-mark-desktop); inline-size:var(--eco-mark-desktop); flex:none; }
.eco-product-mark { border-radius:var(--eco-radius-mark); overflow:hidden; }
.eco-shell-header { align-items:center; display:flex; justify-content:space-between; margin-inline:auto; max-inline-size:1120px; min-block-size:var(--eco-header-operational); }
.eco-shell-title { min-inline-size:0; }
.eco-shell-title p { color:var(--eco-action); font-size:var(--eco-type-meta); font-weight:750; letter-spacing:.13em; margin:0; text-transform:uppercase; }
.eco-shell-title h1 { font-size:22px; margin:0; }
.eco-shell-controls { align-items:center; display:flex; gap:8px; }
.eco-shell-controls > * { flex:none; }
.eco-shell-controls .theme-toggle { color:var(--eco-ink); }
.eco-app-switcher { position:relative; }
.eco-app-switcher summary { align-items:center; border:1px solid color-mix(in srgb,var(--eco-ink) 14%,transparent); border-radius:999px; box-sizing:border-box; color:var(--eco-ink); cursor:pointer; display:flex; gap:7px; min-height:var(--eco-target-min); padding:0 13px; list-style:none; }
.eco-app-switcher summary::-webkit-details-marker { display:none; }
.eco-app-switcher nav { background:var(--eco-surface); border:1px solid color-mix(in srgb,var(--eco-ink) 14%,transparent); border-radius:12px; box-shadow:0 18px 48px color-mix(in srgb,#000 18%,transparent); display:grid; gap:3px; min-inline-size:190px; padding:7px; position:absolute; right:0; top:calc(100% + 7px); z-index:20; }
.eco-app-switcher nav a { border-radius:8px; box-sizing:border-box; color:var(--eco-ink); display:block; min-height:var(--eco-target-min); padding:10px; text-decoration:none; }
.eco-app-switcher nav a:hover,.eco-app-switcher nav a:focus-visible,.eco-app-switcher nav a[aria-current="page"] { background:color-mix(in srgb,var(--eco-action) 9%,var(--eco-surface)); color:var(--eco-action); }
.eco-dialog { background:var(--eco-surface); border:1px solid color-mix(in srgb,var(--eco-ink) 12%,transparent); border-radius:var(--eco-radius-surface); box-shadow:0 24px 70px color-mix(in srgb,#000 22%,transparent); color:var(--eco-ink); max-inline-size:min(560px,calc(100vw - 32px)); padding:24px; }
.eco-field { display:grid; gap:7px; }
.eco-field > span { color:var(--eco-muted); font-size:var(--eco-type-label); font-weight:650; }
.eco-field :where(input,select,textarea) { background:var(--eco-surface); border:1px solid color-mix(in srgb,var(--eco-ink) 18%,transparent); border-radius:var(--eco-radius-control); color:var(--eco-ink); font:inherit; min-height:var(--eco-target-min); padding:10px 12px; }
@media (max-width:899px) { :is(.eco-button,.eco-icon-button,.eco-family-home,.eco-app-switcher summary) { min-height:var(--eco-target-primary-mobile); } .eco-app-lockup img { block-size:var(--eco-mark-compact); inline-size:var(--eco-mark-compact); } .eco-shell-title { overflow:hidden; } .eco-shell-title p { display:none; } .eco-family-home { font-size:0; padding-inline:10px; } .eco-family-home span { font-size:var(--eco-type-body); } .eco-shell-controls .theme-toggle.eco-button { block-size:var(--eco-target-primary-mobile); font-size:0; inline-size:var(--eco-target-primary-mobile); min-height:var(--eco-target-primary-mobile); padding:0; } .eco-shell-controls .theme-toggle span { font-size:var(--eco-type-body); } }
@media (prefers-reduced-motion:reduce) { :where(.eco-button,.eco-icon-button,.eco-family-home) { scroll-behavior:auto; transition:none; } }
/* ecosystem-components:end */
