.clock-page{margin:0 auto;max-width:56rem;padding:1rem;width:100%}.clock-page h1{font-size:1.75rem;margin-bottom:.25rem}.clock-page>.intro{color:var(--color-text-secondary);font-size:1.1rem;margin-bottom:1.5rem}.featured-clocks{display:grid;gap:1rem;grid-template-columns:repeat(4,1fr);margin-bottom:2.5rem}@media (max-width:640px){.featured-clocks{grid-template-columns:repeat(2,1fr)}}.clock-card{align-items:center;background-color:var(--color-bg-secondary);border:1px solid var(--color-border-light);border-radius:.5rem;display:flex;flex-direction:column;gap:.4rem;padding:1.25rem .75rem;position:relative}.clock-card .cc-remove{align-items:center;background:var(--color-bg-secondary);border:1px solid var(--color-border-light);border-radius:50%;color:var(--color-text-muted);cursor:pointer;display:flex;font-size:.85rem;height:1.5rem;justify-content:center;line-height:1;opacity:0;position:absolute;right:.4rem;top:.4rem;transition:opacity .15s;width:1.5rem}.clock-card:hover .cc-remove{opacity:1}.clock-card .cc-remove:hover{border-color:var(--color-accent-red);color:var(--color-accent-red)}.clock-svg{height:120px;width:120px}.clock-face{fill:none;stroke:var(--color-border-medium);stroke-width:1.5}.clock-tick{stroke:var(--color-text-muted);stroke-linecap:round;stroke-width:1}.clock-tick-major{stroke:var(--color-text-primary);stroke-linecap:round;stroke-width:2}.hand-hour{stroke:var(--color-text-primary);stroke-linecap:round;stroke-width:3}.hand-minute{stroke:var(--color-text-primary);stroke-linecap:round;stroke-width:2}.hand-second{stroke:var(--color-accent-red);stroke-linecap:round;stroke-width:1}.clock-center{fill:var(--color-text-primary)}.clock-center-dot{fill:var(--color-accent-red)}.clock-digital{color:var(--color-text-heading);font-family:SF Mono,Cascadia Code,Fira Code,ui-monospace,monospace;font-size:1.25rem;font-variant-numeric:tabular-nums;font-weight:700;letter-spacing:.02em}.clock-city-name{color:var(--color-text-primary);font-size:.9rem;font-weight:600}.clock-meta{color:var(--color-text-muted);font-size:.75rem}.table-section h2{color:var(--color-text-heading-2);font-size:1.3rem;font-weight:700;margin-bottom:.75rem}.table-search{background-color:var(--color-bg-primary);border:1px solid var(--color-border-medium);border-radius:.375rem;color:var(--color-text-primary);font-size:1rem;margin-bottom:.5rem;padding:.6rem 1rem;width:100%}.table-search::-moz-placeholder{color:var(--color-text-muted)}.table-search::placeholder{color:var(--color-text-muted)}.table-search:focus{border-color:transparent;outline:2px solid var(--color-accent-blue);outline-offset:1px}.search-count{color:var(--color-text-muted);font-size:.85rem;margin-bottom:.5rem;min-height:1.3em}.city-table-wrap{border:1px solid var(--color-border-light);border-radius:.5rem;max-height:36rem;overflow-y:auto}.city-table{border-collapse:collapse;width:100%}.city-table thead{position:sticky;top:0;z-index:2}.city-table th{background-color:var(--color-table-header-bg);color:var(--color-text-secondary);font-size:.8rem;font-weight:600;letter-spacing:.05em;padding:.6rem .75rem;text-align:left;text-transform:uppercase;white-space:nowrap}.city-table th:last-child{text-align:center;width:3rem}.city-table td{border-bottom:1px solid var(--color-border-light);font-size:.9rem;padding:.45rem .75rem}.city-table tr:last-child td{border-bottom:none}.city-table tr:hover td{background-color:var(--color-hover-bg)}.city-table .col-time{font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}.city-table .col-offset{color:var(--color-text-muted);font-size:.8rem;white-space:nowrap}.city-table .col-add{padding:.3rem;text-align:center}.city-table .btn-add{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:1px solid var(--color-border-medium);border-radius:.25rem;color:var(--color-text-muted);cursor:pointer;font-size:.75rem;padding:.15em .5em;white-space:nowrap}.city-table .btn-add:hover{background-color:var(--color-hover-bg);border-color:var(--color-text-secondary);color:var(--color-text-primary)}.city-table tr.hidden{display:none}@media (max-width:640px){.city-table .col-offset,.city-table th:nth-last-child(2){display:none}}.clock-page .seo-section{margin:0 auto;max-width:42rem}.clock-page .seo-section h2{color:var(--color-text-heading-2);font-size:1.3rem;font-weight:700}.clock-page .seo-section p{color:var(--color-text-secondary);line-height:1.65}