:root{color-scheme:light;--dock-height:84px;--glass-border:rgba(255,255,255,.78);--glass-shadow:0 16px 38px rgba(40,68,132,.18)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}
body{position:fixed;inset:0;background:#6a72dc;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Arial,sans-serif}
button,a{font:inherit}
.desktop{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;overflow:hidden;isolation:isolate;touch-action:pan-x}
.wallpaper,.wallpaper-shade{position:absolute;inset:0;z-index:-2}
.wallpaper{background-color:#8fb7f4;background-image:url("/assets/nav-default/ios-wallpaper.jpg");background-size:cover;background-position:center;transform:scale(1.02);filter:saturate(1.07) brightness(1.08)}
.wallpaper:before{content:none}
.wallpaper:after{content:none}
.wallpaper.custom:before{display:none}
.wallpaper-shade{display:none}
.app-grid{position:absolute;top:max(8px,env(safe-area-inset-top));left:max(15px,env(safe-area-inset-left));right:max(15px,env(safe-area-inset-right));bottom:calc(max(8px,env(safe-area-inset-bottom)) + var(--dock-height) + 35px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr));gap:clamp(2px,1.1vh,9px) 5px;overflow:hidden}
.app-icon{position:relative;z-index:1;display:flex;min-width:0;height:100%;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;padding:0 2px;border:0;background:transparent;color:#fff;cursor:pointer;text-align:center;text-shadow:none}
.app-icon img{display:block;width:min(15.2vw,60px);height:min(15.2vw,60px);max-width:60px;max-height:60px;flex:none;border:0;border-radius:18px;object-fit:cover;background:transparent;filter:none;box-shadow:none}
.fallback-icon{display:grid;place-items:center;width:min(15.2vw,60px);height:min(15.2vw,60px);max-width:60px;max-height:60px;flex:none;border:0;border-radius:18px;font-size:25px;font-weight:600;background:rgba(255,255,255,.45);box-shadow:none}
.app-icon>span:last-child{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.2;font-weight:500}
.widget-card{position:relative;display:flex;min-width:0;min-height:0;padding:0;overflow:hidden;border:0;border-radius:23px;text-decoration:none;color:#fff;background-color:transparent;background-image:var(--widget-image,none);background-size:cover;background-position:center;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;cursor:pointer}
.widget-card:before{content:none}
.widget-wide{grid-column:span 4;grid-row:span 2}
.widget-glass{display:none}
.widget-copy{position:absolute;left:0;right:0;bottom:0;display:flex;width:100%;flex-direction:column;gap:3px;padding:12px;color:#fff;pointer-events:none;background:transparent;text-shadow:none}
.widget-copy small{font-size:10px;line-height:1.35;color:#fff;letter-spacing:0}
.widget-copy strong{font-size:14px;line-height:1.2;font-weight:700;color:#fff}
.widget-arrow{display:none}
.desktop-error{grid-column:1/-1;grid-row:1/-1;display:grid;place-items:center;padding:22px;color:#fff;text-align:center;font-size:13px;text-shadow:0 1px 8px rgba(0,0,0,.3)}
.page-control{position:absolute;left:0;right:0;bottom:calc(max(8px,env(safe-area-inset-bottom)) + var(--dock-height) + 7px);z-index:12;display:flex;height:18px;align-items:center;justify-content:center;color:rgba(255,255,255,.72);pointer-events:none}
.page-dots{display:flex;align-items:center;justify-content:center;gap:7px}
.page-dot{width:5px;height:5px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 1px 4px rgba(20,25,70,.25);pointer-events:auto}
.page-dot.active{width:17px;border-radius:6px;background:#fff}
.desktop-page-arrows{display:none}
.dock-wrap{position:fixed;left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));z-index:15;margin:0;padding:0;pointer-events:none}
.dock{position:relative;display:grid;width:min(100%,540px);height:var(--dock-height);grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0 auto;padding:7px 9px 5px;overflow:hidden;border:1px solid var(--glass-border);border-radius:27px;background:linear-gradient(145deg,rgba(255,255,255,.74),rgba(255,255,255,.4) 45%,rgba(240,247,255,.55));box-shadow:var(--glass-shadow),inset 0 1px 0 rgba(255,255,255,.94),inset 0 -1px 0 rgba(255,255,255,.38);backdrop-filter:blur(32px) saturate(165%);-webkit-backdrop-filter:blur(32px) saturate(165%);pointer-events:auto}
.dock:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.5),transparent 27%,transparent 70%,rgba(255,255,255,.3))}
.dock .app-icon{justify-content:center;gap:3px}
.dock .app-icon img,.dock .fallback-icon{width:min(13.5vw,53px);height:min(13.5vw,53px);max-width:53px;max-height:53px;border-radius:16px}
.dock .app-icon>span:last-child{font-size:11px;font-weight:600;color:#fff;text-shadow:none}
.toast{position:fixed;left:50%;bottom:calc(max(8px,env(safe-area-inset-bottom)) + var(--dock-height) + 34px);z-index:30;transform:translate(-50%,18px);opacity:0;padding:10px 14px;border:1px solid rgba(255,255,255,.24);border-radius:15px;background:rgba(20,23,43,.76);color:#fff;font-size:12px;box-shadow:0 9px 25px rgba(0,0,0,.18);backdrop-filter:blur(16px);pointer-events:none;transition:.2s}
.toast.show{transform:translate(-50%,0);opacity:1}
.app-detail{position:fixed;inset:auto 0 0;max-width:none;width:100%;max-height:min(82dvh,680px);margin:0;overflow:auto;border:1px solid rgba(255,255,255,.72);border-bottom:0;border-radius:29px 29px 0 0;padding:29px 24px max(26px,env(safe-area-inset-bottom));background:rgba(247,248,255,.9);color:#171927;text-align:center;box-shadow:0 -20px 70px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.95);backdrop-filter:blur(34px) saturate(180%);-webkit-backdrop-filter:blur(34px) saturate(180%)}
.app-detail::backdrop{background:rgba(7,10,24,.4);backdrop-filter:blur(7px)}
.close-detail{position:absolute;right:18px;top:15px;width:32px;height:32px;border:0;border-radius:50%;background:rgba(75,82,112,.1);color:#515566;font-size:23px;line-height:1}
.detail-icon{width:68px;height:68px;border-radius:19px;object-fit:cover;box-shadow:0 8px 20px rgba(30,34,57,.15)}
.detail-kicker{margin:17px 0 5px;color:#8a8ea0;font-size:9px;letter-spacing:.17em;font-weight:700}
.app-detail h2{margin:0;font-size:21px}
.detail-intro{max-width:470px;margin:10px auto 20px;color:#666b7b;line-height:1.65;font-size:13px;white-space:pre-line}
.visit-button{height:47px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:15px;background:#3274ef;color:#fff;text-decoration:none;font-size:14px;font-weight:600;box-shadow:0 6px 15px rgba(50,116,239,.26)}
.visit-button span{font-size:17px}
html[data-mode="day"] .wallpaper{filter:saturate(1.07) brightness(1.08)}
html[data-mode="day"] .dock{background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.46) 48%,rgba(246,250,255,.6));border-color:rgba(255,255,255,.84)}
@media(min-width:640px){:root{--dock-height:92px}.app-grid{left:max(34px,env(safe-area-inset-left));right:max(34px,env(safe-area-inset-right));max-width:900px;margin-inline:auto;gap:10px}.app-icon{gap:7px}.app-icon img,.fallback-icon{width:64px;height:64px}.app-icon>span:last-child{font-size:11px}.widget-card{border-radius:27px}.widget-copy{padding:17px}.widget-copy strong{font-size:16px}.widget-copy small{font-size:11px}.desktop-page-arrows{position:fixed;top:50%;left:clamp(14px,3vw,54px);right:clamp(14px,3vw,54px);z-index:14;display:flex;align-items:center;justify-content:space-between;pointer-events:none;transform:translateY(-50%)}.desktop-page-arrows[hidden]{display:none}.desktop-page-arrow{display:grid;width:46px;height:46px;place-items:center;padding:0;border:1px solid rgba(255,255,255,.72);border-radius:50%;background:rgba(255,255,255,.38);color:#fff;font-size:38px;font-weight:300;line-height:1;box-shadow:0 10px 28px rgba(34,53,112,.16),inset 0 1px 0 rgba(255,255,255,.82);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);cursor:pointer;pointer-events:auto;transition:transform .18s ease,opacity .18s ease}.desktop-page-arrow:hover:not(:disabled){transform:scale(1.07);background:rgba(255,255,255,.52)}.desktop-page-arrow:active:not(:disabled){transform:scale(.94)}.desktop-page-arrow:disabled{opacity:.3;cursor:default}.dock{padding:10px 20px;gap:10px;border-radius:30px}.dock .app-icon img,.dock .fallback-icon{width:62px;height:62px}.dock .app-icon>span:last-child{font-size:12px;color:#fff;text-shadow:none}.app-detail{inset:50% auto auto 50%;transform:translate(-50%,-50%);width:min(410px,calc(100% - 36px));border:1px solid rgba(255,255,255,.7);border-radius:29px;padding:34px 29px}}
@media(max-height:620px){:root{--dock-height:68px}.app-grid{gap:2px 4px}.app-icon{gap:2px}.app-icon img,.fallback-icon{width:min(13vw,48px);height:min(13vw,48px);border-radius:15px}.app-icon>span:last-child{font-size:9px}.dock .app-icon img,.dock .fallback-icon{width:min(11vw,44px);height:min(11vw,44px);border-radius:13px}}
@media(max-height:480px){:root{--dock-height:58px}.dock{padding:4px 8px;border-radius:21px}.dock .app-icon img,.dock .fallback-icon{width:min(10vw,38px);height:min(10vw,38px)}.app-grid{bottom:calc(max(4px,env(safe-area-inset-bottom)) + var(--dock-height) + 30px)}}
@media(prefers-reduced-motion:no-preference){.app-icon,.widget-card{transition:transform .18s ease,filter .18s ease}.app-icon:active,.widget-card:active{transform:scale(.96);filter:brightness(1.08)}}
