.phone[hidden]{display:none!important}.replica{height:760px;border:5px solid #232d38;border-radius:38px;overflow:hidden;position:relative;color:white;background:radial-gradient(ellipse at 0 90%,#41214f,transparent 60%),radial-gradient(ellipse at 85% 10%,#048dc4,transparent 70%),linear-gradient(130deg,#005e9f,#002b5f);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;box-shadow:0 20px 50px #1232}.r-statusbar{display:flex;justify-content:space-between;padding:18px 24px 12px;font-size:12px;font-weight:600}.r-scroll{height:calc(100% - 55px);overflow:auto;padding:15px 15px 95px;scrollbar-width:none}.r-house{font-size:12px;margin-bottom:22px;text-align:center}.replica h2{font-size:29px;font-weight:700;letter-spacing:-.7px;margin:0 0 18px;color:inherit}.replica h3{font-size:17px;color:inherit;margin:22px 0 12px;font-weight:600}.r-categories{display:flex;gap:8px;overflow:auto;scrollbar-width:none;margin:0 -5px}.replica button{font-family:inherit}.r-categories button{white-space:nowrap;background:#002b4e88;color:#c9e8f5;border-radius:24px;padding:10px 14px;font-size:11px}.r-categories button[aria-pressed=true]{background:#d5f1fa;color:#142c42}.r-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.r-tile{display:flex;align-items:center;background:#00264099;border-radius:22px;min-height:94px;color:#fff;overflow:hidden}.r-tile.is-on{background:#e3f5fa;color:#101d26}.tile-icon{background:none;padding:9px;color:#32cbe9;flex-shrink:0;width:44px}.tile-icon svg{width:29px;height:29px}.r-tile[data-tile=light] .tile-icon{color:#ffd326}.tile-body{background:none;color:inherit;text-align:left;padding:12px 8px 12px 0;min-width:0;flex:1}.tile-body small,.tile-body strong,.tile-body span{display:block;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tile-body strong{font-size:12px;margin:4px 0;font-weight:600}.tile-body small,.tile-body span{opacity:.63}.replica svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.r-scenes{display:flex;gap:9px;overflow:auto}.r-scenes button{display:flex;align-items:center;gap:10px;padding:15px 17px;background:#00335399;color:#fff;border-radius:22px;white-space:nowrap;font-size:12px}.r-scenes svg{width:23px;height:23px;color:#ffbf60;flex-shrink:0}.r-nav{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);display:flex;padding:4px;border:1px solid #ffffff60;border-radius:40px;background:#7aacc544;backdrop-filter:blur(22px);box-shadow:inset 0 1px 4px #fff6}.r-nav button{display:grid;justify-items:center;gap:2px;background:none;color:#fff;border-radius:32px;padding:8px 25px;white-space:nowrap;font-size:10px}.r-nav button[aria-pressed=true]{background:#ffffff22;color:#ffba5d}.r-nav svg{width:24px;height:24px}.r-tip{font-size:10px;opacity:.65;margin:24px 0;line-height:1.8}.r-back{width:34px;height:34px;border-radius:50%;background:#ffffff15;border:1px solid #ffffff30;color:inherit;font-size:28px;line-height:28px}.replica .detail-title{text-align:center;font-size:23px;font-weight:400;margin:14px 0 3px}.detail-status{text-align:center;color:#3ec9ed;font-size:14px;margin:0 0 35px}.vertical-control{position:relative;width:105px;height:290px;margin:30px auto 28px;border-radius:35px;overflow:hidden;background:#002647aa;--fill:#ffc481}.vertical-control.cyan{--fill:#35ceed}.vertical-control input.vertical{appearance:none;-webkit-appearance:none;writing-mode:vertical-lr;direction:rtl;width:100%;height:100%;margin:0;border:0;outline-offset:4px;border-radius:35px;background:linear-gradient(to top,var(--fill) var(--amount),transparent var(--amount));cursor:ns-resize}.vertical::-webkit-slider-thumb{appearance:none;width:105px;height:1px;background:transparent}.vertical::-moz-range-thumb{width:105px;height:1px;border:0;background:transparent}.vertical-control svg{position:absolute;bottom:23px;left:35px;width:35px;height:35px;color:white;pointer-events:none}.swatches{display:flex;justify-content:center;gap:15px}.swatches button{width:40px;height:40px;border-radius:50%;border:2px solid #fff8}.color-control{margin:25px 12px;font-size:11px}.color-control label{display:flex;justify-content:space-between}.replica input:not(.vertical){width:100%;accent-color:#44cbea}.motion-buttons,.degree-buttons{display:flex;justify-content:center;gap:15px;margin:20px 0}.motion-buttons button,.degree-buttons button{border-radius:24px;padding:10px 22px;background:#00325488;color:inherit;font-size:13px}.thermostat{position:relative;width:270px;max-width:100%;aspect-ratio:1;margin:40px auto 12px;touch-action:none}.thermostat>svg{width:100%;height:100%;stroke-width:23}.dial-track{stroke:#002c4f99}.dial-fill{stroke:#42b5ff;stroke-dasharray:57 100}.thermostat>div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}.thermostat small{font-size:12px;color:#35d6ff}.thermostat b{font-size:49px;font-weight:400}.replica select{display:block;width:65%;margin:16px auto;background:#002d4a88;color:white;font-size:13px;border-radius:24px;padding:12px}.replica select option{color:#222;background:white}.remote{padding:20px 10px}.remote-row{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:18px 0;font-size:12px}.remote-row button{width:55px;min-height:48px;border-radius:50px;background:linear-gradient(#718595,#344958);color:white;font-size:17px}.remote-row button.red{background:#d84d54}.remote-row svg{width:23px;height:23px}.dpad{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:170px;height:170px;border-radius:50%;background:#536a7c;margin:50px auto}.dpad button{background:none;color:white;border-radius:50%;font-size:18px}.dpad .d0{grid-area:1/2}.dpad .d1{grid-area:2/1}.dpad .d2{grid-area:2/2;background:#2b414e}.dpad .d3{grid-area:2/3}.dpad .d4{grid-area:3/2}.remote-feedback{text-align:center;min-height:20px;font-size:12px}.tv-osd{position:absolute;left:54%;top:48%;color:white;background:#0009;font-size:10px;padding:3px 8px;border-radius:4px}
.replica[data-mode=aqara]{background:linear-gradient(165deg,#53adbf 0%,#9bb6bb 35%,#354c64 65%,#48a5bb 100%);color:#fff}.replica[data-mode=aqara] .r-categories button{background:none;border-radius:0;font-size:13px;color:#ffffffa0;padding:5px}.replica[data-mode=aqara] .r-categories button[aria-pressed=true]{color:#fff;font-size:17px;font-weight:600}.replica[data-mode=aqara] .r-tile{border-radius:13px;display:block;min-height:120px;position:relative;background:#314f5cb0}.replica[data-mode=aqara] .r-tile.is-on{background:#fff}.replica[data-mode=aqara] .tile-icon{width:48px;height:48px;margin:9px;color:#b5b2f2}.replica[data-mode=aqara] .tile-body{padding:0 14px 15px;width:100%}.replica[data-mode=aqara] .tile-body small{display:none}.replica[data-mode=aqara] .tile-body strong{font-size:13px}.replica[data-mode=aqara] .r-scenes{display:grid;grid-template-columns:1fr 1fr}.replica[data-mode=aqara] .r-scenes button{background:white;color:black;border-radius:12px;padding:15px 12px}.replica[data-mode=aqara] .r-nav{background:#bce5f288;width:90%;justify-content:space-around}.replica[data-mode=aqara] .r-nav button[aria-pressed=true]{color:#514cff}.replica[data-mode=aqara][data-screen=light],.replica[data-mode=aqara][data-screen=ac]{background:linear-gradient(#ffdab0,#efeff5 45%);color:#111}.replica[data-mode=aqara] .detail-status{color:#7b7b89}.aq-card{background:#fff;border-radius:12px;margin:12px 0;padding:18px 15px;font-size:14px;color:#111}.power-card{display:flex;align-items:center;justify-content:space-between;margin-top:45px}.round-power{width:32px;height:32px;border-radius:50%;background:#45465d;color:white;font-size:23px;padding:0}.round-power[aria-pressed=true]{background:#5155ff}.aq-card input[type=range]{appearance:none;height:27px;border-radius:10px;background:linear-gradient(to right,#5055ff var(--amount),#f0f0f6 var(--amount));margin-top:14px}.aq-card input::-webkit-slider-thumb{appearance:none;width:27px;height:27px;background:white;border:1px solid #5355ff;border-radius:9px}.effect-tabs{font-size:12px;display:flex;gap:12px}.effect-tabs span{color:#999}.effect-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:17px}.effect{height:70px;border-radius:9px;color:white;text-align:left;padding:43px 8px 0;font-size:11px;background:linear-gradient(#77a5ec,#ffedbd 65%,#b5b4c5 65%)}.effect.e1{background:linear-gradient(#29c7e3,#eaf6bd 65%,#96b49d 65%)}.effect.e2{background:linear-gradient(#cd9459,#ffe4a8 65%,#cdb98b 65%)}.effect.e3{background:linear-gradient(#a67cba,#f8e0bb 65%,#cab0a1 65%)}.replica[data-mode=aqara][data-screen=tv]{background:#141414;color:white}.replica[data-mode=aqara][data-screen=curtain],.replica[data-mode=aqara][data-screen=garage]{background:linear-gradient(#667bd7 0 18%,#fafafa 18%);color:#fff}.replica[data-mode=aqara] .motion-buttons button{background:#598dff;color:white}.curtain-art{position:relative;height:220px;margin:40px 15px 25px;background:#fff;overflow:hidden;border-radius:6px}.rod{position:absolute;left:0;right:0;top:15px;height:6px;background:#8aa8f8;border-radius:5px}.fabric{position:absolute;top:20px;bottom:20px;width:calc(50% - var(--opening));min-width:9px;background:repeating-linear-gradient(90deg,#9db9fb,#b8c8ff 5px,#83a6f5 9px);transition:width .3s}.fabric.left{left:5px}.fabric.right{right:5px}.skyline{position:absolute;inset:40px 20px;background:linear-gradient(0deg,white,transparent),linear-gradient(90deg,#e4f2ff 30%,transparent 30% 35%,#e4f2ff 35% 60%,transparent 60% 65%,#e4f2ff 65%);clip-path:polygon(0 40%,25% 40%,25% 0,55% 15%,55% 50%,80% 50%,80% 25%,100% 25%,100% 100%,0 100%)}.ac-card{margin-top:65px}.ac-card>div{display:flex;align-items:center;gap:10px}.ac-card svg{width:35px;height:35px;color:#b7b1ee}.ac-card .round-power{margin-left:auto}.ac-card>b{display:block;text-align:center;font-size:64px;font-weight:400;padding:40px 0}.replica[data-mode=aqara] .degree-buttons button{background:#ffffffa0;color:#424968}.replica[data-mode=aqara] select{background:white;color:#454766}
@media(max-width:760px){.replica{height:680px;border-width:3px}.vertical-control{height:240px;margin-top:20px}.detail-status{margin-bottom:20px}.thermostat{margin-top:25px}.r-scroll{padding-top:10px}}


.r-scenes{scrollbar-width:none}.r-scenes::-webkit-scrollbar{display:none}.replica:not([data-screen=home]):not([data-screen=scenes]) .r-nav{display:none}.replica:not([data-screen=home]):not([data-screen=scenes]) .r-scroll{padding-bottom:35px}.replica[data-mode=aqara] .r-nav button{color:#285264}.replica .motion-buttons button{min-width:70px;padding:12px 15px}.replica [data-bind=curtain]:focus-visible{outline-color:#558cff}



/* Shared compact phone frame. */
.iphone-shell{position:relative;width:350px;max-width:100%;box-sizing:border-box;margin:0 auto;zoom:.8;padding:8px;border:2px solid #aaa6a0;border-radius:53px;background:linear-gradient(110deg,#85827d,#dedbd6 22%,#8f8b85 53%,#e5e1da 80%,#78756f);box-shadow:0 22px 48px #18232b30,inset 0 0 0 2px #e5e1da}
.iphone-shell .replica{height:760px;box-sizing:border-box;width:100%;border:4px solid #101112;border-radius:43px;box-shadow:none}
.iphone-island{position:absolute;z-index:5;top:21px;left:50%;transform:translateX(-50%);width:94px;height:26px;border-radius:20px;background:#08090a;pointer-events:none}
.iphone-island:after{content:'';position:absolute;right:9px;top:8px;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#263d59,#0a1018 65%);box-shadow:0 0 0 2px #101215}
.iphone-buttons{position:absolute;top:142px;left:-5px;width:3px;height:49px;border-radius:3px 0 0 3px;background:#99958f;box-shadow:0 61px #99958f;pointer-events:none}
.iphone-buttons:before{content:'';position:absolute;top:-62px;left:0;width:3px;height:23px;border-radius:3px;background:#99958f}
.iphone-buttons:after{content:'';position:absolute;left:351px;top:32px;width:3px;height:73px;border-radius:0 3px 3px 0;background:#99958f}
.iphone-home{position:absolute;bottom:19px;left:50%;transform:translateX(-50%);height:4px;width:110px;border-radius:4px;background:#ffffffa6;mix-blend-mode:difference;z-index:6;pointer-events:none}
.iphone-shell .r-statusbar{padding:18px 20px 17px;min-height:15px}
.iphone-shell .r-nav{bottom:22px}
@media(min-width:761px){.experience{grid-template-columns:minmax(0,1fr) 290px;gap:28px}}
@media(max-width:760px){.panel-wrap{max-width:350px}.iphone-shell .replica{height:760px}.iphone-shell .r-scroll{padding-top:15px}}

.iphone-shell .r-house{font-size:14px;font-weight:600;line-height:1.45;overflow-wrap:anywhere;margin-bottom:18px}
