.clock-card{background:var(--surface-raised);border:1px solid var(--border);box-shadow:var(--shadow-md);text-align:center;transition:box-shadow var(--transition);border-radius:1.5rem;padding:2rem 1.5rem}.big-digits{font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--text);margin:1rem 0 1.5rem;font-size:clamp(3.2rem,13vw,5.2rem);font-weight:800;line-height:1.05}.clock-actions{flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:1.5rem;display:flex}.clock-actions button{-webkit-tap-highlight-color:transparent;border-radius:999px;min-height:3rem;padding:.65rem 1.6rem;font-size:1rem;font-weight:700}.time-presets{flex-wrap:wrap;justify-content:center;gap:.6rem;margin:1.5rem 0;display:flex}.preset-btn{border-radius:var(--radius-full);border:1.5px solid var(--border-strong,var(--border));background:var(--surface);min-height:2.5rem;color:var(--text);cursor:pointer;transition:all var(--transition);-webkit-tap-highlight-color:transparent;padding:.45rem 1.1rem;font-size:.92rem;font-weight:700}.preset-btn:hover,.preset-btn:focus-visible{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-strong);transform:translateY(-1px)}.preset-btn:active{transform:scale(.96)}.lap-list-container{border-top:1px solid var(--border);text-align:left;margin-top:2rem;padding-top:1.2rem}.lap-table{border-collapse:collapse;width:100%;font-size:.95rem}.lap-table th,.lap-table td{border-bottom:1px solid var(--border-soft,var(--border));padding:.6rem .8rem}.lap-table th{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.8rem;font-weight:700}.lap-table td{font-variant-numeric:tabular-nums}.lap-fastest{color:#10b981;font-weight:700}.lap-slowest{color:#ef4444;font-weight:700}.city-grid{grid-template-columns:1fr;gap:1rem;margin-top:1.5rem;display:grid}.city-loading{color:var(--text-muted);text-align:center;grid-column:1/-1;margin:0}@media (width>=560px){.city-grid{grid-template-columns:repeat(2,1fr)}}.city-card{background:var(--surface);border:1.5px solid var(--border);box-shadow:var(--shadow-sm);transition:transform var(--transition), border-color var(--transition);border-radius:1.2rem;justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem 1.4rem;display:flex}.city-card:hover{border-color:var(--accent);transform:translateY(-1px)}.city-info h3{margin:0 0 .2rem;font-size:1.1rem;font-weight:700}.city-meta{color:var(--text-muted);font-size:.8rem}.city-time{font-variant-numeric:tabular-nums;font-size:1.6rem;font-weight:800}.sleep-option{border:1.5px solid var(--border);background:var(--surface);transition:transform var(--transition), border-color var(--transition);border-radius:1.1rem;flex-direction:column;gap:.35rem;padding:1.1rem 1.25rem;display:flex}@media (width>=480px){.sleep-option{flex-direction:row;justify-content:space-between;align-items:center}}.sleep-option:hover{border-color:var(--accent);transform:translateY(-1px)}.sleep-option[data-recommended=true]{border-color:var(--accent);background:var(--accent-soft)}.sleep-option-time{font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--accent-strong);font-size:1.6rem;font-weight:800}.sleep-option-day{color:var(--text-muted);font-size:.85rem;font-weight:700}.sleep-option-meta{color:var(--text-muted);flex-wrap:wrap;align-items:center;gap:.6rem;font-size:.88rem;display:flex}.sleep-option-badge{color:#102033;background:#f2b84b;border-radius:999px;padding:.15rem .55rem;font-size:.75rem;font-weight:700;display:inline-block}.tz-chooser{max-width:480px;margin:0 auto}.tz-options{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);max-height:16rem;margin:.5rem 0 0;padding:.25rem;list-style:none;overflow-y:auto}.tz-option{border-radius:var(--radius-xs);width:100%;color:var(--text);text-align:left;cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;gap:.75rem;padding:.5rem .7rem;font-size:.95rem;display:flex}.tz-option:hover:not(:disabled){background:var(--accent-soft)}.tz-option:disabled{cursor:default;color:var(--text-muted)}.tz-option-label{font-weight:600}.tz-option-state{color:var(--text-muted);white-space:nowrap;font-size:.8rem}.city-side{align-items:center;gap:.75rem;display:flex}.city-remove{border:1px solid var(--border);border-radius:var(--radius-full);background:var(--surface);color:var(--text-muted);cursor:pointer;transition:color var(--transition), border-color var(--transition);padding:.35rem .55rem;font-size:.8rem;line-height:1}.city-remove:hover{color:#ef4444;border-color:#ef4444}#timer-box:fullscreen{flex-direction:column;justify-content:center;display:flex}#timer-box:fullscreen .big-digits{font-size:clamp(5rem,18vw,12rem)}#timer-box:fullscreen .time-presets{margin:2rem 0}.alarm-form{flex-direction:column;gap:1.1rem;max-width:380px;margin:0 auto;display:flex}.alarm-row{text-align:left;flex-direction:column;gap:.4rem;display:flex}@media (width>=480px){.alarm-row{flex-direction:row;justify-content:space-between;align-items:center}}.alarm-label{color:var(--text);font-size:.95rem;font-weight:700}.alarm-time-input{font-variant-numeric:tabular-nums;border-radius:var(--radius-sm);border:1.5px solid var(--border-strong);background:var(--surface);color:var(--text);text-align:center;min-height:3rem;padding:.5rem .9rem;font-size:1.35rem;font-weight:700}.alarm-sound-group{align-items:center;gap:.5rem;display:flex}.alarm-sound-select{border-radius:var(--radius-sm);border:1.5px solid var(--border);background:var(--surface);color:var(--text);flex:1;min-height:2.75rem;padding:.5rem .8rem;font-size:.95rem}.alarm-test-btn{min-height:2.75rem;padding:.45rem .9rem;font-size:.85rem}.alarm-keep-awake-label{color:var(--text-muted);cursor:pointer;justify-content:center;align-items:center;gap:.6rem;padding:.3rem 0;font-size:.88rem;display:flex}.alarm-keep-awake-label input[type=checkbox]{width:1.15rem;height:1.15rem;accent-color:var(--accent)}.alarm-submit-row{margin-top:.5rem}.alarm-set-btn{border-radius:999px;width:100%;min-height:3.2rem;font-size:1.05rem;font-weight:750;box-shadow:0 4px 14px #0b7fa440}.alarm-cancel-btn{width:100%;min-height:2.8rem;margin-top:.55rem}.alarm-status-line{color:var(--accent);min-height:1.6rem;margin-top:1.5rem;font-size:1.05rem;font-weight:700}.alarm-ringing-panel{background:var(--accent-soft);border:2px solid var(--accent);border-radius:1.25rem;margin-top:1.5rem;padding:1.5rem;animation:1s infinite alternate pulse}.alarm-ringing-title{color:var(--accent-strong);margin:0 0 1rem;font-size:1.4rem;font-weight:800}.alarm-ringing-actions{justify-content:center;gap:.8rem;display:flex}.alarm-ringing-actions button{border-radius:999px;min-height:3rem;padding:.5rem 1.4rem;font-size:.95rem}.clock-card{border-radius:1.4rem;box-shadow:0 14px 34px #0b1e3517}#timer-box .big-digits{aspect-ratio:1;border:.65rem solid var(--family-soft,var(--accent-soft));border-top-color:var(--family-accent,var(--accent));border-right-color:var(--family-accent,var(--accent));background:radial-gradient(circle, var(--surface-raised) 62%, color-mix(in srgb, var(--family-soft,var(--accent-soft)) 45%, transparent));border-radius:50%;place-items:center;width:min(15rem,70vw);margin:1.15rem auto 1.35rem;font-family:Georgia,Times New Roman,serif;font-size:clamp(2.8rem,12vw,4.5rem);display:grid;box-shadow:inset 0 0 0 1px #0b1e3508,0 12px 30px #0b1e3512}#timer-box .time-presets{margin:.4rem 0 1rem}#timer-box .preset-btn{background:var(--surface);border-radius:.85rem;min-width:3.15rem;min-height:2.65rem;padding:.35rem .65rem}#timer-box .preset-btn:hover,#timer-box .preset-btn:focus-visible{border-color:var(--accent);background:var(--accent-soft)}#timer-box .clock-actions{gap:.55rem;margin-top:1rem}#timer-box #btn-timer-start{border-radius:999px;flex:1 0 100%;width:min(15rem,100%);max-width:15rem;min-height:3.15rem;margin:0 auto .15rem}#timer-box .clock-actions .btn-secondary{border-radius:999px;min-height:2.65rem}@media (width<=600px){.clock-card{border-radius:1.25rem;padding:1.15rem 1rem 1.25rem}#timer-box .big-digits{border-width:.55rem;width:min(13.5rem,66vw);margin-top:.8rem}#timer-box .time-presets{gap:.4rem}#timer-box .preset-btn{flex:3.2rem;min-width:0;font-size:.78rem}#timer-box #wake-lock-note{margin-top:.9rem!important;font-size:.72rem!important}}@media (width<=600px) and (height<=600px){#timer-box{padding:.65rem .75rem .75rem}#timer-box .big-digits{border-width:.4rem;width:min(9rem,44vw);margin:.25rem auto .45rem;font-size:clamp(2rem,10vw,3rem)}#timer-box .time-presets{margin:.2rem 0 .45rem}#timer-box .clock-actions{gap:.35rem;margin-top:.45rem}#timer-box #wake-lock-note{display:none}}
