.mt_face{position:relative;width:100%;height:100%;aspect-ratio:1;border-radius:50%;background:var(--yi-canvas,#183740);color:var(--yi-ink,#F4F0E5);font-family:inherit;isolation:isolate;container-type:inline-size;container-name:map-time-face;overflow:hidden;--time-hub:var(--yi-clock-face,#244652)}
.mt_watch{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;fill:none;stroke:var(--yi-outer-rim,#56717E);stroke-width:2.8;stroke-linecap:round;z-index:2}
.mt_pages{position:absolute;inset:6.0174%;border-radius:50%;overflow:hidden;container-type:inline-size;z-index:1}
.mt_page{position:absolute;inset:0;container-type:inline-size;will-change:transform,filter}.mt_page[hidden],.mt_centerPage[hidden],.mt_countPage[hidden]{display:none}
.mt_geometry{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.mt_yearSector,.mt_sideSector,.mt_dateSector{stroke:var(--yi-divider,#102F3B);stroke-width:2.5}.mt_yearSector{fill:var(--yi-sector,#214751)}.mt_sideSector{fill:var(--yi-sector-alternate,#183D4B)}.mt_dateSector{fill:var(--yi-sector,#214751)}
.mt_hubRing{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;overflow:visible}
.mt_hubBase{fill:var(--time-hub);stroke-opacity:1}.mt_hubBase[data-counting=true]{stroke-opacity:.3}.mt_hubProgress{stroke-linecap:round}
/* Every intermediate position comes from the scroll core, never a CSS jump animation. */
.mt_track{position:absolute;touch-action:none;user-select:none;-webkit-user-select:none;z-index:1;overflow:hidden}
.mt_face .mt_slot{position:absolute;top:33.333333%;left:0;box-sizing:border-box;width:100%;height:33.333333%;min-width:0;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--yi-ink,#F4F0E5);font:inherit;font-size:clamp(calc(15px * var(--map-dial-scale,1)),5.2cqw,calc(19px * var(--map-dial-scale,1)));font-weight:650;line-height:1;display:flex;align-items:center;justify-content:center;white-space:nowrap;font-variant-numeric:tabular-nums;touch-action:none;cursor:pointer;will-change:transform,opacity}
.mt_face .mt_slot span{display:inline-flex;align-items:baseline;justify-content:center;gap:clamp(calc(1px * var(--map-dial-scale,1)),.5cqw,calc(2px * var(--map-dial-scale,1)));max-width:100%}.mt_face .mt_slot small{font-size:57.7%;line-height:1}
.mt_face .mt_slot:disabled{cursor:default;color:var(--yi-disabled,#607C87)}.mt_face .mt_slot:focus-visible{outline:2px solid var(--yi-focus,#D7E5DF);outline-offset:-3px}
.mt_hour,.mt_minute{width:21.978%;height:36.264%;top:26.374%}.mt_hour{left:7.418%}.mt_minute{right:7.418%}
.mt_face .mt_hour .mt_slot,.mt_face .mt_minute .mt_slot{font-size:clamp(calc(22px * var(--map-dial-scale,1)),7.7cqw,calc(28px * var(--map-dial-scale,1)))}
.mt_face .mt_hour .mt_slot small,.mt_face .mt_minute .mt_slot small{font-size:clamp(calc(12px * var(--map-dial-scale,1)),4.4cqw,calc(16px * var(--map-dial-scale,1)))}
.mt_year{left:21%;top:10%;width:58%;height:min(44px,15.8cqw);--year-hit:min(44px,17cqw)}
.mt_yearNumbers{position:absolute;left:var(--year-hit);right:var(--year-hit);top:0;bottom:0;overflow:hidden}
.mt_face .mt_year .mt_slot{top:0;height:100%;font-size:clamp(calc(18px * var(--map-dial-scale,1)),6.3cqw,calc(23px * var(--map-dial-scale,1)))}
.mt_face .mt_yearArrow{position:absolute;top:0;width:var(--year-hit);height:100%;min-width:0;min-height:0;box-sizing:border-box;margin:0;padding:0;border:0;border-radius:4px;background:transparent;color:var(--yi-ink,#F4F0E5);font:inherit;font-size:clamp(calc(30px * var(--map-dial-scale,1)),11.5cqw,calc(44px * var(--map-dial-scale,1)));line-height:1;display:grid;place-items:center;cursor:pointer;touch-action:none}
.mt_yearBack{left:0}.mt_yearForward{right:0}.mt_face .mt_yearArrow:disabled{color:var(--yi-disabled,#607C87);opacity:.28;cursor:default}
.mt_face .mt_yearArrow:not(:disabled):hover{background:var(--yi-hover-surface,#2B505C)}.mt_face .mt_yearArrow:focus-visible{outline:2px solid var(--yi-focus,#D7E5DF);outline-offset:-3px;background:var(--yi-hover-surface,#2B505C)}
.mt_month,.mt_day{top:74.176%;width:16.484%;height:23.077%}.mt_month{left:29.396%}.mt_day{right:29.396%}
.mt_hub{position:absolute;left:32.60029%;top:32.60029%;width:34.79942%;height:34.79942%;border-radius:50%;pointer-events:none;overflow:hidden;background:var(--time-hub);z-index:4}.mt_hubContent{position:absolute;inset:0;border-radius:inherit;pointer-events:none}
.mt_pages,.mt_hubContent{filter:var(--map-time-outer-filter,none)}
.mt_hubSwipe{position:absolute;inset:0;border-radius:50%;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;z-index:0}
.mt_artwork{position:absolute;left:21%;top:12%;width:24%;height:24%;pointer-events:none}.mt_artwork .mt_bouncingIcon{display:block;width:100%;height:100%;animation:time-icon-hop 4s cubic-bezier(.22,.61,.36,1) infinite}
.mt_activityName{position:absolute;top:22%;left:47%;width:44%;text-align:left;font-size:clamp(calc(10px * var(--map-dial-scale,1)),3cqw,calc(13px * var(--map-dial-scale,1)));font-weight:600;line-height:1.05;pointer-events:none}
.mt_pager{position:absolute;inset:0;color:var(--yi-ink,#F4F0E5);pointer-events:none;z-index:1}
.mt_pagerLabel{position:absolute;top:82%;left:0;width:100%;display:flex;justify-content:center;font-size:clamp(calc(10px * var(--map-dial-scale,1)),3cqw,calc(13px * var(--map-dial-scale,1)));font-weight:700;line-height:1;white-space:nowrap}.mt_pagerLabel>span:last-child{display:none}
.mt_pagerArrow{position:absolute;left:27.58583%;top:50%;width:min(44px,14.6cqw);height:min(44px,14.6cqw);transform:translate(-50%,-50%);display:grid;place-items:center;font-size:clamp(calc(32px * var(--map-dial-scale,1)),11.7cqw,calc(44px * var(--map-dial-scale,1)));line-height:1;pointer-events:none}
.mt_pagerArrow:last-child{left:72.41417%}.mt_pagerArrow[data-disabled=true]{opacity:.28}
.mt_pagerHits{position:absolute;inset:0;z-index:5;pointer-events:none}.mt_pagerHits[hidden]{display:none}
/* Full rectangles maximize the existing r76 hub without clipping or shared hit areas.
   The 200px carrier keeps >1px inner-stroke clearance and an independent center gap.
   At the measured218px carrier these are31.8px, not a claimed44px. */
.mt_face .mt_pagerHit{position:absolute;top:50%;width:min(44px,14.6cqw);height:min(44px,14.6cqw);transform:translate(-50%,-50%);box-sizing:border-box;min-width:0;min-height:0;padding:0;margin:0;border:0;border-radius:4px;background:transparent;pointer-events:auto;cursor:pointer;touch-action:manipulation}
.mt_pagerHitBack{left:42.2%}.mt_pagerHitForward{left:57.8%}
.mt_face .mt_pagerHit:disabled{pointer-events:none;cursor:default}
.mt_face .mt_pagerHit:not(:disabled):hover{background:var(--yi-hover-surface,#2B505C)}.mt_face .mt_pagerHit:focus-visible{outline:2px solid var(--yi-focus,#D7E5DF);outline-offset:-2px;background:var(--yi-hover-surface,#2B505C)}
.mt_centerPage{position:absolute;inset:0;will-change:transform,filter;pointer-events:none}
.mt_countTrack,.mt_countPage{position:absolute;inset:0;pointer-events:none}.mt_countTrack{z-index:1}
.mt_countNumeral{position:absolute;inset:0;display:grid;place-items:center;color:var(--yi-ink,#F4F0E5);font-family:Bahnschrift,"DIN Alternate","Arial Narrow","Segoe UI",sans-serif;font-size:clamp(calc(32px * var(--map-dial-scale,1)),14cqw,calc(64px * var(--map-dial-scale,1)));font-weight:550;font-stretch:semi-condensed;font-variation-settings:"wght" 550,"wdth" 85;font-variant-numeric:lining-nums tabular-nums;line-height:1;transform:translateY(-.025em)}
.mt_srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes time-icon-hop{0%,67%,84%,100%{transform:translateY(0)}72%{transform:translateY(-8%)}77%{transform:translateY(0)}81%{transform:translateY(-4%)}}
@media(prefers-reduced-motion:reduce){.mt_page,.mt_centerPage,.mt_face .mt_slot{will-change:auto}.mt_artwork .mt_bouncingIcon{animation:none}}

/* Keep readable type when the carrier is fitted to a narrow map. */
@container map-time-face (max-width:310px){
 .mt_hour{left:7.1429%}.mt_minute{right:7.1429%}
 
 .mt_month,.mt_day{top:71.7033%;width:17.5824%;height:24.7253%}.mt_month{left:30.2198%}.mt_day{right:30.2198%}
 .mt_hub{overflow:hidden}
 
 
}
@container map-time-face (max-width:230px){
 .mt_hour .mt_slot[data-current=true]::before,.mt_hour .mt_slot[data-current=true]::after,.mt_minute .mt_slot[data-current=true]::before,.mt_minute .mt_slot[data-current=true]::after{display:none}
}

/* Keep the existing page arrows visible while the center presents its interruptible countdown. */
.mt_countdownArrow{display:grid;place-items:center;width:100%;height:100%;color:var(--yi-ink,#F4F0E5);font-family:inherit;font-size:clamp(calc(32px * var(--map-dial-scale,1)),11.7cqw,calc(44px * var(--map-dial-scale,1)));line-height:1;pointer-events:none}
.mt_face .mt_pagerHit:disabled .mt_countdownArrow{opacity:.28}



/* The approved visible dial has the same r80 outer edge as r76/stroke8.
   Only this noninteractive SVG overhangs the original r72 swipe target. */
.mt_analogFace{position:absolute;left:50%;top:50%;width:calc(16000% / 413.8);height:calc(16000% / 413.8);transform:translate(-50%,-50%);z-index:4;overflow:visible;pointer-events:none;filter:var(--map-time-outer-filter,none)}
.mt_analogFace image,.mt_analogFace g,.mt_analogFace circle{pointer-events:none}
.mt_face[data-map-time-start-only=true] .mt_hub{background:transparent}
.mt_face[data-map-time-start-only=true] .mt_hubRing{z-index:6}
.mt_face[data-map-time-start-only=true] .mt_hubBase{fill:none;stroke-opacity:0}
.mt_face[data-map-time-start-only=true] .mt_hubBase[data-counting=true]{stroke-opacity:.3}
.mt_face[data-map-time-start-only=true] .mt_countNumeral{color:var(--yi-countdown-ink,#F4F0E5)}

/* Calendar and candidates follow the activity; watch and its countdown remain carbon blue. */
@media(forced-colors:none){
.mt_watch{stroke:var(--yi-metal-markers)}.mt_yearSector,.mt_dateSector{fill:var(--yi-selected-surface)}.mt_sideSector{fill:var(--yi-surface)}.mt_face .mt_slot:not(:disabled){color:var(--yi-muted)}.mt_face .mt_slot[data-current=true]:not(:disabled){color:var(--yi-ink)}
.mt_face[data-map-time-start-only=true] .mt_hubBase,.mt_face[data-map-time-start-only=true] .mt_hubProgress{stroke:var(--yi-watch-countdown-ring)}.mt_face[data-map-time-start-only=true] .mt_countNumeral{color:var(--yi-watch-countdown-ink)}
}

@media(max-width:760px){
 .mt_touchControls{min-width:0;max-width:100%}
 .mt_touchControls .mt_touchToggle{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-width:44px;min-height:44px;font:inherit}
 .mt_touchRows{display:grid;gap:8px;margin-top:8px}
 .mt_touchRow{display:grid;grid-template-columns:44px minmax(44px,1fr) 44px;gap:8px;align-items:stretch}
 .mt_touchControls .mt_touchRow button{min-width:44px;min-height:44px;padding:4px;border-radius:8px;touch-action:manipulation;font:inherit;font-size:20px}
 .mt_touchControls .mt_touchRow .mt_touchValue{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:13px;line-height:1.25;overflow-wrap:anywhere}
 .mt_touchValue small{font-size:11px;font-weight:400}
 .mt_touchValue strong{font-size:14px;font-weight:650}
}