/* ═══════════════════════════════════════════════════════════════════════════
   Altaha Special — delivery-weighted momentum
   The one tab whose input nothing else in the market is looking at, so it is
   allowed to look like the flagship. Gold rule, serif masthead, and the
   arithmetic on every row like everywhere else in this product.
   ═══════════════════════════════════════════════════════════════════════════ */

.sp-head{ border-left:3px solid var(--gold); padding:4px 0 4px 20px; margin:6px 0 22px }
.sp-title{ font-family:'Instrument Serif',Georgia,serif; font-weight:400;
  font-size:clamp(26px,4vw,40px); line-height:1.06; margin:0 0 12px; letter-spacing:-.015em }
.sp-title i{ font-style:italic; color:var(--gold) }
.sp-lede{ font-size:16px; line-height:1.6; margin:0 0 12px; max-width:66ch }
.sp-body{ font-size:14px; line-height:1.65; color:var(--ink-2); margin:0 0 10px; max-width:68ch }
.sp-formula{ display:inline-block; margin-top:8px; padding:11px 16px;
  border:1px solid var(--rule); border-radius:10px; background:var(--paper-2);
  font-size:13.5px; letter-spacing:.02em }

/* The measured record, including the part that did not work. */
.sp-measured{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:11px; margin:0 0 8px }
.sp-stat{ border:1px solid var(--rule); border-radius:12px; padding:14px 16px;
  background:var(--skin-card) }
.sp-stat .k{ font:500 9.5px/1 'IBM Plex Mono',monospace; letter-spacing:.12em;
  text-transform:uppercase; color:var(--mute) }
.sp-stat .v{ font:600 21px/1 'IBM Plex Mono',monospace; margin-top:10px;
  letter-spacing:-.02em; font-variant-numeric:tabular-nums }
.sp-stat .h{ font-size:11px; color:var(--mute); margin-top:6px }
.sp-caveat{ grid-column:1/-1; border:1px dashed var(--rule); border-radius:12px;
  padding:15px 17px; font-size:12.5px; line-height:1.6; color:var(--ink-2) }
.sp-caveat b{ color:var(--ink) }

.sp-asof{ font-size:11.5px; color:var(--mute); margin-left:12px }

/* One row per name, with the working. */
.sp-row{ border:1px solid var(--rule); border-radius:12px; background:var(--skin-card);
  margin-bottom:9px; overflow:hidden; transition:border-color .2s ease, box-shadow .2s ease }
.sp-row:hover{ border-color:var(--gold-lt) }
.sp-row > summary{ list-style:none; cursor:pointer; padding:14px 17px; display:grid;
  grid-template-columns:34px 1fr auto auto; gap:14px; align-items:center }
.sp-row > summary::-webkit-details-marker{ display:none }
.sp-rank{ font:600 13px/1 'IBM Plex Mono',monospace; color:var(--mute);
  font-variant-numeric:tabular-nums }
/* display:block on every one of these. They are all <span>, and an inline box
   ignores width, height and top margin — without it the symbol, its sub-line
   and the "delivered" caption all run together on one line. */
.sp-sym{ display:block; font:600 15px/1.3 'IBM Plex Mono',monospace; letter-spacing:.03em }
.sp-sym a{ color:inherit; text-decoration:none }
.sp-sym a:hover{ color:var(--gold); text-decoration:underline }
.sp-sub{ display:block; font-size:11.5px; color:var(--mute); margin-top:4px; line-height:1.45 }
.sp-deliv{ text-align:right }
.sp-deliv .n{ display:block; font:600 16px/1 'IBM Plex Mono',monospace; font-variant-numeric:tabular-nums }
.sp-deliv .l{ display:block; font:500 9px/1 'IBM Plex Mono',monospace; letter-spacing:.1em;
  text-transform:uppercase; color:var(--mute); margin-top:5px }
.sp-bar{ width:70px; height:6px; border-radius:99px; background:var(--rule-2);
  overflow:hidden; display:block }
.sp-bar i{ display:block; height:100%; border-radius:99px;
  background:linear-gradient(90deg,var(--gold-dp),var(--gold-lt)) }
.sp-body-open{ padding:2px 17px 16px; border-top:1px solid var(--rule-2) }
.sp-kv{ display:grid; grid-template-columns:130px 1fr; gap:10px; padding:9px 0; font-size:13px }
.sp-kv + .sp-kv{ border-top:1px dashed var(--rule-2) }
.sp-kv .k{ font:500 9.5px/1.5 'IBM Plex Mono',monospace; letter-spacing:.1em;
  text-transform:uppercase; color:var(--mute) }
.sp-kv .v{ color:var(--ink-2); line-height:1.6 }
.sp-kv .v.mono{ font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--ink) }

.sp-state{ padding:40px 20px; text-align:center; color:var(--mute); font-size:14px }
.sp-state b{ display:block; color:var(--ink); font-size:16px; margin-bottom:8px }
.sp-prog{ display:block; width:min(260px,70%); height:6px; margin:14px auto 7px;
  border-radius:99px; background:var(--rule-2); overflow:hidden }
.sp-prog i{ display:block; height:100%; border-radius:99px; background:var(--gold);
  transition:width .4s ease }
.sp-progn{ display:block; font-size:12px; color:var(--mute) }
@media (max-width:640px){
  .sp-row > summary{ grid-template-columns:26px 1fr auto }
  .sp-bar{ display:none }
}

/* ── Five-signal ensemble ────────────────────────────────────────────────── */

.sp-warn{ border-color:var(--gold); border-style:solid; background:var(--paper-2) }

.sp-legend{ grid-column:1/-1; display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin-top:4px }
.sp-leg{ border-top:2px solid var(--gold); padding-top:10px }
.sp-leg b{ display:block; font-size:13px; font-weight:600; margin-bottom:5px }
.sp-leg span{ display:block; font-size:11.5px; line-height:1.5; color:var(--mute) }

/* The per-stock breakdown. Every one of these is display:block or grid on
   purpose — they are all <span>, and an inline box drops width and height. */
.sp-parts{ display:grid; gap:7px; padding:12px 0 6px }
.sp-part{ display:grid; grid-template-columns:150px 1fr 34px; gap:11px; align-items:center }
.sp-part .pl{ display:block; font-size:12px; color:var(--ink-2) }
.sp-part .pb{ display:block; height:7px; border-radius:99px;
  background:var(--rule-2); overflow:hidden }
.sp-part .pb i{ display:block; height:100%; border-radius:99px; background:var(--gold) }
.sp-part .pb i.hi{ background:linear-gradient(90deg,var(--gold-dp),var(--gold-lt)) }
.sp-part .pb i.lo{ background:var(--fail,#B03A2B); opacity:.75 }
.sp-part .pb i.na{ background:var(--rule) }
.sp-part .pv{ display:block; text-align:right; font:600 12px/1 'IBM Plex Mono',monospace;
  font-variant-numeric:tabular-nums }
@media (max-width:640px){ .sp-part{ grid-template-columns:112px 1fr 30px; gap:8px } }