.hp-stage{position:relative;overflow:hidden}.hp-scene{transform-origin:0 0;font-family:var(--font-sans);position:absolute;top:0;left:0}.hp-scene *{box-sizing:border-box}.hp-glow{background:radial-gradient(closest-side,#d4a12a38,#0000);border-radius:50%;width:560px;height:440px;position:absolute;top:90px;left:60px}.hp-ring{border:1px solid #24335e;border-radius:50%;width:360px;height:360px;position:absolute;bottom:-110px;right:-90px}.hp-dot{border-radius:50%;position:absolute}.hp-scene .lbl{letter-spacing:.1em;text-transform:uppercase;color:#534d58;font-size:9px}.hp-scene .ttl{font-family:var(--font-display);color:#0f1b3d;margin:2px 0 10px;font-size:19px}.hp-scene .ok{color:#2a6649;font-weight:500}.hp-scene .bad{color:#a3470c;font-weight:500}.hp-mon{width:620px;position:absolute;top:30px;left:150px}.hp-mon .scr{background:#0b0b10;border:2px solid #2b2d39;border-radius:12px 12px 0 0;padding:8px}.hp-mon .neck{background:linear-gradient(#aeb1bd,#7f8391);width:90px;height:34px;margin:0 auto}.hp-mon .base{background:linear-gradient(#c7cad4,#8f93a1);border-radius:0 0 12px 12px;width:230px;height:9px;margin:0 auto}.hp-mon .view{background:#faf7f2;border-radius:5px;grid-template-columns:62px 1fr;height:300px;display:grid;overflow:hidden}.hp-mon .sb{background:#3d1656;flex-direction:column;align-items:center;gap:11px;padding:14px 0;display:flex}.hp-mon .sb i{background:#ffffff2e;border-radius:8px;width:26px;height:26px}.hp-mon .sb i.on{background:#d4a12a}.hp-mon .pg{padding:16px 18px}.hp-mon .kpis{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.hp-mon .kpis div{background:#fff;border:1px solid #e2dace;border-radius:9px;padding:8px 9px}.hp-mon .kpis b{font-family:var(--font-display);color:#0f1b3d;font-size:19px;font-weight:500;display:block}.hp-mon .kpis span{color:#534d58;font-size:9px}.hp-mon .panel{background:#fff;border:1px solid #e2dace;border-radius:10px;margin-top:10px;padding:10px 12px}.hp-mon .row{justify-content:space-between;margin-top:8px;font-size:10px;display:flex}.hp-mon .panel>div:first-child .row{margin-top:0}.hp-mon .br{background:#e6e9f2;border-radius:3px;height:6px;margin-top:4px;position:relative}.hp-mon .br b{border-radius:3px;height:100%;display:block}.hp-mon .br:after{content:"";background:#d4a12a;width:2px;position:absolute;top:-2px;bottom:-2px;left:75%}.hp-ipad{background:#17171d;border-radius:30px;width:420px;height:310px;padding:13px;position:absolute;top:250px;left:0;box-shadow:0 0 0 2px #3a3c49,0 30px 50px -15px #000000b3}.hp-ipad:before{content:"";background:#2c2e3a;border-radius:50%;width:6px;height:6px;margin-left:-3px;position:absolute;top:5px;left:50%}.hp-ipad .glass{background:#faf7f2;border-radius:19px;height:100%;padding:16px 18px;overflow:hidden}.hp-ipad .cal{color:#534d58;grid-template-columns:34px repeat(5,1fr);gap:4px;margin-top:8px;font-size:8px;display:grid}.hp-ipad .cal .h{text-align:center;color:#0f1b3d;font-weight:500}.hp-ipad .cal .t{text-align:right;padding-right:4px}.hp-ipad .cal .c{background:#fff;border:1px solid #e2dace;border-radius:5px;height:34px;padding:4px 5px;line-height:1.2}.hp-ipad .cal .c.p,.hp-ipad .cal .c.g,.hp-ipad .cal .c.n{color:#fff;border:0}.hp-ipad .cal .c.p{background:#3d1656}.hp-ipad .cal .c.g{background:#a3770f}.hp-ipad .cal .c.n{background:#0f1b3d}.hp-phone{background:#101015;border-radius:40px;width:200px;height:400px;padding:10px;position:absolute;top:215px;left:560px;box-shadow:0 0 0 2px #3a3c49,0 36px 60px -16px #000c}.hp-phone:after{content:"";background:#3a3c49;border-radius:2px;width:3px;height:44px;position:absolute;top:90px;left:-3px}.hp-phone .glass{background:#faf7f2;border-radius:31px;height:100%;padding:36px 14px 14px;position:relative;overflow:hidden}.hp-phone .isl{background:#000;border-radius:12px;width:64px;height:20px;margin-left:-32px;position:absolute;top:9px;left:50%}.hp-phone .hm{opacity:.7;background:#17131b;border-radius:3px;width:70px;height:4px;margin-left:-35px;position:absolute;bottom:6px;left:50%}.hp-phone .hi{font-family:var(--font-display);color:#0f1b3d;margin:2px 0 10px;font-size:19px}.hp-phone .ev2{border-radius:12px;margin-top:7px;padding:10px 11px;font-size:10px;line-height:1.35}.hp-phone .ev2 b{font-size:11px;display:block}.hp-phone .ev2.a{color:#fff;background:#3d1656}.hp-phone .ev2.b{color:#534d58;background:#fff;border:1px solid #e2dace}.hp-phone .ev2.w{color:#6b4c07;background:#fbf1de;border:1px solid #ecd49a}.hp-phone .mark{background:#fff;border:1px solid #e2dace;border-radius:12px;margin-top:8px;padding:10px 11px}.hp-phone .mark b{font-family:var(--font-display);color:#0f1b3d;font-size:22px;font-weight:500}.hp-phone .mark small{color:#534d58;font-size:9px}.hp-phone .pb{background:#e6e9f2;border-radius:3px;height:5px;margin:6px 0}.hp-phone .pb b{background:#3d1656;border-radius:3px;width:76%;height:100%;font-size:0;display:block}.hp-phone .tab{background:#fff;border:1px solid #e2dace;border-radius:14px;justify-content:space-around;padding:7px 0;display:flex;position:absolute;bottom:16px;left:10px;right:10px}.hp-phone .tab i{background:#e6e9f2;border-radius:5px;width:16px;height:16px}.hp-phone .tab i.on{background:#3d1656}.hp-fl{color:#17131b;background:#fff;border-radius:12px;align-items:center;gap:8px;padding:9px 13px;font-size:11px;display:flex;position:absolute;box-shadow:0 14px 30px -12px #0000008c}.hp-fl i{color:#2a6649;background:#e1f0e8;border-radius:50%;place-items:center;width:22px;height:22px;font-style:normal;display:grid}.hp-fl small{color:#534d58;font-size:10px;display:block}.hp-scene.kompak .hp-mon{display:none}.hp-scene.kompak .hp-ipad{top:150px}.hp-scene.kompak .hp-phone{top:10px;left:300px}.hp-scene.kompak .hp-glow{width:460px;top:40px;left:20px}
