static/shared/szl_command_bar.css

/* SPDX-License-Identifier: Apache-2.0
(c) 2026 Lutar, Stephen P. - SZL Holdings - ORCID 0009-0001-0110-4173 */
/* szl_command_bar.css — KANCHAY holographic command bar (density / glass / motion / IA).
   Canonical house palette (Doctrine v11). Does not restore the gold/tan console palette.
   Λ is Conjecture 1 — advisory, gray, never green, never a theorem, never a gate. */

:root{
  --void:#080c14;
  --proof:#3af4c8;
  --lattice:#5b8dee;
  --kanchay-gold:#d7b96b;
  --ground:#080c14;
  --panel:#0e1626;
  --panel2:#0a1019;
  --rail:#0a1019;
  --gold:#d7b96b;
  --gold-bright:#e4c97a;
  --gold-line:rgba(215,185,107,0.18);
  --gold-soft:rgba(215,185,107,0.05);
  --teal:#3af4c8;
  --teal-soft:rgba(58,244,200,0.10);
  --teal-line:rgba(58,244,200,0.22);
  --cream:#eef4fb;
  --paragraph:#aebccf;
  --muted:#7d8aa0;
  --dim:#65788f;
  --live:#3af4c8;
  --err:#e8746e;
  --warn:#d7b96b;
  --gray:#7d8aa0;
  --szl-bar-h:52px;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,monospace;
  --display:'Space Grotesk',system-ui,-apple-system,"Segoe UI",sans-serif;
}

/* ===== three-zone holographic bar ===== */
.szl-hbar,.topbar.szl-hbar{
  --hbar-bg:rgba(8,12,20,0.78);
  position:sticky;top:0;z-index:80;
  display:flex;align-items:stretch;gap:0;
  min-height:var(--szl-bar-h)!important;height:auto!important;max-height:none!important;
  overflow:visible!important;flex-wrap:nowrap;white-space:nowrap;
  padding:0 12px;box-sizing:border-box;
  background:var(--hbar-bg);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(28,41,66,0.9);
  box-shadow:inset 0 1px 0 rgba(58,244,200,0.45); /* single top specular hairline */
  font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--cream);line-height:1.2;
}
.szl-hbar *,.szl-hbar *::before,.szl-hbar *::after{box-sizing:border-box;}
.szl-hbar a{color:inherit;text-decoration:none;}
.szl-hbar .menu-btn{flex:0 0 auto;align-self:center;}

.szl-hbar-zone{
  display:flex;align-items:center;gap:10px;min-width:0;padding:8px 12px;
}
.szl-hbar-scope{flex:0 1 auto;max-width:34%;border-right:1px solid rgba(28,41,66,0.8);}
.szl-hbar-live{flex:1 1 auto;justify-content:center;gap:8px;overflow:hidden;}
.szl-hbar-switch{flex:0 1 auto;margin-left:auto;border-left:1px solid rgba(28,41,66,0.8);gap:8px;}

.szl-hbar-crumb{display:inline-flex;align-items:center;gap:8px;min-width:0;}
.szl-hbar-crumb .sep{color:var(--dim);}
.szl-hbar-crumb .now{color:var(--proof);}

/* Glass only on live / receipt-bearing chips — glass means "this is streaming." */
.szl-chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 9px;border-radius:6px;border:1px solid transparent;
  color:var(--muted);font-size:12px;letter-spacing:.08em;
}
.szl-chip--live{
  color:var(--cream);
  background:rgba(14,22,38,0.55);
  border-color:rgba(58,244,200,0.28);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:inset 0 1px 0 rgba(58,244,200,0.18);
}
.szl-chip--off{color:var(--muted);border-color:rgba(101,120,143,0.35);}
.szl-chip--deny{
  color:#0a1019;background:var(--err);border-color:var(--err);
  animation:szl-deny-flash .28s steps(2,end) 3;
}
.szl-chip--lambda,.szl-lambda{color:var(--gray)!important;} /* Conjecture 1 — never green */
.szl-dot{width:7px;height:7px;border-radius:50%;background:var(--proof);box-shadow:0 0 6px rgba(58,244,200,.45);}
.szl-chip--off .szl-dot{background:var(--dim);box-shadow:none;}
.szl-roll{font-variant-numeric:tabular-nums;display:inline-block;min-width:1.6ch;text-align:right;}
.szl-roll.is-tick{animation:szl-digit .45s ease;}
.szl-pulse{animation:szl-hairline 1.1s ease-out 1;}

.szl-origins{display:inline-flex;align-items:center;gap:2px;}
.szl-origins a,.szl-origins button.szl-origin{
  appearance:none;background:transparent;border:0;color:var(--muted);
  font:inherit;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;
  padding:7px 10px;border-radius:6px;min-height:36px;
}
.szl-origins a.is-on,.szl-origins button.szl-origin.is-on{color:var(--proof);box-shadow:inset 0 -1px 0 var(--proof);}
.szl-origins a:hover,.szl-origins button.szl-origin:hover{color:var(--cream);}

.szl-proof{color:var(--proof)!important;white-space:nowrap;}
.szl-cmdk{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius:6px;border:1px solid rgba(58,244,200,0.28);
  color:var(--proof);background:rgba(58,244,200,0.06);cursor:pointer;
  font:inherit;letter-spacing:.08em;text-transform:uppercase;min-height:36px;
}
.szl-more{
  appearance:none;background:transparent;border:1px solid rgba(101,120,143,0.4);
  color:var(--muted);font:inherit;letter-spacing:.08em;text-transform:uppercase;
  padding:6px 10px;border-radius:6px;cursor:pointer;min-height:36px;
}
.szl-overflow{position:relative;}
.szl-overflow-menu{
  display:none;position:absolute;right:0;top:calc(100% + 6px);z-index:90;
  min-width:220px;padding:8px;border-radius:8px;
  background:rgba(8,12,20,0.96);border:1px solid rgba(28,41,66,0.95);
  box-shadow:0 16px 40px rgba(0,0,0,.45);
  white-space:normal;
}
.szl-overflow.open .szl-overflow-menu{display:flex;flex-direction:column;gap:4px;}
.szl-overflow-menu a,.szl-overflow-menu button{
  display:block;width:100%;text-align:left;background:transparent;border:0;
  color:var(--cream);font:inherit;letter-spacing:.06em;text-transform:uppercase;
  padding:8px 10px;border-radius:6px;cursor:pointer;
}
.szl-overflow-menu a:hover,.szl-overflow-menu button:hover{background:rgba(58,244,200,0.08);color:var(--proof);}
.szl-estate{display:inline-flex;align-items:center;gap:6px;}

/* Public default: estate switcher + labs/killinchu stay behind the operator gate. */
html:not([data-operator="1"]) .szl-estate,
html:not([data-operator="1"]) .extlinks,
html:not([data-operator="1"]) .switcher,
html:not([data-operator="1"]) [data-view="labs"],
html:not([data-operator="1"]) [data-view="labsintro"],
html:not([data-operator="1"]) a[href*="killinchu"],
html:not([data-operator="1"]) .vcard[href="#cybSurface"]{display:none!important;}

html[data-view="investor"] [data-view="energy"],
html[data-view="investor"] [data-view="energySci"],
html[data-view="investor"] [data-view="energyReceipts"],
html[data-view="investor"] [data-view="energyGrid"],
html[data-view="investor"] .vcard[href="#cybSurface"],
html[data-view="investor"] .vcard-energy,
html:not([data-operator="1"]) [data-view="energy"],
html:not([data-operator="1"]) [data-view="energySci"],
html:not([data-operator="1"]) [data-view="energyReceipts"],
html:not([data-operator="1"]) [data-view="energyGrid"]{display:none!important;}

/* Honest empty states — UNKNOWN / ROADMAP / UNAVAILABLE (consume 1391 patterns, KANCHAY tokens). */
.empty-unknown,.szl-empty{
  display:flex;flex-direction:column;align-items:flex-start;gap:.45rem;
  padding:.9rem 1rem;border:1px dashed var(--gold-line);border-radius:8px;background:transparent;
}
.empty-unknown-k,.szl-empty__k{
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gold);border:1px solid var(--gold-line);padding:.12rem .45rem;border-radius:4px;
}
.empty-unknown-d,.szl-empty__d{font-size:13px;line-height:1.5;color:var(--dim);}
.empty-unknown-viz,.szl-empty--viz{min-height:220px;align-items:center;justify-content:center;text-align:center;}
.szl-empty[data-kind="error"] .szl-empty__k{color:var(--err);border-color:rgba(232,116,110,0.45);}
.szl-empty[data-kind="permission"] .szl-empty__k{color:var(--gray);border-color:rgba(125,138,160,0.4);}

/* ⌘K palette */
.szl-pal-ov{position:fixed;inset:0;z-index:220;background:rgba(8,12,20,.72);backdrop-filter:blur(4px);display:none;align-items:flex-start;justify-content:center;}
.szl-pal-ov.open{display:flex;}
.szl-pal{margin-top:12vh;width:min(560px,92vw);background:var(--panel);border:1px solid var(--teal-line);border-radius:12px;overflow:hidden;}
.szl-pal input{width:100%;box-sizing:border-box;padding:1rem 1.1rem;background:var(--panel2);border:none;border-bottom:1px solid var(--gold-line);color:var(--cream);font-family:var(--mono);font-size:14px;outline:none;text-transform:none;letter-spacing:0;}
.szl-pal-list{max-height:48vh;overflow:auto;padding:.4rem;}
.szl-pal-item{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.55rem .7rem;border-radius:8px;cursor:pointer;color:var(--paragraph);font-size:13px;letter-spacing:.04em;text-transform:uppercase;}
.szl-pal-item:hover,.szl-pal-item.sel{background:var(--teal-soft);color:var(--cream);}
.szl-pal-item .road{color:var(--gold);font-size:10px;}

.szl-op-toggle{
  appearance:none;background:transparent;border:1px solid rgba(101,120,143,0.4);
  color:var(--dim);font:inherit;letter-spacing:.08em;text-transform:uppercase;
  padding:6px 10px;border-radius:6px;cursor:pointer;min-height:36px;
}
html[data-operator="1"] .szl-op-toggle{color:var(--proof);border-color:var(--teal-line);}

@keyframes szl-digit{0%{transform:translateY(40%);opacity:.2;}100%{transform:none;opacity:1;}}
@keyframes szl-hairline{0%{box-shadow:inset 0 1px 0 rgba(58,244,200,1),0 0 0 0 rgba(58,244,200,.35);}100%{box-shadow:inset 0 1px 0 rgba(58,244,200,.18),0 0 0 0 rgba(58,244,200,0);}}
@keyframes szl-deny-flash{0%,100%{filter:none;}50%{filter:brightness(1.35);}}
@keyframes szl-lattice{
  0%{background-position:0 0;}
  100%{background-position:24px 0;}
}

/* Residual conductor-lattice (subtle, 5% holographic). Tied to the bar, not decoration. */
.szl-hbar::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.05;z-index:0;
  background-image:repeating-linear-gradient(90deg,rgba(91,141,238,.9) 0 1px,transparent 1px 24px);
  animation:szl-lattice 18s linear infinite;
}
.szl-hbar > *{position:relative;z-index:1;}

@media (max-width:820px){
  .szl-hbar{flex-wrap:wrap;white-space:normal;row-gap:6px;padding:8px 10px;}
  .szl-hbar-scope,.szl-hbar-live,.szl-hbar-switch{max-width:none;border:0;flex:1 1 100%;margin:0;justify-content:flex-start;}
  .szl-hbar-live{order:3;}
}
@media (prefers-reduced-motion:reduce){
  .szl-hbar::before,.szl-roll.is-tick,.szl-pulse,.szl-chip--deny,.szl-dot{animation:none!important;}
  .szl-holo-card{transition:none;}
}

/* Series A holographic cards — original SZL glass on void. Not Blueprint, not Cursor chrome. */
.szl-estate-fold,.szl-estate-page{
  font-family:var(--display);color:var(--cream);
}
.szl-estate-legend{
  display:flex;flex-wrap:wrap;gap:10px 18px;align-items:baseline;
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);margin:0 0 14px;
}
.szl-estate-h{
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--proof);margin:18px 0 10px;font-weight:500;
}
.szl-estate-tiles{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;
}
.szl-estate-grid.is-compact .szl-estate-tiles{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
.szl-holo-card{
  position:relative;display:flex;flex-direction:column;gap:10px;
  padding:14px 14px 12px;border-radius:10px;
  background:linear-gradient(180deg,rgba(14,22,38,0.72),rgba(8,12,20,0.62));
  border:1px solid rgba(91,141,238,0.22);
  box-shadow:inset 0 1px 0 rgba(58,244,200,0.16),0 10px 28px rgba(0,0,0,0.28);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  min-height:100%;
}
.szl-holo-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;opacity:.06;
  background-image:repeating-linear-gradient(90deg,rgba(91,141,238,.9) 0 1px,transparent 1px 22px);
}
.szl-holo-card[data-lane="kernel"]{border-color:rgba(58,244,200,0.28);}
.szl-holo-card--roadmap{border-style:dashed;border-color:rgba(215,185,107,0.4);opacity:.92;}
.szl-holo-k{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--lattice);
}
.szl-holo-title{
  font-family:var(--display);font-size:18px;font-weight:600;margin:4px 0 0;color:var(--cream);letter-spacing:.01em;
}
.szl-holo-one{margin:0;color:var(--paragraph);font-size:13.5px;line-height:1.45;}
.szl-holo-facts{margin:0;display:grid;gap:8px;}
.szl-holo-facts div{display:grid;grid-template-columns:4.5rem 1fr;gap:8px;align-items:start;}
.szl-holo-facts dt{
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin:0;
}
.szl-holo-facts dd{margin:0;font-size:12.5px;color:var(--paragraph);line-height:1.4;}
.szl-holo-chip{
  display:inline-flex;align-items:center;padding:2px 7px;border-radius:4px;margin-right:6px;
  font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid rgba(101,120,143,0.4);color:var(--muted);
}
.szl-holo-chip--reported{color:var(--cream);border-color:rgba(91,141,238,0.45);background:rgba(91,141,238,0.08);}
.szl-holo-chip--measured{color:var(--void);background:var(--proof);border-color:var(--proof);}
.szl-holo-chip--software{color:var(--proof);border-color:rgba(58,244,200,0.45);background:rgba(58,244,200,0.08);}
.szl-holo-chip--roadmap{color:var(--kanchay-gold);border-color:rgba(215,185,107,0.45);}
.szl-holo-chip--off{color:var(--muted);}
.szl-holo-id{font-family:var(--mono);font-size:11px;letter-spacing:.02em;color:var(--cream);word-break:break-all;}
.szl-holo-facts a{color:var(--proof);text-decoration:none;word-break:break-all;}
.szl-holo-lambda{margin:0;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--gray)!important;}
.szl-holo-note{margin:0;font-size:12px;color:var(--dim);line-height:1.45;}
.szl-holo-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;}
.szl-holo-act a{
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--proof);text-decoration:none;border-bottom:1px solid rgba(58,244,200,0.35);padding-bottom:2px;
}
.szl-holo-act a:hover{color:var(--cream);}
.szl-estate-foot{font-family:var(--mono);font-size:11px;color:var(--dim);line-height:1.5;margin:16px 0 0;}
.szl-estate-foot a{color:var(--proof);}
@media (max-width:640px){
  .szl-holo-facts div{grid-template-columns:1fr;}
}