body:has(.home-shell) .home-hero .starfield { position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.8; }
.starfield canvas { display:block; width:100%; height:100%; }
body:has(.home-shell) .home-hero .hero-copy { position:relative; z-index:1; }
body:has(.home-shell) .star-controls { position:absolute; top:calc(var(--site-nav-height) + 20px); right:clamp(24px,5vw,80px); display:flex; gap:10px; z-index:4; }
#article-container .home-shell .star-controls { display:flex; flex-wrap:nowrap; align-items:center; gap:12px; z-index:10; }
#article-container .home-shell .star-controls button { display:inline-flex; align-items:center; justify-content:center; gap:8px; box-sizing:border-box; flex:0 0 auto; min-width:124px; min-height:44px; padding:10px 16px; margin:0; line-height:1.4; white-space:nowrap; font-family:inherit; font-size:13px; font-weight:500; color:#fff; border:1px solid #d0e2ff80; background:#13243deb; border-radius:24px; cursor:pointer; }
#article-container .home-shell .star-controls button[aria-pressed='true'] { background:#e0efff; color:#1b314e; }
#article-container .home-shell .star-controls button:disabled { opacity:.6; cursor:wait; }
#article-container .home-shell .ai-portrait { display:block; width:176px; height:200px; margin:0; object-fit:contain; border-radius:10px; background:#fff; }
#article-container .home-shell [data-ai="deepseek"] .ai-portrait { background:transparent; }
@media(max-width:768px) {
  body:has(.home-shell) .star-controls,
  #article-container .home-shell .star-controls {
    top: calc(var(--site-nav-height, 60px) + 12px) !important;
    right: 12px !important;
    gap: 6px !important;
  }
  #article-container .home-shell .star-controls button,
  .star-controls button {
    min-width: auto !important;
    min-height: 34px !important;
    padding: 6px 11px !important;
    font-size: 12px !important;
    gap: 5px !important;
  }
}
@media(max-width:390px) {
  body:has(.home-shell) .star-controls,
  #article-container .home-shell .star-controls {
    right: 8px !important;
    gap: 4px !important;
  }
  #article-container .home-shell .star-controls button,
  .star-controls button {
    padding: 5px 8px !important;
    font-size: 11px !important;
    gap: 3px !important;
  }
}
.star-controls button { padding:9px 14px; border:1px solid #ffffff55; border-radius:22px; color:#fff; background:#0d1b30b8; font-size:12px; cursor:pointer; backdrop-filter:blur(12px); }
.star-controls button[aria-pressed='true'] { background:#e0efff; color:#1b314e; }
body:has(.home-shell) .home-hero.star-interacting .starfield { pointer-events:auto; touch-action:none; cursor:grab; z-index:2; outline-offset:-6px; opacity:1; background:rgba(3,9,23,.93); transition:background .6s; }
body:has(.home-shell) .home-hero.star-interacting .hero-copy { pointer-events:none; opacity:0; transition:opacity .3s; }
body:has(.home-shell) .home-hero.star-interacting .hero-signature { opacity:0; pointer-events:none; }
body:has(.home-shell) .home-hero.star-interacting .hero-footnote { z-index:3; pointer-events:none; }
/* Interactive lab & starfield styles (terminal UI is fully managed in kali-desktop.css) */
@media(prefers-reduced-motion:reduce) { .starfield { display:none!important; } #star-interact { display:none; } }
.home-shell .ai-character-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; }
.home-shell .ai-character { display:flex; flex-direction:column; align-items:center; padding:18px 8px; min-width:0; border:1px solid transparent; border-radius:16px; background:transparent; color:var(--site-ink); cursor:pointer; transition:background .2s,border-color .2s; }
.home-shell .ai-character:hover,.home-shell .ai-character.is-selected { background:var(--site-paper); border-color:var(--site-line); }
.home-shell .ai-sprite { width:144px; height:156px; max-width:100%; background-image:var(--pet-image); background-size:1152px 1404px; background-position:0 0; background-repeat:no-repeat; }
.home-shell .ai-character strong { font-size:17px; font-weight:500; margin-top:12px; }
.home-shell .ai-vendors { display:flex; flex-wrap:wrap; gap:12px; margin:0 0 26px; }
#article-container .home-shell .ai-vendors a { display:flex; align-items:center; gap:8px; border:1px solid var(--site-line); background:var(--site-paper); border-radius:20px; padding:8px 12px; font-size:12px; color:var(--site-ink); }
#article-container .home-shell .ai-vendors img { width:22px; height:22px; margin:0; object-fit:contain; border-radius:4px; background:#fff; padding:2px; }
.home-shell .ai-character small { font-size:12px; color:var(--site-muted); margin-top:4px; }
#article-container .home-shell #ai-description { margin:28px 0 12px; padding:20px 0; min-height:70px; border-block:1px solid var(--site-line); color:var(--site-ink); font-size:15px; }
#article-container .home-shell .ai-credit { font-size:11px; color:var(--site-muted); }
@media(max-width:767px) { .home-shell .ai-character-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; } .home-shell .ai-character:last-child { grid-column:1/-1; justify-self:center; width:50%; } }


.home-shell .ai-marquee { width:100%; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; border-radius:16px; }
.home-shell .ai-marquee .ai-character-grid { display:flex; gap:16px; width:max-content; padding-right:16px; animation:ai-procession 90s linear infinite; }
.home-shell .ai-marquee .ai-character { width:208px; flex:0 0 208px; }
.home-shell .ai-marquee:hover .ai-character-grid,.home-shell .ai-marquee:focus-within .ai-character-grid,.home-shell .ai-marquee:active .ai-character-grid { animation-play-state:paused; }
@keyframes ai-procession { to { transform:translateX(-50%); } }
.home-shell .vendor-marquee { overflow:hidden; width:100%; margin:0 0 32px; padding:12px 0; mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
#article-container .home-shell .vendor-marquee .ai-vendors { display:flex; flex-wrap:nowrap; align-items:center; width:max-content; gap:56px; padding-right:56px; margin:0; animation:vendor-procession 32s linear infinite; }
#article-container .home-shell .vendor-marquee .ai-vendors a { flex:0 0 auto; gap:12px; border:0; border-radius:0; padding:8px 0; background:transparent; font-size:16px; font-weight:500; white-space:nowrap; }
#article-container .home-shell .vendor-marquee .ai-vendors img { width:28px; height:28px; border-radius:6px; padding:3px; }
#article-container .home-shell .ai-vendors img[src$="kimi-color.svg"] { background:#151922; padding:3px; }
.home-shell .vendor-marquee:hover .ai-vendors { animation-play-state:running!important; }
.home-shell .vendor-marquee:focus-within .ai-vendors { animation-play-state:paused!important; }
.home-shell .ai-marquee { mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); scrollbar-width:none; }
@keyframes vendor-procession { to { transform:translateX(-50%); } }
@media(max-width:767px) { #article-container .home-shell .vendor-marquee .ai-vendors { gap:32px; padding-right:32px; } #article-container .home-shell .vendor-marquee .ai-vendors a { font-size:14px; } }
@media(prefers-reduced-motion:reduce) { #article-container .home-shell .vendor-marquee .ai-vendors { animation:none; } .home-shell [data-vendor-clone] { display:none!important; } .home-shell .vendor-marquee { overflow-x:auto; mask-image:none; } }
@media(prefers-reduced-motion:reduce) { .home-shell .ai-marquee .ai-character-grid { animation:none; } .home-shell [data-ai-clone] { display:none; } }