*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}:root{--line:rgba(255,255,255,.12);--text:#f6f8ff;--muted:#9ca8c6;--cyan:#42e8ff;--green:#37ff9f;--pink:#ff4fc3;--purple:#9d5cff;--yellow:#ffd166;--orange:#ff9500;--red:#ff3b30}html.modal-open,body.modal-open{overflow:hidden!important;height:100%!important;overscroll-behavior:none!important}body.modal-open{position:fixed!important;left:0!important;right:0!important;width:100%!important}body{min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--text);overflow-x:hidden;background:radial-gradient(circle at 15% 8%,rgba(66,232,255,.22),transparent 28%),radial-gradient(circle at 84% 15%,rgba(255,79,195,.18),transparent 30%),radial-gradient(circle at 50% 100%,rgba(55,255,159,.13),transparent 34%),linear-gradient(145deg,#050711 0%,#0b1224 48%,#050611 100%)}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.08;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(circle,#000,transparent 78%)}.orb{position:fixed;width:340px;height:340px;border-radius:50%;filter:blur(74px);opacity:.34;pointer-events:none;animation:float 9s ease-in-out infinite alternate}.orb.one{background:var(--cyan);left:-120px;top:60px}.orb.two{background:var(--pink);right:-120px;top:230px;animation-delay:1.4s}.orb.three{background:var(--green);left:43%;bottom:-180px;animation-delay:2.1s}@keyframes float{to{transform:translateY(-28px) scale(1.06)}}.site{position:relative;z-index:1;width:min(1180px,calc(100% - 28px));margin:0 auto;padding:22px 0 56px}header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;border:1px solid var(--line);background:rgba(255,255,255,.07);backdrop-filter:blur(22px);border-radius:28px;box-shadow:0 24px 80px rgba(0,0,0,.28)}.brand{display:flex;align-items:center;gap:12px}.logo{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;font-size:28px;background:linear-gradient(145deg,var(--cyan),var(--purple),var(--pink));box-shadow:0 0 30px rgba(66,232,255,.22)}.brand strong{display:block;font-size:22px;letter-spacing:-.7px}.brand span{display:block;color:var(--muted);font-size:12px}.live{display:flex;align-items:center;gap:8px;border:1px solid rgba(55,255,159,.25);background:rgba(55,255,159,.09);padding:10px 14px;border-radius:999px;color:#b6ffd9;font-size:13px;font-weight:900}.live i{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 14px var(--green)}.hero{display:grid;grid-template-columns:1fr .9fr;gap:30px;align-items:center;padding:44px 4px 24px}.hero h1{font-size:clamp(42px,6vw,78px);line-height:.94;letter-spacing:-3.4px;margin-bottom:18px}.hero h1 span{background:linear-gradient(135deg,var(--cyan),var(--pink),var(--yellow));-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{color:#c9d4ee;font-size:18px;line-height:1.55;max-width:650px;margin-bottom:22px}.btn{border:0;border-radius:18px;padding:15px 18px;background:linear-gradient(135deg,var(--green),var(--cyan));box-shadow:0 18px 40px rgba(66,232,255,.18);color:#06101d;font-weight:950;font-size:15px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.2s}.btn:hover{transform:translateY(-2px);filter:brightness(1.04)}.btn.secondary{background:rgba(255,255,255,.08);border:1px solid var(--line);color:#fff;box-shadow:none}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.showcase{border:1px solid var(--line);background:rgba(255,255,255,.075);backdrop-filter:blur(22px);border-radius:34px;box-shadow:0 28px 90px rgba(0,0,0,.34);padding:20px}.phone{width:min(360px,100%);margin:0 auto;border-radius:48px;padding:13px;background:linear-gradient(160deg,#222a42,#05060d);border:1px solid rgba(255,255,255,.18);box-shadow:0 30px 70px rgba(0,0,0,.42),inset 0 2px 8px rgba(255,255,255,.14)}.screen{min-height:560px;border-radius:38px;overflow:hidden;background:radial-gradient(circle at 50% -10%,rgba(66,232,255,.18),transparent 36%),linear-gradient(180deg,#0f1830,#050711);padding:18px;border:1px solid rgba(255,255,255,.1);position:relative}.hero-island{width:136px;height:38px;border-radius:999px;background:#02040a;margin:0 auto 22px;position:relative;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.05),0 14px 28px rgba(0,0,0,.45)}.hero-island:before{content:"";position:absolute;inset:4px;border-radius:999px;background:linear-gradient(90deg,#ff4fc3,#9d5cff,#42e8ff,#37ff9f,#ffd166,#ff9500,#ff4fc3);background-size:260% 100%;animation:slideColors 3s linear infinite}.hero-island:after{content:"";position:absolute;inset:10px 18px;border-radius:999px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.30) 0 6px,transparent 6px 12px);mix-blend-mode:screen;animation:drift 2.2s linear infinite}@keyframes slideColors{to{background-position:260% 0}}@keyframes drift{to{transform:translateX(22px)}}.mock-title{text-align:center}.mock-title h3{font-size:24px;margin-bottom:8px}.mock-title p{color:var(--muted);font-size:13px;line-height:1.4}.motion-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0}.motion{min-height:90px;border-radius:24px;padding:14px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.1);position:relative;overflow:hidden}.motion b{position:relative;z-index:2;display:block;font-size:13px}.motion span{position:relative;z-index:2;font-size:24px}.motion:before{content:"";position:absolute;width:70px;height:70px;border-radius:50%;right:-22px;top:-20px;background:var(--cyan);filter:blur(18px);opacity:.25}.section-head{display:flex;justify-content:space-between;align-items:end;gap:16px;margin:18px 0}.section-head h2{font-size:32px;letter-spacing:-1px}.section-head p{color:var(--muted);font-size:14px;margin-top:4px}.store-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.tweak-card{border:1px solid var(--line);background:rgba(255,255,255,.075);backdrop-filter:blur(20px);border-radius:30px;padding:18px;min-height:0;position:relative;overflow:hidden;cursor:pointer;box-shadow:0 20px 70px rgba(0,0,0,.18);transition:.22s;display:flex;flex-direction:column}.tweak-card:hover{transform:translateY(-5px);border-color:rgba(66,232,255,.42);background:rgba(255,255,255,.1)}.tweak-card:before{content:"";position:absolute;width:210px;height:210px;border-radius:50%;right:-80px;top:-90px;background:radial-gradient(circle,var(--accent),transparent 60%);opacity:.25}.visual-row{display:grid;grid-template-columns:74px 1fr;align-items:center;gap:14px;margin-bottom:16px;position:relative;z-index:2}.appicon{width:74px;height:74px;border-radius:23px;display:grid;place-items:center;font-size:32px;font-weight:950;background:linear-gradient(145deg,var(--accent),var(--accent2));box-shadow:0 0 28px rgba(66,232,255,.18)}.mini-motion{height:86px;border-radius:26px;border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.22);display:grid;place-items:center;overflow:hidden;position:relative;min-width:0}.tweak-card h3{position:relative;z-index:2;font-size:19px;line-height:1.15;margin-bottom:10px}.tweak-card p{position:relative;z-index:2;font-size:13px;line-height:1.48;color:#c9d4ee;min-height:0;margin-bottom:28px}.tags{position:relative;z-index:2;display:flex;gap:8px;flex-wrap:wrap;margin:0}.tag{padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.07);color:#dfe7ff;font-size:11px;font-weight:800}.wideDemo{width:100%;height:100%;border-radius:24px;background:rgba(3,7,15,.55);display:grid;place-items:center;overflow:hidden;position:relative}.wideDemo:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,var(--accent),transparent 42%);opacity:.14}.islandGraphic{width:min(150px,72%);height:34px;border-radius:999px;background:#02040a;position:relative;overflow:hidden;box-shadow:0 0 0 2px #05070e,0 0 28px rgba(66,232,255,.18)}.islandGraphic:before{content:"";position:absolute;inset:5px;border-radius:999px;background:linear-gradient(90deg,#ff4fc3,#9d5cff,#42e8ff,#37ff9f,#ffd166,#ff9500,#ff4fc3);background-size:260% 100%;animation:slideColors 3s linear infinite}.islandGraphic:after{content:"";position:absolute;inset:12px 20px;border-radius:999px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.32) 0 6px,transparent 6px 12px);mix-blend-mode:screen;animation:drift 2.2s linear infinite}.batteryGraphic{width:128px;height:48px;border-radius:14px;border:4px solid rgba(255,255,255,.94);position:relative;background:rgba(0,0,0,.16);box-shadow:0 0 30px rgba(255,255,255,.10)}.batteryGraphic:after{content:"";position:absolute;right:-14px;top:14px;width:10px;height:18px;border-radius:0 7px 7px 0;background:rgba(255,255,255,.94)}.batteryGraphic .fill{position:absolute;left:5px;top:5px;width:94px;height:30px;border-radius:8px;background:linear-gradient(90deg,#ff3b30,#34c759,#ff2d95,#af52de,#ff9500,#ff3b30);background-size:260% 100%;animation:slideColors 2.15s linear infinite}.privacyGraphic{width:150px;height:58px;border-radius:16px;position:relative;overflow:hidden;background:linear-gradient(180deg,#dfe8ff,#c7d4f5);transform-origin:center;animation:privacyPanelTilt 3.3s ease-in-out infinite;box-shadow:0 0 26px rgba(157,92,255,.12)}.privacyGraphic:before{content:"";position:absolute;left:16px;top:14px;width:10px;height:10px;border-radius:3px;background:#ff5f7c;box-shadow:20px 0 0 #67d3ff,40px 0 0 #9d5cff,60px 0 0 #41ff9f,80px 0 0 #ffd166,0 20px 0 #7ed7ff,20px 20px 0 #f990c8,40px 20px 0 #89ffac,60px 20px 0 #86b6ff,80px 20px 0 #ff9500}.privacyGraphic:after{content:"";position:absolute;inset:0;background:#05070e;opacity:0;animation:privacyBlank 3.3s ease-in-out infinite}@keyframes privacyPanelTilt{0%,34%{transform:rotate(0deg)}48%,78%{transform:rotate(-8deg) skewX(-5deg)}95%,100%{transform:rotate(0deg)}}@keyframes privacyBlank{0%,34%{opacity:0}48%,78%{opacity:1}95%,100%{opacity:0}}.patternGraphic{width:150px;height:60px;border-radius:16px;background:#050812;position:relative;overflow:hidden}.patternHome{position:absolute;inset:0;background:linear-gradient(180deg,#dfe8ff,#c7d4f5);opacity:0;animation:homeRevealSmall 3s ease-in-out infinite}.patternHome:before{content:"";position:absolute;left:15px;top:14px;width:10px;height:10px;border-radius:3px;background:#ff5f7c;box-shadow:22px 0 0 #67d3ff,44px 0 0 #9d5cff,66px 0 0 #41ff9f,88px 0 0 #ffd166,0 20px 0 #7ed7ff,22px 20px 0 #f990c8,44px 20px 0 #89ffac,66px 20px 0 #86b6ff,88px 20px 0 #ff9500}.patternGraphic svg{position:absolute;inset:0;width:100%;height:100%;z-index:3}.patternGraphic path{stroke:#fff;stroke-width:7;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:300;stroke-dashoffset:300;filter:drop-shadow(0 0 8px rgba(66,232,255,.9)) drop-shadow(0 0 16px rgba(255,79,195,.55));animation:drawProperZSmall 3s ease-in-out infinite}@keyframes drawProperZSmall{0%{stroke-dashoffset:300;opacity:1}58%{stroke-dashoffset:0;opacity:1}70%{stroke-dashoffset:0;opacity:1}86%{stroke-dashoffset:0;opacity:0}100%{stroke-dashoffset:300;opacity:0}}@keyframes homeRevealSmall{0%,58%{opacity:0;transform:scale(.96)}72%,92%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.96)}}.modal{position:fixed;inset:0;z-index:20;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(0,0,0,.68);backdrop-filter:blur(16px)}.modal.active{display:flex}.modal-panel{width:min(540px,100%);border-radius:32px;border:1px solid rgba(255,255,255,.15);background:linear-gradient(180deg,rgba(22,32,62,.98),rgba(8,11,23,.99));box-shadow:0 34px 120px rgba(0,0,0,.64);padding:22px;position:relative;overflow:hidden}.close{position:absolute;right:14px;top:14px;width:40px;height:40px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;font-size:24px;cursor:pointer;z-index:50;line-height:1}.stage{display:none}.stage.active{display:block;animation:pop .38s ease both}@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.modal h2{font-size:28px;letter-spacing:-.9px;margin:8px 0}.modal p{color:var(--muted);line-height:1.45;font-size:14px;margin-bottom:16px}.modal-visual{height:220px;border-radius:26px;background:radial-gradient(circle at 50% 10%,var(--visualA),transparent 36%),linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.10);display:grid;place-items:center;margin-bottom:14px;overflow:hidden;position:relative}.modal-visual .wideDemo{width:min(420px,88%);height:120px;border-radius:36px}.modal-visual .islandGraphic{width:220px;height:48px}.modal-visual .batteryGraphic{width:190px;height:72px;border-width:5px}.modal-visual .batteryGraphic:after{right:-18px;top:21px;width:13px;height:26px}.modal-visual .batteryGraphic .fill{width:138px;height:48px;border-radius:11px}.modal-visual .privacyGraphic{width:250px;height:96px;border-radius:28px}.modal-visual .privacyGraphic:before{left:26px;top:22px;width:15px;height:15px;border-radius:5px;box-shadow:32px 0 0 #67d3ff,64px 0 0 #9d5cff,96px 0 0 #41ff9f,128px 0 0 #ffd166,0 32px 0 #7ed7ff,32px 32px 0 #f990c8,64px 32px 0 #89ffac,96px 32px 0 #86b6ff,128px 32px 0 #ff9500}.modal-visual .patternGraphic{width:250px;height:104px;border-radius:28px}.modal-visual .patternHome:before{left:26px;top:24px;width:15px;height:15px;border-radius:5px;box-shadow:34px 0 0 #67d3ff,68px 0 0 #9d5cff,102px 0 0 #41ff9f,136px 0 0 #ffd166,0 34px 0 #7ed7ff,34px 34px 0 #f990c8,68px 34px 0 #89ffac,102px 34px 0 #86b6ff,136px 34px 0 #ff9500}.modal-visual .patternGraphic path{stroke-width:9;stroke-dasharray:500;stroke-dashoffset:500;animation:drawProperZBig 3.2s ease-in-out infinite}@keyframes drawProperZBig{0%{stroke-dashoffset:500;opacity:1}56%{stroke-dashoffset:0;opacity:1}68%{stroke-dashoffset:0;opacity:1}78%{stroke-dashoffset:0;opacity:0}100%{stroke-dashoffset:500;opacity:0}}.select-wrap{margin:14px 0 16px}label{display:block;color:#dce8ff;font-size:13px;font-weight:900;margin-bottom:8px}select{width:100%;border:1px solid rgba(255,255,255,.13);background:rgba(0,0,0,.32);color:#fff;border-radius:18px;padding:15px;font-size:15px;outline:none}.console{height:250px;overflow:hidden;background:rgba(0,0,0,.44);border:1px solid rgba(66,232,255,.14);border-radius:22px;padding:15px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;line-height:1.65;color:#d6fff0;margin-bottom:15px}.console div{animation:line .18s ease both}@keyframes line{from{opacity:0;transform:translateX(-6px)}}.green{color:var(--green)}.blue{color:var(--cyan)}.yellow{color:var(--yellow)}.progress{height:12px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.bar{width:0;height:100%;background:linear-gradient(90deg,var(--green),var(--cyan),var(--pink));transition:width .55s ease}.last-box{text-align:center;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.07);border-radius:26px;padding:20px}.last-icon{width:76px;height:76px;border-radius:24px;margin:0 auto 14px;display:grid;place-items:center;font-size:36px;background:linear-gradient(145deg,var(--pink),var(--purple),var(--cyan));box-shadow:0 0 34px rgba(66,232,255,.22)}.last-box h3{font-size:24px;margin-bottom:8px}.last-box p{margin-bottom:18px}.locker-btn{width:100%;animation:jump 1.25s ease-in-out infinite}@keyframes jump{0%,100%{transform:translateY(0)}15%{transform:translateY(-8px)}30%{transform:translateY(0)}45%{transform:translateY(-4px)}60%{transform:translateY(0)}}@media(max-width:1080px){.store-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:900px){header{align-items:flex-start;flex-direction:column}.hero{grid-template-columns:1fr}.showcase{order:-1}.hero h1{font-size:44px;letter-spacing:-2px}.modal-visual{height:200px}}@media(max-width:640px){.store-grid{grid-template-columns:1fr}}.tweak-card{min-height:0!important;display:flex!important;flex-direction:column!important;padding-bottom:14px!important}.tweak-card p{min-height:38px!important;margin-bottom:28px!important;display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.tags{margin:0 0 14px!important}html.no-smooth-restore{scroll-behavior:auto!important}.seo-copy{position:relative;z-index:1;margin:38px auto 0;padding:24px;border:1px solid rgba(255,255,255,.10);border-radius:28px;background:rgba(255,255,255,.055);backdrop-filter:blur(18px);color:#c9d4ee}.seo-copy h2{color:#f6f8ff;font-size:24px;margin-bottom:10px;letter-spacing:-.4px}.seo-copy p{color:#aebad6;font-size:14px;line-height:1.65}.live{background:rgba(55,255,159,.11)!important;border-color:rgba(55,255,159,.28)!important}.motion b{line-height:1.2}.locker-btn{gap:14px}.apple-icon{width:28px;height:28px;fill:currentColor;flex:0 0 auto}.locker-btn span{line-height:1}.license-box{display:flex;flex-direction:column;gap:12px;margin-top:16px}.license-label{text-align:left;color:#dce8ff;font-size:13px;font-weight:900;margin-bottom:-4px}.license-input{width:100%;height:54px;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.34);color:#f6f8ff;outline:none;text-align:center;font-size:22px;font-weight:950;letter-spacing:5px;text-transform:uppercase;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}.license-input::placeholder{color:rgba(220,232,255,.34);letter-spacing:4px}.get-license-btn{position:relative!important;overflow:hidden!important;isolation:isolate;animation:licensePulse 1.35s ease-in-out infinite!important}.get-license-btn::before{content:"";position:absolute;top:0;left:-85%;width:58%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.48),transparent);transform:skewX(-18deg);animation:licenseShine 2.2s ease-in-out infinite;z-index:1;pointer-events:none}.get-license-btn span,.get-license-btn svg{position:relative;z-index:2}.activate-license-btn{gap:14px}.activate-license-btn:disabled{opacity:.48;cursor:not-allowed;filter:grayscale(.55);animation:none!important;transform:none!important}.apple-icon{width:26px;height:26px;fill:currentColor;flex:0 0 auto}.license-error{display:none;padding:12px 14px;border-radius:16px;background:rgba(255,88,116,.12);border:1px solid rgba(255,88,116,.26);color:#ff9aad;font-size:13px;font-weight:850}.license-error.show{display:block;animation:errorPop .22s ease both}@keyframes licensePulse{0%,100%{transform:translateY(0) scale(1);box-shadow:0 18px 40px rgba(66,232,255,.18)}45%{transform:translateY(-4px) scale(1.025);box-shadow:0 0 0 1px rgba(55,255,159,.35),0 22px 48px rgba(66,232,255,.32)}}@keyframes licenseShine{0%{left:-85%}45%{left:135%}100%{left:135%}}@keyframes errorPop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.appicon img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}.get-license-btn{background:rgba(255,255,255,.075)!important;color:#eaf2ff!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 30px rgba(0,0,0,.18)!important;transform:none;animation:getLicenseShake 1.3s ease-in-out infinite!important}.get-license-btn::before{display:none!important}.get-license-btn::after{content:"";position:absolute;inset:-2px;border-radius:inherit;background:linear-gradient(120deg,rgba(66,232,255,.0),rgba(66,232,255,.26),rgba(255,79,195,.20),rgba(66,232,255,.0));opacity:0;z-index:-1;animation:getLicenseGlow 1.3s ease-in-out infinite;pointer-events:none}.get-license-btn span{position:relative;z-index:2}.get-license-btn:hover{background:rgba(255,255,255,.105)!important;border-color:rgba(66,232,255,.35)!important}.activate-license-btn,.locker-btn.activate-license-btn{background:linear-gradient(135deg,#42e8ff,#9d5cff,#ff4fc3)!important;color:#fff!important;border:0!important;box-shadow:0 18px 42px rgba(157,92,255,.34)!important}.activate-license-btn:disabled{background:rgba(255,255,255,.10)!important;border:1px solid rgba(255,255,255,.13)!important;color:rgba(255,255,255,.58)!important;box-shadow:none!important}@keyframes getLicenseShake{0%,68%,100%{transform:translateX(0)}72%{transform:translateX(-2px) rotate(-.4deg)}76%{transform:translateX(2px) rotate(.4deg)}80%{transform:translateX(-2px) rotate(-.25deg)}84%{transform:translateX(2px) rotate(.25deg)}88%{transform:translateX(0)}}@keyframes getLicenseGlow{0%,68%,100%{opacity:0}74%,86%{opacity:1}}.last-icon img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}.select-wrap{position:relative}.select-wrap select{appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:52px!important;cursor:pointer}.select-wrap::after{content:"›";position:absolute;right:18px;bottom:16px;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:950;line-height:1;color:#ffffff;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);pointer-events:none;transform:rotate(90deg)}.island-glow-demo{display:grid;place-items:center}.dynamic-island-glow-wrap{width:138px;height:46px;border-radius:999px;position:relative;display:grid;place-items:center}.dynamic-island-glow-ring{position:absolute;inset:0;border-radius:999px;background:linear-gradient(90deg,#ff2d95,#af52de,#007aff,#00f5ff,#34c759,#ffcc00,#ff9500,#ff2d95);background-size:300% 100%;animation:islandGlowMove 2.8s linear infinite;box-shadow:0 0 12px rgba(0,245,255,.45),0 0 26px rgba(255,45,149,.35),0 0 42px rgba(52,199,89,.22)}.dynamic-island-glow-ring::before{content:"";position:absolute;inset:-8px;border-radius:999px;background:inherit;background-size:300% 100%;animation:islandGlowMove 2.8s linear infinite;filter:blur(14px);opacity:.72}.dynamic-island-core{width:128px;height:36px;border-radius:999px;background:#000;position:relative;z-index:2;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 8px 22px rgba(0,0,0,.55)}.dynamic-island-core::after{content:"";position:absolute;left:18px;right:18px;top:5px;height:7px;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent);opacity:.55}@keyframes islandGlowMove{to{background-position:300% 0}}.modal-visual .dynamic-island-glow-wrap{width:220px;height:72px}.modal-visual .dynamic-island-core{width:204px;height:56px}.modal-visual .dynamic-island-glow-ring::before{inset:-12px;filter:blur(20px)}.controlCenterDemo{background:radial-gradient(circle at 50% 0%,rgba(66,232,255,.13),transparent 40%),rgba(3,7,15,.55)}.controlPhonePreview{width:100%;height:100%;position:relative;overflow:hidden;border-radius:24px;background:linear-gradient(160deg,rgba(20,30,60,.35),rgba(5,6,12,.78))}.homeStatus{position:absolute;left:12px;right:12px;top:12px;height:22px;border-radius:999px;background:linear-gradient(90deg,rgba(255,255,255,.08),rgba(255,255,255,.02));opacity:.55}.bottomControlPanel{position:absolute;left:9px;right:9px;bottom:8px;min-height:76px;border-radius:24px;background:linear-gradient(180deg,rgba(32,32,42,.96),rgba(12,12,20,.98));border:1px solid rgba(255,255,255,.10);box-shadow:0 -14px 34px rgba(0,0,0,.38),0 0 28px rgba(66,232,255,.10);padding:10px 10px 9px;transform:translateY(72%);animation:controlDrawerRise 3.2s ease-in-out infinite}.controlHandle{width:38px;height:5px;border-radius:999px;margin:0 auto 9px;background:rgba(255,255,255,.16)}.controlPillRow{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:10px}.ccCircle{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.16);position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.10)}.ccCircle::before{content:"";position:absolute;inset:8px;border-radius:50%;background:#fff;opacity:.95}.ccCircle.wifi,.ccCircle.blue{background:#0a84ff}.ccCircle.green{background:#30d158}.ccCircle.gray{background:rgba(255,255,255,.22)}.ccSliderRow{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:10px}.ccSlider{height:20px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden;position:relative}.ccSlider::before{content:"";position:absolute;left:0;top:0;bottom:0;width:54%;border-radius:999px;background:linear-gradient(90deg,#fff,rgba(255,255,255,.88));animation:ccSliderPulse 3.2s ease-in-out infinite}.ccSlider.volume::before{width:42%}.ccMiniRow{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.ccMiniRow span{height:18px;border-radius:999px;background:rgba(255,255,255,.13)}@keyframes controlDrawerRise{0%,20%{transform:translateY(72%)}42%,74%{transform:translateY(0)}100%{transform:translateY(72%)}}@keyframes ccSliderPulse{0%,25%{width:38%}50%,74%{width:72%}100%{width:38%}}.modal-visual .controlPhonePreview{border-radius:30px}.modal-visual .bottomControlPanel{left:24px;right:24px;bottom:14px;min-height:118px;border-radius:34px;padding:16px 18px 14px}.modal-visual .controlHandle{width:54px;height:7px;margin-bottom:14px}.modal-visual .ccCircle{width:42px;height:42px}.modal-visual .ccCircle::before{inset:13px}.modal-visual .ccSlider{height:30px}.modal-visual .ccMiniRow span{height:28px}.iconRollDemo{perspective:520px;background:radial-gradient(circle at 50% 0%,rgba(255,79,195,.15),transparent 42%),rgba(3,7,15,.55)}.rollHomeScreen{width:100%;height:100%;position:relative;overflow:hidden;border-radius:24px;background:linear-gradient(160deg,rgba(20,28,58,.78),rgba(7,8,16,.96));transform-style:preserve-3d}.rollWidget{position:absolute;left:12px;right:12px;top:10px;height:28px;border-radius:14px;background:linear-gradient(135deg,rgba(66,232,255,.22),rgba(255,79,195,.18));border:1px solid rgba(255,255,255,.10);transform-origin:center;animation:rollWidgetFlip 3.2s ease-in-out infinite}.rollWidget span{position:absolute;left:10px;top:8px;width:36px;height:5px;border-radius:999px;background:rgba(255,255,255,.72)}.rollWidget b{position:absolute;left:10px;top:17px;width:66px;height:4px;border-radius:999px;background:rgba(255,255,255,.35)}.rollWidget i{position:absolute;right:12px;top:8px;width:13px;height:13px;border-radius:50%;background:#ffd166;box-shadow:0 0 14px rgba(255,209,102,.45)}.rollIconGrid{position:absolute;left:14px;right:14px;top:48px;display:grid;grid-template-columns:repeat(4,1fr);gap:9px;transform-style:preserve-3d;animation:rollPageTilt 3.2s ease-in-out infinite}.rollIconGrid span{height:24px;border-radius:8px;background:linear-gradient(145deg,var(--accent),var(--accent2));box-shadow:0 8px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.22);animation:rollIconSpin 3.2s ease-in-out infinite}.rollIconGrid .r1{background:linear-gradient(145deg,#ff3b30,#ff9500);animation-delay:.00s}.rollIconGrid .r2{background:linear-gradient(145deg,#0a84ff,#42e8ff);animation-delay:.04s}.rollIconGrid .r3{background:linear-gradient(145deg,#34c759,#37ff9f);animation-delay:.08s}.rollIconGrid .r4{background:linear-gradient(145deg,#ff2d95,#af52de);animation-delay:.12s}.rollIconGrid .r5{background:linear-gradient(145deg,#ffd166,#ff9500);animation-delay:.16s}.rollIconGrid .r6{background:linear-gradient(145deg,#9d5cff,#42e8ff);animation-delay:.20s}.rollIconGrid .r7{background:linear-gradient(145deg,#30d158,#00f5ff);animation-delay:.24s}.rollIconGrid .r8{background:linear-gradient(145deg,#fff,#9ca8c6);animation-delay:.28s}.rollDock{position:absolute;left:13px;right:13px;bottom:8px;height:26px;border-radius:18px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.10);display:flex;justify-content:space-around;align-items:center;backdrop-filter:blur(10px);transform-origin:center bottom;animation:rollDockTilt 3.2s ease-in-out infinite}.rollDock span{width:20px;height:20px;border-radius:7px;background:linear-gradient(145deg,#37ff9f,#42e8ff);box-shadow:0 8px 16px rgba(0,0,0,.22)}.rollDock span:nth-child(2){background:linear-gradient(145deg,#ff4fc3,#9d5cff)}.rollDock span:nth-child(3){background:linear-gradient(145deg,#ffd166,#ff9500)}@keyframes rollPageTilt{0%,20%{transform:translateX(0) rotateY(0deg) rotateZ(0deg)}42%,72%{transform:translateX(-8px) rotateY(34deg) rotateZ(-6deg)}100%{transform:translateX(0) rotateY(0deg) rotateZ(0deg)}}@keyframes rollIconSpin{0%,20%{transform:rotateY(0deg) rotateZ(0deg) scale(1)}42%,72%{transform:rotateY(180deg) rotateZ(-16deg) scale(.92)}100%{transform:rotateY(360deg) rotateZ(0deg) scale(1)}}@keyframes rollWidgetFlip{0%,20%{transform:rotateZ(0deg) rotateX(0deg)}42%,72%{transform:rotateZ(-6deg) rotateX(12deg)}100%{transform:rotateZ(0deg) rotateX(0deg)}}@keyframes rollDockTilt{0%,20%{transform:rotateZ(0deg) translateY(0)}42%,72%{transform:rotateZ(3deg) translateY(2px)}100%{transform:rotateZ(0deg) translateY(0)}}.modal-visual .rollWidget{left:34px;right:34px;top:22px;height:46px;border-radius:22px}.modal-visual .rollWidget span{width:76px;height:7px;top:13px;left:18px}.modal-visual .rollWidget b{width:130px;height:6px;top:28px;left:18px}.modal-visual .rollWidget i{width:20px;height:20px;right:20px;top:13px}.modal-visual .rollIconGrid{left:38px;right:38px;top:88px;gap:16px}.modal-visual .rollIconGrid span{height:46px;border-radius:15px}.modal-visual .rollDock{left:42px;right:42px;bottom:18px;height:48px;border-radius:26px}.modal-visual .rollDock span{width:36px;height:36px;border-radius:13px}.iconRollDemo{perspective:620px;background:radial-gradient(circle at 50% 0%,rgba(255,79,195,.15),transparent 42%),rgba(3,7,15,.55)}.rollScene{width:100%;height:100%;position:relative;overflow:hidden;border-radius:24px;background:radial-gradient(circle at 68% 30%,rgba(255,79,195,.32),transparent 38%),radial-gradient(circle at 28% 72%,rgba(66,232,255,.22),transparent 44%),linear-gradient(160deg,#0e1428,#050712 70%);transform-style:preserve-3d}.rollWallpaper{position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.04) 35%,transparent 48%);opacity:.7}.rollPage{position:absolute;left:10px;right:10px;top:10px;bottom:30px;transform-style:preserve-3d;transform-origin:50% 55%;will-change:transform,opacity}.rollPageA{animation:homePageRollA 4.2s ease-in-out infinite}.rollPageB{opacity:0;transform:translateX(72%) rotateZ(16deg) rotateY(-72deg) scale(.88);animation:homePageRollB 4.2s ease-in-out infinite}.rollWeather{position:absolute;left:6px;right:6px;top:4px;height:34px;border-radius:14px;background:linear-gradient(180deg,rgba(88,117,170,.92),rgba(155,134,150,.76));border:1px solid rgba(255,255,255,.12);box-shadow:0 10px 22px rgba(0,0,0,.20);transform:translateZ(18px)}.rollWeather b{position:absolute;left:12px;top:3px;font-size:18px;line-height:1;color:#fff}.rollWeather span{position:absolute;right:12px;top:11px;font-size:8px;font-weight:900;color:rgba(255,255,255,.86)}.rollIcons{position:absolute;left:11px;right:11px;top:50px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;transform-style:preserve-3d}.rollIcons.second{top:24px}.rollIcons span{height:26px;border-radius:8px;position:relative;box-shadow:0 10px 16px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.28);transform:translateZ(28px);will-change:transform;animation:individualIconRoll 4.2s ease-in-out infinite}.rollIcons span::after{content:"";position:absolute;left:18%;right:18%;bottom:-9px;height:4px;border-radius:999px;background:rgba(255,255,255,.72);opacity:.72}.rollIcons span:nth-child(1){animation-delay:.00s}.rollIcons span:nth-child(2){animation-delay:.04s}.rollIcons span:nth-child(3){animation-delay:.08s}.rollIcons span:nth-child(4){animation-delay:.12s}.rollIcons .settings{background:radial-gradient(circle,#fff 22%,#7f8490 23%,#dfe2e8 54%,#9ca1aa)}.rollIcons .appstore{background:linear-gradient(145deg,#16c8ff,#007aff)}.rollIcons .messages{background:linear-gradient(145deg,#43ff72,#18c84f)}.rollIcons .youtube{background:linear-gradient(145deg,#fff,#f5f5f5)}.rollIcons .youtube::before{content:"";position:absolute;inset:8px 7px;border-radius:5px;background:#ff0033}.rollIcons .gmail{background:linear-gradient(145deg,#fff,#e9eef8)}.rollIcons .gmail::before{content:"";position:absolute;inset:8px;border-radius:3px;background:#ea4335}.rollIcons .music{background:linear-gradient(145deg,#ff4fc3,#ff2d55)}.rollIcons .books{background:linear-gradient(145deg,#ff7a00,#ffcc00)}.rollIcons .files{background:linear-gradient(145deg,#63d5ff,#1d9bf0)}.rollDock{position:absolute;left:12px;right:12px;bottom:7px;height:24px;border-radius:17px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-around;align-items:center;backdrop-filter:blur(10px);box-shadow:0 -8px 20px rgba(0,0,0,.24);z-index:6}.rollDock span{width:19px;height:19px;border-radius:7px;background:linear-gradient(145deg,#37ff9f,#19c453);box-shadow:0 7px 12px rgba(0,0,0,.22)}.rollDock span:nth-child(2){background:linear-gradient(145deg,#fff,#f2f2f2)}.rollDock span:nth-child(3){background:linear-gradient(145deg,#34c759,#00d45f)}.rollDock span:nth-child(4){background:linear-gradient(145deg,#5fd2ff,#007aff)}.rollDots{position:absolute;left:50%;bottom:37px;transform:translateX(-50%);display:flex;gap:4px;z-index:8}.rollDots i{width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.32)}.rollDots i:first-child{background:#fff;animation:rollDotSwapA 4.2s ease-in-out infinite}.rollDots i:last-child{animation:rollDotSwapB 4.2s ease-in-out infinite}@keyframes homePageRollA{0%,18%{transform:translateX(0) rotateZ(0deg) rotateY(0deg) scale(1);opacity:1}38%,63%{transform:translateX(-55%) rotateZ(-24deg) rotateY(68deg) scale(.86);opacity:.96}73%,100%{transform:translateX(0) rotateZ(0deg) rotateY(0deg) scale(1);opacity:1}}@keyframes homePageRollB{0%,18%{transform:translateX(70%) rotateZ(22deg) rotateY(-72deg) scale(.84);opacity:0}38%,63%{transform:translateX(0) rotateZ(0deg) rotateY(0deg) scale(1);opacity:1}73%,100%{transform:translateX(70%) rotateZ(22deg) rotateY(-72deg) scale(.84);opacity:0}}@keyframes individualIconRoll{0%,18%{transform:translateZ(28px) rotateY(0deg) rotateZ(0deg)}38%,63%{transform:translateZ(36px) rotateY(360deg) rotateZ(-14deg)}73%,100%{transform:translateZ(28px) rotateY(0deg) rotateZ(0deg)}}@keyframes rollDotSwapA{0%,28%,100%{opacity:1}40%,65%{opacity:.32}}@keyframes rollDotSwapB{0%,28%,100%{opacity:.32}40%,65%{opacity:1;background:#fff}}.modal-visual .rollPage{left:28px;right:28px;top:22px;bottom:62px}.modal-visual .rollWeather{height:62px;border-radius:24px}.modal-visual .rollWeather b{left:22px;top:8px;font-size:36px}.modal-visual .rollWeather span{right:22px;top:24px;font-size:14px}.modal-visual .rollIcons{left:16px;right:16px;top:84px;gap:20px}.modal-visual .rollIcons.second{top:52px}.modal-visual .rollIcons span{height:56px;border-radius:17px}.modal-visual .rollIcons span::after{bottom:-18px;height:7px}.modal-visual .rollDock{left:44px;right:44px;bottom:18px;height:48px;border-radius:28px}.modal-visual .rollDock span{width:36px;height:36px;border-radius:13px}.modal-visual .rollDots{bottom:76px}.iconRollDemo{perspective:720px;background:radial-gradient(circle at 24% 20%,rgba(255,79,195,.18),transparent 38%),radial-gradient(circle at 82% 70%,rgba(66,232,255,.16),transparent 42%),rgba(3,7,15,.55)}.rollOnlyScene{width:100%;height:100%;position:relative;overflow:hidden;border-radius:24px;background:linear-gradient(155deg,#101831,#070914 72%);transform-style:preserve-3d}.rollPageIcons{position:absolute;left:12px;right:12px;top:13px;bottom:13px;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:10px;transform-style:preserve-3d;will-change:transform,opacity}.rollPageIcons span{border-radius:9px;position:relative;box-shadow:0 10px 18px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.30);transform-style:preserve-3d;will-change:transform,filter;animation:rollIconCubeSpin 3.6s ease-in-out infinite}.rollPageIcons span::before{content:"";position:absolute;left:20%;right:20%;top:24%;height:20%;border-radius:999px;background:rgba(255,255,255,.30)}.rollPageIcons span::after{content:"";position:absolute;left:18%;right:18%;bottom:-8px;height:4px;border-radius:999px;background:rgba(255,255,255,.55);opacity:.55}.pageOne{animation:rollScreenOut 3.6s ease-in-out infinite}.pageTwo{animation:rollScreenIn 3.6s ease-in-out infinite}.pageOne span:nth-child(1),.pageTwo span:nth-child(1){animation-delay:.00s}.pageOne span:nth-child(2),.pageTwo span:nth-child(2){animation-delay:.04s}.pageOne span:nth-child(3),.pageTwo span:nth-child(3){animation-delay:.08s}.pageOne span:nth-child(4),.pageTwo span:nth-child(4){animation-delay:.12s}.pageOne span:nth-child(5),.pageTwo span:nth-child(5){animation-delay:.16s}.pageOne span:nth-child(6),.pageTwo span:nth-child(6){animation-delay:.20s}.pageOne span:nth-child(7),.pageTwo span:nth-child(7){animation-delay:.24s}.pageOne span:nth-child(8),.pageTwo span:nth-child(8){animation-delay:.28s}.pageOne span:nth-child(9),.pageTwo span:nth-child(9){animation-delay:.32s}.pageOne span:nth-child(10),.pageTwo span:nth-child(10){animation-delay:.36s}.pageOne span:nth-child(11),.pageTwo span:nth-child(11){animation-delay:.40s}.pageOne span:nth-child(12),.pageTwo span:nth-child(12){animation-delay:.44s}.i1{background:linear-gradient(145deg,#ff3b30,#ff9500)}.i2{background:linear-gradient(145deg,#0a84ff,#42e8ff)}.i3{background:linear-gradient(145deg,#34c759,#37ff9f)}.i4{background:linear-gradient(145deg,#ff2d95,#af52de)}.i5{background:linear-gradient(145deg,#ffd166,#ff9500)}.i6{background:linear-gradient(145deg,#9d5cff,#42e8ff)}.i7{background:linear-gradient(145deg,#30d158,#00f5ff)}.i8{background:linear-gradient(145deg,#ffffff,#9ca8c6)}.i9{background:linear-gradient(145deg,#ff4fc3,#ff2d55)}.i10{background:linear-gradient(145deg,#5ac8fa,#007aff)}.i11{background:linear-gradient(145deg,#ffcc00,#ff9500)}.i12{background:linear-gradient(145deg,#bf5af2,#64d2ff)}.i13{background:linear-gradient(145deg,#64d2ff,#5e5ce6)}.i14{background:linear-gradient(145deg,#ff9f0a,#ffd60a)}.i15{background:linear-gradient(145deg,#30d158,#00c7be)}.i16{background:linear-gradient(145deg,#ff375f,#ff2d95)}.i17{background:linear-gradient(145deg,#0a84ff,#64d2ff)}.i18{background:linear-gradient(145deg,#bf5af2,#ff4fc3)}.i19{background:linear-gradient(145deg,#ffffff,#c7d4f5)}.i20{background:linear-gradient(145deg,#32d74b,#34c759)}.i21{background:linear-gradient(145deg,#ff453a,#ff9f0a)}.i22{background:linear-gradient(145deg,#7d7aff,#42e8ff)}.i23{background:linear-gradient(145deg,#ffd166,#fff)}.i24{background:linear-gradient(145deg,#00f5ff,#37ff9f)}.rollSwipeGlow{position:absolute;top:0;bottom:0;width:48px;left:50%;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent);filter:blur(8px);opacity:0;animation:rollSwipeFlash 3.6s ease-in-out infinite;pointer-events:none}@keyframes rollScreenOut{0%,18%{transform:translateX(0) rotateY(0deg) rotateZ(0deg) scale(1);opacity:1}42%,64%{transform:translateX(-74%) rotateY(76deg) rotateZ(-20deg) scale(.88);opacity:.45}78%,100%{transform:translateX(0) rotateY(0deg) rotateZ(0deg) scale(1);opacity:1}}@keyframes rollScreenIn{0%,18%{transform:translateX(76%) rotateY(-76deg) rotateZ(20deg) scale(.88);opacity:.45}42%,64%{transform:translateX(0) rotateY(0deg) rotateZ(0deg) scale(1);opacity:1}78%,100%{transform:translateX(76%) rotateY(-76deg) rotateZ(20deg) scale(.88);opacity:.45}}@keyframes rollIconCubeSpin{0%,18%{transform:rotateY(0deg) rotateZ(0deg) translateZ(0);filter:brightness(1)}42%,64%{transform:rotateY(360deg) rotateZ(-18deg) translateZ(24px);filter:brightness(1.18)}78%,100%{transform:rotateY(0deg) rotateZ(0deg) translateZ(0);filter:brightness(1)}}@keyframes rollSwipeFlash{0%,22%,78%,100%{opacity:0;transform:translateX(-90px)}40%,62%{opacity:.9;transform:translateX(35px)}}.modal-visual .rollPageIcons{left:52px;right:52px;top:28px;bottom:28px;gap:18px}.modal-visual .rollPageIcons span{border-radius:17px}.modal-visual .rollPageIcons span::after{bottom:-15px;height:7px}.modal-visual .rollSwipeGlow{width:76px}.sideShortcutDemo{background:radial-gradient(circle at 90% 28%,rgba(66,232,255,.18),transparent 36%),radial-gradient(circle at 40% 78%,rgba(157,92,255,.16),transparent 42%),rgba(3,7,15,.55)}.sideHomeScreen{width:100%;height:100%;position:relative;overflow:hidden;border-radius:24px;background:radial-gradient(circle at 60% 40%,rgba(255,79,195,.32),transparent 36%),radial-gradient(circle at 32% 72%,rgba(66,232,255,.18),transparent 42%),linear-gradient(160deg,#111a34,#060812 72%)}.sideWeatherCard{position:absolute;left:10px;right:28px;top:10px;height:28px;border-radius:13px;background:linear-gradient(135deg,rgba(88,117,170,.86),rgba(45,56,88,.82));border:1px solid rgba(255,255,255,.10);box-shadow:0 10px 22px rgba(0,0,0,.18);opacity:.92}.sideWeatherCard b{position:absolute;left:10px;top:4px;font-size:14px;line-height:1;color:#fff}.sideWeatherCard span{position:absolute;left:48px;right:42px;top:9px;height:5px;border-radius:999px;background:rgba(255,255,255,.26);box-shadow:0 9px 0 rgba(255,255,255,.16)}.sideWeatherCard i{position:absolute;right:11px;top:8px;width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.7)}.sideHomeIcons{position:absolute;left:12px;top:50px;right:48px;display:grid;grid-template-columns:repeat(4,1fr);gap:9px;transition:.2s;animation:sideIconsNudge 4s ease-in-out infinite}.sideHomeIcons span{height:24px;border-radius:8px;box-shadow:0 8px 16px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.22)}.sideHomeIcons .s1{background:linear-gradient(145deg,#8e8e93,#d1d1d6)}.sideHomeIcons .s2{background:linear-gradient(145deg,#0a84ff,#42e8ff)}.sideHomeIcons .s3{background:linear-gradient(145deg,#34c759,#37ff9f)}.sideHomeIcons .s4{background:linear-gradient(145deg,#ff0033,#ff4fc3)}.sideShortcutRail{position:absolute;top:34px;right:7px;width:34px;height:84px;border-radius:20px;background:linear-gradient(180deg,rgba(36,36,45,.98),rgba(11,11,18,.98));border:1px solid rgba(255,255,255,.10);box-shadow:-14px 0 34px rgba(0,0,0,.34),0 0 24px rgba(66,232,255,.10);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;transform:translateX(80%);opacity:.28;animation:sideRailSlide 4s ease-in-out infinite}.sideShortcutRail em{position:absolute;left:-7px;top:50%;width:5px;height:30px;transform:translateY(-50%);border-radius:999px 0 0 999px;background:rgba(255,255,255,.26)}.sideShortcutRail span{width:22px;height:22px;border-radius:8px;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 14px rgba(0,0,0,.24)}.sideShortcutRail .sr1{background:linear-gradient(145deg,#8e8e93,#3a3a3c)}.sideShortcutRail .sr2{background:linear-gradient(145deg,#00f5ff,#0a84ff)}.sideShortcutRail .sr3{background:linear-gradient(145deg,#34c759,#30d158)}.sideShortcutRail .sr4{background:linear-gradient(145deg,#48484a,#1c1c1e)}.sideMediaPanel{position:absolute;top:38px;right:7px;width:42px;height:86px;border-radius:21px;background:linear-gradient(180deg,rgba(35,35,43,.98),rgba(12,12,18,.98));border:1px solid rgba(255,255,255,.10);box-shadow:-16px 0 36px rgba(0,0,0,.40),0 0 26px rgba(255,79,195,.12);opacity:0;transform:translateX(78%) scale(.96);animation:sideMediaExpand 4s ease-in-out infinite}.sideMediaPanel b{position:absolute;top:12px;left:50%;width:16px;height:16px;transform:translateX(-50%);border-radius:5px;background:rgba(255,255,255,.16)}.sideMediaPanel i{position:absolute;top:35px;left:50%;width:0;height:0;transform:translateX(-38%);border-left:10px solid rgba(255,255,255,.9);border-top:7px solid transparent;border-bottom:7px solid transparent}.sideMediaPanel small{position:absolute;left:50%;bottom:12px;width:6px;height:34px;transform:translateX(-50%);border-radius:999px;background:linear-gradient(180deg,#fff 58%,rgba(255,255,255,.20) 58%);box-shadow:0 0 0 1px rgba(255,255,255,.08)}@keyframes sideRailSlide{0%,18%{transform:translateX(80%);opacity:.28}32%,52%{transform:translateX(0);opacity:1}65%,78%{transform:translateX(0);opacity:0}100%{transform:translateX(80%);opacity:.28}}@keyframes sideMediaExpand{0%,50%{transform:translateX(78%) scale(.96);opacity:0}64%,82%{transform:translateX(0) scale(1);opacity:1}100%{transform:translateX(78%) scale(.96);opacity:0}}@keyframes sideIconsNudge{0%,18%{transform:translateX(0)}32%,82%{transform:translateX(-9px)}100%{transform:translateX(0)}}.modal-visual .sideWeatherCard{left:34px;right:78px;top:26px;height:54px;border-radius:24px}.modal-visual .sideWeatherCard b{left:22px;top:10px;font-size:28px}.modal-visual .sideWeatherCard span{left:92px;right:58px;top:18px;height:8px;box-shadow:0 16px 0 rgba(255,255,255,.16)}.modal-visual .sideWeatherCard i{width:21px;height:21px;right:24px;top:15px}.modal-visual .sideHomeIcons{left:36px;right:106px;top:104px;gap:18px}.modal-visual .sideHomeIcons span{height:52px;border-radius:17px}.modal-visual .sideShortcutRail{right:24px;top:70px;width:64px;height:170px;border-radius:34px;gap:14px}.modal-visual .sideShortcutRail em{left:-10px;width:7px;height:54px}.modal-visual .sideShortcutRail span{width:42px;height:42px;border-radius:15px}.modal-visual .sideMediaPanel{right:24px;top:76px;width:76px;height:164px;border-radius:38px}.modal-visual .sideMediaPanel b{top:22px;width:30px;height:30px;border-radius:10px}.modal-visual .sideMediaPanel i{top:66px;border-left-width:18px;border-top-width:12px;border-bottom-width:12px}.modal-visual .sideMediaPanel small{bottom:22px;width:9px;height:66px}

/* ===== Modal phone preview upgrade ===== */
.modal-visual{height:340px;border-radius:30px;background:radial-gradient(circle at 50% 0%,var(--visualA),transparent 40%),linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.10);display:grid;place-items:center;margin-bottom:14px;overflow:hidden;position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.modal-visual .wideDemo{width:100%;height:100%;border-radius:0;background:transparent}
.phonePreviewStage{width:100%;height:100%;position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.modalPhoneShell{width:246px;height:470px;border-radius:42px;background:linear-gradient(180deg,#1a2133,#090d16);border:1px solid rgba(255,255,255,.12);padding:7px;box-shadow:0 28px 80px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.03) inset;position:relative;overflow:hidden}
.modalPhoneShell:before{content:"";position:absolute;inset:3px;border-radius:39px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);pointer-events:none}
.modalPhoneShell.top{transform:translateY(138px)}
.modalPhoneShell.bottom{transform:translateY(-130px)}
.modalPhoneScreen{width:100%;height:100%;border-radius:35px;position:relative;overflow:hidden;background:radial-gradient(circle at 50% -8%,rgba(66,232,255,.20),transparent 30%),radial-gradient(circle at 88% 18%,rgba(255,79,195,.16),transparent 28%),radial-gradient(circle at 18% 88%,rgba(157,92,255,.16),transparent 32%),linear-gradient(160deg,#0d1323,#050811 72%)}
.theme-battery .modalPhoneScreen{background:radial-gradient(circle at 78% 8%,rgba(255,149,0,.16),transparent 28%),radial-gradient(circle at 16% 86%,rgba(55,255,159,.14),transparent 30%),linear-gradient(160deg,#0d1323,#050811 72%)}
.theme-control .modalPhoneScreen{background:radial-gradient(circle at 50% 88%,rgba(66,232,255,.20),transparent 30%),radial-gradient(circle at 18% 26%,rgba(157,92,255,.15),transparent 32%),linear-gradient(160deg,#0d1323,#050811 72%)}
.theme-privacy .modalPhoneScreen{background:radial-gradient(circle at 82% 16%,rgba(255,79,195,.18),transparent 28%),radial-gradient(circle at 18% 86%,rgba(66,232,255,.14),transparent 32%),linear-gradient(160deg,#0d1323,#050811 72%)}
.modalPhoneIsland{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:96px;height:26px;border-radius:999px;background:#05070b;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 22px rgba(0,0,0,.55);z-index:5}
.glowIslandWrap{background:transparent;box-shadow:none;width:140px;height:46px;top:12px}
.glowIslandRing{position:absolute;inset:0;border-radius:999px;background:linear-gradient(90deg,#ff2d95,#af52de,#007aff,#00f5ff,#34c759,#ffcc00,#ff9500,#ff2d95);background-size:300% 100%;animation:islandGlowMove 2.8s linear infinite;box-shadow:0 0 12px rgba(0,245,255,.45),0 0 26px rgba(255,45,149,.35),0 0 42px rgba(52,199,89,.22)}
.glowIslandRing:before{content:"";position:absolute;inset:-8px;border-radius:999px;background:inherit;background-size:300% 100%;animation:islandGlowMove 2.8s linear infinite;filter:blur(14px);opacity:.72}
.glowIslandCore{position:absolute;left:50%;top:50%;width:130px;height:36px;border-radius:999px;background:#000;transform:translate(-50%,-50%);z-index:2;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 8px 22px rgba(0,0,0,.55)}
.glowIslandCore:after{content:"";position:absolute;left:18px;right:18px;top:5px;height:7px;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent);opacity:.55}
@keyframes islandGlowMove{to{background-position:300% 0}}
.modalIconGrid{position:absolute;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.topIcons{left:30px;right:30px;top:96px}
.topIcons.lowerShift{top:110px}
.modalIconGrid span,.bottomDockPreview span{height:42px;border-radius:14px;box-shadow:0 10px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.22)}
.simpleIcons .c1,.privacyIcons .c1,.sidebarIcons .c1,.patternUnlockedIcons .c1,.rollModalPage .i1,.rollModalPage .i13,.bottomDockPreview .d1{background:linear-gradient(145deg,#8e8e93,#d1d1d6)}
.simpleIcons .c2,.privacyIcons .c2,.sidebarIcons .c2,.patternUnlockedIcons .c2,.rollModalPage .i2,.rollModalPage .i14,.bottomDockPreview .d2{background:linear-gradient(145deg,#0a84ff,#67d3ff)}
.simpleIcons .c3,.privacyIcons .c3,.sidebarIcons .c3,.patternUnlockedIcons .c3,.rollModalPage .i3,.rollModalPage .i15,.bottomDockPreview .d3{background:linear-gradient(145deg,#34c759,#89ffac)}
.simpleIcons .c4,.privacyIcons .c4,.sidebarIcons .c4,.patternUnlockedIcons .c4,.rollModalPage .i4,.rollModalPage .i16,.bottomDockPreview .d4{background:linear-gradient(145deg,#ff375f,#ff6ea8)}
.simpleIcons .c5,.privacyIcons .c5,.sidebarIcons .c5,.patternUnlockedIcons .c5,.rollModalPage .i5,.rollModalPage .i17{background:linear-gradient(145deg,#ffd166,#ffb347)}
.simpleIcons .c6,.privacyIcons .c6,.sidebarIcons .c6,.patternUnlockedIcons .c6,.rollModalPage .i6,.rollModalPage .i18{background:linear-gradient(145deg,#67d3ff,#86b6ff)}
.simpleIcons .c7,.privacyIcons .c7,.sidebarIcons .c7,.patternUnlockedIcons .c7,.rollModalPage .i7,.rollModalPage .i19{background:linear-gradient(145deg,#9d5cff,#af52de)}
.simpleIcons .c8,.privacyIcons .c8,.sidebarIcons .c8,.patternUnlockedIcons .c8,.rollModalPage .i8,.rollModalPage .i20{background:linear-gradient(145deg,#37ff9f,#6ae8b4)}
.simpleIcons .c9,.privacyIcons .c9,.rollModalPage .i9,.rollModalPage .i21{background:linear-gradient(145deg,#ff9500,#ffcc00)}
.simpleIcons .c10,.privacyIcons .c10,.rollModalPage .i10,.rollModalPage .i22{background:linear-gradient(145deg,#5ac8fa,#42e8ff)}
.simpleIcons .c11,.privacyIcons .c11,.rollModalPage .i11,.rollModalPage .i23{background:linear-gradient(145deg,#5856d6,#8e8cfb)}
.simpleIcons .c12,.privacyIcons .c12,.rollModalPage .i12,.rollModalPage .i24{background:linear-gradient(145deg,#ff2d55,#ff6b7d)}
.statusBatteryWrap{position:absolute;right:18px;top:20px;z-index:6}
.statusBattery{width:42px;height:18px;border:2px solid rgba(255,255,255,.94);border-radius:6px;position:relative;background:rgba(255,255,255,.06);box-shadow:0 0 18px rgba(255,255,255,.10)}
.statusBattery:after{content:"";position:absolute;right:-5px;top:4px;width:3px;height:8px;border-radius:0 2px 2px 0;background:rgba(255,255,255,.92)}
.statusBatteryFill{position:absolute;left:2px;top:2px;width:30px;height:10px;border-radius:3px;background:linear-gradient(90deg,#ff375f,#34c759,#ff4fc3,#9d5cff,#ff9500);background-size:300% 100%;animation:batteryShift 3s linear infinite;box-shadow:0 0 18px rgba(66,232,255,.22)}
@keyframes batteryShift{0%{background-position:0 0}100%{background-position:300% 0}}
.privacySceneWrap{position:absolute;inset:0;animation:privacyTilt 3.2s ease-in-out infinite;transform-style:preserve-3d}
.privacyBlanker{position:absolute;inset:82px 18px 32px;border-radius:28px;background:rgba(240,243,250,.95);backdrop-filter:blur(2px);opacity:0;box-shadow:0 22px 48px rgba(0,0,0,.25)}
@keyframes privacyTilt{0%,22%{transform:rotate(0)}26%,42%{transform:rotate(-8deg)}46%,72%{transform:rotate(8deg)}76%,100%{transform:rotate(0)}}
@keyframes privacyHide{0%,22%{opacity:0}26%,72%{opacity:1}76%,100%{opacity:0}}
.privacyBlanker{animation:privacyHide 3.2s ease-in-out infinite}
.patternLockStage{position:absolute;inset:0}
.patternLockMeta{position:absolute;left:0;right:0;top:62px;text-align:center;z-index:2}
.patternLockMeta b{display:block;font-size:34px;letter-spacing:-1px;color:#fff;margin-bottom:5px}
.patternLockMeta span{font-size:13px;color:#d4ddf7}
.patternZSvg{position:absolute;left:28px;right:28px;top:98px;height:150px;overflow:visible}
.patternZSvg path{fill:none;stroke:url(#noop);stroke:#ffffff;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:360;stroke-dashoffset:360;filter:drop-shadow(0 0 16px rgba(66,232,255,.35));animation:drawZ 3s ease-in-out infinite}
@keyframes drawZ{0%,12%{stroke-dashoffset:360;opacity:.35}40%,65%{stroke-dashoffset:0;opacity:1}85%,100%{stroke-dashoffset:0;opacity:0}}
.patternUnlockedIcons{position:absolute;left:34px;right:34px;bottom:54px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;opacity:0;transform:translateY(10px);animation:showUnlocked 3s ease-in-out infinite}
.patternUnlockedIcons span{height:38px;border-radius:14px;box-shadow:0 10px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.22)}
@keyframes showUnlocked{0%,64%{opacity:0;transform:translateY(10px)}75%,100%{opacity:1;transform:translateY(0)}}
.rollModalScene{position:absolute;left:18px;right:18px;top:94px;bottom:28px;overflow:hidden}
.rollModalPage{position:absolute;left:0;top:0;width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;animation-duration:3.2s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}
.rollModalPage span{height:40px;border-radius:14px;box-shadow:0 10px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.22)}
.rollModalPage.pageOne{animation-name:rollPageOne}
.rollModalPage.pageTwo{animation-name:rollPageTwo;transform:translateX(110%) rotateY(-70deg)}
@keyframes rollPageOne{0%,28%{transform:translateX(0) rotateY(0);opacity:1}52%,78%{transform:translateX(-108%) rotateY(70deg);opacity:.35}100%{transform:translateX(0) rotateY(0);opacity:1}}
@keyframes rollPageTwo{0%,28%{transform:translateX(108%) rotateY(-70deg);opacity:.35}52%,78%{transform:translateX(0) rotateY(0);opacity:1}100%{transform:translateX(108%) rotateY(-70deg);opacity:.35}}
.sidebarModalScene{position:absolute;inset:0}
.sidebarMiniWidget{position:absolute;left:22px;right:54px;top:66px;height:44px;border-radius:20px;background:linear-gradient(135deg,rgba(88,117,170,.86),rgba(45,56,88,.82));border:1px solid rgba(255,255,255,.10);box-shadow:0 10px 22px rgba(0,0,0,.18);opacity:.92}
.sidebarMiniWidget b{position:absolute;left:16px;top:7px;font-size:24px;line-height:1;color:#fff}.sidebarMiniWidget span{position:absolute;left:84px;right:56px;top:13px;height:6px;border-radius:999px;background:rgba(255,255,255,.26);box-shadow:0 12px 0 rgba(255,255,255,.16)}.sidebarMiniWidget i{position:absolute;right:16px;top:11px;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.7)}
.sidebarIcons{left:26px;right:72px;top:128px;gap:14px}
.sidebarShortcutRail{position:absolute;top:102px;right:16px;width:56px;height:164px;border-radius:28px;background:linear-gradient(180deg,rgba(36,36,45,.98),rgba(11,11,18,.98));border:1px solid rgba(255,255,255,.10);box-shadow:-14px 0 34px rgba(0,0,0,.34),0 0 24px rgba(66,232,255,.10);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;transform:translateX(80%);opacity:.28;animation:sideRailSlide 4s ease-in-out infinite}
.sidebarShortcutRail em{position:absolute;left:-8px;top:50%;width:6px;height:42px;transform:translateY(-50%);border-radius:999px 0 0 999px;background:rgba(255,255,255,.26)}
.sidebarShortcutRail span{width:36px;height:36px;border-radius:13px;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 14px rgba(0,0,0,.24)}
.sidebarShortcutRail .s1{background:linear-gradient(145deg,#8e8e93,#3a3a3c)}.sidebarShortcutRail .s2{background:linear-gradient(145deg,#00f5ff,#0a84ff)}.sidebarShortcutRail .s3{background:linear-gradient(145deg,#34c759,#30d158)}.sidebarShortcutRail .s4{background:linear-gradient(145deg,#48484a,#1c1c1e)}
.sidebarMediaPanel{position:absolute;top:104px;right:16px;width:70px;height:160px;border-radius:34px;background:linear-gradient(180deg,rgba(35,35,43,.98),rgba(12,12,18,.98));border:1px solid rgba(255,255,255,.10);box-shadow:-16px 0 36px rgba(0,0,0,.40),0 0 26px rgba(255,79,195,.12);opacity:0;transform:translateX(78%) scale(.96);animation:sideMediaExpand 4s ease-in-out infinite}
.sidebarMediaPanel b{position:absolute;top:20px;left:50%;width:26px;height:26px;transform:translateX(-50%);border-radius:9px;background:rgba(255,255,255,.16)}.sidebarMediaPanel i{position:absolute;top:62px;left:50%;width:0;height:0;transform:translateX(-38%);border-left:16px solid rgba(255,255,255,.9);border-top:10px solid transparent;border-bottom:10px solid transparent}.sidebarMediaPanel small{position:absolute;left:50%;bottom:20px;width:8px;height:60px;transform:translateX(-50%);border-radius:999px;background:linear-gradient(180deg,#fff 58%,rgba(255,255,255,.20) 58%);box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.controlBottomStage{position:absolute;inset:0}
.bottomDockPreview{position:absolute;left:18px;right:18px;bottom:96px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;opacity:.92}
.bottomDockPreview span{height:40px;border-radius:16px}
.bottomHomeBar{position:absolute;left:50%;bottom:24px;width:110px;height:5px;border-radius:999px;background:rgba(255,255,255,.95);transform:translateX(-50%)}
.bottomControlDrawer{position:absolute;left:18px;right:18px;bottom:20px;min-height:176px;border-radius:32px 32px 0 0;background:linear-gradient(180deg,rgba(32,32,42,.98),rgba(12,12,20,.99));border:1px solid rgba(255,255,255,.10);box-shadow:0 -20px 40px rgba(0,0,0,.42),0 0 28px rgba(66,232,255,.10);padding:14px 14px 14px;transform:translateY(84%);animation:controlDrawerRiseLarge 3.2s ease-in-out infinite}
.drawerHandle{width:46px;height:5px;border-radius:999px;margin:0 auto 12px;background:rgba(255,255,255,.16)}
.drawerTopRow{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.drawerTopRow span{height:42px;border-radius:50%;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 14px rgba(0,0,0,.26)}
.drawerTopRow .p1{background:linear-gradient(145deg,#60a5fa,#2dd4ff)}.drawerTopRow .p2{background:linear-gradient(145deg,#93c5fd,#2563eb)}.drawerTopRow .p3{background:linear-gradient(145deg,#6b7280,#374151)}.drawerTopRow .p4{background:linear-gradient(145deg,#4ade80,#22c55e)}
.drawerSliders{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.sliderCard{height:84px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.08));position:relative;overflow:hidden}
.sliderCard:before{content:"";position:absolute;left:50%;top:10px;bottom:10px;width:18px;transform:translateX(-50%);border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.28))}.sliderCard.volume:before{background:linear-gradient(180deg,#42e8ff,#9d5cff)}
.drawerMiniRow{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.drawerMiniRow span{height:48px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.08))}
@keyframes controlDrawerRiseLarge{0%,22%{transform:translateY(84%)}44%,76%{transform:translateY(0)}100%{transform:translateY(84%)}}
@media(max-width:900px){.modal-visual{height:310px}.modalPhoneShell{width:228px;height:434px}.modalPhoneShell.top{transform:translateY(125px)}.modalPhoneShell.bottom{transform:translateY(-118px)}}
@media(max-width:640px){.modal-visual{height:292px}.modalPhoneShell{width:212px;height:404px;border-radius:38px}.modalPhoneShell:before{border-radius:35px}.modalPhoneScreen{border-radius:31px}.modalPhoneShell.top{transform:translateY(116px)}.modalPhoneShell.bottom{transform:translateY(-108px)}.topIcons{left:24px;right:24px;gap:12px}.modalIconGrid span,.bottomDockPreview span{height:34px;border-radius:12px}.sidebarMiniWidget{left:18px;right:48px;top:60px;height:38px}.sidebarMiniWidget b{left:13px;top:6px;font-size:20px}.sidebarMiniWidget span{left:72px;right:48px;top:11px}.sidebarMiniWidget i{right:14px;top:10px;width:16px;height:16px}.sidebarIcons{left:22px;right:62px;top:116px;gap:12px}.sidebarShortcutRail{top:94px;right:14px;width:48px;height:144px;gap:10px}.sidebarShortcutRail span{width:30px;height:30px;border-radius:11px}.sidebarMediaPanel{top:96px;right:14px;width:60px;height:142px}.rollModalPage span,.patternUnlockedIcons span{height:32px}.statusBattery{transform:scale(.92);transform-origin:right top}}


/* ===== iOSGlow tweak fixes ===== */
.visual-row{align-items:center}.appicon img,.last-icon img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}.modal-visual{height:356px}.phonePreviewStage{width:100%;height:100%;display:grid;place-items:center;perspective:1400px}.modalPhoneShell{transform-style:preserve-3d}.modalPhoneShell.top{transform:translateY(132px)}.modalPhoneShell.bottom{transform:translateY(-88px)}.modalIconGrid,.rollModalPage,.rollPageIcons,.sideHomeIcons,.patternHomeGrid{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:auto}.modalIconGrid span,.rollModalPage span,.rollPageIcons span,.sideHomeIcons span,.patternUnlockedIcons span,.bottomDockPreview span{aspect-ratio:1/1;height:auto!important;border-radius:16px!important}.topIcons{left:30px;right:30px;top:106px;gap:16px}.topIcons.lowerShift{top:118px}.patternHomeGrid{top:112px}.simpleIcons .c1,.privacyIcons .c1,.sidebarIcons .c1,.patternHomeGrid .c1,.rollModalPage .i1,.rollModalPage .i13,.bottomDockPreview .d1{background:linear-gradient(145deg,#c6c6cc,#8e8e93)}.simpleIcons .c2,.privacyIcons .c2,.sidebarIcons .c2,.patternHomeGrid .c2,.rollModalPage .i2,.rollModalPage .i14,.bottomDockPreview .d2{background:linear-gradient(145deg,#67d3ff,#0a84ff)}.simpleIcons .c3,.privacyIcons .c3,.sidebarIcons .c3,.patternHomeGrid .c3,.rollModalPage .i3,.rollModalPage .i15,.bottomDockPreview .d3{background:linear-gradient(145deg,#89ffac,#34c759)}.simpleIcons .c4,.privacyIcons .c4,.sidebarIcons .c4,.patternHomeGrid .c4,.rollModalPage .i4,.rollModalPage .i16,.bottomDockPreview .d4{background:linear-gradient(145deg,#ff6ea8,#ff375f)}.simpleIcons .c5,.privacyIcons .c5,.sidebarIcons .c5,.patternHomeGrid .c5,.rollModalPage .i5,.rollModalPage .i17{background:linear-gradient(145deg,#ffcf66,#ffb347)}.simpleIcons .c6,.privacyIcons .c6,.sidebarIcons .c6,.patternHomeGrid .c6,.rollModalPage .i6,.rollModalPage .i18{background:linear-gradient(145deg,#9ad9ff,#67b8ff)}.simpleIcons .c7,.privacyIcons .c7,.sidebarIcons .c7,.patternHomeGrid .c7,.rollModalPage .i7,.rollModalPage .i19{background:linear-gradient(145deg,#b98bff,#7c4dff)}.simpleIcons .c8,.privacyIcons .c8,.sidebarIcons .c8,.patternHomeGrid .c8,.rollModalPage .i8,.rollModalPage .i20{background:linear-gradient(145deg,#87f0c2,#52d69d)}.simpleIcons .c9,.privacyIcons .c9,.patternHomeGrid .c9,.rollModalPage .i9,.rollModalPage .i21{background:linear-gradient(145deg,#ffc54d,#f59e0b)}.simpleIcons .c10,.privacyIcons .c10,.patternHomeGrid .c10,.rollModalPage .i10,.rollModalPage .i22{background:linear-gradient(145deg,#79ddff,#56c4ff)}.simpleIcons .c11,.privacyIcons .c11,.patternHomeGrid .c11,.rollModalPage .i11,.rollModalPage .i23{background:linear-gradient(145deg,#8d9eff,#5b6be8)}.simpleIcons .c12,.privacyIcons .c12,.patternHomeGrid .c12,.rollModalPage .i12,.rollModalPage .i24{background:linear-gradient(145deg,#ff707d,#ef4444)}

/* Privacy screen: tilt the actual mock and blank the screen */
.theme-privacy .phonePreviewStage{overflow:visible}.privacy-shell{transform-origin:center 80%;animation:privacyPhoneTilt 4.4s ease-in-out infinite}.privacyScreenOff{position:absolute;inset:0;background:#000;opacity:0;z-index:5;animation:privacyPhoneBlank 4.4s ease-in-out infinite}.privacy-shell .modalPhoneIsland,.privacy-shell .modalIconGrid{animation:privacyContentDim 4.4s ease-in-out infinite}@keyframes privacyPhoneTilt{0%,18%,82%,100%{transform:translateY(132px) rotateY(0deg)}32%,42%{transform:translateY(132px) rotateY(-50deg)}58%,68%{transform:translateY(132px) rotateY(50deg)}}@keyframes privacyPhoneBlank{0%,18%,82%,100%{opacity:0}32%,68%{opacity:1}}@keyframes privacyContentDim{0%,18%,82%,100%{opacity:1}32%,68%{opacity:.04}}

/* Pattern lock: centered Z and clean unlock result */
.fixedPatternStage{position:absolute;inset:0}.patternLockLayer{position:absolute;inset:0;animation:patternLockFade 3.9s ease-in-out infinite}.patternHomeLayer{position:absolute;inset:0;opacity:0;animation:patternHomeReveal 3.9s ease-in-out infinite}.patternLockMeta{top:58px}.patternLockMeta b{font-size:54px;line-height:1;margin-bottom:10px}.patternLockMeta span{font-size:15px;color:#e6ebff}.centeredZ{left:50%;top:120px;width:148px;height:148px;transform:translateX(-50%)}.centeredZ path{stroke-width:11;stroke-dasharray:340;stroke-dashoffset:340;animation:drawZCentered 3.9s ease-in-out infinite}.patternHomeGrid{left:30px;right:30px}.patternHomeLayer .patternHomeGrid{opacity:1}.patternHomeLayer .modalIconGrid span{box-shadow:0 12px 22px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.22)}@keyframes drawZCentered{0%,14%{stroke-dashoffset:340;opacity:.25}28%,58%{stroke-dashoffset:0;opacity:1}68%,100%{stroke-dashoffset:0;opacity:0}}@keyframes patternLockFade{0%,58%{opacity:1}70%,100%{opacity:0}}@keyframes patternHomeReveal{0%,60%{opacity:0}72%,100%{opacity:1}}

/* Icon roll: stronger rolling effect */
.rollOnlyScene,.iconRollPhoneScene{position:absolute;inset:0;perspective:1200px;overflow:hidden}.rollPageIcons,.rollModalPage{transform-style:preserve-3d;will-change:transform,opacity}.rollPageIcons span,.rollModalPage span{transform-style:preserve-3d;transform-origin:center center -16px;animation:iconTileRoll 3.8s ease-in-out infinite}.pageOne{animation:rollPageOutStrong 3.8s ease-in-out infinite}.pageTwo{animation:rollPageInStrong 3.8s ease-in-out infinite}.pageOne span:nth-child(1),.pageTwo span:nth-child(1){animation-delay:.00s}.pageOne span:nth-child(2),.pageTwo span:nth-child(2){animation-delay:.05s}.pageOne span:nth-child(3),.pageTwo span:nth-child(3){animation-delay:.10s}.pageOne span:nth-child(4),.pageTwo span:nth-child(4){animation-delay:.15s}.pageOne span:nth-child(5),.pageTwo span:nth-child(5){animation-delay:.20s}.pageOne span:nth-child(6),.pageTwo span:nth-child(6){animation-delay:.25s}.pageOne span:nth-child(7),.pageTwo span:nth-child(7){animation-delay:.30s}.pageOne span:nth-child(8),.pageTwo span:nth-child(8){animation-delay:.35s}.pageOne span:nth-child(9),.pageTwo span:nth-child(9){animation-delay:.40s}.pageOne span:nth-child(10),.pageTwo span:nth-child(10){animation-delay:.45s}.pageOne span:nth-child(11),.pageTwo span:nth-child(11){animation-delay:.50s}.pageOne span:nth-child(12),.pageTwo span:nth-child(12){animation-delay:.55s}@keyframes iconTileRoll{0%,24%{transform:rotateY(0deg) scale(1)}38%,58%{transform:rotateY(88deg) scale(.9)}72%,100%{transform:rotateY(0deg) scale(1)}}@keyframes rollPageOutStrong{0%,24%{transform:translateX(0) rotateY(0deg);opacity:1}40%,58%{transform:translateX(-108%) rotateY(62deg);opacity:.38}72%,100%{transform:translateX(-108%) rotateY(62deg);opacity:0}}@keyframes rollPageInStrong{0%,24%{transform:translateX(108%) rotateY(-62deg);opacity:0}40%,58%{transform:translateX(0) rotateY(0deg);opacity:1}72%,100%{transform:translateX(0) rotateY(0deg);opacity:1}}

/* Sidebar: remove weather/media and show only shortcuts */
.sideHomeScreen.noWeather{position:absolute;inset:0}.sideHomeScreen.noWeather .sideHomeIcons{left:12px;right:44px;top:16px;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;animation:sideIconsNudgeSimple 4s ease-in-out infinite}.sideHomeScreen.noWeather .sideHomeIcons span{aspect-ratio:1/1;height:auto!important;border-radius:8px}.sideHomeScreen.noWeather .sideShortcutRail{top:16px;right:7px;height:96px}.sideHomeScreen.noWeather .s5{background:linear-gradient(145deg,#ffd166,#ffb347)}.sideHomeScreen.noWeather .s6{background:linear-gradient(145deg,#67d3ff,#86b6ff)}.sideHomeScreen.noWeather .s7{background:linear-gradient(145deg,#9d5cff,#af52de)}.sideHomeScreen.noWeather .s8{background:linear-gradient(145deg,#37ff9f,#6ae8b4)}.sidebarOnlyScene .sidebarIcons{left:28px;right:92px;top:106px;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.sidebarOnlyScene .sidebarIcons span{aspect-ratio:1/1;height:auto!important}.sidebarOnlyScene .modalRail{top:108px;right:18px;width:58px;height:176px;border-radius:30px;gap:12px;animation:sideRailSlideSimple 4s ease-in-out infinite}.sidebarOnlyScene .modalRail span{width:36px;height:36px;border-radius:13px}.sidebarOnlyScene .modalRail em{left:-8px;height:54px;width:6px}.sidebarOnlyScene .sideMediaPanel,.sidebarOnlyScene .sidebarMiniWidget,.sideHomeScreen.noWeather .sideWeatherCard,.sideHomeScreen.noWeather .sideMediaPanel{display:none!important}@keyframes sideIconsNudgeSimple{0%,20%{transform:translateX(0)}36%,62%{transform:translateX(-14px)}76%,100%{transform:translateX(0)}}@keyframes sideRailSlideSimple{0%,18%{transform:translateX(84%);opacity:.32}34%,72%{transform:translateX(0);opacity:1}100%{transform:translateX(84%);opacity:.32}}

/* Control center: show lower mock clearly */
.control-shell{transform:translateY(-54px)!important}.controlBottomFocused{position:absolute;inset:0}.control-shell .bottomDockPreview{left:22px;right:22px;bottom:156px;gap:16px}.control-shell .bottomControlDrawer{left:18px;right:18px;bottom:18px;transform:translateY(72%);min-height:184px}.control-shell .drawerTopRow span{border-radius:16px}.control-shell .bottomHomeBar{bottom:24px}.squareDock span{aspect-ratio:1/1;height:auto!important;border-radius:16px!important}

/* Store-card visual fixes */
.sideHomeIcons span,.rollPageIcons span{aspect-ratio:1/1;height:auto!important}.sideShortcutRail span{border-radius:8px}.controlPhonePreview{overflow:hidden}.controlPhonePreview .bottomControlPanel{bottom:8px}

@media(max-width:900px){.modal-visual{height:324px}.modalPhoneShell.top{transform:translateY(122px)}.privacy-shell{animation-name:privacyPhoneTiltM}.control-shell{transform:translateY(-42px)!important}@keyframes privacyPhoneTiltM{0%,18%,82%,100%{transform:translateY(122px) rotateY(0deg)}32%,42%{transform:translateY(122px) rotateY(-46deg)}58%,68%{transform:translateY(122px) rotateY(46deg)}}}
@media(max-width:640px){.modal-visual{height:300px}.topIcons{left:24px;right:24px;top:98px;gap:12px}.topIcons.lowerShift{top:108px}.centeredZ{width:126px;height:126px;top:112px}.patternLockMeta b{font-size:46px}.patternLockMeta span{font-size:14px}.sidebarOnlyScene .sidebarIcons{left:22px;right:74px;top:102px;gap:12px}.sidebarOnlyScene .modalRail{top:104px;right:14px;width:50px;height:148px;gap:10px}.sidebarOnlyScene .modalRail span{width:30px;height:30px;border-radius:11px}.control-shell{transform:translateY(-32px)!important}.control-shell .bottomDockPreview{bottom:138px;gap:12px}.control-shell .bottomControlDrawer{left:14px;right:14px;min-height:160px}.sideHomeScreen.noWeather .sideHomeIcons{top:16px;right:40px}.sideHomeScreen.noWeather .sideShortcutRail{top:16px;right:6px;height:88px;width:32px}.sideHomeScreen.noWeather .sideShortcutRail span{width:20px;height:20px}}


/* ===== follow-up sizing + icon-roll alignment fixes ===== */
.modal-visual{height:392px!important;overflow:hidden}.phonePreviewStage{overflow:hidden}.modalPhoneShell{width:308px!important;height:590px!important;border-radius:54px!important}.modalPhoneShell:before{border-radius:50px!important}.modalPhoneScreen{border-radius:44px!important}.modalPhoneShell.top{transform:translateY(182px)!important}.modalPhoneShell.bottom{transform:translateY(-42px)!important}.theme-privacy .privacy-shell{transform-origin:center 80%}.theme-privacy .privacy-shell,.theme-privacy .phonePreviewStage{overflow:visible}.theme-control .modalPhoneShell.bottom{transform:translateY(-20px)!important}.theme-control .controlBottomFocused{transform:translateY(10px) scale(1.02)}.theme-control .bottomControlDrawer{bottom:22px!important}.theme-control .bottomDockPreview{bottom:168px!important}.theme-control .drawerTopRow span,.theme-control .bottomDockPreview span{aspect-ratio:1/1;height:auto!important;border-radius:18px!important}.theme-sidebar .sidebarOnlyScene .sidebarIcons{left:30px!important;right:96px!important;top:124px!important}.theme-sidebar .sidebarOnlyScene .modalRail{top:126px!important;right:18px!important;height:188px!important}.theme-sidebar .sidebarOnlyScene .sidebarIcons span{aspect-ratio:1/1;height:auto!important}.theme-island .topIcons,.theme-battery .topIcons,.theme-privacy .topIcons,.theme-pattern .patternHomeGrid{left:34px!important;right:34px!important;top:132px!important;gap:18px!important}.theme-battery .topIcons.lowerShift{top:144px!important}.theme-pattern .patternHomeGrid{top:132px!important}.theme-island .modalPhoneIsland,.theme-battery .modalPhoneIsland,.theme-privacy .modalPhoneIsland,.theme-pattern .modalPhoneIsland,.theme-roll .modalPhoneIsland,.theme-sidebar .modalPhoneIsland{top:28px!important;width:150px!important;height:40px!important;left:50%;transform:translateX(-50%)}.theme-roll .rollModalScene{left:32px!important;right:32px!important;top:128px!important;bottom:36px!important}.theme-roll .rollModalPage{gap:16px!important}.theme-roll .rollModalPage span{aspect-ratio:1/1;height:auto!important;border-radius:17px!important;transform-origin:center center -18px!important}.theme-roll .pageOne,.theme-roll .pageTwo{grid-template-columns:repeat(4,minmax(0,1fr))!important}.theme-roll .modalPhoneIsland{top:22px!important;width:190px!important;height:52px!important}.theme-roll .rollModalScene .pageOne,.theme-roll .rollModalScene .pageTwo{top:0}.theme-roll .rollModalScene .pageOne{animation-name:rollPageOutStrong2!important}.theme-roll .rollModalScene .pageTwo{animation-name:rollPageInStrong2!important}.theme-roll .rollModalPage.pageTwo{transform:translateX(115%) rotateY(-68deg)!important;opacity:0}.theme-roll .rollModalPage.pageOne span,.theme-roll .rollModalPage.pageTwo span{animation-name:iconTileRoll2!important}.theme-roll .rollModalPage.pageOne span:nth-child(1),.theme-roll .rollModalPage.pageTwo span:nth-child(1){animation-delay:.00s}.theme-roll .rollModalPage.pageOne span:nth-child(2),.theme-roll .rollModalPage.pageTwo span:nth-child(2){animation-delay:.05s}.theme-roll .rollModalPage.pageOne span:nth-child(3),.theme-roll .rollModalPage.pageTwo span:nth-child(3){animation-delay:.10s}.theme-roll .rollModalPage.pageOne span:nth-child(4),.theme-roll .rollModalPage.pageTwo span:nth-child(4){animation-delay:.15s}.theme-roll .rollModalPage.pageOne span:nth-child(5),.theme-roll .rollModalPage.pageTwo span:nth-child(5){animation-delay:.20s}.theme-roll .rollModalPage.pageOne span:nth-child(6),.theme-roll .rollModalPage.pageTwo span:nth-child(6){animation-delay:.25s}.theme-roll .rollModalPage.pageOne span:nth-child(7),.theme-roll .rollModalPage.pageTwo span:nth-child(7){animation-delay:.30s}.theme-roll .rollModalPage.pageOne span:nth-child(8),.theme-roll .rollModalPage.pageTwo span:nth-child(8){animation-delay:.35s}.theme-roll .rollModalPage.pageOne span:nth-child(9),.theme-roll .rollModalPage.pageTwo span:nth-child(9){animation-delay:.40s}.theme-roll .rollModalPage.pageOne span:nth-child(10),.theme-roll .rollModalPage.pageTwo span:nth-child(10){animation-delay:.45s}.theme-roll .rollModalPage.pageOne span:nth-child(11),.theme-roll .rollModalPage.pageTwo span:nth-child(11){animation-delay:.50s}.theme-roll .rollModalPage.pageOne span:nth-child(12),.theme-roll .rollModalPage.pageTwo span:nth-child(12){animation-delay:.55s}@keyframes iconTileRoll2{0%,22%{transform:rotateY(0deg) scale(1)}38%,56%{transform:rotateY(92deg) scale(.86)}72%,100%{transform:rotateY(0deg) scale(1)}}@keyframes rollPageOutStrong2{0%,24%{transform:translateX(0) rotateY(0deg);opacity:1}40%,60%{transform:translateX(-116%) rotateY(68deg);opacity:.22}72%,100%{transform:translateX(-116%) rotateY(68deg);opacity:0}}@keyframes rollPageInStrong2{0%,24%{transform:translateX(116%) rotateY(-68deg);opacity:0}40%,60%{transform:translateX(0) rotateY(0deg);opacity:1}72%,100%{transform:translateX(0) rotateY(0deg);opacity:1}}@media(max-width:900px){.modal-visual{height:360px!important}.modalPhoneShell{width:278px!important;height:536px!important}.modalPhoneShell.top{transform:translateY(166px)!important}.modalPhoneShell.bottom{transform:translateY(-30px)!important}.theme-roll .rollModalScene{left:26px!important;right:26px!important;top:118px!important}.theme-island .topIcons,.theme-battery .topIcons,.theme-privacy .topIcons,.theme-pattern .patternHomeGrid{top:122px!important;left:28px!important;right:28px!important;gap:14px!important}.theme-sidebar .sidebarOnlyScene .sidebarIcons{right:82px!important;top:116px!important}.theme-sidebar .sidebarOnlyScene .modalRail{top:118px!important;height:170px!important}}@media(max-width:640px){.modal-visual{height:328px!important}.modalPhoneShell{width:244px!important;height:470px!important;border-radius:44px!important}.modalPhoneShell:before{border-radius:40px!important}.modalPhoneScreen{border-radius:35px!important}.modalPhoneShell.top{transform:translateY(146px)!important}.modalPhoneShell.bottom{transform:translateY(-18px)!important}.theme-roll .modalPhoneIsland{width:156px!important;height:44px!important;top:18px!important}.theme-roll .rollModalScene{left:22px!important;right:22px!important;top:104px!important;bottom:26px!important}.theme-roll .rollModalPage{gap:12px!important}.theme-island .topIcons,.theme-battery .topIcons,.theme-privacy .topIcons,.theme-pattern .patternHomeGrid{top:106px!important;left:24px!important;right:24px!important;gap:12px!important}.theme-battery .topIcons.lowerShift{top:118px!important}.theme-sidebar .sidebarOnlyScene .sidebarIcons{left:22px!important;right:72px!important;top:102px!important;gap:12px!important}.theme-sidebar .sidebarOnlyScene .modalRail{top:104px!important;right:12px!important;width:48px!important;height:148px!important}.theme-sidebar .sidebarOnlyScene .modalRail span{width:30px!important;height:30px!important;border-radius:11px!important}.theme-control .bottomDockPreview{bottom:148px!important;gap:12px!important}.theme-control .bottomControlDrawer{left:14px!important;right:14px!important;bottom:16px!important;min-height:164px!important}}


/* ===== final modal height + icon-roll corrections ===== */
.modal-visual{height:408px!important}
.phonePreviewStage{width:100%!important;height:100%!important;display:grid!important;place-items:center!important;overflow:hidden!important}
.modalPhoneShell{width:324px!important;height:648px!important;border-radius:56px!important}
.modalPhoneShell:before{border-radius:52px!important}
.modalPhoneScreen{border-radius:46px!important}
.modalPhoneShell.top{transform:translateY(108px)!important}
.theme-island .topIcons,.theme-battery .topIcons,.theme-privacy .topIcons,.theme-pattern .patternHomeGrid{top:134px!important;left:34px!important;right:34px!important;gap:18px!important}
.theme-battery .topIcons.lowerShift{top:146px!important}
.theme-island .modalPhoneIsland,.theme-battery .modalPhoneIsland,.theme-privacy .modalPhoneIsland,.theme-pattern .modalPhoneIsland,.theme-sidebar .modalPhoneIsland{top:30px!important;width:154px!important;height:40px!important;left:50%!important;transform:translateX(-50%)!important}

/* stronger, cleaner icon-roll modal */
.theme-roll .modalPhoneShell.top{transform:translateY(102px)!important}
.theme-roll .modalPhoneIsland{top:28px!important;left:50%!important;transform:translateX(-50%)!important;width:156px!important;height:40px!important;border-radius:999px!important}
.theme-roll .rollModalScene{position:absolute!important;left:28px!important;right:28px!important;top:124px!important;bottom:38px!important;overflow:hidden!important;perspective:1600px!important}
.theme-roll .rollModalPage{position:absolute!important;left:0!important;right:0!important;top:0!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important;transform-style:preserve-3d!important;backface-visibility:hidden!important;will-change:transform,opacity!important}
.theme-roll .rollModalPage span{aspect-ratio:1/1!important;height:auto!important;border-radius:18px!important;transform-style:preserve-3d!important;transform-origin:center center -20px!important;backface-visibility:hidden!important;will-change:transform!important;box-shadow:0 10px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.22)!important;animation:rollIconCardFinal 3.8s ease-in-out infinite both!important}
.theme-roll .rollModalPage.pageOne{animation:rollPageOneFinal 3.8s ease-in-out infinite both!important;opacity:1!important;z-index:2!important}
.theme-roll .rollModalPage.pageTwo{animation:rollPageTwoFinal 3.8s ease-in-out infinite both!important;opacity:0!important;z-index:1!important}
.theme-roll .rollModalPage.pageOne span:nth-child(1),.theme-roll .rollModalPage.pageTwo span:nth-child(1){animation-delay:.00s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(2),.theme-roll .rollModalPage.pageTwo span:nth-child(2){animation-delay:.05s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(3),.theme-roll .rollModalPage.pageTwo span:nth-child(3){animation-delay:.10s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(4),.theme-roll .rollModalPage.pageTwo span:nth-child(4){animation-delay:.15s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(5),.theme-roll .rollModalPage.pageTwo span:nth-child(5){animation-delay:.20s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(6),.theme-roll .rollModalPage.pageTwo span:nth-child(6){animation-delay:.25s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(7),.theme-roll .rollModalPage.pageTwo span:nth-child(7){animation-delay:.30s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(8),.theme-roll .rollModalPage.pageTwo span:nth-child(8){animation-delay:.35s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(9),.theme-roll .rollModalPage.pageTwo span:nth-child(9){animation-delay:.40s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(10),.theme-roll .rollModalPage.pageTwo span:nth-child(10){animation-delay:.45s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(11),.theme-roll .rollModalPage.pageTwo span:nth-child(11){animation-delay:.50s!important}
.theme-roll .rollModalPage.pageOne span:nth-child(12),.theme-roll .rollModalPage.pageTwo span:nth-child(12){animation-delay:.55s!important}
@keyframes rollIconCardFinal{0%,24%,72%,100%{transform:rotateY(0deg) scale(1)}38%,58%{transform:rotateY(88deg) scale(.88)}}
@keyframes rollPageOneFinal{0%,28%{transform:translateX(0) rotateY(0deg);opacity:1}44%,60%{transform:translateX(-108%) rotateY(68deg);opacity:0}61%,100%{transform:translateX(-108%) rotateY(68deg);opacity:0}}
@keyframes rollPageTwoFinal{0%,28%{transform:translateX(108%) rotateY(-68deg);opacity:0}44%,60%{transform:translateX(0) rotateY(0deg);opacity:1}61%,100%{transform:translateX(0) rotateY(0deg);opacity:1}}

@media(max-width:900px){
  .modal-visual{height:380px!important}
  .modalPhoneShell{width:290px!important;height:580px!important}
  .modalPhoneShell.top{transform:translateY(98px)!important}
  .theme-roll .modalPhoneShell.top{transform:translateY(94px)!important}
  .theme-roll .rollModalScene{left:24px!important;right:24px!important;top:114px!important;bottom:30px!important}
  .theme-island .topIcons,.theme-battery .topIcons,.theme-privacy .topIcons,.theme-pattern .patternHomeGrid{top:124px!important;left:28px!important;right:28px!important;gap:14px!important}
}
@media(max-width:640px){
  .modal-visual{height:344px!important}
  .modalPhoneShell{width:250px!important;height:500px!important;border-radius:46px!important}
  .modalPhoneShell:before{border-radius:42px!important}
  .modalPhoneScreen{border-radius:36px!important}
  .modalPhoneShell.top{transform:translateY(88px)!important}
  .theme-roll .modalPhoneShell.top{transform:translateY(84px)!important}
  .theme-roll .modalPhoneIsland{top:22px!important;width:146px!important;height:38px!important}
  .theme-roll .rollModalScene{left:22px!important;right:22px!important;top:102px!important;bottom:26px!important}
  .theme-roll .rollModalPage{gap:12px!important}
  .theme-island .topIcons,.theme-battery .topIcons,.theme-privacy .topIcons,.theme-pattern .patternHomeGrid{top:108px!important;left:24px!important;right:24px!important;gap:12px!important}
  .theme-battery .topIcons.lowerShift{top:120px!important}
}


/* ===== FINAL stable modal positioning and motion fixes ===== */
.modal-visual{
  height:420px!important;
  overflow:hidden!important;
}
.phonePreviewStage{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  overflow:hidden!important;
  perspective:1400px!important;
}
.modalPhoneShell{
  position:absolute!important;
  left:50%!important;
  width:340px!important;
  height:660px!important;
  border-radius:58px!important;
  transform:translateX(-50%)!important;
  margin:0!important;
}
.modalPhoneShell:before{
  border-radius:54px!important;
}
.modalPhoneScreen{
  border-radius:48px!important;
}
.modalPhoneShell.top{
  top:22px!important;
  bottom:auto!important;
  transform:translateX(-50%)!important;
}
.modalPhoneShell.bottom{
  top:auto!important;
  bottom:-82px!important;
  transform:translateX(-50%)!important;
}

/* common top mock content spacing */
.theme-island .topIcons,
.theme-battery .topIcons,
.theme-privacy .topIcons,
.theme-pattern .patternHomeGrid{
  left:36px!important;
  right:36px!important;
  top:140px!important;
  gap:18px!important;
}
.theme-battery .topIcons.lowerShift{
  top:150px!important;
}
.theme-island .modalPhoneIsland,
.theme-battery .modalPhoneIsland,
.theme-privacy .modalPhoneIsland,
.theme-pattern .modalPhoneIsland,
.theme-roll .modalPhoneIsland,
.theme-sidebar .modalPhoneIsland{
  top:30px!important;
  left:50%!important;
  width:154px!important;
  height:40px!important;
  transform:translateX(-50%)!important;
  border-radius:999px!important;
}

/* dynamic island glowing border: equal thickness on all sides */
.theme-island .glowIslandWrap{
  top:28px!important;
  width:194px!important;
  height:56px!important;
  background:transparent!important;
  box-shadow:none!important;
}
.theme-island .glowIslandRing{
  inset:0!important;
  border-radius:999px!important;
}
.theme-island .glowIslandCore{
  width:180px!important;
  height:42px!important;
  border-radius:999px!important;
}
.theme-island .glowIslandCore:after{
  left:28px!important;
  right:28px!important;
}

/* pattern lock: keep clock below island, full centered Z */
.theme-pattern .patternLockMeta{
  top:92px!important;
}
.theme-pattern .patternLockMeta b{
  font-size:50px!important;
  line-height:.95!important;
  margin-bottom:10px!important;
}
.theme-pattern .patternLockMeta span{
  font-size:16px!important;
}
.theme-pattern .centeredZ{
  left:50%!important;
  top:176px!important;
  width:176px!important;
  height:176px!important;
  transform:translateX(-50%)!important;
  overflow:visible!important;
}
.theme-pattern .centeredZ path{
  stroke-width:10!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

/* privacy: tilt the whole phone preview stage, blank on tilt */
.theme-privacy.phonePreviewStage,
.phonePreviewStage.theme-privacy{
  overflow:visible!important;
  transform-style:preserve-3d!important;
  animation:privacyStageTiltFinal 4.2s ease-in-out infinite!important;
}
.theme-privacy .privacy-shell{
  animation:none!important;
}
.theme-privacy .privacyScreenOff{
  position:absolute!important;
  inset:0!important;
  background:#000!important;
  opacity:0;
  z-index:20!important;
  animation:privacyBlankFinal 4.2s ease-in-out infinite!important;
}
@keyframes privacyStageTiltFinal{
  0%,18%,82%,100%{transform:rotateY(0deg)}
  32%,42%{transform:rotateY(-50deg)}
  58%,68%{transform:rotateY(50deg)}
}
@keyframes privacyBlankFinal{
  0%,18%,82%,100%{opacity:0}
  32%,68%{opacity:1}
}

/* control center: show lower part of iPhone clearly */
.theme-control .modalPhoneShell.bottom{
  bottom:-86px!important;
}
.theme-control .bottomDockPreview{
  left:24px!important;
  right:24px!important;
  bottom:202px!important;
  gap:16px!important;
}
.theme-control .bottomControlDrawer{
  left:20px!important;
  right:20px!important;
  bottom:28px!important;
  min-height:220px!important;
  transform:translateY(74%);
  animation:controlDrawerRiseFinal 3.2s ease-in-out infinite!important;
}
@keyframes controlDrawerRiseFinal{
  0%,20%{transform:translateY(74%)}
  44%,76%{transform:translateY(0)}
  100%{transform:translateY(74%)}
}

/* icon roll modal: independent animation, no disappearing blank screen */
.theme-roll .modalPhoneShell.top{
  top:22px!important;
}
.theme-roll .modalPhoneIsland{
  top:28px!important;
  width:160px!important;
  height:42px!important;
}
.theme-roll .rollModalScene{
  position:absolute!important;
  left:34px!important;
  right:34px!important;
  top:128px!important;
  bottom:44px!important;
  overflow:hidden!important;
  perspective:1600px!important;
}
.theme-roll .rollModalScreen{
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:0!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
  transform-style:preserve-3d!important;
  backface-visibility:hidden!important;
  will-change:transform,opacity!important;
}
.theme-roll .rollModalScreen span{
  aspect-ratio:1/1!important;
  height:auto!important;
  border-radius:18px!important;
  box-shadow:0 10px 18px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.22)!important;
  transform-style:preserve-3d!important;
  transform-origin:center center -20px!important;
  animation:rollIconCardStable 4s ease-in-out infinite both!important;
}
.theme-roll .rollA{
  animation:rollScreenAStable 4s ease-in-out infinite both!important;
  z-index:2!important;
}
.theme-roll .rollB{
  animation:rollScreenBStable 4s ease-in-out infinite both!important;
  z-index:1!important;
}
.theme-roll .rollA span:nth-child(1),.theme-roll .rollB span:nth-child(1){animation-delay:.00s!important}
.theme-roll .rollA span:nth-child(2),.theme-roll .rollB span:nth-child(2){animation-delay:.05s!important}
.theme-roll .rollA span:nth-child(3),.theme-roll .rollB span:nth-child(3){animation-delay:.10s!important}
.theme-roll .rollA span:nth-child(4),.theme-roll .rollB span:nth-child(4){animation-delay:.15s!important}
.theme-roll .rollA span:nth-child(5),.theme-roll .rollB span:nth-child(5){animation-delay:.20s!important}
.theme-roll .rollA span:nth-child(6),.theme-roll .rollB span:nth-child(6){animation-delay:.25s!important}
.theme-roll .rollA span:nth-child(7),.theme-roll .rollB span:nth-child(7){animation-delay:.30s!important}
.theme-roll .rollA span:nth-child(8),.theme-roll .rollB span:nth-child(8){animation-delay:.35s!important}
.theme-roll .rollA span:nth-child(9),.theme-roll .rollB span:nth-child(9){animation-delay:.40s!important}
.theme-roll .rollA span:nth-child(10),.theme-roll .rollB span:nth-child(10){animation-delay:.45s!important}
.theme-roll .rollA span:nth-child(11),.theme-roll .rollB span:nth-child(11){animation-delay:.50s!important}
.theme-roll .rollA span:nth-child(12),.theme-roll .rollB span:nth-child(12){animation-delay:.55s!important}
.theme-roll .rollModalScreen .i1,.theme-roll .rollModalScreen .i13{background:linear-gradient(145deg,#c6c6cc,#8e8e93)}
.theme-roll .rollModalScreen .i2,.theme-roll .rollModalScreen .i14{background:linear-gradient(145deg,#67d3ff,#0a84ff)}
.theme-roll .rollModalScreen .i3,.theme-roll .rollModalScreen .i15{background:linear-gradient(145deg,#89ffac,#34c759)}
.theme-roll .rollModalScreen .i4,.theme-roll .rollModalScreen .i16{background:linear-gradient(145deg,#ff6ea8,#ff375f)}
.theme-roll .rollModalScreen .i5,.theme-roll .rollModalScreen .i17{background:linear-gradient(145deg,#ffcf66,#ffb347)}
.theme-roll .rollModalScreen .i6,.theme-roll .rollModalScreen .i18{background:linear-gradient(145deg,#9ad9ff,#67b8ff)}
.theme-roll .rollModalScreen .i7,.theme-roll .rollModalScreen .i19{background:linear-gradient(145deg,#b98bff,#7c4dff)}
.theme-roll .rollModalScreen .i8,.theme-roll .rollModalScreen .i20{background:linear-gradient(145deg,#87f0c2,#52d69d)}
.theme-roll .rollModalScreen .i9,.theme-roll .rollModalScreen .i21{background:linear-gradient(145deg,#ffc54d,#f59e0b)}
.theme-roll .rollModalScreen .i10,.theme-roll .rollModalScreen .i22{background:linear-gradient(145deg,#79ddff,#56c4ff)}
.theme-roll .rollModalScreen .i11,.theme-roll .rollModalScreen .i23{background:linear-gradient(145deg,#8d9eff,#5b6be8)}
.theme-roll .rollModalScreen .i12,.theme-roll .rollModalScreen .i24{background:linear-gradient(145deg,#ff707d,#ef4444)}
@keyframes rollIconCardStable{
  0%,25%,70%,100%{transform:rotateY(0deg) scale(1)}
  40%,55%{transform:rotateY(92deg) scale(.88)}
}
@keyframes rollScreenAStable{
  0%,28%{transform:translateX(0) rotateY(0deg);opacity:1}
  42%,58%{transform:translateX(-108%) rotateY(68deg);opacity:0}
  59%,100%{transform:translateX(-108%) rotateY(68deg);opacity:0}
}
@keyframes rollScreenBStable{
  0%,28%{transform:translateX(108%) rotateY(-68deg);opacity:0}
  42%,58%{transform:translateX(0) rotateY(0deg);opacity:1}
  59%,100%{transform:translateX(0) rotateY(0deg);opacity:1}
}

/* sidebar was already working; only nudge its mock with the larger phone */
.theme-sidebar .sidebarOnlyScene .sidebarIcons{
  top:136px!important;
}

/* responsive */
@media(max-width:900px){
  .modal-visual{height:386px!important}
  .modalPhoneShell{width:300px!important;height:582px!important}
  .modalPhoneShell.top{top:20px!important}
  .modalPhoneShell.bottom{bottom:-78px!important}
  .theme-roll .rollModalScene{left:28px!important;right:28px!important;top:118px!important}
  .theme-island .topIcons,.theme-battery .topIcons,.theme-privacy .topIcons,.theme-pattern .patternHomeGrid{top:126px!important;left:30px!important;right:30px!important;gap:14px!important}
}
@media(max-width:640px){
  .modal-visual{height:348px!important}
  .modalPhoneShell{width:260px!important;height:504px!important;border-radius:48px!important}
  .modalPhoneShell:before{border-radius:44px!important}
  .modalPhoneScreen{border-radius:38px!important}
  .modalPhoneShell.top{top:18px!important}
  .modalPhoneShell.bottom{bottom:-68px!important}
  .theme-island .topIcons,.theme-battery .topIcons,.theme-privacy .topIcons,.theme-pattern .patternHomeGrid{top:112px!important;left:24px!important;right:24px!important;gap:12px!important}
  .theme-roll .modalPhoneIsland{width:146px!important;height:38px!important;top:22px!important}
  .theme-roll .rollModalScene{left:22px!important;right:22px!important;top:104px!important;bottom:26px!important}
  .theme-roll .rollModalScreen{gap:12px!important}
  .theme-control .bottomDockPreview{bottom:158px!important}
  .theme-control .bottomControlDrawer{min-height:176px!important}
}

/* ===== targeted final fixes: privacy sequence + control/roll centering ===== */

/* 3) Privacy Display: straight-visible -> left-off -> straight-visible -> right-off -> straight-visible */
.theme-privacy .modalPhoneShell.top.privacy-shell,
.theme-privacy .modalPhoneShell.top{
  left:50%!important;
  top:18px!important;
  transform-origin:center 78%!important;
  animation:privacyPhoneSequenceFinal 6.4s ease-in-out infinite!important;
}
.theme-privacy .privacyScreenOff{
  opacity:0!important;
  animation:privacyBlankSequenceFinal 6.4s ease-in-out infinite!important;
}
@keyframes privacyPhoneSequenceFinal{
  0%,12%   {transform:translateX(-50%) rotateY(0deg)}
  24%      {transform:translateX(-50%) rotateY(-50deg)}
  36%      {transform:translateX(-50%) rotateY(0deg)}
  48%      {transform:translateX(-50%) rotateY(50deg)}
  60%,100% {transform:translateX(-50%) rotateY(0deg)}
}
@keyframes privacyBlankSequenceFinal{
  0%,14%   {opacity:0}
  18%,26%  {opacity:1}
  30%,38%  {opacity:0}
  42%,50%  {opacity:1}
  54%,100% {opacity:0}
}

/* 5) Control Center: recenter the lower mock and keep drawer visible */
.theme-control .modalPhoneShell.bottom{
  left:50%!important;
  width:320px!important;
  height:640px!important;
  bottom:-116px!important;
  top:auto!important;
  transform:translateX(-50%)!important;
}
.theme-control .controlBottomStage,
.theme-control .controlBottomFocused{
  position:absolute!important;
  inset:0!important;
}
.theme-control .bottomDockPreview{
  left:28px!important;
  right:28px!important;
  bottom:218px!important;
  gap:14px!important;
}
.theme-control .bottomDockPreview span{
  aspect-ratio:1/1!important;
  height:auto!important;
  border-radius:18px!important;
}
.theme-control .bottomHomeBar{
  bottom:172px!important;
}
.theme-control .bottomControlDrawer{
  left:18px!important;
  right:18px!important;
  bottom:18px!important;
  min-height:250px!important;
  border-radius:34px!important;
  transform:translateY(62%);
  animation:controlDrawerCenteredFinal 3.4s ease-in-out infinite!important;
}
@keyframes controlDrawerCenteredFinal{
  0%,18%{transform:translateY(62%)}
  42%,76%{transform:translateY(0)}
  100%{transform:translateY(62%)}
}

/* 6) Icon Roll: keep the mock centered inside frame; preserve working animation */
.theme-roll .modalPhoneShell.top{
  left:50%!important;
  top:18px!important;
  width:320px!important;
  height:640px!important;
  transform:translateX(-50%)!important;
}
.theme-roll .rollModalScene{
  left:28px!important;
  right:28px!important;
  top:120px!important;
  bottom:34px!important;
}
.theme-roll .rollModalScreen{
  left:0!important;
  right:0!important;
  top:0!important;
}
.theme-roll .rollModalScreen span{
  border-radius:18px!important;
}

@media(max-width:900px){
  .theme-control .modalPhoneShell.bottom,
  .theme-roll .modalPhoneShell.top{width:292px!important;height:584px!important}
  .theme-control .modalPhoneShell.bottom{bottom:-104px!important}
  .theme-control .bottomDockPreview{bottom:196px!important}
  .theme-control .bottomHomeBar{bottom:154px!important}
  .theme-control .bottomControlDrawer{min-height:224px!important}
  .theme-roll .rollModalScene{top:112px!important;bottom:28px!important}
}

@media(max-width:640px){
  .theme-privacy .modalPhoneShell.top.privacy-shell,
  .theme-privacy .modalPhoneShell.top,
  .theme-roll .modalPhoneShell.top{top:16px!important}
  .theme-control .modalPhoneShell.bottom,
  .theme-roll .modalPhoneShell.top{width:256px!important;height:510px!important}
  .theme-control .modalPhoneShell.bottom{bottom:-88px!important}
  .theme-control .bottomDockPreview{left:20px!important;right:20px!important;bottom:168px!important;gap:10px!important}
  .theme-control .bottomHomeBar{bottom:132px!important}
  .theme-control .bottomControlDrawer{left:14px!important;right:14px!important;bottom:14px!important;min-height:184px!important;border-radius:28px!important}
  .theme-roll .rollModalScene{left:22px!important;right:22px!important;top:98px!important;bottom:22px!important}
}


/* ===== final control center animation fix ===== */
/* Using translate property because older transform!important rules were freezing the drawer */
.theme-control .bottomControlDrawer{
  transform:translateY(0);
  translate:0 66%;
  animation:controlDrawerTranslateFinal 3.4s ease-in-out infinite!important;
  will-change:translate;
}

.theme-control .drawerHandle{
  animation:drawerHandleGlowFinal 3.4s ease-in-out infinite!important;
}

.theme-control .drawerTopRow span{
  animation:controlTogglePopFinal 3.4s ease-in-out infinite!important;
}

.theme-control .drawerTopRow span:nth-child(1){animation-delay:.05s!important}
.theme-control .drawerTopRow span:nth-child(2){animation-delay:.12s!important}
.theme-control .drawerTopRow span:nth-child(3){animation-delay:.19s!important}
.theme-control .drawerTopRow span:nth-child(4){animation-delay:.26s!important}

.theme-control .sliderCard:before{
  animation:controlSliderMoveFinal 3.4s ease-in-out infinite!important;
}

.theme-control .sliderCard.volume:before{
  animation:controlSliderMoveFinal2 3.4s ease-in-out infinite!important;
}

@keyframes controlDrawerTranslateFinal{
  0%,18%{translate:0 66%}
  42%,76%{translate:0 0}
  100%{translate:0 66%}
}

@keyframes drawerHandleGlowFinal{
  0%,18%,100%{opacity:.55;box-shadow:none}
  42%,76%{opacity:1;box-shadow:0 0 18px rgba(255,255,255,.22)}
}

@keyframes controlTogglePopFinal{
  0%,22%,100%{scale:1;filter:brightness(1)}
  42%,76%{scale:1.06;filter:brightness(1.15)}
}

@keyframes controlSliderMoveFinal{
  0%,22%,100%{height:42%;top:48%}
  42%,76%{height:72%;top:18%}
}

@keyframes controlSliderMoveFinal2{
  0%,22%,100%{height:34%;top:56%}
  42%,76%{height:62%;top:28%}
}

@media(max-width:640px){
  .theme-control .bottomControlDrawer{
    translate:0 64%;
  }
  @keyframes controlDrawerTranslateFinal{
    0%,18%{translate:0 64%}
    42%,76%{translate:0 0}
    100%{translate:0 64%}
  }
}


/* ===== last shot control center visibility fix ===== */
.theme-control .bottomControlDrawer{
  min-height: 296px !important;
  bottom: 14px !important;
  border-radius: 32px !important;
  translate: 0 76% !important;
  animation: controlDrawerTranslateFinal 3.4s ease-in-out infinite !important;
}

@keyframes controlDrawerTranslateFinal{
  0%,18%{translate:0 76%}
  42%,76%{translate:0 -26%}
  100%{translate:0 76%}
}

@media(max-width:900px){
  .theme-control .bottomControlDrawer{
    min-height: 264px !important;
    translate: 0 74% !important;
  }
  @keyframes controlDrawerTranslateFinal{
    0%,18%{translate:0 74%}
    42%,76%{translate:0 -22%}
    100%{translate:0 74%}
  }
}

@media(max-width:640px){
  .theme-control .bottomControlDrawer{
    left: 14px !important;
    right: 14px !important;
    bottom: 12px !important;
    min-height: 236px !important;
    border-radius: 28px !important;
    translate: 0 72% !important;
  }
  @keyframes controlDrawerTranslateFinal{
    0%,18%{translate:0 72%}
    42%,76%{translate:0 -18%}
    100%{translate:0 72%}
  }
}


/* ===== REAL Control Center drawer animation fix ===== */
/* This overrides only Bottom Control Center. It uses transform animation, not translate. */
.theme-control .bottomControlDrawer{
  min-height:300px!important;
  left:16px!important;
  right:16px!important;
  bottom:14px!important;
  border-radius:34px!important;
  translate:none!important;
  transform:translateY(76%);
  animation:ccDrawerRealOpen 3.45s ease-in-out infinite!important;
  will-change:transform!important;
  z-index:30!important;
}

.theme-control .drawerTopRow{
  margin-bottom:16px!important;
}

.theme-control .drawerSliders{
  margin-bottom:16px!important;
}

.theme-control .drawerMiniRow span{
  height:52px!important;
}

@keyframes ccDrawerRealOpen{
  0%,18%{
    transform:translateY(76%);
  }
  42%,76%{
    transform:translateY(-24%);
  }
  100%{
    transform:translateY(76%);
  }
}

@media(max-width:900px){
  .theme-control .bottomControlDrawer{
    min-height:274px!important;
    transform:translateY(74%);
  }
  @keyframes ccDrawerRealOpen{
    0%,18%{transform:translateY(74%)}
    42%,76%{transform:translateY(-20%)}
    100%{transform:translateY(74%)}
  }
}

@media(max-width:640px){
  .theme-control .bottomControlDrawer{
    min-height:236px!important;
    left:12px!important;
    right:12px!important;
    bottom:12px!important;
    border-radius:28px!important;
    transform:translateY(72%);
  }
  @keyframes ccDrawerRealOpen{
    0%,18%{transform:translateY(72%)}
    42%,76%{transform:translateY(-18%)}
    100%{transform:translateY(72%)}
  }
}


/* ===== WatchOS Style Home Screen ===== */
.watchosDemo{background:radial-gradient(circle at 52% 12%,rgba(170,96,255,.34),transparent 30%),radial-gradient(circle at 42% 72%,rgba(0,255,220,.12),transparent 28%),linear-gradient(180deg,#0b0f1f,#060810)}
.watchCluster{position:relative;width:100%;height:100%}
.watchMiniCluster{width:100%;height:100%;animation:watchClusterFloat 5.8s ease-in-out infinite}
.watchHomeScene{position:absolute;left:18px;right:18px;top:98px;bottom:26px;overflow:hidden}
.watchModalCluster{width:100%;height:100%;animation:watchClusterPan 6.2s ease-in-out infinite}
.watchBubble{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.28),transparent 40%),var(--bubble);display:grid;place-items:center;color:#fff;font-size:calc(var(--size) * .34);font-weight:900;box-shadow:0 8px 22px rgba(0,0,0,.24),inset 0 1px 2px rgba(255,255,255,.28);animation:watchBubblePulse 3.6s ease-in-out infinite;}
.watchBubble:nth-child(2n){animation-delay:-.6s}
.watchBubble:nth-child(3n){animation-delay:-1.1s}
.watchBubble:nth-child(4n){animation-delay:-1.7s}
.watchBubble:after{content:"";position:absolute;inset:10% auto auto 18%;width:42%;height:24%;border-radius:999px;background:rgba(255,255,255,.24);filter:blur(1px);opacity:.8}
.watchMiniCluster .watchBubble{font-size:calc(var(--size) * .44)}
.watchModalCluster .watchBubble{filter:saturate(1.02)}
.watch-shell .modalPhoneIsland{top:26px!important;width:166px!important;height:42px!important;left:50%;transform:translateX(-50%)}
.theme-watch .modalPhoneShell.top{transform:translateY(102px)!important}
.theme-watch .watchHomeScene{left:22px!important;right:22px!important;top:104px!important;bottom:24px!important}
@keyframes watchClusterFloat{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(5px,-4px) scale(1.02)}50%{transform:translate(-3px,4px) scale(.985)}75%{transform:translate(4px,1px) scale(1.015)}}
@keyframes watchClusterPan{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(-14px,8px) scale(1.02)}50%{transform:translate(10px,-10px) scale(1.04)}75%{transform:translate(-8px,-4px) scale(1.015)}}
@keyframes watchBubblePulse{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.06)}}
@media(max-width:900px){.theme-watch .watchHomeScene{top:98px!important;left:18px!important;right:18px!important;bottom:20px!important}.theme-watch .watch-shell .modalPhoneIsland,.watch-shell .modalPhoneIsland{width:152px!important;height:40px!important}}
@media(max-width:640px){.theme-watch .watchHomeScene{top:90px!important;left:16px!important;right:16px!important;bottom:18px!important}.theme-watch .watch-shell .modalPhoneIsland,.watch-shell .modalPhoneIsland{width:142px!important;height:36px!important}.watchModalCluster .watchBubble{box-shadow:0 6px 16px rgba(0,0,0,.25),inset 0 1px 2px rgba(255,255,255,.26)}}


/* ===== WatchOS refined fix ===== */
.theme-watch .phonePreviewStage{display:block!important;position:relative!important;overflow:hidden!important}
.theme-watch .modalPhoneShell.top.watch-shell{position:absolute!important;left:50%!important;top:18px!important;width:318px!important;height:612px!important;transform:translateX(-50%)!important;margin:0!important}
.theme-watch .watch-shell .modalPhoneIsland{top:22px!important;left:50%!important;transform:translateX(-50%)!important;width:168px!important;height:44px!important}
.theme-watch .watchHomeScene{left:14px!important;right:14px!important;top:86px!important;bottom:16px!important;overflow:hidden!important}
.theme-watch .watchModalCluster{width:100%!important;height:100%!important;transform-origin:center center;animation:watchClusterPanRefined 6.4s ease-in-out infinite!important}
.theme-watch .watchBubble{display:flex!important;align-items:center;justify-content:center;font-size:calc(var(--size) * .38)!important;line-height:1;color:var(--fg,#fff)!important;text-shadow:none!important;font-weight:900;letter-spacing:-.02em}
.theme-watch .watchBubble:after{left:15%!important;width:44%!important;height:22%!important;opacity:.72!important}
.theme-watch .watchMiniCluster .watchBubble{font-size:calc(var(--size) * .50)!important}
@keyframes watchClusterPanRefined{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(-8px,6px) scale(1.02)}50%{transform:translate(6px,-8px) scale(1.035)}75%{transform:translate(-4px,-3px) scale(1.015)}}
@media(max-width:900px){.theme-watch .modalPhoneShell.top.watch-shell{width:288px!important;height:554px!important}.theme-watch .watchHomeScene{top:80px!important;left:12px!important;right:12px!important;bottom:14px!important}.theme-watch .watch-shell .modalPhoneIsland{width:154px!important;height:40px!important;top:20px!important}}
@media(max-width:640px){.theme-watch .modalPhoneShell.top.watch-shell{width:250px!important;height:482px!important;top:18px!important}.theme-watch .watchHomeScene{top:72px!important;left:10px!important;right:10px!important;bottom:12px!important}.theme-watch .watch-shell .modalPhoneIsland{width:140px!important;height:36px!important;top:18px!important}.theme-watch .watchBubble{font-size:calc(var(--size) * .34)!important}}