:root{color-scheme:dark;--bg:#07121b;--bg-2:#0b1924;--panel:#102230;--panel-2:#0b1b27;--panel-3:#142b3b;--line:#264455;--line-soft:rgba(112,158,180,.18);--text:#f4f8fa;--muted:#a9bac4;--accent:#23a6a1;--accent-2:#52c6bc;--accent-soft:rgba(35,166,161,.15);--danger:#ef6f75;--danger-soft:rgba(239,111,117,.14);--ok:#55c98b;--ok-soft:rgba(85,201,139,.14);--warn:#e9be61;--warn-soft:rgba(233,190,97,.14);--shadow:0 18px 48px rgba(0,0,0,.22);--radius:16px;--radius-sm:10px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(circle at 10% 0,rgba(35,166,161,.10),transparent 26rem),linear-gradient(180deg,var(--bg-2),var(--bg));color:var(--text);font:15px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}.wrap{max-width:1320px;margin:auto;padding:26px}.top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}.brand{display:flex;align-items:center;gap:14px;min-width:0}.brand-logo{width:58px;height:58px;object-fit:contain;border-radius:14px;background:#fff;padding:4px;box-shadow:0 10px 24px rgba(0,0,0,.2)}.brand-copy{min-width:0}.brand h1{font-size:clamp(22px,2.2vw,29px);line-height:1.15;margin:0 0 4px;letter-spacing:-.02em;font-weight:700}.muted{color:var(--muted)}h1,h2,h3{letter-spacing:-.015em}h2{font-size:18px;margin:0 0 14px}.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}.span-4{grid-column:span 4}.span-6{grid-column:span 6}.span-8{grid-column:span 8}.span-12{grid-column:span 12}.card{background:linear-gradient(180deg,rgba(19,43,57,.98),rgba(13,31,43,.98));border:1px solid var(--line-soft);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.card:hover{border-color:rgba(82,198,188,.28)}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border:1px solid transparent;border-radius:var(--radius-sm);padding:10px 15px;background:linear-gradient(180deg,var(--accent-2),var(--accent));color:#06201f;font-weight:600;cursor:pointer;text-decoration:none;box-shadow:0 7px 18px rgba(35,166,161,.18);transition:transform .15s ease,filter .15s ease,border-color .15s ease}.button:hover{filter:brightness(1.06);transform:translateY(-1px)}.button:active{transform:translateY(0)}.button.secondary{background:rgba(255,255,255,.035);color:var(--text);border-color:var(--line);box-shadow:none}.button.secondary:hover{background:var(--accent-soft);border-color:rgba(82,198,188,.48)}.button:disabled{opacity:.42;cursor:not-allowed;transform:none;filter:none}input:not([type="checkbox"]),select{width:100%;padding:12px 13px;border-radius:10px;border:1px solid var(--line);background:var(--panel-2);color:var(--text);margin:6px 0 14px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}input:focus,select:focus{border-color:var(--accent-2);box-shadow:0 0 0 3px var(--accent-soft)}.login{max-width:470px;margin:8vh auto;padding:28px}.login-brand{display:flex;align-items:center;gap:16px;margin-bottom:20px}.login-brand img{width:78px;height:78px;object-fit:contain;background:#fff;border-radius:16px;padding:5px}.login-brand h1{margin:0;font-size:24px}.login-brand p{margin:4px 0 0}.login .button{width:100%;margin-top:4px}.notice{padding:13px 15px;border-radius:11px;margin-bottom:16px;border:1px solid transparent;animation:notice-in .22s ease}.notice.ok{background:var(--ok-soft);color:#b6f0ce;border-color:rgba(85,201,139,.28)}.notice.err{background:var(--danger-soft);color:#ffc4c7;border-color:rgba(239,111,117,.3)}.notice.warn{background:var(--warn-soft);color:#f7dda2;border-color:rgba(233,190,97,.3)}.health-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.health-label{font-size:25px;font-weight:700}.pill{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:5px 10px;background:#233c4c;font-size:12px;font-weight:800}.pill.ok,.pill.completed{background:var(--ok-soft);color:#aef0c9}.pill.warning,.pill.running,.pill.queued{background:var(--warn-soft);color:#f6dc9e}.pill.critical,.pill.failed{background:var(--danger-soft);color:#ffc0c3}.metric{margin:13px 0}.metric-row{display:flex;justify-content:space-between;gap:12px}.bar,.progress-track{height:9px;background:#07141d;border-radius:99px;overflow:hidden;margin-top:7px}.bar>span,.progress-bar{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:99px;transition:width .35s ease}.check-list{display:grid;gap:6px}.check{display:grid;grid-template-columns:12px 1fr auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line-soft)}.check:last-child{border-bottom:0}.dot{width:10px;height:10px;border-radius:50%;background:var(--muted);box-shadow:0 0 0 4px rgba(169,186,196,.08)}.dot.ok,.dot.success{background:var(--ok)}.dot.warning,.dot.running{background:var(--warn)}.dot.critical,.dot.failed{background:var(--danger)}.status{display:flex;align-items:center;gap:10px;margin:12px 0}.progress{height:8px;background:#07141d;border-radius:999px;overflow:hidden;display:none;margin:10px 0 16px}.progress.running{display:block}.progress:before{content:"";display:block;height:100%;width:35%;background:linear-gradient(90deg,var(--accent),var(--accent-2));animation:slide 1.2s infinite}table{width:100%;border-collapse:separate;border-spacing:0}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line-soft);vertical-align:middle}tbody tr{transition:background .14s ease}tbody tr:hover{background:rgba(35,166,161,.055)}th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.075em}pre{background:#061019;border:1px solid var(--line-soft);padding:15px;border-radius:11px;max-height:340px;overflow:auto;white-space:pre-wrap}.small{font-size:12px}.nowrap{white-space:nowrap}.nav-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.nav-actions form{margin:0}.nav-link{min-height:40px;padding:8px 11px;font-size:13px}.nav-link.active{background:var(--accent-soft);border-color:rgba(82,198,188,.55);color:#bcfff8}.nav-icon{display:inline-grid;place-items:center;width:18px;font-size:16px;line-height:1}.nav-link.logout{color:#ffd0d2}.summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:18px 0}.summary-grid>div{padding:16px;border:1px solid var(--line-soft);border-radius:13px;background:rgba(6,18,27,.38);display:flex;flex-direction:column;min-height:90px;justify-content:center}.summary-grid strong{font-size:28px;font-weight:700;line-height:1.1}.summary-grid span{color:var(--muted);font-size:13px;margin-top:5px}.diagnostic-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.diagnostic-group{border:1px solid var(--line-soft);border-radius:14px;padding:16px;background:rgba(6,18,27,.22)}.diagnostic-group h3{margin:0 0 12px}.backup-summary,.log-summary,.restore-summary{grid-template-columns:repeat(4,minmax(0,1fr))}.row-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row-actions form{margin:0}.row-actions input[type=hidden]{display:none}.log-filters{display:grid;grid-template-columns:180px minmax(240px,1fr) auto auto;gap:12px;align-items:end}.log-filters label{display:flex;flex-direction:column;color:var(--muted);font-size:13px}.log-filters input,.log-filters select{margin:6px 0 0}.restore-report{margin-top:16px}.restore-plan{margin:0 0 20px;padding-left:22px}.restore-plan li{padding:6px 0}.restore-report+.card{margin-top:16px}.danger-zone{margin-top:18px;padding:18px;border:1px solid rgba(239,111,117,.45);border-radius:12px;background:var(--danger-soft)}.danger-zone code{display:inline-block;margin:4px 0;padding:4px 7px;border-radius:6px;background:#291919}.button.danger{background:linear-gradient(180deg,#c85058,#a9333b);color:#fff}.restore-progress{border-color:rgba(233,190,97,.4)}.progress-track{height:12px;margin-top:18px}.progress-value{margin-top:8px;text-align:right}.backup-launch{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}.backup-launch h2{margin-bottom:6px}.backup-launch .status{margin:0 0 8px}.backup-launch form{margin:0;flex:0 0 auto}.operation-progress{margin:16px 0}.operation-progress[hidden]{display:none}.progress-indeterminate{width:32%!important;animation:nas-slide 1.1s ease-in-out infinite}.progress-error{background:var(--danger)!important}.reset-progress-form{margin-top:14px;text-align:right}.operation-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(3,8,16,.86);backdrop-filter:blur(5px)}.operation-overlay[hidden]{display:none}.operation-dialog{width:min(620px,100%);border-color:rgba(233,190,97,.4);animation:dialog-in .2s ease}.operation-dialog h2{font-size:22px}.operation-overlay-warning{margin:18px 0 0}.operation-locked{overflow:hidden}.nas-toolbar,.archive-delete-toolbar{display:flex;justify-content:flex-end;gap:10px;margin:12px 0}.select-cell{width:46px;text-align:center}.archive-checkbox{width:auto;margin:0;accent-color:var(--accent)}.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}.nas-dashboard{margin-top:24px;padding-top:20px;border-top:1px solid var(--line-soft)}.nas-dashboard-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.nas-dashboard-head h3{margin:0;font-size:16px}.nas-dashboard-content{margin-top:12px}.nas-dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}.nas-dashboard-grid p{margin:0}.nas-dashboard-grid .wide{grid-column:1/-1}.nas-usage{margin-top:12px}.restore-progress.is-hidden{display:none}.restore-result-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}.restore-result-summary>div{padding:13px;border:1px solid var(--line-soft);border-radius:11px;background:rgba(6,18,27,.38)}.restore-result-summary span{display:block;color:var(--muted);font-size:.82rem;margin-bottom:5px}.restore-result-summary strong{display:block;overflow-wrap:anywhere}.table-wrap{overflow-x:auto;border-radius:12px}.card+.card{margin-top:18px}.operation-overlay,.notice,.card{will-change:transform}@keyframes slide{from{transform:translateX(-120%)}to{transform:translateX(320%)}}@keyframes nas-slide{0%{transform:translateX(-110%)}100%{transform:translateX(330%)}}@keyframes dialog-in{from{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}@keyframes notice-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(max-width:980px){.span-4,.span-6,.span-8{grid-column:span 12}.top{align-items:flex-start;flex-direction:column}.nav-actions{width:100%;justify-content:flex-start}.wrap{padding:18px}.card{padding:18px}}@media(max-width:760px){.summary-grid,.diagnostic-groups,.log-filters{grid-template-columns:1fr}.backup-summary,.log-summary,.restore-summary,.restore-result-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.backup-launch{align-items:stretch;flex-direction:column}.backup-launch .button{width:100%}.nav-link{flex:1 1 calc(50% - 8px)}.nav-actions form{flex:1 1 calc(50% - 8px)}.nav-actions form .button{width:100%}.brand-logo{width:52px;height:52px}}@media(max-width:520px){.wrap{padding:12px}.card{padding:15px;border-radius:13px}.brand{align-items:flex-start}.brand-logo{width:46px;height:46px;border-radius:11px}.brand h1{font-size:21px}.nav-link{flex:1 1 100%;justify-content:flex-start}.nav-actions form{flex-basis:100%}.backup-summary,.log-summary,.restore-summary,.restore-result-summary{grid-template-columns:1fr}.nas-dashboard-grid{grid-template-columns:1fr}.nas-dashboard-grid .wide{grid-column:auto}.health-head{align-items:flex-start;flex-direction:column}.login{margin:3vh auto}.login-brand{align-items:flex-start}.login-brand img{width:64px;height:64px}}

.otp-input{font-size:2rem;letter-spacing:.5rem;text-align:center;font-variant-numeric:tabular-nums}.security-note{border-left:4px solid var(--accent);padding-left:1rem}textarea{width:100%;box-sizing:border-box} .top .brand-copy .muted{max-width:52rem}

.totp-enrollment{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);gap:1.5rem;align-items:start}.totp-qr-wrap{text-align:center}.totp-qr{display:block;width:min(100%,280px);height:auto;margin:0 auto 1rem;padding:.75rem;background:#fff;border:1px solid var(--border);border-radius:16px}.totp-manual input,.totp-manual textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}@media(max-width:760px){.totp-enrollment{grid-template-columns:1fr}}

.two-factor-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}.two-factor-actions .button{width:100%;margin:0}@media(max-width:520px){.two-factor-actions{grid-template-columns:1fr}}


/* Signature de l'application */
.app-footer {
    margin-top: 40px;
    padding: 20px 0 30px;
    text-align: center;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.5;
    color: #9aa5b1;
    border: 0;
}
/* ==========================================================
   UI POLISH v2.9.1
   ========================================================== */

:root{
    --radius:12px;
    --radius-sm:8px;

    --shadow-sm:0 2px 8px rgba(0,0,0,.10);
    --shadow-md:0 8px 22px rgba(0,0,0,.12);

    --text:#E7ECF2;
    --muted:#AAB4BF;
}

/* ---------- Typographie ---------- */

body{
    line-height:1.6;
    color:var(--text);

    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:optimizeLegibility;
}

h1,h2,h3{
    font-weight:700;
    letter-spacing:-0.02em;
}

small,
.muted{
    color:var(--muted);
}

/* ---------- Cartes ---------- */

.card,
.panel,
.summary-card{
    border-radius:12px;
    box-shadow:var(--shadow-sm);
    transition:.18s ease;
}

.card:hover,
.summary-card:hover{
    box-shadow:var(--shadow-md);
    transform:translateY(-1px);
}

/* ---------- Boutons ---------- */

.button{
    min-height:44px;
    padding:11px 18px;

    font-weight:600;
    letter-spacing:.15px;

    border-radius:10px;

    transition:
        transform .15s ease,
        box-shadow .15s ease,
        filter .15s ease;
}

.button:hover{
    transform:translateY(-1px);
}

.button:active{
    transform:translateY(0);
}

/* ---------- Champs ---------- */

input:not([type="checkbox"]),
select,
textarea{

    min-height:42px;

    border-radius:9px;

    transition:
        border-color .15s ease,
        box-shadow .15s ease;
}

input:focus,
select:focus,
textarea:focus{

    box-shadow:
        0 0 0 3px rgba(35,166,161,.15);
}

/* ---------- Tableaux ---------- */

table{

    border-collapse:separate;
    border-spacing:0;
}

th{

    font-weight:600;
}

td,
th{

    padding:12px 14px;
}

tbody tr{

    transition:background .15s ease;
}

tbody tr:hover{

    background:rgba(255,255,255,.035);
}

/* ---------- Badges ---------- */

.badge{

    font-weight:600;
    letter-spacing:.2px;
    border-radius:999px;
}

/* ---------- Footer ---------- */

.app-footer{

    opacity:.85;
    font-size:13px;
}

/* ==========================================================
   Cases à cocher
   ========================================================== */

input[type="checkbox"]{
    appearance:auto;
    -webkit-appearance:checkbox;
    width:16px;
    height:16px;
    min-width:16px;
    min-height:16px;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    box-shadow:none;
    transform:none;
    vertical-align:middle;
    accent-color:var(--accent);
    cursor:pointer;
}

.archive-checkbox{
    width:16px;
    height:16px;
    min-width:16px;
    min-height:16px;
    margin:0;
    padding:0;
}