:root{--glass:rgba(18,20,30,.62);--line:rgba(255,255,255,.08);--tx:#f2f4fa;--mu:#a2a8bd;--red:#ff453a;--green:#32d583;--amber:#ff9f0a;--blue:#4d8dff}
*{box-sizing:border-box}html,body{margin:0}
body{color:var(--tx);font:15px/1.45 Inter,system-ui,sans-serif;min-height:100vh;padding-bottom:120px}
.bg{position:fixed;inset:0;z-index:-1;background:linear-gradient(rgba(8,10,18,.35),rgba(8,10,18,.55)),url(bg.jpg) center/cover,
 radial-gradient(900px 500px at 15% 10%,#1d4f8f,transparent),radial-gradient(800px 600px at 90% 80%,#0f6b73,transparent),#0b0f1c}
a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #fff;outline-offset:3px}
.status{display:flex;justify-content:space-between;padding:10px 24px;font-size:13px;font-weight:600}
.st{display:flex;align-items:center;gap:6px}.st svg{width:16px;height:16px}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block;background:#888;margin-right:4px}.dot.on{background:var(--green)}.dot.off{background:var(--red)}.dot.warn{background:var(--amber)}
.screen{max-width:1180px;margin:0 auto;padding:8px 20px}
.home{display:grid;grid-template-columns:minmax(300px,470px) 1fr;gap:20px;align-items:start}
.widgets{display:grid;grid-template-columns:1fr 1fr;gap:14px}.wide{grid-column:1/-1}
.w,.win,.dock{background:var(--glass);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border:1px solid var(--line);border-radius:22px}
.w{padding:16px 18px}
.lab{font-size:12px;font-weight:700;letter-spacing:.02em;display:flex;align-items:center;gap:6px;margin-bottom:8px}.lab svg{width:14px;height:14px}
.red{color:var(--red);font-weight:700;text-transform:uppercase;font-size:12px}.green{color:var(--green)}.amber{color:var(--amber)}
.w-date{min-height:190px;display:flex;flex-direction:column}.day{font-size:40px;font-weight:600;line-height:1}.mon{font-weight:700;text-transform:capitalize}
.clock{font-size:26px;font-weight:600;margin-top:auto}.loc{color:var(--mu);font-size:12px}
.big{font-size:30px;font-weight:700}.sub{color:var(--mu);font-size:13px}.sync{margin-top:16px;font-size:12px;font-weight:600;color:var(--mu)}
.notif{display:flex;gap:10px;align-items:center;padding:6px 0}.notif>div{flex:1;min-width:0}.notif b,article b{display:block;font-size:14px}
.ni{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:#fff}.ni svg{width:16px;height:16px}.ago{color:var(--mu);font-size:11px}
article{padding:8px 0;border-top:1px solid var(--line)}article:first-of-type{border:0}article small{font-weight:700;font-size:11px}article p{margin:2px 0 0;color:var(--mu);font-size:13px}
.apps{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:22px 10px}
.app{display:flex;flex-direction:column;align-items:center;gap:7px;font-size:13px;font-weight:600;text-shadow:0 1px 4px #000a}.app:hover .tile{transform:scale(1.06)}
.tile{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;color:#fff;box-shadow:0 6px 16px #0006;transition:transform .15s}.tile svg{width:30px;height:30px}
.t-orange{background:linear-gradient(#ffa24a,#f0661a)}.t-blue{background:linear-gradient(#4c7bff,#2446c4)}.t-sky{background:linear-gradient(#58a8ff,#2a6fe0)}
.t-white{background:linear-gradient(#fff,#d9dbe3);color:#555}.t-green{background:linear-gradient(#2fd08a,#12905e)}.t-grey{background:linear-gradient(#d8d9de,#8d9099)}
.t-purple{background:linear-gradient(#5b4ad8,#2b1f78)}.t-dark{background:linear-gradient(#2a2c36,#0d0e14)}
.dock{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);display:flex;gap:14px;padding:10px 16px;border-radius:26px;z-index:9}.dock .tile{width:56px;height:56px;border-radius:15px}
.btn{display:inline-block;background:#fff;color:#111;font-weight:600;padding:9px 16px;border-radius:12px}.btn:hover{background:#e6e8f0}
.back{display:inline-flex;align-items:center;gap:4px;font-weight:600;margin:6px 0 12px;color:#fff}.back svg{width:18px;height:18px}
.win{padding:24px}h2{font-size:26px;margin:0 0 18px;font-weight:700}h2 small{color:var(--mu);font-size:15px;margin-left:8px;font-weight:500}h3{font-size:17px;margin:20px 0 10px}
.grid2,.grid4{display:grid;gap:12px;margin:16px 0}.grid2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.grid4{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.card,.stat{background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:16px;padding:16px}.card h3{margin:0 0 6px}.stat span{color:var(--mu);font-size:13px}.stat b{display:block;font-size:26px}
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:14px}table{width:100%;border-collapse:collapse}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}th{color:var(--mu);font-weight:600;font-size:12px}tr:last-child td{border:0}
.up{color:var(--green)}.down{color:var(--red)}.muted{color:var(--mu)}.empty{padding:26px;color:var(--mu);border:1px dashed var(--line);border-radius:14px}.err{color:#ffb4ae;background:#4a1a1a;padding:12px;border-radius:12px}
.pill{font-size:12px;font-weight:600;padding:3px 10px;border-radius:99px;vertical-align:middle;margin-left:8px}.pill.ok{background:#12452f;color:var(--green)}.pill.off{background:#333744;color:var(--mu)}
.plate{font-weight:700;background:#f3f0e4;color:#16213f;padding:2px 10px;border-radius:5px;border:2px solid #16213f;letter-spacing:.08em}
.bar{display:inline-block;width:80px;height:6px;background:#ffffff22;border-radius:3px;vertical-align:middle}.bar i{display:block;height:100%;background:var(--green);border-radius:3px}
.co{margin-bottom:10px}.co summary{cursor:pointer;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.co .tw{margin-top:12px}
@media(max-width:820px){.home{grid-template-columns:1fr}.apps{order:-1}.dock{gap:8px}.dock .tile{width:48px;height:48px}}

/* ===== Thèmes et paramètres ===== */
:root{--acc:#4d8dff;--card:rgba(255,255,255,.06);--bar:rgba(255,255,255,.14);--ov:rgba(8,10,18,.45);--solid:#171a26;--fs:1;
 --bgimg:url(bg.jpg) center/cover,radial-gradient(900px 500px at 15% 10%,#1d4f8f,transparent),radial-gradient(800px 600px at 90% 80%,#0f6b73,transparent)}
html[data-theme=light]{--glass:rgba(255,255,255,.74);--line:rgba(0,0,0,.1);--tx:#161a26;--mu:#586075;--card:rgba(0,0,0,.05);--bar:rgba(0,0,0,.12);--ov:rgba(255,255,255,.35);--solid:#fff}
html[data-accent=green]{--acc:#2fbf7a}html[data-accent=orange]{--acc:#ff9f0a}html[data-accent=purple]{--acc:#a78bfa}html[data-accent=red]{--acc:#ff453a}html[data-accent=pink]{--acc:#ff5fa2}
html[data-bg=ocean]{--bgimg:radial-gradient(900px 500px at 15% 10%,#1d4f8f,transparent),radial-gradient(800px 600px at 90% 80%,#0f6b73,transparent)}
html[data-bg=night]{--bgimg:radial-gradient(900px 500px at 20% 10%,#2b1d5c,transparent),radial-gradient(800px 600px at 85% 85%,#12304a,transparent)}
html[data-bg=sunset]{--bgimg:radial-gradient(900px 500px at 10% 10%,#a8452b,transparent),radial-gradient(800px 600px at 90% 90%,#5b2a86,transparent)}
html[data-bg=forest]{--bgimg:radial-gradient(900px 500px at 15% 10%,#1f6b45,transparent),radial-gradient(800px 600px at 90% 85%,#14545a,transparent)}
.bg{background:linear-gradient(var(--ov),var(--ov)),var(--bgimg),#0b0f1c}
html[data-theme=light] .bg{background:linear-gradient(var(--ov),var(--ov)),var(--bgimg),#dfe6f3}
body{font-size:calc(15px*var(--fs))}html[data-size=small]{--fs:.92}html[data-size=large]{--fs:1.12}
.card,.stat,.notif .ni{background:var(--card)}.notif .ni{background:none}.bar{background:var(--bar)}.bar i{background:var(--acc)}
.btn{background:var(--acc);color:#fff}.btn:hover{background:var(--acc);filter:brightness(1.12)}.btn.ghost{background:none;color:var(--tx);border:1px solid var(--line)}
.back,.app{color:var(--tx)}html[data-theme=light] .app{text-shadow:none}.status{color:var(--tx)}
html[data-glass=off] .w,html[data-glass=off] .win,html[data-glass=off] .dock{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--solid)}
html[data-motion=off] *{transition:none!important;animation:none!important}
html[data-compact="1"] th,html[data-compact="1"] td{padding:6px 10px}html[data-compact="1"] .w{padding:12px}html[data-compact="1"] .win{padding:16px}
html[data-wn="0"] .w-notif,html[data-wnews="0"] .w-news{display:none}
html[data-hide="1"] .big,html[data-hide="1"] .stat b{filter:blur(9px)}
.ok{color:var(--green);background:rgba(50,213,131,.14);padding:12px;border-radius:12px}
.set{margin-bottom:18px}.seg{display:flex;flex-wrap:wrap;gap:8px}.seg button{font:inherit;color:var(--tx);background:var(--card);border:1px solid var(--line);padding:8px 14px;border-radius:12px;cursor:pointer}
.seg button.on{border-color:var(--acc);box-shadow:0 0 0 2px var(--acc) inset}.seg.sw button{width:38px;height:38px;border-radius:50%;background:var(--c);padding:0}
.sw2{display:block;padding:8px 0}.sw2 input{margin-right:10px;accent-color:var(--acc);transform:scale(1.2)}
textarea{width:100%;font:inherit;color:var(--tx);background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;margin:8px 0 12px}label{font-weight:600}
.manage summary{list-style:none;display:inline-block;cursor:pointer;padding:5px 12px}.manage summary::-webkit-details-marker{display:none}.mf{margin-top:8px;display:flex;gap:6px}.mf .btn{border:0;cursor:pointer;font:inherit}
.idcard{max-width:560px;border-radius:20px;padding:22px;color:#10203f;background:linear-gradient(135deg,#eaf1ff,#cfe0ff 55%,#f3ead0);box-shadow:0 14px 40px #0008;display:grid;grid-template-columns:130px 1fr;gap:18px;margin-bottom:14px}
.idcard h4{grid-column:1/-1;margin:0;font-size:13px;letter-spacing:.08em;display:flex;justify-content:space-between}
.idph{width:130px;height:160px;border-radius:10px;background:#9fb4dd;display:grid;place-items:center;font-size:48px;font-weight:700;color:#fff;overflow:hidden}.idph img{width:100%;height:100%;object-fit:cover}
.idf{display:grid;gap:8px;align-content:start}.idf small{display:block;font-size:11px;color:#4a5b82}.idf b{font-size:15px}.idn{font-size:22px!important}
@media(max-width:480px){.idcard{grid-template-columns:1fr}}
@media print{.status,.dock,.back,.noprint,h2{display:none!important}.bg{display:none}body{background:#fff}}
