.pill{background:rgba(255,255,255,.2);border-radius:999px;padding:4px 12px;font-size:12.5px;font-weight:600}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid>.card{margin-bottom:0}
#view-focus>.grid{margin-bottom:14px}
@media (max-width:720px){.grid{grid-template-columns:1fr}}
.presets{display:flex;gap:8px}.presets .btn{padding:10px 0;flex:1}.presets .input{flex:1.4;text-align:center;font-weight:700}
.presets .btn.on{border-color:var(--focus);color:var(--accent-text);background:var(--soft)}
.clock-card{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.ring{position:relative;width:220px;height:220px;margin:4px auto 10px}
.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:12}
.ring .track{stroke:var(--soft)}
.ring .bar{stroke:var(--ring);stroke-linecap:round;stroke-dasharray:603.19;stroke-dashoffset:0;transition:stroke-dashoffset .9s linear,stroke .3s}
.ring-in{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 30px}
.ring-in .small{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clock{font-size:48px;font-weight:800;letter-spacing:1px;font-variant-numeric:tabular-nums}
.status{font-weight:700;min-height:24px;margin-bottom:10px}
.status.good{color:var(--safe)}.status.bad{color:var(--scam)}
.stats{display:flex;gap:28px;justify-content:center}.stats .n{font-size:24px;font-weight:800}
.ring.alert .bar{stroke:#dc2626}
.events li{font-size:13.5px}.events .t{color:var(--muted);font-variant-numeric:tabular-nums;flex:none;width:68px}
.summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
.summary div{background:var(--soft);border-radius:12px;padding:10px;text-align:center}
.summary b{display:block;font-size:20px}
.toggle{display:flex;align-items:center;gap:10px;font-weight:600}
.toggle input{width:20px;height:20px;accent-color:var(--accent)}
.r-fin{color:var(--safe);font-weight:700}.r-stop{color:var(--spam);font-weight:700}

/* Flex-gap fallback for Safari 12 */
.presets > * + *{margin-left:8px}
.stats > * + *{margin-left:28px}
.toggle > * + *{margin-left:10px}
@supports (inset: 0){
  .presets > * + *,.stats > * + *,.toggle > * + *{margin-left:0}
}