/* Liquid glass */
.lg{position:relative;isolation:isolate;background:linear-gradient(145deg,var(--g1),var(--g2));-webkit-backdrop-filter:blur(30px) saturate(200%) brightness(1.04);backdrop-filter:blur(30px) saturate(200%) brightness(1.04);border-radius:40px;box-shadow:inset 0 1px 1px var(--hi),inset 0 -1px 1px var(--edge),inset 0 0 40px rgba(255,255,255,.05),0 40px 80px -30px var(--gsh)}
.lg::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.2px;background:radial-gradient(500px circle at var(--mx,25%) var(--my,0%),var(--hi),var(--rim2) 46%,var(--rim3));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:2}
.lg::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(380px circle at var(--mx,25%) var(--my,0%),rgba(255,255,255,.16),transparent 60%);opacity:0;transition:opacity .8s var(--ease);pointer-events:none;z-index:1}
.lg:hover::after{opacity:1}
/* Navigation */
nav{position:fixed;top:calc(12px + env(safe-area-inset-top,0px));left:0;right:0;margin:0 auto;width:max-content;z-index:70;display:flex;align-items:center;gap:6px;padding:6px;border-radius:980px;max-width:calc(100vw - 16px);animation:fade 1.4s var(--ease) both}
nav .brand{display:flex;align-items:center;gap:9px;padding:9px 16px 9px 14px;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
nav .brand b{width:14px;height:14px;border-radius:50%;background:conic-gradient(#64d2ff,#0a84ff,#bf5af2,#ff375f,#64d2ff);display:block}
.links{position:relative;display:flex}
.links a{position:relative;z-index:1;padding:9px 16px;border-radius:980px;color:var(--m);font-size:.95rem;font-weight:500;transition:color .5s var(--ease);white-space:nowrap}
.links a.on,.links a:hover{color:var(--t)}
#ind{position:absolute;top:0;bottom:0;left:0;border-radius:980px;background:linear-gradient(145deg,var(--ind1),var(--ind2));box-shadow:inset 0 1px 1px var(--hi),0 6px 20px -6px var(--gsh);transition:left .8s var(--ease),width .8s var(--ease)}
#ind.mv{animation:squish .85s var(--ease)}
@keyframes squish{0%{transform:scale(1,1)}35%{transform:scale(1.1,.86)}100%{transform:scale(1,1)}}
nav .k{padding:8px 14px;font-size:.82rem;color:var(--m);background:var(--tint)}
nav .ib{width:38px;height:38px;padding:0;display:grid;place-items:center;color:var(--t);background:var(--tint)}
:root[data-theme="dark"] .ic-moon,:root[data-theme="light"] .ic-sun{display:none}
#tabbar,#more{display:none}
@media(max-width:900px){
 nav{justify-content:space-between;width:calc(100vw - 24px)}
 nav .links,nav #kbtn{display:none}
 #tabbar{display:flex;position:fixed;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:70;padding:6px;border-radius:32px;gap:2px;animation:fade 1.4s var(--ease) both}
 #tabbar .tab{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 2px 7px;border-radius:26px;color:var(--m);font-size:.68rem;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:color .5s var(--ease)}
 #tabbar .tab svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
 #tabbar .tab.on{color:var(--t)}
 #tInd{position:absolute;top:6px;bottom:6px;left:0;border-radius:26px;background:linear-gradient(145deg,var(--ind1),var(--ind2));box-shadow:inset 0 1px 1px var(--hi),0 6px 20px -6px var(--gsh);transition:left .8s var(--ease),width .8s var(--ease)}
 #tInd.mv{animation:squish .85s var(--ease)}
 #more{display:flex;position:fixed;inset:0;z-index:65;align-items:flex-end;padding:12px 12px calc(96px + env(safe-area-inset-bottom,0px));background:rgba(0,0,0,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:opacity .6s var(--ease),visibility .6s}
 #more.open{opacity:1;visibility:visible}
 #more .sheet{width:100%;padding:10px;border-radius:30px;transform:translateY(40px) scale(.97);transition:transform .8s var(--ease)}
 #more.open .sheet{transform:none}
 #more .sheet a{display:block;padding:17px 20px;border-radius:20px;font-size:1.2rem;font-weight:600;color:var(--t)}
 #more .sheet a:active{background:var(--tint)}
 #toast{bottom:calc(100px + env(safe-area-inset-bottom,0px))}
}
/* Boot, toast, palette */
#boot{position:fixed;inset:0;z-index:200;display:grid;place-items:center;text-align:center;background:var(--bg);transition:opacity 1.1s var(--ease),visibility 1.1s}
#boot.out{opacity:0;visibility:hidden}
#boot svg{width:130px;height:130px;transform:rotate(-90deg);filter:drop-shadow(0 0 22px rgba(10,132,255,.5))}
#boot circle{fill:none;stroke:url(#rg);stroke-width:5;stroke-linecap:round;stroke-dasharray:289;stroke-dashoffset:289;animation:draw 1.7s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
#boot p{margin:34px 0 0;font-size:clamp(1.8rem,4.5vw,3rem);font-weight:700;letter-spacing:-.04em;animation:fade 1.4s .35s var(--ease) both}
#toast{position:fixed;left:50%;bottom:calc(30px + env(safe-area-inset-bottom,0px));transform:translate(-50%,40px);padding:14px 28px;font-weight:600;z-index:90;opacity:0;pointer-events:none;border-radius:980px;transition:opacity .8s var(--ease),transform .8s var(--ease)}
#toast.on{opacity:1;transform:translate(-50%,0)}
#pal{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.4);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:grid;place-items:start center;padding-top:18vh;animation:fade .5s var(--ease)}
#pal .box{width:min(620px,92vw);padding:16px;border-radius:30px}
#pal ul{list-style:none;margin:10px 0 0;padding:0}
#pal li{padding:14px 16px;border-radius:16px;cursor:pointer;font-size:1.08rem;transition:background .4s}
#pal li.sel,#pal li:hover{background:var(--tint)}