.beijing-clock{position:fixed;top:50%;left:clamp(120px,calc(50vw - 900px),150px);z-index:5;width:250px;color:#dce8f0;text-align:center;pointer-events:none;transform:translateY(-50%)}
.flip-clock-face{padding:22px 16px 16px;border:1px solid #3b5365;border-radius:10px;background:linear-gradient(145deg,#1d3445,#0d1b26);box-shadow:0 18px 42px #0b162033,inset 0 1px #ffffff18}
.flip-brand{margin-bottom:14px;color:#eef6fa;font-size:12px;font-weight:800;letter-spacing:2px}.flip-brand small{display:block;margin-top:4px;color:#7d98aa;font-size:8px;letter-spacing:1px}
.flip-time{display:flex;align-items:center;justify-content:center;gap:5px}.flip-time>b{color:#afc6d3;font-size:21px;font-weight:400}.flip-group{display:flex;gap:3px}.flip-card{position:relative;width:32px;height:44px;overflow:hidden;border:1px solid #506778;border-radius:5px;background:#0a141d;box-shadow:inset 0 8px 10px #ffffff08,inset 0 -8px 10px #0008}.flip-card:before,.flip-card:after{position:absolute;left:0;right:0;height:1px;background:#6f8796;content:""}.flip-card:before{top:50%;z-index:2}.flip-card:after{top:calc(50% - 1px);background:#0008}.flip-current{display:grid;height:100%;place-items:center;color:#f5fbff;font:700 27px/1 Consolas,monospace;text-shadow:0 2px 0 #000;transform:translateY(1px)}.flip-change{animation:flip-change .42s ease}.flip-labels{display:grid;grid-template-columns:1fr 1fr 1fr;margin:10px 22px 0;color:#7893a4;font-size:9px}.clock-readout{padding-top:13px}.clock-readout span,.clock-readout small{display:block}.clock-readout span{color:#bfd0da;font-size:11px}.clock-readout small{margin-top:5px;color:#708898;font-size:8px}@keyframes flip-change{0%{transform:rotateX(0);opacity:1}45%{transform:rotateX(-78deg);opacity:.25}100%{transform:rotateX(0);opacity:1}}
@media (min-width:1050px) and (max-width:1560px){.page{width:min(980px,calc(100% - 300px));margin-right:auto;margin-left:280px}}
@media (max-width:1049px),(orientation:portrait){.beijing-clock{display:none}}