/* D24 Apple Spotlight island — ObsidianUI-inspired, vanilla CSS
   Aura: teal #1ABC9C · navy #2F4FA0 · CTA cyan #00ADEF · black text on cyan */
.d24-spotlight-trigger{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;min-width:42px;padding:0;
  border-radius:999px;border:0;
  background:transparent;color:var(--forest,#1C433A);
  cursor:pointer;flex-shrink:0;box-sizing:border-box;
  font-family:Outfit,system-ui,sans-serif;font-size:12px;font-weight:600;
  transition:background .2s,border-color .2s,color .2s;
}
.d24-spotlight-trigger:hover{
  background:var(--mint,#E7F3EE);
}
.d24-spotlight-trigger:focus-visible{
  outline:2px solid #1ABC9C;outline-offset:2px;
}
.d24-spotlight-trigger svg{flex-shrink:0;}
body.d24-home .header:not(.is-solid) .d24-spotlight-trigger,
body.d24-home header.header:not(.is-solid) .d24-spotlight-trigger,
body.d24-home .site-header:not(.is-solid) .d24-spotlight-trigger{
  color:var(--ivory,#FFFCF6);
}
body.d24-home .header:not(.is-solid) .d24-spotlight-trigger:hover,
body.d24-home header.header:not(.is-solid) .d24-spotlight-trigger:hover,
body.d24-home .site-header:not(.is-solid) .d24-spotlight-trigger:hover{
  background:rgba(255,252,246,.14);
}

.d24-spotlight-root{
  position:fixed;inset:0;z-index:200;
  display:flex;align-items:flex-start;justify-content:center;
  padding:12vh 16px 24px;
  background:rgba(13,31,27,.42);
  backdrop-filter:blur(10px) saturate(1.15);
  -webkit-backdrop-filter:blur(10px) saturate(1.15);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .22s ease,visibility 0s linear .22s;
}
.d24-spotlight-root.is-open{
  opacity:1;visibility:visible;pointer-events:auto;
  transition:opacity .22s ease,visibility 0s linear 0s;
}
.d24-spotlight-panel{
  width:min(560px,100%);
  border-radius:22px;
  background:rgba(255,252,246,.92);
  border:1px solid rgba(26,188,156,.28);
  box-shadow:
    0 24px 64px rgba(13,31,27,.28),
    0 0 0 1px rgba(0,173,239,.12);
  overflow:hidden;
  transform:translateY(-8px) scale(.98);
  transition:transform .22s cubic-bezier(.22,1,.36,1);
  font-family:Outfit,system-ui,sans-serif;
  color:#0D1F1B;
}
.d24-spotlight-root.is-open .d24-spotlight-panel{
  transform:translateY(0) scale(1);
}
.d24-spotlight-input-row{
  display:flex;align-items:center;gap:12px;
  padding:16px 18px;min-height:64px;
  border-bottom:1px solid rgba(231,224,210,.9);
}
.d24-spotlight-input-row svg{color:#1ABC9C;flex-shrink:0;}
.d24-spotlight-input{
  flex:1;min-width:0;border:0;background:transparent;outline:none;
  font-size:20px;font-weight:500;color:#0D1F1B;
  font-family:inherit;caret-color:#00ADEF;
}
.d24-spotlight-input::placeholder{color:#7A8B85;font-weight:400;}
.d24-spotlight-hint{
  flex-shrink:0;font-size:11px;font-weight:700;color:#2F4FA0;
  padding:4px 8px;border-radius:8px;
  background:rgba(47,79,160,.08);border:1px solid rgba(47,79,160,.16);
}
.d24-spotlight-body{padding:10px 10px 12px;max-height:min(58vh,420px);overflow-y:auto;}
.d24-spotlight-label{
  margin:8px 8px 6px;font-size:11px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:#2F4FA0;
}
.d24-spotlight-label:first-child{margin-top:4px;}
.d24-spotlight-list{
  list-style:none;margin:0;padding:0;
}
.d24-spotlight-item{
  display:flex;align-items:center;gap:12px;
  width:100%;padding:10px 12px;border:0;border-radius:14px;
  background:transparent;color:inherit;text-align:left;
  cursor:pointer;font-family:inherit;
  transition:background .15s ease;
}
.d24-spotlight-item:hover,
.d24-spotlight-item.is-active{
  background:rgba(26,188,156,.12);
}
.d24-spotlight-item:focus-visible{
  outline:2px solid #00ADEF;outline-offset:1px;
}
.d24-spotlight-ico,
.d24-spotlight-thumb{
  width:40px;height:40px;border-radius:12px;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(47,79,160,.08);color:#2F4FA0;
  border:1px solid rgba(47,79,160,.14);
  overflow:hidden;
}
.d24-spotlight-thumb img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.d24-spotlight-thumb.is-fallback{
  background:rgba(47,79,160,.08);
}
.d24-spotlight-item.is-active .d24-spotlight-ico,
.d24-spotlight-item:hover .d24-spotlight-ico,
.d24-spotlight-item.is-active .d24-spotlight-thumb,
.d24-spotlight-item:hover .d24-spotlight-thumb{
  background:rgba(0,173,239,.14);color:#0D1F1B;border-color:rgba(0,173,239,.35);
}
.d24-spotlight-text{flex:1;min-width:0;}
.d24-spotlight-text strong{
  display:block;font-size:14.5px;font-weight:700;color:#0D1F1B;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.d24-spotlight-text span{
  display:block;font-size:12px;color:#7A8B85;margin-top:2px;line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.d24-spotlight-go{
  flex-shrink:0;opacity:0;color:#1ABC9C;
  transition:opacity .15s ease;
}
.d24-spotlight-item:hover .d24-spotlight-go,
.d24-spotlight-item.is-active .d24-spotlight-go{opacity:1;}
.d24-spotlight-empty{
  padding:14px 12px;text-align:center;color:#7A8B85;font-size:13.5px;
}
.d24-spotlight-empty--soft{padding:8px 12px 12px;font-size:12.5px;}
.d24-spotlight-empty--loading{color:#2F4FA0;font-weight:600;}
.d24-spotlight-footer{
  display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;
  padding:8px 14px 12px;border-top:1px solid rgba(231,224,210,.9);
  font-size:11px;color:#7A8B85;
}
.d24-spotlight-footer kbd{
  display:inline-block;padding:1px 5px;border-radius:4px;
  background:rgba(13,31,27,.06);border:1px solid rgba(13,31,27,.12);
  font-family:inherit;font-size:10px;font-weight:700;color:#2F4FA0;
}

@media (prefers-reduced-motion:reduce){
  .d24-spotlight-root,
  .d24-spotlight-root.is-open,
  .d24-spotlight-panel,
  .d24-spotlight-root.is-open .d24-spotlight-panel,
  .d24-spotlight-item,
  .d24-spotlight-go,
  .d24-spotlight-trigger{
    transition:none !important;
  }
  .d24-spotlight-panel{transform:none;}
}
.d24-spotlight-item.is-product .d24-spotlight-text strong{font-weight:700;}
