/* Orbit hover: two lines, gold and white, circle the frame of an item you browse and pick
   (rules: .claude/skills/noe-eclipse-ui/SKILL.md, section 3). main.py injects this into every page.

   Cost: nothing runs at rest. Only the hovered item animates one angle, and only its border is
   repainted. Touch screens never start it (a tap would leave it stuck), and reduced motion keeps
   the two lines still.

   It is the hover for every item in a list: cards, rows, menu and rail entries, search results.
   It replaces washes, lifts and side lines. Add `noe-orbit` to a new item, or add its class to the
   list below. Not for buttons, tabs, or clip-path plates, whose cut edge a border can't follow.
   The frame needs a border all round (transparent is fine): the effect paints on it.
   `!important` because page rules with a `border` shorthand (often under an id) reset
   border-image, and this is a passing hover state.

   The same file turns gear icons while their control is hovered or focused (skill section 3). */

@property --noe-orbit-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@keyframes noe-orbit {
  to { --noe-orbit-angle: 360deg; }
}

@media (prefers-reduced-motion: reduce) {
  @keyframes noe-orbit {
    to { --noe-orbit-angle: 0deg; }
  }
}

@media (hover: hover) {
  :is(
    .noe-orbit,
    /* Character sheet: inventory, spells, abilities, combat, progression */
    .inv2-card, .inv2-part-card, .inv2-pick-row,
    .sl-spell-card, .sl-browser-card, .sl-school-picker-card, .sl-preset-row,
    .noe-ability-card, .abi-item, .combat-entry, .cd-arc-card,
    .acquisition-click-card, .progression-option, .investigation-clue-card,
    /* My Library */
    .library-card, .library-folder-item, .assets-card,
    /* Studio managers */
    .am-list-row, .am-app-card, .tm-spell, .spell-card, .sm-entity-row-btn, .noe-ie-row-btn, .cm-item,
    /* Character manager and wiki */
    .cm-card, .cm-shared-recipe-card, .om-card,
    .wiki-category-card, .wiki-page-card, .wiki-search-result,
    /* Hubs and older pages (.home-card and plain .tile are panels, not items) */
    .app-card, a.tile, .ability-item, .assistant-card, .ticket-card, .type-card,
    /* Spell creator and proposals */
    .qs-category, .qs-school, .qs-effect, .qs-upgrade, .proposal-record, .quiz-option,
    /* Menus, rails and search results */
    .noe-nav-item, .noe-search-result, .nav-picker-result, .grimoire-context-menu button,
    .gauth-menu-link, .gauth-menu-btn, .atlas-search-result, .layer-toggle-btn,
    .rail a, .library-sidebar a, .ac-layout nav a
    , .mm-row, .sp-pack-row, .sp-result, .category-card, a.card, button.card, [role="button"].card,
    .noe-ie-row-btn, .ev3-picker-results > button, .slash-menu button,
    .table-context-menu button, .image-context-menu button,
    .editor-right-click-menu button, .library-folder-menu button,
    .inv2-add-choice
    , .ability-item, .proposal-record, .cm-item, .inv2-radio-list > button,
    .topic, .library-record, .item,
    .page-item, .ev3-list > button, .im-add__option, .wiki-nav-link,
    .nature-cell, .qs-preset, a.file-chip,
    .page-table tbody tr, .ac-shell tbody tr, .noe-list-table tbody tr, .mm-tree-row, .mm-context button,
    :is(.gm-override-menu, .cs35-level-popover, .cs35-level-target-menu,
        .combat-act-menu, .sl-add-popover, .cs35-option-popover,
        .cs35-nature-picker, .cs35-context-menu) :is(.btn, button)
  ):is(:hover, :focus-visible),
  /* The keyboard-highlighted search result counts as hovered. */
  :is(.page-table,.noe-list-table) tbody tr:focus-within,
  .ac-shell tbody tr:focus-within,
  .noe-search-result.selected {
    --noe-orbit-track: rgba(201, 163, 95, .32);
    border-image: conic-gradient(
      from var(--noe-orbit-angle),
      var(--noe-orbit-track) 0 30%,
      var(--noe-gold-bright) 37%,
      #fff3d6 40%,
      var(--noe-orbit-track) 45% 80%,
      #ffffff 88%,
      var(--noe-gold-bright) 90%,
      var(--noe-orbit-track) 95%
    ) 1 !important;
    animation: noe-orbit 2.6s linear infinite !important;
  }
}

/* Collapsed tables do not paint border-image on a row. Paint the same orbit
   once around the row, without changing cell widths or drawing one per cell. */
:is(.page-table,.noe-list-table) tbody tr, .ac-shell tbody tr { position: relative; }
@media (hover: hover) {
  :is(.page-table,.noe-list-table) tbody tr:is(:hover,:focus-within)::after,
  .ac-shell tbody tr:is(:hover,:focus-within)::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid transparent;
    border-image: inherit;
    pointer-events: none;
  }
}

/* Gear icons spin while their button or link is hovered or keyboard-focused. */
@keyframes noe-gear-spin {
  to { transform: rotate(360deg); }
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  :is(button, a, summary, label, [role="button"], .btn):not(:disabled, [aria-disabled="true"]):is(:hover, :focus-visible)
    :is(.fa-gear, .fa-gears, .fa-cog, .fa-cogs) {
    display: inline-block;
    animation: noe-gear-spin 2.4s linear infinite;
  }
}
