/* A web interpretation of liquid glass, keeping VOLT's contrast and identity. */
:root{--muted:#b3c0b8;--line:#d4fff022;--panel:#172820;--glass-edge:#ecfff13d;--glass-shadow:0 16px 45px #0003,inset 0 1px 0 #ffffff35,inset 0 -1px 0 #c9ffe50d}
body{background:#071811;isolation:isolate}
.glass-atmosphere{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 14% 10%,#416b4380,transparent 43%),radial-gradient(ellipse at 78% 62%,#1b6b6475,transparent 48%),linear-gradient(140deg,#142b1d,#07140f 60%,#152b21)}
.glass-atmosphere:before{content:'';position:absolute;inset:-25%;background:radial-gradient(ellipse at 25% 33%,#a5d56f38,transparent 25%),radial-gradient(ellipse at 70% 65%,#67ebd626,transparent 29%);filter:blur(35px);animation:glass-drift 18s ease-in-out 2 alternate}
.glass-atmosphere:after{content:'';position:absolute;width:70vw;height:70vw;left:-26vw;top:24vh;border:1px solid #ccffe316;border-radius:50%;box-shadow:0 0 100px #ccffb909,inset 0 0 100px #ccffb909;transform:rotate(-25deg) scaleY(.65)}
.panel,.metric,.workout-card,.pro-card,.streak,.plan,.watch-preview{position:relative;background:linear-gradient(135deg,#f1fff016,#d9ffe805 48%,#87dbbc0c);border:1px solid var(--glass-edge);border-top-color:#f2fff259;border-bottom-color:#c7ffe51b;box-shadow:var(--glass-shadow);backdrop-filter:blur(25px) saturate(145%);-webkit-backdrop-filter:blur(25px) saturate(145%)}
.panel,.metric{border-radius:25px}.workout-card{border-radius:24px}.panel:before,.metric:before,.workout-card:before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;background:radial-gradient(240px circle at var(--glass-x,25%) var(--glass-y,0%),#efffec14,transparent 72%);opacity:.65;transition:opacity .4s}
.panel:hover,.metric:hover,.workout-card:hover{border-color:#efffe765;box-shadow:0 20px 55px #0004,inset 0 1px 0 #fff6,inset 0 -1px 0 #c9ffe512}.panel:hover:before,.metric:hover:before,.workout-card:hover:before{opacity:1}
.sidebar{top:16px;right:16px;bottom:16px;width:218px;border:1px solid #efffee30;border-top-color:#efffee55;border-radius:30px;background:linear-gradient(145deg,#b6e4c418,#1a2a206b);backdrop-filter:blur(34px) saturate(150%);-webkit-backdrop-filter:blur(34px) saturate(150%);box-shadow:var(--glass-shadow)}
.shell{margin-right:250px}.topbar{margin:16px 24px 0;height:68px;border:1px solid #e3ffe62b;border-top-color:#eaffec4a;border-radius:24px;background:linear-gradient(110deg,#e8fff315,#b4e5d508);box-shadow:var(--glass-shadow);backdrop-filter:blur(26px) saturate(150%);-webkit-backdrop-filter:blur(26px) saturate(150%);padding:0 24px}
.nav-item{border-radius:17px}.nav-item:hover{background:#e2ffe50c}.nav-item.active{background:linear-gradient(135deg,#defcafad,#baf442bb);border:1px solid #ebffca95;box-shadow:0 6px 23px #a8f33421,inset 0 1px 0 #fff9;color:#12220b}
.btn:not(.secondary):not(.ghost){border-radius:16px;background:linear-gradient(135deg,#e4ffbaa6,#bafa46d9 60%,#a0ed58d9);border:1px solid #efffcf85;box-shadow:0 8px 26px #baff301d,inset 0 1px 1px #fff9,inset 0 -2px 3px #58871938;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);color:#122107}
.btn.secondary,.chip,.day,.icon-btn,.demo-pill{background:linear-gradient(130deg,#f1fff018,#b7efca06);border-color:#e4ffe235;box-shadow:inset 0 1px 0 #fff2;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.btn.secondary{border-radius:16px}.chip.active,.day.active{background:linear-gradient(135deg,#e2ffb7a3,#b3eb427d);border-color:#e5ffc477;color:#14220a;box-shadow:inset 0 1px 0 #fffb,0 7px 24px #9cdf2620}.day.active{color:#f2ffd9;background:#bbf85529}
.hero{border:1px solid #e7ffcb3d;border-radius:30px;box-shadow:var(--glass-shadow)}.hero:after{background:linear-gradient(270deg,#11240feb 2%,#11230cb8 43%,#14251d20),linear-gradient(0deg,#11201470,transparent 60%)}.hero-content .btn{backdrop-filter:blur(20px)}
.card-body{background:linear-gradient(140deg,#e8fff009,#9decc504)}.card-image{border-bottom:1px solid #fff2}.tag,.play-circle{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#162d1b70;border:1px solid #f3ffe74d}
.ring{background:conic-gradient(from 215deg,#d9ff8a 0,#68edca var(--val),#c7ffdc1b 0);box-shadow:0 0 35px #a3ffc414,inset 0 0 4px #fff6}.ring:before{background:linear-gradient(135deg,#263f32,#163329);box-shadow:inset 0 1px 2px #e4fff136}.ring:after{border-color:#e5ffeb2b}
.challenge{background:linear-gradient(125deg,#d0fc6bd9,#66ebbbac);border:1px solid #f6ffe8a6;box-shadow:0 14px 40px #91d54320,inset 0 1px 0 #fffc;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:25px}.challenge button{border:1px solid #eaffcb30;background:#142911c9;box-shadow:inset 0 1px 0 #fff2}
.pro-card{border-radius:21px}.avatar{border-color:#e1ffc23b;box-shadow:inset 0 1px 0 #fff6}.brand-mark{background:linear-gradient(135deg,#eeffbb,#b9fa42);box-shadow:inset 0 1px 0 #fff,0 5px 18px #b8ff3620}
dialog{background:linear-gradient(145deg,#6a8a6259,#10271cdf 60%,#16382ade);border:1px solid #e5ffe64a;border-top-color:#f0fff485;box-shadow:0 40px 130px #0009,inset 0 1px 0 #fff4;backdrop-filter:blur(45px) saturate(160%);-webkit-backdrop-filter:blur(45px) saturate(160%);border-radius:32px}dialog::backdrop{background:#03160c55;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.wizard-choice,.wizard-review,.coach-message,.info-note{background:linear-gradient(125deg,#d9f9da10,#b7f2d008);border-color:#e2ffe32c}.wizard-choice[aria-pressed=true]{background:linear-gradient(115deg,#dfffad25,#a9e85c15);border-color:#e3ffc996;box-shadow:inset 0 1px 0 #edffca55,0 5px 22px #bdfb3810}.wizard-step b{background:#203c2d;border-color:#e6ffdb38}.wizard-step.active b,.wizard-summary-icon{background:linear-gradient(130deg,#e7ffc9,#b9f34faa);box-shadow:inset 0 1px 0 #fff,0 0 30px #baff3b2a}
input,select,.search{background:#0d221cb3;border-color:#deffdb37;color:#f3ffed}input:focus,select:focus{background:#163020}select option{background:#173121;color:white}.toast{background:#1a382cce;border-color:#d9ffb966;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);box-shadow:var(--glass-shadow)}
.bottom-nav{border:1px solid #f3ffe64d;background:linear-gradient(135deg,#dfffe724,#173126b8);box-shadow:0 10px 45px #0006,inset 0 1px 0 #fff6,inset 0 -1px 0 #efffec1a;backdrop-filter:blur(32px) saturate(170%);-webkit-backdrop-filter:blur(32px) saturate(170%)}
.bottom-nav a{padding:9px 13px;border-radius:23px;min-width:52px;color:#d1ded4}.bottom-nav a.active{background:linear-gradient(140deg,#eaffd637,#b4ee9621);box-shadow:inset 0 1px 0 #f1ffe869,0 3px 15px #0002;color:#e2ffa6}.bottom-nav a.active:after{bottom:3px;width:3px;height:3px}.bottom-nav a.active svg{filter:drop-shadow(0 0 8px #bcf65a60)}
@keyframes glass-drift{to{transform:translate3d(5%,-3%,0) rotate(8deg)}}
@media(max-width:1180px){.sidebar{width:178px;right:12px}.shell{margin-right:202px}.topbar{margin:14px 20px 0}}
@media(max-width:980px){.sidebar{width:72px;right:10px;padding:24px 6px;border-radius:25px}.shell{margin-right:90px}.nav-item{padding:15px 8px}.sidebar .brand-mark{width:35px;height:38px}}
@media(max-width:740px){.shell{margin:0}.topbar{margin:12px 16px 0;padding:0 15px;height:61px;border-radius:23px}.top-actions{gap:8px}main{padding-top:23px;padding-bottom:125px}.hero{border-radius:26px}.panel,.metric{border-radius:22px}.metric{backdrop-filter:blur(16px)}.bottom-nav{left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));border-radius:30px;padding:7px 5px;gap:0}.bottom-nav a{font-size:10px;padding:8px 9px;min-width:48px}.bottom-nav a svg{width:21px;height:21px}.toast{bottom:105px}.glass-atmosphere:before{filter:blur(25px);animation:none}dialog{border-radius:28px;backdrop-filter:blur(26px) saturate(140%)}.wizard-choice{backdrop-filter:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.panel,.metric,.workout-card,.sidebar,.topbar,.bottom-nav,dialog{background:#193127}.btn.secondary,.chip{background:#263e30}}
@media(prefers-reduced-transparency:reduce){.panel,.metric,.workout-card,.sidebar,.topbar,.bottom-nav,dialog{background:#193127;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){.glass-atmosphere:before{animation:none}.panel:before,.metric:before,.workout-card:before{transition:none}}
*{scrollbar-width:thin;scrollbar-color:#b9e9c94d #0c241c66}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#0c241c66;border-radius:12px}::-webkit-scrollbar-thumb{background:#b9e9c94d;border-radius:12px}
