/* Compact instrument-panel clocks. */
.clock-strip{padding:12px 0 14px;background:linear-gradient(180deg,#17171b,#0b0b0e);border-bottom:1px solid #ce17274d;scroll-margin-top:85px}
.clock-strip-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}
.clock-strip-heading h2{margin:0;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.13em;color:#e8e6e6}
.clock-strip-heading span{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:#a6a4aa}
.clock-strip-heading i{display:inline-block;width:5px;height:5px;margin-right:5px;background:#ed283c;border-radius:50%;box-shadow:0 0 7px #ce1727}
.world-clock-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.world-clock{display:grid;grid-template-columns:48px minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:9px;align-content:center;min-width:0;padding:10px 8px;background:linear-gradient(135deg,#232328,#111115);border:1px solid #ffffff1c;border-top:2px solid #92212b;border-radius:7px;box-shadow:0 3px 8px #0004}
.world-clock h3{grid-column:2;margin:0 0 2px;font-size:10px;font-weight:650;line-height:1.3;color:#bdb9bc}
.world-clock time{grid-column:2;display:block;font-size:14px;font-weight:750;line-height:1.3;letter-spacing:.025em;font-variant-numeric:tabular-nums;color:#fff;white-space:nowrap}
.world-clock small{grid-column:2;margin-top:3px;font-size:8px;line-height:1.3;color:#959199}
.clock-face{grid-column:1;grid-row:1/4;align-self:center;position:relative;width:48px;aspect-ratio:1;padding:2px;border:1px solid #c3bfb9;border-radius:50%;background:linear-gradient(135deg,#ddd8d0,#5d5a56 27%,#1b1a1a 48%,#b9b5ae 76%,#eee9e0);box-shadow:0 2px 5px #000a,inset 0 0 2px #fff8;--hour-rotation:0deg;--minute-rotation:0deg;--second-rotation:0deg}
.clock-horns{display:none}.clock-dial{position:relative;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 40% 30%,#282426,#09090b 80%);border:1px solid #4d4648;overflow:hidden}
.clock-dial:before{content:'';position:absolute;inset:2px;border-radius:50%;background:repeating-conic-gradient(#ddd4c5 0deg 1deg,transparent 1deg 30deg);mask:radial-gradient(circle,transparent 70%,#000 72%);-webkit-mask:radial-gradient(circle,transparent 70%,#000 72%)}
.roman{position:absolute;font:6px/1 Georgia,serif;color:#eee4d6}.r12{top:3px;left:50%;transform:translateX(-50%)}.r3{right:3px;top:50%;transform:translateY(-50%)}.r6{bottom:3px;left:50%;transform:translateX(-50%)}.r9{left:3px;top:50%;transform:translateY(-50%)}
.clock-devil{position:absolute;left:50%;top:59%;width:65%;height:44%;object-fit:contain;transform:translate(-50%,-50%);mix-blend-mode:screen}
.clock-hand{position:absolute;display:block;left:50%;bottom:50%;transform-origin:50% 100%;border-radius:2px;z-index:2;box-shadow:0 0 2px #000}
.hour-hand{height:25%;width:2px;background:#fff1df;transform:translateX(-50%) rotate(var(--hour-rotation))}.minute-hand{height:36%;width:1.5px;background:#eee4d6;transform:translateX(-50%) rotate(var(--minute-rotation))}.second-hand{height:40%;width:1px;background:#ff3048;transform:translateX(-50%) rotate(var(--second-rotation));z-index:3}.clock-pin{position:absolute;width:4px;height:4px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:#ee273e;z-index:4}
@media(max-width:1100px){.world-clock-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.world-clock{grid-template-columns:42px minmax(0,1fr);padding:8px 10px}.clock-face{width:42px}.world-clock h3{font-size:10px}}
@media(max-width:580px){.clock-strip .wrap{padding:0 16px}.world-clock-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.world-clock{padding:7px 8px}.clock-strip-heading h2{font-size:10px}.clock-strip-heading span{font-size:8px}.world-clock time{font-size:13px}}