.materiel-dashboard{justify-content:center;align-items:center;min-height:440px;display:flex;position:relative}.materiel-orb{filter:blur(18px);opacity:.8;border-radius:999px;position:absolute}.materiel-orb-one{background:#8aa0ff38;width:220px;height:220px;animation:7s ease-in-out infinite materiel-orb-float;top:34px;left:18px}.materiel-orb-two{background:#e6a23c29;width:180px;height:180px;animation:8s ease-in-out infinite reverse materiel-orb-float;bottom:28px;right:24px}.materiel-card{z-index:2;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:linear-gradient(#ffffff14,#ffffff08),#18223c57;border:1px solid #d9e3ea24;border-radius:30px;width:100%;padding:30px;animation:7s ease-in-out infinite materiel-card-float;position:relative;box-shadow:0 30px 70px -38px #000000b3,inset 0 1px #ffffff14}.materiel-header{justify-content:space-between;align-items:flex-start;gap:18px;display:flex}.materiel-header p{color:#c9d5df;text-transform:uppercase;letter-spacing:.14em;margin:0;font-size:13px;font-weight:800}.materiel-header h3{color:#fff;letter-spacing:-.04em;margin:10px 0 0;font-size:34px;line-height:1.05}.materiel-header>span{color:#def4e7;white-space:nowrap;background:#a7e2bf1a;border:1px solid #a7e2bf47;border-radius:999px;padding:9px 14px;font-size:13px;font-weight:800}.materiel-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px;display:grid}.materiel-metrics div{background:#ffffff0e;border:1px solid #d9e3ea1a;border-radius:20px;padding:16px}.materiel-metrics span{color:#cbd8e1;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:750;display:block}.materiel-metrics strong{color:#fff;letter-spacing:-.04em;margin-top:8px;font-size:28px;line-height:1;display:block}.materiel-devices{background:radial-gradient(circle at 18% 28%,#ffffff14,#0000 20%),radial-gradient(circle at 78% 62%,#8aa0ff21,#0000 28%),#ffffff09;border:1px solid #d9e3ea17;border-radius:24px;grid-template-columns:.72fr 1.28fr;align-items:end;gap:18px;min-height:300px;margin-top:28px;padding:20px;display:grid;position:relative}.materiel-device-phone,.materiel-device-tablet{background:linear-gradient(#ffffff14,#ffffff05),#0c162ad1;border:2px solid #d9e3ea29;position:relative;box-shadow:0 26px 50px -34px #000000d9,inset 0 1px #ffffff14}.materiel-device-phone{border-radius:34px;height:255px;padding:14px 12px 18px;animation:3.8s ease-in-out infinite materiel-device-pulse}.materiel-device-speaker{background:#d9e3ea40;border-radius:999px;width:46px;height:5px;margin:0 auto 12px;display:block}.materiel-phone-screen{background:linear-gradient(#8aa0ff21,#ffffff09),#ffffff09;border:1px solid #d9e3ea14;border-radius:24px;height:188px;padding:20px 14px;position:relative;overflow:hidden}.materiel-phone-screen span{color:#cbd8e1;text-transform:uppercase;letter-spacing:.07em;font-size:10px;font-weight:750;display:block}.materiel-phone-screen strong{color:#fff;margin-top:8px;font-size:24px;line-height:1;display:block}.materiel-device-button{background:#d9e3ea2e;border-radius:999px;width:28px;height:4px;margin:12px auto 0;display:block}.materiel-device-tablet{background:linear-gradient(#e6a23c14,#ffffff08),#0c162ad1;border:2px solid #e6a23c38;border-radius:34px;height:245px;padding:16px;position:relative}.materiel-tablet-camera{background:#d9e3ea33;border-radius:999px;width:6px;height:38px;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.materiel-tablet-screen{background:linear-gradient(90deg,#8aa0ff1f,#0000 48%),#ffffff0b;border:1px solid #d9e3ea14;border-radius:24px;flex-direction:column;justify-content:flex-start;height:100%;padding:10px;display:flex}.materiel-tablet-top span{color:#cbd8e1;text-transform:uppercase;letter-spacing:.06em;font-size:9px;font-weight:750;display:block}.materiel-tablet-top strong{color:#fff;letter-spacing:-.04em;margin-top:8px;font-size:16px;line-height:1;display:block}.materiel-tablet-menu{flex-wrap:wrap;gap:6px;margin-top:22px;display:flex}.materiel-tablet-menu span{color:#cbd8e1;text-transform:uppercase;letter-spacing:.05em;background:#ffffff0a;border:1px solid #d9e3ea0f;border-radius:14px;padding:12px 14px;font-size:10px;font-weight:800;line-height:1}.materiel-tablet-menu-active{color:#f3d19a!important;background:#e6a23c1f!important;border-color:#e6a23c38!important}.materiel-scan-beam{background:#e6a23cf2;border-radius:999px;height:3px;animation:2.7s ease-in-out infinite materiel-scan-move;position:absolute;bottom:38px;left:12px;right:12px;box-shadow:0 0 22px #e6a23c66}.materiel-badge{z-index:4;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(#e6a23c47,#d4880629),#18223c94;border:1px solid #e6a23c66;border-radius:18px;width:180px;padding:17px 18px;position:absolute;box-shadow:0 20px 40px -24px #d488068c,inset 0 1px #ffffff29}.materiel-badge-top{animation:5.5s ease-in-out infinite materiel-badge-float;top:-14px;right:-42px}.materiel-badge-bottom{animation:6.2s ease-in-out infinite reverse materiel-badge-float;bottom:24px;left:-100px}.materiel-badge span{color:#f3d19a;letter-spacing:.08em;text-transform:uppercase;font-size:12px;font-weight:850;display:block}.materiel-badge strong{color:#fff;margin-top:9px;font-size:16px;line-height:1;display:block}@keyframes materiel-card-float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes materiel-badge-float{0%,to{transform:translateY(0)translate(0)}50%{transform:translateY(-12px)translate(4px)}}@keyframes materiel-orb-float{0%,to{transform:translate(0,0)scale(1)}50%{transform:translate(14px,-12px)scale(1.05)}}@keyframes materiel-device-pulse{0%,to{box-shadow:0 26px 50px -34px #000000d9}50%{box-shadow:0 26px 50px -34px #000000d9,0 0 0 10px #8aa0ff14}}@keyframes materiel-scan-move{0%,to{opacity:.7;transform:translateY(0)}50%{opacity:1;transform:translateY(-80px)}}@media (max-width:720px){.materiel-dashboard{min-height:560px}.materiel-card{padding:24px}.materiel-header{flex-direction:column}.materiel-metrics,.materiel-devices{grid-template-columns:1fr}.materiel-device-phone,.materiel-device-tablet{height:auto;min-height:230px}.materiel-badge{width:155px}.materiel-badge-top{right:-8px}.materiel-badge-bottom{left:-8px}}