/* SSC LABS — shared CSS tokens & primitives.
   Used by home.html, archive.html, dashboard.html (re-skin) */
:root{
  --ssc-ink:#0B0B0C;
  --ssc-bone:#F2EFE8;
  --ssc-accent:#C6FF3D;
  --ssc-rule:rgba(242,239,232,.12);
  --ssc-rule-s:rgba(242,239,232,.28);
  --ssc-muted:rgba(242,239,232,.56);
  --ssc-up:#7CD992;
  --ssc-down:#FF7A6B;
  --ssc-warn:#F5C84A;
  --ssc-serif:"Instrument Serif", ui-serif, Georgia, serif;
  --ssc-sans:"Geist", ui-sans-serif, system-ui, sans-serif;
  --ssc-mono:"JetBrains Mono", ui-monospace, Menlo, monospace;
}

*{box-sizing:border-box}
html,body{margin:0;background:var(--ssc-ink);color:var(--ssc-bone);font-family:var(--ssc-sans);-webkit-font-smoothing:antialiased}
a{color:inherit}

/* === Logo === */
.ssc-logo{display:inline-flex;align-items:center;gap:12px;color:var(--ssc-bone);line-height:1}
.ssc-logo-word{display:inline-block;padding:7px 11px;border:2px solid var(--ssc-bone);font-family:var(--ssc-mono);text-align:left;line-height:1}
.ssc-logo-word-top{display:block;font-weight:700;font-size:18px;letter-spacing:.04em;color:var(--ssc-bone)}
.ssc-logo-word-top em{font-style:normal;color:var(--ssc-accent)}
.ssc-logo-word-bot{display:block;font-weight:500;font-size:8px;letter-spacing:.3em;color:var(--ssc-muted);margin-top:3px}
.ssc-logo[data-size="sm"] .ssc-logo-word{padding:4px 7px}
.ssc-logo[data-size="sm"] .ssc-logo-word-top{font-size:13px}
.ssc-logo[data-size="sm"] .ssc-logo-word-bot{font-size:6px;margin-top:2px}
.ssc-logo[data-size="lg"] .ssc-logo-word{padding:11px 14px}
.ssc-logo[data-size="lg"] .ssc-logo-word-top{font-size:26px}
.ssc-logo[data-size="lg"] .ssc-logo-word-bot{font-size:10px;margin-top:5px}
.ssc-logo[data-size="xl"] .ssc-logo-word{padding:14px 18px}
.ssc-logo[data-size="xl"] .ssc-logo-word-top{font-size:38px}
.ssc-logo[data-size="xl"] .ssc-logo-word-bot{font-size:11px;margin-top:7px}

/* === Chrome === */
.ssc-chrome{position:sticky;top:0;z-index:50;background:var(--ssc-ink);border-bottom:1px solid var(--ssc-rule-s)}
.ssc-chrome-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px;padding:14px 24px;border-bottom:1px solid var(--ssc-rule)}
.ssc-nav{display:flex;gap:22px;align-items:center;justify-content:center;font-family:var(--ssc-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ssc-muted)}
.ssc-nav a{cursor:pointer;color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.ssc-nav a:hover,.ssc-nav a.on{color:var(--ssc-bone)}
.ssc-nav a.on{color:var(--ssc-accent)}
.ssc-nav .sep{width:3px;height:3px;border-radius:50%;background:var(--ssc-rule-s)}
.ssc-right{display:flex;gap:10px;align-items:center;font-family:var(--ssc-mono);font-size:11px}
.ssc-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 11px;border:1px solid var(--ssc-rule-s);color:var(--ssc-muted);letter-spacing:.06em}
.ssc-pill-solid{background:var(--ssc-bone);color:var(--ssc-ink);border-color:var(--ssc-bone);font-weight:600}
.ssc-led{width:7px;height:7px;border-radius:50%;background:var(--ssc-accent);box-shadow:0 0 8px var(--ssc-accent);animation:ssc-pulse 2s ease-in-out infinite}
@keyframes ssc-pulse{0%,100%{opacity:1}50%{opacity:.45}}

/* === Masthead === */
.ssc-mast{display:grid;grid-template-columns:1fr auto 1fr;align-items:baseline;gap:24px;padding:10px 24px;font-family:var(--ssc-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ssc-muted)}
.ssc-mast-l{display:flex;gap:18px}
.ssc-mast-r{display:flex;gap:18px;justify-content:flex-end}
.ssc-mast-c{font-family:var(--ssc-serif);font-size:18px;letter-spacing:-.01em;text-transform:none;color:var(--ssc-bone);font-weight:400}
.ssc-mast-c em{font-style:italic;color:var(--ssc-accent)}

@media(max-width:1100px){
  .ssc-chrome-row{grid-template-columns:1fr auto;gap:14px}
  .ssc-nav{display:none}
  .ssc-mast{grid-template-columns:1fr}
  .ssc-mast-r{justify-content:flex-start}
}

/* === Common buttons / pills === */
.ssc-btn{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border:1px solid var(--ssc-bone);font-family:var(--ssc-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ssc-bone);background:transparent;cursor:pointer;text-decoration:none}
.ssc-btn:hover{background:var(--ssc-bone);color:var(--ssc-ink)}
.ssc-btn-primary{background:var(--ssc-accent);border-color:var(--ssc-accent);color:var(--ssc-ink);font-weight:600}
.ssc-btn-primary:hover{background:var(--ssc-bone)}

/* === Footer === */
.ssc-footer{border-top:1px solid var(--ssc-rule-s);padding:48px 24px 32px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;font-family:var(--ssc-mono);font-size:11px;color:var(--ssc-muted)}
.ssc-footer h4{font-family:var(--ssc-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ssc-bone);margin:0 0 14px;font-weight:500}
.ssc-footer ul{list-style:none;margin:0;padding:0}
.ssc-footer ul li{padding:5px 0}
.ssc-footer ul a{text-decoration:none;color:var(--ssc-muted)}
.ssc-footer ul a:hover{color:var(--ssc-bone)}
.ssc-footer-bottom{grid-column:1/-1;padding-top:24px;border-top:1px solid var(--ssc-rule);display:flex;justify-content:space-between;font-size:10px;letter-spacing:.14em;text-transform:uppercase}
@media(max-width:900px){.ssc-footer{grid-template-columns:1fr 1fr}}