.homepage-personal .hp-demo-laptop .hp-project-stage { background: #0c1728; }
.homepage-personal .hp-arcade-project { position: absolute; inset: 0; background: radial-gradient(ellipse at 85% 20%, #223554, transparent 65%), #0c1728; color: #e9f1fb; transition: opacity 450ms ease, background-color 500ms ease; }
.homepage-personal .hp-project-stage[data-project-state="empty"] .hp-arcade-project { opacity: 0; pointer-events: none; }
.homepage-personal .hp-project-stage[data-project-state="empty"] { background: #edf5f2; }
.homepage-personal .hp-project-stage:not([data-project-state="base"]):not([data-project-state="empty"]) .hp-arcade-project { background: radial-gradient(ellipse at 80% 15%, #23536b, transparent 70%), #0c2334; }
.homepage-personal .hp-arcade-header { display: flex; justify-content: space-between; align-items: center; gap: 24px; height: 78px; padding: 18px 40px; border-bottom: 1px solid rgba(169,200,230,.13); }
.homepage-personal .hp-arcade-brand { display: flex; align-items: center; gap: 13px; font-size: 21px; font-weight: 600; letter-spacing: .14em; }
.homepage-personal .hp-arcade-brand svg { width: 30px; height: 30px; color: #a8c8ff; }
.homepage-personal .hp-arcade-hud { display: flex; align-items: center; gap: 20px; color: #aac0d7; font-size: 14px; }
.homepage-personal .hp-arcade-score { display: flex; align-items: center; gap: 9px; padding: 8px 12px; border: 1px solid rgba(232,215,141,.3); border-radius: 9px; color: #eedb94; }
.homepage-personal .hp-arcade-score[hidden] { display: none !important; }
.homepage-personal .hp-arcade-score strong { font-weight: 500; }
.homepage-personal .hp-arcade-canvas { display: block; width: 1120px; height: 430px; touch-action: none; cursor: crosshair; outline-offset: -5px; }
.homepage-personal .hp-arcade-canvas:focus-visible { outline: 3px solid #8ff0b2; }
.homepage-personal .hp-arcade-help { position: absolute; z-index: 1; top: 94px; left: 40px; color: #9bb8ce; font-size: 13px; line-height: 1.5; pointer-events: none; }
.homepage-personal .hp-arcade-feature { position: absolute; z-index: 1; top: 96px; right: 40px; color: #a4f0c0; font-size: 13px; pointer-events: none; }
.homepage-personal .hp-demo-laptop .hp-project-composer {
  width: 1010px;
  bottom: 22px;
  min-height: 166px;
  padding: 22px 26px 24px;
  border-radius: 24px;
  background: linear-gradient(120deg, rgba(255,255,255,.96), rgba(238,250,244,.93));
  box-shadow: 0 18px 60px rgba(0,13,25,.28), inset 0 1px rgba(255,255,255,.95);
}
.homepage-personal .hp-demo-laptop .hp-project-composer-top { margin-bottom: 17px; }
.homepage-personal .hp-demo-laptop .hp-project-composer-label { font-size: 14px; color: #426859; }
.homepage-personal .hp-demo-laptop .hp-project-composer-status { font-size: 13px; color: #647e70; }
.homepage-personal .hp-demo-laptop .hp-project-composer-main { gap: 24px; }
.homepage-personal .hp-demo-laptop .hp-project-prompt { max-width: 860px; min-height: 82px; font-size: 28px; line-height: 1.35; font-weight: 500; }
.homepage-personal .hp-demo-laptop .hp-project-send { width: 58px; height: 58px; }
.homepage-personal .hp-demo-laptop .hp-project-send svg { width: 28px; height: 28px; }
.homepage-personal .hp-project-send.is-sending { animation: hp-project-send-click 360ms ease-in-out both; }
.homepage-personal .hp-project-stage[data-demo-running="false"] .hp-project-send.is-sending { animation-play-state: paused; }
@keyframes hp-project-send-click {
  0% { transform: scale(1); }
  42% { transform: scale(.84); }
  100% { transform: scale(1); }
}
@media (max-width: 600px) {
  .homepage-personal .hp-after .hp-laptop-mobile-prompt { font-size: 18px; min-height: 92px; }
  .homepage-personal .hp-laptop-mobile-prompt::before { font-size: 11px; }
}
