[hidden] { display: none !important; }

.ui-mode-screen {
  position: relative;
  width: min(100%, 420px);
  height: 100dvh;
  min-height: 560px;
  margin: 0 auto;
  overflow: hidden;
  animation: mode-arrive 260ms ease both;
}

body:not([data-ui-mode="base"]) > .shell,
body:not([data-ui-mode="base"]) > .topography,
.ui-mode-screen { display: none; }

body[data-ui-mode="compass"] [data-mode-screen="compass"],
body[data-ui-mode="topomap"] [data-mode-screen="topomap"],
body[data-ui-mode="altimeter"] [data-mode-screen="altimeter"],
body[data-ui-mode="watch"] [data-mode-screen="watch"],
body[data-ui-mode="profile"] [data-mode-screen="profile"],
body[data-ui-mode="hud"] [data-mode-screen="hud"],
body[data-ui-mode="clean"] [data-mode-screen="clean"],
body[data-ui-mode="neon"] [data-mode-screen="neon"],
body[data-ui-mode="meadow"] [data-mode-screen="meadow"],
body[data-ui-mode="rugged"] [data-mode-screen="rugged"],
body[data-ui-mode="alpine"] [data-mode-screen="alpine"] { display: block; }

.mode-switcher {
  position: fixed;
  z-index: 40;
  top: max(12px, env(safe-area-inset-top));
  right: max(12px, calc((100vw - 420px) / 2 + 12px));
  width: 46px;
  min-height: 46px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 50%;
  color: #edf0e7;
  background: rgba(15,20,16,.7);
  box-shadow: 0 8px 28px rgba(0,0,0,.22);
  backdrop-filter: blur(14px);
}

body[data-ui-mode="base"] .mode-switcher {
  top: auto;
  bottom: max(12px, env(safe-area-inset-bottom));
}

.mode-switcher > span { width: 17px; height: 17px; display: grid; grid-template-columns: repeat(2,1fr); gap: 3px; }
.mode-switcher > span i { border: 1px solid currentColor; border-radius: 50%; }
.mode-switcher > span i:first-child { background: currentColor; }
.mode-switcher > span i:last-child { grid-column: 1 / -1; border-radius: 1px; }
.mode-switcher > b { display: none; }

.mode-live { display: inline-flex; align-items: center; gap: 6px; color: #899487; font-size: 9px; white-space: nowrap; }
.mode-live i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.mode-live b { font-weight: 500; }
.mode-live.active { color: #d5ff63; }
.mode-live.active i { animation: mode-pulse 1.8s infinite; }

.mode-picker-layer { position: fixed; z-index: 80; inset: 0; display: flex; align-items: flex-end; justify-content: center; padding: 10px; background: rgba(2,5,3,.66); backdrop-filter: blur(10px); }
.mode-picker { width: min(100%, 420px); max-height: calc(100dvh - 20px); padding: 16px 14px 12px; overflow: auto; border: 1px solid #3d463b; border-radius: 18px; color: #eef0e9; background: #151a15; box-shadow: 0 28px 70px rgba(0,0,0,.55); }
.mode-picker header { display: flex; align-items: flex-start; justify-content: space-between; }
.mode-picker header span { color: #82907e; font: 8px/1 "SFMono-Regular", Consolas, monospace; letter-spacing: .14em; }
.mode-picker h2 { margin: 4px 0 0; font-size: 22px; letter-spacing: -.04em; }
.mode-picker header button { width: 44px; min-height: 44px; padding: 0; border: 1px solid #475145; border-radius: 50%; color: #d6dbd1; background: transparent; font-size: 24px; }
.mode-options { margin-top: 13px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mode-options > button { min-height: 86px; display: grid; grid-template-columns: 42px 1fr 12px; align-items: center; gap: 8px; padding: 9px; border: 1px solid #353d34; border-radius: 7px; color: #dce0d8; background: #1e241e; text-align: left; }
.mode-options > button.selected { border-color: #c9e75f; background: #293026; }
.mode-options > button > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; }
.mode-options small { color: #82907d; font-size: 7px; }
.mode-options b { margin-top: 4px; font-size: 11px; }
.mode-options em { color: #bad365; font-size: 14px; font-style: normal; }
.mode-picker > p { margin: 11px 0 0; color: #73806f; font-size: 8px; text-align: center; }
.mode-mini { position: relative; width: 42px; height: 58px; display: block; overflow: hidden; border: 1px solid #586554; border-radius: 3px; background: #101510; }
.mode-mini i { position: absolute; display: block; }
.mode-mini-base i:first-child { inset: 7px 4px 25px; border: 1px solid #a9bd77; }
.mode-mini-base i:nth-child(2) { left: 4px; right: 4px; bottom: 17px; border-top: 7px double #6b7965; }
.mode-mini-base i:nth-child(3) { left: 4px; right: 4px; bottom: 5px; height: 8px; background: #c8e861; }
.mode-mini-compass i:first-child { inset: 9px 1px; border: 2px solid #b6ca7c; border-radius: 50%; }
.mode-mini-compass i:nth-child(2) { top: 17px; left: 20px; width: 2px; height: 25px; background: #d8f45f; transform: rotate(18deg); }
.mode-mini-topomap { background: #aaba98; }
.mode-mini-topomap i:first-child { width: 58px; height: 30px; top: 8px; left: -9px; border: 2px solid #60775d; border-radius: 50%; }
.mode-mini-topomap i:nth-child(2) { top: 31px; left: 2px; width: 45px; height: 3px; background: #f5dd91; transform: rotate(-25deg); }
.mode-mini-topomap i:nth-child(3) { top: 27px; left: 20px; width: 8px; height: 8px; border-radius: 50%; background: #d44e2d; }
.mode-mini-altimeter i:first-child { inset: 6px 0 8px; border: 4px solid #555a50; border-radius: 50%; background: repeating-conic-gradient(#ddd9c9 0 2deg,transparent 2deg 20deg); }
.mode-mini-altimeter i:nth-child(2) { top: 29px; left: 21px; width: 17px; height: 2px; background: #e5a23b; transform: rotate(-38deg); }
.mode-mini-watch i:first-child { inset: 6px 0; border: 6px solid #596152; border-radius: 50%; }
.mode-mini-watch i:nth-child(2) { top: 24px; left: 10px; width: 22px; border-top: 7px double #c8ff52; }
.mode-mini-profile { background: #e8e1d5; }
.mode-mini-profile i:first-child { left: 7px; top: 5px; bottom: 5px; border-left: 1px solid #776e63; }
.mode-mini-profile i:nth-child(2) { left: 7px; right: 3px; bottom: 8px; height: 35px; background: #ad4c32; clip-path: polygon(0 80%,30% 55%,50% 68%,72% 25%,100% 8%,100% 13%,72% 31%,50% 74%,30% 62%,0 86%); }
.mode-mini-hud { background: #02090a; }
.mode-mini-hud i:first-child { top: 7px; left: 4px; right: 4px; border-top: 1px solid #6fffe0; }
.mode-mini-hud i:nth-child(2) { top: 18px; left: 7px; width: 10px; height: 20px; border-right: 1px solid #6fffe0; }
.mode-mini-hud i:nth-child(3) { left: 5px; right: 5px; bottom: 8px; border-top: 1px solid #6fffe0; }

/* 指南针 */
.compass-screen { padding: max(12px,env(safe-area-inset-top)) 18px max(8px,env(safe-area-inset-bottom)); color: #edf0df; background: repeating-radial-gradient(circle at 50% 43%,transparent 0 38px,rgba(221,229,196,.035) 39px 40px),#182017; }
.compass-header { height: 58px; display: flex; align-items: flex-start; justify-content: space-between; padding-right: 54px; }
.compass-header small { color: #9ba98e; font-size: 9px; letter-spacing: .14em; }
.compass-header h1 { margin: 3px 0 0; font-family: inherit; font-size: 20px; letter-spacing: -.04em; }
.compass-stage { position: relative; height: min(58vh,390px); display: grid; place-items: center; }
.compass-ring { position: relative; width: min(86vw,338px); aspect-ratio: 1; border: 1px solid rgba(225,234,202,.34); border-radius: 50%; background: radial-gradient(circle,transparent 0 35%,rgba(7,10,7,.2) 35.5% 36.2%,transparent 36.8%),radial-gradient(circle,rgba(209,226,169,.05),rgba(4,7,4,.24)); box-shadow: inset 0 0 0 12px rgba(8,11,8,.24),inset 0 0 50px rgba(0,0,0,.55); }
.compass-ticks { position: absolute; inset: 11px; border-radius: 50%; background: repeating-conic-gradient(from -1deg,#87937b 0 1deg,transparent 1deg 5deg); mask: radial-gradient(circle,transparent 0 86%,#000 86.5%); }
.cardinal,.bearing { position: absolute; z-index: 2; }
.cardinal { color: #f4f6e9; font: 700 20px/1 "SFMono-Regular",monospace; }
.cardinal-n { top: 24px; left: 50%; color: #d9ff66; transform: translateX(-50%); }.cardinal-e { top: 50%; right: 18px; transform: translateY(-50%); }.cardinal-s { bottom: 18px; left: 50%; transform: translateX(-50%); }.cardinal-w { top: 50%; left: 18px; transform: translateY(-50%); }
.bearing { color: #7d8874; font: 8px/1 monospace; }.bearing-ne{top:56px;right:58px}.bearing-se{bottom:56px;right:58px}.bearing-sw{bottom:56px;left:58px}.bearing-nw{top:56px;left:58px}
.compass-needle { position: absolute; z-index: 3; inset: 55px; }
.compass-needle::before,.compass-needle::after { content:"";position:absolute;left:50%;width:8px;height:50%;clip-path:polygon(50% 0,100% 100%,0 100%);transform:translateX(-50%); }
.compass-needle::before{top:0;background:#d9ff66}.compass-needle::after{bottom:0;background:#697064;transform:translateX(-50%) rotate(180deg)}.compass-needle i{position:absolute;z-index:2;top:50%;left:50%;width:18px;height:18px;border:5px solid #e9eddc;border-radius:50%;background:#171e16;transform:translate(-50%,-50%)}
.compass-core { position:absolute;z-index:4;inset:29%;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;background:rgba(18,25,17,.93);box-shadow:0 0 0 1px rgba(224,233,201,.22),0 14px 40px rgba(0,0,0,.42); }
.compass-core span{color:#98a58c;font-size:9px}.compass-core strong{font:600 clamp(40px,13vw,54px)/.92 "Arial Narrow",sans-serif;letter-spacing:-.06em}.compass-core em{font-size:10px;font-style:normal}.compass-core small{margin-top:7px;color:#d9ff66;font:8px/1.2 monospace;text-align:center}.north-index{position:absolute;top:8px;left:50%;color:#d9ff66;font-size:10px;transform:translateX(-50%)}
.compass-dock { height:68px;display:grid;grid-template-columns:1fr 1fr .72fr;border-top:1px solid #4d5848;border-bottom:1px solid #4d5848 }.compass-dock div{display:flex;min-width:0;flex-direction:column;justify-content:center;padding:0 8px;border-right:1px solid #4d5848}.compass-dock div:last-child{border:0}.compass-dock span{color:#788372;font-size:8px}.compass-dock b{margin-top:4px;overflow:hidden;font:600 11px/1 monospace;text-overflow:ellipsis}.compass-actions{height:58px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:7px}.compass-actions button{min-height:38px;padding:0 10px;border:1px solid #687563;color:#e8ebdd;background:transparent;font-size:9px}.compass-actions>span{color:#687363;font-size:8px;text-align:center}

/* 地形地图 */
.topomap-screen{color:#17231a;background:#bdc7aa}.topo-map{position:absolute;inset:0;overflow:hidden;background:linear-gradient(145deg,#cbd2b7,#aebc9c 55%,#92aa8a)}.topo-map::before{content:"";position:absolute;inset:0;opacity:.55;background:repeating-radial-gradient(ellipse at 70% 36%,transparent 0 23px,rgba(48,79,53,.24) 24px 25px);transform:rotate(-12deg) scale(1.4)}.topo-map::after{content:"";position:absolute;inset:0;opacity:.24;background:repeating-linear-gradient(112deg,transparent 0 47px,#526c50 48px 49px)}
.contour{position:absolute;border:1px solid rgba(39,68,43,.35);border-radius:48% 52% 44% 56%;transform:rotate(-18deg)}.contour-a{width:300px;height:160px;top:96px;left:-90px}.contour-b{width:360px;height:220px;top:55px;left:-100px}.contour-c{width:330px;height:180px;top:230px;right:-130px}.contour-d{width:400px;height:240px;top:190px;right:-160px}.map-route{position:absolute;height:5px;border-radius:8px;background:#f8e8a9;box-shadow:0 0 0 1px rgba(53,69,43,.32);transform-origin:left center}.route-a{width:205px;top:200px;left:-25px;transform:rotate(24deg)}.route-b{width:130px;top:278px;left:153px;transform:rotate(-38deg)}.route-c{width:180px;top:201px;left:254px;transform:rotate(14deg)}.map-label{position:absolute;color:rgba(27,51,30,.58);font-size:9px;font-weight:700}.label-1{top:150px;left:65px}.label-2{top:236px;right:58px}
.map-header{position:absolute;z-index:4;top:max(12px,env(safe-area-inset-top));left:12px;right:68px;height:49px;display:flex;align-items:center;justify-content:space-between;padding:7px 11px;border-radius:5px;background:rgba(246,245,224,.88);backdrop-filter:blur(12px);box-shadow:0 8px 24px rgba(35,56,35,.15)}.map-header div{display:flex;min-width:0;flex-direction:column}.map-header span{color:#6c7969;font-size:8px}.map-header b{max-width:220px;overflow:hidden;font:600 10px/1.3 monospace;text-overflow:ellipsis;white-space:nowrap}.map-header .mode-live.active{color:#2d783b}
.map-pin{position:absolute;z-index:3;top:190px;left:47%;display:flex;align-items:center}.map-pin>i{position:relative;z-index:2;width:22px;height:22px;border:6px solid #fff8d9;border-radius:50% 50% 50% 3px;background:#d34c2c;box-shadow:0 5px 14px rgba(49,57,33,.3);transform:rotate(-45deg)}.pin-pulse{position:absolute;left:-8px;width:40px;height:40px;border:1px solid rgba(211,76,44,.6);border-radius:50%;animation:map-pulse 2s infinite}.map-pin div{margin-left:8px;display:flex;flex-direction:column;padding:7px 9px;border-radius:4px;color:#f7f4da;background:#233829}.map-pin strong{font-size:14px}.map-pin small{color:#b7c3ac;font-size:8px}.map-zoom{position:absolute;z-index:3;top:264px;right:14px;display:grid;overflow:hidden;border-radius:5px;box-shadow:0 7px 18px rgba(31,45,32,.2)}.map-zoom button{width:42px;min-height:42px;padding:0;border:0;border-bottom:1px solid #d2d4c3;color:#273c2a;background:rgba(248,247,226,.9);font-size:20px}
.map-sheet{position:absolute;z-index:5;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));height:270px;padding:9px 16px 14px;border-radius:22px 22px 8px 8px;color:#223125;background:#f2f0d8;box-shadow:0 -12px 34px rgba(38,55,39,.2)}.map-sheet-handle{width:40px;height:3px;margin:0 auto 8px;border-radius:4px;background:#aab09f}.map-sheet-title{display:flex;align-items:flex-end;justify-content:space-between}.map-sheet-title small{color:#7b8474;font-size:8px;letter-spacing:.12em}.map-sheet-title h1{margin:-3px 0 0;font:600 56px/.95 "Arial Narrow",sans-serif;letter-spacing:-.05em}.map-sheet-title h1 em{margin-left:4px;font-size:13px;font-style:normal}.map-sheet-title>b{margin-bottom:5px;padding:5px 7px;border-radius:3px;color:#b84227;background:#ead9bc;font-size:9px}.map-sheet-grid{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #c8c8b4}.map-sheet-grid div{min-height:44px;display:flex;min-width:0;flex-direction:column;justify-content:center;border-bottom:1px solid #c8c8b4}.map-sheet-grid div:first-child{grid-column:1/-1}.map-sheet-grid div:nth-child(2){border-right:1px solid #c8c8b4}.map-sheet-grid span{color:#7f8678;font-size:8px}.map-sheet-grid b{margin-top:2px;overflow:hidden;font:600 10px/1.2 monospace;text-overflow:ellipsis;white-space:nowrap}.map-sheet-actions{margin-top:10px;display:grid;grid-template-columns:.7fr 1.3fr;gap:8px}.map-sheet-actions button{min-height:40px;border:0;border-radius:4px;color:#304134;background:#d8d8c2;font-size:10px}.map-sheet-actions button:last-child{color:#f6f3d9;background:#2e5434}

/* 机械高度计 */
.altimeter-screen{padding:max(12px,env(safe-area-inset-top)) 14px max(8px,env(safe-area-inset-bottom));color:#e9e7db;background:linear-gradient(#292a26,#171814)}.altimeter-screen::before{content:"";position:absolute;inset:0;opacity:.12;background:repeating-linear-gradient(0deg,transparent 0 3px,#fff 4px);mix-blend-mode:overlay}.instrument-header{position:relative;z-index:2;height:48px;display:flex;align-items:flex-start;justify-content:space-between;padding-right:56px}.instrument-header>div:first-child{display:flex;align-items:baseline;gap:9px}.instrument-header span{color:#edaa3c;font:700 18px/1 "Arial Narrow",sans-serif;letter-spacing:.12em}.instrument-header>b,.instrument-header div>b{font-size:12px}.instrument-status{padding:6px 7px;border:1px solid #52564e;color:#9da293;font:8px/1 monospace}.instrument-status i{display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:#eaa33a}
.instrument-panel{position:relative;height:min(61vh,402px);display:grid;place-items:center;border:1px solid #3b3e38;border-radius:5px;background:#11120f;box-shadow:inset 0 0 0 5px #252720,inset 0 0 80px #000}.altimeter-dial{position:relative;width:min(88vw,348px);aspect-ratio:1;border:8px solid #363832;border-radius:50%;background:radial-gradient(circle,#22241f 0 60%,#12130f 61%);box-shadow:0 0 0 2px #080905,0 8px 28px #000,inset 0 0 25px #000}.dial-ticks{position:absolute;inset:11px;border-radius:50%;background:repeating-conic-gradient(#e6e3d5 0 1deg,transparent 1deg 3.6deg);mask:radial-gradient(circle,transparent 0 84%,#000 84.5%)}.dial-number{position:absolute;color:#e5e2d3;font:600 22px/1 "Arial Narrow",sans-serif}.dial-number.n0{top:7%;left:48%}.dial-number.n1{top:14%;right:21%}.dial-number.n2{top:34%;right:7%}.dial-number.n3{top:59%;right:7%}.dial-number.n4{bottom:14%;right:21%}.dial-number.n5{bottom:6%;left:48%}.dial-number.n6{bottom:14%;left:20%}.dial-number.n7{top:59%;left:7%}.dial-number.n8{top:34%;left:7%}.dial-number.n9{top:14%;left:20%}.dial-needle{position:absolute;z-index:4;top:50%;left:50%;width:38%;height:5px;background:#e9e5d5;clip-path:polygon(0 30%,100% 0,100% 100%,0 70%);transform-origin:0 50%}.needle-short{width:25%;height:8px;background:#c6a767;transform:rotate(112deg)}.dial-center{position:absolute;z-index:6;top:50%;left:50%;width:34px;height:34px;border:8px solid #4a4b43;border-radius:50%;background:#13140f;transform:translate(-50%,-50%)}.dial-center i{position:absolute;inset:6px;border-radius:50%;background:#d5d2c4}.drum-window{position:absolute;z-index:3;top:40%;left:50%;display:flex;align-items:center;gap:4px;padding:6px 8px;border:2px solid #77796e;color:#ebe8d7;background:#090a08;transform:translateX(-50%)}.drum-window span{color:#e19a32;font:700 12px/1 monospace}.drum-window strong{font:700 14px/1 monospace;letter-spacing:.12em}.drum-window em{color:#a5a598;font-size:9px;font-style:normal}.pressure-window{position:absolute;bottom:19%;left:50%;padding:5px 8px;border:1px solid #55584f;color:#b9b9ae;background:#151612;font:8px/1 monospace;transform:translateX(-50%)}.instrument-screws i{position:absolute;width:9px;height:9px;border-radius:50%;background:#5a5c54}.instrument-screws i:nth-child(1){top:10px;left:10px}.instrument-screws i:nth-child(2){top:10px;right:10px}.instrument-screws i:nth-child(3){bottom:10px;left:10px}.instrument-screws i:nth-child(4){bottom:10px;right:10px}.instrument-readouts{position:relative;height:66px;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #3f423b;border-top:0}.instrument-readouts div{display:flex;min-width:0;flex-direction:column;justify-content:center;padding-left:9px;border-right:1px solid #3f423b}.instrument-readouts div:last-child{border:0}.instrument-readouts span{color:#7f8379;font:7px/1 monospace}.instrument-readouts b{margin-top:5px;overflow:hidden;color:#d69b40;font:600 10px/1 monospace;text-overflow:ellipsis;white-space:nowrap}.instrument-footer{position:relative;height:65px;display:grid;grid-template-columns:74px 1fr 64px;align-items:center;gap:7px}.instrument-footer button{height:39px;min-height:39px;padding:0;border:1px solid #6c6f65;color:#d9d8ce;background:#292b25;font:9px/1 monospace}.instrument-footer p{margin:0;color:#73786d;font:8px/1.5 monospace;text-align:center}

/* 户外腕表 */
.watch-screen{padding:max(12px,env(safe-area-inset-top)) 14px max(8px,env(safe-area-inset-bottom));color:#eef1e3;background:linear-gradient(160deg,#30352d,#11140f 70%)}.watch-page-header{height:62px;display:flex;align-items:flex-start;justify-content:space-between;padding-right:58px}.watch-page-header small{color:#aab39f;font-size:8px;letter-spacing:.15em}.watch-page-header h1{margin:3px 0 0;font-family:inherit;font-size:19px}.watch-page-header>span{margin-top:5px;color:#c8ff52;font:600 12px/1 monospace}.watch-case{position:relative;height:min(71vh,470px);display:grid;place-items:center}.watch-bezel{position:relative;z-index:2;width:min(89vw,350px);aspect-ratio:1;border:16px solid #444a3e;border-radius:50%;background:#171a15;box-shadow:0 0 0 4px #131510,0 0 0 7px #626859,0 18px 50px #080a07}.watch-bezel::before{content:"";position:absolute;inset:-11px;border-radius:50%;background:repeating-conic-gradient(#9aa18f 0 1deg,transparent 1deg 10deg);mask:radial-gradient(circle,transparent 0 93%,#000 94%)}.watch-face{position:absolute;inset:17px;border-radius:50%;overflow:hidden;padding:10% 10% 8%;background:radial-gradient(circle at 50% 45%,#243124,#10150f 75%);box-shadow:inset 0 0 35px #050705}.bezel-label{position:absolute;z-index:3;color:#9ea594;font:700 8px/1 monospace}.bezel-top{top:9px;left:50%;transform:translateX(-50%)}.bezel-right{right:-2px;top:50%;transform:rotate(90deg)}.bezel-bottom{bottom:8px;left:50%;transform:translateX(-50%)}.bezel-left{left:0;top:50%;transform:rotate(-90deg)}.watch-topline{display:flex;justify-content:space-between;color:#c8ff52;font:8px/1 monospace}.watch-altitude{height:98px;display:flex;align-items:center;justify-content:center}.watch-altitude strong{font:600 clamp(62px,21vw,82px)/.9 "Arial Narrow",sans-serif;letter-spacing:-.07em}.watch-altitude span{margin:35px 0 0 6px;color:#c8ff52;font-size:12px}.watch-trend{height:34px;display:flex;align-items:flex-end;justify-content:center;gap:5px;border-bottom:1px solid #56634f}.watch-trend i{width:18px;background:#81986a}.watch-trend i:nth-child(1){height:8px}.watch-trend i:nth-child(2){height:12px}.watch-trend i:nth-child(3){height:10px}.watch-trend i:nth-child(4){height:18px}.watch-trend i:nth-child(5){height:23px}.watch-trend i:nth-child(6){height:27px}.watch-trend i:nth-child(7){height:25px;background:#c8ff52}.watch-quads{display:grid;grid-template-columns:1fr 1fr;height:83px}.watch-quads div{display:flex;min-width:0;flex-direction:column;justify-content:center;padding:0 9px;border-right:1px solid #3e493a;border-bottom:1px solid #3e493a}.watch-quads div:nth-child(2n){border-right:0}.watch-quads div:nth-child(n+3){border-bottom:0}.watch-quads span{color:#71806b;font-size:7px}.watch-quads b{margin-top:3px;overflow:hidden;font:600 10px/1 monospace;text-overflow:ellipsis;white-space:nowrap}.watch-lug{position:absolute;z-index:1;width:54px;height:78px;border:3px solid #545b4d;background:#292e27}.lug-left-top{top:12%;left:2px}.lug-left-bottom{bottom:12%;left:2px}.lug-right-top{top:12%;right:2px}.lug-right-bottom{bottom:12%;right:2px}.watch-crown{position:absolute;z-index:4;top:44%;right:-3px;width:26px;height:53px;min-height:0;padding:0;border:2px solid #777d6c;border-radius:0 8px 8px 0;background:repeating-linear-gradient(0deg,#343a31 0 3px,#1c211b 4px 6px)}.watch-help{height:69px;display:flex;align-items:center;justify-content:center;gap:14px}.watch-help button{min-height:42px;padding:0 16px;border:1px solid #6c7564;color:#dfe4d6;background:transparent;font-size:10px}.watch-help p{margin:0;color:#899383;font-size:8px}

/* 海拔剖面 */
.profile-screen{padding:max(12px,env(safe-area-inset-top)) 16px max(8px,env(safe-area-inset-bottom));color:#27231e;background:#eee8dc}.profile-header{height:57px;display:flex;align-items:flex-start;justify-content:space-between;padding-right:56px}.profile-header small{color:#8c8174;font-size:8px;letter-spacing:.14em}.profile-header h1{margin:3px 0 0;font-family:"Songti SC",serif;font-size:21px;font-weight:500}.profile-header .mode-live.active{color:#b64c30}.profile-summary{height:92px;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;align-items:end;border-bottom:1px solid #bdb5a7}.profile-summary>span{color:#8f8578;font-size:9px}.profile-summary strong{grid-row:1/3;grid-column:2;font:500 68px/.9 "Arial Narrow",sans-serif;letter-spacing:-.07em}.profile-summary strong em{margin-left:4px;color:#b64c30;font-size:13px;font-style:normal}.profile-summary small{max-width:170px;padding-bottom:12px;overflow:hidden;color:#b64c30;font-size:8px;text-overflow:ellipsis;white-space:nowrap}.profile-chart{height:min(45vh,300px);display:grid;grid-template-columns:38px 1fr;padding-top:14px}.profile-scale{display:flex;flex-direction:column;justify-content:space-between;padding:0 6px 22px 0;color:#9a9083;font:8px/1 monospace;text-align:right}.profile-plot{position:relative;overflow:hidden;border-left:1px solid #aaa193;border-bottom:1px solid #aaa193}.grid-line{position:absolute;left:0;right:0;border-top:1px dashed rgba(118,108,95,.32)}.g1{top:0}.g2{top:25%}.g3{top:50%}.g4{top:75%}.profile-fill{position:absolute;left:0;right:0;bottom:0;height:78%;background:linear-gradient(to top,rgba(170,73,46,.24),rgba(170,73,46,.02));clip-path:polygon(0 75%,9% 72%,18% 60%,28% 64%,37% 42%,46% 48%,55% 29%,64% 35%,74% 18%,83% 28%,92% 12%,100% 8%,100% 100%,0 100%)}.profile-line{position:absolute;left:0;right:0;bottom:0;height:78%;background:#aa492e;clip-path:polygon(0 74%,9% 71%,18% 59%,28% 63%,37% 41%,46% 47%,55% 28%,64% 34%,74% 17%,83% 27%,92% 11%,100% 7%,100% 8%,92% 12%,83% 28%,74% 18%,64% 35%,55% 29%,46% 48%,37% 42%,28% 64%,18% 60%,9% 72%,0 75%)}.current-profile-marker{position:absolute;top:19px;right:0;bottom:21px;width:1px;background:#aa492e}.current-profile-marker i{position:absolute;top:-4px;left:-4px;width:9px;height:9px;border:2px solid #eee8dc;border-radius:50%;background:#aa492e}.current-profile-marker b{position:absolute;top:-5px;right:8px;padding:3px 5px;color:#eee8dc;background:#aa492e;font:8px/1 monospace}.profile-times{position:absolute;left:0;right:0;bottom:5px;display:flex;justify-content:space-between;padding:0 4px;color:#958b7e;font:8px/1 monospace}.profile-stats{height:64px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #c5bdaf;border-bottom:1px solid #c5bdaf}.profile-stats div{display:flex;min-width:0;flex-direction:column;justify-content:center;padding-left:9px;border-right:1px solid #c5bdaf}.profile-stats div:last-child{border:0}.profile-stats span{color:#93897d;font-size:8px}.profile-stats b{margin-top:4px;overflow:hidden;font:600 11px/1 monospace;text-overflow:ellipsis;white-space:nowrap}.profile-footer{height:72px;display:grid;grid-template-columns:1fr 88px 52px;align-items:center;gap:7px}.profile-footer div{display:flex;flex-direction:column;gap:3px;color:#766d62;font:8px/1 monospace}.profile-footer button{min-height:42px;padding:0;border:1px solid #37322b;color:#37322b;background:transparent;font-size:9px}.profile-footer button:last-child{color:#eee8dc;background:#37322b}

/* 驾驶 HUD */
.hud-screen{padding:max(12px,env(safe-area-inset-top)) 16px max(8px,env(safe-area-inset-bottom));color:#6fffe0;background:#02080a}.hud-screen::before{content:"";position:absolute;inset:0;opacity:.16;background:repeating-linear-gradient(0deg,transparent 0 3px,#6fffe0 4px);pointer-events:none}.hud-ribbon{position:relative;height:52px;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;padding-right:52px;border-bottom:1px solid rgba(111,255,224,.4);font:10px/1 monospace;text-align:center}.hud-ribbon span{color:#3e8f80}.hud-ribbon span.active{color:#6fffe0;font-size:17px;font-weight:700}.hud-ribbon i{position:absolute;left:50%;bottom:-7px;width:1px;height:13px;background:#6fffe0}.hud-status{position:relative;height:48px;display:flex;align-items:center;gap:15px;color:#53bba6;font:9px/1 monospace}.hud-status>b{margin-left:auto;margin-right:57px;color:#6fffe0}.hud-main{position:relative;height:min(37vh,244px);display:grid;grid-template-columns:.76fr 1.24fr;align-items:center}.hud-main>div{height:70%;display:flex;flex-direction:column;align-items:center;justify-content:center}.hud-speed{border-right:1px solid rgba(111,255,224,.25)}.hud-main small{color:#398b7c;font-size:10px;letter-spacing:.12em}.hud-main strong{font:500 clamp(62px,18vw,74px)/.95 "Arial Narrow",sans-serif;letter-spacing:-.07em;text-shadow:0 0 20px rgba(111,255,224,.3)}.hud-altitude strong{font-size:clamp(82px,26vw,104px)}.hud-main span{font:9px/1 monospace}.hud-horizon{position:relative;height:86px}.hud-horizon::before{content:"";position:absolute;left:25px;right:25px;top:44px;border-top:1px solid #6fffe0}.hud-horizon i{position:absolute;top:32px;width:86px;height:22px;border-top:2px solid #6fffe0}.hud-horizon i:first-child{left:18px;transform:rotate(8deg)}.hud-horizon i:nth-child(2){right:18px;transform:rotate(-8deg)}.hud-horizon span{position:absolute;top:33px;left:50%;width:16px;height:16px;border-right:2px solid #6fffe0;border-bottom:2px solid #6fffe0;transform:translateX(-50%) rotate(45deg)}.hud-bottom{position:relative;height:76px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(111,255,224,.35);border-bottom:1px solid rgba(111,255,224,.35)}.hud-bottom div{display:flex;min-width:0;flex-direction:column;justify-content:center;padding-left:9px;border-right:1px solid rgba(111,255,224,.2)}.hud-bottom div:last-child{border:0}.hud-bottom span{color:#347d70;font-size:8px}.hud-bottom b{margin-top:6px;overflow:hidden;font:600 10px/1 monospace;text-overflow:ellipsis;white-space:nowrap}.hud-footer{position:relative;height:70px;display:grid;grid-template-columns:80px 1fr 58px;align-items:center;gap:7px}.hud-footer button{height:42px;min-height:42px;padding:0;border:1px solid #48ad9a;color:#6fffe0;background:rgba(15,54,48,.35);font-size:9px}.hud-footer p{margin:0;color:#347a6d;font:7px/1.4 monospace;text-align:center}

/* 参考图新增模式：共享实时数据与操作 */
.reference-actions{display:grid;grid-template-columns:1fr 48px;gap:8px}.reference-actions button{min-height:46px;border:0;border-radius:13px;font-weight:650}.reference-actions .track-action{display:flex;align-items:center;justify-content:center;gap:9px}.reference-actions img{width:20px;height:20px}.reference-actions .copy-action{display:grid;place-items:center}.mode-subline{display:flex;min-width:0;align-items:center;justify-content:space-between;gap:8px;font-size:8px}.mode-subline>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mode-subline b{font:inherit}.reference-list article{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px}.reference-list article>img{width:22px;height:22px}.reference-list article>span{font-size:11px}.reference-list article>b{max-width:190px;overflow:hidden;font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap}

/* 清爽卡片 */
.clean-screen{padding:max(18px,env(safe-area-inset-top)) 16px max(10px,env(safe-area-inset-bottom));color:#101b30;background:linear-gradient(155deg,#fff 0,#f6f9fd 72%,#eef4fb 100%)}.clean-header{height:68px;display:flex;align-items:flex-start;justify-content:center;position:relative}.clean-title{text-align:center}.clean-title small{color:#8c96a7;font:7px/1.2 monospace;letter-spacing:.14em}.clean-title h1{margin:4px 0 0;font-size:22px;letter-spacing:.02em}.clean-status{position:absolute;top:31px;padding:6px 10px;border-radius:16px;color:#27ac63;background:#eaf7f0;font-size:8px}.clean-status.active{color:#22b866}.clean-altitude-card{height:164px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #e8edf3;border-radius:18px;background:rgba(255,255,255,.82);box-shadow:0 10px 28px rgba(37,55,84,.08)}.clean-altitude-card>span{color:#687388;font-size:12px}.clean-altitude-card>div{height:78px;display:flex;align-items:flex-end}.clean-altitude-card strong{font:650 clamp(72px,25vw,98px)/.82 -apple-system,BlinkMacSystemFont,"SF Pro Display",sans-serif;letter-spacing:-.07em}.clean-altitude-card em{margin:0 0 7px 6px;font-size:20px;font-style:normal}.clean-altitude-card>img{width:31px;height:31px;margin-top:4px;filter:invert(60%) sepia(52%) saturate(524%) hue-rotate(98deg)}.clean-altitude-card>small{width:90%;margin-top:4px;overflow:hidden;color:#8c96a7;font-size:8px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.clean-metrics{height:226px;margin-top:10px;padding:3px 14px;border:1px solid #e9edf3;border-radius:18px;background:rgba(255,255,255,.86);box-shadow:0 9px 26px rgba(37,55,84,.07)}.clean-metrics article{height:55px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #edf0f4}.clean-metrics article:last-child{border:0}.clean-metrics .metric-icon{width:34px;height:34px;display:grid;flex:0 0 34px;place-items:center;border-radius:50%}.clean-metrics .metric-icon img{width:19px;height:19px}.clean-metrics .blue{background:#e9f2ff}.clean-metrics .blue img{filter:invert(43%) sepia(93%) saturate(1745%) hue-rotate(202deg)}.clean-metrics .green{background:#eaf8ef}.clean-metrics .green img{filter:invert(53%) sepia(70%) saturate(569%) hue-rotate(92deg)}.clean-metrics .violet{background:#f0edff}.clean-metrics .violet img{filter:invert(47%) sepia(70%) saturate(2260%) hue-rotate(222deg)}.clean-metrics .cyan{background:#e9f5ff}.clean-metrics .cyan img{filter:invert(47%) sepia(79%) saturate(1530%) hue-rotate(186deg)}.clean-metrics p{min-width:0;margin:0;display:flex;flex-direction:column}.clean-metrics small{color:#788398;font-size:9px}.clean-metrics b{margin-top:2px;overflow:hidden;font:550 14px/1.2 -apple-system,BlinkMacSystemFont,sans-serif;text-overflow:ellipsis;white-space:nowrap}.clean-screen .mode-subline{height:25px;color:#8792a5}.clean-actions .track-action{color:#fff;background:#2f7df4}.clean-actions .track-action img,.clean-actions .copy-action img{filter:brightness(0) invert(1)}.clean-actions .copy-action{background:#13213a}.clean-screen .mode-switcher{color:#2f7df4;background:rgba(255,255,255,.86);border-color:#d9e3f2}

body[data-ui-mode="clean"] .clean-header{height:78px}
body[data-ui-mode="clean"] .clean-status{top:43px}

/* 夜光仪表 */
.neon-screen{padding:max(14px,env(safe-area-inset-top)) 16px max(9px,env(safe-area-inset-bottom));color:#eaf3ff;background:radial-gradient(circle at 50% 24%,#09203e 0,#030b17 42%,#01060c 100%)}.neon-screen::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 0 46%,rgba(58,138,255,.04) 50%,transparent 54%)}.neon-header{height:54px;display:flex;align-items:flex-start;justify-content:center;position:relative}.neon-header h1{margin:5px 0 0;font-size:21px;font-weight:600;letter-spacing:.04em}.neon-live{position:absolute;right:53px;top:8px;padding:6px 9px;border:1px solid rgba(47,224,123,.2);border-radius:20px;color:#61db9b;background:rgba(1,31,24,.5)}.neon-live.active{color:#43ee8c}.neon-dial{position:relative;height:208px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(70,143,255,.25);border-radius:50% 50% 28% 28% / 62% 62% 18% 18%;background:radial-gradient(ellipse at center,rgba(18,76,150,.24),transparent 64%)}.neon-ticks{position:absolute;width:245px;height:180px;top:-10px;border-radius:50% 50% 0 0;background:repeating-conic-gradient(from 296deg,rgba(75,151,255,.7) 0 1deg,transparent 1.4deg 5deg);clip-path:inset(0 0 48%);mask:radial-gradient(ellipse,#0000 0 72%,#000 73%)}.neon-dial>span{z-index:1;color:#6ab0ff;font-size:15px}.neon-dial>strong{z-index:1;margin-top:7px;font:700 clamp(74px,24vw,96px)/.88 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:-.075em;text-shadow:0 0 22px rgba(61,143,255,.64)}.neon-dial>em{z-index:1;margin-top:7px;color:#6fb4ff;font-size:15px;font-style:normal}.neon-dial>small{z-index:1;width:80%;margin-top:5px;overflow:hidden;color:#496b93;font-size:8px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.neon-metrics{height:210px;margin-top:6px;display:grid;gap:5px}.neon-metrics article{height:49px;padding:0 13px;border:1px solid rgba(76,137,213,.23);border-radius:12px;background:linear-gradient(90deg,rgba(9,28,49,.82),rgba(4,13,25,.84))}.neon-metrics article>img{filter:invert(66%) sepia(73%) saturate(2300%) hue-rotate(187deg)}.neon-metrics article>span{color:#a9bdd7}.neon-metrics article>b{font:600 15px/1.1 -apple-system,BlinkMacSystemFont,sans-serif}.neon-subline{height:24px;color:#466688}.neon-actions .track-action{color:#68adff;border:1px solid #4d99f6;background:rgba(19,57,98,.36)}.neon-actions img{filter:invert(65%) sepia(73%) saturate(1974%) hue-rotate(187deg)}.neon-actions .copy-action{border:1px solid #24486e;background:#08182a}.neon-screen+.mode-switcher{border-color:#235084;color:#6aaeff;background:rgba(2,11,24,.72)}

/* 山野水彩 */
.meadow-screen{padding:max(12px,env(safe-area-inset-top)) 12px max(8px,env(safe-area-inset-bottom));color:#173d29;background:#e8f3ec url("./assets/backgrounds/meadow-watercolor.png") center/cover no-repeat}.meadow-header{height:142px;position:relative;display:flex;align-items:flex-start;justify-content:center}.meadow-header>div{margin-top:22px;text-align:center;text-shadow:0 1px 8px rgba(255,255,255,.7)}.meadow-header h1{margin:0;color:#25613f;font:700 27px/1.2 "Songti SC",serif;letter-spacing:.06em}.meadow-header p{margin:5px 0 0;color:#4b795d;font-size:10px}.meadow-live{position:absolute;top:1px;left:2px;color:#38754f;font-size:9px}.meadow-live.active{color:#267845}.meadow-sheet{position:absolute;left:12px;right:12px;top:150px;bottom:max(8px,env(safe-area-inset-bottom));padding:13px 14px 12px;border:1px solid rgba(92,126,95,.18);border-radius:30px 30px 16px 16px;background:rgba(250,252,245,.89);box-shadow:0 -7px 30px rgba(54,88,64,.15);backdrop-filter:blur(9px)}.meadow-altitude{height:128px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-bottom:1px solid rgba(73,120,82,.18)}.meadow-altitude>img{width:28px;height:28px;filter:invert(37%) sepia(21%) saturate(1149%) hue-rotate(91deg)}.meadow-altitude>span{margin-top:1px;font:600 14px/1.2 "Songti SC",serif}.meadow-altitude>div{height:62px;display:flex;align-items:flex-end}.meadow-altitude strong{font:650 clamp(63px,22vw,84px)/.82 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:-.07em}.meadow-altitude em{margin:0 0 7px 5px;font-size:20px;font-style:normal}.meadow-altitude>small{max-width:94%;overflow:hidden;color:#6e9179;font-size:7px;text-overflow:ellipsis;white-space:nowrap}.meadow-metrics{height:188px;margin-top:7px;display:grid;gap:5px}.meadow-metrics article{height:43px;padding:0 11px;border:1px solid rgba(117,143,119,.14);border-radius:10px;background:rgba(255,255,255,.86);box-shadow:0 5px 12px rgba(52,83,58,.08)}.meadow-metrics article>img{filter:invert(37%) sepia(21%) saturate(1149%) hue-rotate(91deg)}.meadow-metrics article>span{color:#30573c}.meadow-metrics article>b{font-size:13px}.meadow-subline{height:23px;color:#6b8a74}.meadow-actions .track-action{color:#fff;background:linear-gradient(135deg,#4d8f61,#2c7045)}.meadow-actions .track-action img{filter:brightness(0) invert(1)}.meadow-actions .copy-action{border:1px solid #a5c1ab;background:#edf6ee}.meadow-actions .copy-action img{filter:invert(35%) sepia(35%) saturate(824%) hue-rotate(88deg)}.meadow-screen+.mode-switcher{border-color:rgba(50,104,66,.25);color:#2e7649;background:rgba(247,251,243,.8)}

/* 硬核仪表 */
.rugged-screen{padding:max(12px,env(safe-area-inset-top)) 14px max(8px,env(safe-area-inset-bottom));color:#e8edf6;background:radial-gradient(circle at 50% 30%,#101e2b,#050c13 65%,#020609)}.rugged-screen::before{content:"";position:absolute;inset:0;opacity:.14;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 3px,#6aa4e6 4px)}.rugged-header{height:48px;display:flex;align-items:flex-start;justify-content:center;gap:22px}.rugged-header h1{margin:6px 0 0;font-size:22px;font-weight:500;letter-spacing:.08em}.rugged-header>i{width:26px;margin-top:15px;border-top:4px double #48617e;transform:skew(-20deg)}.rugged-altitude{position:relative;height:250px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:7px double #3d4d5d;border-radius:18px;background:linear-gradient(145deg,#13212d,#050c12);box-shadow:inset 0 0 0 1px #677486,inset 0 0 55px #010407,0 9px 28px rgba(0,0,0,.42)}.rugged-altitude::before,.rugged-altitude::after{content:"";position:absolute;top:50%;width:15px;border-top:2px solid #5493ee}.rugged-altitude::before{left:10px}.rugged-altitude::after{right:10px}.rugged-altitude>span{color:#aab5c4;font-size:15px;letter-spacing:.08em}.rugged-altitude>div{height:115px;display:flex;align-items:flex-end}.rugged-altitude strong{font:650 clamp(88px,29vw,116px)/.82 "Arial Narrow",sans-serif;letter-spacing:-.045em;text-shadow:0 0 14px rgba(90,148,236,.18)}.rugged-altitude em{margin:0 0 9px 7px;color:#6b86ac;font-size:27px;font-style:normal}.rugged-altitude>small{width:76%;overflow:hidden;color:#5e7187;font-size:8px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.rugged-screw{position:absolute;width:13px;height:13px;border:3px solid #010407;border-radius:50%;background:#566473;box-shadow:0 0 0 1px #7c8b99}.rugged-screw::after{content:"";position:absolute;top:4px;left:0;width:7px;border-top:1px solid #081019;transform:rotate(45deg)}.rugged-screw.s1{top:8px;left:8px}.rugged-screw.s2{top:8px;right:8px}.rugged-screw.s3{bottom:8px;left:8px}.rugged-screw.s4{right:8px;bottom:8px}.rugged-grid{height:188px;margin-top:9px;display:grid;grid-template-columns:1fr 1fr;gap:7px}.rugged-grid article{min-width:0;padding:10px;border:1px solid #314152;border-radius:9px;background:linear-gradient(135deg,#111f2b,#08121b);box-shadow:inset 0 0 17px rgba(69,117,172,.07)}.rugged-grid p{margin:0;display:flex;align-items:center;gap:7px;color:#9daabb;font-size:10px}.rugged-grid p img{width:18px;height:18px;filter:invert(53%) sepia(88%) saturate(1785%) hue-rotate(194deg)}.rugged-grid article>b{display:block;margin-top:13px;overflow:hidden;color:#eef3fa;font:600 16px/1 "Arial Narrow",sans-serif;text-align:center;text-overflow:ellipsis;white-space:nowrap}.rugged-status{height:35px;margin-top:7px;display:flex;align-items:center;justify-content:space-around;border:1px solid #2b3948;border-radius:10px;background:#0c1721}.rugged-status span{display:flex;align-items:center;gap:6px;color:#8290a1;font-size:8px}.rugged-status span:first-child{color:#65d889}.rugged-status img{width:15px;height:15px;filter:invert(78%) sepia(26%) saturate(1040%) hue-rotate(83deg)}.rugged-status span:last-child img{filter:invert(60%) sepia(9%) saturate(665%) hue-rotate(173deg)}.rugged-subline{height:22px;color:#607286}.rugged-actions .track-action{color:#72aaff;border:1px solid #477ec7;background:#0d2034}.rugged-actions img{filter:invert(64%) sepia(89%) saturate(1415%) hue-rotate(189deg)}.rugged-actions .copy-action{border:1px solid #30465f;background:#081522}.rugged-screen+.mode-switcher{border-color:#35577b;color:#6fa6ee;background:rgba(5,13,22,.76)}

/* 冰峰蓝 */
.alpine-screen{padding:max(12px,env(safe-area-inset-top)) 14px max(8px,env(safe-area-inset-bottom));color:#18243a;background:#eef6ff url("./assets/backgrounds/alpine-blue.png") center/cover no-repeat}.alpine-header{height:105px;display:flex;align-items:flex-start;justify-content:center;position:relative}.alpine-header h1{margin:7px 0 0;color:#fff;font-size:25px;font-weight:750;letter-spacing:.06em;text-shadow:0 2px 12px rgba(1,63,166,.38)}.alpine-live{position:absolute;top:47px;padding:5px 9px;border-radius:20px;color:#d8edff;background:rgba(2,82,205,.3);backdrop-filter:blur(6px)}.alpine-live.active{color:#fff}.alpine-altitude{height:174px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:24px;background:rgba(255,255,255,.94);box-shadow:0 14px 30px rgba(14,79,167,.2)}.alpine-altitude>img{width:29px;height:29px;filter:invert(43%) sepia(92%) saturate(2118%) hue-rotate(194deg)}.alpine-altitude>span{margin-top:2px;font-size:12px;font-weight:650}.alpine-altitude>div{height:79px;display:flex;align-items:flex-end}.alpine-altitude strong{color:#1167f1;font:750 clamp(73px,25vw,98px)/.84 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:-.075em}.alpine-altitude em{margin:0 0 8px 6px;color:#1167f1;font-size:22px;font-style:normal;font-weight:700}.alpine-altitude>small{max-width:90%;overflow:hidden;color:#4aa36f;font-size:8px;text-overflow:ellipsis;white-space:nowrap}.alpine-grid{height:197px;margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.alpine-grid article{min-width:0;padding:11px;border-radius:16px;background:rgba(255,255,255,.94);box-shadow:0 8px 22px rgba(23,74,139,.12)}.alpine-grid p{margin:0;display:flex;align-items:center;gap:7px;font-size:10px;font-weight:650}.alpine-grid p img{width:22px;height:22px}.alpine-grid article>b{display:block;margin-top:13px;overflow:hidden;font:700 15px/1.1 -apple-system,BlinkMacSystemFont,sans-serif;text-align:center;text-overflow:ellipsis;white-space:nowrap}.alpine-grid .blue img{filter:invert(34%) sepia(100%) saturate(2186%) hue-rotate(210deg)}.alpine-grid .green img{filter:invert(52%) sepia(78%) saturate(905%) hue-rotate(106deg)}.alpine-grid .orange img{filter:invert(55%) sepia(91%) saturate(1522%) hue-rotate(359deg)}.alpine-grid .purple img{filter:invert(38%) sepia(96%) saturate(2735%) hue-rotate(247deg)}.alpine-grid .blue b{color:#135fdf}.alpine-grid .green b{color:#169554}.alpine-grid .orange b{color:#bf6c07}.alpine-grid .purple b{color:#6541db}.alpine-subline{height:25px;color:#5f7390}.alpine-actions .track-action{color:#fff;background:linear-gradient(135deg,#197dff,#0059eb);box-shadow:0 7px 18px rgba(0,83,221,.25)}.alpine-actions .track-action img,.alpine-actions .copy-action img{filter:brightness(0) invert(1)}.alpine-actions .copy-action{background:#173e7b}.alpine-screen+.mode-switcher{border-color:rgba(255,255,255,.55);color:#fff;background:rgba(0,83,220,.56)}

.mode-mini-clean{background:#f7f9fc;border-color:#cfd7e3}.mode-mini-clean i:first-child{inset:6px 4px 31px;border-radius:3px;background:#fff;box-shadow:0 0 0 1px #dce4ee}.mode-mini-clean i:nth-child(2){left:4px;right:4px;top:31px;height:14px;border-top:3px double #7fa9ea;border-bottom:3px double #6ec38d}.mode-mini-clean i:nth-child(3){left:4px;right:4px;bottom:4px;height:6px;border-radius:2px;background:#2f7df4}.mode-mini-neon{background:#020914;border-color:#24558c}.mode-mini-neon i:first-child{inset:7px 5px 25px;border:1px solid #418ce9;border-radius:50%}.mode-mini-neon i:nth-child(2){left:5px;right:5px;bottom:15px;border-top:8px double #173d69}.mode-mini-neon i:nth-child(3){left:9px;right:9px;bottom:5px;height:4px;background:#5aa2ff}.mode-mini-meadow{background:linear-gradient(#b9dded 0 42%,#edf4d7 43%);border-color:#8db69a}.mode-mini-meadow i:first-child{left:-5px;right:-5px;top:19px;height:17px;background:#77a986;clip-path:polygon(0 100%,25% 31%,41% 73%,65% 6%,100% 100%)}.mode-mini-meadow i:nth-child(2){left:4px;right:4px;top:31px;bottom:4px;border-radius:8px;background:#f7f8eb}.mode-mini-meadow i:nth-child(3){left:12px;right:12px;bottom:8px;height:4px;background:#4f9060}.mode-mini-rugged{background:#07111b;border-color:#46576a}.mode-mini-rugged i:first-child{inset:5px 3px 25px;border:3px double #566b80}.mode-mini-rugged i:nth-child(2){left:3px;right:3px;bottom:5px;height:17px;background:linear-gradient(90deg,#132231 48%,transparent 49% 51%,#132231 52%)}.mode-mini-rugged i:nth-child(3){left:9px;right:9px;top:19px;height:4px;background:#5c96e4}.mode-mini-alpine{background:linear-gradient(#0876f9 0 48%,#eef6ff 49%);border-color:#5b98ef}.mode-mini-alpine i:first-child{left:-4px;right:-4px;top:16px;height:21px;background:#dcecff;clip-path:polygon(0 100%,25% 37%,38% 73%,56% 2%,76% 66%,100% 30%,100% 100%)}.mode-mini-alpine i:nth-child(2){left:4px;right:4px;top:31px;height:15px;border-radius:5px;background:#fff}.mode-mini-alpine i:nth-child(3){left:5px;right:5px;bottom:4px;height:7px;background:linear-gradient(90deg,#fff 48%,transparent 49% 51%,#fff 52%)}

body[data-ui-mode="clean"] .mode-switcher{color:#2f7df4;background:rgba(255,255,255,.86);border-color:#d9e3f2}
body[data-ui-mode="neon"] .mode-switcher{border-color:#235084;color:#6aaeff;background:rgba(2,11,24,.72)}
body[data-ui-mode="meadow"] .mode-switcher{border-color:rgba(50,104,66,.25);color:#2e7649;background:rgba(247,251,243,.8)}
body[data-ui-mode="rugged"] .mode-switcher{border-color:#35577b;color:#6fa6ee;background:rgba(5,13,22,.76)}
body[data-ui-mode="alpine"] .mode-switcher{border-color:rgba(255,255,255,.55);color:#fff;background:rgba(0,83,220,.56)}
body[data-ui-mode="meadow"] .meadow-screen{background-image:url("./assets/backgrounds/meadow-watercolor.jpg")}
body[data-ui-mode="alpine"] .alpine-screen{background-image:url("./assets/backgrounds/alpine-blue.jpg")}

@keyframes mode-arrive { from{opacity:0;transform:scale(.985)} to{opacity:1;transform:scale(1)} }
@keyframes mode-pulse { 70%{box-shadow:0 0 0 7px transparent} 100%{box-shadow:0 0 0 0 transparent} }
@keyframes map-pulse { from{opacity:.8;transform:scale(.4)} to{opacity:0;transform:scale(1.5)} }

@media (min-width: 640px) {
  body:not([data-ui-mode="base"]) { overflow: hidden; }
}

@media (max-width: 639px) and (max-height: 620px) {
  .compass-stage { height: 330px; }
  .instrument-panel { height: 345px; }
  .watch-case { height: 390px; }
  .profile-chart { height: 245px; }
  .hud-main { height: 190px; }
  .hud-horizon { height: 62px; }
}

@media (prefers-reduced-motion: reduce) {
  .ui-mode-screen,.mode-live.active i,.pin-pulse { animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}
