.app-feature-demo{position:relative;width:100%;height:100%;overflow:hidden;background:#f2edf4;isolation:isolate}
.appd-canvas{position:absolute;inset:0 auto auto 0;width:1280px;height:760px;transform-origin:top left;background:radial-gradient(ellipse at 25% 95%,#e7d8ed 0,transparent 55%),linear-gradient(125deg,#faf7fa,#f1eaf3);color:#fff}
.appd-red{position:absolute;width:1430px;height:1510px;left:-470px;top:-950px;border-radius:50%;background:radial-gradient(ellipse at 70% 62%,#ff301d,#e40e0c 60%,#ce0c18);transform-origin:45% 55%;will-change:transform}
.appd-heading{position:absolute;top:11%;left:4.5%;width:88%;z-index:1;will-change:transform,opacity}
.appd-heading p{margin:0 0 48px;font:700 29px/1.4 "Noto Sans JP",sans-serif;letter-spacing:.01em;color:#fff}
.appd-heading>img{display:block;width:730px;height:auto;filter:brightness(0) invert(1)}
.appd-laptop{position:absolute;left:5%;top:35%;width:68%;aspect-ratio:4613/2418;will-change:transform,opacity;filter:drop-shadow(0 13px 10px #4229431c)}
.appd-laptop-frame{position:absolute;inset:0;width:100%;height:100%}
.appd-screen{position:absolute;left:13.79%;top:6.3%;width:68.7%;height:82.5%;background:#f8f9fa;overflow:hidden;color:#4c596d}
.appd-browser{height:5.2%;display:flex;align-items:center;justify-content:space-between;padding:0 8px;background:#fff;border-bottom:1px solid #e5e7ea;font:6px/1 sans-serif}
.appd-desktop{display:flex;height:94.8%;background:#f7f8fa}
.appd-rail{flex:none;width:23px;padding:7px 0;text-align:center;background:#fff;border-right:1px solid #e9ecf0;color:#8192a0;font:11px/3 sans-serif}
.appd-directory{min-width:0;flex:1;padding:10px 7px}
.appd-search{border:1px solid #e6e9ec;border-radius:6px;background:#fff;padding:7px 5px;font:5px/1.3 sans-serif;white-space:nowrap}.appd-search span{float:right}
.appd-filters{display:flex;align-items:center;gap:5px;height:29px;white-space:nowrap;font:5px/1.2 sans-serif}.appd-filters b{padding:5px 7px;background:#151515;color:#fff;border-radius:12px}.appd-filters span{padding:4px 5px;border:1px solid #eceef1;background:#fff;border-radius:12px}
.appd-candidates{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}
.appd-candidate{min-width:0;padding:5px;border:1px solid #e7ecf3;border-radius:6px;background:#fff;font:6px/1.45 sans-serif;box-shadow:0 5px 9px #141d2e04}
.appd-candidate>img{width:100%;height:86px;object-fit:contain;margin:0 0 8px}.appd-candidate p{color:#d63950;font-size:5px;white-space:nowrap}.appd-candidate strong,.appd-candidate small{display:block}.appd-candidate strong{color:#313942;margin:3px 0}.appd-candidate small{color:#8c95a1;font-size:5px}.appd-candidate>div{display:flex;gap:2px;margin:4px 0;white-space:nowrap}.appd-candidate i,.appd-candidate em{font-style:normal;border-radius:6px;padding:2px;background:#e8f1ff;color:#4385ce;font-size:4px}.appd-candidate em{background:#fff0f0;color:#cf6071}
.appd-phone{position:absolute;left:56%;top:42%;width:14.5%;aspect-ratio:180/374;border-radius:30px;background:linear-gradient(100deg,#d1d1d1,#272727 3%,#080808 7%,#242424 94%,#b5b5b5 97%,#292929);border:2px solid #4c4a4a;box-shadow:inset 0 0 0 2px #101010,inset 0 0 0 4px #858181,8px 16px 16px #4938472b;will-change:transform,opacity}
.appd-phone-screen{position:absolute;inset:8px;border-radius:23px;overflow:hidden;background:radial-gradient(ellipse at 15% 0,#fb303c,#e32e32 60%,#f24239)}
.appd-phone-brand{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#fff}.appd-phone-brand b{font:700 45px/1 Arial,sans-serif}.appd-phone-brand small{font:4px/2.4 "Noto Sans JP",sans-serif;margin-top:7px;letter-spacing:.15px}
.appd-notch{position:absolute;top:7px;left:26%;width:48%;height:17px;border-radius:0 0 13px 13px;background:#070707}.appd-notch:after{content:"";position:absolute;right:13px;top:5px;width:5px;height:5px;border-radius:50%;background:#13222c;box-shadow:-16px 0 0 -1px #1f2024}
.appd-home{position:absolute;bottom:12px;left:34%;width:32%;height:3px;border-radius:5px;background:#171717}.appd-phone-shine{position:absolute;inset:2px;border-radius:27px;border-left:1px solid #d1d1d188;border-right:1px solid #f3f3f399;pointer-events:none}
.appd-downloads{position:absolute;left:75.5%;top:60%;width:21.5%;padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:12px;border-radius:22px;background:#fff;box-shadow:0 15px 26px #3c294526;will-change:transform,opacity}
.appd-downloads a{display:block;min-width:0;border-radius:5px}.appd-downloads a:focus-visible{outline:4px solid #175ec6;outline-offset:5px}.appd-qr{display:block;width:100%;height:auto;aspect-ratio:1}.appd-store{display:block;width:100%;height:auto;aspect-ratio:188/56;object-fit:contain;margin-top:5px}
.app-feature-demo.is-compact .appd-red{width:1550px;height:1400px;left:-640px;top:-850px}
.app-feature-demo.is-compact .appd-heading{top:8%;left:6%;width:88%}.app-feature-demo.is-compact .appd-heading p{font-size:31px;line-height:1.6;max-width:640px;margin-bottom:42px}.app-feature-demo.is-compact .appd-heading>img{width:100%}
.app-feature-demo.is-compact .appd-laptop{left:-4%;top:31%;width:105%}.app-feature-demo.is-compact .appd-phone{left:67%;top:39%;width:22%;border-radius:28px}
.app-feature-demo.is-compact .appd-downloads{left:27%;top:68%;width:46%;padding:16px;gap:18px}

.appd-heading p span{display:inline-block}
@media(max-width:767px){.feature-tools .product-image-stage:has(.product-panel-app.is-active) .feature-playback{padding-top:12px}}
