/* V0.41.7 Wallet key locator.
   This layer is deliberately scoped to the KEY panel. The five other Wallet
   signal panels keep the frozen compact layout supplied by css/style.css. */

.aka-wallet-drawer-inner.is-key {
  overflow:visible;
  z-index:2;
}

.aka-wallet-drawer-inner.is-key-silver { --aka-key-menu-rgb:205,228,244; }
.aka-wallet-drawer-inner.is-key-gold { --aka-key-menu-rgb:255,198,53; }
.aka-wallet-drawer-inner.is-key-red { --aka-key-menu-rgb:255,45,85; }
.aka-wallet-drawer-inner.is-key-blue { --aka-key-menu-rgb:55,174,255; }

.aka-wallet-drawer-inner.is-key-silver,
.aka-wallet-drawer-inner.is-key-gold,
.aka-wallet-drawer-inner.is-key-red,
.aka-wallet-drawer-inner.is-key-blue {
  --aka-drawer-rgb:var(--aka-key-menu-rgb);
  background:
    radial-gradient(circle at 12% 0%,rgba(var(--aka-key-menu-rgb),.13),transparent 45%),
    radial-gradient(circle at 100% 100%,rgba(var(--aka-key-menu-rgb),.055),transparent 46%),
    linear-gradient(155deg,rgba(18,14,10,.99),rgba(8,8,7,.995) 58%,rgba(4,5,5,.998));
}

.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key-grid {
  margin:0 0 .30rem;
}

.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key {
  cursor:pointer;
  min-height:2.75rem;
}

.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key.is-empty {
  cursor:default;
}

.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key.is-selected {
  opacity:1;
  filter:none;
  border-color:rgba(var(--aka-key-rgb),.92);
  box-shadow:
    0 0 0 1px rgba(2,2,2,.94),
    0 0 0 2px rgba(var(--aka-key-rgb),.30),
    0 0 15px rgba(var(--aka-key-rgb),.29),
    inset 0 0 12px rgba(var(--aka-key-rgb),.075);
}

.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer {
  position:relative;
  z-index:4;
  grid-template-columns:4.70rem minmax(0,1fr) 4.70rem;
  gap:.30rem;
}

.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-heading {
  font-size:.60rem;
  margin-bottom:.30rem;
}

.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer-status {
  color:rgba(232,213,183,.54);
  font:600 .60rem/1.25 'Special Elite',monospace;
  letter-spacing:.065em;
}

.aka-wallet-key-resolved {
  display:block;
  width:auto;
  min-width:0;
  overflow:hidden;
  padding-inline-end:.34rem;
  color:rgba(var(--aka-drawer-rgb),.54);
  font:600 .58rem/1.1 'Special Elite',monospace;
  letter-spacing:.04em;
  text-align:end;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.aka-wallet-key-resolved > span {
  color:rgba(var(--aka-drawer-rgb),.72);
}

.aka-wallet-key-track-menu {
  --aka-key-menu-rgb:191,105,53;
  --aka-key-track-visible-rows:5;
  --aka-key-track-row-height:2.75rem;
  position:absolute;
  z-index:6;
  top:-1px;
  right:calc(100% + .62rem);
  bottom:auto;
  left:auto;
  display:flex;
  width:16rem;
  min-width:16rem;
  max-height:calc(var(--aka-key-track-visible-rows) * var(--aka-key-track-row-height));
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(var(--aka-key-menu-rgb),.42);
  border-radius:7px;
  background:
    radial-gradient(circle at 100% 0%,rgba(var(--aka-key-menu-rgb),.10),transparent 42%),
    linear-gradient(90deg,rgba(var(--aka-key-menu-rgb),.055),transparent 36%),
    linear-gradient(180deg,rgba(13,12,10,.995),rgba(3,4,4,.998));
  box-shadow:
    0 16px 34px rgba(0,0,0,.68),
    0 0 20px rgba(var(--aka-key-menu-rgb),.12),
    inset 0 1px 0 rgba(255,255,255,.035);
  transform-origin:top right;
  animation:akaWalletKeyMenuReveal .22s cubic-bezier(.22,1,.36,1) both;
}

.aka-wallet-key-track-menu.is-silver { --aka-key-menu-rgb:205,228,244; }
.aka-wallet-key-track-menu.is-gold { --aka-key-menu-rgb:255,198,53; }
.aka-wallet-key-track-menu.is-red { --aka-key-menu-rgb:255,45,85; }
.aka-wallet-key-track-menu.is-blue { --aka-key-menu-rgb:55,174,255; }

@keyframes akaWalletKeyMenuReveal {
  from { opacity:0;transform:translateX(8px) scale(.985); }
  to { opacity:1;transform:none; }
}

.aka-wallet-key-track-options {
  min-height:0;
  max-height:calc(var(--aka-key-track-visible-rows) * var(--aka-key-track-row-height));
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  touch-action:pan-y;
}

.aka-wallet-key-track-options::-webkit-scrollbar { width:4px; }
.aka-wallet-key-track-options::-webkit-scrollbar-track { background:rgba(255,255,255,.018); }
.aka-wallet-key-track-options::-webkit-scrollbar-thumb {
  border-radius:999px;
  background:rgba(var(--aka-key-menu-rgb),.38);
}

.aka-wallet-key-track-option {
  position:relative;
  display:grid;
  width:100%;
  min-height:var(--aka-key-track-row-height);
  box-sizing:border-box;
  grid-template-columns:.96rem minmax(0,1fr);
  align-items:center;
  gap:.52rem;
  padding:.43rem .58rem;
  border:0;
  border-bottom:1px solid rgba(var(--aka-key-menu-rgb),.11);
  background:transparent;
  color:rgba(232,213,183,.70);
  text-align:start;
}

.aka-wallet-key-track-option:last-child { border-bottom:0; }

button.aka-wallet-key-track-option {
  cursor:pointer;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease;
}

button.aka-wallet-key-track-option::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:2px;
  background:linear-gradient(transparent,rgba(var(--aka-key-menu-rgb),.92),transparent);
  opacity:.52;
}

button.aka-wallet-key-track-option:hover,
button.aka-wallet-key-track-option:focus-visible {
  outline:none;
  background:linear-gradient(90deg,rgba(var(--aka-key-menu-rgb),.14),rgba(var(--aka-key-menu-rgb),.025));
  color:rgba(var(--aka-key-menu-rgb),1);
  box-shadow:inset 0 0 14px rgba(var(--aka-key-menu-rgb),.045);
}

.aka-wallet-key-track-option.is-unavailable {
  cursor:default;
  opacity:.48;
  filter:saturate(.54);
}

.aka-wallet-key-track-option-icon {
  display:grid;
  width:.96rem;
  height:.96rem;
  place-items:center;
  color:rgba(var(--aka-key-menu-rgb),.92);
}

.aka-wallet-key-track-option-icon svg {
  width:.76rem;
  height:.76rem;
  stroke-width:2;
  filter:drop-shadow(0 0 4px rgba(var(--aka-key-menu-rgb),.58));
}

.aka-wallet-key-track-option-copy {
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:.15rem;
}

.aka-wallet-key-track-option-copy strong,
.aka-wallet-key-track-option-copy small {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.aka-wallet-key-track-option-copy strong {
  color:inherit;
  font:700 .66rem/1.16 'Special Elite',monospace;
  letter-spacing:.055em;
}

.aka-wallet-key-track-option-copy small {
  color:rgba(232,225,210,.43);
  font:600 .56rem/1.2 'Space Grotesk',sans-serif;
  letter-spacing:.045em;
}

.aka-wallet-key-track-empty {
  display:grid;
  min-height:2.8rem;
  place-items:center;
  padding:.55rem;
  color:rgba(var(--aka-key-menu-rgb),.54);
  font:600 .56rem/1.3 'Special Elite',monospace;
  letter-spacing:.08em;
  text-align:center;
}

/* TRACK is one semantic command. Only its radar face is boxed; the label sits
   beside it and never appears as a hover tooltip or widens the square itself. */
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command {
  position:relative;
  display:inline-flex;
  min-width:0;
  min-height:2.75rem;
  align-items:center;
  justify-self:start;
  gap:.34rem;
  padding:0;
  border:0;
  background:none;
  color:rgba(var(--aka-drawer-rgb),.76);
  cursor:pointer;
}

.aka-wallet-drawer-inner.is-key .aka-wallet-track-command.is-disabled {
  opacity:.34;
  filter:saturate(.20) brightness(.72);
  cursor:default;
}

.aka-wallet-drawer-inner.is-key .aka-wallet-track-face {
  position:relative;
  display:grid;
  width:1.78rem;
  min-width:1.78rem;
  height:1.78rem;
  min-height:1.78rem;
  place-items:center;
  padding:.24rem;
  border:1px solid rgba(var(--aka-drawer-rgb),.34);
  border-radius:.32rem;
  background:linear-gradient(180deg,rgba(var(--aka-drawer-rgb),.09),rgba(4,5,5,.92));
  box-shadow:inset 0 0 8px rgba(var(--aka-drawer-rgb),.035);
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease,transform .14s ease;
}

.aka-wallet-drawer-inner.is-key .aka-wallet-track-command.is-ready:hover .aka-wallet-track-face,
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command.is-ready:focus-visible .aka-wallet-track-face {
  border-color:rgba(var(--aka-drawer-rgb),.72);
  background:linear-gradient(180deg,rgba(var(--aka-drawer-rgb),.14),rgba(4,5,5,.94));
  box-shadow:0 0 12px rgba(var(--aka-drawer-rgb),.18),inset 0 0 9px rgba(var(--aka-drawer-rgb),.06);
}

.aka-wallet-drawer-inner.is-key .aka-wallet-track-command:focus-visible {
  outline:1px solid rgba(var(--aka-drawer-rgb),.62);
  outline-offset:3px;
}

.aka-wallet-drawer-inner.is-key .aka-wallet-track-command.is-ready:active .aka-wallet-track-face {
  transform:translateY(1px) scale(.98);
}

.aka-wallet-drawer-inner.is-key .aka-wallet-track-face .aka-wallet-track-signal {
  width:1.18rem;
  height:1.18rem;
}

.aka-wallet-track-command-label {
  color:rgba(var(--aka-drawer-rgb),.78);
  font:600 .58rem/1 'Special Elite',monospace;
  letter-spacing:.07em;
  white-space:nowrap;
}

@media (max-width:768px) {
  .aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key {
    overflow:hidden;
  }

  .aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer {
    grid-template-columns:4.42rem minmax(0,1fr) 4.42rem;
    gap:.18rem;
  }

  .aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-face {
    width:2.02rem;
    min-width:2.02rem;
    height:2.02rem;
    min-height:2.02rem;
  }

  .aka-wallet-key-track-menu {
    --aka-key-track-visible-rows:2;
    --aka-key-track-row-height:2.75rem;
    top:auto;
    right:.58rem;
    bottom:1.96rem;
    left:.58rem;
    width:auto;
    min-width:0;
    max-height:calc(var(--aka-key-track-visible-rows) * var(--aka-key-track-row-height));
    transform-origin:bottom center;
    animation-name:akaWalletKeyMenuRevealMobile;
  }

  .aka-wallet-key-track-options {
    max-height:calc(var(--aka-key-track-visible-rows) * var(--aka-key-track-row-height));
  }

  .aka-wallet-key-track-option {
    padding:.40rem .48rem;
  }

  .aka-wallet-key-track-option-copy strong { font-size:.64rem; }
  .aka-wallet-key-track-option-copy small { font-size:.56rem; }
}

@media (max-width:360px) {
  .aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer {
    grid-template-columns:4.28rem minmax(0,1fr) 4.28rem;
  }

  .aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-command {
    gap:.24rem;
  }

  .aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-face {
    width:1.92rem;
    min-width:1.92rem;
    height:1.92rem;
    min-height:1.92rem;
  }

  .aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-command-label {
    font-size:.51rem;
    letter-spacing:.045em;
  }
}

@keyframes akaWalletKeyMenuRevealMobile {
  from { opacity:0;transform:translateY(7px) scale(.985); }
  to { opacity:1;transform:none; }
}

@media (prefers-reduced-motion:reduce) {
  .aka-wallet-key-track-menu { animation:none !important; }
}