/* Campaign report devices: crisp HTML interfaces inside dimensional hardware. */
.phone{left:68px;top:10px;width:278px;height:512px;border-radius:39px;padding:6px;border-color:#aca7b0 #5c5762 #79727f #c0bac7;transform:perspective(1100px) rotateY(12deg) rotateZ(-17deg);box-shadow:-5px 3px 0 #76707c,-10px 8px 0 #24202a,0 35px 55px #0009;animation:report-phone-drift 10s ease-in-out infinite}
.phone-screen{padding:0;border-radius:31px;background:#fff;color:#27323c;font-family:Arial,sans-serif;text-align:left}
.phone-status{height:37px;padding:0 17px;font-size:9px;background:#f6f8fa}
.phone-status i{width:83px;height:22px;top:7px;background:#060609;box-shadow:inset 0 0 0 1px #15131b}
.phone-status i:after{content:'';position:absolute;width:7px;height:7px;border-radius:50%;right:9px;top:7px;background:radial-gradient(circle at 35% 35%,#36587c,#080e19 65%);border:1px solid #192333}
.ads-filter{height:29px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;font-size:7px;background:#edf2f6;border-bottom:1px solid #dce2e7}
.ads-filter>span{color:#4477a3;background:#fff;border-radius:3px;padding:4px 6px}
.ads-filter>b{font-weight:400;color:#65717e}
.ads-title{display:flex;align-items:center;gap:6px;padding:12px 10px 10px;font-size:11px;font-weight:700;border-bottom:1px solid #dce2e7;white-space:nowrap}
.ads-title svg{width:13px;height:13px;flex-shrink:0}
.ads-tools{height:31px;display:flex;align-items:center;gap:5px;padding:5px 8px;background:#f7f9fb;border-bottom:1px solid #d4dce3}
.ads-tools span{padding:5px 6px;border:1px solid #dce2e8;background:#fff;border-radius:3px;font-size:7px;white-space:nowrap}
.ads-tools span:first-child{font-weight:700;font-size:9px;padding-block:3px}.ads-tools span:last-child{margin-left:auto}
.ads-report{width:100%;border-collapse:collapse;table-layout:fixed;font-size:9px;font-variant-numeric:tabular-nums;line-height:1.25}
.ads-report th{height:50px;font-size:8px;font-weight:600;background:#f8fafc;text-align:left;padding:6px 8px;border:1px solid #e0e5eb;vertical-align:middle}
.ads-report th:nth-child(1){width:32%}.ads-report th:nth-child(2){width:28%}.ads-report th:nth-child(3){width:40%}
.ads-report td{height:29px;text-align:right;padding:7px 8px;border-right:1px solid #e0e5eb;white-space:nowrap}
.ads-report tbody tr:nth-child(odd){background:#edf2f6}.ads-report tbody tr:nth-child(even){background:#fff}
.ads-report tfoot td{height:43px;background:#e7edf3;border-top:1px solid #c8d2dd;font-weight:700;font-size:9px}
.ads-report tfoot small{display:block;font-size:6px;color:#6e7c8b;font-weight:400;margin-top:3px}
.phone-demo{font:6px Arial,sans-serif;letter-spacing:.65px;margin:9px 0;color:#778391}.phone-home{bottom:6px;width:78px;opacity:.8}
.laptop{left:340px;top:66px;width:310px;height:340px;z-index:4;transform:perspective(1100px) rotateY(-29deg) rotateZ(-12deg);animation:report-laptop-drift 11s ease-in-out infinite;filter:drop-shadow(-15px 35px 20px #0008)}
.laptop-lid{padding:9px 7px 7px;border-radius:10px 10px 3px 3px;border-color:#8d8a95 #595361 #413b47 #a39bab;box-shadow:inset 0 0 0 2px #17141d}
.laptop-display{height:239px}.laptop-display aside{width:28px;padding:12px 5px}.laptop-display aside img{width:17px}.dashboard{padding:12px 9px 6px}.dashboard-header strong{font-size:11px}.dashboard-header>span{font-size:5px}.dashboard-stats{gap:4px}.dashboard-stats>span{padding:6px 4px}.dashboard-stats strong{font-size:12px;letter-spacing:-.5px}.dashboard-chart{padding:8px 6px 5px}.dashboard-chart svg{height:68px}.dashboard-table{font-size:4.7px}
.laptop-base{height:112px;margin-left:-56px;width:calc(100% + 58px);background:linear-gradient(130deg,#a09da8,#66616e 30%,#85808d 60%,#504b58);clip-path:polygon(15% 0,100% 0,88% 95%,85% 100%,0 100%,0 93%);transform:perspective(700px) rotateX(48deg) skewX(-13deg);transform-origin:top center;border-radius:0 0 6px 6px;border-bottom:5px solid #332e3a;box-shadow:inset 0 1px 0 #d0c9db}
.laptop-base:before{content:'';position:absolute;left:66px;right:16px;top:8px;height:55px;border:3px solid #47414d;border-radius:3px;background:repeating-linear-gradient(0deg,transparent 0 8px,#77707f 8px 10px),repeating-linear-gradient(90deg,#211e28 0 13px,#77707f 13px 16px);transform:skewX(-6deg)}
.laptop-base i{position:absolute;width:80px;height:28px;left:45%;bottom:9px;border:1px solid #514a5d;border-top-color:#b2a9c0;background:linear-gradient(140deg,#97909f,#7a7186);border-radius:3px;margin:0}
.mission-seal{left:202px;top:203px;width:147px;height:147px;z-index:5;background:radial-gradient(circle,#342842 0 43%,#16131df5 44%);border-color:#bcb0cb55;box-shadow:0 15px 30px #0006,inset 0 1px 0 #ded1ed18}.mission-seal img{width:54px}.mission-seal svg{fill:#b78adc;font-size:11px;letter-spacing:2px}
.device-caption{bottom:0}.device-demo{bottom:-22px}
@keyframes report-phone-drift{50%{transform:perspective(1100px) rotateY(12deg) rotateZ(-15deg) translateY(-9px)}}
@keyframes report-laptop-drift{50%{transform:perspective(1100px) rotateY(-29deg) rotateZ(-10deg) translateY(-9px)}}
@media(max-width:1100px) and (min-width:801px){.device-stage{scale:.75;left:48%}}
@media(max-width:800px){.device-stage{scale:.75;top:44%}.device-caption{bottom:2px}.device-demo{bottom:-16px}}
@media(max-width:500px){.device-stage{scale:.52;top:43%;left:50%}.hero-art.devices-art{height:360px}.device-caption{bottom:1px}.device-demo{bottom:-16px}}
@media(max-width:360px){.device-stage{scale:.44;top:44%}.hero-art.devices-art{height:310px}}
@media(prefers-reduced-motion:reduce){.phone,.laptop{animation:none}}

/* Reference composition: oversized phone, compact receding laptop, cropped base. */
.hero-art.devices-art{height:570px;overflow:hidden;margin-right:-70px;mask-image:linear-gradient(#000 0 85%,transparent 100%)}
.device-stage{width:760px;height:600px;margin:-300px 0 0 -380px;top:53%;left:50%;scale:1;transform:translate3d(var(--px,0px),var(--py,0px),0)}
.phone{left:100px;top:112px;scale:1.4;transform-origin:top left;transform:perspective(1100px) rotateY(8deg) rotateZ(-17deg);animation:large-phone-drift 7s ease-in-out infinite}
.laptop{left:460px;top:160px;width:310px;scale:1.15;transform-origin:top left;transform:none;animation:compact-laptop-drift 9s ease-in-out infinite}
.laptop-lid{height:257px;transform-origin:0 0;transform:matrix3d(0.37414518,-0.32924776,0,-0.00108783,0.12052377,0.63274977,0,-0.00012468,0,0,1,0,0,0,0,1);z-index:2}
.laptop .laptop-base{position:absolute;left:0;top:0;width:410px;height:155px;margin:0;transform-origin:0 0;transform:matrix3d(0.35726092,-0.23040103,0,-0.00057074,-1.12828512,0.67990381,0,-0.00030606,0,0,1,0,32,168,0,1);clip-path:none;z-index:1}
.laptop-base{height:155px;width:calc(100% + 100px);margin-left:-100px;transform:perspective(600px) rotateX(67deg) skewX(-32deg);clip-path:polygon(24% 0,100% 0,77% 97%,74% 100%,0 100%,0 95%);border-bottom-width:4px}
.laptop-base:before{left:107px;right:24px;height:79px;background:repeating-linear-gradient(0deg,transparent 0 10px,#77707f 10px 12px),repeating-linear-gradient(90deg,#211e28 0 13px,#77707f 13px 16px)}
.laptop-base i{height:37px;width:95px;left:37%;bottom:16px}
.mission-seal{width:185px;height:185px;left:255px;top:260px}.mission-seal img{width:71px}
.device-caption{display:none}.device-demo{left:auto;right:5px;bottom:50px;font-size:8px;z-index:8;color:#b0a2bd}
.device-orbit{opacity:.35}.planet-horizon{opacity:.35}
@keyframes large-phone-drift{50%{transform:perspective(1100px) rotateY(8deg) rotateZ(-15deg) translateY(-16px)}}
@keyframes compact-laptop-drift{50%{transform:translateY(-18px) rotate(1.5deg)}}
@media(min-width:1101px){.hero{grid-template-columns:1fr 1.15fr}.hero-art.devices-art{margin-left:-15px}.device-stage{scale:.93}}
@media(min-width:801px) and (max-width:1100px){.hero-art.devices-art{height:520px;margin-right:-28px;margin-left:-30px}.device-stage{scale:.74;left:48%;top:50%}.device-demo{bottom:50px}}
@media(max-width:800px){.hero-art.devices-art{height:440px;margin:25px -20px 0;width:calc(100% + 40px);max-width:620px}.device-stage{scale:.78;top:58%;left:48%}.device-demo{right:20px;bottom:30px}}
@media(max-width:500px){.hero-art.devices-art{height:350px;margin-top:23px}.device-stage{scale:.53;top:52%;left:47%}.device-demo{bottom:26px;font-size:7px;right:20px}}
@media(max-width:360px){.hero-art.devices-art{height:300px}.device-stage{scale:.45;top:52%;left:47%}.device-demo{bottom:24px;font-size:6px}}
@media(prefers-reduced-motion:reduce){.phone,.laptop{animation:none}.device-stage{transform:none}}
