.topbox{position:sticky;top:10px;z-index:20;margin:10px 12px 10px;padding:12px;border-radius:24px;display:flex;flex-direction:column;gap:10px;
 background:linear-gradient(135deg,rgba(255,255,255,.6) 0%,rgba(255,255,255,.25) 40%,rgba(255,255,255,.15) 60%,rgba(255,255,255,.3) 100%),rgba(255,255,255,.72);
 backdrop-filter:blur(28px) saturate(180%);-webkit-backdrop-filter:blur(28px) saturate(180%);border:1px solid rgba(255,255,255,.9);
 box-shadow:inset 0 1.5px 0 #fff,inset 0 -1px 0 rgba(0,0,0,.04),0 8px 24px rgba(60,45,30,.10)}
.topbox header{position:static!important;margin:0!important;padding:0 2px!important;background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border-radius:0!important;min-height:32px}
.topbox .title{margin:0!important;padding:0 2px!important;display:flex;align-items:center;gap:10px;font-size:19.12px!important}
.topbox .title:empty{display:none!important}
.topbox .tchip .chip{width:32px;height:32px;border-radius:10px}
.topbox .tchip .chip .ic{width:18px;height:18px}
.topbox .seg{margin:0!important;padding:3px!important;border-radius:12px!important;background:rgba(107,100,91,.08)!important;border:0!important;box-shadow:inset 0 1px 2px rgba(60,45,30,.06)!important;backdrop-filter:none!important}
.topbox .seg button{border-radius:9px!important;padding:7px!important}
.topbox .seg button.on{background:rgba(255,255,255,.9)!important;box-shadow:0 1px 4px rgba(60,45,30,.12),inset 0 1px 0 #fff!important}
.topbox .modes{padding:0!important;margin:0!important}
.topbox .backb{padding:6px 12px;font-size:14.62px}
.topbox .streak.glass{padding:5px 10px}
body{padding-bottom:110px}
.logo{height:25.3px!important}@media(max-width:520px){.logo{height:21.85px!important}}
.blobs{display:none!important}html,body{background:#B7B6B3!important}
.mav{width:40px;height:40px;border-radius:50%;object-fit:cover;border:1.5px solid #B4622D;padding:1.5px;background:#B7B6B3;box-sizing:border-box;flex:none;display:inline-block}
/* home: logo joined to Pattern of the Day */
body.home .topbox{display:none!important}
.hero>header{position:static!important;margin:0 0 10px!important;padding:0 0 10px!important;background:none!important;border:0!important;border-bottom:1px solid rgba(180,98,45,.18)!important;box-shadow:none!important;backdrop-filter:none!important;border-radius:0!important;display:flex;align-items:center;justify-content:space-between}
.hero>header #back{display:none!important}
.hero{cursor:pointer;-webkit-tap-highlight-color:transparent}
.hero .hc{height:180px;overflow:hidden;transition:opacity .16s ease}
.hero .hc.fade{opacity:0}
.hero .hn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60%}
/* lock deck layout while flipping */
html{scrollbar-gutter:stable;overflow-anchor:none}
.deck{flex:none;contain:layout}
.face.front{overflow-y:auto}
.glass,.tile2,.tile2:first-child,.stats,.panel,.fb,.hero,.face.glass,.topbox{background:rgba(255,255,255,.96)!important}
/* POTD: full chart, never clipped */
.hero .hc{height:auto!important;aspect-ratio:340/180;overflow:visible!important;width:100%}
.hero .hc svg{display:block;width:100%!important;height:100%!important;max-width:none;overflow:visible}
.hero .hnext{display:block;width:100%;margin-top:10px;padding:10px;background:#fff!important;color:#B4622D!important;border:1.5px solid #B4622D!important;font-weight:600;box-shadow:0 2px 8px rgba(180,98,45,.12)!important}
.hero .hnext:active{background:rgba(180,98,45,.08)!important}
