/* Cloud controls shared by the clock and remote editor. */
.cloud-controls{color:#334155;border-top:1px solid #cbd5e1;padding:1rem 0;margin:1rem 0;font:14px/1.5 system-ui,sans-serif}
.cloud-controls h3{font-size:1.1rem;font-weight:700;margin:0 0 .75rem}
.cloud-controls label{display:block;margin:.5rem 0;font-weight:600}
.cloud-controls .cloud-switch{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem;background:#f1f5f9;border-radius:.8rem;cursor:pointer;margin:0}
.cloud-switch strong{font-size:1rem}.cloud-switch small{display:block;color:#64748b;font-weight:400;font-size:.8rem;margin-top:.15rem}
.cloud-controls input[type=checkbox]{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:44px;height:26px;border:0;border-radius:999px;background:#94a3b8;cursor:pointer;transition:background .15s}
.cloud-controls input[type=checkbox]::after{content:'';position:absolute;width:20px;height:20px;left:3px;top:3px;background:white;border-radius:50%;transition:transform .15s;box-shadow:0 1px 3px #0003}
.cloud-controls input[type=checkbox]:checked{background:#047857}.cloud-controls input[type=checkbox]:checked::after{transform:translateX(18px)}
.cloud-controls input:focus-visible,.cloud-controls button:focus-visible,.cloud-controls a:focus-visible,.cloud-controls summary:focus-visible{outline:3px solid #0284c7;outline-offset:3px}
.cloud-controls input:disabled{opacity:.5;cursor:wait}
.cloud-controls input:not([type=checkbox]){border:1px solid #94a3b8;border-radius:.5rem;padding:.6rem;width:100%;box-sizing:border-box;font:inherit;text-transform:uppercase}
.cloud-code-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin:.9rem 0}.cloud-code-row .cloud-note{display:block;margin:0}
.cloud-controls output{display:block;font:700 1.25rem ui-monospace,monospace;letter-spacing:.12em;margin:.15rem 0 0}
.cloud-note{font-size:.8rem;color:#64748b;margin:.4rem 0}
.cloud-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin:.6rem 0}
.cloud-controls button,.cloud-controls a{display:inline-block;background:#e0f2fe;color:#075985;padding:.55rem .75rem;border:1px solid #bae6fd;border-radius:.5rem;font:600 .8rem/1.4 system-ui,sans-serif;text-decoration:none;cursor:pointer}
.cloud-controls button:disabled{opacity:.45;cursor:default}.cloud-controls .cloud-editor-link{display:block;text-align:center}
.cloud-controls summary{cursor:pointer;font-weight:600;padding:.65rem 0}.cloud-controls details{border-top:1px solid #e2e8f0;margin-top:.8rem}
.cloud-status{font-size:.8rem;color:#64748b;margin:.5rem 0}.cloud-status[data-enabled=true]{color:#047857}
#cloudSyncError{color:#b91c1c;background:#fef2f2;border-radius:.5rem;padding:.6rem;overflow-wrap:anywhere}
#cloudReconcile{border:1px solid #f59e0b;background:#fffbeb;padding:.7rem;border-radius:.6rem;margin:.8rem 0}
@media(prefers-reduced-motion:reduce){.cloud-controls input[type=checkbox],.cloud-controls input[type=checkbox]::after{transition:none}}
.cloud-controls [hidden]{display:none!important}
.settings-qr{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1rem;padding:.8rem;background:#fff;color:#334155;border:1px solid #cbd5e1;border-radius:1rem;box-sizing:border-box;max-width:100%}.settings-qr[hidden]{display:none!important}.settings-qr .settings-qr-link{display:block;flex:none;width:196px;max-width:100%;padding:0;background:#fff;border:0;border-radius:0;line-height:0}.settings-qr-link svg{display:block;width:100%;height:auto;shape-rendering:crispEdges}.settings-qr-link:focus-visible{outline:3px solid #0284c7;outline-offset:4px}.settings-qr-caption{flex:1 1 150px;text-align:center}.settings-qr-caption strong{font:700 1rem/1.4 system-ui,sans-serif}.settings-qr-caption p{font:400 .85rem/1.5 system-ui,sans-serif;margin:.4rem 0}.settings-qr .settings-qr-caption output{display:block;font:700 1.15rem/1.5 ui-monospace,monospace;letter-spacing:.12em;margin:0}#splashSettingsQr{width:520px;margin:1.2rem 0 0;flex-shrink:0}#cloudSettingsQr{margin:.8rem 0}

.settings-qr-compact{padding:.5rem;gap:.5rem}.settings-qr-compact .settings-qr-link{width:148px}.settings-qr-compact .settings-qr-caption{flex-basis:100px}.settings-qr-compact .settings-qr-caption strong{font-size:.85rem}.settings-qr-compact .settings-qr-caption output{display:none}
/* The remote editor shares the clock's indigo night sky, rounded controls and warm accents. */
body.settings-editor{margin:0;min-height:100vh;background:radial-gradient(ellipse at 85% 0%,#4338ca88,transparent 48%),linear-gradient(155deg,#172554,#1e1b4b 60%,#0f172a);color:#26334b;font:15px/1.55 ui-rounded,system-ui,sans-serif;color-scheme:light}
.settings-editor *{box-sizing:border-box}.settings-editor main{max-width:1200px;margin:auto;padding:2rem 2rem 1rem}.settings-editor h1,.settings-editor h2,.settings-editor h3,.settings-editor p{margin-top:0}.settings-editor h1{font-size:clamp(1.8rem,3.5vw,2.8rem);letter-spacing:-.035em;line-height:1.15;margin-bottom:.6rem}.settings-editor h2{font-size:1.25rem;letter-spacing:-.02em;margin-bottom:0}.settings-editor a{color:#4338ca}.settings-editor .home-link{color:#c7d2fe;text-decoration:none;font-weight:650;font-size:.9rem}.editor-header{color:white;margin-bottom:2rem}.editor-hero{display:flex;gap:1.6rem;align-items:center;padding:2rem 0 .2rem}.editor-hero p:last-child{color:#c7d2fe;margin-bottom:0}.eyebrow{font-size:.68rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#6366a0;margin-bottom:.4rem}.editor-header .eyebrow{color:#fde68a}.editor-moon{display:grid;place-items:center;flex:none;width:86px;height:86px;font:70px/1 Georgia,serif;color:#fde68a;background:#ffffff0b;border:1px solid #ffffff22;border-radius:50%;box-shadow:0 0 45px #818cf828;transform:rotate(-18deg)}
.editor-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:1.5rem;align-items:start}.editor-sidebar,.editor-main{min-width:0}.editor-card{background:#fff;border:1px solid #e0e7ff;border-radius:1.3rem;padding:1.5rem;margin-bottom:1.3rem;box-shadow:0 8px 24px #0206171f}.editor-card .cloud-controls{border:0;margin:0;padding:0}.editor-card .cloud-controls h3{font-size:1.25rem;letter-spacing:-.02em;margin-bottom:1rem}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.3rem}.section-heading>span:not(.count-badge){display:grid;place-items:center;color:#6366f1;font-size:1.6rem;width:42px;height:42px;border-radius:14px;background:#eef2ff}.settings-editor fieldset{margin:0;padding:0;border:0;min-width:0}.settings-editor fieldset:disabled .editor-card{opacity:.65}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.editor-fields{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}.editor-fields label{display:flex;flex-direction:column;gap:.45rem;font-weight:650;font-size:.88rem;min-width:0}.editor-fields input,.editor-fields select{padding:.7rem .8rem;border:1px solid #cbd5e1;background:#f8fafc;border-radius:.7rem;font:inherit;min-width:0;width:100%;color:#26334b;box-sizing:border-box}.editor-fields input:focus,.editor-fields select:focus{background:white;border-color:#6366f1}.editor-fields .check{flex-direction:row;align-items:center;justify-content:space-between;background:#f5f7ff;border-radius:.75rem;padding:.85rem;gap:.75rem}.editor-fields input[type=checkbox]{appearance:none;-webkit-appearance:none;flex:none;width:40px;height:24px;border:0;border-radius:99px;background:#a1aac0;position:relative;cursor:pointer;padding:0}.editor-fields input[type=checkbox]::after{content:'';position:absolute;left:3px;top:3px;width:18px;height:18px;background:white;border-radius:50%;box-shadow:0 1px 2px #0002}.editor-fields input[type=checkbox]:checked{background:#6366f1}.editor-fields input[type=checkbox]:checked::after{transform:translateX(16px)}
.settings-editor button{padding:.7rem 1rem;min-height:44px;border:1px solid #c7d2fe;background:#eef2ff;color:#3730a3;border-radius:.7rem;font:650 .88rem/1.4 system-ui,sans-serif;cursor:pointer}.settings-editor button:hover:enabled{background:#e0e7ff}.settings-editor button:disabled{opacity:.5;cursor:default}.settings-editor button[aria-busy=true]{cursor:wait}.settings-editor :is(input,select,button,summary,a):focus-visible{outline:3px solid #818cf8;outline-offset:3px}.settings-editor summary{cursor:pointer;font-weight:650;min-height:32px}.settings-editor .help{color:#64748b;font-size:.8rem}.settings-editor .cloud-note{font-size:.76rem}.editor-save-bar{position:sticky;bottom:1rem;z-index:2;background:#fff;border:1px solid #c7d2fe;border-radius:1rem;padding:1rem 1.25rem;margin:0 0 1.3rem;box-shadow:0 8px 30px #02061726}.editor-buttons{display:flex;flex-wrap:wrap;gap:.7rem}.settings-editor #editorSave{background:#4f46e5;border-color:#4f46e5;color:white}.settings-editor #editorSave:hover:enabled{background:#4338ca}.editor-feedback p{font-size:.85rem;margin:0 0 .8rem}.editor-feedback p:empty{display:none}#editorNotice{color:#475569}#editorNotice[data-kind=success]{color:#047857}#editorError{color:#b91c1c;background:#fef2f2;padding:.6rem;border-radius:.5rem;overflow-wrap:anywhere}
.character-picker{border-top:1px solid #e2e8f0;margin-top:1.3rem;padding-top:1rem}.editor-characters{max-height:22rem;overflow-y:auto;display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.editor-characters label{display:flex;align-items:center;gap:.5rem;font-size:.72rem;overflow-wrap:anywhere;background:#f8fafc;border-radius:.65rem;padding:.5rem;cursor:pointer}.editor-characters input{accent-color:#6366f1;width:18px;height:18px;flex:none}.editor-characters img{width:42px;height:42px;object-fit:contain;flex:none}.editor-history article{border-top:1px solid #e2e8f0;padding:1rem 0}.editor-history article>p:first-child{font-weight:650;margin-bottom:.3rem}.editor-history pre{white-space:pre-wrap;word-break:break-word;background:#f8fafc;border-radius:.7rem;padding:1rem;font:12px/1.65 ui-monospace,monospace}.editor-history #historyNotice{font-size:.8rem;color:#64748b;margin-top:.6rem}.count-badge{padding:.3rem .65rem;background:#eef2ff;color:#4338ca;border-radius:99px;font-size:.75rem;font-weight:750;white-space:nowrap}.device-list{padding:0;list-style:none;margin:1rem 0}.device-list li{display:grid;gap:.2rem;border-top:1px solid #e2e8f0;padding:.85rem 0;font-size:.85rem}.device-list span{font-size:.8rem}.device-list span::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:.4rem;background:#94a3b8}.device-list [data-state=synced] span{color:#047857}.device-list [data-state=synced] span::before{background:#10b981}.device-list [data-state=pending] span{color:#92400e}.device-list [data-state=pending] span::before{background:#f59e0b}.device-list small{font-size:.72rem;color:#64748b}.settings-editor #deliverySummary{font-size:.83rem}.editor-footer{text-align:center;color:#a5b4fc;font-size:.75rem;padding:1.5rem 0}.settings-editor [hidden]{display:none!important}
@media(max-width:900px){.editor-layout{grid-template-columns:280px minmax(0,1fr);gap:1rem}.settings-editor main{padding:1.5rem 1rem}.editor-card{padding:1.1rem}.editor-fields{grid-template-columns:1fr}.editor-characters{grid-template-columns:1fr}.editor-moon{width:70px;height:70px;font-size:56px}}
@media(max-width:660px){.editor-layout{display:flex;flex-direction:column}.editor-sidebar,.editor-main{width:100%}.editor-hero{gap:1rem;padding-top:1.5rem}.editor-hero p:last-child{font-size:.9rem}.editor-header{margin-bottom:1.5rem}.editor-card{border-radius:1rem}.editor-save-bar{bottom:.5rem;padding:1rem}.settings-editor main{padding:1.2rem .75rem}.editor-fields{grid-template-columns:1fr 1fr}.editor-moon{width:55px;height:55px;font-size:45px}}
@media(max-width:400px){.editor-fields{grid-template-columns:1fr}.editor-buttons button{flex:1}.editor-hero{gap:.6rem}}
.settings-editor .cloud-editor-link{display:none}.settings-editor :is(input,select,summary,button){scroll-margin-block:5rem 11rem}
.device-drawer>summary{display:none}@media(max-width:660px){.device-drawer{background:white;border-radius:1rem;margin-bottom:1.3rem;border:1px solid #e0e7ff}.device-drawer>summary{display:list-item;padding:1rem;color:#3730a3;list-style-position:inside}.device-drawer .editor-card{margin:0;border:0;border-top:1px solid #e0e7ff;box-shadow:none}}
/* One-time clock controls live outside the settings draft and Save/Cancel flow. */
.clock-pause{color:#334155;font:14px/1.5 system-ui,sans-serif;margin:1rem 0;padding:1rem;background:#f5f3ff;border:1px solid #ddd6fe;border-radius:1rem}.clock-pause h3{font-size:1.1rem;font-weight:750;margin:0 0 .4rem}.clock-pause .pause-help{font-size:.8rem;color:#64748b;margin:.4rem 0}.clock-pause #pausePrompt{font-size:.8rem;font-weight:700;margin:.8rem 0 .4rem}.pause-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.clock-pause button{min-height:44px;padding:.55rem .45rem;border:1px solid #c4b5fd;border-radius:.7rem;background:white;color:#5b21b6;font:700 .9rem/1.4 system-ui,sans-serif;cursor:pointer}.clock-pause button:hover:enabled{background:#ede9fe}.clock-pause button:disabled{opacity:.5;cursor:default}.clock-pause button:focus-visible{outline:3px solid #8b5cf6;outline-offset:3px}.pause-active{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.8rem 0}.pause-active strong{display:block;font-size:.8rem;font-weight:500}.pause-active output{display:block;font-weight:750;font-size:1.15rem;font-variant-numeric:tabular-nums}.clock-pause #pauseResume{color:white;background:#6d28d9;flex:none}.clock-pause #pauseNotice,.clock-pause #pauseError{font-size:.8rem;margin:.5rem 0 0}.clock-pause #pauseError{color:#b91c1c}.clock-pause [hidden]{display:none!important}.editor-card>.clock-pause{margin:0;padding:0;border:0;background:none}@media(min-width:1000px){.settings-editor .pause-presets{grid-template-columns:repeat(6,minmax(0,1fr))}}
.pause-active{flex-wrap:wrap}.pause-active>div{flex:1 1 150px}.clock-pause .pause-presets button{padding:.55rem .2rem;font-size:.8rem;white-space:nowrap}
