/* System overlays are shared by every App. They never remount App content. */
.sim-device{--screen-brightness:1;overflow:clip}
.sim-device>.phone-content{filter:brightness(var(--screen-brightness));transition:filter .22s ease-out}
.sim-device[data-system-panel="control"]>.phone-content,.sim-device[data-system-panel="switcher"]>.phone-content{filter:brightness(var(--screen-brightness)) blur(14px) saturate(.7)}
.sim-device:before{z-index:98;pointer-events:none}
.sim-device>.sim-overlay-host{border-radius:33px;overflow:clip;clip-path:inset(0 round 33px)}
.sim-device .phone-status .sys-status-button{pointer-events:auto;display:flex;align-items:center;padding:0;margin:0;color:inherit;background:none;border:0;min-height:20px;gap:4px;touch-action:none}
.sim-device[data-system-panel]:not([data-system-panel=""])>.phone-status{color:white;z-index:92}
.sys-panel-shade{position:absolute;inset:0;z-index:90;color:white;animation:sys-panel-in .3s cubic-bezier(.22,.82,.2,1);overscroll-behavior:contain}
.sys-panel-shade button{color:inherit}.sys-panel-shade button:focus-visible{outline:2px solid #a6c8ff}
.sys-control-shade{background:#163140b8;backdrop-filter:blur(22px) saturate(.9);touch-action:none}
.sys-control-panel{padding:48px 17px 28px;height:100%;box-sizing:border-box}
.sys-control-panel>header,.sys-switcher>header{display:flex;align-items:center;justify-content:space-between;font-size:10px;margin:0 0 23px;color:#fff9}
.sys-control-panel>header button,.sys-switcher>header button{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:#ffffff1a;padding:0}
.sys-control-panel header .icon,.sys-switcher header .icon{width:12px;height:12px}
.sys-connect-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.sys-connect-grid button{height:91px;background:#10232c82;border:1px solid #ffffff0b;border-radius:17px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px;gap:4px}
.sys-connect-grid button strong{width:31px;height:31px;background:#ffffff20;border-radius:50%;display:grid;place-items:center;font-size:24px;font-weight:400}
.sys-connect-grid button span{font-size:11px}.sys-connect-grid button small{font-size:8px;opacity:.6}
.sys-connect-grid button.on{background:#3676a380}.sys-connect-grid button.on strong{background:#2487fb}
.sys-connect-grid button[data-setting="airplaneMode"].on strong{background:#f6a12a}.sys-connect-grid button[data-setting="flashlight"].on strong{background:#fff;color:#234}
.sys-slider-card{margin-top:13px;border-radius:17px;background:#10232c82;padding:15px 12px;display:flex;flex-direction:column;gap:16px}
.sys-slider-card label{display:grid;grid-template-columns:45px 1fr 25px;align-items:center;gap:8px;font-size:10px}.sys-slider-card input{width:100%;accent-color:#fff;height:16px;padding:0;margin:0;min-width:0;cursor:pointer;touch-action:pan-x}.sys-slider-card output{font-size:8px;color:#ffffff8a;text-align:right}
.sys-quick-apps{display:flex;gap:10px;margin-top:14px}.sys-quick-apps button{flex:1;height:56px;border-radius:14px;background:#10232c82;display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;font-size:8px}.sys-quick-apps .icon{width:18px;height:18px}
.sys-panel-hint{text-align:center;font-size:9px;color:#ffffff70;margin:24px 0 0}
.sys-switch-shade{background:#1b29378a;backdrop-filter:blur(18px) saturate(.7)}
.sys-switcher{height:100%;padding:47px 0 25px;box-sizing:border-box;display:flex;flex-direction:column}
.sys-switcher>header{padding:0 18px;margin-bottom:12px;flex-shrink:0}.sys-switcher>header b{font-size:12px;color:white;font-weight:500}
.sys-app-cards{flex:1;min-height:0;display:flex;gap:16px;overflow-x:auto;overflow-y:hidden;padding:0 44px 8px;scroll-snap-type:x mandatory;scrollbar-width:none;touch-action:pan-x;overscroll-behavior:contain}
.sys-app-card{width:180px;flex-shrink:0;scroll-snap-align:center;touch-action:pan-x;transform-origin:center bottom}
.sys-app-card>header{height:31px;display:flex;align-items:center;gap:7px;font-size:10px;padding:0 3px}
.sys-app-card>header>b{font-weight:500;flex:1}.sys-app-card>header>button{padding:0;width:20px;height:20px;display:grid;place-items:center;background:#ffffff12;border-radius:50%}
.sys-app-glyph{display:grid;place-items:center;width:22px;height:22px;border-radius:5px;background:#64816a}.sys-app-glyph .icon{width:14px;height:14px}.sys-app-card>header>button .icon{width:10px;height:10px}
.sys-app-preview{position:relative;width:180px;height:360px;overflow:hidden;border-radius:20px;background:#f2f3f1;display:block;padding:0;box-shadow:0 9px 20px #0003;touch-action:pan-x;border:1px solid #ffffff20}
.sys-app-preview [data-app-preview]{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.sys-app-preview [data-app-preview]>.phone-page,.sys-app-preview [data-app-preview]>.wallpaper{width:270px;height:576px;transform:scale(.6666667);transform-origin:top left;pointer-events:none;--sim-ime-height:0px;user-select:none}
.sys-switcher>.sys-panel-hint{margin:7px 0 0;flex-shrink:0}.sys-no-apps{font-size:13px;color:#ffffff80;text-align:center;line-height:1.9;margin:auto;width:180px;flex-shrink:0}
.wx-chat .wx-pending{font-size:12px;align-self:center;color:#999}
@keyframes sys-panel-in{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.sys-panel-shade{animation:none}}
