/*
 * Sneat client area: "ovh" page family - the OVH VPS panel (#ov-shell, modules/servers/ovhvps), the OVH dedicated and
 * Contabo panels (ModulesGarden Layers UI, #layers) and their body-level console window, inside the module workspace
 * frame of the cloud family (includes/service-workspace-frame.tpl, css/sneat-area-cloud.css).
 *
 * Module stylesheets are linked inside <body> after this file, so every rule here is stronger than theirs:
 *   OVH VPS   body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell …        (5 ids)
 *   tokens    body.hg-sneat .sn-root #ov-shell.ov-shell { --ov-*: var(--snb-*) } (the --snb-* palette follows
 *             html[data-bs-theme="dark"])
 * includes/sneat-flags-ovh.tpl switches the NXRagons workspace CSS and the stage-1 skin off for these modules.
 * Generic Bootstrap components come from sneat-base.css.
 * Source: /var/lib/hostragons-runtime/lightsail-sneat-20261030/work/ovh/*.src.css (%S = the 5-id prefix), build.py.
 */

/* ============================================================== OVH VPS (#ov-shell, modules/servers/ovhvps) */
/* tokens: the module's --ov-* palette points at the Sneat palette (follows html[data-bs-theme="dark"]) */
body.hg-sneat .sn-root #ov-shell.ov-shell {
    --ov: var(--snb-primary-text);
    --ov-2: var(--snb-primary-hover);
    --ov-soft: var(--snb-primary-label);
    --ov-ring: rgba(var(--snb-primary-rgb), .25);
    --ov-provider: var(--snb-primary-text);
    --ov-ok: var(--snb-success);
    --ov-ok-soft: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-success));
    --ov-warn: var(--snb-warning);
    --ov-warn-soft: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-warning));
    --ov-bad: var(--snb-danger);
    --ov-bad-soft: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-danger));
    --ov-bg: var(--snb-body-bg);
    --ov-card: var(--snb-paper);
    --ov-card-2: var(--snb-hover);
    --ov-text: var(--snb-heading);
    --ov-muted: var(--snb-body);
    --ov-border: var(--snb-border);
    --ov-line: var(--snb-border);
    --ov-shadow: var(--snb-shadow);
    --ov-shadow-lg: var(--snb-shadow);
    --res-cpu: var(--snb-primary-text);
    --res-ram: var(--snb-info);
    --res-disk: var(--snb-success);
    --res-plan: var(--snb-warning);
    --r-card: var(--snb-radius);
    --r-ctl: var(--snb-radius);
    --r-sm: var(--snb-radius-sm);
    --ctl-h: calc(1.375em + 1.086rem + 2px);
    --ov-gap: 1.5rem;
    --ws-ink: var(--snb-heading);
    --ws-muted: var(--snb-body);
    --ws-line: var(--snb-border);
    --ws-card: var(--snb-paper);
    --ws-soft: var(--snb-hover);
    --ws-accent: var(--snb-primary-text);
    --ws-tint: var(--snb-primary-label);
}
html[data-bs-theme="dark"] body.hg-sneat .sn-root #ov-shell.ov-shell {
    --ov-ok-soft: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-success));
    --ov-warn-soft: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-warning));
    --ov-bad-soft: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-danger));
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell { margin: 0; color: var(--snb-body); font-size: .9375rem; line-height: 1.375; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(code, .mono, .ov-secret) { color: inherit; font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace !important; font-size: .875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-muted, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-dot { color: var(--snb-muted); }

/* identity + power: one Sneat card - OS and location on the left, state, refresh and the power buttons on the right.
   The product name and the "Hostragons VPS" eyebrow are the service header card's title already (kept for screen readers). */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-control-surface {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    margin: 0 0 1.5rem;
    padding: 1.5rem;
    border: 0;
    border-radius: var(--snb-radius);
    background: var(--snb-paper);
    box-shadow: var(--snb-shadow);
    overflow: visible;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-hero {
    flex: 1 1 22rem;
    flex-wrap: nowrap;
    gap: 1rem;
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-mark { flex: 0 0 2.75rem; width: 2.75rem; height: 2.75rem; border: 0; border-radius: var(--snb-radius); background: var(--snb-hover); box-shadow: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-mark img { width: 1.625rem; height: 1.625rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-hero__id { flex: 1 1 auto; min-width: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-eyebrow, .ov-hero__title, .ov-toolbar__label) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-hero__sub { gap: .375rem; color: var(--snb-heading); font-size: .9375rem; font-weight: 500; line-height: 1.4; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-hero__sub .ov-dot, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-hero__sub .ov-muted { color: var(--snb-muted); font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-hero__state { flex: 0 0 auto; gap: .5rem; width: auto; margin-inline-start: auto; padding: 0; justify-content: flex-start; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-toolbar { display: block; flex: 0 1 auto; padding: 0; border: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-toolbar .ov-power { display: flex; flex-wrap: wrap; gap: .75rem; width: auto; }

/* badges: Sneat bg-label-* */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-badge, .ov-card__meta) {
    gap: .375rem;
    min-height: 0;
    padding: .4235em .77em;
    border: 0;
    border-radius: var(--snb-radius-sm);
    background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary));
    color: var(--snb-secondary);
    font-size: .8125rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: normal;
    white-space: nowrap;
}
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-badge:not(.on, .warn, .bad, .info), .ov-card__meta) { background: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-secondary)); color: #b2b2c4; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-badge:not(.busy)::before { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-badge.on { background: var(--ov-ok-soft); color: var(--snb-success); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-badge.warn { background: var(--ov-warn-soft); color: var(--snb-warning); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-badge.bad { background: var(--ov-bad-soft); color: var(--snb-danger); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-badge.info { background: var(--snb-primary-label); color: var(--snb-primary-text); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell #ov-state { min-height: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-kv, .ov-ip__top, .ov-rule) .ov-badge { margin: 0; padding: .3em .6em; font-size: .75rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__meta { margin-inline-start: auto; }

/* buttons: Sneat solid primary / label variants */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-power__btn, .ov-btn, .ov-rowbtn) {
    --cl-c: var(--snb-primary);
    --cl-text: var(--snb-primary-text);
    --cl-label: var(--snb-primary-label);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .375rem;
    width: auto;
    min-width: 0;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: .4812rem 1.25rem;
    border: 1px solid transparent;
    border-radius: var(--snb-radius);
    background: var(--cl-label);
    color: var(--cl-text);
    font-size: .9375rem;
    font-weight: 500;
    line-height: 1.375;
    white-space: nowrap;
    box-shadow: none;
    transition: none;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-power__btn, .ov-btn, .ov-rowbtn):hover:not(:disabled) { border-color: transparent; background: var(--cl-c); color: #fff; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-rowbtn { padding: .317rem .75rem; border-radius: var(--snb-radius-sm); font-size: .8125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-rowbtn, .ov-btn:not(.ov-btn--primary):not(.danger), .ov-power__btn:not(.is-go):not(.is-stop)) {
    --cl-c: var(--snb-secondary);
    --cl-text: var(--snb-secondary);
    --cl-label: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary));
}
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-rowbtn, .ov-btn:not(.ov-btn--primary):not(.danger), .ov-power__btn:not(.is-go):not(.is-stop)) { --cl-text: #b2b2c4; --cl-label: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-secondary)); }
/* rescue boot changes how the server starts: Sneat label-warning */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-btn[data-ov-do="rescue"]:not(.ov-btn--primary):not(.danger) { --cl-c: var(--snb-warning); --cl-text: var(--snb-warning); --cl-label: var(--ov-warn-soft); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-power__btn.is-stop, .ov-btn.danger, .ov-rowbtn.danger) {
    --cl-c: var(--snb-danger);
    --cl-text: var(--snb-danger);
    --cl-label: var(--ov-bad-soft);
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-power__btn.is-go, .ov-btn--primary) {
    border-color: var(--snb-primary);
    background: var(--snb-primary);
    color: #fff;
    box-shadow: 0 .125rem .25rem 0 rgba(var(--snb-primary-rgb), .4);
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-power__btn.is-go, .ov-btn--primary):hover:not(:disabled) { border-color: var(--snb-primary-hover); background: var(--snb-primary-hover); color: #fff; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-power__btn, .ov-btn, .ov-rowbtn):disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-power__btn.is-go:disabled { border-color: transparent; background: var(--snb-primary-label); color: var(--snb-primary-text); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-power__ic { flex: 0 0 auto; width: 1.125rem; height: 1.125rem; background: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-power__tx strong { font-size: inherit; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-btn > svg { width: 1.0625rem; height: 1.0625rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-icon, .ov-copy) {
    flex: 0 0 auto;
    width: 2.375rem;
    min-width: 0;
    height: 2.375rem;
    padding: 0;
    border: 0;
    border-radius: 50rem;
    background: transparent;
    color: var(--snb-secondary);
}
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-icon, .ov-copy) { color: #b2b2c4; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-icon, .ov-copy):hover { border: 0; background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary)); color: var(--snb-secondary); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-copy { width: 2rem; height: 2rem; border-radius: var(--snb-radius); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-copy.done { background: var(--ov-ok-soft); color: var(--snb-success); }

/* resource tiles: Sneat statistics cards */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-strip { gap: 1.5rem; margin: 0 0 1.5rem; padding: 0; border: 0; background: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res {
    min-height: 0;
    padding: 1.5rem;
    border: 0;
    border-radius: var(--snb-radius);
    background: var(--snb-paper);
    box-shadow: var(--snb-shadow);
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res::after { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res__head { flex-direction: column; align-items: flex-start; gap: .75rem; color: var(--snb-body); font-size: .9375rem; font-weight: 400; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res__head span { font-size: .9375rem; white-space: normal; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res .ov-resource-icon { flex: 0 0 auto; width: 2.5rem; height: 2.5rem; border-radius: var(--snb-radius); background: color-mix(in sRGB, var(--snb-paper) 84%, var(--res)); }
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res .ov-resource-icon { background: color-mix(in sRGB, var(--snb-paper) 80%, var(--res)); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-resource-icon svg { width: 1.25rem; height: 1.25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res__value { align-items: baseline; gap: .375rem; margin-top: .25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res__value b { color: var(--snb-heading); font-size: 1.5rem; font-weight: 500; line-height: 1.37; letter-spacing: normal; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res__value--text b { font-size: 1.125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res__value .ov-flag { width: 1.25rem; margin-inline-end: .25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res__value small { color: var(--snb-body); font-size: .8125rem; font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res__meta { margin-top: .125rem; padding: 0; color: var(--snb-muted); font-size: .8125rem; font-weight: 400; white-space: normal; overflow-wrap: anywhere; }

/* notes: Sneat alerts */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-note {
    display: block;
    margin: 1.25rem 0 0;
    padding: .75rem 1rem;
    border: 0;
    border-radius: var(--snb-radius);
    background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary));
    color: var(--snb-heading);
    font-size: .875rem;
    line-height: 1.5;
}
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-note:not(.info, .warn, .bad, .ok) { background: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-secondary)); color: #b2b2c4; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-note::before { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-note.info { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-primary)); color: var(--snb-primary-text); }
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-note.info { background: color-mix(in sRGB, var(--snb-paper) 80%, #c98ae0); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-note.warn { background: var(--ov-warn-soft); color: var(--snb-warning); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-note.bad { background: var(--ov-bad-soft); color: var(--snb-danger); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-note.ok { background: var(--ov-ok-soft); color: var(--snb-success); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-note b { font-weight: 600; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .hg-cloud-primary-pane > .ov-note { margin: 0 0 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-flash { margin: 0 0 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-flash:empty { display: none; }

/* tabs: Sneat nav-pills (radio-driven; wrap on wide screens, scroll on phones) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-tabs { margin-top: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-tabnav {
    flex-wrap: wrap;
    gap: .25rem;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    overflow: visible;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-tabnav > label {
    flex: 0 0 auto !important;
    gap: .5rem;
    min-width: 0;
    min-height: 0;
    margin: 0 !important;
    padding: .5435rem .875rem !important;
    border: 0;
    border-radius: var(--snb-radius);
    background: transparent;
    color: var(--snb-heading) !important;
    font-size: .9375rem !important;
    font-weight: 500 !important;
    line-height: 1.375;
    white-space: nowrap !important;
    text-align: start;
    box-shadow: none;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-tabnav > label:hover { background: rgba(var(--snb-primary-rgb), .16); color: var(--snb-primary-text) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(#ov-tab-genel:checked ~ .ov-tabnav > label[for="ov-tab-genel"], #ov-tab-erisim:checked ~ .ov-tabnav > label[for="ov-tab-erisim"], #ov-tab-os:checked ~ .ov-tabnav > label[for="ov-tab-os"], #ov-tab-yedek:checked ~ .ov-tabnav > label[for="ov-tab-yedek"], #ov-tab-ag:checked ~ .ov-tabnav > label[for="ov-tab-ag"], #ov-tab-gorev:checked ~ .ov-tabnav > label[for="ov-tab-gorev"]) {
    background: var(--snb-primary);
    color: #fff !important;
    box-shadow: 0 .125rem .25rem 0 rgba(var(--snb-primary-rgb), .4);
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-tabnav > label svg { width: 1.0625rem; height: 1.0625rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-panel { gap: 1.5rem; margin-top: 1.5rem; }

/* cards: Sneat card / card-header (title + actions) / card-body / footer actions */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card {
    border: 0;
    border-radius: var(--snb-radius);
    background: var(--snb-paper);
    box-shadow: var(--snb-shadow);
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__head {
    flex-wrap: wrap;
    gap: .5rem .75rem;
    min-height: 0;
    padding: 1.5rem 1.5rem 0;
    border: 0;
    background: transparent;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__head h4 { color: var(--snb-heading) !important; font-size: 1.125rem !important; font-weight: 500 !important; line-height: 1.37; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__head .ov-card__icon { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__head .ov-refresh { margin: -.4375rem -.5rem -.4375rem auto; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__body { padding: 1.25rem 1.5rem 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__foot { padding: 0 1.5rem 1.5rem; border: 0; background: transparent; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-lead { color: var(--snb-body); font-size: .9375rem; line-height: 1.5; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-card__body > small, .ov-field small, .ov-count) { color: var(--snb-body); font-size: .8125rem; line-height: 1.5; }

/* key/value rows */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-kv { gap: .25rem 1rem; min-height: 0; padding: .75rem 0; border-bottom: 1px solid var(--snb-border); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-kv-list > .ov-kv:last-child { border-bottom: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-kv > .k { color: var(--snb-body); font-size: .9375rem; font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-kv > .v { color: var(--snb-heading); font-size: .9375rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-kv > .v.mono { font-size: .8125rem; font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-kv > .v .ov-flag { margin-inline-end: .25rem; }

/* connection: every value is a read-only field (label above, value + copy button inside) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-connection-body { gap: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-addr-grid, .ov-connection-fields) { gap: 1rem 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-addr { padding: 0; border: 0; border-radius: 0; background: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-addr__label, .ov-connection-label) { gap: .375rem; color: var(--snb-heading); font-size: .8125rem; font-weight: 400; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-addr__label svg { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-connection-field { gap: .25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-addr__row, .ov-connection-value) {
    display: flex;
    align-items: center;
    gap: .25rem;
    min-height: calc(1.375em + 1.086rem + 2px);
    margin: .25rem 0 0;
    padding: .1875rem .1875rem .1875rem .9375rem;
    border: 1px solid var(--snb-input-border);
    border-radius: var(--snb-radius);
    background: transparent;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-connection-value { margin: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-addr .ov-addr__value, .ov-connection-value > .mono, .ov-connection-value > code, .ov-connection-value > .ov-secret) { flex: 1 1 auto; min-width: 0; color: var(--snb-heading); font-size: .875rem; font-weight: 400; line-height: 1.4; overflow-wrap: anywhere; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-addr .ov-copy { border: 0; background: transparent; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-connection-body > .ov-note { margin: 0; }

/* forms: Sneat labels above form-control / form-select */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-field { gap: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-field, .ov-control) > :is(label, .ov-field__label) { margin: 0; color: var(--snb-heading) !important; font-size: .8125rem !important; font-weight: 400 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-field > label ~ label { margin-top: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-control { gap: .25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-input {
    height: auto;
    min-height: calc(1.375em + 1.086rem + 2px);
    padding: .543rem .9375rem;
    border: 1px solid var(--snb-input-border);
    border-radius: var(--snb-radius);
    background-color: transparent;
    color: var(--snb-heading);
    font-size: .9375rem;
    line-height: 1.375;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell select.ov-input {
    padding-inline-end: 2.625rem;
    appearance: none;
    -webkit-appearance: none;
    background-image: var(--snb-select-img);
    background-repeat: no-repeat;
    background-position: right .9375rem center;
    background-size: 22px 24px;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell select.ov-input option { background-color: var(--snb-paper); color: var(--snb-heading); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-input::placeholder { color: var(--snb-muted); opacity: 1; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-input:focus { border-color: var(--snb-primary); box-shadow: inset 0 0 0 1px var(--snb-primary), 0 .125rem .25rem 0 rgba(var(--snb-primary-rgb), .4); }
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-input:focus { border-color: #c98ae0; box-shadow: inset 0 0 0 1px #c98ae0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-input:disabled { border-color: var(--snb-input-disabled-border); background-color: var(--snb-input-disabled-bg); opacity: 1; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-field--row { gap: 1rem; }
/* one field + its button: the field takes the room, the button keeps its label width */
@container ovh-card (min-width: 400px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-field--row:has(> .ov-control:first-child + .ov-btn:last-child) { grid-template-columns: minmax(0, 1fr) auto; }
}

/* lazy output: Sneat list rows, empty states, placeholders */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-out { gap: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-snap, .ov-item, .ov-rule) {
    gap: .75rem 1rem;
    padding: .875rem 0;
    border: 0;
    border-bottom: 1px solid var(--snb-border);
    border-radius: 0;
    background: none;
    color: var(--snb-heading);
    font-size: .9375rem;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-snap, .ov-item, .ov-rule):last-child { border-bottom: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-snap, .ov-item, .ov-rule):first-child { padding-top: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-scroll > :is(.ov-snap, .ov-item, .ov-rule):first-child { padding-top: .875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-item span { color: var(--snb-heading); font-size: .9375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-item b, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-rule b { font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-snap small, .ov-item em) { display: block; margin-top: .125rem; color: var(--snb-body); font-size: .8125rem; font-style: normal; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell :is(.ov-snap, .ov-item) code { color: var(--snb-heading); font-size: .875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-snap-actions { gap: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .75rem;
    margin: 0;
    padding: 1.5rem 1rem;
    border: 0;
    border-radius: var(--snb-radius);
    background: var(--snb-hover);
    color: var(--snb-body);
    font-size: .875rem;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-empty::before { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-skel-line { height: .75rem; border-radius: var(--snb-radius-sm); background: linear-gradient(100deg, var(--snb-hover) 30%, var(--snb-track) 50%, var(--snb-hover) 70%); background-size: 200% 100%; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-scroll { gap: 0; padding: 0 .25rem 0 0; border-block: 1px solid var(--snb-border); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-count { margin: 0 0 .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-progress { height: .375rem; margin-top: .5rem; border-radius: 50rem; background: var(--snb-track); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-progress > span { border-radius: 50rem; background: var(--snb-primary); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-out + :is(.ov-field, .ov-note) { margin-top: 1.25rem; }

/* operating systems: current system as a soft row, the gallery as Sneat custom options */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-current { gap: 1rem; padding: 1rem 1.25rem; border: 0; border-radius: var(--snb-radius); background: var(--snb-hover); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-current img { width: 2rem; height: 2rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-current small { color: var(--snb-body); font-size: .8125rem; font-weight: 400; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-current strong { color: var(--snb-heading); font-size: .9375rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-search { margin: 1.25rem 0 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-search .ov-input { padding-inline-start: 2.625rem; background-image: var(--snb-search-img); background-repeat: no-repeat; background-position: left .9375rem center; background-size: 1.125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-group { margin-top: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-group > h5 { gap: .5rem; margin: 0 0 .75rem; color: var(--snb-heading); font-size: .9375rem; font-weight: 500; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-group > h5 span { padding: .3em .6em; border: 0; border-radius: var(--snb-radius-sm); background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary)); color: var(--snb-secondary); font-size: .75rem; font-weight: 500; line-height: 1; }
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-group > h5 span { background: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-secondary)); color: #b2b2c4; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-grid { grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-card {
    gap: .625rem;
    min-height: 0;
    padding: 1.25rem .75rem;
    border: 1px solid var(--snb-border);
    border-radius: var(--snb-radius);
    background: transparent;
    color: var(--snb-heading);
    font-size: .875rem;
    font-weight: 500;
    box-shadow: none;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-card img { width: 2.25rem; height: 2.25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-card:hover:not(:disabled) { border-color: var(--snb-primary-text); background: transparent; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-card[aria-pressed="true"] { border-color: var(--snb-primary-text); background: var(--snb-primary-label); box-shadow: inset 0 0 0 1px var(--snb-primary-text); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-card small { color: var(--snb-body); font-size: .75rem; font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-pick { gap: .75rem; margin-bottom: 1rem; color: var(--snb-heading); font-size: .9375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-pick b { font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__foot > .ov-note { margin-top: 1.25rem; }

/* IP addresses: list rows (address + badges, facts, reverse DNS input group) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip { gap: .75rem; padding: 1.25rem 0; border: 0; border-bottom: 1px solid var(--snb-border); border-radius: 0; background: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip:first-child { padding-top: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip:last-child { padding-bottom: 0; border-bottom: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__top { gap: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__addr { color: var(--snb-heading); font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; font-size: .9375rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__top .ov-copy { margin-inline-start: -.25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__facts { gap: .5rem 1.5rem; font-size: .8125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__facts span { color: var(--snb-body); font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__facts b { color: var(--snb-heading); font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__facts b.mono { font-size: .8125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__rdns { gap: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__rdns > label { color: var(--snb-heading) !important; font-size: .8125rem !important; font-weight: 400 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__rdns .ov-input { flex: 1 1 14rem; height: auto; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip__rdns .ov-rowbtn { padding: .4812rem 1.25rem; border-radius: var(--snb-radius); font-size: .9375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-ip > small { margin-top: -.25rem; color: var(--snb-body); font-size: .8125rem; }

/* firewall: IP chooser as Sneat pills, rules as list rows, quick rules as small rounded buttons */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-pills { gap: .25rem; margin-bottom: 1.25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-pill {
    min-height: 0;
    padding: .4375rem .875rem;
    border: 0;
    border-radius: var(--snb-radius);
    background: transparent;
    color: var(--snb-heading);
    font-size: .875rem;
    font-weight: 500;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-pill:hover { background: rgba(var(--snb-primary-rgb), .16); color: var(--snb-primary-text); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-pill[aria-pressed="true"] { background: var(--snb-primary); color: #fff; box-shadow: 0 .125rem .25rem 0 rgba(var(--snb-primary-rgb), .4); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-fw-state { gap: .75rem; margin-bottom: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-fw-state > span { gap: .5rem; color: var(--snb-heading); font-size: .9375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-fw-state + .ov-note { margin: 0 0 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-rule { font-size: .9375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-rule .ov-badge { margin-inline-end: .5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-presets { gap: .5rem; margin-top: 1rem; color: var(--snb-body); font-size: .8125rem; font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-presets .ov-rowbtn { height: auto; min-height: 0; padding: .25rem .75rem; border: 1px solid var(--snb-input-border); border-radius: 50rem; background: transparent; color: var(--snb-heading); font-size: .8125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-presets .ov-rowbtn:hover:not(:disabled) { border-color: var(--snb-primary-text); background: var(--snb-primary-label); color: var(--snb-primary-text); }

@media (max-width: 767.98px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-tabnav { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-tabnav > label { padding-inline: 1rem !important; }
}
@media (max-width: 575.98px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-control-surface { padding: 1.25rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-hero { flex-wrap: wrap; flex-basis: 100%; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-hero__id { flex: 1 1 calc(100% - 3.75rem); }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-hero__state { width: 100%; margin: 0; padding-inline-start: 3.75rem; justify-content: space-between; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-toolbar { flex: 1 1 100%; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-toolbar .ov-power { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-toolbar .ov-power__btn { flex-direction: row; gap: .25rem; min-height: 0; padding: .4812rem .5rem; font-size: .875rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-toolbar .ov-power__ic { display: none; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-toolbar .ov-power__tx { align-items: center; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-strip { gap: 1rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-res { padding: 1.25rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__head { padding: 1.25rem 1.25rem 0; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__body { padding: 1rem 1.25rem 1.25rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-card__foot { padding: 0 1.25rem 1.25rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) #ov-shell.ov-shell .ov-os-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
}

/* console window: panel.js moves it under <body> (outside .sn-root), so it is themed from body.hg-sneat as a Sneat modal */
body.hg-sneat .ov-modal {
    --om-card: var(--snb-paper);
    --om-text: var(--snb-heading);
    --om-muted: var(--snb-body);
    --om-border: var(--snb-border);
    --om-soft: var(--snb-hover);
    --om-accent: var(--snb-primary-text);
    --om-ring: rgba(var(--snb-primary-rgb), .3);
    background: rgba(34, 48, 62, .5);
    font-family: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: .9375rem;
}
html[data-bs-theme="dark"] body.hg-sneat .ov-modal { background: rgba(0, 0, 0, .6); }
body.hg-sneat .ov-modal__box { border: 0; border-radius: var(--snb-radius-lg); box-shadow: var(--snb-modal-shadow); }
body.hg-sneat .ov-modal__head { gap: .5rem; min-height: 0; padding: 1.25rem 1.5rem; border-bottom: 0; }
body.hg-sneat .ov-modal__head h4 { color: var(--snb-heading); font-size: 1.125rem; font-weight: 500; }
body.hg-sneat .ov-modal__host { color: var(--snb-body); font-size: .8125rem; font-weight: 400; }
body.hg-sneat .ov-modal__btn {
    height: auto;
    padding: .317rem .75rem;
    border: 0;
    border-radius: var(--snb-radius-sm);
    background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary));
    color: var(--snb-secondary);
    font-size: .8125rem;
    font-weight: 500;
    line-height: 1.375;
}
html[data-bs-theme="dark"] body.hg-sneat .ov-modal__btn { background: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-secondary)); color: #b2b2c4; }
body.hg-sneat .ov-modal__btn:hover { background: var(--snb-secondary); color: #fff; }
body.hg-sneat .ov-modal__btn--icon { width: 2rem; height: 2rem; padding: 0; border-radius: 50rem; background: transparent; }
body.hg-sneat .ov-modal__body { margin: 0 1.5rem 1.5rem; border-radius: var(--snb-radius); overflow: hidden; }
@media (max-width: 640px) {
    body.hg-sneat .ov-modal__box { border-radius: 0; }
    body.hg-sneat .ov-modal__head { padding: 1rem; }
    body.hg-sneat .ov-modal__head h4 { flex: 1 1 100%; }
    body.hg-sneat .ov-modal__btn--icon { position: absolute; top: .75rem; right: .75rem; }
    body.hg-sneat .ov-modal__head { position: relative; padding-inline-end: 3.5rem; }
    body.hg-sneat .ov-modal__body { margin: 0; border-radius: 0; }
}


/* ============================================================== OVH dedicated + Contabo (ModulesGarden Layers UI, #layers)
   No live service of either module exists; reviewed through an offline render of the templates inside the real frame
   (work/ovh/render.php + harness.mjs). layers-ui.css and the module styles are #layers-scoped (1 id, a few !important),
   so the 5-id prefix wins; !important only where the module itself uses it (tiles, OS grid). */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers {
    color: var(--snb-body) !important;
    font-family: inherit;
    font-size: .9375rem;
    line-height: 1.375;
    --hg: var(--snb-primary-text);
    --hg2: var(--snb-primary-hover);
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers #layers-body { padding: 0; background: none !important; }

/* dark: the legacy theme layer (css/custom.css) paints #layers with fixed dark colours and !important (up to 2 ids);
   these neutral Sneat values carry no extra specificity (:where), the component rules below refine them */
:where(html[data-bs-theme="dark"]) body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id, .cs-fwadd, .cs-fwip, .cs-id, .cs-ipcard, .cs-ipstat, .cs-oscard, .cs-osmodal__box, .cs-pnet, .cs-sdns-card, .cs-sdns-chip, .cs-side__card, .cs-st-card, .cs-stat, .lu-tile, .ovh-ipcard, .ovh-oscard, .ovh-sdns-card, .ovh-side__card, .ovh-st-card, .ovh-stat, .lu-alert--outline, .lu-dropdown, .lu-modal__content, .lu-widget, .lu-off-canvas, .lu-t-c__body--boxed) { background: var(--snb-paper) !important; border-color: var(--snb-border) !important; color: var(--snb-body) !important; box-shadow: var(--snb-shadow) !important; }
:where(html[data-bs-theme="dark"]) body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.cs-copy, .cs-fwdel, .cs-iconbtn, .cs-set__btn, .lu-form-control, .ovh-copy, .ovh-iconbtn, .ovh-set__btn, .lu-input-group, .lu-form-indicator, .cs-seg__b, .cs-ossearch, .ovh-ossearch) { background-color: transparent !important; border-color: var(--snb-input-border) !important; color: var(--snb-heading) !important; box-shadow: none !important; }
:where(html[data-bs-theme="dark"]) body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.cs-id__name, .cs-info__val, .cs-mono, .cs-stat__val, .lu-tile__sub, .lu-tile__title, .ovh-ipcard__ip, .ovh-stat__v) { color: var(--snb-heading) !important; }
:where(html[data-bs-theme="dark"]) body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-info li:hover { background: transparent !important; }
:where(html[data-bs-theme="dark"]) body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn--primary { color: #fff !important; }

body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-layout, .cs-layout) { display: block; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-mono, .cs-mono, code) { color: inherit !important; font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; font-size: .875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-muted, .cs-muted) { color: var(--snb-body) !important; font-size: .875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-pad, .cs-pad) { padding: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-row { margin: 0 -.75rem; row-gap: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-row > [class*="lu-col"] { padding: 0 .75rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-row > [class*="lu-col"] > .lu-widget + .lu-widget { margin-top: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-m-t-3x { margin-top: 1.5rem !important; }

/* identity row: one flat Sneat card (avatar, name, facts as label badges, status badge) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id, .cs-id) {
    gap: 1rem 1.25rem;
    margin: 0;
    padding: 1.5rem;
    border: 0 !important;
    border-radius: var(--snb-radius);
    background: var(--snb-paper) !important;
    box-shadow: var(--snb-shadow) !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id, .cs-id)::before { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id__icon, .cs-id__icon) { width: 2.75rem; height: 2.75rem; border-radius: var(--snb-radius); background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; font-size: 1.25rem; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id__name, .cs-id__name) { color: var(--snb-heading) !important; font-size: 1.125rem; font-weight: 500; line-height: 1.37; word-break: normal; overflow-wrap: anywhere; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id__sub, .cs-id__sub) { gap: .5rem; margin-top: .5rem; font-size: .8125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id__sub, .cs-id__sub) span { gap: .375rem; padding: .3em .6em; border-radius: var(--snb-radius-sm); background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary)) !important; color: var(--snb-secondary) !important; font-weight: 500; }
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id__sub, .cs-id__sub) span { background: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-secondary)) !important; color: #b2b2c4 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id__sub, .cs-id__sub) span i { color: inherit !important; font-size: .75rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id__status, .cs-id__status) { gap: .375rem; padding: .4235em .77em; border: 0 !important; border-radius: var(--snb-radius-sm); background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-success)) !important; color: var(--snb-success) !important; font-size: .8125rem; font-weight: 500; line-height: 1; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id__status--off, .cs-id__status--warn) { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-warning)) !important; color: var(--snb-warning) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-id__status--off { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-danger)) !important; color: var(--snb-danger) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id__dot, .cs-id__dot) { display: none; }

/* server actions: the heading stays for screen readers, the tiles become one Sneat card of shortcut buttons */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .h4 {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
    gap: 1rem;
    margin: 0 !important;
    padding: 1.5rem;
    border-radius: var(--snb-radius);
    background: var(--snb-paper) !important;
    box-shadow: var(--snb-shadow) !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles > .lu-col-sm-20p { flex: none !important; width: auto !important; max-width: none !important; padding: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles .lu-tile {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .625rem;
    height: 100%;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 1.25rem .75rem !important;
    border: 1px solid var(--snb-border) !important;
    border-radius: var(--snb-radius) !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    transition: none !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles .lu-tile:hover { border-color: var(--snb-primary-text) !important; background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles .lu-i-c-6x { width: 2.5rem !important; height: 2.5rem !important; min-width: 2.5rem !important; margin: 0 !important; border-radius: var(--snb-radius) !important; transform: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles .lu-i-c-6x i { font-size: 1.125rem !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles .lu-tile__title { margin: 0; color: var(--snb-heading) !important; font-size: .875rem !important; font-weight: 500 !important; line-height: 1.3; text-align: center; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-tile--reboot .lu-i-c-6x { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-warning)) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-tile--reboot .lu-i-c-6x i { color: var(--snb-warning) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-tile--rescue, .lu-tile--kvm, .lu-tile--start) .lu-i-c-6x { background: var(--snb-primary-label) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-tile--rescue, .lu-tile--kvm) .lu-i-c-6x i { color: var(--snb-primary-text) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-tile--start .lu-i-c-6x i { color: var(--snb-success) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-tile--start .lu-i-c-6x { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-success)) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-tile--boot .lu-i-c-6x { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary)) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-tile--boot .lu-i-c-6x i { color: var(--snb-secondary) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-tile--reinstall, .lu-tile--stop, .lu-tile--danger) .lu-i-c-6x { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-danger)) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-tile--reinstall, .lu-tile--stop, .lu-tile--danger) .lu-i-c-6x i { color: var(--snb-danger) !important; }

/* widgets: Sneat cards (card-header title + toolbar, card-body) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget {
    margin: 0 0 1.5rem;
    border: 0 !important;
    border-radius: var(--snb-radius);
    background: var(--snb-paper) !important;
    box-shadow: var(--snb-shadow) !important;
    overflow: hidden;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-row > [class*="lu-col"] > .lu-widget:last-child, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-page, .cs-page) > .lu-widget:last-child { margin-bottom: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__header { padding: 0; border: 0 !important; background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__top { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem .75rem; min-height: 0; padding: 1.5rem 1.5rem 0; border: 0 !important; background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__top .lu-top__title { display: flex; align-items: center; gap: .5rem; margin: 0; color: var(--snb-heading) !important; font-size: 1.125rem !important; font-weight: 500; line-height: 1.37; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__top .lu-top__title > i { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-top__toolbar { display: flex; align-items: center; gap: .5rem; margin-inline-start: auto; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__body { padding: 1.25rem 1.5rem 1.5rem; border: 0 !important; background: transparent !important; color: var(--snb-body) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__body:has(> :is(.lu-table, .lu-list-group, .ovh-info, .cs-info, .cs-set):only-child) { padding: .75rem 0 .5rem; }

/* buttons: Sneat primary / label variants */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn {
    --cl-c: var(--snb-secondary);
    --cl-text: var(--snb-secondary);
    --cl-label: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .375rem;
    height: auto;
    min-height: 0;
    padding: .4812rem 1.25rem;
    border: 1px solid transparent !important;
    border-radius: var(--snb-radius);
    background: var(--cl-label) !important;
    color: var(--cl-text) !important;
    font-size: .9375rem;
    font-weight: 500;
    line-height: 1.375;
    text-transform: none;
    box-shadow: none !important;
}
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn { --cl-text: #b2b2c4; --cl-label: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-secondary)); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn:hover:not(:disabled) { border-color: transparent !important; background: var(--cl-c) !important; color: #fff !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn i { margin: 0 !important; color: inherit !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn--warning { --cl-c: var(--snb-warning); --cl-text: var(--snb-warning) !important; --cl-label: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-warning)) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn--danger { --cl-c: var(--snb-danger); --cl-text: var(--snb-danger) !important; --cl-label: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-danger)) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn--success { --cl-c: var(--snb-success); --cl-text: var(--snb-success) !important; --cl-label: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-success)) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn--primary { border-color: var(--snb-primary) !important; background: var(--snb-primary) !important; color: #fff !important; box-shadow: 0 .125rem .25rem 0 rgba(var(--snb-primary-rgb), .4) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn--primary:hover:not(:disabled) { border-color: var(--snb-primary-hover) !important; background: var(--snb-primary-hover) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn--sm { padding: .317rem .75rem; border-radius: var(--snb-radius-sm); font-size: .8125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-btn:disabled { opacity: .45; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-copy, .cs-copy, .ovh-iconbtn, .cs-iconbtn) {
    width: 2rem;
    height: 2rem;
    border: 0 !important;
    border-radius: var(--snb-radius);
    background: transparent !important;
    color: var(--snb-secondary) !important;
}
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-copy, .cs-copy, .ovh-iconbtn, .cs-iconbtn) { color: #b2b2c4 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-copy, .cs-copy, .ovh-iconbtn, .cs-iconbtn):hover { border: 0 !important; background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary)) !important; color: var(--snb-secondary) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-copy, .cs-copy).ok { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-success)) !important; color: var(--snb-success) !important; }

/* badges / tags: Sneat bg-label-* */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-badge, .ovh-tag, .ovh-ipcard__ver, .cs-ipcard__ver, .cs-apptag, .ovh-flag) {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .4235em .77em;
    border: 0 !important;
    border-radius: var(--snb-radius-sm);
    background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary)) !important;
    color: var(--snb-secondary) !important;
    font-size: .8125rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
}
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-badge, .ovh-tag, .ovh-ipcard__ver, .cs-ipcard__ver, .cs-apptag, .ovh-flag):not(.lu-badge--success, .lu-badge--warning, .lu-badge--danger, .lu-badge--info, .lu-badge--primary, .ovh-tag--primary, .ovh-tag--fo) { background: color-mix(in sRGB, var(--snb-paper) 80%, var(--snb-secondary)) !important; color: #b2b2c4 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipcard__ver, .cs-ipcard__ver) { padding: .3em .5em; font-size: .6875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-badge--success) { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-success)) !important; color: var(--snb-success) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-badge--warning) { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-warning)) !important; color: var(--snb-warning) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-badge--danger) { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-danger)) !important; color: var(--snb-danger) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-badge--info, .lu-badge--primary, .ovh-tag--primary) { background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-tag--fo { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-info)) !important; color: var(--snb-info) !important; }

/* alerts and notes: Sneat alerts */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-alert { margin: 0 0 1.5rem; padding: .75rem 1rem; border: 0 !important; border-radius: var(--snb-radius); background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary)) !important; color: var(--snb-heading) !important; font-size: .875rem; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-alert::before { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-alert__body { padding: 0; color: inherit !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-alert--danger { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-danger)) !important; color: var(--snb-danger) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-alert--success { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-success)) !important; color: var(--snb-success) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-alert--warning { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-warning)) !important; color: var(--snb-warning) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-alert--info { background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-note, .cs-note, .cs-status-notice) { gap: .5rem; margin: 1.25rem 0 0; padding: .75rem 1rem; border: 0 !important; border-radius: var(--snb-radius); background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; font-size: .875rem; line-height: 1.5; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-note, .cs-note) i { color: inherit !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-note, .cs-note) b { font-weight: 600; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-empty, .cs-empty, .ovh-fwempty) { padding: 1.5rem 1rem; border: 0 !important; border-radius: var(--snb-radius); background: var(--snb-hover) !important; color: var(--snb-body) !important; font-size: .875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-empty, .cs-empty) i { opacity: 1; color: var(--snb-muted) !important; font-size: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-empty, .cs-empty) span { font-weight: 400; }

/* tables and lists: Sneat basic tables / key-value rows */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-table { width: 100%; margin: 0; border-collapse: collapse; background: transparent !important; color: var(--snb-body) !important; font-size: .9375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-table thead th { padding: .875rem 1.5rem; border: 0 !important; border-bottom: 1px solid var(--snb-border) !important; background: transparent !important; color: var(--snb-heading) !important; font-size: .8125rem; font-weight: 500; letter-spacing: .2px; text-transform: uppercase; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-table tbody td { padding: .782rem 1.5rem; border: 0 !important; border-bottom: 1px solid var(--snb-border) !important; background: transparent !important; color: var(--snb-body) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-table tbody tr:last-child td { border-bottom: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-table tbody tr:hover { background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-table code { padding: 0; background: none !important; color: var(--snb-heading) !important; font-size: .875rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__body > .lu-table thead th:first-child, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__body > .lu-table td:first-child { padding-inline-start: 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-info, .cs-info) { padding: 0; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-info, .cs-info) li { gap: .75rem; padding: .75rem 1.5rem; border-bottom: 1px solid var(--snb-border) !important; font-size: .9375rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-info, .cs-info) li:last-child { border-bottom: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-info, .cs-info) li:hover { background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-info__ic, .cs-info__ic) { display: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-info__lbl, .cs-info__lbl) { width: auto; min-width: 8rem; color: var(--snb-body) !important; font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-info__val, .cs-info__val) { gap: .25rem; color: var(--snb-heading) !important; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-list-group { margin: 0; border: 0 !important; background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-list-group__item { padding: .75rem 1.5rem; border: 0 !important; border-bottom: 1px solid var(--snb-border) !important; background: transparent !important; color: var(--snb-heading) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-list-group__item:last-child { border-bottom: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-list-group__title { color: var(--snb-body) !important; font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-list-group__addon { color: var(--snb-heading) !important; font-weight: 500; }

/* forms */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-form-control, .ovh-ossearch input, .cs-ossearch input) {
    min-height: calc(1.375em + 1.086rem + 2px);
    padding: .543rem .9375rem;
    border: 1px solid var(--snb-input-border) !important;
    border-radius: var(--snb-radius);
    background-color: transparent !important;
    color: var(--snb-heading) !important;
    font-size: .9375rem;
    line-height: 1.375;
    box-shadow: none !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ossearch, .cs-ossearch) input { padding-inline-start: 2.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers select.lu-form-control { padding-inline-end: 2.625rem; appearance: none; -webkit-appearance: none; background-image: var(--snb-select-img) !important; background-repeat: no-repeat; background-position: right .9375rem center; background-size: 22px 24px; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers select.lu-form-control option { background-color: var(--snb-paper) !important; color: var(--snb-heading) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-form-control, .ovh-ossearch input, .cs-ossearch input):focus { border-color: var(--snb-primary) !important; box-shadow: inset 0 0 0 1px var(--snb-primary), 0 .125rem .25rem 0 rgba(var(--snb-primary-rgb), .4) !important; }
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-form-control, .ovh-ossearch input, .cs-ossearch input) { color-scheme: dark; }
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-form-control, .ovh-ossearch input, .cs-ossearch input):focus { border-color: #c98ae0 !important; box-shadow: inset 0 0 0 1px #c98ae0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.lu-form-control, .ovh-ossearch input, .cs-ossearch input)::placeholder { color: var(--snb-muted) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-fwform, .cs-action-fields) label, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwlabel, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-osmodal__flbl { color: var(--snb-heading) !important; font-size: .8125rem; font-weight: 400; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwform .lu-form-control { width: 100%; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwopts label { color: var(--snb-heading) !important; font-size: .875rem; font-weight: 400; }

/* statistic cards (overview, IP pages) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stats, .cs-stats) { gap: 1.5rem; margin: 0 0 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipstats, .cs-ipstats) { gap: 1.5rem; margin: 0 0 1.5rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat, .cs-stat, .ovh-ipstat, .cs-ipstat) {
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    border: 0 !important;
    border-radius: var(--snb-radius);
    background: var(--snb-paper) !important;
    box-shadow: var(--snb-shadow) !important;
    transform: none;
    transition: none;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget :is(.ovh-ipstat, .cs-ipstat) { background: var(--snb-hover) !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat, .cs-stat):hover { transform: none; box-shadow: var(--snb-shadow) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat__ic, .cs-stat__ic, .ovh-ipstat__ic, .cs-ipstat__ic) { width: 2.5rem; height: 2.5rem; border-radius: var(--snb-radius); font-size: 1.125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat__lbl, .cs-stat__lbl, .ovh-ipstat__l, .cs-ipstat__l) { margin: 0; color: var(--snb-body) !important; font-size: .8125rem; font-weight: 400; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipstat__l, .cs-ipstat__l) { margin-top: .25rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat__val, .cs-stat__val) { color: var(--snb-heading) !important; font-size: 1rem; font-weight: 500; line-height: 1.4; white-space: normal; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipstat__n, .cs-ipstat__n) { color: var(--snb-heading) !important; font-size: 1.25rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat__sub, .cs-stat__sub) { color: var(--snb-muted) !important; font-size: .8125rem; font-weight: 400; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat--cpu, .cs-stat--cpu) :is(.ovh-stat__ic, .cs-stat__ic) { background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat--ram, .cs-stat--ram) :is(.ovh-stat__ic, .cs-stat__ic) { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-info)) !important; color: var(--snb-info) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat--disk, .cs-stat--disk) :is(.ovh-stat__ic, .cs-stat__ic) { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-warning)) !important; color: var(--snb-warning) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat--up, .cs-stat--up) :is(.ovh-stat__ic, .cs-stat__ic) { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-success)) !important; color: var(--snb-success) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stat--down, .cs-stat--down) :is(.ovh-stat__ic, .cs-stat__ic) { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-danger)) !important; color: var(--snb-danger) !important; }

/* IP cards: list rows inside the card, no card in card */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipgrid, .cs-ipgrid) { gap: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipcard, .cs-ipcard) { border: 1px solid var(--snb-border) !important; border-radius: var(--snb-radius); background: transparent !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipcard, .cs-ipcard):hover { box-shadow: none !important; border-color: var(--snb-border) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipcard--primary, .cs-ipcard--primary) { border-color: var(--snb-border) !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipcard__top, .cs-ipcard__top) { padding: .875rem 1.25rem; border-bottom: 1px solid var(--snb-border) !important; background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-ipcard--wide .ovh-ipwide__id { padding: 1rem 1.25rem; border-color: var(--snb-border) !important; background: transparent !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-ipcard--wide .ovh-ipwide__f { padding: 1rem 1.25rem; border-color: var(--snb-border) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-ipcard__ip, .cs-ipcard__ip) { color: var(--snb-heading) !important; font-size: .9375rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-ipfield { border-color: var(--snb-border) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-ipfield__lbl { color: var(--snb-heading) !important; font-size: .8125rem; font-weight: 400; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-ipfield__lbl i { color: var(--snb-muted) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwstate { color: var(--snb-body) !important; font-size: .875rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwstate.is-on { color: var(--snb-success) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-rulesbtn { color: var(--snb-primary-text) !important; font-size: .875rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-macval code { padding: .25rem .5rem; border-radius: var(--snb-radius-sm); background: var(--snb-hover) !important; color: var(--snb-heading) !important; }

/* firewall */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwip { min-height: 0; padding: .4375rem .875rem; border: 0 !important; border-radius: var(--snb-radius); background: transparent !important; color: var(--snb-heading) !important; font-size: .875rem; font-weight: 500; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwip:hover { background: rgba(var(--snb-primary-rgb), .16) !important; color: var(--snb-primary-text) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwip.is-active { background: var(--snb-primary) !important; color: #fff !important; box-shadow: 0 .125rem .25rem 0 rgba(var(--snb-primary-rgb), .4) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-fwadd, .ovh-fwpanel, .ovh-bigsw) { border: 1px solid var(--snb-border) !important; border-radius: var(--snb-radius) !important; background: transparent !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-fwadd__t, .ovh-fwhead__t) { color: var(--snb-heading) !important; font-size: .9375rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwchip { padding: .25rem .75rem; border: 1px solid var(--snb-input-border) !important; border-radius: 50rem; background: transparent !important; color: var(--snb-heading) !important; font-size: .8125rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwchip:hover { border-color: var(--snb-primary-text) !important; background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-fwcount { border-radius: var(--snb-radius-sm); background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-sw input:checked + .sl { background: var(--snb-primary) !important; }

/* OS gallery: Sneat custom options (brand icon colours kept) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-oscur-banner, .cs-oscur-banner) { gap: 1rem; padding: 1rem 1.25rem; border: 0 !important; border-radius: var(--snb-radius); background: var(--snb-hover) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-oscur-banner__lbl, .cs-oscur-banner__lbl) { color: var(--snb-body) !important; font-size: .8125rem; font-weight: 400; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-oscur-banner__name, .cs-oscur-banner__name) { color: var(--snb-heading) !important; font-size: .9375rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-os-sec__h, .cs-os-sec__h) { padding: 0 0 .75rem; color: var(--snb-heading) !important; font-size: .9375rem; font-weight: 500; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-os-sec__h, .cs-os-sec__h) span { padding: .3em .6em; border-radius: var(--snb-radius-sm); background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary)) !important; color: var(--snb-secondary) !important; font-size: .75rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-osgrid, .cs-osgrid) :is(.ovh-oscard, .cs-oscard) .lu-tile,
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-osgrid, .cs-osgrid) .lu-col-sm-20p > form > .lu-tile {
    min-height: 8.5rem !important;
    padding: 1.25rem .75rem 2.25rem !important;
    border: 1px solid var(--snb-border) !important;
    border-radius: var(--snb-radius) !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-osgrid, .cs-osgrid) :is(.ovh-oscard, .cs-oscard) .lu-tile:hover,
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-osgrid, .cs-osgrid) .lu-col-sm-20p > form > .lu-tile:hover { border-color: var(--snb-primary-text) !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-osgrid, .cs-osgrid) :is(.ovh-oscard, .cs-oscard) .lu-tile.cur { border-color: var(--snb-success) !important; background: color-mix(in sRGB, var(--snb-paper) 92%, var(--snb-success)) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-osgrid, .cs-osgrid) .lu-tile__title { color: var(--snb-heading) !important; font-size: .875rem !important; font-weight: 500 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-osgrid, .cs-osgrid) .lu-i-c-6x { border-radius: var(--snb-radius) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-osinstall, .cs-osinstall) { border-radius: var(--snb-radius-sm); background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-oscur) { border-radius: var(--snb-radius-sm); background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-success)) !important; color: var(--snb-success) !important; font-weight: 500; }

/* timelines (tasks, interventions, history): Sneat timeline points */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-tl__dot, .cs-tl__dot) { border-color: var(--snb-border) !important; background: var(--snb-paper) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-tl__title, .cs-tl__title) { color: var(--snb-heading) !important; font-size: .9375rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-tl__meta, .cs-tl__meta) { color: var(--snb-body) !important; font-size: .8125rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-tl, .cs-tl)::before { background: var(--snb-border) !important; }

/* power & boot grid, settings rows */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-pwgrid { gap: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-pwgrid .lu-btn { justify-content: flex-start; padding: .4812rem 1.25rem; border-radius: var(--snb-radius); font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__row { gap: .75rem 1rem; padding: 1rem 1.5rem; border-color: var(--snb-border) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__ic { width: 2.5rem; height: 2.5rem; border-radius: var(--snb-radius); font-size: 1rem; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__ic--name { background: var(--snb-primary-label) !important; color: var(--snb-primary-text) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__ic--pw { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-danger)) !important; color: var(--snb-danger) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__ic--boot { background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-info)) !important; color: var(--snb-info) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__lbl { color: var(--snb-body) !important; font-size: .8125rem; font-weight: 400; letter-spacing: normal; text-transform: none; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__val { color: var(--snb-heading) !important; font-size: .9375rem; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__btn { padding: .317rem .75rem; border: 0 !important; border-radius: var(--snb-radius-sm); background: color-mix(in sRGB, var(--snb-paper) 84%, var(--snb-secondary)) !important; color: var(--snb-secondary) !important; font-size: .8125rem; font-weight: 500; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__btn:hover { background: var(--snb-secondary) !important; color: #fff !important; }

/* connection boxes (SSH command, VNC address): soft read-only blocks instead of black terminals */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.cs-ssh, .cs-vnc__col:first-child, .cs-conn) { border: 0 !important; border-radius: var(--snb-radius) !important; background: var(--snb-hover) !important; color: var(--snb-body) !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.cs-ssh__t, .cs-conn__t) { color: var(--snb-heading) !important; font-size: .9375rem !important; font-weight: 500 !important; letter-spacing: normal !important; text-transform: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.cs-ssh__cmd, .cs-conn__row) { border: 1px solid var(--snb-input-border) !important; border-radius: var(--snb-radius) !important; background: var(--snb-paper) !important; color: var(--snb-heading) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.cs-ssh__cmd, .cs-conn__row) :is(code, span, b) { color: var(--snb-heading) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-conn__k { color: var(--snb-body) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.cs-ssh__hint, .cs-conn__hint) { color: var(--snb-body) !important; }

/* Contabo OS modal (inside #layers) */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-osmodal__box { border: 0 !important; border-radius: var(--snb-radius-lg); background: var(--snb-paper) !important; color: var(--snb-heading) !important; box-shadow: var(--snb-modal-shadow) !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-osmodal__head, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-osmodal__foot { border-color: var(--snb-border) !important; }

/* boxes inside cards: outlined, never a second shadowed card */
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.cs-pnet, .cs-sdns-card, .cs-sdns-chip, .ovh-sdns-card, .cs-fwadd, .cs-fwip, .cs-st-card, .ovh-st-card) { border: 1px solid var(--snb-border) !important; border-radius: var(--snb-radius); background: transparent !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-oscard, .cs-oscard, .ovh-osgrid, .cs-osgrid) { background: transparent !important; box-shadow: none !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-osgrid, .cs-osgrid) { border: 0 !important; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-pnet__ic { border-radius: var(--snb-radius); }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-pnet > div:last-child > div:first-child { color: var(--snb-heading) !important; font-weight: 500; }
body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-pnet > div:last-child > div + div { color: var(--snb-body) !important; }

/* dark mode: the module styles paint a few fixed light colours */
html[data-bs-theme="dark"] body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-tl__dot, .cs-tl__dot) { background: var(--snb-paper) !important; }

@media (max-width: 767.98px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-row > .lu-col-md-12 { flex: 0 0 100%; max-width: 100%; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles { grid-template-columns: repeat(auto-fit, minmax(5.5rem, 1fr)); padding: 1.25rem; gap: .75rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles .lu-tile { padding: 1rem .375rem !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .sn-ws-rail > .lu-tiles .lu-tile__title { font-size: .8125rem !important; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-ipcard--wide :is(.ovh-ipwide__id, .ovh-ipwide__fields, .ovh-ipwide__f) { flex-basis: auto; min-width: 0; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .ovh-ipcard--wide .ovh-ipwide__fields { flex-direction: column; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-stats, .cs-stats, .ovh-ipstats, .cs-ipstats) { gap: 1rem; }
}
@media (max-width: 575.98px) {
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-id, .cs-id) { padding: 1.25rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__top { padding: 1.25rem 1.25rem 0; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-widget__body { padding: 1rem 1.25rem 1.25rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers :is(.ovh-info, .cs-info) li, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-list-group__item, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .cs-set__row { padding-inline: 1.25rem; }
    body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-table thead th, body.hg-sneat #main-body:not(#sn-a):not(#sn-b):not(#sn-c) .sn-ws #layers .lu-table tbody td { padding-inline: 1.25rem; }
}