@font-face{font-family:Archivo;src:url('/fonts/Archivo-var.latin.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:JetBrains;src:url('/fonts/JetBrainsMono-400.latin.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:JetBrains;src:url('/fonts/JetBrainsMono-600.latin.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Atkinson Hyperlegible';src:url('/fonts/AtkinsonHyperlegible-400.latin.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Atkinson Hyperlegible';src:url('/fonts/AtkinsonHyperlegible-700.latin.woff2') format('woff2');font-weight:600 700;font-display:swap}
@font-face{font-family:Literata;src:url('/fonts/Literata-var.latin.woff2') format('woff2');font-weight:200 900;font-display:swap}
/* Text font (Apparence → Police); the clock and metadata keep JetBrains Mono. A font file loads only when used. */
:root{--font-text:Archivo,system-ui,sans-serif}:root[data-font=system]{--font-text:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif}:root[data-font=legible]{--font-text:'Atkinson Hyperlegible',system-ui,sans-serif}:root[data-font=serif]{--font-text:Literata,Georgia,serif}
/* A4 tokens (hostux-a4-themes referentiel): --accent is the action colour, --accent-text the accent for text on paper. */
:root{color-scheme:light;--paper:#f4f1ea;--text:#3b3a37;--ink:#141414;--muted:#615e58;--surface:#ebe7de;--line:#c5c3bd;--accent:#ff6a13;--accent-hover:#ff853e;--accent-text:#b83f00;--focus:#b83f00;--danger:#b3261e;--wallpaper-url:none}
:root[data-theme=dark]{color-scheme:dark;--paper:#131312;--text:#cfcac0;--ink:#efebe2;--muted:#aaa49b;--surface:#1b1b19;--line:#484744;--accent:#ff7a2e;--accent-hover:#ff9a5c;--accent-text:#ff9a5c;--focus:#ff7a2e;--danger:#ff6b5e}
@media(prefers-color-scheme:dark){:root[data-theme=system]{color-scheme:dark;--paper:#131312;--text:#cfcac0;--ink:#efebe2;--muted:#aaa49b;--surface:#1b1b19;--line:#484744;--accent:#ff7a2e;--accent-hover:#ff9a5c;--accent-text:#ff9a5c;--focus:#ff7a2e;--danger:#ff6b5e}}
*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;font-family:var(--font-text)}body{background:var(--paper);color:var(--text)}[hidden]{display:none!important}
button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--focus);outline-offset:4px}
#wallpaper{position:fixed;inset:0;z-index:-2;background-image:var(--wallpaper-url);background-position:var(--wallpaper-position,center);background-size:cover;background-repeat:no-repeat;background-color:#131312}
.has-wallpaper{color:#fff}.has-wallpaper:before{content:'';position:fixed;inset:0;background:rgb(0 0 0 / var(--wallpaper-shade,.3));z-index:-1;pointer-events:none}
.start-page{position:relative;height:100svh;width:100%;text-align:center;text-shadow:0 2px 12px #0008}
body:not(.has-wallpaper) .start-page{background:var(--paper);text-shadow:none}
.clock-block{position:absolute;top:13.5%;left:50%;transform:translateX(-50%);width:calc(100% - 32px)}
#clock{font-family:JetBrains,monospace;font-weight:400;font-size:calc(clamp(48px,5.1vw,98px) * var(--clock-scale,1));line-height:1.2;letter-spacing:-.055em;font-variant-numeric:tabular-nums}
#date{margin:10px 0 0;font-family:JetBrains,monospace;font-size:clamp(13px,1vw,19px);letter-spacing:.025em}
.welcome{position:absolute;top:45.5%;left:50%;transform:translate(-50%,-10%);width:calc(100% - 40px);max-width:900px}
#greeting{font-size:clamp(28px,2.1vw,40px);font-weight:600;line-height:1.2;margin:0 0 4px;letter-spacing:-.025em}
.weather-summary{font-size:clamp(14px,1vw,19px);margin:0;line-height:1.5}.weather-summary span:last-child{font-family:JetBrains,monospace}
.weather-current{display:inline-flex;align-items:center;gap:9px;margin-top:10px;border:0;background:transparent;color:inherit;padding:2px 8px;font-size:29px;line-height:1.3;text-shadow:inherit}
#weather-icon{font-size:37px;color:var(--accent);line-height:1}#weather-status{font-size:15px;margin-top:10px}
.quote-section{position:absolute;left:50%;bottom:14.5%;transform:translateX(-50%);width:calc(100% - 48px);max-width:640px}
#quote-text{font-size:clamp(15px,1vw,19px);line-height:1.5;margin:0 0 15px;overflow-wrap:anywhere;white-space:pre-line}#quote-author{font-family:JetBrains,monospace;font-size:14px;margin:0;letter-spacing:.05em}
.quote-actions{position:absolute;top:100%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:14px;padding-top:10px;opacity:0;transition:opacity .15s;font-size:12px}.quote-section:hover .quote-actions,.quote-section:focus-within .quote-actions{opacity:1}.quote-actions button{border:0;color:inherit;background:transparent;font-size:20px;padding:2px 10px}
.page-footer{position:fixed;bottom:18px;left:26px;right:24px;display:flex;align-items:end;justify-content:space-between;gap:20px;color:inherit;z-index:1}.page-footer nav:not(.shortcut-bar){display:flex;gap:14px}.corner-button{border:0;padding:3px;background:transparent;color:var(--accent);font-size:32px;line-height:1;filter:drop-shadow(0 1px 3px #0008)}
#wallpaper-credit{font-size:12px;max-width:calc(100% - 110px);opacity:.75;line-height:1.5}#wallpaper-credit a{text-decoration:none}#wallpaper-credit:hover{opacity:1}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.text-button{border:0;background:transparent;color:inherit;padding:5px 0;font-family:JetBrains,monospace;font-size:12px}.action{border:0;padding:12px 20px;background:var(--accent);color:#141414;font-weight:600}.action:hover{background:var(--accent-hover)}
input,select,textarea{border:1px solid var(--line);padding:10px;background:var(--surface);color:var(--text);max-width:100%}textarea{width:100%;resize:vertical}h2,h3{font-family:var(--font-text)}h3{font-size:18px;margin:0}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:28px 0 15px}.search-form{display:flex;gap:8px;flex-wrap:wrap}.search-form input{flex:1;min-width:150px}.search-form select{max-width:150px}
.links-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.link-group{grid-column:1/-1;margin:12px 0 4px;font:12px JetBrains,monospace;color:var(--muted)}.link-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 0;border-bottom:1px solid var(--line);min-width:0}.link-row a{display:flex;gap:12px;text-decoration:none;min-width:0;align-items:center}.link-monogram{display:grid;place-items:center;border:1px solid var(--line);width:32px;height:32px;font:12px JetBrains,monospace;flex-shrink:0}.link-copy{display:flex;flex-direction:column;gap:5px;min-width:0}.link-title{font-size:15px}.link-domain{color:var(--muted);font:10px JetBrains,monospace;overflow:hidden;text-overflow:ellipsis}.link-edit{padding:8px}.tools-footer{display:flex;justify-content:space-between;margin-top:30px;font:11px JetBrains,monospace;color:var(--muted)}
.forecast{display:flex;gap:25px;border-block:1px solid var(--line);margin:20px 0;padding:20px 0;font-size:13px}.forecast strong{display:block;margin-top:8px}#sun-times,#weather-updated{font-size:12px;color:var(--muted)}

dialog{width:min(720px,calc(100% - 40px));max-height:calc(100% - 40px);padding:30px;border:2px solid var(--ink);background:var(--paper);color:var(--text)}dialog::backdrop{background:#14141499}.dialog-header{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:2px solid var(--ink);padding-bottom:24px;margin-bottom:24px}.dialog-header h2{font-size:43px;margin-top:8px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}dialog label{display:flex;flex-direction:column;gap:8px;font-size:14px}dialog label input{width:100%}fieldset{border:0;border-top:1px solid var(--line);margin:28px 0 0;padding:20px 0 0;min-width:0}legend{font:600 11px JetBrains,monospace;text-transform:uppercase;padding-right:15px}.toggles{display:flex;flex-wrap:wrap;gap:20px}.toggles label{flex-direction:row;align-items:center;gap:8px}.toggles input{width:18px;height:18px;accent-color:var(--accent)}.help{display:block;color:var(--muted);font-size:10px;line-height:1.6;margin-top:6px}.dialog-actions{display:flex;align-items:center;gap:24px;margin:28px 0 10px;flex-wrap:wrap}.wallpaper-options{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.wallpaper-choice{padding:0;border:1px solid var(--line);background:var(--surface);text-align:left}.wallpaper-choice[aria-pressed=true]{outline:2px solid var(--focus);outline-offset:3px}.wallpaper-choice span{display:block;padding:10px;font:400 10px JetBrains,monospace}.wallpaper-choice img,.wallpaper-swatch{width:100%;height:80px;object-fit:cover}.wallpaper-swatch{background:var(--paper);border-bottom:1px solid var(--line)}.upload-label{margin-top:24px}.import-label{display:inline-block;cursor:pointer}.import-label{position:relative}.import-label input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.import-label:focus-within{outline:2px solid var(--focus);outline-offset:3px}.danger{color:var(--danger)}#link-form{display:grid;gap:18px}#city-form{display:flex;align-items:end;gap:16px}#city-form label{flex:1}#city-status{padding:15px 0}#city-results button{display:block;border:0;border-bottom:1px solid var(--line);background:transparent;padding:15px 0;text-align:left;width:100%;font-size:15px}#city-results button:hover{color:var(--accent)}#privacy-dialog p{margin:18px 0;line-height:1.65}#notice{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);max-width:calc(100% - 40px);padding:15px 20px;background:var(--ink);color:var(--paper);font:12px/1.5 JetBrains,monospace;z-index:10}#wallpaper{position:fixed;inset:0;z-index:-2;background-size:cover;background-position:center}body.has-wallpaper #wallpaper{background-image:var(--wallpaper-url)}

dialog{border:1px solid var(--line);border-radius:12px;text-shadow:none}dialog::backdrop{background:#0d0d0c80;backdrop-filter:blur(8px)}.dialog-header{border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:22px}.dialog-header h2{font-size:25px;font-weight:600;margin:0}.wallpaper-choice{border-radius:6px;overflow:hidden}.wallpaper-choice img,.wallpaper-swatch{height:100px}dialog .eyebrow{font:11px JetBrains,monospace;color:var(--muted);text-transform:uppercase}.close-dialog{font-size:20px;padding:6px;white-space:nowrap;flex:none}dialog .help{font-size:12px}dialog .error{color:var(--danger)}
@media(max-width:600px){dialog{width:calc(100% - 24px);max-height:calc(100svh - 24px);padding:22px}.settings-grid{grid-template-columns:1fr;gap:18px}.wallpaper-options{grid-template-columns:repeat(2,1fr)}.clock-block{top:15%}#clock{font-size:clamp(28px,calc(11vw * var(--clock-scale,1)),calc(66px * var(--clock-scale,1)))}.welcome{top:43%}.quote-section{bottom:16%;max-width:420px}#quote-text{font-size:15px}.page-footer{left:16px;right:16px;bottom:14px}#wallpaper-credit{font-size:10px}.corner-button{font-size:28px}.links-grid{grid-template-columns:1fr}.quote-actions{opacity:.8}#search-engine{max-width:135px}.tools-footer{flex-wrap:wrap;gap:12px}}
@media(max-height:540px){.clock-block{top:8%}#clock{font-size:48px}#date{font-size:12px}.welcome{top:40%}#greeting{font-size:26px}.weather-summary{font-size:13px}.weather-current{font-size:22px;margin-top:4px}.quote-section{bottom:15%}#quote-text{font-size:13px;margin-bottom:8px}#quote-author{font-size:11px}.page-footer{bottom:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}

#quote-text{max-height:24svh;overflow:auto;scrollbar-width:thin}html:has(dialog[open]){overflow:hidden}

#weather-icon svg{display:block;width:37px;height:37px}.city-tabs{display:flex;justify-content:center;gap:12px;margin:4px 0 5px;max-width:100%}.city-tab{border:0;border-bottom:1px solid transparent;background:transparent;color:inherit;font:11px JetBrains,monospace;opacity:.7;padding:3px 0;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.city-tab[aria-pressed=true]{opacity:1}.city-tabs:has(.city-tab:nth-child(2)) .city-tab[aria-pressed=true]{border-color:var(--accent)}.city-management{display:flex;gap:20px;margin-top:14px}.favorite-row{display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding:12px 0}.favorite-copy{background:transparent;color:inherit;border:0;text-align:left;flex:1;line-height:1.5;white-space:pre-wrap}.quote-actions{white-space:nowrap}.quote-actions button{font-size:19px}.quote-actions button[aria-pressed=true]{color:var(--accent)}#wallpaper-credit{max-width:calc(100% - 155px)}output{font:12px JetBrains,monospace;color:var(--muted)}input[type=range]{padding:0;accent-color:var(--accent)}.settings-grid+.toggles{margin-top:20px}

.city-tab{text-shadow:0 1px 3px #000,0 0 8px #000;font-size:12px}body:not(.has-wallpaper) .city-tab{text-shadow:none}
.wallpaper-fade{position:absolute;inset:0;background-position:var(--wallpaper-position,center);background-size:cover;background-repeat:no-repeat;will-change:opacity}.credit-favorite{border:0;background:transparent;color:var(--accent);font-size:15px;line-height:1;padding:0 0 0 10px;vertical-align:-1px}.library-current{display:grid;grid-template-columns:minmax(0,220px) 1fr;gap:18px;align-items:center;margin-top:22px}.library-current img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:6px;border:1px solid var(--line)}.library-current-copy{display:grid;gap:8px;min-width:0}.library-current-copy a{font:12px JetBrains,monospace;overflow-wrap:anywhere}.library-current-actions{display:flex;flex-wrap:wrap;gap:6px 18px}.wallpaper-library{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}.library-tile{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:2px 4px;min-width:0}.library-show{grid-column:1/-1;padding:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--surface);aspect-ratio:16/9}.library-show img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.library-show:hover img{transform:scale(1.04)}.library-show[aria-current=true]{outline:2px solid var(--focus);outline-offset:3px}.library-author{font:10px JetBrains,monospace;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.library-action{border:0;background:transparent;color:var(--accent-text);font-size:16px;line-height:1;padding:6px}.excluded-list{display:grid;gap:0}.excluded-row{display:grid;grid-template-columns:72px 1fr auto;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding:8px 0;font:11px JetBrains,monospace}.excluded-row img{width:72px;aspect-ratio:16/9;object-fit:cover;border-radius:4px}@media(max-width:600px){.library-current{grid-template-columns:1fr}.wallpaper-library{grid-template-columns:repeat(2,1fr)}}
@property --scrim-top{syntax:'<number>';inherits:true;initial-value:0}@property --scrim-middle{syntax:'<number>';inherits:true;initial-value:0}@property --scrim-bottom{syntax:'<number>';inherits:true;initial-value:0}@property --scrim-footer{syntax:'<number>';inherits:true;initial-value:0}.has-wallpaper:before{background:linear-gradient(to bottom,rgb(0 0 0/var(--scrim-top)) 0%,rgb(0 0 0/var(--scrim-top)) 30%,rgb(0 0 0/var(--scrim-middle)) 45%,rgb(0 0 0/var(--scrim-middle)) 60%,rgb(0 0 0/var(--scrim-bottom)) 78%,rgb(0 0 0/var(--scrim-footer)) 92%),rgb(0 0 0/var(--wallpaper-shade,.3));transition:--scrim-top .6s,--scrim-middle .6s,--scrim-bottom .6s,--scrim-footer .6s}:root[data-panels=glass] dialog{background:color-mix(in srgb,var(--paper) 76%,transparent);backdrop-filter:blur(18px) saturate(1.2);border-color:color-mix(in srgb,var(--ink) 35%,transparent);box-shadow:0 24px 60px #0006}:root[data-panels=glass-strong] dialog{background:color-mix(in srgb,var(--paper) 58%,transparent);backdrop-filter:blur(30px) saturate(1.35);border-color:color-mix(in srgb,var(--ink) 25%,transparent);box-shadow:0 24px 60px #0007}:root[data-panels^=glass] dialog::backdrop{background:#0d0d0c33;backdrop-filter:blur(2px)}@supports not (backdrop-filter:blur(1px)){:root[data-panels^=glass] dialog{background:var(--paper)}}
.start-page,.page-footer{transition:opacity .3s ease}body:has(dialog[open]) .start-page,body:has(dialog[open]) .page-footer{opacity:0}
.links-actions{display:flex;gap:18px}.sync-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 18px;margin-top:12px;font:12px JetBrains,monospace}.sync-choice{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin-top:12px;font-size:13px}.sync-choice p{flex-basis:100%;margin:0}.import-list{display:grid;gap:0;margin:14px 0;max-height:min(52vh,460px);overflow:auto}.import-row{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);cursor:pointer}.import-row input{grid-row:span 2}.import-name{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.import-meta{font:10px JetBrains,monospace;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#weather-dialog .city-tabs{justify-content:flex-start;margin:14px 0 6px}#weather-dialog .city-tab{text-shadow:none;opacity:.75}#weather-dialog .city-tab[aria-pressed=true]{opacity:1}
#paste-text{width:100%;box-sizing:border-box;font:12px/1.5 JetBrains,monospace;margin-top:8px}
.file-label{position:relative}.file-label input[type=file]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.file-button{display:inline-block;width:fit-content;margin-top:8px;padding:9px 14px;border:1px solid var(--line);background:var(--surface);color:var(--text);font:12px JetBrains,monospace;cursor:pointer}.file-label:focus-within .file-button{outline:2px solid var(--focus);outline-offset:3px}.file-label:hover .file-button{border-color:var(--ink)}
.settings-search{display:block;margin:22px 0 30px}#settings-search-empty{margin:-14px 0 24px}.settings-search input{width:100%;box-sizing:border-box;font:13px JetBrains,monospace}.search-miss{display:none!important}.filtering .help,.filtering .wallpaper-options,.filtering .sync-row,.filtering .sync-choice{display:none}.filtering .section-match .help{display:block}.filtering .section-match .wallpaper-options{display:grid}.filtering .section-match .sync-row{display:flex}.notes-checklist{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:2px}.notes-checklist label{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:10px;padding:6px 0;text-align:left;cursor:pointer}.notes-checklist input{width:17px;height:17px;accent-color:var(--accent);flex:none}.notes-checklist .done span{text-decoration:line-through;color:var(--muted)}.notes-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 16px;margin-top:6px}.notes-footer .help{margin:0}.drop-hint{position:fixed;inset:14px;z-index:30;display:grid;place-items:center;border:2px dashed var(--accent);border-radius:14px;background:#0d0d0cc7;backdrop-filter:blur(6px);pointer-events:none}.drop-hint span{font:600 14px JetBrains,monospace;color:var(--text);letter-spacing:.04em;padding:14px 22px;background:var(--paper);border:2px solid var(--accent);border-radius:8px;box-shadow:0 18px 40px #0008}
.color-setting{display:grid;gap:8px;margin:18px 0 4px}.color-label{font-size:14px}.swatches{display:flex;flex-wrap:wrap;gap:7px}.swatch{position:relative;display:block;cursor:pointer}.swatch input{position:absolute;opacity:0;width:1px;height:1px}.chip{display:block;width:24px;height:24px;border-radius:50%;border:1px solid color-mix(in srgb,var(--ink) 30%,transparent);transition:transform .15s ease}.chip-any{background:conic-gradient(#cc0000,#ff9900,#ffff00,#669900,#0099cc,#663399,#cc0000)}.swatch:hover .chip{transform:scale(1.12)}.swatch input:checked+.chip{outline:2px solid var(--focus);outline-offset:2px;transform:scale(1.12)}.swatch input:focus-visible+.chip{outline:2px dashed var(--focus);outline-offset:3px}.filtering .section-match .color-setting{display:grid}
.collection-row{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}.collection-row input{flex:1 1 220px}.collection-setting select{width:100%}
.second-clock{margin:6px 0 0;font:12px JetBrains,monospace;letter-spacing:.06em;opacity:.82}.link-icon{object-fit:contain;padding:6px;box-sizing:border-box;background:var(--surface)}.shortcut-bar{position:fixed;left:50%;transform:translateX(-50%);z-index:1;display:flex;gap:calc(10px * var(--shortcut-scale,1));max-width:calc(100% - 32px);overflow-x:auto;padding:8px 10px;border-radius:999px;background:color-mix(in srgb,#0d0d0c 38%,transparent);backdrop-filter:blur(10px) saturate(1.2);scrollbar-width:none}.shortcut-bar[data-position=top]{top:18px}.shortcut-bar[data-position=bottom]{bottom:62px}.shortcut{flex:none;display:grid;place-items:center;width:calc(38px * var(--shortcut-scale,1));height:calc(38px * var(--shortcut-scale,1));border-radius:50%;background:color-mix(in srgb,#fff 88%,transparent);text-decoration:none;transition:transform .15s ease,box-shadow .15s ease}.shortcut:hover,.shortcut:focus-visible{transform:translateY(-2px) scale(1.06);box-shadow:0 6px 18px #0006}.shortcut-mark{width:calc(22px * var(--shortcut-scale,1));height:calc(22px * var(--shortcut-scale,1));border-radius:5px;display:grid;place-items:center;font:600 calc(10px * var(--shortcut-scale,1)) JetBrains,monospace;color:#232522;background:transparent;padding:0}.shortcut-mark.link-icon{padding:0;background:transparent}@media(max-width:600px){.shortcut-bar[data-position=bottom]{bottom:58px}.shortcut{width:calc(34px * var(--shortcut-scale,1));height:calc(34px * var(--shortcut-scale,1))}}
.bar-bottom .quote-section{bottom:calc(14.5% + 18px + 38px * var(--shortcut-scale,1))}@media(max-width:600px){.bar-bottom .quote-section{bottom:calc(16% + 18px + 34px * var(--shortcut-scale,1))}}@media(max-height:540px){.bar-bottom .quote-section{bottom:calc(15% + 48px)}}
#wallpaper-credit{display:flex;align-items:center;min-width:0}#wallpaper-credit a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.has-wallpaper #wallpaper-credit{text-shadow:0 1px 3px #000c}#wallpaper-credit{opacity:1}#wallpaper-credit a{opacity:.8}#wallpaper-credit a:hover{opacity:1}.credit-favorite{flex:none;display:grid;place-items:center;width:24px;height:24px;margin-left:6px;padding:0;border:0;border-radius:8px;background:transparent;box-shadow:none;color:var(--accent);line-height:1}.credit-favorite:hover{background:color-mix(in srgb,currentColor 12%,transparent)}.shortcut-bar{transition:opacity .3s ease}body:has(dialog[open]) .shortcut-bar{opacity:0;pointer-events:none}.page-options{margin-top:22px}.collection-setting{font-size:14px}
.about-body{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:22px;margin-top:22px;align-items:start}.about-image{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:6px;border:1px solid var(--line)}.about-title{margin:0 0 6px;font-size:20px}.about-description{margin:12px 0;line-height:1.6;font-size:14px;max-height:40vh;overflow:auto}.about-tags{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}.about-tag{font:11px JetBrains,monospace;padding:4px 8px;border:1px solid var(--line);border-radius:999px}#about-dialog .dialog-actions a{text-decoration:none}@media(max-width:600px){.about-body{grid-template-columns:1fr}}
.rain-soon{margin:4px 0 0;font:12px JetBrains,monospace;letter-spacing:.03em;opacity:.9}.weather-extra{margin:6px 0 0;font-size:13px;color:var(--muted)}
.weather-chart{margin:16px 0 4px}.weather-chart .chart{display:block;width:100%;height:auto;overflow:visible}.chart-line{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}.chart-rain{fill:color-mix(in srgb,#3f8fd8 55%,transparent)}.chart-label{font:600 12px JetBrains,monospace;fill:currentColor}.chart-hour{font:10px JetBrains,monospace;fill:var(--muted)}
.chart-legend{margin:0 0 6px;font:11px JetBrains,monospace;color:var(--muted);display:flex;align-items:center;gap:6px}.legend-line{display:inline-block;width:16px;height:3px;border-radius:2px;background:var(--accent)}.legend-rain{display:inline-block;width:8px;height:10px;background:color-mix(in srgb,#3f8fd8 55%,transparent)}
button.about-tag{background:transparent;color:inherit;cursor:pointer}button.about-tag:hover{border-color:var(--accent);color:var(--accent-text)}
.settings-more{margin:18px 0 0;border-top:1px solid var(--line);padding-top:12px}.settings-more>summary{cursor:pointer;font-size:14px;list-style:none;display:flex;align-items:center;gap:10px}.settings-more>summary::-webkit-details-marker{display:none}.settings-more>summary::before{content:'›';display:inline-block;transition:transform .2s ease;color:var(--accent-text);font-size:18px;line-height:1}.settings-more[open]>summary::before{transform:rotate(90deg)}.more-value{margin-left:auto;font:11px JetBrains,monospace;color:var(--muted)}.settings-more>:not(summary){margin-top:12px}
#api-help{margin-top:16px}
/* Warning text on paper: a darker orange keeps 4.5:1 in the light theme; dark themes keep the accent. */

.page-search{margin:22px auto 0;max-width:440px}.page-search input{width:100%;box-sizing:border-box;padding:12px 18px;border-radius:999px;border:1px solid #ffffff38;background:color-mix(in srgb,#0d0d0c 34%,transparent);backdrop-filter:blur(10px);color:#fff;font-size:15px;text-align:center}.page-search input::placeholder{color:#ffffffb3}.page-search input:focus{outline:2px solid var(--accent);outline-offset:2px;text-align:left}body:not(.has-wallpaper) .page-search input{background:var(--surface);color:var(--text);border-color:var(--line)}body:not(.has-wallpaper) .page-search input::placeholder{color:var(--muted)}
@media(max-height:760px){.with-search .page-search{margin-top:12px}.with-search .page-search input{padding:9px 16px}.with-search:not(.bar-bottom) .quote-section{bottom:calc(8% + 10px)}}
.night-warning{margin:14px 0 0;padding:10px 12px;border-left:3px solid var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent);font-size:13px;line-height:1.5}
/* Search at the top or bottom, like the shortcut bar; both stack when they share an edge. */
.page-search[data-position=top],.page-search[data-position=bottom]{position:fixed;left:50%;transform:translateX(-50%);width:min(440px,calc(100% - 32px));margin:0;z-index:2}.page-search[data-position=top]{top:18px}.page-search[data-position=bottom]{bottom:62px}body[data-search=top] .shortcut-bar[data-position=top]{top:76px}body[data-search=bottom] .shortcut-bar[data-position=bottom]{bottom:118px}body[data-search=bottom] .quote-section{bottom:calc(14.5% + 62px)}body[data-search=bottom].bar-bottom .quote-section{bottom:calc(14.5% + 80px + 38px * var(--shortcut-scale,1))}body[data-search=top] .clock-block{top:calc(13.5% + 30px)}body:has(dialog[open]) .page-search[data-position]{opacity:0;pointer-events:none}.page-search{transition:opacity .3s ease}
.label-line{display:flex;align-items:center;gap:8px}.info-tip{display:inline-grid;place-items:center;flex:none;width:18px;height:18px;padding:0;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--muted);line-height:1;cursor:pointer}.info-tip::before{content:'';width:12px;height:12px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 10h2v8h-2zm0-4h2v2h-2z'/%3E%3C/svg%3E") center/contain no-repeat}legend .info-tip,.toggles .info-tip{margin-left:8px}.settings-transfer .info-tip{margin-left:-14px}.info-tip:hover,.info-tip[aria-expanded=true],.info-more:hover .info-tip,.info-more[aria-expanded=true] .info-tip{border-color:var(--accent-text);color:var(--accent-text)}.info-more{display:inline-flex;align-items:center;gap:8px;margin-top:8px;padding:0;border:0;background:none;color:var(--muted);font-size:12px;cursor:pointer}.info-more:hover{color:var(--text)}.info-body{display:block;margin:2px 0 4px;padding:8px 10px;border-left:2px solid var(--accent);background:color-mix(in srgb,var(--surface) 70%,transparent);color:var(--muted);font-size:12px;line-height:1.55;max-width:60ch}.filtering .info-more{display:none}
@media (max-width:520px){.search-form input{flex-basis:100%}.search-form #search-engine{flex:1 1 0;min-width:0;max-width:none}}
/* Settings: transfer tools in their own row; saving stays reachable at the bottom of the scrolling window. */
.settings-transfer{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin:28px 0 6px;padding-top:20px;border-top:1px solid var(--line)}
.settings-save{position:sticky;bottom:-30px;z-index:2;margin:20px -30px -30px;padding:14px 30px 18px;background:var(--panel-paper);border-top:1px solid var(--line)}
:root[data-panels^=glass] .settings-save{background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(12px)}
@media(max-width:600px){.settings-save{bottom:-22px;margin:20px -22px -22px;padding:12px 22px 14px}}
/* Notice: on the page (bottom centre), at the bottom of an open dialog, or beside Enregistrer in the settings. */
#notice.notice-idle{position:fixed!important;width:1px;height:1px;padding:0!important;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
#notice{display:flex;align-items:center;gap:16px}
.notice-undo{flex:none;border:0;border-bottom:1px solid currentColor;padding:0;background:none;color:inherit;font:inherit;cursor:pointer}
dialog #notice{position:sticky;bottom:0;left:auto;transform:none;max-width:none;margin:18px 0 0;z-index:3}
.settings-save #notice{position:static;flex:1;margin:0 0 0 18px;padding:10px 14px}
/* Without a wallpaper image (plain paper), page controls and texts use the theme colours instead of white. */
body:not(.has-wallpaper) .corner-button,body:not(.has-wallpaper) .credit-favorite{color:var(--accent-text);filter:none}
/* Lot B, typography and window headers (A4): Archivo everywhere, sentence-case titles in ink, accent eyebrow,
   a quiet « Fermer » aligned with the eyebrow, windows anchored near the top so headers never jump. */
#greeting{font-weight:500;letter-spacing:-.02em}
.dialog-header{align-items:flex-start}
.dialog-header h2{font:600 28px/1.1 var(--font-text);letter-spacing:-.02em;color:var(--ink);margin:0}
dialog .eyebrow{margin:0 0 8px;letter-spacing:.08em;color:var(--accent-text)}
.close-dialog{font:12px JetBrains,monospace;letter-spacing:.08em;padding:4px 0;margin-top:-2px;color:var(--muted)}
.close-dialog:hover{color:var(--ink)}
dialog[open]{margin:min(10vh,96px) auto auto;max-height:calc(100vh - min(10vh,96px) - 24px)}

/* Lot B: a shared rhythm and control language, with the existing settings kept intact. */
:root{--edge:20px;--panel-paper:#fbf9f4;--corner-surface:#0d0d0c99}
:root[data-theme=dark]{--panel-paper:var(--paper)}
@media(prefers-color-scheme:dark){:root[data-theme=system]{--panel-paper:var(--paper)}}
.start-page{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(22px,4.5svh,52px);height:auto;min-height:100svh;padding:100px 20px}
.start-page .clock-block,.start-page .welcome,.start-page .quote-section{position:static;inset:auto;transform:none;width:100%;margin:0}
.start-page .welcome{max-width:900px}.start-page .quote-section{position:relative;max-width:640px}
#quote-text{font-size:clamp(16px,1.15vw,21px)}
.page-footer{bottom:var(--edge);left:var(--edge);right:var(--edge);align-items:center;gap:12px}
#wallpaper-credit,.page-footer nav:not(.shortcut-bar){min-height:28px;padding:5px 11px;border-radius:999px;background:var(--corner-surface);backdrop-filter:blur(8px) saturate(1.2);box-shadow:0 0 0 1px #ffffff1f;color:#fff;font:11px/18px JetBrains,monospace}
#wallpaper-credit:empty{display:none}#wallpaper-credit{max-width:calc(100% - 150px)}
.page-footer nav:not(.shortcut-bar){gap:12px;margin-left:auto;flex:none}.corner-button{display:grid;place-items:center;padding:0;font-size:18px;filter:none}
.corner-button svg,.credit-favorite svg{width:18px;height:18px;display:block}
.has-wallpaper #wallpaper-credit{text-shadow:none}
dialog{border-radius:14px;background:var(--panel-paper)}
input:not([type=checkbox]):not([type=range]):not([type=color]),select,textarea,.action,.wallpaper-choice{border-radius:8px}
.action{text-transform:none}input:not([type=checkbox]):not([type=range]):not([type=color]),select{min-height:42px}
select{appearance:none;padding-right:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%236d6a63' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:14px}
.link-row:hover{background:color-mix(in srgb,var(--accent) 6%,transparent)}
.weather-city-bar{display:flex;align-items:center;gap:12px;margin:14px 0 6px;min-width:0}
#weather-dialog .city-tabs{flex:1;min-width:0;margin:0;overflow-x:auto;gap:16px}.city-tab{flex:none}
#add-city{flex:none;min-height:32px;padding:0 10px;border:1px solid var(--line);border-radius:8px;white-space:nowrap}
#add-city:hover{border-color:var(--accent-text);color:var(--accent-text)}
.city-management{margin-top:8px}.city-management:has([hidden]){display:none}
.forecast{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.forecast>div{min-width:0}
#sun-times{font:12px/1.5 JetBrains,monospace;color:var(--muted)}
:root[data-panels=glass] .settings-save{background:color-mix(in srgb,var(--paper) 76%,transparent)}
:root[data-panels=glass-strong] .settings-save{background:color-mix(in srgb,var(--paper) 58%,transparent)}
body:has(dialog[open]) .page-footer{pointer-events:none}
body.bar-bottom .start-page,body[data-search=bottom] .start-page{padding-bottom:150px}
body[data-search=top] .start-page{padding-top:130px}
@media(max-width:600px){.start-page{padding:90px 20px;gap:24px}.start-page .quote-section{max-width:420px}#quote-text{font-size:16px}#wallpaper-credit{font-size:11px}.weather-city-bar{gap:8px}.forecast{font-size:12px;gap:8px}}
@media(max-height:540px){.start-page{padding-top:70px;padding-bottom:70px;gap:16px}#quote-text{font-size:16px}.weather-current{margin-top:4px}}

/* Capsule buttons keep a usable hit area around the 18 px glyphs. */
.page-footer nav:not(.shortcut-bar){padding:2px 8px;gap:8px}.corner-button{min-width:24px;min-height:24px;border-radius:8px}
.corner-button:hover{background:color-mix(in srgb,currentColor 12%,transparent)}
.credit-favorite{min-width:24px;min-height:24px}
body:not(.has-wallpaper) .page-footer nav:not(.shortcut-bar),body:not(.has-wallpaper) #wallpaper-credit{background:var(--surface);color:var(--text);box-shadow:0 0 0 1px var(--line)}

/* Lot C: immediate settings and self-contained wallpaper / search controls. */
#wallpaper-preferences{margin:22px 0 28px;padding-bottom:20px;border-bottom:1px solid var(--line)}
#wallpaper-preferences .settings-grid{gap:18px}#wallpaper-preferences .settings-grid label{min-width:0}
#wallpaper-preferences select{width:100%;max-width:none}#wallpaper-preferences .wallpaper-options{margin-top:16px}
.tools-search-options{margin:14px 0 24px}.tools-search-options input{width:100%}
#settings-status[data-error=true],#wallpaper-settings-status[data-error=true]{color:var(--danger)}
.weather-block{display:block;width:100%;padding:0;border:0;background:transparent;color:inherit;text-align:center;font:inherit}
.weather-block[hidden]{display:none}
.weather-summary,#weather-status,#weather-content,#rain-soon{display:block}
.weather-block:hover .weather-current{color:var(--accent)}
.quote-section:has(#favorite-quote[aria-pressed=true]) .quote-actions{opacity:1}
.quote-section:not(:hover):not(:focus-within) .quote-actions:has(#favorite-quote[aria-pressed=true])>:not(#favorite-quote){opacity:0;pointer-events:none}

.credit-favorite:disabled{cursor:default}


/* Keep bottom favorites on the A4 footer baseline, with room for both side capsules. */
.page-footer:has(>.shortcut-bar[data-position=bottom]:not([hidden])){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(max-content,1fr);align-items:end}
.page-footer>.shortcut-bar[data-position=bottom]{position:static;transform:none;inset:auto;grid-column:2;grid-row:1;justify-self:center;max-width:100%;min-width:0;background:var(--corner-surface);backdrop-filter:blur(8px) saturate(1.2);box-shadow:0 0 0 1px #ffffff1f}
.page-footer>.shortcut-bar[hidden]{display:none}
.page-footer:has(>.shortcut-bar[data-position=bottom]:not([hidden]))>#wallpaper-credit{max-width:100%;justify-self:start;grid-column:1}
.page-footer:has(>.shortcut-bar[data-position=bottom]:not([hidden]))>nav:not(.shortcut-bar){justify-self:end;grid-column:3;grid-row:1}
body:not(.has-wallpaper) .page-footer>.shortcut-bar[data-position=bottom]{background:var(--surface);box-shadow:0 0 0 1px var(--line)}


/* Personal wallpaper library: folders and one page of thumbnails, outside base options. */
#personal-wallpaper-dialog{width:min(1000px,calc(100% - 40px))}
.personal-library-toolbar,.personal-library-selection,.personal-pagination{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.personal-library-toolbar input[type=search]{flex:1;min-width:180px}
.personal-library-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px}
.personal-library-layout aside{min-width:0;border-right:1px solid var(--line);padding-right:16px}
#personal-folders{max-height:320px;overflow:auto;margin-bottom:16px}
.personal-folder-row{display:flex;align-items:center;gap:7px}.personal-folder-button{display:block;min-width:0;flex:1;width:100%;text-align:left;padding:8px 4px;background:transparent;border:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}
.personal-folder-button[aria-pressed=true]{color:var(--accent-text);background:color-mix(in srgb,var(--accent) 8%,transparent)}
#personal-folder-form input{width:100%;min-width:0}.personal-folder-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:12px}
.personal-library-selection{margin:0 0 14px;font-size:12px}.personal-library-selection select{max-width:200px}
.personal-wallpaper-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.personal-wallpaper-tile{min-width:0}.personal-wallpaper-show{display:block;width:100%;aspect-ratio:16/10;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.personal-wallpaper-show img{display:block;width:100%;height:100%;object-fit:cover}.personal-wallpaper-name{display:flex;gap:6px;align-items:center;margin-top:5px;font-size:12px;min-width:0}.personal-wallpaper-name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.personal-wallpaper-tile .help{font-size:10px}
.personal-pagination{justify-content:space-between;margin-top:20px;font:11px JetBrains,monospace}
#personal-summary-block{margin:14px 0}#wallpaper-mix-label{margin:14px 0}.file-label.action{position:relative;cursor:pointer}
@media(max-width:650px){.personal-library-layout{grid-template-columns:1fr;gap:16px}.personal-library-layout aside{border-right:0;padding:0}#personal-folders{max-height:140px}.personal-wallpaper-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.personal-library-toolbar{gap:8px}}

#personal-wallpaper-grid{max-height:min(48svh,480px);overflow:auto;padding-right:4px}
.personal-wallpaper-name{flex-direction:row;justify-content:flex-start}

.personal-folder-row input,.personal-wallpaper-name input{accent-color:var(--accent)}

/* Local tools: short paths through settings, reversible imports and bounded local data. */
.settings-sections{display:flex;flex-wrap:wrap;gap:4px 10px;position:sticky;top:-1px;z-index:3;padding:8px 0;background:var(--paper);border-bottom:1px solid var(--line);margin-bottom:14px}
.settings-sections .text-button{font-size:12px;padding:6px 2px}
#settings-form>fieldset,#settings-form>.settings-grid,.settings-transfer{scroll-margin-top:110px}
.data-panel{border:1px solid var(--line);padding:12px;margin:12px 0}.data-panel h3{font-size:15px;margin:0 0 8px}.data-panel p{margin:6px 0}
.recovery-list,.command-results{list-style:none;padding:0}.recovery-list li{border-top:1px solid var(--line);padding:12px 0}.note-preview{white-space:pre-wrap;overflow-wrap:anywhere;max-height:160px;overflow:auto;font:inherit;font-size:13px}
.command-results .text-button{display:block;text-align:left;width:100%;padding:12px;border-bottom:1px solid var(--line)}#command-query{width:100%}
#import-preview-form fieldset{display:grid;gap:12px}#import-preview-form label{display:flex;flex-direction:row;align-items:center;gap:10px;text-align:left}#import-preview-form input{width:auto}
#profile-save-form{margin-top:24px;display:grid;gap:12px}#profiles-dialog label{display:grid;gap:8px}#personal-focus label{display:grid;gap:8px;margin:10px 0}
.data-freshness{position:fixed;top:10px;left:50%;transform:translateX(-50%);z-index:5;max-width:calc(100% - 120px);padding:6px 10px;margin:0;background:var(--paper);color:var(--text);border:1px solid var(--line);font-size:11px;text-align:center}
@media(pointer:coarse){.corner-button,.credit-action,.text-button{min-width:44px;min-height:44px}.settings-sections{position:static}}
@media(max-width:600px){.notes-footer{flex-wrap:wrap;gap:8px}.settings-sections{position:static}.data-panel{padding:10px}#settings-form>fieldset,#settings-form>.settings-grid,.settings-transfer{scroll-margin-top:8px}}

#space-create-form{display:grid;gap:12px;margin-top:24px}#spaces-dialog label{display:flex;flex-direction:column;gap:8px}#spaces-dialog .space-copy-label{flex-direction:row;align-items:center}#space-copy{width:auto}#space-switch{margin-top:14px}

#space-rename-form{display:grid;gap:8px;margin:20px 0}

/* Public settings: a quiet navigation rail and readable, anchored sections. */
#settings-dialog{width:min(980px,calc(100% - 48px));padding:0;overflow:auto;scroll-padding-top:24px}
#settings-dialog>.dialog-header{margin:0;padding:20px 30px 18px;gap:24px}
#settings-dialog .dialog-header h2{font-size:28px;line-height:1.15}
#settings-dialog .dialog-header .eyebrow{font-family:var(--font-text);font-size:12px;letter-spacing:.02em;text-transform:none;margin-bottom:6px}
#settings-dialog .close-dialog{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;margin:-4px -10px 0 0;border-radius:8px;font:13px var(--font-text);letter-spacing:0}
#settings-dialog .close-dialog:hover{background:var(--surface)}
.settings-description{max-width:52ch;margin:6px 0 0;color:var(--muted);font-size:14px;line-height:1.55}
#settings-dialog .dialog-header .help{margin:6px 0 0}
.settings-layout{display:grid;grid-template-columns:176px minmax(0,1fr);gap:28px;padding:26px 30px 30px;align-items:start}
#settings-dialog .settings-sections{display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;position:sticky;top:24px;gap:5px;margin:0;padding:0;border:0;background:transparent;z-index:2}
#settings-dialog .settings-sections .text-button{display:flex;align-items:center;min-height:42px;padding:10px 13px;border:1px solid transparent;border-radius:9px;text-align:left;font:14px/1.35 var(--font-text);text-decoration:none;color:var(--muted);position:relative}
#settings-dialog .settings-sections .text-button:hover{color:var(--ink);background:var(--surface)}
#settings-dialog .settings-sections [aria-current=page]{color:var(--accent-text);background:color-mix(in srgb,var(--accent) 9%,var(--panel-paper));border-color:color-mix(in srgb,var(--accent-text) 25%,transparent);font-weight:600}
#settings-dialog .settings-sections [aria-current=page]::before{content:'';position:absolute;width:3px;top:10px;bottom:10px;left:0;border-radius:3px;background:var(--accent-text)}
.settings-main{min-width:0}
#settings-dialog .settings-search{margin:0 0 24px}
#settings-dialog .settings-search input{min-height:44px;font:14px var(--font-text);background:var(--panel-paper)}
#settings-dialog #settings-search-empty{margin:0 0 24px;padding:16px;background:var(--surface);border-radius:10px}
#settings-dialog #settings-form{display:grid;gap:24px}
#settings-dialog .settings-section{margin:0;scroll-margin-top:24px}
#settings-dialog .settings-section.settings-grid{padding:22px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--surface) 22%,var(--panel-paper))}
#settings-dialog fieldset.settings-section{padding:22px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--surface) 22%,var(--panel-paper))}
#settings-dialog fieldset.settings-section>legend{float:left;width:100%;padding:0;margin:0 0 22px;font:600 17px/1.35 var(--font-text);text-transform:none;letter-spacing:-.01em;color:var(--ink)}
#settings-dialog fieldset.settings-section>legend~*{clear:both}
#settings-dialog .settings-section-title{grid-column:1/-1;margin:0;font:600 17px/1.35 var(--font-text);color:var(--ink)}
#settings-dialog .settings-grid{gap:22px 20px}
#settings-dialog label{font-size:14px;line-height:1.4;min-width:0}
#settings-dialog .help{font:12px/1.55 var(--font-text)}
#settings-dialog input:not([type=checkbox]):not([type=range]):not([type=color]):not([type=file]),#settings-dialog select{min-height:44px;width:100%;padding:10px 12px}
#settings-dialog select{padding-right:34px}
#settings-dialog textarea{padding:12px;line-height:1.55;min-height:100px}
#settings-dialog input[type=range]{min-height:24px;width:100%}
#settings-dialog .toggles{gap:12px 20px}
#settings-dialog .toggles label{min-height:32px;line-height:1.45}
#settings-dialog .toggles input{flex:none}
#settings-dialog .settings-more{padding-top:16px;margin-top:22px}
#settings-dialog .settings-more>summary{min-height:28px;line-height:1.4}
#settings-dialog .settings-transfer{border:0;padding:0;gap:12px;margin:0}
.settings-feedback{position:sticky;bottom:0;padding:12px 0;margin-top:18px;background:var(--panel-paper);border-top:1px solid var(--line);z-index:3}
.settings-feedback .help{margin:0;padding-bottom:6px}
#settings-dialog :is(button,input,select,textarea,a,summary):focus-visible{outline:2px solid var(--focus);outline-offset:3px}
:root[data-panels^=glass] #settings-dialog .settings-feedback{background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(12px)}
@media(max-width:760px){
 #settings-dialog{width:calc(100% - 24px);max-height:calc(100svh - 24px);margin:12px auto;scroll-padding-top:80px}
 #settings-dialog>.dialog-header{padding:18px 20px 16px}
 .settings-layout{display:block;padding:0 20px 22px}
 #settings-dialog .settings-sections{position:sticky;top:0;flex-direction:row;overflow-x:scroll;overscroll-behavior-x:contain;gap:6px;margin:0 -20px 22px;padding:12px 20px;background:var(--panel-paper);border-bottom:1px solid var(--line);scrollbar-width:thin;scrollbar-color:var(--muted) var(--surface);z-index:4}
 #settings-dialog .settings-sections .text-button{flex:none;white-space:nowrap;min-height:44px;padding:10px 12px}
 #settings-dialog .settings-sections [aria-current=page]::before{left:12px;right:12px;width:auto;top:auto;bottom:3px;height:2px}
 #settings-dialog .settings-sections::-webkit-scrollbar{height:5px}
 #settings-dialog .settings-sections::-webkit-scrollbar-track{background:var(--surface)}
 #settings-dialog .settings-sections::-webkit-scrollbar-thumb{background:var(--muted);border-radius:4px}
 #settings-dialog .settings-section{scroll-margin-top:84px}
 #settings-dialog fieldset.settings-section,#settings-dialog .settings-section.settings-grid{padding:18px}
 #settings-dialog .settings-grid{gap:20px}
 #settings-dialog .toggles label{min-height:44px}
 .settings-feedback{bottom:0;padding:10px 0}
}
@media(max-width:480px){
 #settings-dialog>.dialog-header{gap:12px}
 #settings-dialog .dialog-header h2{font-size:25px}
 #settings-dialog .close-dialog{min-height:44px;margin-top:-8px}
 #settings-dialog .settings-grid{grid-template-columns:1fr}
}

/* Keep everyday organisation, backups and reset distinct in the data section. */
#settings-dialog .settings-transfer{display:grid;gap:0}
#settings-dialog .settings-transfer>.settings-section-title{margin-bottom:18px}
.settings-data-group{min-width:0;padding:20px 0;border-top:1px solid var(--line)}
.settings-data-group h4{margin:0;font:600 15px/1.4 var(--font-text);color:var(--ink)}
#settings-dialog .settings-data-group>.help{margin:8px 0 16px;max-width:60ch}
.settings-data-actions{display:flex;align-items:stretch;flex-wrap:wrap;gap:10px}
.settings-organize-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
#settings-dialog .settings-data-actions>.text-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel-paper);font:13px/1.4 var(--font-text);text-align:center;overflow-wrap:anywhere}
#settings-dialog .settings-data-actions>.text-button:hover{border-color:var(--muted);background:var(--surface)}
#settings-dialog .settings-data-actions>.danger{border-color:color-mix(in srgb,var(--danger) 40%,var(--line));color:var(--danger)}
#settings-dialog .settings-data-actions>.danger:hover{border-color:var(--danger);background:color-mix(in srgb,var(--danger) 7%,var(--panel-paper))}
.settings-data-reset{margin-top:4px;padding-bottom:0}
@media(max-width:480px){.settings-organize-actions{grid-template-columns:1fr}#settings-dialog .settings-data-actions>.text-button{width:100%}.settings-data-group{padding-top:18px;padding-bottom:18px}.settings-data-reset{padding-bottom:0}}

#settings-dialog .settings-data-actions>.info-tip{align-self:center;margin-left:0}
#settings-dialog .settings-data-actions>.info-body{flex-basis:100%}
@media(max-width:480px){#settings-dialog .settings-data-actions>#paste-settings{width:calc(100% - 28px)}}

/* Wallpaper choices remain reachable even when online-only filters do not apply. */
.settings-wallpaper-entry{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:20px;grid-column:1/-1}
#settings-dialog .settings-wallpaper-entry>.help{margin:0}

/* Daily tools: one scroll area, with the title and closing action always reachable. */
#tools-dialog{position:fixed;inset:0;margin:auto;box-sizing:border-box;max-width:none;width:min(1080px,calc(100% - 40px));height:min(880px,calc(100svh - 40px));max-height:calc(100svh - 40px);padding:0;overflow:clip}
#tools-dialog[open]{display:flex;flex-direction:column}
#tools-dialog>.dialog-header{flex:none;margin:0;padding:20px 26px;border-bottom:0;gap:16px}
#tools-dialog .dialog-header h2{margin:0;font-size:26px;line-height:1.2}
#tools-dialog .dialog-header .eyebrow{margin:0 0 6px;font:12px var(--font-text);letter-spacing:.02em}
#tools-dialog .close-dialog{min-width:44px;min-height:44px;flex:none;font:13px var(--font-text)}
.tools-navigation{display:flex;flex:none;gap:6px;padding:0 26px 14px;border-bottom:1px solid var(--line);overflow-x:auto}
#tools-dialog .tools-navigation button{min-height:40px;padding:8px 14px;border:1px solid var(--line);border-radius:8px;white-space:nowrap;font:13px var(--font-text)}
#tools-dialog .tools-navigation button:hover{background:color-mix(in srgb,var(--accent) 8%,transparent);border-color:var(--accent)}
.tools-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:24px 26px;scrollbar-width:thin;scroll-padding:20px}
.tools-search{padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:24px}
#tools-dialog .search-form{align-items:center;gap:10px}
#tools-dialog .search-form input{flex:1 1 220px;min-width:0;min-height:44px}
#tools-dialog .search-form select,#tools-dialog .search-form button{min-height:44px}
#tools-dialog .search-form select{max-width:170px}
#tools-dialog .tools-search-options{margin:14px 0 0}
.tools-workspace{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);align-items:start;gap:22px}
.tools-workspace:has(>#notes-widget[hidden]){grid-template-columns:minmax(0,1fr)}
.tools-panel{min-width:0;padding:20px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--surface) 20%,transparent)}
#tools-dialog .tools-workspace .section-heading{margin:0 0 16px;gap:12px;align-items:flex-start;flex-wrap:wrap}
#tools-dialog .section-heading h3{margin:0;font:600 18px/1.35 var(--font-text)}
#tools-dialog .links-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-left:auto}
#tools-dialog .links-actions button{min-height:40px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font:13px var(--font-text)}
#tools-dialog #add-link{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));color:var(--accent-text);background:color-mix(in srgb,var(--accent) 6%,transparent)}
#links-count{display:block;margin-top:4px;font-size:12px}
.links-filter-row{display:flex;align-items:center;gap:8px;margin-bottom:14px;min-width:0}
#tools-dialog #links-filter{width:100%;min-width:0;min-height:44px;font:14px var(--font-text)}
#tools-dialog #links-filter-clear{min-height:44px;padding:8px;font:12px var(--font-text)}
#tools-dialog #links{display:block}
.link-collection{border-bottom:1px solid var(--line);min-width:0}
.link-collection:last-child{border-bottom:0}
.link-collection>summary{display:flex;align-items:center;gap:10px;min-height:44px;padding:10px 0;cursor:pointer;list-style:none;font:600 14px/1.4 var(--font-text)}
.link-collection>summary::-webkit-details-marker{display:none}
.link-collection>summary:before{content:'';width:6px;height:6px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(-45deg);flex:none;margin:0 4px 0 2px}
.link-collection[open]>summary:before{transform:rotate(45deg)}
.link-group-name{min-width:0;overflow-wrap:anywhere}
.link-group-count{margin-left:auto;flex:none;color:var(--muted);font:12px var(--font-text)}
#tools-dialog .link-row{padding:12px 0;gap:10px}
#tools-dialog .link-row:last-child{border-bottom:0}
#tools-dialog .link-row>a{flex:1;min-width:0}
#tools-dialog .link-edit{min-width:40px;min-height:40px;flex:none;border-radius:8px}
#tools-dialog .link-edit:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}
#tools-dialog #notes{display:block;width:100%;min-height:240px;max-height:65svh;resize:vertical;padding:12px;box-sizing:border-box;font:14px/1.65 var(--font-text);border-radius:8px}
#notes-status{max-width:65%;text-transform:uppercase;font:11px/1.5 JetBrains,monospace;color:var(--muted);overflow-wrap:anywhere}
#tools-dialog .notes-footer{display:flex;flex-direction:column;align-items:stretch;gap:12px;margin-top:14px}
.notes-actions{display:flex;flex-wrap:wrap;gap:8px}
#tools-dialog .notes-actions button{min-height:40px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font:12px var(--font-text)}
#tools-dialog .notes-footer>.help{font-size:12px;line-height:1.5}
#tools-dialog .notes-checklist label{min-width:0}
#tools-dialog .notes-checklist label>span{min-width:0;overflow-wrap:anywhere}
.tools-secondary-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
.tools-secondary-grid{grid-template-columns:minmax(0,1fr)}
.tools-secondary{min-width:0}
#tools-dialog .tools-secondary .section-heading{margin:0 0 12px}
#tools-dialog .tools-secondary h3{font-size:15px}
#tools-dialog>.tools-footer{flex:none;display:flex;align-items:center;gap:12px;margin:0;padding:10px 26px;border-top:1px solid var(--line);line-height:1.6}
#tools-dialog>.tools-footer>span{flex:1;min-width:0}
#tools-dialog>.tools-footer>.tools-footer-links{flex:none;display:flex;align-items:center;gap:16px}#privacy-dialog .legal-links{display:flex;flex-wrap:wrap;gap:8px 20px;font:13px JetBrains,monospace}
#tools-dialog .tools-footer-links>*{min-height:40px;flex:none;font:12px var(--font-text)}
@media(pointer:coarse){#tools-dialog .tools-navigation button,#tools-dialog .links-actions button,#tools-dialog .link-edit,#tools-dialog .notes-actions button,#tools-dialog .tools-footer-links>*,#tools-dialog .notes-checklist label{min-height:44px}}
@media(max-width:860px){.tools-workspace{grid-template-columns:minmax(0,1fr)}#tools-dialog #notes{min-height:220px}}
@media(max-width:600px){
 #tools-dialog{width:calc(100% - 24px);height:calc(100svh - 24px);max-height:calc(100svh - 24px)}
 #tools-dialog>.dialog-header{padding:16px 18px 14px}#tools-dialog .dialog-header h2{font-size:24px}
 .tools-navigation{padding:0 18px 12px;gap:6px}#tools-dialog .tools-navigation button{min-height:44px;padding:8px 10px}
 .tools-body{padding:20px 16px}.tools-panel{padding:16px}.tools-workspace{gap:20px}
 #tools-dialog .search-form input{flex-basis:100%}#tools-dialog .search-form select{flex:1;max-width:none;min-width:0}
 #tools-dialog .links-actions button,#tools-dialog .link-edit,#tools-dialog .notes-actions button{min-height:44px}
 .tools-secondary-grid{grid-template-columns:minmax(0,1fr);gap:22px}#tools-dialog>.tools-footer{padding:8px 18px}#tools-dialog .tools-footer-links>*{min-height:44px;display:inline-flex;align-items:center}
}

/* Home search and wallpaper library share the existing, quiet controls. */
.page-search{position:relative;width:min(440px,calc(100vw - 40px))}
.page-search input{padding-right:54px;text-align:left}
.page-search button{position:absolute;right:5px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:transparent;color:inherit}
body.has-wallpaper .page-search button{color:#fff}
.page-search button:hover{background:color-mix(in srgb,var(--accent) 18%,transparent)}
.page-search button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
#wallpaper-dialog{position:fixed;inset:0;margin:auto;box-sizing:border-box;max-width:none;width:min(1000px,calc(100% - 40px));height:min(880px,calc(100svh - 40px));max-height:calc(100svh - 40px);padding:0;overflow:clip}
#wallpaper-dialog[open]{display:flex;flex-direction:column}
#wallpaper-dialog>.dialog-header{flex:none;margin:0;padding:24px 26px 18px}
.library-navigation{flex:none;display:flex;gap:6px;padding:0 26px 16px;overflow-x:auto;border-bottom:1px solid var(--line)}
.library-navigation button{min-height:42px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;white-space:nowrap;font:13px var(--font-text)}
.library-navigation button:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}
.library-navigation span{margin-left:5px;color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
.library-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:24px 26px;scroll-padding:24px}
.library-panel{padding:22px;border:1px solid var(--line);border-radius:12px;background:var(--surface);margin:0 0 22px;min-width:0}
#wallpaper-dialog .library-panel .section-heading{margin:0 0 12px}
.library-intro{margin:0 0 20px}
#wallpaper-preferences{margin:0;padding:0;border:0}
#wallpaper-settings-status{margin-bottom:0}
#wallpaper-dialog .library-current{margin:0 0 24px;padding:0 4px}
#wallpaper-dialog .library-current>p{margin:0}
#wallpaper-dialog .library-current:has(>p){display:block}
#wallpaper-dialog .library-action{min-width:40px;min-height:40px}
#wallpaper-dialog .library-panel>h3:focus{outline:none}
@media(pointer:coarse){.page-search button,.library-navigation button,#wallpaper-dialog .library-action,#wallpaper-dialog .excluded-row button{min-height:44px;min-width:44px}}
@media(max-width:600px){
 #wallpaper-dialog{width:calc(100% - 24px);height:calc(100svh - 24px);max-height:calc(100svh - 24px)}
 #wallpaper-dialog>.dialog-header{padding:20px 18px 16px}
 .library-navigation{padding:0 16px 12px}.library-navigation button{min-height:44px;padding:8px 10px}
 .library-body{padding:20px 16px}.library-panel{padding:16px;margin-bottom:18px}
 #wallpaper-dialog .settings-grid{grid-template-columns:1fr}
 #wallpaper-dialog .collection-row{flex-wrap:wrap}
 #wallpaper-dialog .library-current{gap:12px}
 .page-search button{width:44px;height:44px;right:0}
}

#wallpaper-dialog #setting-wallpaper-plain-color{display:block;width:88px;height:44px;box-sizing:border-box;padding:4px;cursor:pointer}

/* Optional first-use guide, opened from settings. */

.setup-invitation{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin-bottom:22px;padding:16px 18px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.setup-invitation[hidden]{display:none}.setup-invitation h3{margin:0 0 6px;font-size:16px}.setup-invitation p{margin:0;font-size:13px;color:var(--muted)}
.setup-invitation>div:last-child{display:flex;gap:14px}.setup-invitation button{min-height:44px}
#setup-dialog{position:fixed;inset:0;margin:auto;box-sizing:border-box;max-width:none;width:min(860px,calc(100% - 40px));max-height:calc(100svh - 40px);padding:0;overflow:clip}
#setup-dialog[open]{display:flex;flex-direction:column}
#setup-dialog>.dialog-header{flex:none;margin:0;padding:24px 26px 18px;align-items:flex-start}
#setup-dialog .dialog-header .help{margin:12px 0 0;max-width:560px}
.setup-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:24px 26px}
#setup-form .settings-grid{gap:20px}#setup-form input,#setup-form select{width:100%;min-height:44px;box-sizing:border-box}
#setup-status{margin:18px 0 0}



.setup-footer{flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 26px;border-top:1px solid var(--line)}
.setup-footer button{min-height:44px;white-space:normal}
@media(max-width:600px){
 #setup-dialog{width:calc(100% - 24px);max-height:calc(100svh - 24px)}
 #setup-dialog>.dialog-header{padding:20px 18px 16px}#setup-title{font-size:24px}
 .setup-body{padding:20px 18px}
 .setup-footer{padding:12px 18px;flex-direction:column-reverse;gap:4px;align-items:stretch}
}
@media(max-height:540px){#setup-dialog>.dialog-header{padding:14px 18px}#setup-dialog .dialog-header .help{display:none}.setup-footer{padding:10px 18px}}



/* Ordering controls are shown only while explicitly organising links. */
#links-order-status:empty{display:none}#links-order-status{margin:0 0 14px}
#tools-dialog #organize-links[aria-pressed=true]{border-color:var(--accent);color:var(--accent-text);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.link-group-order{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:4px 0 10px;border-bottom:1px solid var(--line)}
.link-order-actions{display:flex;flex:none;gap:2px}
#tools-dialog .link-order-actions button{min-width:36px;min-height:40px;padding:6px;border:1px solid var(--line);border-radius:6px;font-size:18px}
#tools-dialog .link-order-actions button:disabled{opacity:.35;cursor:default}
/* Drag handles while organising; the drop place shows as an accent line or an outlined group. */
.link-drag{flex:none;display:grid;place-items:center;width:28px;min-height:40px;color:var(--muted);font-size:18px;cursor:grab;touch-action:none;user-select:none;border-radius:6px}
.link-drag:hover{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.link-group-order .help{flex:1}
.dragging{opacity:.45}.dragging .link-drag{cursor:grabbing}
.link-row.drop-before,.link-collection.drop-before{box-shadow:inset 0 2px 0 var(--accent)}
.link-row.drop-after,.link-collection.drop-after{box-shadow:inset 0 -2px 0 var(--accent)}
.link-collection.drop-into{outline:2px dashed var(--accent);outline-offset:-2px;border-radius:8px}
@media(pointer:coarse){.link-drag{width:44px;min-height:44px}}
#tools-dialog .link-order-actions button:not(:disabled):hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
@media(pointer:coarse){#tools-dialog .link-order-actions button,.links-home-setting select{min-height:44px;min-width:44px}}
@media(max-width:600px){#tools-dialog .link-order-actions button{min-width:44px;min-height:44px}.links-home-setting{grid-template-columns:1fr}.links-home-setting select{width:100%;max-width:none}#tools-dialog .link-row:has(.link-order-actions){flex-wrap:wrap;gap:4px 8px}#tools-dialog .link-row:has(.link-order-actions)>a{flex-basis:calc(100% - 52px)}#tools-dialog .link-row:has(.link-order-actions)>.link-order-actions{order:3;width:100%;justify-content:flex-end}}


/* Editing and transfer forms keep their heading and actions in view. */
.form-dialog{position:fixed;inset:0;margin:auto;box-sizing:border-box;max-width:none;width:min(720px,calc(100% - 40px));max-height:calc(100svh - 40px);padding:0;overflow:clip}
.form-dialog[open]{display:flex;flex-direction:column}
.form-dialog>.dialog-header{flex:none;margin:0;padding:22px 24px 18px;align-items:flex-start}
.form-dialog>form{display:flex;flex-direction:column;flex:1;min-height:0;overflow:clip}
.form-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:22px 24px}
.form-dialog .dialog-actions{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:0;padding:16px 24px;border-top:1px solid var(--line)}
.form-dialog .dialog-actions button{min-height:44px}
.form-dialog .dialog-actions .action{margin-left:auto}
.form-dialog input:not([type=checkbox]),.form-dialog textarea{width:100%;box-sizing:border-box;min-height:44px}
.form-dialog label{min-width:0}.form-dialog label>.help{margin:0;line-height:1.5}
.field-error,.form-status[data-error=true]{color:var(--danger);font-size:13px;line-height:1.5}
.field-error:empty,.form-status:empty{display:none}
[aria-invalid=true]{border-color:var(--danger);outline-color:var(--danger)}
#link-form-status{margin:18px 0 0}#link-form label+label{margin-top:18px}
#import-preview-form fieldset{margin:16px 0;padding:0;border:0;gap:10px}
#import-preview-form legend{margin-bottom:12px;font-weight:600;font-size:14px}
#import-preview-form .import-section{padding:14px;border:1px solid var(--line);border-radius:10px;min-height:44px;box-sizing:border-box;background:var(--surface);cursor:pointer}
#import-preview-form .import-section:has(input:checked){border-color:var(--accent-text)}
.import-section-copy{display:grid;gap:5px;min-width:0}.import-section-copy strong{font-size:14px;font-weight:600}.import-section-copy .help{margin:0;font-size:12px;line-height:1.5}
#import-selection-count{margin:0;font-size:12px}#import-preview-summary{margin:0 0 18px}
#settings-transfer-status{margin:14px 0 0}
@media(max-width:600px){
 .form-dialog{width:calc(100% - 24px);max-height:calc(100svh - 24px)}
 .form-dialog>.dialog-header{padding:18px 18px 14px}.form-dialog h2{font-size:24px}
 .form-body{padding:18px}.form-dialog .dialog-actions{padding:12px 18px;gap:8px 14px}
 .form-dialog .dialog-actions .action{order:-1;flex-basis:100%;margin-left:0}
 #import-selection-count{margin-left:auto}#paste-text{min-height:180px}
}

.form-dialog input[type=checkbox]{accent-color:var(--accent-text)}

/* Home weather states and adaptive room around the footer. */
#weather-widget{max-width:100%;margin-inline:auto}
#weather-fallback{font-size:15px;font-weight:600}
#weather-status{max-width:520px;margin:10px auto 0;font-size:13px;line-height:1.6;text-wrap:pretty}
#weather-status[hidden],#weather-fallback[hidden]{display:none}
.weather-recovery{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;margin-top:8px}
.weather-recovery[hidden]{display:none}
.weather-recovery button{min-height:40px;padding:6px 10px;font:13px var(--font-text);color:inherit;border:1px solid currentColor;border-radius:8px}
.weather-recovery button:disabled{opacity:.55;cursor:wait}
#weather-widget[data-state=stale] #weather-status{font-size:12px}
.weather-block:focus-visible,.corner-button:focus-visible,.quote-actions button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
body .start-page,body.bar-bottom .start-page{padding-bottom:max(100px,calc(var(--home-footer-height,28px) + var(--edge) + 44px))}
body[data-search=bottom] .start-page{padding-bottom:max(150px,calc(var(--home-footer-height,28px) + var(--edge) + 100px))}
.page-search[data-position=bottom]{bottom:calc(var(--home-footer-height,28px) + var(--edge) + 12px)}
@media(pointer:coarse){.corner-button,.credit-favorite,.quote-actions button,.weather-recovery button{min-width:44px;min-height:44px}.quote-actions{opacity:1}.quote-section:not(:hover):not(:focus-within) .quote-actions:has(#favorite-quote[aria-pressed=true])>:not(#favorite-quote){opacity:1;pointer-events:auto}}
@media(max-width:600px){
 .corner-button,.credit-favorite,.quote-actions button,.weather-recovery button{min-width:44px;min-height:44px}
 .page-footer,.page-footer:has(>.shortcut-bar[data-position=bottom]:not([hidden])){display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
 .page-footer #wallpaper-credit{order:1;max-width:100%;width:100%;box-sizing:border-box}
 .page-footer>.shortcut-bar[data-position=bottom]{order:2;flex-basis:100%;width:100%;max-width:100%;box-sizing:border-box}
 .page-footer>nav:not(.shortcut-bar){order:3;gap:4px;margin-left:auto}
 .quote-actions{opacity:1;position:static;transform:none;justify-content:center}
 .quote-section:not(:hover):not(:focus-within) .quote-actions:has(#favorite-quote[aria-pressed=true])>:not(#favorite-quote){opacity:1;pointer-events:auto}
}
@media(prefers-reduced-motion:reduce){.quote-actions{transition:none}}

body.bar-bottom .start-page{padding-bottom:max(150px,calc(var(--home-footer-height,28px) + var(--edge) + 44px))}
body.bar-bottom[data-search=bottom] .start-page{padding-bottom:max(150px,calc(var(--home-footer-height,28px) + var(--edge) + 100px))}

body .start-page{padding-top:max(100px,var(--home-top-clearance,100px))}
body[data-search=top] .start-page{padding-top:max(130px,var(--home-top-clearance,130px))}
@media(max-width:800px){
 body[data-search=top] .page-search[data-position=top],body[data-search] .shortcut-bar[data-position=top]{top:18px}
 body[data-search=top] .shortcut-bar[data-position=top]{top:76px}
}
@media(max-height:540px){body .start-page{padding-top:max(70px,var(--home-top-clearance,70px))}}

#settings-dialog .sync-row,#settings-dialog .sync-choice{min-width:0;max-width:100%}
#settings-dialog #sync-status{flex:1 1 240px;min-width:0;overflow-wrap:anywhere;line-height:1.6}
#settings-dialog .sync-row button{min-height:44px;max-width:100%;white-space:normal;text-align:left}

/* Settings use distinct pages; the visual theme stays unchanged. */
#settings-form .settings-page[hidden]{display:none}
.settings-page{display:grid;gap:22px;min-width:0}
.settings-page-title{margin:0;font:600 25px/1.25 var(--font-text);color:var(--ink)}
.settings-page-title:focus{outline:none}
.settings-page-intro{margin:-12px 0 0}
.settings-section-picker{display:none}
#settings-dialog .settings-page .settings-transfer{padding:0;border:0;background:none;display:grid;gap:20px}
#settings-dialog .settings-page .settings-data-group{padding:20px;border:1px solid var(--line);border-radius:12px}
#settings-dialog .settings-page fieldset .settings-grid>button{justify-self:start;align-self:center}
#settings-dialog .settings-page fieldset .settings-grid>.help{grid-column:1/-1}
#settings-dialog .settings-sections .text-button{overflow-wrap:anywhere}
@media(max-width:900px){
 #settings-dialog .settings-sections{display:none}
 .settings-section-picker{display:grid;gap:7px;margin:8px 0 24px;font-size:13px;color:var(--muted)}
 .settings-section-picker select{width:100%;min-width:0;min-height:44px}
 #settings-dialog .settings-page fieldset{padding:18px}
}

.settings-page .settings-grid>label:has(>input[type=checkbox]){display:flex;flex-direction:row;align-items:center;gap:10px}
.settings-page .settings-grid>label>input[type=checkbox]{width:auto;margin:0}
#about-original[hidden]{display:none}
.welcome-card{position:fixed;top:20px;left:24px;z-index:2;width:min(400px,calc(100% - 32px));padding:18px 20px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--text);text-shadow:none;box-shadow:0 12px 32px #0004}
.welcome-card-title{margin:0 0 6px;font-weight:600;font-size:17px;color:var(--ink)}.welcome-card-text{margin:0 0 14px;font-size:14px;line-height:1.5}
.store-badge{display:block;width:auto;height:48px}#settings-dialog .settings-grid>a.text-button:has(>.store-badge:not([hidden])),#settings-dialog .settings-grid>a.text-button:has(>.store-badge:not([hidden])):hover{min-height:0;padding:0;border:0;background:none}.welcome-card-actions .store-badge{height:40px}@media(max-width:600px){#welcome-extension{display:none}}.welcome-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px}.welcome-card-actions .action{padding:9px 16px}
.setup-city{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 0 22px;padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}.setup-city-label{font-size:14px;font-weight:600}.setup-city #setup-city{font-size:14px;color:var(--accent-text);text-decoration:underline;text-underline-offset:3px}.setup-city .help{flex-basis:100%}
@media(max-width:600px){.welcome-card{position:relative;inset:auto;width:auto;margin:0 16px calc(var(--home-footer-height,28px) + var(--edge) + 24px)}body:has(#welcome-card:not([hidden])) .start-page{min-height:0;padding-bottom:24px}}
#paste-dialog .import-label{align-self:flex-start;padding:10px 14px;margin:4px 0 16px;border:1px solid var(--line);border-radius:8px;font:13px/1.4 var(--font-text)}#paste-dialog .import-label:hover{border-color:var(--muted);background:var(--surface)}
.settings-toggle,.settings-toggle-inline{flex-direction:row!important;align-items:center;gap:10px}.settings-toggle{font-weight:600;margin:0 0 16px}
.settings-toggle input,.settings-toggle-inline input{width:18px!important;height:18px;flex:none;accent-color:var(--accent)}
fieldset[data-settings-group]>.toggles{margin:0 0 18px}
.wallpaper-readability{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.wallpaper-readability h4{margin:0 0 12px;font-size:15px}
.setup-steps{list-style:none;counter-reset:setup-step;margin:0 0 18px;padding:0;display:grid;gap:22px}
.setup-step{counter-increment:setup-step;position:relative;padding-left:40px}
.setup-step::before{content:counter(setup-step);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:var(--accent);color:#141414;font:600 13px/26px var(--font-text);text-align:center}
.setup-step-title{font-size:16px;margin:2px 0 10px}.setup-step .setup-city{margin:0}
.setup-name-label input{max-width:360px}
.setup-wallpapers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:8px}
.setup-wallpaper{position:relative;flex-direction:column!important;gap:6px!important;padding:8px;border:1px solid var(--line);border-radius:10px;cursor:pointer;font-size:13px}
.setup-wallpaper input{position:absolute;opacity:0;width:1px!important;height:1px;margin:0}
.setup-wallpaper:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.setup-wallpaper:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:3px}
.setup-wallpaper-chip{display:block;height:54px;border-radius:6px}
.setup-chip-plain{background:#131312}.setup-chip-nature{background:linear-gradient(160deg,#9cc7b4,#2f5d4a 60%,#1d3a2e)}
.setup-chip-space{background:radial-gradient(circle at 70% 30%,#5b6bb5 0,#1b1f3d 45%,#07080f 80%)}.setup-chip-bing{background:linear-gradient(180deg,#f4b36b,#d8615a 50%,#3f3a6b)}
.setup-links{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
@media(max-width:600px){.setup-wallpapers{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Corner buttons name themselves at once, on hover and keyboard focus (the native title tooltip is slow). */
.page-footer .corner-button{position:relative}
.page-footer .corner-button[data-tip]:hover::after,.page-footer .corner-button[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 10px);right:-4px;white-space:nowrap;padding:6px 10px;border-radius:6px;background:var(--paper);color:var(--text);font:13px/1.3 var(--font-text);box-shadow:0 4px 16px #0005;text-shadow:none;pointer-events:none;z-index:3}
/* One style for secondary actions in the settings: framed, like Export / Import (monospace stays for metadata). */
#settings-dialog .settings-grid>.text-button,#settings-dialog .settings-grid>a.text-button,#settings-dialog .settings-wallpaper-entry>.text-button,#settings-dialog .sync-row>.text-button{display:inline-flex;align-items:center;justify-content:center;justify-self:start;min-height:42px;padding:9px 14px;border:1px solid var(--line);border-radius:8px;background:var(--panel-paper,transparent);color:var(--text);font:13px/1.4 var(--font-text);text-decoration:none}
#settings-dialog .settings-grid>.text-button:hover,#settings-dialog .settings-grid>a.text-button:hover,#settings-dialog .settings-wallpaper-entry>.text-button:hover,#settings-dialog .sync-row>.text-button:hover{border-color:var(--muted);background:var(--surface)}
#settings-dialog .sync-row>.danger{color:var(--danger)}
#setup-dialog #setup-add-link{display:inline-flex;align-items:center;min-height:40px;padding:8px 14px;border:1px solid var(--line);border-radius:8px;font:13px/1.4 var(--font-text)}#setup-dialog #setup-add-link:hover{border-color:var(--muted);background:var(--surface)}
.spaces-heading{font-size:15px;margin:22px 0 10px}
.space-list{list-style:none;margin:0 0 14px;padding:0;border-top:1px solid var(--line)}
.space-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:6px 0;border-bottom:1px solid var(--line)}
.space-row-name{font-weight:600;overflow-wrap:anywhere}.space-row-current{font:12px JetBrains,monospace;color:var(--muted)}
.space-row .text-button,.space-inline-form .text-button{min-height:38px;padding:7px 14px;border:1px solid var(--line);border-radius:8px;font:13px/1.4 var(--font-text)}
.space-inline-form{display:flex;align-items:flex-end;gap:10px}.space-inline-form label{flex:1}
/* Wallpaper window: current wallpaper first, then tabs (one panel at a time) that stay in view while scrolling. */
.library-body>.library-navigation{position:sticky;top:-24px;z-index:2;margin:18px -26px 16px;padding:10px 26px;border-bottom:1px solid var(--line);background:var(--paper)}
@media(max-width:600px){.library-body>.library-navigation{top:-20px;margin:14px -16px 14px;padding:10px 16px}}
.library-navigation button[aria-selected=true]{border-color:var(--accent);color:var(--accent-text);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.library-panel[hidden]{display:none}
#wallpaper-preferences>.settings-grid{margin-bottom:18px}
/* Focus timer, under the clock: discreet until started. */
.focus-timer{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:5px 8px 5px 6px;border-radius:999px;background:rgb(0 0 0 / .28);font:15px/1 JetBrains,monospace;text-shadow:none}
.focus-timer[hidden]{display:none}.focus-time{font-size:17px;font-variant-numeric:tabular-nums;letter-spacing:.02em}.focus-phase{font-size:12px;opacity:.8}
.focus-button{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:var(--accent);color:#141414;font-size:13px;line-height:1}.focus-button[hidden]{display:none}
#focus-reset{background:transparent;color:inherit;font-size:16px}
.focus-timer[data-phase=break] .focus-button:not(#focus-reset){background:#7fc8a9}
body:not(.has-wallpaper) .focus-timer{background:var(--surface);color:var(--text)}
@media(min-width:601px){.setup-wallpapers{grid-template-columns:repeat(5,minmax(0,1fr))}}
.setup-chip-hostux{background:url('/wallpapers/hostux-day-5-thumb.webp') center/cover}
/* Sync by code: the code reads in groups of four, large and selectable. */
.code-sync-value{display:block;margin:12px 0 4px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;font:600 18px/1.4 JetBrains,monospace;letter-spacing:.06em;user-select:all;overflow-wrap:anywhere}
.code-sync-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin-top:14px}.code-sync-form label{flex:1 1 260px}
.code-sync-form input{font-family:JetBrains,monospace;text-transform:uppercase;letter-spacing:.04em}
/* Reserve one line for the texts filled by app.js, so the first paint does not shift (CLS). */
#clock:empty::before,#date:empty::before,#quote-text:empty::before,#quote-author:empty::before{content:"\00a0"}
#weather-widget{min-height:4.5rem}  /* Loading line, then the city prompt or the forecast (69 to 73 px). */