*{box-sizing:border-box;margin:0;padding:0}html,body{font-family:Nunito,Space Grotesk,sans-serif;background:#020208;min-height:100vh}body{display:flex;align-items:center;justify-content:center;padding:24px}@keyframes rb-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.85}}@keyframes shine{0%{transform:translate(-120%) skew(-20deg)}to{transform:translate(280%) skew(-20deg)}}@keyframes typing{0%,80%,to{opacity:0}40%{opacity:1}}@keyframes pop{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}@keyframes slide-up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes glow-pulse{0%,to{box-shadow:0 0 0 2px #ffffff14,0 40px 80px #0009,0 0 30px var(--bezel-c)}50%{box-shadow:0 0 0 2px #ffffff1f,0 40px 80px #0009,0 0 50px var(--bezel-c)}}.shine-wrap{position:relative;overflow:hidden}.shine-wrap:after{content:"";position:absolute;top:0;left:0;width:45%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);animation:shine 3s ease-in-out infinite;pointer-events:none}.rb-text{background:linear-gradient(90deg,#e63946,#f4a261,#ffd166,#06d6a0,#118ab2,#7b2d8b);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:rb-shift 4s ease infinite}.app{display:flex;gap:24px;max-width:1500px;width:100%}.app-side{width:280px}.app-side h1{font-size:22px;font-weight:900;color:#fff;margin-bottom:8px;line-height:1.1}.app-side p{font-size:13px;color:#ffffff73;font-weight:700;line-height:1.5;margin-bottom:18px}.screen-list{display:flex;flex-direction:column;gap:4px}.screen-list button{background:#ffffff08;border:1.5px solid rgba(255,255,255,.06);color:#fff9;padding:10px 14px;border-radius:11px;cursor:pointer;text-align:left;font-family:inherit;font-size:12px;font-weight:800;letter-spacing:.2px;display:flex;align-items:center;gap:10px;transition:all .18s ease}.screen-list button:hover{background:#ffffff0f;color:#fff}.screen-list button.active{background:#e639461f;border-color:#e6394666;color:#fff;transform:translate(2px)}.screen-list .grp{font-size:9px;color:#ffffff40;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;padding:14px 14px 6px}.kbd-tip{margin-top:18px;padding:12px 14px;background:#ffffff05;border:1px dashed rgba(255,255,255,.1);border-radius:10px;font-size:11px;color:#fff6;font-weight:700;line-height:1.5}.kbd-tip b{color:#ffd166}.app-stage{flex:1;display:flex;align-items:center;justify-content:center;min-height:880px}.phone{width:390px;height:820px;background:#05050d;position:relative;overflow:hidden;border-radius:44px;animation:glow-pulse 2.5s ease-in-out infinite;flex-shrink:0}.phone .island{position:absolute;top:12px;left:50%;transform:translate(-50%);width:120px;height:34px;background:#000;border-radius:20px;z-index:50}.phone-content{padding-top:54px;height:100%}.desktop{width:1100px;height:680px;background:#05050d;display:flex;overflow:hidden;border-radius:18px;box-shadow:0 0 0 1.5px #ffffff12,0 40px 80px #000000b3;position:relative;flex-shrink:0}button,input,textarea{font-family:inherit}