/*
 * AIM GEAR UI language — Calibration Rig pilot
 * Scope: touch-first home/category route only.
 * Cyan = navigation/active, amber = commit, violet = rank/meta.
 */

:root {
  --aim-rig-bg: #090d14;
  --aim-rig-panel: #111722;
  --aim-rig-panel-2: #151d29;
  --aim-rig-line: #34465e;
  --aim-rig-line-soft: rgba(114, 220, 231, .18);
  --aim-rig-cyan: #8be4eb;
  --aim-rig-cyan-strong: #67d9e4;
  --aim-rig-amber: #f2a93b;
  --aim-rig-amber-soft: #ffd28a;
  --aim-rig-text: #f4f7fb;
  --aim-rig-muted: #aeb9c6;
  --aim-rig-cut: 10px;
  --aim-rig-fast: 140ms;
  --aim-rig-settle: 220ms;
}

@media (max-width: 1180px) {
  body.home .mobile-action-deck,
  body.category-page .category-explorer-layout {
    --aim-rig-focus: 0 0 0 3px rgba(139, 228, 235, .25);
  }

  body.home .mad-card,
  body.home .mobile-route-library,
  body.category-page .filter-bar2,
  body.category-page .fb-panel,
  body.category-page .item-card,
  body.category-page .compare-tray {
    border-color: var(--aim-rig-line) !important;
    background-color: var(--aim-rig-panel) !important;
    box-shadow: 0 14px 28px rgba(0, 0, 0, .28) !important;
  }

  body.home .mad-card,
  body.category-page .filter-bar2,
  body.category-page .item-card,
  body.category-page .compare-tray {
    border-radius: 0 !important;
    clip-path: polygon(
      var(--aim-rig-cut) 0,
      100% 0,
      100% calc(100% - var(--aim-rig-cut)),
      calc(100% - var(--aim-rig-cut)) 100%,
      0 100%,
      0 var(--aim-rig-cut)
    );
  }

  body.home .mad-card:focus-visible,
  body.home .mad-nav button:focus-visible,
  body.home .mobile-route-library a:focus-visible,
  body.category-page :is(button, a, input, select, .chip):focus-visible {
    outline: 2px solid var(--aim-rig-cyan) !important;
    outline-offset: 3px;
  }

  body.category-page .filter-bar2::before,
  body.category-page .item-card::before {
    background: linear-gradient(
      90deg,
      var(--aim-rig-cyan) 0 34%,
      var(--aim-rig-amber) 34% 43%,
      var(--aim-rig-line) 43% 100%
    ) !important;
    box-shadow: none !important;
  }

  body.category-page .filter-bar2::after,
  body.category-page .item-card::after {
    box-shadow: none !important;
  }

  body.category-page .fb-search,
  body.category-page .fb-select {
    border-color: var(--aim-rig-line) !important;
    border-radius: 4px !important;
    color: var(--aim-rig-text) !important;
    background: #0a0f18 !important;
    box-shadow: none !important;
  }

  body.category-page .fb-search:focus,
  body.category-page .fb-select:focus {
    border-color: var(--aim-rig-cyan) !important;
    box-shadow: inset 3px 0 0 var(--aim-rig-cyan) !important;
  }

  body.category-page .fb-count {
    border-color: rgba(242, 169, 59, .42) !important;
    border-radius: 3px !important;
    color: var(--aim-rig-amber-soft) !important;
    background: rgba(242, 169, 59, .08) !important;
    box-shadow: none !important;
  }

  body.category-page .fb-toggle {
    border-color: var(--aim-rig-cyan) !important;
    border-radius: 3px !important;
    color: var(--aim-rig-cyan) !important;
    background: rgba(139, 228, 235, .06) !important;
    box-shadow: inset 0 -2px 0 rgba(139, 228, 235, .55) !important;
  }

  body.category-page .fb-toggle:active {
    transform: translateY(1px);
    background: rgba(139, 228, 235, .12) !important;
  }

  body.category-page .fg {
    border-color: rgba(114, 220, 231, .17) !important;
    border-radius: 4px !important;
    background: #0e141e !important;
    box-shadow: none !important;
  }

  body.category-page .fg-label {
    color: var(--aim-rig-cyan-strong) !important;
    font-family: var(--gx-disp, system-ui, sans-serif);
    letter-spacing: .08em;
  }

  body.category-page .chip {
    position: relative;
    border-color: var(--aim-rig-line) !important;
    border-radius: 0 !important;
    color: #d7dee8 !important;
    background: var(--aim-rig-panel-2) !important;
    box-shadow: none !important;
    clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
    transition:
      transform var(--aim-rig-fast) ease,
      color var(--aim-rig-fast) ease,
      background-color var(--aim-rig-fast) ease,
      border-color var(--aim-rig-fast) ease !important;
  }

  body.category-page .chip:active {
    transform: scale(.97);
  }

  body.category-page .chip.active {
    border-color: var(--aim-rig-cyan) !important;
    color: #071116 !important;
    background: var(--aim-rig-cyan) !important;
    box-shadow: inset 0 -3px 0 rgba(0, 82, 92, .28) !important;
  }

  body.category-page .chip.active::before {
    content: "";
    width: 5px;
    height: 5px;
    margin-right: 7px;
    display: inline-block;
    background: #075866;
    transform: rotate(45deg);
  }

  body.category-page .item-card {
    --aim-rig-cut: 12px;
    overflow: hidden;
    background:
      linear-gradient(180deg, rgba(var(--rar, 114, 220, 231), .035), transparent 25%),
      var(--aim-rig-panel) !important;
    transition:
      transform var(--aim-rig-fast) ease,
      border-color var(--aim-rig-fast) ease !important;
  }

  body.category-page .item-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 16px 30px rgba(0, 0, 0, .32) !important;
  }

  body.category-page .item-card:active {
    transform: scale(.995) !important;
  }

  body.category-page .item-card .item-image {
    border-bottom: 1px solid var(--aim-rig-line) !important;
    background:
      linear-gradient(rgba(114, 220, 231, .045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(114, 220, 231, .045) 1px, transparent 1px),
      #0a0f18 !important;
    background-size: 18px 18px !important;
  }

  body.category-page .item-card .item-image::before {
    display: none !important;
  }

  body.category-page .item-card .item-brand {
    color: var(--aim-rig-cyan-strong) !important;
    letter-spacing: .12em;
  }

  body.category-page .item-card .item-name {
    color: var(--aim-rig-text) !important;
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
  }

  body.category-page .item-card .price-pill {
    border-color: rgba(242, 169, 59, .34) !important;
    border-radius: 3px !important;
    color: var(--aim-rig-amber-soft) !important;
    background: rgba(242, 169, 59, .055) !important;
  }

  body.category-page .item-card .spec-row,
  body.category-page .item-card .cross-sell-section {
    border-color: rgba(174, 185, 198, .12) !important;
    border-radius: 3px !important;
    background: #0c111a !important;
    box-shadow: none !important;
  }

  body.category-page .item-card .cross-sell-tag {
    border-radius: 2px !important;
  }

  body.category-page .item-card .buy-btn {
    border-color: var(--aim-rig-amber) !important;
    border-radius: 0 !important;
    color: #181005 !important;
    background: var(--aim-rig-amber) !important;
    box-shadow: inset 0 -3px 0 rgba(91, 52, 0, .28) !important;
    clip-path: polygon(9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%, 0 9px);
  }

  body.category-page .item-card .buy-btn::after {
    display: none !important;
  }

  body.category-page .item-card .buy-btn:active {
    transform: translateY(1px) scale(.995);
  }

  body.category-page .item-image :is(.fav-btn, .cmp-btn) {
    border-color: var(--aim-rig-line) !important;
    border-radius: 2px !important;
    background: rgba(9, 13, 20, .94) !important;
    box-shadow: none !important;
  }

  body.category-page .item-image .cmp-btn {
    color: var(--aim-rig-cyan) !important;
  }

  body.category-page .item-image .cmp-btn.is-cmp {
    border-color: var(--aim-rig-cyan) !important;
    color: #061116 !important;
    background: var(--aim-rig-cyan) !important;
    box-shadow: inset 0 -3px 0 rgba(0, 82, 92, .28) !important;
  }

  body.category-page .item-image .fav-btn {
    color: var(--aim-rig-amber-soft) !important;
  }

  body.category-page .tier-badge,
  body.category-page .apex-badge {
    border-radius: 2px !important;
    box-shadow: none !important;
  }

  body.category-page .compare-tray {
    --aim-rig-cut: 10px;
    border-color: var(--aim-rig-cyan) !important;
    background: rgba(12, 17, 26, .98) !important;
    box-shadow: 0 16px 36px rgba(0, 0, 0, .48) !important;
  }

  body.category-page .compare-tray::before {
    content: "";
    position: absolute;
    top: 0;
    left: 10px;
    right: 26%;
    height: 2px;
    background: linear-gradient(90deg, var(--aim-rig-cyan), var(--aim-rig-amber));
  }

  body.category-page .compare-tray .ct-label {
    color: var(--aim-rig-cyan) !important;
    font-family: var(--gx-disp, system-ui, sans-serif);
  }

  body.category-page .compare-tray .ct-item {
    border-color: var(--aim-rig-line) !important;
    border-radius: 2px !important;
    background: #080c12 !important;
  }

  body.category-page .compare-tray .ct-item::before {
    content: counter(aim-compare-slot, decimal-leading-zero);
    position: absolute;
    left: 3px;
    bottom: 2px;
    z-index: 2;
    color: var(--aim-rig-cyan);
    font: 800 8px/1 ui-monospace, monospace;
  }

  body.category-page .compare-tray .ct-items {
    counter-reset: aim-compare-slot;
  }

  body.category-page .compare-tray .ct-item {
    counter-increment: aim-compare-slot;
  }

  body.category-page .compare-tray .ct-go {
    border: 1px solid var(--aim-rig-amber) !important;
    border-radius: 0 !important;
    color: #181005 !important;
    background: var(--aim-rig-amber) !important;
    box-shadow: inset 0 -3px 0 rgba(91, 52, 0, .28) !important;
    clip-path: polygon(7px 0, 100% 0, 100% calc(100% - 7px), calc(100% - 7px) 100%, 0 100%, 0 7px);
  }
}

@media (max-width: 699px) {
  body.home .mobile-action-deck {
    padding-top: .9rem;
    background:
      linear-gradient(rgba(114, 220, 231, .03) 1px, transparent 1px),
      linear-gradient(90deg, rgba(114, 220, 231, .03) 1px, transparent 1px);
    background-size: 18px 18px;
  }

  body.home .mad-kicker {
    color: var(--aim-rig-cyan);
  }

  body.home .mad-head {
    align-items: center;
  }

  body.home .mad-nav {
    gap: 5px;
    padding: 0;
  }

  body.home .mad-nav button {
    width: 30px;
    height: 30px;
    min-width: 30px;
    border: 1px solid var(--aim-rig-line);
    border-radius: 1px;
    color: var(--aim-rig-muted);
    background: #0c111a;
    font: 900 9px/1 ui-monospace, monospace;
    transition:
      color var(--aim-rig-fast) ease,
      border-color var(--aim-rig-fast) ease,
      background-color var(--aim-rig-fast) ease,
      transform var(--aim-rig-fast) ease;
  }

  body.home .mad-nav button:nth-child(1)::after { content: "01"; }
  body.home .mad-nav button:nth-child(2)::after { content: "02"; }
  body.home .mad-nav button:nth-child(3)::after { content: "03"; }

  body.home .mad-nav button::before {
    inset: auto 4px 3px !important;
    height: 2px;
    border-radius: 0;
    background: var(--aim-rig-line);
    box-shadow: none !important;
  }

  body.home .mad-nav button.is-active {
    border-color: var(--aim-rig-cyan);
    color: #071116;
    background: var(--aim-rig-cyan);
  }

  body.home .mad-nav button.is-active::before {
    background: #075866;
  }

  body.home .mad-nav button:active {
    transform: scale(.94);
  }

  body.home .mad-card {
    --aim-rig-cut: 12px;
    flex-basis: calc(100% - .4rem);
    border-color: var(--aim-rig-line) !important;
    background:
      linear-gradient(180deg, rgba(114, 220, 231, .035), transparent 42%),
      var(--aim-rig-panel) !important;
    box-shadow: 0 14px 26px rgba(0, 0, 0, .3) !important;
    transition:
      transform var(--aim-rig-fast) ease,
      border-color var(--aim-rig-fast) ease !important;
  }

  body.home .mad-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 2px;
    background: linear-gradient(90deg, var(--aim-rig-cyan) 0 35%, var(--aim-rig-amber) 35% 45%, var(--aim-rig-line) 45%);
  }

  body.home .mad-card:active {
    transform: scale(.985);
  }

  body.home .mad-card.is-primary {
    border-color: rgba(139, 228, 235, .64) !important;
    background:
      linear-gradient(180deg, rgba(114, 220, 231, .07), transparent 45%),
      var(--aim-rig-panel) !important;
  }

  body.home .mad-step {
    color: var(--aim-rig-cyan);
  }

  body.home .mad-icon {
    width: 46px;
    height: 46px;
    border-color: var(--aim-rig-line);
    border-radius: 2px;
    color: var(--aim-rig-cyan);
    background: #0a0f18;
    box-shadow: inset 0 -3px 0 rgba(139, 228, 235, .08);
  }

  body.home .mad-card > span:not(.mad-step):not(.mad-icon) {
    color: var(--aim-rig-muted);
  }

  body.home .mad-card > b {
    border: 1px solid var(--aim-rig-cyan);
    border-radius: 0;
    color: #061116;
    background: var(--aim-rig-cyan);
    box-shadow: inset 0 -3px 0 rgba(0, 82, 92, .25);
    clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  }

  body.home .mad-card.is-primary > b {
    border-color: var(--aim-rig-amber);
    color: #181005;
    background: var(--aim-rig-amber);
    box-shadow: inset 0 -3px 0 rgba(91, 52, 0, .28);
  }

  body.home .mad-hint {
    color: rgba(174, 185, 198, .76);
  }

  body.home .mobile-route-library {
    border-radius: 2px;
    background: #0c111a !important;
    box-shadow: none !important;
  }

  body.home .mobile-route-library summary::after {
    color: var(--aim-rig-cyan);
  }

  body.home .mobile-route-library a {
    border: 1px solid transparent;
    border-radius: 2px;
    background: var(--aim-rig-panel-2);
  }

  body.home .mobile-route-library a:active {
    border-color: var(--aim-rig-cyan);
    transform: scale(.98);
  }

  body.home .mobile-route-library a i {
    color: var(--aim-rig-cyan);
  }

  body.category-page .fb-sheet-backdrop {
    background: rgba(3, 6, 10, .8);
    backdrop-filter: none;
  }

  body.category-page .fb-panel,
  body.category-page .fb-panel.open {
    border-color: var(--aim-rig-cyan) !important;
    border-radius: 4px 4px 0 0 !important;
    background:
      linear-gradient(90deg, var(--aim-rig-cyan) 0 34%, var(--aim-rig-amber) 34% 43%, var(--aim-rig-line) 43%) top / 100% 2px no-repeat,
      var(--aim-rig-bg) !important;
    box-shadow: 0 -18px 42px rgba(0, 0, 0, .64) !important;
    transition:
      transform var(--aim-rig-settle) cubic-bezier(.16, 1, .3, 1),
      opacity var(--aim-rig-fast) ease,
      visibility var(--aim-rig-settle) ease !important;
  }

  body.category-page .fb-sheet-head,
  body.category-page .fb-panel .fg-actions {
    border-color: rgba(114, 220, 231, .16) !important;
    background: rgba(9, 13, 20, .98) !important;
    backdrop-filter: none !important;
  }

  body.category-page .fb-sheet-close {
    border-color: var(--aim-rig-line);
    border-radius: 2px;
    color: var(--aim-rig-cyan);
    background: var(--aim-rig-panel-2);
  }

  body.category-page .fb-sheet-title {
    color: var(--aim-rig-text);
  }

  body.category-page .fb-sheet-status {
    color: var(--aim-rig-cyan);
  }

  body.category-page .fb-clear,
  body.category-page .fb-sheet-apply {
    border-radius: 0 !important;
  }

  body.category-page .fb-clear {
    border-color: var(--aim-rig-line) !important;
    color: var(--aim-rig-muted) !important;
    background: var(--aim-rig-panel-2) !important;
  }

  body.category-page .fb-sheet-apply {
    border: 1px solid var(--aim-rig-amber) !important;
    color: #181005 !important;
    background: var(--aim-rig-amber) !important;
    box-shadow: inset 0 -3px 0 rgba(91, 52, 0, .28);
    clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  }
}

@media (min-width: 700px) and (max-width: 1180px) {
  body.category-page .category-explorer-layout {
    gap: 1rem 1.25rem;
  }

  body.category-page .category-explorer-layout > .filter-bar2 {
    border-color: var(--aim-rig-cyan) !important;
    background:
      linear-gradient(180deg, rgba(114, 220, 231, .04), transparent 35%),
      var(--aim-rig-panel) !important;
  }

  body.category-page .category-explorer-layout > #item-grid {
    border-left: 1px solid rgba(114, 220, 231, .12);
    padding-left: 1rem;
  }

  body.category-page .fb-panel.open {
    scrollbar-color: var(--aim-rig-cyan) #0a0f18;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.home .mad-card,
  body.home .mad-nav button,
  body.home .mobile-route-library a,
  body.category-page .chip,
  body.category-page .fb-toggle,
  body.category-page .item-card,
  body.category-page .item-card .buy-btn,
  body.category-page .fb-panel,
  body.category-page .fb-panel.open,
  body.category-page .fb-sheet-backdrop {
    transition: none !important;
    animation: none !important;
  }
}
