/* Android 4.4 DeskClock: icon tabs without an underline (DeskClockTabStyle uses item_background), alarm cards,
   the round footer buttons and the dark RadialTimePicker. 1 dp = 0.906 px. */
.jbclock-app{background:#1c1e20}
.jbclock-tabs button.active::after{display:none}
.jbclock-tabs button:active{background:#ffffff26}
.kdc-page{display:flex;flex-direction:column;height:100%;min-height:0;position:relative}
.kdc-list{flex:1;min-height:0;overflow-y:auto;scrollbar-width:none;padding-bottom:4px}
.kdc-list::-webkit-scrollbar{display:none}
.kdc-alarm{border-bottom:0;position:relative}
.kdc-alarm.expanded{background:#ffffff0c}
.kdc-top{display:flex;align-items:center;margin:10.87px 10.87px 0}
.kdc-time{border:0;background:none;padding:0;color:#fff;font:300 43.49px/1.1 RobotoLight,RobotoICS,sans-serif;display:flex;align-items:baseline;gap:2px}
.kdc-time b{font:700 12.68px RobotoCondensed,'Roboto Condensed',RobotoICS,sans-serif;margin-left:1.81px}
.kdc-alarm.off .kdc-time{color:#ffffff80}
.kdc-time:active{background:#ffffff26}
.kdc-switch{margin-left:auto}
.kdc-body{position:relative}
.kdc-delete{position:absolute;right:0;top:0;border:0;background:none;padding:7.25px;z-index:1}
.kdc-delete img{width:28.99px;height:28.99px;display:block}
.kdc-expand{padding-top:2px}
.kdc-label{display:block;max-width:calc(100% - 60px);border:0;background:none;padding:10.87px 10.87px 10.87px 16.31px;color:#ffffff80;font:400 16.31px RobotoICS,sans-serif;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kdc-label.set{color:#fff}
.kdc-checkrow{display:flex;align-items:center;gap:2px;height:43.49px;border:0;background:none;padding:0 0 0 9.06px;color:#ffffff80;font:400 16.31px RobotoICS,sans-serif}
.kdc-checkrow.on{color:#fff}
.kdc-check{width:28.99px;height:28.99px}
.kdc-days{display:flex;height:43.49px;margin:0 9.06px}
.kdc-day{flex:1;min-width:0;border:0;background:none;color:#ffffff80;font:400 14.5px RobotoCondensed,'Roboto Condensed',RobotoICS,sans-serif;position:relative;padding:0}
.kdc-day::after{content:'';position:absolute;left:7.25px;right:7.25px;bottom:7.25px;height:1.81px;background:#ffffff1a}
.kdc-day.on{color:#fff;font-weight:700}
.kdc-day.on::after{background:#33b5e5cc}
.kdc-tone-row{display:flex;align-items:center;height:57.98px;margin:0 14.5px 0 9.06px}
.kdc-tone{flex:1;min-width:0;display:flex;align-items:center;gap:1.81px;border:0;background:none;padding:0;color:#fff;font:400 16.31px RobotoICS,sans-serif;text-align:left;height:100%}
.kdc-tone img{width:28.99px;height:28.99px}
.kdc-tone span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kdc-vibrate{flex:none}
.kdc-strip{display:flex;align-items:center;width:100%;height:43.49px;border:0;background:none;padding:0;position:relative;text-align:left;color:#fff}
.kdc-strip::after{content:'';position:absolute;left:7.25px;right:7.25px;bottom:0;height:.9px;background:#ffffff28}
.kdc-strip img{width:43.49px;height:28.99px;object-fit:contain;flex:none}
.kdc-summary{display:flex;gap:6px;min-width:0;margin-right:94px;font:12.68px RobotoICS,sans-serif;white-space:nowrap;overflow:hidden}
.kdc-summary-label{color:#ffffff80;overflow:hidden;text-overflow:ellipsis}
.kdc-summary-days{color:#fff;font-weight:700}
.kdc-empty{position:absolute;inset:0 0 72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#ffffff4c;font:300 32.6px RobotoLight,RobotoICS,sans-serif}
.kdc-empty img{width:86.98px;height:86.98px;opacity:.3}
.kdc-footer{flex:none;position:relative;display:flex;align-items:center;justify-content:center;height:79.73px;background:linear-gradient(0deg,#1c1e20,#1c1e2000)}
.kdc-add,.kdc-round{width:50.74px;height:50.74px;border:0;border-radius:50%;background:#606060;display:grid;place-items:center;padding:0}
.kdc-add:active,.kdc-round:active{background:#909090}
.kdc-add img,.kdc-round img{width:28.99px;height:28.99px}
.kdc-menu{position:absolute;right:7.25px;top:50%;transform:translateY(-50%);width:43.49px;height:43.49px;border:0;background:none}
.kdc-menu img{width:28.99px;height:28.99px}
.jbclock-footer.kdc-clock-footer{height:79.73px;border-top:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.jbclock-footer.kdc-clock-footer button{flex:none}
.jbclock-footer.kdc-clock-footer .kdc-round{width:50.74px;height:50.74px}
.jbclock-footer.kdc-clock-footer button:last-child{justify-self:end;width:43.49px;height:43.49px;margin-right:7.25px}
/* RadialTimePicker, dark theme: #363636 header (96 dp, 60 sp digits, the selected field red), the #404040 circle
   (270 dp) with white numbers, the #ff3333 hand, a #808080 line and the Done button. */
.kdc-picker{position:absolute;z-index:40;left:50%;top:50%;transform:translate(-50%,-50%);width:max-content;background:#363636;color:#fff;box-shadow:0 8px 24px #000a;overflow:hidden}
.kdc-picker-header{height:86.98px;display:flex;align-items:center;justify-content:center;gap:2px;font:300 54.36px/1 RobotoLight,RobotoICS,sans-serif}
.kdc-picker-header button{border:0;background:none;color:#fff;font:inherit;padding:0 2px}
.kdc-picker-header button.sel{color:#ff3333}
.kdc-picker-header .kdc-picker-ampm{font:400 14.5px RobotoICS,sans-serif;margin-left:5.44px;align-self:center}
.kdc-dial{position:relative;margin:0 auto;background:#404040;border-radius:0;touch-action:none;cursor:pointer}
.kdc-dial::before{content:'';position:absolute;inset:0;border-radius:50%;background:#404040}
.kdc-hand{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.kdc-num{position:absolute;transform:translate(-50%,-50%);font:400 14.5px RobotoICS,sans-serif;color:#fff;pointer-events:none}
.kdc-num.inner{font-size:12.68px;color:#ffffffcc}
.kdc-num.sel{color:#fff;font-weight:700}
.kdc-dial-ampm{position:absolute;bottom:7.25px;width:36.24px;height:36.24px;border:0;border-radius:50%;background:#ffffff1a;color:#fff;font:400 12.68px RobotoICS,sans-serif}
.kdc-dial-ampm.left{left:7.25px}.kdc-dial-ampm.right{right:7.25px}
.kdc-dial-ampm.sel{background:#ff3333}
.kdc-picker-done{display:block;width:100%;height:43.49px;border:0;border-top:.9px solid #808080;background:none;color:#fff;font:400 12.68px RobotoICS,sans-serif}
.kdc-picker-done:active{background:#ffffff26}

/* ---- The 4.2/4.3 DeskClock pages ---- */
/* Android 4.2/4.3 DeskClock (dark, Roboto Thin clock, AndroidClockMono counters, CircleTimerView). */
@font-face{font-family:RobotoThin;src:url('assets/Roboto-Thin.ttf') format('truetype')}
@font-face{font-family:AndroidClockMonoThin;src:url('assets/AndroidClockMono-Thin.ttf') format('truetype')}
@font-face{font-family:AndroidClockMonoLight;src:url('assets/AndroidClockMono-Light.ttf') format('truetype')}
@font-face{font-family:AndroidClockMonoBold;src:url('assets/AndroidClockMono-Bold.ttf') format('truetype')}
.jbclock-app{background:#000;color:#fff;display:flex;flex-direction:column;overflow:hidden}
.jbclock-tabs{flex:none;height:43px;display:flex;background:#000;border-bottom:1px solid #ffffff1a}
.jbclock-tabs button{flex:1;border:0;background:none;display:grid;place-items:center;position:relative}
.jbclock-tabs button img{width:29px;height:29px}
.jbclock-tabs button.active::after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:#33b5e5}
.jbclock-tabs button:active{background:#33b5e544}
.jbclock-pager{flex:1;min-height:0;overflow:hidden;touch-action:pan-y}
.jbclock-track{display:flex;height:100%;transition:transform .25s cubic-bezier(.22,.61,.36,1)}
.jbclock-page{flex:0 0 100%;min-width:0;height:100%;display:flex;flex-direction:column;overflow:hidden}
.jbclock-page>*{flex:1;min-height:0;display:flex;flex-direction:column}
.jbclock-footer{flex:none;height:43px;display:flex;border-top:1px solid #ffffff28;margin-top:auto}
.jbclock-footer button{flex:1;border:0;background:none;color:#fff;font:700 14px RobotoICS,sans-serif;text-transform:uppercase;display:grid;place-items:center}
.jbclock-footer button+button{border-left:1px solid #ffffff28}
.jbclock-footer button:disabled{color:#ffffff4d}
.jbclock-footer button:active:not(:disabled){background:#33b5e544}
.jbclock-footer button img{width:29px;height:29px}
.jbclock-footer.clock-buttons button{flex:0 0 58px}.jbclock-footer.clock-buttons button:nth-child(2){margin:0 auto}.jbclock-footer.clock-buttons button+button{border-left:0}
/* Clock page: bold hours with thin minutes (big_bold / big_thin, 120dp). */
.jbclock-clock{align-items:center}
.jbclock-time{margin-top:auto;display:flex;align-items:baseline;line-height:1;white-space:nowrap}
.jbclock-hours{font:700 96px/1 RobotoICS,Roboto,sans-serif;letter-spacing:-2px}
.jbclock-minutes{font:96px/1 RobotoThin,RobotoICS,sans-serif;letter-spacing:-2px}
.jbclock-time small{font:700 14px RobotoICS,sans-serif;margin-left:4px;text-transform:uppercase}
.jbclock-date{margin:6px 0 auto;display:flex;align-items:center;gap:8px;font:700 13px 'Roboto Condensed',RobotoICS,sans-serif;text-transform:uppercase;letter-spacing:.3px}
.jbclock-next{display:flex;align-items:center;gap:2px;color:#ffffff80}
.jbclock-next img{width:14px;height:14px}
/* Timer setup (TimerSetupView): H MM SS filled from the right, a 3 x 4 keypad, Cancel | Start. */
.jbclock-setup-display{flex:none;display:flex;align-items:baseline;justify-content:center;gap:1px;padding:22px 8px 8px;font:300 52px/1 AndroidClockMonoLight,RobotoICS,sans-serif;color:#ffffff4d;border-bottom:1px solid #ffffff28;margin:0 14px}
.jbclock-setup-display span.on{color:#fff}
.jbclock-setup-display small{font:700 13px RobotoICS,sans-serif;margin:0 6px 0 2px;text-transform:uppercase;color:inherit}
.jbclock-backspace{align-self:center;margin-left:4px;border:0;background:none;padding:6px}
.jbclock-backspace img{width:29px;height:29px}
.jbclock-keypad{flex:1;display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;padding:6px 14px}
.jbclock-keypad button{border:0;background:none;color:#fff;font:300 32px RobotoICS,sans-serif}
.jbclock-keypad button:active{background:#33b5e544}
/* CircleTimerView frame with 32dp margins and corner buttons. */
.jbclock-timers{overflow-y:auto}
.jbclock-timer{flex:none;padding:0 29px}
.jbclock-circle-frame{position:relative;width:100%;aspect-ratio:1;max-height:62vh;margin:8px auto 0;display:grid;place-items:center}
.jbclock-circle{position:absolute;inset:0;width:100%;height:100%}
.jbclock-count{font:300 46px/1 AndroidClockMonoThin,RobotoICS,sans-serif;white-space:nowrap}
.jbclock-count.stopwatch{font-size:40px}
.jbclock-timer.done .jbclock-count{font:700 26px RobotoICS,sans-serif;color:#ff4444;text-transform:uppercase}
.jbclock-label{position:absolute;top:62%;display:flex;align-items:center;gap:4px;font-size:13px;color:#ffffff80}
.jbclock-label img{width:16px;height:16px;opacity:.7}
.jbclock-corner{position:absolute;bottom:0;width:50px;height:50px;border:0;background:none;display:grid;place-items:center}
.jbclock-corner.left{left:0}.jbclock-corner.right{right:0}
.jbclock-corner img{width:29px;height:29px}
.jbclock-center{position:absolute;bottom:0;left:50%;transform:translateX(-50%);border:0;background:none;color:#fff;font:700 15px RobotoICS,sans-serif;text-transform:uppercase;padding:9px 12px}
.jbclock-corner:active,.jbclock-center:active{background:#33b5e544}
.jbclock-stopwatch .jbclock-circle-frame{width:calc(100% - 58px)}
.jbclock-laps{flex:1;min-height:0;overflow-y:auto;margin:6px 0 0;padding:0 14px;list-style:none;border-top:1px solid #ffffff1a}
.jbclock-laps li{display:grid;grid-template-columns:1fr 1.3fr 1.3fr;padding:6px 4px;font:15px AndroidClockMonoLight,RobotoICS,sans-serif;border-bottom:1px solid #ffffff12}
.jbclock-laps li span:first-child{color:#ffffff80;font-family:RobotoICS,sans-serif}
.jbclock-laps li span:last-child{text-align:right;color:#ffffff80}
.jbclock-clock>.jbclock-footer{align-self:stretch}

/* ---- DeskClock 4.0 (Lollipop) over the rules above ---- */
/* DeskClock 5.1 (Google DeskClock 3.0.4) over the jbclock/kdc markup; dp x 0.906. --dc is the hour colour. */
.app-view.jbclock-app.lpdc{position:relative;display:flex;flex-direction:column;height:100%;overflow:hidden;background:var(--dc);color:#fff;font-family:Roboto,sans-serif;transition:background-color 1s}
.lpdc .jbclock-tabs{position:relative;flex:none;display:flex;align-items:stretch;height:50.74px;padding:0;background:transparent;border:0;box-shadow:none}
.lpdc .jbclock-tabs button[role=tab]{flex:1;position:relative;border:0;background:none;display:grid;place-items:center;padding:0;box-shadow:none}
.lpdc .jbclock-tabs button[role=tab] img{width:21.74px;height:21.74px;opacity:1}
.lpdc .jbclock-tabs button[role=tab].active::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1.81px;background:#fff}
.jbclock-tabs .lpdc-overflow{flex:none;width:43.49px;border:0;background:none;display:grid;place-items:center;padding:0;border-radius:50%}
.jbclock-tabs .lpdc-overflow img{width:21.74px;height:21.74px}
.lpdc .jbclock-pager{flex:1;min-height:0}
/* The footer: FAB in the middle, borderless side buttons */
.lpdc-footer{position:absolute;left:0;right:0;bottom:0;z-index:4;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:14.5px 0;pointer-events:none}
.lpdc-footer>span{display:grid;place-items:center}
.lpdc-footer button{pointer-events:auto}
.lpdc-fab{width:50.74px;height:50.74px;border:0;border-radius:50%;padding:0;background:#ff4081;display:grid;place-items:center;box-shadow:0 3.6px 9px #00000059;transition:transform .2s,box-shadow .2s}
.lpdc-fab:active{box-shadow:0 7.2px 14px #00000066}
.lpdc-fab:disabled{opacity:0;transform:scale(.6);pointer-events:none}
.lpdc-fab img{width:21.74px;height:21.74px}
.lpdc-side{width:43.49px;height:43.49px;border:0;border-radius:50%;background:none;display:grid;place-items:center;padding:0}
.lpdc-side img{width:21.74px;height:21.74px}
.lpdc .jbclock-footer,.lpdc .kdc-footer,.lpdc .jbclock-center,.lpdc .jbclock-corner{display:none!important}
/* Clock */
.lpdc .jbclock-clock{background:none;padding-top:28.99px;justify-content:flex-start}
.lpdc .jbclock-time{font:100 108.72px/1 Roboto,sans-serif;color:#ffffffe6;letter-spacing:-.02em}
.lpdc .jbclock-hours{font-weight:100}
.lpdc .jbclock-minutes{font-weight:100;color:#ffffffe6}
.lpdc .jbclock-time small{font:400 18.12px Roboto,sans-serif;color:#ffffff99;margin-left:4px}
.lpdc .jbclock-date{margin-top:7.25px;font:400 13.59px Roboto,sans-serif;color:#ffffffe6;text-transform:uppercase;letter-spacing:.06em}
.lpdc .jbclock-next{color:#ffffffb3}
.lpdc .jbclock-next img{filter:brightness(0) invert(1);opacity:.7}
/* Alarms */
.lpdc .kdc-page{background:none;height:100%}
.lpdc .kdc-list{padding:0 0 86.98px;height:100%;overflow-y:auto;scrollbar-width:none}
.lpdc .kdc-alarm{position:relative;margin:0;border:0;border-bottom:.906px solid #ffffff28;background:none;padding:7.25px 10.87px 0 14.5px;color:#fff}
.lpdc .kdc-alarm.expanded{background:#00000026}
.lpdc .kdc-top{display:flex;align-items:center;justify-content:space-between}
.screen .lpdc .kdc-time{border:0;background:none;padding:0;font:100 50.74px/1.2 Roboto,sans-serif;color:#fff}
.lpdc .kdc-alarm.off .kdc-time{color:#ffffff8a}
.lpdc .kdc-time b{font:400 14.5px Roboto,sans-serif;margin-left:4px;vertical-align:middle}
.lpdc .kdc-switch{flex:none}
.lpdc .lp-mswitch::before{background:#ffffff4d}
.lpdc .lp-mswitch.on::before{background:#ff408180}
.lpdc .lp-mswitch.on::after{background:#ff4081}
.lpdc .lp-mswitch::after{background:#ececec}
.lpdc .kdc-body{position:relative}
.lpdc .kdc-strip{display:flex;align-items:center;gap:7.25px;width:100%;min-height:36.24px;border:0;background:none;padding:0 0 7.25px;color:#ffffffb3;text-align:left;flex-direction:row-reverse;justify-content:space-between}
.lpdc .kdc-strip img{width:21.74px;height:21.74px;transition:transform .2s}
.lpdc .kdc-arrow.up{transform:rotate(180deg)}
.lpdc .kdc-summary{font:400 12.68px Roboto,sans-serif;color:#ffffffb3}
.lpdc .kdc-summary b,.lpdc .kdc-summary span{color:inherit;font-weight:400}
.lpdc .kdc-expand{display:flex;flex-direction:column;gap:3.62px;padding:3.62px 0}
.lpdc .kdc-checkrow{display:flex;align-items:center;gap:12.68px;border:0;background:none;padding:7.25px 0;color:#fff;font:400 14.5px Roboto,sans-serif;width:auto}
.lpdc .lp-check{margin:0 0 0 1.81px;border-color:#ffffffb3}
.lpdc .lp-check.on{background:#ff4081;border-color:#ff4081}
.lpdc .kdc-days{display:flex;justify-content:space-between;padding:3.62px 0 7.25px}
.screen .lpdc .kdc-day{width:30.8px;height:30.8px;border:0;border-radius:50%;background:none;padding:0;font:500 12.68px Roboto,sans-serif;color:#fff;box-shadow:none}
.screen .lpdc .kdc-day.on{background:#fff;color:var(--dc)}
.lpdc .kdc-tone-row{display:flex;align-items:center;justify-content:space-between}
.lpdc .kdc-tone{display:flex;align-items:center;gap:10.87px;border:0;background:none;padding:7.25px 0;color:#fff;font:400 14.5px Roboto,sans-serif}
.lpdc .kdc-tone img{width:21.74px;height:21.74px}
.lpdc .kdc-label{order:5;align-self:flex-start;border:0;background:none;padding:7.25px 0;color:#ffffffb3;font:400 14.5px Roboto,sans-serif}
.lpdc .kdc-label.set{color:#fff}
.lpdc .kdc-delete{position:absolute;right:0;bottom:39.86px;width:36.24px;height:36.24px;border:0;background:none;display:grid;place-items:center;padding:0;z-index:1}
.lpdc .kdc-delete img{width:21.74px;height:21.74px}
.lpdc .kdc-empty{color:#ffffffb3;font:400 14.5px Roboto,sans-serif}
/* Timer */
.lpdc .jbclock-setup{background:none}
.lpdc .jbclock-setup-display{color:#ffffff4d;border-bottom:.906px solid #ffffff28}
.lpdc .jbclock-setup-display .on{color:#fff}
.lpdc .jbclock-keypad button{color:#fff;font:300 32.62px Roboto,sans-serif;background:none;border:0}
.lpdc .jbclock-setup .jbclock-keypad{padding-bottom:79.73px}
.lpdc .jbclock-timers,.lpdc .jbclock-stopwatch{background:none;padding-bottom:79.73px}
.lpdc .jbclock-count{color:#fff;font-weight:100}
.lpdc .jbclock-laps{color:#ffffffcc}
/* The Material TimePickerDialog in the app's accent (--kdc-accent, DeskClock #FF4081): header, light dial. */
.screen .kdc-picker{background:#fff;color:#000000de;border-radius:1.81px;box-shadow:0 10.87px 27px #00000066;overflow:hidden}
.screen .kdc-picker-header{background:var(--kdc-accent,#ff4081);color:#ffffff99;padding:14.5px 0}
.screen .kdc-picker-header button{color:#ffffff99;background:none;border:0;font:300 50.74px Roboto,sans-serif}
.screen .kdc-picker-header button.sel{color:#fff}
.screen .kdc-picker-header span{color:#ffffff99;font:300 50.74px Roboto,sans-serif}
.screen .kdc-picker-header .kdc-picker-ampm{font:500 14.5px Roboto,sans-serif}
.screen .kdc-dial{background:#eceff1;border-radius:50%;margin:14.5px auto}
.screen .kdc-num{color:#000000de}
.screen .kdc-num.sel{color:#fff}
/* TimePickerFragment opens the framework TimePickerDialog: CANCEL and OK (TimePickerDialog.java) in the pink accent. */
.screen .kdc-picker .settings-dialog-actions{min-height:43.49px;align-items:center;padding:0 7.25px;border:0}
.screen .kdc-picker .settings-dialog-actions button{flex:none;width:auto;border:0;color:var(--kdc-accent,#ff4081);background:none}
.screen .kdc-dial::before{background:#eceff1}
.screen .kdc-num{font-family:Roboto,sans-serif}
.screen .kdc-num.inner{color:#0000008a}
.screen .kdc-dial-ampm{background:#0000000d;color:#000000de;font-family:Roboto,sans-serif}
.screen .kdc-dial-ampm.sel{background:var(--kdc-accent,#ff4081);color:#fff}
.screen .kdc-picker-header .kdc-picker-ampm,.screen .kdc-picker footer{font-family:Roboto,sans-serif}
/* DeskClock 5.1 screensaver (Daydream): the same thin main_clock_frame as the Clock tab. */
.jb-dream-saver .jbclock-time,.jb-dream-saver .jbclock-hours,.jb-dream-saver .jbclock-minutes{font-family:Roboto,sans-serif;font-weight:100}
.jb-dream-saver .jbclock-date{font:400 13.59px Roboto,sans-serif;letter-spacing:.06em}
/* World clock (DeskClock 3.0.4, dp x 0.906): world_clock_item rows 32 dp in (medium_space_top 22 dp) with the 14 sp
   medium name and "/ day" in white_69p at the start and the thin 56 sp time at the end; CitiesActivity on the hour's
   colour: the 20 sp "Selected Cities" header 24 dp down and 20 dp in, 56 dp city_list_item rows with the 56 dp index
   column (14 sp bold letter), the check box, the name 16 dp after it and the time 8 dp from the end. */
.lpdc .jbclock-clock.has-cities .jbclock-time{margin-top:19.93px}
.lpdc .jbclock-clock.has-cities .jbclock-date{margin-bottom:0}
.lpdc-world{flex:1;min-height:0;align-self:stretch;overflow-y:auto;scrollbar-width:none;padding:0 28.99px}
.lpdc-city{display:flex;align-items:center;gap:7.25px;padding-top:19.93px}
.lpdc-city-label{flex:1;min-width:0;display:flex;gap:3.62px;font:500 12.68px Roboto,sans-serif;white-space:nowrap}
.lpdc-city-label b{font-weight:500;color:#fff;overflow:hidden;text-overflow:ellipsis}
.lpdc-city-label em{font-style:normal;color:#ffffffb1}
.lpdc-city-time{flex:none;font:100 50.74px/1 RobotoThin,Roboto,sans-serif;color:#fff;white-space:nowrap}
.lpdc-cities{background:var(--dc)}
.lpdc-ab{flex:none;height:50.74px;display:flex;align-items:center;color:#fff}
.lpdc-ab h2{flex:1;margin:0 0 0 7.25px;font:500 18.12px Roboto,sans-serif}
.lpdc-up,.lpdc-ab-btn{flex:none;width:50.74px;height:100%;border:0;background:none;display:grid;place-items:center;padding:0}
.lpdc-up img{width:21.74px;height:21.74px;filter:invert(1)}
.lpdc-ab-btn img{width:28.99px;height:28.99px}
.lpdc-up:active,.lpdc-ab-btn:active{background:#ffffff33}
.lpdc-city-list{flex:1;min-height:0;overflow-y:auto;scrollbar-width:none}
.lpdc-city-header{margin:21.74px 0 7.25px;min-height:28.99px;display:flex;align-items:center;padding-left:18.12px;font:400 18.12px Roboto,sans-serif;color:#fff}
.lpdc-city-item{display:flex;align-items:center;width:100%;min-height:50.74px;padding:0;border:0;background:none;color:#fff;text-align:left;cursor:pointer}
.lpdc-city-item:active{background:#ffffff33}
.lpdc-city-index{flex:none;width:50.74px;text-align:center;font:700 12.68px Roboto,sans-serif}
.lpdc-check{flex:none;position:relative;width:16.31px;height:16.31px;margin:0 2.72px;box-sizing:border-box;border:1.81px solid #ffffffb1;border-radius:1.81px}
.lpdc-check.on{border-color:#fff;background:#fff}
.lpdc-check.on::after{content:'';position:absolute;left:4.2px;top:.8px;width:3.6px;height:8.2px;border:solid var(--dc);border-width:0 2px 2px 0;transform:rotate(45deg)}
.lpdc-city-item b{flex:1;min-width:0;padding:0 9.06px 0 14.5px;font:500 12.68px Roboto,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lpdc-city-item small{flex:none;margin-right:7.25px;font:500 12.68px Roboto,sans-serif;color:#ffffffb1}