.editor.appearance-dialog{width:min(460px,calc(100vw - 32px));height:fit-content;max-height:calc(100dvh - 32px);margin:auto;border-radius:18px;background:var(--surface);color:var(--surface-ink);box-shadow:none}
.appearance-dialog .editor-head{position:relative;padding:20px 22px 14px;background:var(--surface);color:var(--surface-ink);align-items:center}.appearance-dialog .editor-head small{display:none}.appearance-dialog .editor-head h2{font-size:22px;margin:0}.appearance-dialog .editor-head .icon-button{min-width:44px;min-height:44px}.appearance-dialog .editor-body{padding:14px 22px 22px}
.simple-appearance fieldset{border:0;padding:0;margin:0;display:grid;gap:4px;min-width:0}.appearance-choice{display:flex;align-items:center;gap:14px;min-height:64px;padding:10px 12px;border-radius:10px;cursor:pointer;color:var(--surface-ink)}.appearance-choice:has(input:checked){background:var(--selection-bg);color:var(--selection-ink)}.appearance-choice:has(input:focus-visible){outline:2px solid var(--surface-accent);outline-offset:2px}.appearance-choice input{width:20px;height:20px;margin:0;flex:none;accent-color:var(--action-fill)}.appearance-choice strong{display:block;font-size:14px;font-weight:600}.appearance-choice small{display:block;font-size:11px;line-height:1.5;margin-top:5px;color:var(--surface-muted)}.appearance-status{font-size:11px;line-height:1.5;color:var(--surface-muted)}.appearance-status:empty{display:none}.simple-appearance>.primary-button{width:100%;min-height:44px;margin-top:18px}.simple-appearance ::selection{background:var(--selection-bg);color:var(--selection-ink)}
/* Left calendar dates keep a square footprint at every sidebar width. */
.calendar-sidebar .mini-grid{grid-template-columns:repeat(7,minmax(0,1fr))}.calendar-sidebar .mini-grid button{width:min(28px,100%);height:auto;min-width:0;min-height:0;aspect-ratio:1;border-radius:50%;padding:0;line-height:1;justify-self:center}
:root[data-appearance] :is(.mobile-now-line,.week-now-line,.family-now-line) span{background:var(--now-line);color:var(--now-label-ink)}
@media(prefers-reduced-motion:reduce){.simple-appearance *{transition:none!important;animation:none!important}}

/* Palette samples retain their own colours while the active theme changes. */
.simple-appearance fieldset{gap:8px}
.appearance-choice{gap:12px;min-height:86px;padding:10px 12px}
.appearance-choice-copy{min-width:0;flex:1}
.appearance-choice input{margin-left:auto}
.appearance-choice .theme-swatch{position:relative;width:92px;height:62px;padding:19px 7px 7px;gap:4px;overflow:hidden}
.appearance-choice .theme-swatch::before{content:"";position:absolute;top:0;left:0;right:0;height:11px;background:#f5f8fc;border-bottom:1px solid #dce5f0}
.appearance-choice .theme-swatch i{align-self:start;height:24px;border-radius:3px}
.appearance-choice .theme-swatch i:nth-child(2){height:18px;margin-top:8px}
.appearance-choice .theme-swatch i:nth-child(3){height:23px;margin-top:3px}
.appearance-choice .theme-swatch[data-preview="dark"]::before{background:#16243e;border-color:#30415e}
@media(max-width:360px){.appearance-choice{gap:9px;padding:10px 9px}.appearance-choice .theme-swatch{width:72px;height:58px;padding:18px 5px 6px;gap:3px}.appearance-choice small{font-size:10px}}