.hp-stage{--hp-w:262px;--hp-r:44px;--hp-bezel:8px;--hp-float:10px;position:relative;width:100%;max-width:360px;min-height:500px;margin:0 auto;padding-top:calc(var(--hp-float) + 14px);padding-bottom:36px;overflow:visible}.hp-glow{position:absolute;top:20%;left:50%;width:300px;height:300px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#ff572229 0,#0000 68%);filter:blur(14px);pointer-events:none}.hp-rig{margin:0 auto}.hp-device,.hp-rig{position:relative;width:var(--hp-w)}.hp-chassis{position:relative;padding:var(--hp-bezel);border-radius:var(--hp-r);background:linear-gradient(148deg,#888892,#5a5a64 10%,#3e3e48 28%,#24242c 55%,#141418 82%,#0a0a0e);box-shadow:inset 0 2px 1px #ffffff47,inset 0 -4px 10px #00000073,0 24px 48px #08060452,0 10px 28px #ff57221f}.hp-bezel{position:relative;border-radius:calc(var(--hp-r) - 7px);overflow:hidden;background:#020203;border:1px solid #ffffff0a;box-shadow:inset 0 0 0 1px #000000a6}.hp-island{position:absolute;top:11px;left:50%;z-index:5;width:82px;height:24px;transform:translateX(-50%);border-radius:999px;background:linear-gradient(180deg,#0e0e12,#040406);box-shadow:inset 0 1px 0 #ffffff0d,inset 0 -2px 4px #0009;display:flex;align-items:center;justify-content:flex-end;padding-right:11px}.hp-island-cam{width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 32% 30%,#3a3a50,#060610 65%);box-shadow:inset 0 0 3px #3c64b459}.hp-screen{background:var(--card);padding:40px 0 0;min-height:472px;display:flex;flex-direction:column}.hp-app-header{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.72rem .95rem;background:linear-gradient(135deg,var(--brand-from),var(--brand-to));color:#fff;font-size:.76rem;font-weight:700}.hp-app-badge{display:grid;place-items:center;min-width:1.55rem;height:1.55rem;padding:0 .3rem;border-radius:999px;background:#ffffff38;font-size:.7rem;font-weight:800}.hp-app-label{margin:0;padding:.65rem .95rem .2rem;font-size:.6rem;font-weight:700;letter-spacing:.08em;color:var(--muted)}.hp-slots{list-style:none;margin:0;padding:0 .85rem .65rem;flex:1 1;display:flex;flex-direction:column;gap:.3rem}.hp-slot{display:grid;grid-template-columns:2.75rem 1fr auto;align-items:center;gap:.35rem;padding:.42rem 0;border-bottom:1px solid var(--border);font-size:.72rem}.hp-slot:last-child{border-bottom:none}.hp-slot-time{font-weight:700;color:var(--fg);font-size:.7rem}.hp-slot-info{display:flex;flex-direction:column;gap:.08rem;min-width:0;font-weight:600;color:var(--fg)}.hp-slot-info small{font-size:.6rem;font-weight:500;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hp-slot-status{font-size:.56rem;font-weight:700;padding:.18rem .38rem;border-radius:999px;background:#22c55e1f;color:#16a34a;white-space:nowrap}.hp-cta{display:block;margin:.45rem .85rem .95rem;padding:.62rem 1rem;border-radius:11px;background:linear-gradient(135deg,var(--brand-from),var(--brand-to));color:#fff!important;text-align:center;font-size:.76rem;font-weight:700;text-decoration:none!important;box-shadow:0 5px 14px #ff57224d}.hp-reflection{pointer-events:none;position:absolute;inset:var(--hp-bezel);border-radius:calc(var(--hp-r) - 7px);background:linear-gradient(118deg,#ffffff2e,#ffffff0d 14%,#0000 38%)}.hp-reflection--soft{inset:0;border-radius:var(--hp-r);background:linear-gradient(105deg,#ffffff14,#0000 28%)}.hp-shadow{position:absolute;pointer-events:none;border-radius:50%}.hp-shadow--main{bottom:-24px;z-index:-1;width:72%;height:32px;background:radial-gradient(ellipse,#0806046b 0,#0000 72%);filter:blur(10px)}.hp-shadow--ambient,.hp-shadow--main{left:50%;transform:translateX(-50%);animation:hp-shadow-pulse 6s ease-in-out infinite}.hp-shadow--ambient{bottom:-10px;z-index:-2;width:86%;height:20px;background:radial-gradient(ellipse,#ff57221f 0,#0000 70%);filter:blur(16px)}@media (min-width:769px){.hp-stage{perspective:1400px;perspective-origin:46% 42%;padding-top:calc(var(--hp-float) + 20px)}.hp-rig{transform-style:preserve-3d;animation:hp-intro 2.6s cubic-bezier(.22,1,.36,1) forwards}.hp-device{animation:hp-float 6s ease-in-out 2.6s infinite}}@keyframes hp-intro{0%{transform:rotateY(-1turn) rotateX(12deg) translateY(32px) scale(.9);opacity:0}45%{transform:rotateY(-22deg) rotateX(7deg) translateY(-4px) scale(1.02);opacity:1}to{transform:rotateY(-16deg) rotateX(5deg) translateY(0) scale(1)}}@keyframes hp-float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes hp-shadow-pulse{0%,to{opacity:.9;transform:translateX(-50%) scale(1)}50%{opacity:.55;transform:translateX(-50%) scale(.9)}}@keyframes hp-intro-mobile{0%{transform:translateY(20px) scale(.94);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@media (max-width:768px){.hp-stage{--hp-w:228px;--hp-r:38px;--hp-bezel:7px;max-width:300px;min-height:420px;padding-top:calc(var(--hp-float) + 18px)}.hp-glow{width:240px;height:240px}.hp-screen{min-height:408px}.hp-rig{animation:hp-intro-mobile 1.4s ease forwards}.hp-device{animation:hp-float 5s ease-in-out 1.4s infinite}}@media (prefers-reduced-motion:reduce){.hp-device,.hp-rig,.hp-shadow--ambient,.hp-shadow--main{animation:none!important}@media (min-width:769px){.hp-rig{transform:rotateY(-16deg) rotateX(5deg)}}}