.cycling-hud{background:linear-gradient(180deg, var(--bg-base) 0%, #16213e 100%);width:100%;height:100vh;color:var(--text-pure);font-family:inherit;position:relative;overflow:hidden}.hud-left{flex-direction:column;gap:20px;display:flex;position:absolute;top:40px;left:40px}.hud-right{flex-direction:column;align-items:flex-end;gap:20px;display:flex;position:absolute;top:40px;right:40px}.data-item{text-shadow:0 2px 4px #00000080}.data-item.right{text-align:right}.data-label{opacity:.8;margin-bottom:4px;font-size:16px}.data-value{font-size:42px;font-weight:700;line-height:1}.data-unit{opacity:.9;margin-left:6px;font-size:18px;font-weight:500}.hud-bottom{opacity:.7;letter-spacing:2px;font-size:18px;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.cycling-hud--overlay{pointer-events:none;z-index:5;background:0 0;height:100%;position:absolute;inset:0}.hud-overlay-container{pointer-events:none;position:absolute;inset:0}.hud-side{will-change:opacity, transform;flex-direction:column;gap:16px;display:flex;position:absolute;top:max(60%,500px)}.hud-side--left{left:clamp(1rem,4vw,2rem)}.hud-side--right{align-items:flex-end;right:clamp(1rem,4vw,2rem)}.hud-data{flex-direction:column;gap:2px;display:flex}.hud-side--left .hud-data{align-items:flex-start}.hud-side--right .hud-data{align-items:flex-end}.hud-data-label{text-transform:uppercase;letter-spacing:.12em;color:#7ef0ff8c;font-size:10px;font-weight:500}.hud-data-value{color:var(--text-pure);text-shadow:0 0 16px #7ef0ff40;font-size:28px;font-weight:700;line-height:1}.hud-data-unit{color:var(--text-dim);margin-left:4px;font-size:11px;font-weight:400}.hud-side--right .hud-data-unit{margin-left:0;margin-right:4px}.hud-route-map{bottom:max(60px, env(safe-area-inset-bottom));pointer-events:none;will-change:opacity, transform;flex-direction:column;align-items:center;gap:0;width:clamp(320px,85vw,580px);max-width:calc(100% - 32px);display:flex;position:absolute;left:50%;transform:translate(-50%)}.hud-route-map svg{width:100%;height:auto;display:block}.gauges-row{justify-content:center;gap:0;width:100%;margin-bottom:10px;display:flex;transform:translateY(-20px)}.gauge{flex-direction:column;flex:1;justify-content:flex-end;align-items:center;display:flex;position:relative;overflow:visible}.gauge-svg{width:100%;height:auto;max-height:60px;overflow:visible}.gauge-center{flex-direction:column-reverse;justify-content:center;align-items:center;gap:20px;display:flex;position:absolute;bottom:0;left:50%;transform:translate(-50%)translateY(45%)}.gauge-value{color:var(--text-pure);font-size:14px;font-weight:700;line-height:1}.gauge-unit{color:#7ef0ffb3;letter-spacing:.08em;font-size:10px;font-weight:500}.cycling-hud--overlay .hud-left,.cycling-hud--overlay .hud-right,.cycling-hud--overlay .hud-bottom{display:none}@media (width<=768px){.hud-side{gap:10px;top:max(30%,200px)}.hud-side--left{top:max(35%,240px);left:16px}.hud-side--right{top:max(30%,200px);right:16px}.hud-data-value{font-size:20px}.hud-data-label{font-size:8px}.hud-data-unit{font-size:9px}.hud-route-map{width:clamp(280px,92vw,380px)}.gauges-row{gap:0;margin-bottom:10px;transform:translateY(-25px)}.gauge{width:33.3333%}.gauge-svg{max-height:45px}.gauge-center{top:auto;bottom:0;transform:translate(-50%)translateY(50%)}.gauge-value{font-size:10px}.gauge-unit{font-size:7px}}@media (width>=1200px){.hud-route-map{width:clamp(500px,45vw,620px)}.gauge-svg{max-height:70px}.gauge-value{font-size:14px}.gauge-unit{font-size:10px}.gauges-row{margin-bottom:10px;transform:translateY(-20px)}}.staggered-menu-wrapper{z-index:40;pointer-events:none;width:100%;height:100%;position:relative}.staggered-menu-wrapper.fixed-wrapper{z-index:40;pointer-events:none;width:100vw;height:100vh;position:fixed;top:0;left:0;overflow:hidden}.staggered-menu-header{pointer-events:none;z-index:20;background:0 0;justify-content:flex-end;align-items:center;width:auto;padding:2rem 0;display:flex;position:fixed;top:0;right:1.5rem}@media (width>=768px){.staggered-menu-header{padding:2rem 0;right:2.5rem}}@media (width>=1024px){.staggered-menu-header{padding:2rem 0;right:4rem}}.staggered-menu-header>*{pointer-events:auto}.sm-logo{-webkit-user-select:none;user-select:none;color:var(--text-main);align-items:center;display:flex}.sm-logo-text{letter-spacing:.12em;text-transform:uppercase;color:var(--text-main);align-items:center;gap:.6rem;font-size:.95rem;font-weight:600;display:flex}.sm-logo-dot{background:var(--accent-cyan);border-radius:9999px;width:8px;height:8px;display:inline-block;box-shadow:0 0 14px #7ef0ffb3}.sm-toggle{cursor:pointer;color:var(--accent-cyan);letter-spacing:.22em;text-transform:uppercase;text-shadow:0 0 18px #7ef0ff73,0 0 2px #7ef0ff99;background:0 0;border:none;align-items:center;gap:.7rem;padding:6px 10px;font-size:1.05rem;font-weight:800;line-height:1;transition:color .3s,transform .3s;display:inline-flex;position:relative;overflow:visible}.sm-toggle:hover{color:var(--accent-cyan-soft,#c8faff);text-shadow:0 0 24px #7ef0ff99,0 0 2px #7ef0ffcc;transform:translateY(-1px)}.sm-toggle:focus-visible{outline-offset:6px;border-radius:2px;outline:1px solid #7ef0ff66}.sm-toggle-textWrap{white-space:nowrap;height:1em;width:var(--sm-toggle-width,auto);min-width:var(--sm-toggle-width,auto);display:inline-block;position:relative;overflow:hidden}.sm-toggle-textInner{flex-direction:column;line-height:1;display:flex}.sm-toggle-line{height:1em;line-height:1;display:block}.sm-icon{will-change:transform;flex:0 0 12px;justify-content:center;align-items:center;width:12px;height:12px;display:inline-flex;position:relative}.sm-icon-line{will-change:transform;background:currentColor;border-radius:2px;width:100%;height:1.5px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.staggered-menu-panel{-webkit-backdrop-filter:blur(24px);z-index:10;pointer-events:auto;opacity:0;transform-origin:100% 0;background:#0a112266;border:1px solid #7ef0ff26;border-radius:14px;flex-direction:column;width:140px;height:auto;padding:.75rem .875rem;display:flex;position:fixed;top:3.75rem;right:1.5rem;overflow:visible;transform:scale(.95)}@media (width>=768px){.staggered-menu-panel{right:2.5rem}}@media (width>=1024px){.staggered-menu-panel{right:4rem}}[data-position=left] .staggered-menu-panel{transform-origin:0 0;left:1.5rem;right:auto}.sm-prelayers{pointer-events:none;z-index:5;opacity:0;width:140px;height:auto;position:fixed;top:calc(2rem + 8px);right:1.5rem}@media (width>=768px){.sm-prelayers{right:2.5rem}}@media (width>=1024px){.sm-prelayers{right:4rem}}[data-position=left] .sm-prelayers{left:1.5rem;right:auto}.sm-prelayer{opacity:0;border-radius:14px;position:absolute;inset:0;transform:translate(0);background:#0a112266!important}.sm-panel-inner{flex-direction:column;flex:1;gap:1.5rem;display:flex}.sm-panel-itemWrap{line-height:1;position:relative;overflow:hidden}.sm-panel-list{flex-direction:column;align-items:center;gap:.15rem;margin:0;padding:0;list-style:none;display:flex}.sm-panel-item{color:var(--text-main);cursor:pointer;letter-spacing:-.005em;padding:.2rem 0;font-size:1.1rem;font-weight:500;line-height:1.25;text-decoration:none;transition:color .25s;display:inline-block;position:relative}.sm-panel-itemLabel{will-change:transform;transform-origin:50% 100%;display:inline-block}.sm-panel-item:hover{color:var(--accent-cyan)}.sm-panel-list[data-numbering] .sm-panel-item:after{content:"";letter-spacing:.18em;text-transform:uppercase;color:var(--accent-cyan);opacity:.6;font-size:.75rem;font-weight:400;position:absolute;top:50%;right:0;transform:translateY(-50%)}.sm-socials{flex-direction:column;gap:.75rem;margin-top:auto;padding-top:2rem;display:flex}.sm-socials-title{letter-spacing:.24em;text-transform:uppercase;color:var(--text-dim);margin:0;font-size:10px;font-weight:500}.sm-socials-list{flex-flow:wrap;align-items:center;gap:1.25rem;margin:0;padding:0;list-style:none;display:flex}.sm-socials-link{color:var(--text-main);padding:2px 0;font-size:.9rem;font-weight:500;text-decoration:none;transition:color .25s;display:inline-block;position:relative}.sm-socials-list:hover .sm-socials-link{color:var(--text-dim)}.sm-socials-list:hover .sm-socials-link:hover{color:var(--accent-cyan)}@media (width<=1024px){.staggered-menu-panel,.sm-prelayers{width:130px}}@media (width<=640px){.staggered-menu-panel{width:120px;padding:.625rem .75rem;right:1.5rem}.sm-prelayers{width:120px;right:1.5rem}[data-position=left] .staggered-menu-panel,[data-position=left] .sm-prelayers{left:1.5rem;right:auto}.sm-panel-item{font-size:.9rem}}