/* Devsey site: PatternFly 6 look (same tokens as Cockpit), simple top-menu layout. Tokens only, no custom palette. */
html, body { margin: 0; height: auto; }
html { background: var(--pf-t--global--background--color--secondary--default); }
body { background: var(--pf-t--global--background--color--secondary--default); color: var(--pf-t--global--text--color--regular); min-block-size: 100vh; display: flex; flex-direction: column; }
[hidden] { display: none !important; }
a { color: var(--pf-t--global--text--color--link--default); }

/* top menu */
.site-header { background: var(--pf-t--global--background--color--primary--default); border-block-end: var(--pf-t--global--border--width--regular) solid var(--pf-t--global--border--color--default); position: sticky; top: 0; z-index: 10; }
.site-header__inner { max-inline-size: 72rem; margin-inline: auto; padding: var(--pf-t--global--spacer--md) var(--pf-t--global--spacer--lg); display: flex; align-items: center; gap: var(--pf-t--global--spacer--lg); }
.site-brand { font-size: var(--pf-t--global--font--size--heading--h3, 1.25rem); font-weight: var(--pf-t--global--font--weight--heading--bold); color: var(--pf-t--global--text--color--regular); text-decoration: none; }
.site-brand span { color: var(--pf-t--global--text--color--subtle); font-weight: var(--pf-t--global--font--weight--body--default); }
.site-nav { margin-inline-start: auto; display: flex; align-items: center; gap: var(--pf-t--global--spacer--lg); flex-wrap: wrap; }
.site-nav a:not(.pf-v6-c-button) { color: var(--pf-t--global--text--color--subtle); text-decoration: none; padding-block: var(--pf-t--global--spacer--xs); border-block-end: 2px solid transparent; }
.site-nav a:not(.pf-v6-c-button):hover { color: var(--pf-t--global--text--color--regular); border-block-end-color: var(--pf-t--global--border--color--brand--default); }
.site-nav form { margin: 0; }

/* page */
.site-main { flex: 1; }
.container { max-inline-size: 72rem; margin-inline: auto; padding: var(--pf-t--global--spacer--xl) var(--pf-t--global--spacer--lg); }
.hero { background: var(--pf-t--global--background--color--primary--default); border-block-end: var(--pf-t--global--border--width--regular) solid var(--pf-t--global--border--color--default); }
.hero .container { padding-block: var(--pf-t--global--spacer--2xl, 3rem); }
.hero p { max-inline-size: 42rem; margin: var(--pf-t--global--spacer--md) 0 var(--pf-t--global--spacer--lg); font-size: var(--pf-t--global--font--size--lg); color: var(--pf-t--global--text--color--subtle); }
.hero-actions { display: flex; gap: var(--pf-t--global--spacer--md); flex-wrap: wrap; }
.section { margin-block-end: var(--pf-t--global--spacer--2xl, 3rem); }
.section > h2 { margin: 0 0 var(--pf-t--global--spacer--lg); }
.section-intro { color: var(--pf-t--global--text--color--subtle); margin: calc(-1 * var(--pf-t--global--spacer--sm)) 0 var(--pf-t--global--spacer--lg); }
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: var(--pf-t--global--spacer--lg); }
.gallery > .pf-v6-c-card { margin: 0; }
.meta { display: flex; flex-wrap: wrap; gap: var(--pf-t--global--spacer--sm); margin-block-end: var(--pf-t--global--spacer--sm); }
.pf-v6-c-card__footer .actions { display: flex; gap: var(--pf-t--global--spacer--sm); flex-wrap: wrap; align-items: center; }
.card-grow { flex: 1; }
.pf-v6-c-card { block-size: 100%; }
.breadcrumb { margin: 0 0 var(--pf-t--global--spacer--md); }
.page-title { display: flex; align-items: center; gap: var(--pf-t--global--spacer--md); flex-wrap: wrap; margin-block-end: var(--pf-t--global--spacer--md); }
.page-title h1 { margin: 0; }
.stack { display: flex; flex-direction: column; gap: var(--pf-t--global--spacer--lg); }
.lead { font-size: var(--pf-t--global--font--size--lg); }
.muted { color: var(--pf-t--global--text--color--subtle); }
.list { margin: var(--pf-t--global--spacer--sm) 0 0; padding-inline-start: var(--pf-t--global--spacer--lg); }
.list li + li { margin-block-start: var(--pf-t--global--spacer--xs); }

/* install steps */
.steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--pf-t--global--spacer--lg); counter-reset: step; }
.steps > li { counter-increment: step; display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: var(--pf-t--global--spacer--md); }
.steps > li::before { content: counter(step); inline-size: 2rem; block-size: 2rem; border-radius: 50%; display: grid; place-items: center; background: var(--pf-t--global--color--brand--default); color: var(--pf-t--global--text--color--on-brand--default, #fff); font-weight: var(--pf-t--global--font--weight--body--bold); }
.steps .pf-v6-c-code-block { margin-block: var(--pf-t--global--spacer--sm); }
.fingerprint { font-family: var(--pf-t--global--font--family--mono); font-size: var(--pf-t--global--font--size--sm); word-break: break-all; }

/* admin */
.toolbar { display: flex; align-items: center; gap: var(--pf-t--global--spacer--md); flex-wrap: wrap; margin-block-end: var(--pf-t--global--spacer--lg); }
.toolbar h1 { margin: 0; }
.spacer { flex: 1; }
.table-wrap { overflow-x: auto; }
.pf-v6-c-card__body.flush { padding: 0; }
.row-actions { display: flex; gap: var(--pf-t--global--spacer--xs); justify-content: flex-end; align-items: center; }
.row-actions form { margin: 0; }
.two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--pf-t--global--spacer--lg); }
@media (max-width: 700px) { .two { grid-template-columns: 1fr; } }
.login { max-inline-size: 26rem; margin-inline: auto; }
.pf-v6-c-alert { margin-block-end: var(--pf-t--global--spacer--lg); }
.pf-v6-c-alert ul { margin: var(--pf-t--global--spacer--xs) 0 0; padding-inline-start: var(--pf-t--global--spacer--lg); list-style: disc; }
.pf-v6-c-form-control textarea { min-block-size: 6rem; }
.pf-v6-c-form__group-control .pf-v6-c-check { margin-block: var(--pf-t--global--spacer--xs); }

.site-footer { background: var(--pf-t--global--background--color--primary--default); border-block-start: var(--pf-t--global--border--width--regular) solid var(--pf-t--global--border--color--default); color: var(--pf-t--global--text--color--subtle); font-size: var(--pf-t--global--font--size--sm); }
.site-footer .container { padding-block: var(--pf-t--global--spacer--lg); }
.pf-v6-c-card__title-text a { color: inherit; text-decoration: none; }
.pf-v6-c-card__title-text a:hover { text-decoration: underline; }