html, body { margin: 0; padding: 0; }
  html {
    scroll-behavior: smooth;
    color-scheme: dark;
  }
  body { font-family: 'Inter', sans-serif; background-color: #06070b; overflow-x: hidden; }

  /* Guarantee the native `hidden` attribute/property always hides an element,
     regardless of any later same-specificity component rule (e.g. `.hf-ui-btn`
     below sets `display: inline-flex` with equal specificity to `[hidden]` and
     would otherwise win by source order, silently keeping "hidden" buttons
     visible). Project convention is `el.hidden = true/false`, never
     `style.display` - this rule is what makes that convention actually work. */
  [hidden] { display: none !important; }

  /* The view-loader CSS (`.hf-ui-view-loader*`, `.hf-ui-view-loader-host`)
     and its JS API (`window.HfLoader`, `window.hfShowViewLoader`,
     `window.hfHideViewLoader`) live in `components/ui/loader.php`, which is
     `require_once`'d below this `<style>` block. Keep all loader styling
     and behavior in that single component. */
.hf-ui-panel,
.hf-ui-panel * {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
  }

  /* Legacy embed (iframe) or unified view.php panel: hide per-feature topbar when
     the wrapper already shows tabs. Class on <html> avoids a flash on load. */
  html.hf-frame-embed .hf-ui-shell--admin .hf-ui-shell__topbar,
  html.hf-frame-embed .hf-ui-shell--partner .hf-ui-shell__topbar {
    display: none !important;
  }
  html.hf-frame-embed [data-frame-embed-hide] {
    display: none !important;
  }
.hf-ui-panel input,
.hf-ui-panel textarea,
.hf-ui-panel [contenteditable="true"] {
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text;
  }

  /* MCQ rows: check icon lives inside the tile span, not as a sibling of input.peer - plain CSS ensures the tick shows when checked (labs/courses/events). */
  .mcq-options label:has(input:checked) > span:first-of-type svg {
    opacity: 1;
    transform: scale(1);
  }

  select {
    color-scheme: dark;
    color: #dcd8cf;
    cursor: pointer;
  }
  select option,
  select optgroup {
    background-color: #10131b;
    color: #dcd8cf;
  }
  select:disabled {
    opacity: 0.55;
    cursor: not-allowed;
  }
  select:not([multiple]) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 2.25rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%2394a3b8' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.65rem center;
    background-size: 1rem 1rem;
  }
  select[multiple] {
    padding-right: 0.75rem;
    background-image: none;
    cursor: default;
  }

  /* Single-line inputs and selects: same height as default `hf-ui-btn` (2rem).
     Use :is (not :where) so this beats Tailwind `h-10` / `h-11` utilities.
     Excludes non-row controls: checkbox, radio, hidden, file, range, color, image, button-like. */
  .hf-ui-shell :is(
    input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']),
    select:not([multiple])
  ),
  .page-content :is(
    input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']),
    select:not([multiple])
  ),
  [data-hf-entity-shell='1'] :is(
    input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']),
    select:not([multiple])
  ) {
    min-height: 2rem;
    max-height: 2rem;
    height: 2rem;
    box-sizing: border-box;
  }

  /* Temporal inputs: no `:where()` here - it zeroes specificity and Tailwind
     `px-*` / `py-*` on event forms was winning, leaving native picker chrome huge
     and the calendar icon visually centered. Match `hf-ui-control` height and
     pin WebKit's picker to the inside trailing edge. */
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='date'],
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='datetime-local'],
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='time'],
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='month'],
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='week'] {
    box-sizing: border-box !important;
    position: relative;
    display: flex !important;
    align-items: center !important;
    vertical-align: middle;
    /* Same vertical rhythm as `input.hf-ui-control` (overrides Tailwind py-2 on forms). */
    min-height: var(--hf-control-h, 2.25rem) !important;
    max-height: var(--hf-control-h, 2.25rem) !important;
    height: var(--hf-control-h, 2.25rem) !important;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
    padding-left: 0.75rem !important;
    line-height: 1.125rem !important;
    font-size: 0.75rem !important;
  }
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='date'],
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='datetime-local'],
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='month'],
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='week'] {
    /* Reserve gutter for absolutely positioned calendar icon (WebKit). */
    padding-right: 2.5rem !important;
  }
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='time'] {
    padding-right: 1rem !important;
  }
  @media (min-width: 640px) {
    :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='date'],
    :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='datetime-local'],
    :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='time'],
    :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='month'],
    :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='week'] {
      line-height: 1.125rem !important;
      font-size: 0.75rem !important;
    }
  }
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='date']::-webkit-datetime-edit,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='datetime-local']::-webkit-datetime-edit,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='time']::-webkit-datetime-edit,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='month']::-webkit-datetime-edit {
    padding: 0;
    margin: 0;
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    display: flex;
    align-items: center;
  }
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='date']::-webkit-datetime-edit-fields-wrapper,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='datetime-local']::-webkit-datetime-edit-fields-wrapper,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='time']::-webkit-datetime-edit-fields-wrapper,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='month']::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
    height: auto;
  }
  /* Blink/WebKit: calendar icon anchored to the padding edge (flex on host is unreliable). */
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='date']::-webkit-calendar-picker-indicator,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='datetime-local']::-webkit-calendar-picker-indicator,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='month']::-webkit-calendar-picker-indicator,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='week']::-webkit-calendar-picker-indicator {
    position: absolute !important;
    right: 0.45rem !important;
    top: 50% !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateY(-50%) !important;
    cursor: pointer;
    opacity: 0.92;
    width: 1rem !important;
    height: 1rem !important;
  }
  /* Firefox: trailing gutter + compact picker affordance */
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='date']::-moz-calendar-picker-indicator,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='datetime-local']::-moz-calendar-picker-indicator,
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input[type='month']::-moz-calendar-picker-indicator {
    margin-inline-start: auto !important;
    margin-inline-end: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    cursor: pointer;
    opacity: 0.92;
  }

  .hf-ui-control,
  .hf-ui-control--trigger,
  .hf-ui-shell :where(.hf-ui-control, .hf-ui-control--trigger),
  :where(
    input.hf-ui-input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']),
    textarea.hf-ui-input,
    select.hf-ui-input
  ) {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.5rem;
    background: rgba(255, 255, 255, 0.03);
    color: rgb(236 231 220);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease;
  }
  :is(
    input.hf-ui-control:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']),
    input.hf-ui-input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color'])
  ) {
    min-height: 2rem;
    max-height: 2rem;
    height: 2rem;
    padding-block: 0.25rem;
    padding-inline: 0.75rem;
    font-size: 0.75rem;
    line-height: 1.125rem;
    box-sizing: border-box;
  }
  .hf-ui-control--trigger {
    min-height: 2rem;
    padding-block: 0.25rem;
    padding-inline: 0.75rem;
    font-size: 0.75rem;
    line-height: 1.125rem;
    box-sizing: border-box;
  }
  :is(select.hf-ui-control:not([multiple]), select.hf-ui-input:not([multiple])) {
    min-height: 2rem;
    max-height: 2rem;
    height: 2rem;
    padding-block: 0.25rem;
    padding-inline-start: 0.75rem;
    padding-inline-end: 2.25rem;
    font-size: 0.75rem;
    line-height: 1.125rem;
    box-sizing: border-box;
  }
  :is(select.hf-ui-control[multiple], select.hf-ui-input[multiple]) {
    min-height: 2rem;
    max-height: none;
    height: auto;
    padding: 0.25rem 0.75rem;
    font-size: 0.75rem;
    line-height: 1.125rem;
  }
  .hf-ui-control.hf-ui-list-row__select,
  .hf-ui-shell .hf-ui-control.hf-ui-list-row__select {
    width: auto;
    max-width: 100%;
    flex: 0 1 auto;
  }
  .hf-ui-shell .hf-ui-list-row__actions {
    flex-wrap: wrap;
    flex-shrink: 1;
    min-width: 0;
    max-width: 100%;
  }
  .hf-ui-shell .hf-ui-list-row__actions > form {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem;
    max-width: 100%;
  }
  :is(textarea.hf-ui-control, textarea.hf-ui-input) {
    min-height: 7rem;
    max-height: none;
    height: auto;
    padding: 0.75rem;
    font-size: 0.75rem;
    line-height: 1.5rem;
    resize: vertical;
  }
  .hf-ui-field__required {
    color: rgb(238 130 150);
    font-weight: 600;
    margin-left: 0.125rem;
  }
  .hf-ui-field--required > label:first-child,
  .hf-ui-field--required .hf-ui-field__label {
    font-weight: 500;
  }
  .hf-ui-field__count {
    margin-top: 0.25rem;
    font-size: 0.6875rem;
    line-height: 1rem;
    color: rgb(139 134 123);
    text-align: right;
  }
  .hf-ui-field__count.is-over {
    color: rgb(238 130 150);
  }
  /* Main panel content: legacy fields without hf-ui-control still get the same compact inset. */
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) .hf-ui-shell__content :is(
    input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']):not(.hf-ui-checkbox):not(.hf-ui-radio):not(.hf-ui-control):not(.hf-ui-input):not(.sr-only):not(#help-search),
    textarea:not(.hf-ui-control):not(.hf-ui-input),
    select:not([multiple]):not(.hf-ui-control):not(.hf-ui-input)
  ) {
    padding-block: 0.25rem;
    padding-inline: 0.75rem;
    min-height: 2rem;
    box-sizing: border-box;
  }
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) .hf-ui-shell__content select:not([multiple]):not(.hf-ui-control):not(.hf-ui-input) {
    padding-inline-end: 2.5rem;
  }
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) .hf-ui-shell__content textarea:not(.hf-ui-control):not(.hf-ui-input) {
    min-height: 7rem;
    max-height: none;
    height: auto;
    padding: 0.75rem;
  }
  @media (min-width: 640px) {
    :where(
      textarea.hf-ui-control,
      textarea.hf-ui-input
    ) {
      font-size: 0.875rem;
      line-height: 1.25rem;
    }
  }
  :where(.hf-ui-control, .hf-ui-control--trigger, input.hf-ui-input, textarea.hf-ui-input)::placeholder {
    color: rgb(139 134 123);
    opacity: 1;
    font-size: 0.6875rem;
    line-height: 1.125rem;
    letter-spacing: 0.01em;
  }
  @media (min-width: 640px) {
    :where(.hf-ui-control, .hf-ui-control--trigger, input.hf-ui-input, textarea.hf-ui-input)::placeholder {
      font-size: 0.75rem;
      line-height: 1.25rem;
    }
  }
  :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) :is(input, textarea)::placeholder {
    color: rgb(139 134 123);
    opacity: 1;
    font-size: 0.6875rem;
    line-height: 1.125rem;
    letter-spacing: 0.01em;
  }
  @media (min-width: 640px) {
    :is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) :is(input, textarea)::placeholder {
      font-size: 0.75rem;
      line-height: 1.25rem;
    }
  }
  :where(
    .hf-ui-control,
    .hf-ui-control--trigger,
    input.hf-ui-input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']),
    textarea.hf-ui-input,
    select.hf-ui-input
  ):focus,
  :where(
    .hf-ui-control,
    .hf-ui-control--trigger,
    input.hf-ui-input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']),
    textarea.hf-ui-input,
    select.hf-ui-input
  ):focus-visible,
  .is-focused .choices__inner,
  .choices.is-open .choices__inner {
    outline: none;
    border-color: rgba(109, 182, 242, 0.62);
    box-shadow: 0 0 0 3px rgba(109, 182, 242, 0.18);
  }
  :where(
    .hf-ui-control,
    .hf-ui-control--trigger,
    input.hf-ui-input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']),
    textarea.hf-ui-input,
    select.hf-ui-input
  ):disabled,
  .choices.is-disabled .choices__inner,
  .choices.is-disabled .choices__input {
    opacity: 0.6;
    cursor: not-allowed;
  }

  .hf-custom-dropdown-trigger.hf-ui-control--trigger {
    position: relative;
    z-index: 120;
    gap: 0.5rem;
    text-align: left;
  }
  .choices__list--dropdown,
  .choices__list[aria-expanded] {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.75rem;
    background: #10131b;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.45), 0 10px 10px -5px rgba(0, 0, 0, 0.35);
    overflow: hidden;
  }
  .hf-custom-dropdown-option,
  .choices__list--dropdown .choices__item,
  .choices__list[aria-expanded] .choices__item {
    color: #c9c7c6;
    font-size: 0.875rem;
    line-height: 1.25rem;
    background-color: #10131b;
    transition: color 0.15s ease, background-color 0.15s ease;
  }
  .hf-custom-dropdown-option:hover,
  .hf-custom-dropdown-option:focus,
  .choices__list--dropdown .choices__item--selectable.is-highlighted,
  .choices__list--dropdown .choices__item--selectable.is-selected,
  .choices__list[aria-expanded] .choices__item--selectable.is-highlighted,
  .choices__list[aria-expanded] .choices__item--selectable.is-selected {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--hf-ink, #ece7dc);
  }
  .choices {
    margin-bottom: 0;
    font-size: 0.875rem;
  }
  .choices__inner {
    min-height: 2rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.5rem;
    background: rgba(255, 255, 255, 0.03);
    color: rgb(236 231 220);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
    padding: 0.25rem 0.75rem;
  }
  .choices[data-type*=select-one] .choices__inner {
    padding-bottom: 0.25rem;
  }
  .choices__input,
  .choices[data-type*=select-one] .choices__input {
    background: transparent;
    color: rgb(236 231 220);
    margin-bottom: 0;
    padding: 0.125rem 0;
  }
  .choices__input::placeholder {
    color: rgb(139 134 123);
    opacity: 1;
    font-size: 0.6875rem;
    line-height: 1.125rem;
    letter-spacing: 0.01em;
  }
  @media (min-width: 640px) {
    .choices__input::placeholder {
      font-size: 0.75rem;
      line-height: 1.25rem;
    }
  }
  .choices__placeholder {
    font-size: 0.6875rem;
    line-height: 1.125rem;
    color: rgb(139 134 123);
  }
  @media (min-width: 640px) {
    .choices__placeholder {
      font-size: 0.75rem;
      line-height: 1.25rem;
    }
  }
  .choices__list--single {
    padding: 0.25rem 1.5rem 0.25rem 0;
  }
  .choices[data-type*=select-one]::after {
    border-color: rgb(167 162 151) transparent transparent transparent;
  }
  .choices[data-type*=select-one].is-open::after {
    border-color: transparent transparent rgb(167 162 151);
  }
  .choices {
    --choices-primary-color: #2d5fc4;
    --choices-keyline-color: rgba(214, 220, 235, 0.16);
    --choices-bg-color: #0b0d13;
    --choices-bg-color-dropdown: #10131b;
    --choices-bg-color-disabled: #181c27;
    --choices-highlighted-color: rgba(214, 220, 235, 0.08);
    --choices-text-color: #ece7dc;
    --choices-invalid-color: #d24b66;
    --choices-disabled-color: #343846;
    --choices-item-disabled-color: #7b7f91;
  }
  .choices__list--multiple .choices__item {
    background: rgba(214, 220, 235, 0.08);
    border: 1px solid rgba(214, 220, 235, 0.16);
    color: rgb(235 231 247);
  }
  .choices__list--multiple .choices__item.is-highlighted {
    background: rgba(125, 107, 189, 0.22);
    border-color: rgba(125, 107, 189, 0.4);
  }
  ul[role='listbox'] {
    background-color: #0b0d13 !important;
    color: #dcd8cf;
  }
  ul[role='listbox'] [role='option'] {
    color: #c9c7c6;
  }
  ul[role='listbox'] [role='option']:hover,
  ul[role='listbox'] [role='option']:focus {
    background-color: rgba(255, 255, 255, 0.08);
    color: #f6f3ec;
  }
  .font-display { font-family: 'Manrope', sans-serif; }
  .glass { background: rgba(16,19,27,0.6); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.06); }
  .gradient-cyber { background: linear-gradient(135deg, var(--hf-brand-a-wash), color-mix(in srgb, var(--hf-brand-b) 10%, transparent) 50%, var(--hf-brand-c-wash)); }
  .gradient-text { background: var(--hf-brand-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
  @keyframes grid-pulse { 0%, 100% { opacity: 0.3; } 50% { opacity: 0.5; } }
  .hero-grid { animation: grid-pulse 4s ease-in-out infinite; }

  /* Button labels are painted by a gradient through background-clip: text with
     color: transparent, so a shell without this variable renders them invisible.
     Define it once for every shell - including the public blog - and let a panel
     override it if it ever needs to. */
  .hf-ui-shell {
    --hf-portal-text-gradient: var(--hf-brand-gradient);
    --hf-portal-text-gradient-active: var(--hf-brand-gradient-soft);
  }

  .hf-ui-shell--portal {
    --hf-portal-icon-gradient: var(--hf-icon-ink);
    --hf-portal-icon-gradient-active: var(--hf-icon-ink-active);
    --hf-portal-icon-blue: var(--hf-icon-ink);
    --hf-portal-icon-red: var(--hf-icon-ink);
    --hf-portal-text-gradient: var(--hf-brand-gradient);
    --hf-portal-text-gradient-active: var(--hf-brand-gradient-soft);
    --hf-portal-text-blue: var(--hf-brand-b);
    --hf-portal-text-blue-bright: var(--hf-brand-b-soft);
    --hf-portal-bg-base: var(--hf-surface-base);
    --hf-portal-bg-wash-red: var(--hf-app-bg-wash-red);
    --hf-portal-bg-wash-blue: var(--hf-app-bg-wash-blue);
    --hf-portal-bg-wash-purple: var(--hf-app-bg-wash-purple);
    background-color: var(--hf-portal-bg-base);
    background-image:
      radial-gradient(ellipse 95% 60% at 14% 92%, var(--hf-portal-bg-wash-red), transparent 58%),
      radial-gradient(ellipse 120% 65% at 86% 10%, var(--hf-portal-bg-wash-blue), transparent 62%),
      radial-gradient(ellipse 80% 75% at 48% 42%, var(--hf-portal-bg-wash-purple), transparent 54%),
      radial-gradient(ellipse 70% 45% at 72% 78%, var(--hf-portal-bg-wash-blue), transparent 48%);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-attachment: fixed;
  }
  .hf-ui-shell--entity {
    --hf-portal-icon-gradient: var(--hf-icon-ink);
    --hf-portal-icon-gradient-active: var(--hf-icon-ink-active);
    --hf-portal-icon-blue: var(--hf-icon-ink);
    --hf-portal-icon-red: var(--hf-icon-ink);
    --hf-portal-text-gradient: var(--hf-brand-gradient);
    --hf-portal-text-gradient-active: var(--hf-brand-gradient-soft);
    --hf-portal-text-blue: var(--hf-brand-b);
    --hf-portal-text-blue-bright: var(--hf-brand-b-soft);
    --hf-portal-bg-base: var(--hf-surface-base);
    --hf-portal-bg-wash-red: var(--hf-app-bg-wash-red);
    --hf-portal-bg-wash-blue: var(--hf-app-bg-wash-blue);
    --hf-portal-bg-wash-purple: var(--hf-app-bg-wash-purple);
  }
  .hf-ui-shell--admin,
  .hf-ui-shell--staff {
    --hf-portal-icon-gradient: var(--hf-icon-ink);
    --hf-portal-icon-gradient-active: var(--hf-icon-ink-active);
    --hf-portal-icon-blue: var(--hf-icon-ink);
    --hf-portal-icon-red: var(--hf-icon-ink);
    --hf-portal-text-gradient: var(--hf-brand-gradient);
    --hf-portal-text-gradient-active: var(--hf-brand-gradient-soft);
    --hf-portal-text-blue: var(--hf-brand-b);
    --hf-portal-text-blue-bright: var(--hf-brand-b-soft);
    --hf-portal-bg-wash-red: var(--hf-app-bg-wash-red);
    --hf-portal-bg-wash-blue: var(--hf-app-bg-wash-blue);
    --hf-portal-bg-wash-purple: var(--hf-app-bg-wash-purple);
  }
  .hf-ui-shell--staff {
    --hf-portal-icon-gradient: var(--hf-icon-ink);
    --hf-portal-icon-gradient-active: var(--hf-icon-ink-active);
  }
  .hf-ui-shell--admin:not(.hf-portal-auth),
  .hf-ui-shell--author:not(.hf-portal-auth),
  .hf-ui-shell--partner:not(.hf-portal-auth),
  .hf-ui-shell--recruiter:not(.hf-portal-auth),
  .hf-ui-shell--staff:not(.hf-portal-auth) {
    background-color: #05050a;
    background-image:
      linear-gradient(180deg, rgba(5, 5, 10, 0.78) 0%, rgba(4, 4, 9, 0.84) 45%, rgba(5, 5, 10, 0.88) 100%),
      var(--hf-stone-wall-bg),
      linear-gradient(180deg, rgba(7, 9, 16, 0.62) 0%, rgba(5, 5, 10, 0.72) 100%);
    background-repeat: no-repeat, repeat, no-repeat;
    background-size: 100% 100%, 240px 144px, 100% 100%;
    background-position: center, center, center;
    background-attachment: fixed, fixed, fixed;
  }
  .hf-ui-shell--portal .hf-ui-shell-wall,
  .hf-ui-shell--admin .hf-ui-shell-wall,
  .hf-ui-shell--entity .hf-ui-shell-wall {
    display: none;
  }
  .hf-ui-shell-wall {
    background-image:
      linear-gradient(180deg, rgba(6, 7, 11, 0.88) 0%, rgba(8, 8, 12, 0.82) 50%, rgba(6, 7, 11, 0.90) 100%),
      var(--hf-stone-wall-bg);
    background-repeat: no-repeat, repeat;
    background-size: auto, 240px 144px;
    background-position: center, center;
  }
  .hf-ui-shell :where(
    .hf-ui-shell__main,
    .hf-ui-shell__container
  ) {
    background: transparent;
  }
  .hf-ui-shell--portal .hf-ui-shell__main,
  .hf-ui-shell--portal .hf-ui-shell__content,
  .hf-ui-shell--portal #dash-view-stage,
  .hf-ui-shell--portal .dash-view-layer {
    background: transparent;
  }
  /* No topbar - content starts at the top of the scroll region (SPA + full-page views). */
  .hf-ui-shell--portal #dashboard-panel,
  .hf-ui-shell--portal main.hf-ui-shell__content.hf-ui-stack,
  .hf-ui-shell--admin #admin-panels,
  .hf-ui-shell--staff #staff-panels {
    padding-top: 1rem;
  }
  @media (min-width: 640px) {
    .hf-ui-shell--portal #dashboard-panel,
    .hf-ui-shell--portal main.hf-ui-shell__content.hf-ui-stack,
    .hf-ui-shell--admin #admin-panels,
    .hf-ui-shell--staff #staff-panels {
      padding-top: 1.25rem;
    }
  }
  /* Admin/staff: inset below the last card/section inside each view (on the view root stack, not #*-panels). */
  .hf-ui-shell--admin:not(.hf-portal-auth),
  .hf-ui-shell--staff:not(.hf-portal-auth) {
    --hf-admin-view-pad-bottom: 2rem;
  }
  @media (min-width: 640px) {
    .hf-ui-shell--admin:not(.hf-portal-auth),
    .hf-ui-shell--staff:not(.hf-portal-auth) {
      --hf-admin-view-pad-bottom: 2.5rem;
    }
  }
  @media (min-width: 1024px) {
    .hf-ui-shell--admin:not(.hf-portal-auth),
    .hf-ui-shell--staff:not(.hf-portal-auth) {
      --hf-admin-view-pad-bottom: 3rem;
    }
  }
  /* Tab views: [data-ui-tab-panel] is the hf-ui-stack root (events, users, ...). */
  .hf-ui-shell--admin:not(.hf-portal-auth) #admin-panels > .panel > [data-ui-tab-panel],
  .hf-ui-shell--staff:not(.hf-portal-auth) #staff-panels > .panel > [data-ui-tab-panel] {
    padding-bottom: max(
      var(--hf-admin-view-pad-bottom),
      calc(env(safe-area-inset-bottom, 0px) + 1.25rem)
    );
  }
  /* Panels with trailing blocks outside the tab root (legacy markup): still inset the scroll end. */
  .hf-ui-shell--admin:not(.hf-portal-auth) #admin-panels > .panel > :last-child:not([data-ui-tab-panel]),
  .hf-ui-shell--staff:not(.hf-portal-auth) #staff-panels > .panel > :last-child:not([data-ui-tab-panel]) {
    margin-bottom: max(
      var(--hf-admin-view-pad-bottom),
      calc(env(safe-area-inset-bottom, 0px) + 1.25rem)
    );
  }
  /* Standalone page: main is the view stack (users.php-style layout on a full page). */
  .hf-ui-shell--admin:not(.hf-portal-auth) main.hf-ui-shell__content.hf-ui-stack[data-ui-view]:not([data-ui-view='admin-event-view-shell']) {
    padding-bottom: max(
      var(--hf-admin-view-pad-bottom),
      calc(env(safe-area-inset-bottom, 0px) + 1.25rem)
    );
  }
  /* Standalone page: content lives in .hf-ui-shell__container under main. */
  .hf-ui-shell--admin:not(.hf-portal-auth) main.hf-ui-shell__content[data-ui-view]:not(.hf-ui-stack):not([data-ui-view='admin-event-view-shell']) > .hf-ui-shell__container,
  .hf-ui-shell--admin:not(.hf-portal-auth) .hf-ui-shell__content[data-ui-view]:not(main):not([data-ui-view='admin-event-view-shell']) {
    padding-bottom: max(
      var(--hf-admin-view-pad-bottom),
      calc(env(safe-area-inset-bottom, 0px) + 1.25rem)
    );
  }
  /* Sidebar + main: flex row (no fixed sidebar + margin-left - that overflows viewport). */
  .hf-ui-shell:not(.hf-portal-auth) .hf-ui-shell__main {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: hidden;
  }
  /* Standalone feature pages (labs/courses/events editors, etc.): no shell sidebar - stack topbar + content. */
  .hf-ui-panel:not(.hf-portal-auth) .hf-ui-shell__main:not(:has(.hf-ui-shell__sidebar)) {
    flex-direction: column;
    overflow: visible;
  }
  .hf-ui-shell .hf-ui-shell__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
  }
  .hf-ui-shell--portal .hf-ui-shell__topbar,
  .hf-ui-shell .hf-ui-shell__sidebar {
    position: relative;
    isolation: isolate;
  }
  .hf-ui-shell--portal .hf-ui-shell__topbar {
    overflow: visible;
    border-color: rgba(155, 157, 168, 0.08);
    background-color: var(--hf-portal-bg-base);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  }
  /* Sidebar: stone wall only; sticky column in flex row (no fixed + margin-left). */
  .hf-ui-shell .hf-ui-shell__sidebar {
    flex: 0 0 16rem;
    width: 16rem;
    min-width: 16rem;
    max-width: 16rem;
    align-self: stretch;
    position: sticky;
    top: 0;
    z-index: 30;
    min-height: 100vh;
    min-height: 100dvh;
    height: auto;
    overflow: visible;
    border: none;
    box-shadow: none;
    background-color: var(--hf-portal-wall-sidebar-bg);
    background-image:
      radial-gradient(ellipse 130% 70% at 0% 100%, var(--hf-portal-bg-wash-red), transparent 58%),
      radial-gradient(ellipse 110% 55% at 100% 0%, var(--hf-portal-bg-wash-blue), transparent 52%),
      var(--hf-portal-wall-veil),
      var(--hf-stone-wall);
    background-repeat: no-repeat, no-repeat, no-repeat, repeat;
    background-size: auto, auto, auto, 240px 144px;
    background-position: center, center, center, center;
  }
  @media (min-width: 1024px) {
    .hf-ui-shell .hf-ui-shell__sidebar {
      flex-basis: 18rem;
      width: 18rem;
      min-width: 18rem;
      max-width: 18rem;
    }
  }
  .hf-ui-shell--portal .hf-ui-shell__topbar::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-color: var(--hf-portal-bg-base);
    background-image:
      radial-gradient(circle at 1px 1px, rgba(214, 220, 235, 0.10) 1px, transparent 0),
      radial-gradient(circle at 1px 1px, rgba(109, 182, 242, 0.10) 1px, transparent 0),
      radial-gradient(circle at 1px 1px, rgba(214, 220, 235, 0.07) 1px, transparent 0);
    background-size: 20px 20px, 30px 30px, 25px 25px;
    background-position: 0 0, 10px 10px, 15px 5px;
  }
  .hf-ui-shell--portal .hf-ui-shell__topbar::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: linear-gradient(
      180deg,
      rgba(6, 7, 14, 0.45) 0%,
      rgba(6, 7, 14, 0.72) 100%
    );
  }
  /* Portal sidebar layout (brand / grouped nav / footer user) */
  .hf-ui-shell .hf-ui-sidebar {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    align-self: stretch;
    width: 100%;
    overflow: visible;
  }
  .hf-ui-shell .hf-ui-sidebar__brand {
    position: relative;
    z-index: 40;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    min-height: 3rem;
    padding: 0.75rem 0.75rem 0.375rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    overflow: visible;
  }
  .hf-ui-shell .hf-ui-sidebar__brand-main {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    gap: 0.625rem;
  }
  .hf-ui-shell .hf-ui-sidebar__brand-actions {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
    gap: 0.25rem;
    overflow: visible;
  }
  .hf-ui-shell .hf-ui-sidebar__brand-logo {
    height: 1.75rem;
    width: auto;
    max-width: 6.5rem;
    flex-shrink: 0;
    object-fit: contain;
    border-radius: 0;
  }
  .hf-ui-shell .hf-ui-sidebar__brand-fallback {
    width: 1.75rem;
    height: 1.75rem;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: linear-gradient(135deg, #2b4fa8, #3f7fdc 55%, #6db6f2);
  }
  .hf-ui-shell .hf-ui-sidebar__brand-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: var(--font-display, inherit);
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--hf-ink, #ece7dc);
  }
  .hf-ui-shell .hf-ui-sidebar__footer {
    overflow: visible;
  }
  .hf-ui-shell .hf-ui-sidebar__nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0.25rem 0.5rem 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
  }
  .hf-ui-shell .hf-ui-sidebar__pinned {
    flex-shrink: 0;
    padding: 0 0.5rem 0.375rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
  }
  .hf-ui-shell .hf-ui-sidebar__group:not(.hf-ui-sidebar__group--flat) {
    margin-top: 0.125rem;
  }
  .hf-ui-shell .hf-ui-sidebar__group-toggle {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 0.625rem;
    min-height: 2.375rem;
    padding: 0.5rem 0.5rem;
    border: 0;
    border-radius: 0.5rem;
    background: transparent;
    text-align: left;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -0.01em;
    text-transform: none;
    color: rgb(220 216 207);
    cursor: pointer;
    transition: color 0.15s ease, background-color 0.15s ease;
  }
  .hf-ui-shell .hf-ui-sidebar__group-toggle:hover {
    color: var(--hf-ink, #ece7dc);
    background: rgba(255, 255, 255, 0.04);
  }
  .hf-ui-shell .hf-ui-sidebar__group-toggle .hf-ui-sidebar__icon--group {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    color: var(--hf-icon-ink);
  }
  .hf-ui-shell .hf-ui-sidebar__group-toggle:hover .hf-ui-sidebar__icon--group .hf-ui-sidebar__icon-svg {
    opacity: 1;
  }
  .hf-ui-shell .hf-ui-sidebar__group-toggle .hf-ui-sidebar__icon--group .hf-ui-sidebar__icon-svg {
    width: 1.25rem;
    height: 1.25rem;
  }
  .hf-ui-shell .hf-ui-sidebar__group-toggle .hf-ui-sidebar__group-label {
    flex: 1 1 auto;
    min-width: 0;
  }
  .hf-ui-shell .hf-ui-sidebar__group-items {
    display: none;
    flex-direction: column;
    gap: 0.0625rem;
    margin: 0.125rem 0 0.375rem 0.625rem;
    padding: 0.125rem 0 0.125rem 0.75rem;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
  }
  .hf-ui-shell .hf-ui-sidebar__group--flat .hf-ui-sidebar__group-items {
    margin: 0;
    padding: 0;
    border-left: 0;
  }
  .hf-ui-shell .hf-ui-sidebar__group.is-open .hf-ui-sidebar__group-items,
  .hf-ui-shell .hf-ui-sidebar__group--flat .hf-ui-sidebar__group-items {
    display: flex;
  }
  .hf-ui-shell .hf-ui-sidebar__group.is-open .hf-ui-sidebar__chevron {
    transform: rotate(180deg);
  }
  .hf-ui-shell .hf-ui-sidebar__chevron {
    flex-shrink: 0;
    color: rgb(139 134 123);
    transition: transform 0.15s ease;
  }
  .hf-ui-shell .hf-ui-sidebar__item {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.625rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    background: transparent;
    text-align: left;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: rgb(167 162 151);
    cursor: pointer;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
  }
  .hf-ui-shell .hf-ui-sidebar__group:not(.hf-ui-sidebar__group--flat) .hf-ui-sidebar__group-items .hf-ui-sidebar__item {
    gap: 0.5rem;
    padding: 0.3125rem 0.5rem;
    border-radius: 0.375rem;
    font-size: 0.8125rem;
    line-height: 1.2;
    font-weight: 500;
    color: rgb(139 134 123);
  }
  .hf-ui-shell .hf-ui-sidebar__group:not(.hf-ui-sidebar__group--flat) .hf-ui-sidebar__group-items .hf-ui-sidebar__item .hf-ui-sidebar__icon {
    width: 1rem;
    height: 1rem;
  }
  .hf-ui-shell .hf-ui-sidebar__group:not(.hf-ui-sidebar__group--flat) .hf-ui-sidebar__group-items .hf-ui-sidebar__item .hf-ui-sidebar__icon-svg {
    width: 1rem;
    height: 1rem;
  }
  .hf-ui-shell .hf-ui-sidebar__group:not(.hf-ui-sidebar__group--flat) .hf-ui-sidebar__group-items .hf-ui-sidebar__item:hover {
    color: rgb(220 216 207);
  }
  .hf-ui-shell .hf-ui-sidebar__group:not(.hf-ui-sidebar__group--flat) .hf-ui-sidebar__group-items .hf-ui-sidebar__badge {
    font-size: 0.6875rem;
    padding: 0.0625rem 0.375rem;
  }
  .hf-ui-shell .hf-ui-sidebar__item:hover {
    color: var(--hf-ink, #ece7dc);
    border-color: rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.04);
  }
  .hf-ui-shell .hf-ui-sidebar__icon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
  }
  .hf-ui-shell .hf-ui-sidebar__icon-svg {
    width: 1.25rem;
    height: 1.25rem;
  }
  .hf-ui-shell .hf-ui-sidebar__nav .hf-ui-sidebar__item .hf-ui-sidebar__icon-svg,
  .hf-ui-shell .hf-ui-sidebar__group-toggle .hf-ui-sidebar__icon-svg,
  .hf-ui-shell .hf-ui-sidebar__brand-actions .hf-ui-sidebar__quick-action .hf-ui-sidebar__icon-svg {
    stroke: currentColor;
  }
  .hf-ui-shell .hf-ui-sidebar__item.is-active .hf-ui-sidebar__icon-svg,
  .hf-ui-shell .hf-ui-sidebar__item[aria-selected='true'] .hf-ui-sidebar__icon-svg {
    stroke: #ffffff;
    opacity: 1;
  }
  .hf-ui-shell .hf-ui-sidebar__item.hf-ui-sidebar__item--primary {
    border-color: var(--hf-btn-primary-border, rgba(86, 90, 107, 0.42));
    background-color: rgba(16, 19, 27, 0.98);
    background-image: var(--hf-btn-primary-fill);
    color: var(--hf-btn-primary-color, #0b0d13);
    box-shadow: var(--hf-btn-primary-rest-shadow, 0 10px 22px -22px rgba(0, 0, 0, 0.55));
  }
  .hf-ui-shell .hf-ui-sidebar__item.hf-ui-sidebar__item--primary:hover {
    border-color: var(--hf-btn-primary-hover-border);
    color: var(--hf-btn-primary-color, #0b0d13);
    background-image: var(--hf-btn-primary-hover);
    box-shadow: var(--hf-btn-primary-shadow);
  }
  .hf-ui-shell .hf-ui-sidebar__item.hf-ui-sidebar__item--primary .hf-ui-sidebar__icon-svg {
    stroke: var(--hf-btn-primary-color, #0b0d13);
    opacity: 1;
  }
  .hf-ui-shell .hf-ui-sidebar__chevron,
  .hf-ui-shell .hf-ui-sidebar__user-chevron {
    color: rgb(139 134 123);
    stroke: currentColor;
  }
  .hf-ui-shell .hf-ui-empty__icon svg[stroke='currentColor'],
  .hf-ui-shell .hf-ui-empty__icon svg[stroke='currentcolor'] {
    stroke: currentColor;
    color: var(--hf-icon-ink);
  }
  .hf-ui-shell .hf-ui-sidebar__label {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .hf-ui-shell .hf-ui-sidebar__trail {
    flex-shrink: 0;
    margin-left: auto;
  }
  .hf-ui-shell .hf-ui-sidebar__badge {
    padding: 0.125rem 0.5rem;
    font-size: 0.6875rem;
    line-height: 1rem;
    border-radius: 9999px;
  }
  .hf-ui-shell .hf-ui-sidebar__item.is-active,
  .hf-ui-shell .hf-ui-sidebar__item[aria-selected='true'] {
    border-color: var(--hf-icon-ink);
    background: rgba(255, 255, 255, 0.08);
    background-image: none;
    box-shadow: none;
    color: var(--hf-ink, #ece7dc);
  }
  .hf-ui-shell .hf-ui-sidebar__item.is-locked {
    cursor: not-allowed;
    opacity: 0.72;
    color: rgb(139 134 123);
  }
  .hf-ui-shell .hf-ui-sidebar__item.is-locked:hover {
    color: rgb(139 134 123);
    border-color: var(--hf-icon-ink);
    background: transparent;
  }
  .hf-ui-shell .hf-ui-sidebar__item.is-locked .hf-ui-sidebar__icon-svg {
    stroke: rgb(139 134 123);
    opacity: 0.9;
  }
  .hf-ui-shell .hf-ui-sidebar__item.is-locked.is-active,
  .hf-ui-shell .hf-ui-sidebar__item.is-locked[aria-selected='true'] {
    border-color: var(--hf-icon-ink);
    background: transparent;
    color: rgb(139 134 123);
  }
  .hf-ui-shell .hf-ui-sidebar__trail--lock {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
  }
  .hf-ui-shell .hf-ui-sidebar__lock-icon {
    flex-shrink: 0;
    color: rgb(139 134 123);
  }
  .hf-ui-shell .hf-ui-sidebar__lock-badge {
    padding: 0.0625rem 0.375rem;
    font-size: 0.6875rem;
    line-height: 1rem;
    border-radius: 9999px;
    color: rgb(167 162 151);
  }
  .hf-ui-shell .hf-ui-sidebar__footer {
    flex-shrink: 0;
    padding: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
  }
  .hf-ui-shell .hf-ui-sidebar__brand-actions .hf-ui-sidebar__quick-action,
  .hf-ui-shell .hf-ui-sidebar__brand-actions.hf-ui-sidebar__quick-actions .hf-ui-sidebar__quick-action {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border-radius: 0.5rem;
    border: 1px solid rgba(109, 182, 242, 0.2);
    background: rgba(63, 127, 220, 0.06);
    color: var(--hf-icon-ink);
    transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
  }
  .hf-ui-shell .hf-ui-sidebar__brand-actions .hf-ui-sidebar__quick-action:hover {
    border-color: rgba(109, 182, 242, 0.4);
    background: rgba(63, 127, 220, 0.12);
    box-shadow: 0 0 0 1px rgba(238, 130, 150, 0.08);
  }
  .hf-ui-shell .hf-ui-sidebar__brand-actions .hf-ui-sidebar__quick-action:hover .hf-ui-sidebar__icon-svg {
    stroke: currentColor;
  }
  .hf-ui-shell .hf-ui-sidebar__brand-actions .hf-ui-notifications--icon {
    position: relative;
    flex: 0 0 auto;
    overflow: visible;
  }
  .hf-ui-shell .hf-ui-sidebar__brand-actions .hf-ui-sidebar__icon-svg {
    width: 1rem;
    height: 1rem;
  }
  .hf-ui-shell .hf-ui-sidebar__balance-compact {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 0.25rem;
    max-width: 5.5rem;
    padding: 0.125rem 0.25rem;
    border-radius: 0.375rem;
    color: var(--hf-icon-ink);
  }
  .hf-ui-shell .hf-ui-sidebar__balance-compact .hf-ui-sidebar__balance-icon {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    stroke: currentColor;
  }
  .hf-ui-shell .hf-ui-sidebar__balance-amount {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: var(--font-display, inherit);
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
    color: var(--hf-ink, #ece7dc);
  }
  .hf-ui-shell .hf-ui-sidebar__balance {
    display: block;
  }
  .hf-ui-shell .hf-ui-sidebar__balance-label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.25;
    color: rgb(139 134 123);
  }
  .hf-ui-shell .hf-ui-sidebar__balance-value {
    margin: 0.25rem 0 0;
    font-family: var(--font-display, inherit);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: var(--hf-ink, #ece7dc);
  }
  .hf-ui-shell .hf-ui-sidebar__balance-unit {
    margin-left: 0.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: rgb(167 162 151);
  }
  .hf-ui-shell .hf-ui-sidebar__utilities {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding-bottom: 0.125rem;
    margin-bottom: 0.125rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  .hf-ui-shell .hf-ui-sidebar__hfc--mobile {
    padding: 0.375rem 0.625rem;
    border-radius: 0.75rem;
  }
  .hf-ui-shell .hf-ui-sidebar__hfc--mobile .hf-ui-sidebar__balance-label {
    font-size: 0.6875rem;
  }
  .hf-ui-shell .hf-ui-sidebar__hfc--mobile .hf-ui-sidebar__balance-value {
    font-size: 1rem;
  }
  .hf-ui-shell--portal .hf-ui-notifications {
    position: relative;
  }
  .hf-ui-shell .hf-ui-sidebar__item--notifications {
    position: relative;
  }
  .hf-ui-shell .hf-ui-sidebar__notif-dot.hidden,
  .hf-ui-shell .hf-ui-sidebar__notif-badge.hidden {
    display: none !important;
  }
  .hf-ui-shell .hf-ui-sidebar__notif-dot {
    position: absolute;
    top: 0.375rem;
    right: 0.5rem;
    display: block;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
    background: rgb(210 75 102);
    border: 2px solid rgb(11 13 19);
    box-shadow: 0 0 0 1px rgba(210, 75, 102, 0.45);
    pointer-events: none;
  }
  .hf-ui-shell .hf-ui-sidebar__brand-actions .hf-ui-sidebar__notif-dot {
    top: 0.125rem;
    right: 0.125rem;
    width: 0.4375rem;
    height: 0.4375rem;
    border-width: 1.5px;
  }
  .hf-ui-shell--portal .hf-ui-notifications--mobile .hf-ui-sidebar__notif-dot {
    top: -0.0625rem;
    right: -0.0625rem;
  }
  .hf-ui-shell--portal .hf-ui-notifications__btn--mobile {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.625rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.035), rgba(63, 127, 220, 0.05));
    color: rgb(167 162 151);
    transition: border-color 0.15s ease, color 0.15s ease;
  }
  .hf-ui-shell--portal .hf-ui-notifications__btn--mobile:hover {
    border-color: rgba(109, 182, 242, 0.4);
    color: var(--hf-ink, #ece7dc);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-menu {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    z-index: 120;
    margin-bottom: 0.375rem;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: min(20rem, 38vh);
    border-radius: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #0b0d13;
    box-shadow: 0 16px 40px -24px rgba(0, 0, 0, 0.9);
  }
  /* Brand bell: fixed popover - portaled to body in JS; stacks above entire sidebar. */
  .hf-ui-shell .hf-ui-sidebar__notifications-menu--popover,
  body > .hf-ui-sidebar__notifications-menu--popover,
  body > .hf-ui-notifications__menu--mobile {
    position: fixed;
    z-index: 100100;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    width: min(18rem, calc(100vw - 1rem));
    min-width: 0;
    max-width: 18rem;
    min-height: 8rem;
    max-height: min(20rem, calc(100dvh - 1rem), calc(100vh - 1rem));
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: #0b0d13;
    box-shadow:
      0 20px 48px -16px rgba(0, 0, 0, 0.85),
      0 0 0 1px rgba(109, 182, 242, 0.12);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-menu--popover.hidden,
  body > .hf-ui-sidebar__notifications-menu--popover.hidden,
  body > .hf-ui-notifications__menu--mobile.hidden {
    pointer-events: none;
  }
  .hf-ui-shell--portal .hf-ui-notifications__menu--mobile {
    width: min(24rem, calc(100vw - 1rem));
    max-width: min(24rem, calc(100vw - 1rem));
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-menu-header {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-menu-title {
    font-size: 0.75rem;
    font-weight: 500;
    color: rgb(206 201 190);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-empty {
    padding: 0.75rem;
    font-size: 0.75rem;
    line-height: 1.5;
    color: rgb(139 134 123);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-section-label {
    padding: 0.375rem 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-section-label p {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgb(139 134 123);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-row {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-row:last-child {
    border-bottom: 0;
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-row-text {
    font-size: 0.75rem;
    line-height: 1.35;
    color: rgb(220 216 207);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-row-note {
    margin-top: 0.25rem;
    font-size: 0.6875rem;
    font-style: italic;
    line-height: 1.35;
    color: rgb(139 134 123);
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-row-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem;
    margin-top: 0.5rem;
  }
  .hf-ui-shell .hf-ui-sidebar__notifications-row-date {
    margin-left: auto;
    font-size: 0.6875rem;
    color: rgb(139 134 123);
  }
  .hf-ui-shell--portal .hf-ui-notifications__icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 0.375rem;
    border-width: 1px;
    border-style: solid;
    transition: color 0.15s ease, border-color 0.15s ease;
  }
  .hf-ui-shell--portal .hf-ui-notifications__icon-btn--accept {
    border-color: rgba(88, 184, 160, 0.4);
    color: rgb(134 207 186);
  }
  .hf-ui-shell--portal .hf-ui-notifications__icon-btn--accept:hover {
    border-color: rgba(88, 184, 160, 0.6);
    color: rgb(179 225 212);
  }
  .hf-ui-shell--portal .hf-ui-notifications__icon-btn--decline {
    border-color: rgba(238, 130, 150, 0.3);
    color: rgb(243 163 178);
  }
  .hf-ui-shell--portal .hf-ui-notifications__icon-btn--decline:hover {
    border-color: rgba(238, 130, 150, 0.5);
    color: rgb(247 197 207);
  }
  .hf-ui-shell .hf-ui-sidebar__item--footer {
    margin-bottom: 0.125rem;
  }
  .hf-ui-shell .hf-ui-sidebar__user-wrap {
    position: relative;
    z-index: 50;
  }
  .hf-ui-shell .hf-ui-sidebar__user-menu:not(.hidden) {
    display: block;
  }
  .hf-ui-shell .hf-ui-sidebar__user {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.625rem;
    border: 0;
    border-radius: 0.5rem;
    background: transparent;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease;
  }
  .hf-ui-shell .hf-ui-sidebar__user:hover {
    background: rgba(255, 255, 255, 0.04);
  }
  .hf-ui-shell .hf-ui-sidebar__avatar {
    position: relative;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    overflow: hidden;
    border-radius: 9999px;
    background: linear-gradient(135deg, #2b4fa8, #3f7fdc 55%, #6db6f2);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
    color: var(--hf-ink, #ece7dc);
  }
  .hf-ui-shell .hf-ui-sidebar__avatar.hf-ui-avatar {
    overflow: visible;
    width: var(--hf-avatar-size, 2rem);
    height: var(--hf-avatar-size, 2rem);
    background: transparent;
    border-radius: 0;
  }
  .hf-ui-avatar {
    --hf-avatar-deco-scale: 1.36;
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: var(--hf-avatar-size, 2rem);
    height: var(--hf-avatar-size, 2rem);
    overflow: visible;
  }
  .hf-ui-avatar__photo {
    position: relative;
    z-index: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 9999px;
    background: linear-gradient(135deg, #2b4fa8, #3f7fdc 55%, #6db6f2);
    color: var(--hf-ink, #ece7dc);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
  }
  .hf-ui-avatar__img,
  .hf-ui-avatar .hf-ui-sidebar__avatar-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .hf-ui-avatar__img.hidden,
  .hf-ui-avatar .hf-ui-sidebar__avatar-img.hidden {
    display: none;
  }
  .hf-ui-avatar__photo--split {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr);
    gap: 1px;
    background: var(--hf-hairline-strong);
  }
  .hf-ui-avatar__photo--split[data-count="3"] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .hf-ui-avatar__photo--split[data-count="4"] {
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }
  .hf-ui-avatar__photo--split > .hf-ui-avatar__img {
    min-width: 0;
    min-height: 0;
  }
  .hf-ui-avatar-pick {
    cursor: pointer;
    border-radius: 9999px;
  }
  .hf-ui-avatar-pick .hf-ui-avatar {
    opacity: 0.7;
    border-radius: 9999px;
    box-shadow: 0 0 0 1px var(--hf-hairline-strong);
  }
  .hf-ui-avatar-pick input:checked + .hf-ui-avatar {
    opacity: 1;
    box-shadow: 0 0 0 2px var(--hf-ice);
  }
  .hf-ui-avatar-pick input:focus-visible + .hf-ui-avatar {
    outline: 2px solid var(--hf-ice);
    outline-offset: 3px;
  }
  .hf-ui-avatar__initials,
  .hf-ui-avatar .hf-ui-sidebar__avatar-initials {
    margin: 0;
    line-height: 1;
  }
  .hf-ui-avatar__initials.hidden,
  .hf-ui-avatar .hf-ui-sidebar__avatar-initials.hidden {
    display: none;
  }
  .hf-ui-avatar__initials:not(.hidden),
  .hf-ui-avatar .hf-ui-sidebar__avatar-initials:not(.hidden) {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }
  .hf-ui-avatar__deco {
    position: absolute;
    z-index: 2;
    width: calc(100% * var(--hf-avatar-deco-scale, 1.36));
    height: calc(100% * var(--hf-avatar-deco-scale, 1.36));
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
  }
  .hf-ui-avatar--md:has(.hf-ui-avatar__deco:not([hidden])),
  .hf-ui-avatar--lg:has(.hf-ui-avatar__deco:not([hidden])),
  .hf-ui-avatar--xl:has(.hf-ui-avatar__deco:not([hidden])) {
    width: calc(var(--hf-avatar-size, 2.5rem) * var(--hf-avatar-deco-scale, 1.36));
    height: calc(var(--hf-avatar-size, 2.5rem) * var(--hf-avatar-deco-scale, 1.36));
  }
  .hf-ui-avatar--md:has(.hf-ui-avatar__deco:not([hidden])) .hf-ui-avatar__photo,
  .hf-ui-avatar--lg:has(.hf-ui-avatar__deco:not([hidden])) .hf-ui-avatar__photo,
  .hf-ui-avatar--xl:has(.hf-ui-avatar__deco:not([hidden])) .hf-ui-avatar__photo {
    width: var(--hf-avatar-size, 2.5rem);
    height: var(--hf-avatar-size, 2.5rem);
  }
  .hf-ui-avatar--md:has(.hf-ui-avatar__deco:not([hidden])) .hf-ui-avatar__deco,
  .hf-ui-avatar--lg:has(.hf-ui-avatar__deco:not([hidden])) .hf-ui-avatar__deco,
  .hf-ui-avatar--xl:has(.hf-ui-avatar__deco:not([hidden])) .hf-ui-avatar__deco {
    width: 100%;
    height: 100%;
  }
  .hf-ui-avatar__deco[hidden] {
    display: none;
  }
  .hf-ui-avatar__deco-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .hf-ui-shell .hf-ui-sidebar__user,
  .hf-ui-shell .hf-ui-sidebar__footer,
  .hf-ui-shell .hf-ui-sidebar__user-wrap {
    overflow: visible;
  }
  .hf-ui-shell--portal td:has(.hf-ui-avatar) {
    overflow: visible;
  }
  .hf-ui-shell--portal .hf-ui-team-tree,
  .hf-ui-shell--portal .hf-ui-card:has(.hf-ui-avatar),
  .hf-ui-shell--portal .hf-ui-card--cosmetic,
  .hf-ui-shell--portal .hf-ui-cosmetic-grid {
    overflow: visible;
  }
  .hf-ui-shell--portal .hf-ui-cosmetic-grid {
    padding-top: 0.75rem;
  }
  .hf-ui-shell--portal .hf-ui-card--cosmetic .hf-ui-avatar:has(.hf-ui-avatar__deco:not([hidden])) {
    margin-top: -0.85rem;
  }
  .hf-public-site-header,
  .hf-public-site-header__actions {
    overflow: visible;
  }
  .hf-ui-avatar__deco[data-rank-index="1"],
  .hf-ui-avatar__deco[data-rank-index="2"],
  .hf-ui-nameplate[data-rank-index="1"],
  .hf-ui-nameplate[data-rank-index="2"] { color: #9b9da8; }
  .hf-ui-avatar__deco[data-rank-index="3"],
  .hf-ui-avatar__deco[data-rank-index="4"],
  .hf-ui-nameplate[data-rank-index="3"],
  .hf-ui-nameplate[data-rank-index="4"] { color: #a6d6f8; }
  .hf-ui-avatar__deco[data-rank-index="5"],
  .hf-ui-avatar__deco[data-rank-index="6"],
  .hf-ui-nameplate[data-rank-index="5"],
  .hf-ui-nameplate[data-rank-index="6"] { color: #7dbdf3; }
  .hf-ui-avatar__deco[data-rank-index="7"],
  .hf-ui-avatar__deco[data-rank-index="8"],
  .hf-ui-nameplate[data-rank-index="7"],
  .hf-ui-nameplate[data-rank-index="8"] { color: #74bedc; }
  .hf-ui-avatar__deco[data-rank-index="9"],
  .hf-ui-avatar__deco[data-rank-index="10"],
  .hf-ui-nameplate[data-rank-index="9"],
  .hf-ui-nameplate[data-rank-index="10"] { color: #6db6f2; }
  .hf-ui-avatar__deco[data-rank-index="11"],
  .hf-ui-avatar__deco[data-rank-index="12"],
  .hf-ui-nameplate[data-rank-index="11"],
  .hf-ui-nameplate[data-rank-index="12"] { color: #9d8ed0; }
  .hf-ui-avatar__deco[data-rank-index="13"],
  .hf-ui-avatar__deco[data-rank-index="14"],
  .hf-ui-nameplate[data-rank-index="13"],
  .hf-ui-nameplate[data-rank-index="14"] { color: #9d8ed0; }
  .hf-ui-avatar__deco[data-rank-index="15"],
  .hf-ui-avatar__deco[data-rank-index="16"],
  .hf-ui-nameplate[data-rank-index="15"],
  .hf-ui-nameplate[data-rank-index="16"] { color: #e6cf94; }
  .hf-ui-avatar__deco[data-rank-index="17"],
  .hf-ui-avatar__deco[data-rank-index="18"],
  .hf-ui-nameplate[data-rank-index="17"],
  .hf-ui-nameplate[data-rank-index="18"] { color: #d4b56a; }
  .hf-ui-avatar__deco[data-rank-index="19"],
  .hf-ui-avatar__deco[data-rank-index="20"],
  .hf-ui-nameplate[data-rank-index="19"],
  .hf-ui-nameplate[data-rank-index="20"] { color: #e6cf94; }
  .hf-ui-nameplate {
    display: inline-flex;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0.05rem 0.4rem;
    border-radius: 0.25rem;
    border: 1px solid color-mix(in srgb, currentColor 40%, transparent);
    background: color-mix(in srgb, currentColor 12%, transparent);
    color: #9b9da8;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.25;
    text-transform: uppercase;
  }
  .hf-ui-shell .hf-ui-sidebar__user-copy {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.125rem;
  }
  @media (prefers-reduced-motion: reduce) {
    .hf-ui-avatar__deco,
    .hf-ui-avatar__deco::before,
    .hf-ui-avatar__deco::after {
      animation: none !important;
      transition: none !important;
    }
  }
  .hf-ui-shell .hf-ui-sidebar__avatar-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .hf-ui-shell .hf-ui-sidebar__avatar-img.hidden {
    display: none;
  }
  .hf-ui-shell .hf-ui-sidebar__avatar-initials {
    margin: 0;
    line-height: 1;
  }
  .hf-ui-shell .hf-ui-sidebar__avatar-initials.hidden {
    display: none;
  }
  .hf-ui-shell .hf-ui-sidebar__avatar-initials:not(.hidden) {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }
  .hf-ui-shell .hf-ui-sidebar__avatar:has(.hf-ui-sidebar__avatar-img) .hf-ui-sidebar__avatar-initials:not(.hidden) {
    position: absolute;
    inset: 0;
  }
  .hf-ui-shell .hf-ui-sidebar__user-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    font-weight: 500;
    color: rgb(206 201 190);
  }
  .hf-ui-shell .hf-ui-sidebar__user-chevron {
    color: rgb(139 134 123);
  }
  .hf-ui-shell .hf-ui-sidebar__user-menu {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    z-index: 120;
    margin-bottom: 0.375rem;
    overflow: hidden;
    border-radius: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #0b0d13;
    padding: 0.25rem 0;
    box-shadow: 0 16px 40px -24px rgba(0, 0, 0, 0.9);
  }
  .hf-ui-shell .hf-ui-sidebar__user-menu-link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 0;
    background: transparent;
    text-align: left;
    font-size: 0.875rem;
    color: rgb(206 201 190);
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
  }
  .hf-ui-shell .hf-ui-sidebar__user-menu-icon {
    flex-shrink: 0;
    color: rgb(167 162 151);
  }
  .hf-ui-shell .hf-ui-sidebar__user-menu-label {
    min-width: 0;
  }
  .hf-ui-shell .hf-ui-sidebar__user-menu-link:hover {
    background: rgba(255, 255, 255, 0.08);
    color: var(--hf-ink, #ece7dc);
  }
  .hf-ui-shell .hf-ui-sidebar__user-menu-link:hover .hf-ui-sidebar__user-menu-icon {
    color: rgb(206 201 190);
  }
  .hf-ui-shell .hf-ui-sidebar__user-menu-divider {
    margin: 0.25rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
  }
  /* Desktop sidebar collapse/expand - toggle adds/removes .is-collapsed on .hf-ui-shell__sidebar (hf-sidebar-collapse.js). */
  .hf-ui-shell .hf-ui-sidebar__collapse-toggle {
    flex-shrink: 0;
  }
  .hf-ui-shell .hf-ui-sidebar__collapse-icon {
    transition: transform 0.15s ease;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__collapse-icon {
    transform: rotate(180deg);
  }
  .hf-ui-shell .hf-ui-shell__sidebar.is-collapsed {
    flex-basis: 4.5rem;
    width: 4.5rem;
    min-width: 4.5rem;
    max-width: 4.5rem;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__brand-name,
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__brand-actions,
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__trail,
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__group-label,
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__group-toggle,
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__balance-compact {
    display: none !important;
  }
  /* Keep the user button's accessible name for screen readers - visually hidden, not display:none. */
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__label,
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__user-name,
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__user-copy {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border-width: 0 !important;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__brand {
    justify-content: center;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__brand-main {
    flex: 0 0 auto;
    justify-content: center;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__nav {
    padding-left: 0.375rem;
    padding-right: 0.375rem;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__pinned {
    padding-left: 0.375rem;
    padding-right: 0.375rem;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__backer {
    display: none !important;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__item {
    justify-content: center;
    gap: 0;
    padding: 0.5rem !important;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__group-items {
    display: flex !important;
    margin: 0;
    padding: 0;
    border-left: 0;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__group-items .hf-ui-sidebar__item .hf-ui-sidebar__icon,
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__group-items .hf-ui-sidebar__item .hf-ui-sidebar__icon-svg {
    width: 1.25rem !important;
    height: 1.25rem !important;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__footer {
    align-items: center;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-trustpilot-rating,
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-trustpilot-review {
    display: none;
  }
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__user {
    justify-content: center;
    gap: 0;
    padding: 0.5rem !important;
  }
  /* Collapsed rail is 4.5rem wide - the dropdown must not shrink to that width (labels get clipped by the menu's own overflow:hidden). */
  .hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-ui-sidebar__user-menu {
    left: 0;
    right: auto;
    width: 13rem;
  }

  .hf-ui-shell .hf-ui-card,
  .hf-ui-shell .glass,
  .hf-ui-shell .hf-view-placeholder {
    position: relative;
    box-shadow: 0 24px 50px -34px rgba(8, 9, 14, 0.92), inset 0 1px 0 rgba(255, 255, 255, 0.025);
  }
  .hf-ui-shell .hf-ui-card,
  .hf-ui-shell .glass,
  .hf-ui-shell .hf-view-placeholder {
    border-color: rgba(155, 157, 168, 0.12);
    background-color: var(--hf-portal-wall-card-bg, rgba(12, 14, 22, 0.48));
  }
  .hf-ui-shell .hf-ui-card.hf-ui-card:not(.hf-ui-card--secondary):not(.hf-ui-card--inset),
  .hf-ui-shell section.glass.glass,
  .hf-ui-shell div.glass.glass,
  .hf-ui-shell article.glass.glass {
    background-image:
      var(--hf-portal-wall-veil),
      var(--hf-stone-wall),
      var(--hf-portal-wall-identity);
    background-origin: padding-box, padding-box, border-box;
    background-clip: padding-box, padding-box, border-box;
    background-repeat: no-repeat, repeat, no-repeat;
    background-size: auto, 240px 144px, auto;
    background-position: center, center, center;
  }
  .hf-ui-shell .hf-ui-card::before,
  .hf-ui-shell .glass::before,
  .hf-ui-shell .hf-view-placeholder::before {
    content: '';
    position: absolute;
    inset: 0 0 auto;
    height: 1px;
    background: var(--hf-portal-wall-accent, linear-gradient(90deg, rgba(210, 75, 102, 0), rgba(210, 75, 102, 0.32), rgba(63, 127, 220, 0.32), rgba(125, 107, 189, 0)));
    pointer-events: none;
    opacity: 0.9;
  }

  /* Secondary / inset - flat sub-cards inside a primary walled card (no stone wall, no top accent). */
  .hf-ui-card--secondary,
  .hf-ui-card--inset {
    background-image: none;
    background-color: var(--hf-portal-wall-nested-bg, rgba(255, 255, 255, 0.02));
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
  }
  .hf-ui-shell .hf-ui-card--secondary,
  .hf-ui-shell .hf-ui-card--inset,
  .hf-ui-shell .hf-ui-card .hf-ui-card:not(.hf-ui-card--accent):not(.hf-ui-card--danger):not(.hf-ui-card--base):not(.hf-ui-card-grid > *) {
    background-image: none;
    background-color: var(--hf-portal-wall-nested-bg, rgba(255, 255, 255, 0.02));
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
  }
  .hf-ui-shell .hf-ui-card--secondary::before,
  .hf-ui-shell .hf-ui-card--inset::before,
  .hf-ui-shell .hf-ui-card .hf-ui-card:not(.hf-ui-card--accent):not(.hf-ui-card--danger):not(.hf-ui-card--base):not(.hf-ui-card-grid > *)::before {
    display: none;
  }

  /* Card padding sizes (see docs/ui/components.md section 6). */
  .hf-ui-card--pad-sm { padding: 0.75rem; }
  .hf-ui-card--pad-md { padding: 1rem; }
  .hf-ui-card--pad-lg { padding: 1.25rem; }
  .hf-ui-card--pad-xl { padding: 1.5rem; }
  @media (min-width: 640px) {
    .hf-ui-card--pad-sm { padding: 1rem; }
    .hf-ui-card--pad-md { padding: 1.25rem; }
    .hf-ui-card--pad-lg { padding: 1.5rem; }
    .hf-ui-card--pad-xl { padding: 2rem; }
  }
  /* Portal - slightly tighter card padding (tokens + common Tailwind sizes on cards). */
  .hf-ui-shell .hf-ui-card--pad-sm { padding: 0.625rem; }
  .hf-ui-shell .hf-ui-card--pad-md { padding: 0.875rem; }
  .hf-ui-shell .hf-ui-card--pad-lg { padding: 1rem; }
  .hf-ui-shell .hf-ui-card--pad-xl { padding: 1.25rem; }
  @media (min-width: 640px) {
    .hf-ui-shell .hf-ui-card--pad-sm { padding: 0.875rem; }
    .hf-ui-shell .hf-ui-card--pad-md { padding: 1rem; }
    .hf-ui-shell .hf-ui-card--pad-lg { padding: 1.25rem; }
    .hf-ui-shell .hf-ui-card--pad-xl { padding: 1.5rem; }
  }
  .hf-ui-shell .hf-ui-card.hf-ui-card.hf-ui-card--pad-xl {
    padding: 1.5rem;
  }
  @media (min-width: 640px) {
    .hf-ui-shell .hf-ui-card.hf-ui-card.hf-ui-card--pad-xl {
      padding: 2rem;
    }
  }
  @media (min-width: 1024px) {
    .hf-ui-shell .hf-ui-card.hf-ui-card.hf-ui-card--pad-xl {
      padding: 2.25rem;
    }
  }
  .hf-ui-shell :is(.hf-ui-card, .glass).p-3,
  .hf-ui-shell .hf-ui-card__body.p-3 { padding: 0.625rem; }
  .hf-ui-shell :is(.hf-ui-card, .glass).p-4,
  .hf-ui-shell .hf-ui-card__body.p-4 { padding: 0.875rem; }
  .hf-ui-shell :is(.hf-ui-card, .glass).p-5,
  .hf-ui-shell .hf-ui-card__body.p-5 { padding: 1rem; }
  .hf-ui-shell :is(.hf-ui-card, .glass).p-6,
  .hf-ui-shell .hf-ui-card__body.p-6 { padding: 1.25rem; }
  .hf-ui-shell :is(.hf-ui-card, .glass).p-8,
  .hf-ui-shell .hf-ui-card__body.p-8 { padding: 1.75rem; }
  .hf-ui-shell :is(.hf-ui-card, .glass).p-10,
  .hf-ui-shell .hf-ui-card__body.p-10 { padding: 2rem; }
  @media (min-width: 640px) {
    .hf-ui-shell :is(.hf-ui-card, .glass).sm\:p-4,
    .hf-ui-shell .hf-ui-card__body.sm\:p-4 { padding: 0.875rem; }
    .hf-ui-shell :is(.hf-ui-card, .glass).sm\:p-5,
    .hf-ui-shell .hf-ui-card__body.sm\:p-5 { padding: 1rem; }
    .hf-ui-shell :is(.hf-ui-card, .glass).sm\:p-6,
    .hf-ui-shell .hf-ui-card__body.sm\:p-6 { padding: 1.25rem; }
    .hf-ui-shell :is(.hf-ui-card, .glass).sm\:p-10,
    .hf-ui-shell .hf-ui-card__body.sm\:p-10 { padding: 2rem; }
  }
  .hf-ui-shell .hf-ui-tabs__item,
  .hf-ui-shell button[data-ui-tab],
  .hf-ui-shell button[data-main-tab] {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
  }

  /* Portal SPA in-view tab strips - classic pill tabs, larger than legacy sm buttons */
  .hf-ui-shell .hf-ui-tab-list > button,
  .hf-ui-shell .hf-ui-tab-list .hf-ui-tabs__item,
  .hf-ui-shell [data-ui-view] .hf-ui-tabs__item[role='tab'],
  .hf-ui-shell button[data-ui-tab],
  .hf-ui-shell button[data-main-tab] {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    white-space: nowrap;
    padding: 0.5rem 1.125rem;
    font-size: 0.8125rem;
    line-height: 1.25rem;
    font-weight: 500;
    gap: 0.5rem;
    min-height: 2.375rem;
    border-radius: 9999px;
    border: 1px solid rgba(109, 182, 242, 0.22);
    background: rgba(63, 127, 220, 0.06);
    color: var(--hf-portal-text-blue);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
    transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
  }
  .hf-ui-shell .hf-ui-tab-list > button:hover,
  .hf-ui-shell .hf-ui-tab-list .hf-ui-tabs__item:hover,
  .hf-ui-shell [data-ui-view] .hf-ui-tabs__item[role='tab']:hover,
  .hf-ui-shell button[data-ui-tab]:hover,
  .hf-ui-shell button[data-main-tab]:hover {
    border-color: rgba(214, 220, 235, 0.3);
    background: rgba(63, 127, 220, 0.1);
    color: var(--hf-portal-text-blue-bright);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  .hf-ui-shell .hf-ui-tab-list > button:is(.is-active, [aria-selected='true'], .border-blue-500\/60),
  .hf-ui-shell .hf-ui-tab-list .hf-ui-tabs__item:is(.is-active, [aria-selected='true'], .border-blue-500\/60),
  .hf-ui-shell [data-ui-view] .hf-ui-tabs__item[role='tab']:is(.is-active, [aria-selected='true'], .border-blue-500\/60),
  .hf-ui-shell button[data-ui-tab]:is(.is-active, [aria-selected='true']),
  .hf-ui-shell button[data-main-tab]:is(.is-active, [aria-selected='true']) {
    border-color: rgba(109, 182, 242, 0.5);
    background: linear-gradient(180deg, rgba(214, 220, 235, 0.08), rgba(214, 220, 235, 0.048));
    color: var(--hf-portal-text-blue-bright);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  }
  .hf-ui-shell .hf-ui-tab-list .hf-ui-tabs__label,
  .hf-ui-shell [data-ui-view] .hf-ui-tabs__item[role='tab'] .hf-ui-tabs__label {
    background-image: var(--hf-portal-text-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
  .hf-ui-shell .hf-ui-tab-list > button:is(.is-active, [aria-selected='true']) .hf-ui-tabs__label,
  .hf-ui-shell .hf-ui-tab-list .hf-ui-tabs__item:is(.is-active, [aria-selected='true'], .border-blue-500\/60) .hf-ui-tabs__label,
  .hf-ui-shell [data-ui-view] .hf-ui-tabs__item[role='tab']:is(.is-active, [aria-selected='true'], .border-blue-500\/60) .hf-ui-tabs__label {
    background-image: var(--hf-portal-text-gradient-active);
  }
  .hf-ui-shell .hf-ui-tab-list > button:hover .hf-ui-tabs__label,
  .hf-ui-shell .hf-ui-tab-list .hf-ui-tabs__item:hover .hf-ui-tabs__label,
  .hf-ui-shell [data-ui-view] .hf-ui-tabs__item[role='tab']:hover .hf-ui-tabs__label {
    background-image: var(--hf-portal-text-gradient-active);
  }
  .hf-ui-shell .hf-ui-tab-list .hf-ui-tabs__item .hf-ui-tabs__icon,
  .hf-ui-shell .hf-ui-tab-list .hf-ui-tabs__item .hf-ui-tabs__label,
  .hf-ui-shell [data-ui-view] .hf-ui-tabs__item[role='tab'] .hf-ui-tabs__icon,
  .hf-ui-shell [data-ui-view] .hf-ui-tabs__item[role='tab'] .hf-ui-tabs__label {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .hf-ui-tabs__item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
  }
  .hf-ui-tabs__icon {
    display: inline-flex;
    flex-shrink: 0;
  }
  .hf-ui-shell .hf-ui-tabs__item .hf-ui-tabs__icon svg {
    display: block;
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    stroke: var(--hf-icon-ink);
    opacity: 0.92;
  }
  .hf-ui-shell .hf-ui-tab-list .hf-ui-tabs__item:is(.is-active, [aria-selected='true']) .hf-ui-tabs__icon svg,
  .hf-ui-shell [data-ui-view] .hf-ui-tabs__item[role='tab']:is(.is-active, [aria-selected='true']) .hf-ui-tabs__icon svg {
    stroke: currentColor;
    opacity: 1;
  }
  .hf-ui-shell .hf-ui-btn--secondary .hf-ui-btn__icon svg,
  .hf-ui-shell .hf-ui-btn--ghost .hf-ui-btn__icon svg,
  .hf-ui-shell .hf-ui-btn--utility .hf-ui-btn__icon svg,
  .hf-ui-shell .hf-ui-btn--success .hf-ui-btn__icon svg {
    stroke: currentColor;
  }
  .hf-ui-shell .hf-ui-btn--primary .hf-ui-btn__icon svg,
  .hf-ui-shell .hf-ui-btn--danger .hf-ui-btn__icon svg,
  .hf-ui-shell .hf-ui-btn.is-loading .hf-ui-btn__icon.hf-ui-btn__spinner {
    stroke: currentColor;
  }

  /* Portal button labels - platform identity gradient on secondary/ghost/utility/success */
  .hf-ui-shell .hf-ui-btn--secondary .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--ghost .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--utility .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--success .hf-ui-btn__label {
    background-image: var(--hf-portal-text-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
  }
  .hf-ui-shell .hf-ui-btn--secondary:hover .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--secondary:focus-visible .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--ghost:hover .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--ghost:focus-visible .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--utility:hover .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--utility:focus-visible .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--success:hover .hf-ui-btn__label,
  .hf-ui-shell .hf-ui-btn--success:focus-visible .hf-ui-btn__label {
    background-image: var(--hf-portal-text-gradient-active);
  }
  .hf-ui-shell .hf-ui-btn--secondary,
  .hf-ui-shell .hf-ui-btn--ghost,
  .hf-ui-shell .hf-ui-btn--utility,
  .hf-ui-shell .hf-ui-btn--success {
    border-color: var(--hf-hairline-strong, rgba(214, 220, 235, 0.16));
    background: rgba(214, 220, 235, 0.03);
    color: var(--hf-ink, #ece7dc);
  }
  .hf-ui-shell .hf-ui-btn--secondary:hover,
  .hf-ui-shell .hf-ui-btn--secondary:focus-visible,
  .hf-ui-shell .hf-ui-btn--ghost:hover,
  .hf-ui-shell .hf-ui-btn--ghost:focus-visible,
  .hf-ui-shell .hf-ui-btn--utility:hover,
  .hf-ui-shell .hf-ui-btn--utility:focus-visible,
  .hf-ui-shell .hf-ui-btn--success:hover,
  .hf-ui-shell .hf-ui-btn--success:focus-visible {
    border-color: rgba(214, 220, 235, 0.3);
    background: linear-gradient(180deg, rgba(214, 220, 235, 0.06), rgba(214, 220, 235, 0.036));
    color: var(--hf-portal-text-blue-bright);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  .hf-ui-shell .hf-public-site-footer__social.hf-ui-btn--icon {
    color: rgb(167 162 151);
  }
  .hf-ui-shell .hf-public-site-footer__social.hf-ui-btn--icon:hover,
  .hf-ui-shell .hf-public-site-footer__social.hf-ui-btn--icon:focus-visible {
    color: var(--hf-ink, #ece7dc);
  }
  .hf-ui-shell .hf-public-site-footer__social .hf-ui-btn__icon svg {
    fill: currentColor;
    stroke: none;
  }
  .hf-ui-shell .hf-ui-btn--primary .hf-ui-btn__label {
    color: var(--hf-btn-primary-color, #0b0d13);
    -webkit-text-fill-color: currentColor;
    background-image: none;
    background-clip: border-box;
  }

  .hf-ui-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-top: 0.1875rem;
    padding-bottom: 0.1875rem;
    border-radius: 0.625rem;
    border: 1px solid transparent;
    font-size: 0.75rem;
    line-height: 1.125rem;
    font-weight: 500;
    white-space: nowrap;
    min-height: 2rem;
    overflow: hidden;
    isolation: isolate;
    flex: 0 0 auto;
    box-sizing: border-box;
    transition: border-color 0.25s ease, background-color 0.25s ease, background-image 0.25s ease, color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
  }
  button.hf-ui-btn:not(.hf-ui-btn--block):not(.hf-landing-cta):not(.hf-ui-btn--icon):not(.hf-ui-btn--icon-tip),
  a.hf-ui-btn:not(.hf-ui-btn--block):not(.hf-landing-cta):not(.hf-ui-btn--icon):not(.hf-ui-btn--icon-tip),
  summary.hf-ui-btn:not(.hf-ui-btn--block):not(.hf-landing-cta):not(.hf-ui-btn--icon):not(.hf-ui-btn--icon-tip),
  .hf-ui-btn:not(.hf-ui-btn--block):not(.hf-landing-cta):not(.hf-ui-btn--icon):not(.hf-ui-btn--icon-tip) {
    width: max-content !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    flex-basis: auto !important;
    align-self: center;
    justify-self: start;
  }
  .hf-ui-btn--block {
    display: flex;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    align-self: stretch;
    justify-self: stretch;
    justify-content: center;
  }
  .hf-ui-btn::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.16) 18%, transparent 38%);
    transform: translateX(-120%);
    transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .hf-ui-btn:hover,
  .hf-ui-btn:focus-visible {
    transform: translateY(-2px);
  }
  .hf-ui-btn:hover::before,
  .hf-ui-btn:focus-visible::before {
    transform: translateX(120%);
  }
  .hf-ui-btn .hf-ui-btn__icon,
  .hf-ui-btn .hf-ui-btn__label {
    position: relative;
    z-index: 1;
  }
  .hf-ui-btn .hf-ui-btn__icon {
    transition: transform 0.25s ease;
  }
  .hf-ui-btn:not(.hf-ui-btn--icon):not(.hf-ui-btn--icon-tip):hover > .hf-ui-btn__icon:last-child,
  .hf-ui-btn:not(.hf-ui-btn--icon):not(.hf-ui-btn--icon-tip):focus-visible > .hf-ui-btn__icon:last-child {
    transform: translateX(3px);
  }
  .hf-ui-btn.hf-ui-btn--icon-tip:not(.hf-ui-btn--with-label) {
    gap: 0;
    min-width: 2rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
  .hf-ui-btn.hf-ui-btn--icon-tip.hf-ui-btn--xs:not(.hf-ui-btn--with-label) {
    min-width: 1.75rem;
    padding-left: 0.375rem;
    padding-right: 0.375rem;
  }
  .hf-ui-btn.hf-ui-btn--icon-tip:not(.hf-ui-btn--with-label) > .hf-ui-btn__label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
    background: none !important;
    background-image: none !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
  }
  .hf-ui-btn.hf-ui-btn--icon-tip:not(.hf-ui-btn--with-label):hover > .hf-ui-btn__icon:last-child,
  .hf-ui-btn.hf-ui-btn--icon-tip:not(.hf-ui-btn--with-label):focus-visible > .hf-ui-btn__icon:last-child {
    transform: none;
  }
  .hf-ui-btn:disabled,
  .hf-ui-btn[aria-disabled='true'] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
  }
  .hf-ui-btn:disabled::before,
  .hf-ui-btn[aria-disabled='true']::before {
    display: none;
  }
  @keyframes hf-ui-btn-spin {
    to { transform: rotate(360deg); }
  }
  .hf-ui-btn__spinner,
  .hf-ui-btn__icon.hf-ui-btn__spinner {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    box-sizing: border-box;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 9999px;
    animation: hf-ui-btn-spin 0.75s linear infinite;
    flex-shrink: 0;
    vertical-align: middle;
  }
  .hf-ui-btn--xs .hf-ui-btn__spinner,
  .hf-ui-btn--xs .hf-ui-btn__icon.hf-ui-btn__spinner {
    width: 0.875rem;
    height: 0.875rem;
  }
  .hf-ui-btn.is-loading {
    pointer-events: none;
    cursor: wait;
  }
  .hf-ui-btn.is-loading:hover,
  .hf-ui-btn.is-loading:focus-visible {
    transform: none;
  }
  .hf-ui-btn.is-loading::before {
    display: none;
  }
  .hf-ui-btn.is-loading > .hf-ui-btn__icon:not(.hf-ui-btn__spinner) {
    display: none;
  }
  @media (prefers-reduced-motion: reduce) {
    .hf-ui-btn__spinner,
    .hf-ui-btn__icon.hf-ui-btn__spinner {
      animation-duration: 1.25s;
    }
    .hf-ui-btn::before {
      display: none !important;
    }
    .hf-ui-btn:hover,
    .hf-ui-btn:focus-visible,
    .hf-ui-btn:hover > .hf-ui-btn__icon,
    .hf-ui-btn:focus-visible > .hf-ui-btn__icon {
      transform: none;
    }
  }
  .hf-ui-btn--xs {
    min-height: 1.5rem;
    font-size: 0.6875rem;
    line-height: 1rem;
    gap: 0.25rem;
    padding-left: 0.375rem;
    padding-right: 0.375rem;
    border-radius: 0.5rem;
  }
  .hf-ui-btn--sm {
    min-height: 1.75rem;
    font-size: 0.75rem;
    line-height: 1.125rem;
  }
  .hf-ui-btn--icon {
    min-height: 2rem;
    min-width: 2rem;
    padding: 0.25rem;
    gap: 0;
  }
  .hf-ui-tooltip {
    position: fixed;
    z-index: 100200;
    pointer-events: none;
    max-width: 14rem;
    padding: 0.35rem 0.6rem;
    font-size: 0.6875rem;
    line-height: 1.25;
    font-weight: 500;
    letter-spacing: 0.01em;
    color: rgb(236 231 220);
    background: #10131b;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 0.375rem;
    box-shadow: 0 10px 28px -8px rgba(0, 0, 0, 0.65);
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.12s ease, transform 0.12s ease;
    white-space: normal;
    text-align: center;
  }
  .hf-ui-tooltip.is-visible {
    opacity: 1;
    transform: translateY(0);
  }
  .hf-ui-tooltip[data-wide='1'] {
    max-width: 20rem;
    text-align: left;
    font-weight: 400;
    line-height: 1.35;
  }
  .hf-ui-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.15rem;
    height: 1.15rem;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.04);
    color: #9b9da8;
    cursor: help;
    flex-shrink: 0;
    vertical-align: middle;
  }
  .hf-ui-help:hover,
  .hf-ui-help:focus-visible {
    color: #dcd8cf;
    border-color: rgba(166, 214, 248, 0.5);
    background: rgba(166, 214, 248, 0.1);
    outline: none;
  }
  .hf-ui-help__icon {
    width: 0.7rem;
    height: 0.7rem;
    display: block;
  }
  .hf-ui-label-row,
  .hf-ui-heading-row {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
  }
  .hf-ui-heading-row {
    display: flex;
  }
  .hf-ui-label-row > label {
    margin-bottom: 0;
  }
  .hf-ui-tooltip[data-placement='bottom'] {
    transform: translateY(-4px);
  }
  .hf-ui-tooltip[data-placement='bottom'].is-visible {
    transform: translateY(0);
  }
  @media (prefers-reduced-motion: reduce) {
    .hf-ui-tooltip {
      transition: none;
      transform: none;
    }
    .hf-ui-tooltip.is-visible {
      transform: none;
    }
  }
  .hf-ui-btn--primary {
    border-color: var(--hf-btn-primary-border, rgba(86, 90, 107, 0.42));
    background-color: rgba(16, 19, 27, 0.98);
    background-image: var(--hf-btn-primary-fill);
    color: var(--hf-btn-primary-color, #0b0d13);
    box-shadow: var(--hf-btn-primary-rest-shadow, 0 10px 22px -22px rgba(0, 0, 0, 0.55));
  }
  .hf-ui-btn--primary:hover,
  .hf-ui-btn--primary:focus-visible {
    border-color: var(--hf-btn-primary-hover-border);
    color: var(--hf-btn-primary-color, #0b0d13);
    background-image: var(--hf-btn-primary-hover);
    box-shadow: var(--hf-btn-primary-shadow);
  }
  .hf-ui-btn.hf-ui-btn--primary,
  .hf-ui-btn.hf-ui-btn--primary:hover,
  .hf-ui-btn.hf-ui-btn--primary:focus-visible,
  .hf-ui-btn.hf-ui-btn--primary .hf-ui-btn__label,
  .hf-ui-btn.hf-ui-btn--primary .hf-ui-btn__icon {
    color: var(--hf-btn-primary-color, #0b0d13);
  }
  .hf-ui-btn--secondary,
  .hf-ui-btn--ghost,
  .hf-ui-btn--utility {
    border-color: rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.03);
    color: rgb(220 216 207);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
  }
  .hf-ui-btn--secondary:hover,
  .hf-ui-btn--secondary:focus-visible,
  .hf-ui-btn--ghost:hover,
  .hf-ui-btn--ghost:focus-visible,
  .hf-ui-btn--utility:hover,
  .hf-ui-btn--utility:focus-visible {
    border-color: var(--hf-btn-secondary-hover-border);
    background: var(--hf-btn-secondary-hover-bg);
    color: var(--hf-btn-secondary-hover-color);
    box-shadow: var(--hf-btn-secondary-hover-shadow);
  }
  .hf-ui-btn--danger {
    border-color: rgba(238, 130, 150, 0.3);
    background: rgba(210, 75, 102, 0.1);
    color: rgb(243 163 178);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
  }
  .hf-ui-btn--danger:hover,
  .hf-ui-btn--danger:focus-visible {
    border-color: rgba(238, 130, 150, 0.42);
    background: rgba(210, 75, 102, 0.16);
    color: rgb(247 197 207);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0), inset 0 1px 0 rgba(255, 255, 255, 0.02);
  }

  /* KPI / metric cards: icon-only chip + value always share one row (§8, §29). */
  .hf-ui-metric__count-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    margin-top: 0.375rem;
  }
  .hf-ui-metric__value {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .hf-ui-metric__icon {
    box-sizing: border-box;
    display: inline-flex;
    height: 1.75rem;
    width: 1.75rem;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
    color: rgb(167 162 151);
  }
  .hf-ui-shell .hf-ui-metric__icon {
    border-color: rgba(109, 182, 242, 0.28);
    background: linear-gradient(180deg, rgba(214, 220, 235, 0.05), rgba(214, 220, 235, 0.03));
    color: var(--hf-icon-ink);
  }
  .hf-ui-metric__icon svg {
    display: block;
    height: 0.875rem;
    width: 0.875rem;
  }
  .hf-ui-shell .hf-ui-metric__icon svg {
    stroke: currentColor;
  }
  .hf-ui-shell .hf-ui-metric__icon.hf-ui-metric__icon--solid {
    color: var(--hf-icon-ink);
  }
  .hf-ui-shell .hf-ui-metric__icon.hf-ui-metric__icon--solid svg {
    stroke: currentColor;
  }
  .hf-ui-stat__count-row {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    min-width: 0;
    margin-top: 0.25rem;
  }
  .hf-ui-stat__count-row .hf-ui-metric__icon {
    align-self: center;
  }

  /* Scroll regions keep overflow-y: auto; hf-scroll-region--* only marks state for JS.
     Do not force overflow-y: hidden when content height grows inside a fixed flex host
     (portal #view-panel, blog write tab, etc.) - ResizeObserver misses scrollHeight changes. */

  :where(
    .entity-view-tabs__button,
    .hf-ui-tabs .hf-ui-tabs__item,
    .hf-ui-tab-list .hf-ui-tabs__item,
    .tab-btn,
    .bb-tab-btn,
    .soc-tab-btn,
    .team-tab-btn,
    .event-main-tab-btn,
    .admin-event-view-tab,
    .sec-tab-btn,
    .entity-tab-btn,
    .icon-tab,
    .author-tab,
    .partner-view-tab,
    .recruiter-tab
  ) {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    white-space: nowrap;
    border-radius: 9999px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.03);
    color: rgb(220 216 207);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
    transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  }
  :where(.hf-ui-tabs .hf-ui-tabs__item, .hf-ui-tab-list .hf-ui-tabs__item) .hf-ui-tabs__icon,
  :where(.hf-ui-tabs .hf-ui-tabs__item, .hf-ui-tab-list .hf-ui-tabs__item) .hf-ui-tabs__label,
  :where(.hf-ui-tabs .hf-ui-tabs__item, .hf-ui-tab-list .hf-ui-tabs__item) .hf-ui-tabs__count {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    flex-shrink: 0;
  }
  :where(.hf-ui-tabs .hf-ui-tabs__item, .hf-ui-tab-list .hf-ui-tabs__item) .hf-ui-tabs__label {
    flex-shrink: 0;
  }
  :where(.hf-ui-tabs .hf-ui-tabs__item, .hf-ui-tab-list .hf-ui-tabs__item) .hf-ui-tabs__icon svg {
    display: block;
    flex-shrink: 0;
  }
  :where(
    .entity-view-tabs__button,
    .hf-ui-tabs .hf-ui-tabs__item,
    .tab-btn,
    .bb-tab-btn,
    .soc-tab-btn,
    .team-tab-btn,
    .event-main-tab-btn,
    .admin-event-view-tab,
    .sec-tab-btn,
    .entity-tab-btn,
    .icon-tab,
    .author-tab,
    .partner-view-tab,
    .recruiter-tab
  ):hover {
    border-color: rgba(255, 255, 255, 0.2);
    color: var(--hf-ink, #ece7dc);
  }
  :where(
    .entity-view-tabs__button,
    .hf-ui-tabs .hf-ui-tabs__item,
    .tab-btn,
    .bb-tab-btn,
    .soc-tab-btn,
    .team-tab-btn,
    .event-main-tab-btn,
    .admin-event-view-tab,
    .sec-tab-btn,
    .entity-tab-btn,
    .icon-tab,
    .author-tab,
    .partner-view-tab,
    .recruiter-tab
  ):is(.is-active, [aria-selected='true'], [class~='bg-gradient-to-r'], [class~='bg-white/[0.06]']) {
    color: var(--hf-ink, #ece7dc);
  }

  :where(
    .entity-view-tabs__button,
    .hf-ui-tabs .hf-ui-tabs__item,
    .tab-btn,
    .bb-tab-btn,
    .soc-tab-btn,
    .team-tab-btn,
    .event-main-tab-btn,
    .admin-event-view-tab,
    .sec-tab-btn,
    .entity-tab-btn,
    .icon-tab,
    .author-tab,
    .partner-view-tab,
    .recruiter-tab
  ):is([class~='border-blue-500/60'], [class~='border-blue-500/50'], [class~='border-blue-500/30'], [class~='border-blue-400/40'], [class~='border-cyan-500/60'], [class~='border-cyan-500/50'], [class~='border-cyan-500/40'], [class~='border-cyan-500/30'], [class~='border-sky-500/40']) {
    border-color: rgba(109, 182, 242, 0.3);
    background: rgba(63, 127, 220, 0.1);
    color: rgb(222 237 252);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  :where(
    .entity-view-tabs__button,
    .hf-ui-tabs .hf-ui-tabs__item,
    .tab-btn,
    .bb-tab-btn,
    .soc-tab-btn,
    .team-tab-btn,
    .event-main-tab-btn,
    .admin-event-view-tab,
    .sec-tab-btn,
    .entity-tab-btn,
    .icon-tab,
    .author-tab,
    .partner-view-tab,
    .recruiter-tab
  ):is([class~='border-purple-500/60'], [class~='border-purple-500/50'], [class~='border-purple-500/30'], [class~='border-purple-400/40'], [class~='border-indigo-500/60'], [class~='border-indigo-500/50']) {
    border-color: rgba(125, 107, 189, 0.32);
    background: rgba(125, 107, 189, 0.1);
    color: rgb(235 231 247);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  :where(
    .entity-view-tabs__button,
    .hf-ui-tabs .hf-ui-tabs__item,
    .tab-btn,
    .bb-tab-btn,
    .soc-tab-btn,
    .team-tab-btn,
    .event-main-tab-btn,
    .admin-event-view-tab,
    .sec-tab-btn,
    .entity-tab-btn,
    .icon-tab,
    .author-tab,
    .partner-view-tab,
    .recruiter-tab
  ):is([class~='border-red-500/60'], [class~='border-red-500/50'], [class~='border-red-500/30'], [class~='border-red-400/40'], [class~='border-rose-500/60'], [class~='border-rose-500/50'], [class~='border-rose-500/30']) {
    border-color: rgba(238, 130, 150, 0.32);
    background: rgba(210, 75, 102, 0.1);
    color: rgb(251 225 230);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  :where(
    .entity-view-tabs__button,
    .hf-ui-tabs .hf-ui-tabs__item,
    .tab-btn,
    .bb-tab-btn,
    .soc-tab-btn,
    .team-tab-btn,
    .event-main-tab-btn,
    .admin-event-view-tab,
    .sec-tab-btn,
    .entity-tab-btn,
    .icon-tab,
    .author-tab,
    .partner-view-tab,
    .recruiter-tab
  ):is([class~='border-amber-500/60'], [class~='border-amber-500/50'], [class~='border-amber-500/30'], [class~='border-amber-400/40']) {
    border-color: rgba(230, 207, 148, 0.32);
    background: rgba(212, 181, 106, 0.1);
    color: rgb(247 240 217);
    box-shadow: 0 14px 30px -20px rgba(212, 181, 106, 0.72);
  }
  :where(
    .entity-view-tabs__button,
    .hf-ui-tabs .hf-ui-tabs__item,
    .tab-btn,
    .bb-tab-btn,
    .soc-tab-btn,
    .team-tab-btn,
    .event-main-tab-btn,
    .admin-event-view-tab,
    .sec-tab-btn,
    .entity-tab-btn,
    .icon-tab,
    .author-tab,
    .partner-view-tab,
    .recruiter-tab
  ):is([class~='border-emerald-500/60'], [class~='border-emerald-500/50'], [class~='border-emerald-500/30'], [class~='border-emerald-400/40'], [class~='bg-white/[0.06]']) {
    border-color: rgba(88, 184, 160, 0.32);
    background: rgba(63, 160, 136, 0.1);
    color: rgb(216 240 233);
    box-shadow: 0 14px 30px -20px rgba(63, 160, 136, 0.72);
  }

  /* Shell sidebars (admin, portal, entity): one selected-row treatment */
  #admin-tabs .tab-btn,
  .hf-ui-shell__sidebar [data-ui-nav-list] .tab-btn,
  .hf-ui-shell__sidebar [data-entity-nav-list] .tab-btn {
    width: 100%;
    justify-content: flex-start;
    border-radius: 0.75rem;
    /* Sidebar rows are flat: the border only appears on hover and on the
       selected row. --hf-icon-ink is the icon tone, never a row outline. */
    border-color: transparent;
    background: transparent;
    color: rgb(167 162 151);
    box-shadow: none;
  }
  #admin-tabs .tab-btn:hover,
  .hf-ui-shell__sidebar [data-ui-nav-list] .tab-btn:hover,
  .hf-ui-shell__sidebar [data-entity-nav-list] .tab-btn:hover {
    border-color: rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
    color: var(--hf-ink, #ece7dc);
  }
  #admin-tabs .tab-btn.is-active,
  #admin-tabs .tab-btn[aria-selected='true'],
  .hf-ui-shell__sidebar [data-ui-nav-list] .tab-btn.is-active,
  .hf-ui-shell__sidebar [data-ui-nav-list] .tab-btn[aria-selected='true'],
  .hf-ui-shell__sidebar [data-entity-nav-list] .tab-btn.is-active,
  .hf-ui-shell__sidebar [data-entity-nav-list] .tab-btn[aria-selected='true'] {
    border-color: rgba(109, 182, 242, 0.3);
    color: var(--hf-ink, #ece7dc);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    background-color: rgba(255, 255, 255, 0.08);
    background-image: linear-gradient(180deg, rgba(214, 220, 235, 0.06), rgba(214, 220, 235, 0.036));
  }
  #admin-tabs .tab-btn.is-active:hover,
  #admin-tabs .tab-btn[aria-selected='true']:hover,
  .hf-ui-shell__sidebar [data-ui-nav-list] .tab-btn.is-active:hover,
  .hf-ui-shell__sidebar [data-ui-nav-list] .tab-btn[aria-selected='true']:hover,
  .hf-ui-shell__sidebar [data-entity-nav-list] .tab-btn.is-active:hover,
  .hf-ui-shell__sidebar [data-entity-nav-list] .tab-btn[aria-selected='true']:hover {
    border-color: rgba(109, 182, 242, 0.42);
    color: var(--hf-ink, #ece7dc);
    background-image: linear-gradient(180deg, rgba(214, 220, 235, 0.08), rgba(214, 220, 235, 0.048));
  }
  .hf-ui-shell .hf-ui-shell__sidebar :is([data-ui-nav-list], [data-entity-nav-list]) .hf-ui-sidebar__item.is-active,
  .hf-ui-shell .hf-ui-shell__sidebar :is([data-ui-nav-list], [data-entity-nav-list]) .hf-ui-sidebar__item[aria-selected='true'],
  .hf-ui-shell .hf-ui-shell__sidebar :is([data-ui-nav-list], [data-entity-nav-list]) .hf-ui-sidebar__item.is-active:hover,
  .hf-ui-shell .hf-ui-shell__sidebar :is([data-ui-nav-list], [data-entity-nav-list]) .hf-ui-sidebar__item[aria-selected='true']:hover {
    border-color: var(--hf-icon-ink);
    background-color: rgba(255, 255, 255, 0.08);
    background-image: none;
    box-shadow: none;
    color: var(--hf-ink, #ece7dc);
  }

  /* Platform scrollbar - red → blue → purple (Firefox: solid thumb; WebKit: gradient). */
  :root {
    --hf-scrollbar-track: rgba(12, 14, 22, 0.92);
    --hf-scrollbar-gradient: var(--hf-brand-gradient);
    --hf-scrollbar-gradient-hover: var(--hf-brand-gradient-soft);
  }
  * {
    scrollbar-width: thin;
    scrollbar-color: var(--hf-scrollbar-thumb) var(--hf-scrollbar-track);
  }
  *::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
  *::-webkit-scrollbar-track {
    background: var(--hf-scrollbar-track);
    border-radius: 4px;
  }
  *::-webkit-scrollbar-thumb {
    background: var(--hf-scrollbar-gradient);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 4px;
  }
  *::-webkit-scrollbar-thumb:hover {
    background: var(--hf-scrollbar-gradient-hover);
    border-color: rgba(109, 182, 242, 0.35);
  }
  .hf-ui-shell * {
    scrollbar-color: #9ccdf5 var(--hf-scrollbar-track);
  }
  .hf-ui-shell *::-webkit-scrollbar-thumb {
    background: var(--hf-scrollbar-gradient);
  }
  .hf-ui-shell *::-webkit-scrollbar-thumb:hover {
    background: var(--hf-scrollbar-gradient-hover);
  }
  .hf-ui-shell .hf-custom-dropdown-list {
    scrollbar-color: #9ccdf5 rgba(12, 14, 22, 0.95);
  }
  .hf-ui-shell .hf-custom-dropdown-list::-webkit-scrollbar-thumb {
    background: var(--hf-scrollbar-gradient);
    border: 1px solid rgba(255, 255, 255, 0.08);
  }
  .hf-ui-shell .hf-custom-dropdown-list::-webkit-scrollbar-thumb:hover {
    background: var(--hf-scrollbar-gradient-hover);
  }

  .panel { width: 100%; min-width: 0; }
  #admin-panels, #staff-panels, #settings-panels, #profile-panels { width: 100%; min-width: 0; }

  /* Portal tabbed views: consistent gap between tab strip and content card */
  .hf-ui-shell {
    --hf-portal-tabbed-gap: 1rem;
  }
  .hf-ui-shell [data-ui-tabbed-view],
  .hf-ui-shell .hf-ui-tabbed-view {
    display: flex;
    flex-direction: column;
    gap: var(--hf-portal-tabbed-gap);
    width: 100%;
    min-width: 0;
  }
  .hf-ui-shell [data-ui-tabbed-view] > .hf-ui-tab-list,
  .hf-ui-shell [data-ui-tabbed-view] > [data-ui-tab-list],
  .hf-ui-shell [data-ui-tabbed-view] [data-ui-skeleton-tabs],
  .hf-ui-shell .hf-ui-tabbed-view > .hf-ui-tab-list,
  .hf-ui-shell .hf-ui-tabbed-view > [data-ui-tab-list],
  .hf-ui-shell .hf-ui-tabbed-view [data-ui-skeleton-tabs] {
    margin-bottom: 0 !important;
  }
  .hf-ui-shell [data-ui-tabbed-view] > [data-ui-tab-panels],
  .hf-ui-shell .hf-ui-tabbed-view > [data-ui-tab-panels],
  .hf-ui-shell [data-ui-tab-panels].hf-ui-card {
    width: 100%;
    min-width: 0;
  }
  .hf-ui-shell .event-main-tabs {
    display: flex;
    flex-direction: column;
    gap: var(--hf-portal-tabbed-gap);
    width: 100%;
    min-width: 0;
  }
  .hf-ui-shell .event-main-tabs > .hf-ui-tab-list,
  .hf-ui-shell .event-main-tabs > [data-ui-tab-list] {
    margin-bottom: 0 !important;
  }
  .hf-ui-shell .entity-tabs {
    display: flex;
    flex-direction: column;
    gap: var(--hf-portal-tabbed-gap);
  }
  .hf-ui-shell .entity-tabs > .entity-tab-buttons,
  .hf-ui-shell .entity-tabs > .hf-ui-tab-list {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .hf-ui-shell .entity-tabs > .entity-tab-panel,
  .hf-ui-shell .entity-tabs > [data-ui-tab-panel] {
    margin-top: 0 !important;
  }

  /* Admin (and other panels): tabbed views use the same strip + card gap as portal (§16). */
  .hf-ui-shell--admin {
    --hf-portal-tabbed-gap: 1rem;
  }
  .hf-ui-shell [data-ui-tabbed-view],
  .hf-ui-shell .hf-ui-tabbed-view {
    display: flex;
    flex-direction: column;
    gap: var(--hf-portal-tabbed-gap);
    width: 100%;
    min-width: 0;
  }
  .hf-ui-shell [data-ui-tabbed-view] > .hf-ui-tab-list,
  .hf-ui-shell [data-ui-tabbed-view] > [data-ui-tab-list],
  .hf-ui-shell .hf-ui-tabbed-view > .hf-ui-tab-list,
  .hf-ui-shell .hf-ui-tabbed-view > [data-ui-tab-list] {
    margin-bottom: 0 !important;
  }
  .hf-ui-shell [data-ui-tabbed-view] > [data-ui-tab-panels],
  .hf-ui-shell .hf-ui-tabbed-view > [data-ui-tab-panels] {
    width: 100%;
    min-width: 0;
  }
  .hf-ui-card-grid.hf-ui-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
    justify-content: stretch;
  }
  /* Admin unified event / SOC workspace views - document scroll; no shell topbar. */
  .hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .hf-ui-shell__main,
  body.hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .hf-ui-shell__main,
  .hf-ui-shell--admin[data-ui-view='admin-control-center-view-shell'] .hf-ui-shell__main,
  body.hf-ui-shell--admin[data-ui-view='admin-control-center-view-shell'] .hf-ui-shell__main,
  .hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-ui-shell__main,
  body.hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-ui-shell__main,
  .hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-ui-shell__main,
  body.hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-ui-shell__main,
  .hf-ui-shell--admin[data-ui-view='admin-soc-workspace-shell'] .hf-ui-shell__main,
  body.hf-ui-shell--admin[data-ui-view='admin-soc-workspace-shell'] .hf-ui-shell__main {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: visible;
  }
  .hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .hf-admin-event-view__main,
  body.hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .hf-admin-event-view__main,
  .hf-ui-shell--admin[data-ui-view='admin-control-center-view-shell'] .hf-admin-event-view__main,
  body.hf-ui-shell--admin[data-ui-view='admin-control-center-view-shell'] .hf-admin-event-view__main,
  .hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-admin-event-view__main,
  body.hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-admin-event-view__main,
  .hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-admin-event-view__main,
  body.hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-admin-event-view__main,
  .hf-ui-shell--admin[data-ui-view='admin-soc-workspace-shell'] .hf-admin-event-view__main,
  body.hf-ui-shell--admin[data-ui-view='admin-soc-workspace-shell'] .hf-admin-event-view__main {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    overflow: visible;
    padding-bottom: max(
      var(--hf-admin-view-pad-bottom),
      calc(env(safe-area-inset-bottom, 0px) + 1.25rem)
    );
  }
  .hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .hf-admin-event-view__panel,
  body.hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .hf-admin-event-view__panel,
  .hf-ui-shell--admin[data-ui-view='admin-control-center-view-shell'] #admin-control-center-panel,
  body.hf-ui-shell--admin[data-ui-view='admin-control-center-view-shell'] #admin-control-center-panel,
  .hf-ui-shell--admin[data-ui-view='admin-soc-workspace-shell'] #admin-soc-workspace-panel,
  body.hf-ui-shell--admin[data-ui-view='admin-soc-workspace-shell'] #admin-soc-workspace-panel {
    width: 100%;
    min-width: 0;
  }
  .hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .hf-ui-shell__main > footer,
  body.hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .hf-ui-shell__main > footer,
  .hf-ui-shell--admin[data-ui-view='admin-control-center-view-shell'] .hf-ui-shell__main > footer,
  body.hf-ui-shell--admin[data-ui-view='admin-control-center-view-shell'] .hf-ui-shell__main > footer,
  .hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-ui-shell__main > footer,
  body.hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-ui-shell__main > footer,
  .hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-ui-shell__main > footer,
  body.hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-ui-shell__main > footer,
  .hf-ui-shell--admin[data-ui-view='admin-soc-workspace-shell'] .hf-ui-shell__main > footer,
  body.hf-ui-shell--admin[data-ui-view='admin-soc-workspace-shell'] .hf-ui-shell__main > footer {
    flex-shrink: 0;
    margin-top: auto;
  }
  .hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-ui-shell__sidebar,
  body.hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-ui-shell__sidebar,
  .hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-ui-shell__topbar,
  body.hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-ui-shell__topbar,
  .hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-portal-sidebar-backdrop,
  body.hf-ui-shell--admin[data-ui-view='admin-architecture-view-shell'] .hf-portal-sidebar-backdrop,
  .hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-ui-shell__sidebar,
  body.hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-ui-shell__sidebar,
  .hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-ui-shell__topbar,
  body.hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-ui-shell__topbar,
  .hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-portal-mobile-topbar,
  body.hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-portal-mobile-topbar,
  .hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-portal-sidebar-backdrop,
  body.hf-ui-shell--admin[data-ui-view='admin-bugbounty-reports-view-shell'] .hf-portal-sidebar-backdrop {
    display: none !important;
  }
  .hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .admin-event-view-tab,
  body.hf-ui-shell--admin[data-ui-view='admin-event-view-shell'] .admin-event-view-tab {
    text-decoration: none;
    cursor: pointer;
  }

  .toast-notification { animation: toast-in 0.25s ease-out; }
  @keyframes toast-in {
    from { opacity: 0; transform: translateX(100%); }
    to { opacity: 1; transform: translateX(0); }
  }
  .toast-notification.toast-out { animation: toast-out 0.2s ease-in forwards; }
  @keyframes toast-out {
    to { opacity: 0; transform: translateX(100%); }
  }

  .js-question-result.question-result-flash-correct {
    animation: question-flash-correct 0.6s ease-out;
  }
  .js-question-result.question-result-flash-incorrect {
    animation: question-flash-incorrect 0.6s ease-out;
  }
  @keyframes question-flash-correct {
    0% { background-color: rgba(63, 160, 136, 0.35); border-radius: 6px; box-shadow: 0 0 12px rgba(63, 160, 136, 0.25); }
    100% { background-color: transparent; box-shadow: none; }
  }
  @keyframes question-flash-incorrect {
    0% { background-color: rgba(210, 75, 102, 0.35); border-radius: 6px; box-shadow: 0 0 12px rgba(210, 75, 102, 0.25); }
    100% { background-color: transparent; box-shadow: none; }
  }

  #hf-answer-effect-root {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    pointer-events: none;
  }
  #hf-answer-effect-root.hf-answer-effect--active {
    display: flex;
  }
  .hf-answer-effect__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.85rem 1.5rem;
    border-radius: 9999px;
    border: 1px solid transparent;
    backdrop-filter: blur(6px);
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--hf-ink, #ece7dc);
    animation: hf-answer-effect-pop 0.32s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  #hf-answer-effect-root.hf-answer-effect--out .hf-answer-effect__badge {
    animation: hf-answer-effect-fade 0.2s ease-in forwards;
  }
  .hf-answer-effect--correct .hf-answer-effect__badge {
    background: rgba(63, 160, 136, 0.18);
    border-color: rgba(63, 160, 136, 0.55);
    box-shadow: 0 0 32px rgba(63, 160, 136, 0.35);
  }
  .hf-answer-effect--incorrect .hf-answer-effect__badge {
    background: rgba(210, 75, 102, 0.18);
    border-color: rgba(210, 75, 102, 0.55);
    box-shadow: 0 0 32px rgba(210, 75, 102, 0.3);
    animation: hf-answer-effect-pop-shake 0.6s ease-out;
  }
  .hf-answer-effect__icon {
    width: 1.5rem;
    height: 1.5rem;
    flex-shrink: 0;
  }
  .hf-answer-effect--correct .hf-answer-effect__icon { color: #58b8a0; }
  .hf-answer-effect--incorrect .hf-answer-effect__icon { color: #ee8296; }
  .hf-answer-effect__spark {
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: #58b8a0;
    opacity: 0;
    transform: rotate(var(--hf-spark-angle, 0deg)) translateX(0);
    animation: hf-answer-effect-spark 0.7s ease-out forwards;
  }
  @keyframes hf-answer-effect-pop {
    0% { opacity: 0; transform: scale(0.7); }
    100% { opacity: 1; transform: scale(1); }
  }
  @keyframes hf-answer-effect-fade {
    to { opacity: 0; transform: scale(0.92); }
  }
  @keyframes hf-answer-effect-pop-shake {
    0% { opacity: 0; transform: scale(0.7); }
    45% { opacity: 1; transform: scale(1); }
    60% { transform: translateX(-6px) scale(1); }
    75% { transform: translateX(6px) scale(1); }
    90% { transform: translateX(-3px) scale(1); }
    100% { transform: translateX(0) scale(1); }
  }
  @keyframes hf-answer-effect-spark {
    0% { opacity: 1; transform: rotate(var(--hf-spark-angle, 0deg)) translateX(0) scale(1); }
    100% { opacity: 0; transform: rotate(var(--hf-spark-angle, 0deg)) translateX(64px) scale(0.4); }
  }
  @media (prefers-reduced-motion: reduce) {
    .hf-answer-effect__badge,
    .hf-answer-effect__spark {
      animation: none !important;
    }
  }

  .hf-ui-card.hf-ui-card:not(.hf-ui-card--secondary):not(.hf-ui-card--inset),
  section.glass.glass,
  div.glass.glass,
  article.glass.glass {
    border: 1px solid transparent;
    background-color: var(--hf-portal-wall-card-bg, rgba(12, 14, 22, 0.48));
    background-image:
      var(--hf-portal-wall-veil, linear-gradient(180deg, rgba(6, 7, 11, 0.78) 0%, rgba(8, 8, 12, 0.74) 50%, rgba(6, 7, 11, 0.80) 100%)),
      var(--hf-stone-wall),
      var(--hf-portal-wall-identity, linear-gradient(180deg, rgba(214, 220, 235, 0.05), rgba(214, 220, 235, 0.03)));
    background-origin: padding-box, padding-box, border-box;
    background-clip: padding-box, padding-box, border-box;
    background-repeat: no-repeat, repeat, no-repeat;
    background-size: auto, 240px 144px, auto;
    background-position: center, center, center;
    box-shadow: 0 12px 28px -22px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  }

  /* Event detail header: 60% banner + 40% details on the same row from sm up.
     Plain CSS (not Tailwind utilities) so it works regardless of the compiled
     tailwind.generated.css build, which does not include arbitrary grid-cols values. */
  .hf-event-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    width: 100%;
    min-width: 0;
    align-items: start;
  }
  .hf-event-header__banner { width: 100%; min-width: 0; }
  .hf-event-header__aside { width: 100%; min-width: 0; }
  .hf-event-header__banner-mount,
  .hf-event-header__banner [data-banner-config],
  .hf-event-header__banner #event-view-banner {
    width: 100%;
    overflow: hidden;
    aspect-ratio: 16 / 9;
  }
  .hf-event-header__banner-mount svg,
  .hf-event-header__banner [data-banner-config] svg,
  .hf-event-header__banner #event-view-banner svg {
    display: block;
    width: 100%;
    height: 100%;
  }
  @media (min-width: 640px) {
    .hf-event-header {
      grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
      gap: 1.25rem;
      align-items: stretch;
    }
    .hf-event-header__banner {
      display: flex;
      flex-direction: column;
      min-height: 100%;
    }
    .hf-event-header__banner-mount,
    .hf-event-header__banner [data-banner-config],
    .hf-event-header__banner #event-view-banner {
      flex: 1 1 auto;
      min-height: 0;
      height: 100%;
      aspect-ratio: auto;
    }
  }

.hf-ui-shell .hf-ui-mcq-option {
  --hf-mcq-accent: var(--hf-ice);
  position: relative;
  display: flex;
  cursor: pointer;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.625rem;
  border: 1px solid var(--hf-hairline-strong);
  border-radius: 0.5rem;
  background-color: rgba(255, 255, 255, 0.02);
  background-image: var(--hf-card-sheen);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.hf-ui-shell .hf-ui-mcq-option:hover {
  border-color: color-mix(in srgb, var(--hf-mcq-accent) 30%, transparent);
  background-color: color-mix(in srgb, var(--hf-mcq-accent) 8%, transparent);
}

.hf-ui-shell .hf-ui-mcq-option:has(.hf-ui-mcq-option__input:checked) {
  border-color: color-mix(in srgb, var(--hf-mcq-accent) 45%, transparent);
  background-color: color-mix(in srgb, var(--hf-mcq-accent) 14%, transparent);
  box-shadow: 0 0 18px color-mix(in srgb, var(--hf-mcq-accent) 12%, transparent), var(--hf-card-inset);
}

.hf-ui-shell .hf-ui-mcq-option--locked {
  cursor: default;
  opacity: 0.93;
}

.hf-ui-shell .hf-ui-mcq-option--locked:hover {
  border-color: var(--hf-hairline-strong);
  background-color: rgba(255, 255, 255, 0.02);
}

.hf-ui-shell .hf-ui-mcq-option.is-correct {
  border-color: color-mix(in srgb, var(--hf-patina) 35%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--hf-patina) 50%, transparent);
}

.hf-ui-shell .hf-ui-mcq-option__box {
  position: relative;
  display: flex;
  height: 1.75rem;
  width: 1.75rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--hf-hairline-strong);
  border-radius: 0.375rem;
  background-color: rgba(0, 0, 0, 0.35);
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.hf-ui-shell .hf-ui-mcq-option:has(.hf-ui-mcq-option__input:checked) .hf-ui-mcq-option__box {
  border-color: color-mix(in srgb, var(--hf-mcq-accent) 90%, transparent);
  background-color: color-mix(in srgb, var(--hf-mcq-accent) 25%, transparent);
  box-shadow: inset 0 1px 8px color-mix(in srgb, var(--hf-mcq-accent) 18%, transparent);
}

.hf-ui-shell .hf-ui-mcq-option__input:focus-visible + .hf-ui-mcq-option__box {
  outline: 2px solid color-mix(in srgb, var(--hf-mcq-accent) 50%, transparent);
  outline-offset: 1px;
}

.hf-ui-shell .hf-ui-mcq-option__input:disabled + .hf-ui-mcq-option__box {
  opacity: 0.5;
}

.hf-ui-shell .hf-ui-mcq-option__check {
  height: 0.875rem;
  width: 0.875rem;
  color: color-mix(in srgb, var(--hf-mcq-accent) 40%, var(--hf-ink));
  opacity: 0;
  transform: scale(0.75);
  transition: opacity 0.2s ease-out, transform 0.2s ease-out;
}

.hf-ui-shell .hf-ui-mcq-option:has(.hf-ui-mcq-option__input:checked) .hf-ui-mcq-option__check {
  opacity: 1;
  transform: scale(1);
}

.hf-ui-shell .hf-ui-mcq-option__label {
  min-width: 0;
  flex: 1 1 0%;
  font-size: 0.75rem;
  line-height: 1.375;
  transition: color 0.2s ease;
}

.hf-ui-shell .hf-ui-mcq-option:has(.hf-ui-mcq-option__input:checked) .hf-ui-mcq-option__label {
  color: var(--hf-ink);
  font-weight: 500;
}

.hf-ui-shell .hf-ui-mcq-option__correct {
  margin-left: auto;
  display: inline-flex;
  height: 1.75rem;
  width: 1.75rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-color: color-mix(in srgb, var(--hf-patina) 20%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--hf-patina) 45%, transparent);
  color: var(--hf-patina);
}

.hf-ui-shell .hf-ui-mcq-option__correct svg {
  height: 0.875rem;
  width: 0.875rem;
}

.entity-tags-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.5rem; }
.entity-tag {
  display: inline-flex; align-items: center; padding: 0.2rem 0.55rem; font-size: 0.7rem; font-weight: 600;
  letter-spacing: 0.02em; border-radius: 9999px; white-space: nowrap;
  border: 1px solid transparent; transition: transform 0.15s ease, box-shadow 0.2s ease;
}
.entity-tag-inner { display: inline-flex; align-items: center; gap: 0.35rem; }
.entity-tag-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
  vertical-align: middle;
  box-sizing: border-box;
}
.entity-tag-icon svg {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  display: block;
  flex-shrink: 0;
  overflow: visible;
}
.entity-tag .entity-tag-icon { opacity: 0.9; }
.entity-tag .entity-tag-icon--difficulty { opacity: 1; }
.entity-tag:hover { transform: translateY(-1px); }
.entity-tag--type {
  background: linear-gradient(135deg, rgba(125, 107, 189, 0.15), rgba(63, 127, 220, 0.08));
  border-color: rgba(125, 107, 189, 0.4);
  color: #9d8ed0;
  box-shadow: 0 0 12px rgba(125, 107, 189, 0.12);
}
.entity-tag.entity-tag--type-offensive {
  background: linear-gradient(135deg, rgba(210, 75, 102, 0.15), rgba(150, 42, 65, 0.08));
  border-color: rgba(210, 75, 102, 0.45);
  color: #ee8296;
  box-shadow: 0 0 12px rgba(210, 75, 102, 0.12);
}
.entity-tag.entity-tag--type-defensive {
  background: linear-gradient(135deg, rgba(63, 127, 220, 0.15), rgba(39, 78, 160, 0.08));
  border-color: rgba(63, 127, 220, 0.45);
  color: #6db6f2;
  box-shadow: 0 0 12px rgba(63, 127, 220, 0.12);
}
.entity-tag.entity-tag--type-others {
  background: linear-gradient(135deg, rgba(125, 107, 189, 0.15), rgba(100, 80, 163, 0.08));
  border-color: rgba(125, 107, 189, 0.45);
  color: #9d8ed0;
  box-shadow: 0 0 12px rgba(125, 107, 189, 0.12);
}
.entity-tag--visibility-public {
  background: linear-gradient(135deg, rgba(63, 160, 136, 0.18), rgba(34, 85, 74, 0.08));
  border-color: rgba(63, 160, 136, 0.5);
  color: #58b8a0;
  box-shadow: 0 0 12px rgba(63, 160, 136, 0.15);
}
.entity-tag--visibility-private {
  background: linear-gradient(135deg, rgba(212, 181, 106, 0.18), rgba(146, 114, 58, 0.08));
  border-color: rgba(212, 181, 106, 0.5);
  color: #e6cf94;
  box-shadow: 0 0 12px rgba(212, 181, 106, 0.15);
}
.entity-tag--mode-team {
  background: linear-gradient(135deg, rgba(63, 127, 220, 0.18), rgba(39, 78, 160, 0.08));
  border-color: rgba(63, 127, 220, 0.5);
  color: #6db6f2;
  box-shadow: 0 0 12px rgba(63, 127, 220, 0.15);
}
.entity-tag--mode-solo {
  background: linear-gradient(135deg, rgba(125, 107, 189, 0.18), rgba(100, 80, 163, 0.08));
  border-color: rgba(125, 107, 189, 0.5);
  color: #bcb1e0;
  box-shadow: 0 0 12px rgba(125, 107, 189, 0.15);
}
.entity-tag--event-ctf {
  background: linear-gradient(135deg, rgba(210, 75, 102, 0.18), rgba(150, 42, 65, 0.08));
  border-color: rgba(210, 75, 102, 0.5);
  color: #ee8296;
  box-shadow: 0 0 12px rgba(210, 75, 102, 0.15);
}
.entity-tag--event-workshop {
  background: linear-gradient(135deg, rgba(79, 163, 200, 0.18), rgba(59, 134, 170, 0.08));
  border-color: rgba(79, 163, 200, 0.5);
  color: #74bedc;
  box-shadow: 0 0 12px rgba(79, 163, 200, 0.15);
}
.entity-tag--event-range {
  background: linear-gradient(135deg, rgba(63, 160, 136, 0.18), rgba(47, 133, 112, 0.08));
  border-color: rgba(63, 160, 136, 0.5);
  color: #58b8a0;
  box-shadow: 0 0 12px rgba(63, 160, 136, 0.15);
}
.entity-tag--event-bootcamp {
  background: linear-gradient(135deg, rgba(239, 131, 84, 0.18), rgba(201, 67, 29, 0.08));
  border-color: rgba(239, 131, 84, 0.5);
  color: #ef8354;
  box-shadow: 0 0 12px rgba(239, 131, 84, 0.15);
}
.entity-tag--category {
  background: linear-gradient(135deg, rgba(63, 160, 136, 0.12), rgba(34, 85, 74, 0.06));
  border-color: rgba(63, 160, 136, 0.35);
  color: #58b8a0;
  box-shadow: 0 0 10px rgba(63, 160, 136, 0.1);
}
.entity-tag--skill {
  background: linear-gradient(135deg, rgba(212, 181, 106, 0.12), rgba(146, 114, 58, 0.06));
  border-color: rgba(212, 181, 106, 0.35);
  color: #e6cf94;
  box-shadow: 0 0 10px rgba(212, 181, 106, 0.1);
}
.entity-tag--skill:nth-child(3n+2) {
  background: linear-gradient(135deg, rgba(63, 127, 220, 0.12), rgba(39, 78, 160, 0.06));
  border-color: rgba(63, 127, 220, 0.35);
  color: #6db6f2;
  box-shadow: 0 0 10px rgba(63, 127, 220, 0.1);
}
.entity-tag--skill:nth-child(3n+3) {
  background: linear-gradient(135deg, rgba(185, 106, 139, 0.12), rgba(126, 66, 94, 0.06));
  border-color: rgba(185, 106, 139, 0.35);
  color: #d088a4;
  box-shadow: 0 0 10px rgba(185, 106, 139, 0.1);
}
.entity-tag.entity-tag--difficulty-easy {
  background: linear-gradient(135deg, rgba(63, 160, 136, 0.18), rgba(39, 106, 91, 0.08));
  border-color: rgba(63, 160, 136, 0.5);
  color: #58b8a0;
  box-shadow: 0 0 12px rgba(63, 160, 136, 0.15);
}
.entity-tag.entity-tag--difficulty-medium {
  background: linear-gradient(135deg, rgba(212, 181, 106, 0.18), rgba(184, 148, 74, 0.08));
  border-color: rgba(212, 181, 106, 0.5);
  color: #e6cf94;
  box-shadow: 0 0 12px rgba(212, 181, 106, 0.15);
}
.entity-tag.entity-tag--difficulty-hard {
  background: linear-gradient(135deg, rgba(232, 87, 44, 0.18), rgba(162, 53, 26, 0.08));
  border-color: rgba(232, 87, 44, 0.5);
  color: #ef8354;
  box-shadow: 0 0 12px rgba(232, 87, 44, 0.15);
}
.entity-tag.entity-tag--lifecycle-live {
  border-color: rgba(88, 184, 160, 0.45);
  background: rgba(63, 160, 136, 0.12);
  color: rgb(179, 225, 212);
}

.entity-tag.entity-tag--lifecycle-ended {
  border-color: rgba(230, 207, 148, 0.4);
  background: rgba(212, 181, 106, 0.1);
  color: rgb(241, 228, 185);
}

.entity-tag.entity-tag--lifecycle-upcoming {
  border-color: rgba(125, 189, 243, 0.4);
  background: rgba(87, 159, 228, 0.1);
  color: rgb(201, 230, 251);
}

.entity-tag.entity-tag--difficulty-expert {
  background: linear-gradient(135deg, rgba(210, 75, 102, 0.18), rgba(120, 36, 54, 0.08));
  border-color: rgba(210, 75, 102, 0.5);
  color: #ee8296;
  box-shadow: 0 0 12px rgba(210, 75, 102, 0.15);
}

.hf-event-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  min-height: 1.625rem;
}
.hf-event-card-meta__participants {
  display: inline-flex;
  align-items: center;
  min-height: 1.625rem;
  line-height: 1.25rem;
}
.hf-event-card-meta__status {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  min-height: 1.625rem;
}
.hf-event-card-meta__status .entity-tag {
  vertical-align: middle;
}
.hf-event-card-meta__status .entity-tag:hover {
  transform: none;
}

.soc-card-hover {
  transition: all 0.2s ease;
}
.soc-card-hover:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 25px -8px rgba(0, 0, 0, 0.4);
}
.soc-log-entry {
  --soc-log-open-duration: 0.6s;
  --soc-log-close-duration: 0.25s;
  border-left: 2px solid rgba(255, 255, 255, 0.04);
  transition: border-color 0.15s ease;
}
.soc-log-entry:hover {
  border-left-color: rgba(210, 75, 102, 0.3);
}
.soc-log-entry .soc-log-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--soc-log-close-duration) ease-in-out;
}
.soc-log-entry.is-opening .soc-log-body {
  transition-duration: var(--soc-log-open-duration);
}
.soc-log-entry.open .soc-log-body {
  max-height: 2000px;
}
.soc-log-entry .soc-log-chevron {
  transition: transform var(--soc-log-close-duration) ease-in-out;
}
.soc-log-entry.is-opening .soc-log-chevron {
  transition-duration: var(--soc-log-open-duration);
}
.soc-log-entry.open .soc-log-chevron {
  transform: rotate(180deg);
}
.soc-verdict-card {
  position: relative;
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: none;
  transition: all 0.2s ease;
  cursor: pointer;
}
.soc-verdict-card:hover {
  transform: translateY(-2px);
  border-color: rgba(116, 190, 220, 0.35);
}
input:checked + .soc-verdict-card {
  transform: translateY(-2px);
}
.soc-verdict-card.is-selected,
input:checked + .soc-verdict-card {
  border-width: 1px;
}
.hf-ui-shell .soc-verdict-card[data-verdict="benign"].is-selected,
.hf-ui-shell label:has(input[value="benign"]:checked) .soc-verdict-card {
  border-color: rgba(63, 160, 136, 0.9) !important;
  box-shadow: inset 0 0 0 1px rgba(63, 160, 136, 0.55), 0 0 18px rgba(63, 160, 136, 0.12) !important;
}
.hf-ui-shell .soc-verdict-card[data-verdict="suspicious"].is-selected,
.hf-ui-shell label:has(input[value="suspicious"]:checked) .soc-verdict-card {
  border-color: rgba(212, 181, 106, 0.9) !important;
  box-shadow: inset 0 0 0 1px rgba(212, 181, 106, 0.55), 0 0 18px rgba(212, 181, 106, 0.12) !important;
}
.hf-ui-shell .soc-verdict-card[data-verdict="malicious"].is-selected,
.hf-ui-shell label:has(input[value="malicious"]:checked) .soc-verdict-card {
  border-color: rgba(210, 75, 102, 0.9) !important;
  box-shadow: inset 0 0 0 1px rgba(210, 75, 102, 0.55), 0 0 18px rgba(210, 75, 102, 0.12) !important;
}

.job-card > summary.job-accordion-trigger { list-style: none; flex-wrap: nowrap; }
.job-card > summary.job-accordion-trigger::-webkit-details-marker { display: none; }
.job-card > summary.job-accordion-trigger::marker { content: ""; }
.job-card > summary.job-accordion-trigger > :first-child { min-width: 0; flex: 1 1 auto; }
.job-card > summary.job-accordion-trigger .job-accordion-icon { flex-shrink: 0; align-self: center; }
.job-card[open] .job-accordion-icon { transform: rotate(180deg); }
.job-card[open] { border-color: rgba(109, 182, 242, 0.4); background: rgba(255, 255, 255, 0.1); }

.hf-ui-shell--entity .hf-entity-brand {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
  margin-top: 0.5rem;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--hf-entity-accent-border, var(--hf-hairline));
  border-radius: 0.75rem;
  background: var(--hf-entity-accent-soft, transparent);
}
.hf-entity-brand__tile {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  overflow: hidden;
  border-radius: 0.6rem;
}
.hf-entity-brand__tile--logo {
  background: #f6f3ec;
  padding: 0.3rem;
}
.hf-entity-brand__tile--logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.hf-entity-brand__tile--initials {
  background: var(--hf-entity-accent, var(--hf-ice));
  color: var(--hf-entity-on-accent, #0b0d13);
  font-family: var(--hf-font-display, inherit);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.hf-entity-brand__tile--lg {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 0.85rem;
  font-size: 1.125rem;
}
.hf-entity-brand__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
}
.hf-entity-brand__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--hf-ink, #ece7dc);
}
.hf-entity-brand__label {
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hf-entity-accent, var(--hf-ink-2));
}
.hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-entity-brand {
  justify-content: center;
  padding: 0.4rem;
}
.hf-ui-shell .hf-ui-sidebar.is-collapsed .hf-entity-brand__copy {
  display: none;
}
.hf-ui-shell.hf-ui-panel .hf-ui-shell__sidebar [data-entity-nav-list] .hf-ui-sidebar__item.is-active,
.hf-ui-shell.hf-ui-panel .hf-ui-shell__sidebar [data-entity-nav-list] .hf-ui-sidebar__item[aria-selected='true'] {
  border-color: var(--hf-entity-accent-border, var(--hf-icon-ink));
  box-shadow: inset 3px 0 0 var(--hf-entity-accent, transparent);
}
.hf-entity-login-lockup {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.1rem;
  margin-bottom: 1.5rem;
}
.hf-entity-login-lockup__platform {
  width: auto;
  height: 2.75rem;
  max-width: 9rem;
  object-fit: contain;
}
.hf-entity-login-lockup__divider {
  width: 1px;
  height: 2.5rem;
  background: var(--hf-entity-accent-border, var(--hf-hairline-strong));
}
.hf-entity-login-lockup__entity {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.75rem;
}
.hf-entity-login-lockup__name {
  overflow: hidden;
  max-width: 9rem;
  text-overflow: ellipsis;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--hf-ink, #ece7dc);
}
@media (max-width: 480px) {
  .hf-entity-login-lockup {
    flex-direction: column;
    gap: 0.75rem;
  }
  .hf-entity-login-lockup__divider {
    width: 2.5rem;
    height: 1px;
  }
}


.hf-ui-badge-art {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  width: 5rem;
  min-height: 4.5rem;
}
.hf-ui-badge-art--compact {
  width: 3.5rem;
  min-height: 3rem;
}
.hf-ui-badge-art--preview {
  width: 4rem;
  min-height: 3.5rem;
}
.hf-ui-badge-art > img {
  width: 100%;
  height: 100%;
  max-height: 6rem;
  object-fit: contain;
}

.hf-ui-metric .hf-ui-metric__count-row {
  gap: 0.625rem;
}
.hf-ui-metric .hf-ui-metric__icon {
  height: 2.25rem;
  width: 2.25rem;
  border-radius: 0.625rem;
}
.hf-ui-metric .hf-ui-metric__icon svg {
  height: 1.125rem;
  width: 1.125rem;
}
.hf-ui-metric > .hf-ui-metric__label {
  font-size: 0.75rem;
}
.hf-ui-metric .hf-ui-metric__value:is(.text-sm, .text-base, .text-lg) {
  font-size: 1.375rem;
  line-height: 1.875rem;
}
.hf-ui-metric > .hf-ui-metric__meta {
  font-size: 0.75rem;
}

.hf-ui-metric-list .hf-ui-metric {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 0.75rem;
}
.hf-ui-metric-list .hf-ui-metric > * {
  grid-row: 1;
  grid-column: 3;
  margin-top: 0;
  min-width: 0;
}
.hf-ui-metric-list .hf-ui-metric > .hf-ui-metric__label {
  grid-column: 2;
  font-size: 0.8125rem;
}
.hf-ui-metric-list .hf-ui-metric__count-row {
  display: contents;
}
.hf-ui-metric-list .hf-ui-metric__count-row > .hf-ui-metric__icon {
  grid-row: 1;
  grid-column: 1;
  height: 2.5rem;
  width: 2.5rem;
  border-radius: 0.625rem;
}
.hf-ui-metric-list .hf-ui-metric__count-row > .hf-ui-metric__icon svg {
  height: 1.25rem;
  width: 1.25rem;
}
.hf-ui-metric-list .hf-ui-metric__count-row > :not(.hf-ui-metric__icon) {
  grid-row: 1;
  grid-column: 4;
  justify-self: end;
  font-size: 1.5rem;
  line-height: 2rem;
}
.hf-ui-metric-list .hf-ui-metric > .hf-ui-metric__meta {
  font-size: 0.8125rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hf-ui-panel .hf-ui-shell__container,
.hf-ui-panel .hf-ui-topbar__inner {
  max-width: none;
}

:root {
  --hf-control-h: 2.25rem;
}
:is(
:is(input.hf-ui-input, input.hf-ui-control):not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='color']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not(.sr-only):not(.hf-ui-input--soc-row):not([autocomplete='one-time-code']):not([id='help-search']),
:is(select.hf-ui-input, select.hf-ui-control):not([multiple]),
.hf-ui-control--trigger,
.choices:not([data-type*='multiple']) .choices__inner,
.hf-custom-dropdown-trigger:not(.hf-custom-dropdown-trigger--inline),
:is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='file']):not([type='range']):not([type='color']):not([type='image']):not([type='button']):not([type='submit']):not([type='reset']):not(.sr-only):not(.hf-ui-input--soc-row):not([autocomplete='one-time-code']):not([id='help-search']),
:is(.hf-ui-shell, .page-content, [data-hf-entity-shell='1']) select:not([multiple])
):not(.hf-portal-auth *) {
  height: var(--hf-control-h);
  min-height: var(--hf-control-h);
  max-height: var(--hf-control-h);
  padding-block: 0;
  box-sizing: border-box;
}
label:has(> input:is([type='checkbox'], [type='radio'])):is(.border, [class*='border-']):not(.hf-ui-choice-card):not(.items-start):not(.hf-portal-auth *) {
  min-height: var(--hf-control-h);
  padding-block: 0;
  font-size: 0.75rem;
  line-height: 1.125rem;
  box-sizing: border-box;
}
.hf-ui-btn:not(.hf-ui-btn--xs):not(.hf-ui-btn--sm):not(.hf-ui-btn--icon-tip) {
  min-height: var(--hf-control-h);
}
.hf-ui-btn.hf-ui-btn--icon:not(.hf-ui-btn--xs):not(.hf-ui-btn--sm) {
  min-width: var(--hf-control-h);
}
:is(form, div):has(> * > :is(.hf-ui-input, .hf-ui-control, select), > :is(.hf-ui-input, .hf-ui-control, select)) > .hf-ui-btn:not(.hf-ui-btn--xs),
:is(form, div):has(> * > :is(.hf-ui-input, .hf-ui-control, select), > :is(.hf-ui-input, .hf-ui-control, select)) > * > .hf-ui-btn:only-child:not(.hf-ui-btn--xs) {
  min-height: var(--hf-control-h);
  height: var(--hf-control-h);
}

:root {
  --hf-field-label-offset: 1.25rem;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) {
  align-items: flex-start;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > * {
  align-self: flex-start;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > .hf-ui-btn:not(.hf-ui-btn--xs):not(.hf-ui-btn--icon-tip),
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > * > .hf-ui-btn:not(.hf-ui-btn--xs):not(.hf-ui-btn--icon-tip):first-child,
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > label .hf-ui-btn:not(.hf-ui-btn--xs):not(.hf-ui-btn--icon-tip) {
  min-height: var(--hf-control-h);
  height: var(--hf-control-h);
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > * > label:first-child:not(.sr-only):has(+ :is(input, select, textarea, div, span, .choices)) {
  display: block;
  height: 1rem;
  margin: 0 0 0.25rem;
  font-size: 0.75rem;
  line-height: 1rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > :not(label) > :is(.hf-ui-label-row, .hf-ui-heading-row, .justify-between):first-child:has(+ *) {
  height: 1rem;
  margin: 0 0 0.25rem;
  overflow: hidden;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > :not(label) > :is(.hf-ui-label-row, .hf-ui-heading-row, .justify-between):first-child label {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1rem;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) label .hf-ui-help {
  width: 1rem;
  height: 1rem;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > label:has(:is(select, textarea, input:not([type='checkbox']):not([type='radio']):not([type='hidden']))) {
  display: block;
  margin: 0;
  font-size: 0.75rem;
  line-height: 1rem;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > label > :is(select, textarea, input:not([type='checkbox']):not([type='radio']):not([type='hidden'])) {
  display: block;
  margin-top: 0.25rem;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > label > :not(:is(select, textarea, input:not([type='checkbox']):not([type='radio']):not([type='hidden']))):not(.hf-ui-label-row):has(:is(select, textarea, input:not([type='checkbox']):not([type='radio']):not([type='hidden']))) {
  margin-top: 0.25rem;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > label:has(:is(select, textarea, input:not([type='checkbox']):not([type='radio']):not([type='hidden']))) > .hf-ui-label-row {
  height: 1rem;
}
:is(
  .hf-ui-filter-row,
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > :is(span, a:not(.hf-ui-btn), label:has(> input:is([type='checkbox'], [type='radio']))) {
  display: inline-flex;
  align-items: center;
  min-height: var(--hf-control-h);
}
:is(
  .hf-ui-filter-row:has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > * > :is(.hf-ui-label-row, .hf-ui-heading-row, .justify-between):first-child + *, > label :is(select, textarea, input:not([type='checkbox']):not([type='radio']):not([type='hidden']))),
  :is(.flex, .inline-flex, .grid):not(.flex-col):has(> * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices)):has(> * ~ * > label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(button, .hf-ui-btn), > * > :is(button, .hf-ui-btn):first-child)
) > :not(:has(> label:first-child:not(.sr-only) + :is(input, select, textarea, div, span, .choices), > :is(.hf-ui-label-row, .hf-ui-heading-row, .justify-between):first-child + *)):not(label:has(:is(select, textarea, input:not([type='checkbox']):not([type='radio']):not([type='hidden'])))):not([class*='col-span']):not(.basis-full):not(.w-full) {
  margin-top: var(--hf-field-label-offset);
}


:is([data-hf-show-if], [data-hf-show-if-any], [data-hf-hide-if], [data-hf-hide-if-any]):is([hidden], .hidden) {
  display: none !important;
}

.hf-ui-step {
  min-inline-size: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.hf-ui-step__title {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
:is(.hf-ui-step, .hf-ui-steps__nav .hf-ui-btn):is([hidden], .hidden) {
  display: none !important;
}
.hf-ui-steps__strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-bottom: 1rem;
}
.hf-ui-steps__strip .hf-ui-tabs__item:disabled {
  cursor: default;
  opacity: 0.5;
}
.hf-ui-steps__nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--hf-hairline);
}
.hf-ui-steps__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-left: auto;
}
@media (max-width: 639px) {
  .hf-ui-steps__strip .hf-ui-tabs__item:not(.is-active) .hf-ui-tabs__label {
    display: none !important;
  }
}
.hf-ui-steps__strip .hf-ui-tabs__icon svg {
  display: block;
  width: 1rem;
  height: 1rem;
}