/* ============================================================
   App layer — built ENTIRELY on Nocturne tokens (var(--color-*),
   var(--space-*), var(--radius-*), var(--shadow-*)). No hard-coded
   hexes except the small semantic status marks (see .badge.*),
   which are low-chroma marks in Nocturne's spirit.
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{margin:0;overflow:hidden}
button{font:inherit}
.i{display:inline-flex;align-items:center;justify-content:center;line-height:0;--sz:16px;flex:none}
.i svg{width:var(--sz);height:var(--sz)}
.tnum{font-variant-numeric:tabular-nums}
.mono{font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace}
.muted{color:color-mix(in srgb,var(--color-text) 55%,transparent)}
.subtle{color:color-mix(in srgb,var(--color-text) 42%,transparent)}
.hide{display:none!important}
a{cursor:pointer}

/* ---- app frame ---- */
.app{display:grid;grid-template-columns:264px 1fr;height:100vh}
.sidebar{background:var(--color-surface);border-right:1px solid var(--color-divider);display:flex;flex-direction:column;min-height:0;z-index:40}
.brand{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-4);font-family:var(--font-heading);font-weight:var(--font-heading-weight);font-size:18px;border-bottom:1px solid var(--color-divider)}
.brand .mark{width:28px;height:28px;flex:none;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid var(--color-accent);color:var(--color-accent);border-radius:var(--radius-sm)}
.brand small{display:block;font-family:var(--font-body);font-weight:400;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:color-mix(in srgb,var(--color-text) 50%,transparent)}
.side-scroll{flex:1;overflow-y:auto;padding:var(--space-2)}
.side-label{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:color-mix(in srgb,var(--color-text) 48%,transparent);padding:var(--space-4) var(--space-2) var(--space-1)}
.nav-item{display:flex;align-items:center;gap:var(--space-2);width:100%;text-align:left;padding:var(--space-2);border-radius:var(--radius-sm);color:var(--color-text);text-decoration:none;font-size:13px;cursor:pointer;border:0;background:transparent;font-family:var(--font-body)}
.nav-item:hover{background:color-mix(in srgb,var(--color-text) 6%,transparent)}
.nav-item.active{color:var(--color-accent);background:color-mix(in srgb,var(--color-accent) 13%,transparent);font-weight:600}
.nav-item .label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-item .count{font-size:11px;padding:1px 7px;border-radius:999px;background:color-mix(in srgb,var(--color-text) 10%,transparent);color:color-mix(in srgb,var(--color-text) 62%,transparent)}
.nav-item .lockmark{color:var(--color-accent);opacity:.85}

.main{display:flex;flex-direction:column;min-height:0}
.topbar{display:flex;align-items:center;gap:var(--space-4);border-bottom:1px solid var(--color-divider)}
.icon-btn{display:none;align-items:center;justify-content:center;width:38px;height:38px;border:0;background:transparent;color:var(--color-text);border-radius:var(--radius-md);cursor:pointer}
.icon-btn:hover{background:color-mix(in srgb,var(--color-text) 8%,transparent)}
.search{position:relative;flex:1;max-width:560px}
.search .i{position:absolute;left:11px;top:50%;transform:translateY(-50%);pointer-events:none;color:color-mix(in srgb,var(--color-text) 50%,transparent)}
.search .input{padding-left:34px}
.tbar-actions{display:flex;align-items:center;gap:var(--space-2);margin-left:auto}
.role-seg{display:inline-flex;border:1px solid var(--color-divider);border-radius:var(--radius-md);overflow:hidden;margin-right:var(--space-2)}
.role-seg a{padding:6px 10px;font-size:12px;color:var(--color-text);text-decoration:none;display:inline-flex;align-items:center;gap:5px}
.role-seg a + a{border-left:1px solid var(--color-divider)}
.role-seg a:hover{background:color-mix(in srgb,var(--color-text) 7%,transparent)}
.role-seg a.on{color:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-accent)}
.user{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-2);border-radius:var(--radius-md);cursor:pointer;background:transparent;border:1px solid transparent;color:inherit}
.user:hover{background:color-mix(in srgb,var(--color-text) 6%,transparent)}
.avatar{width:30px;height:30px;flex:none;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-weight:var(--font-heading-weight);font-size:12px;background:color-mix(in srgb,var(--color-accent) 18%,transparent);color:var(--color-accent-200)}
.user .who{display:flex;flex-direction:column;line-height:1.2;text-align:left}
.user .who b{font-weight:600;font-size:13px}
.user .who span{font-size:11px;color:color-mix(in srgb,var(--color-text) 55%,transparent)}

.content{flex:1;overflow-y:auto;padding:var(--space-6) var(--space-8);position:relative}
.wrap{max-width:1180px}
.progress-top{position:absolute;top:0;left:0;height:2px;width:100%;background:transparent;overflow:hidden;opacity:0;transition:opacity .15s}
.progress-top.on{opacity:1}
.progress-top::after{content:"";position:absolute;inset:0;width:40%;background:var(--color-accent);animation:slide 1s ease-in-out infinite}
@keyframes slide{0%{left:-40%}100%{left:100%}}

/* ---- headings / structure ---- */
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-5)}
.page-head .crumbs{font-size:12px;color:color-mix(in srgb,var(--color-text) 50%,transparent);display:flex;align-items:center;gap:6px;margin-bottom:6px}
.page-head h2{margin:0}
.page-head h3{margin:0}
.headline-actions{display:flex;gap:var(--space-2);align-items:center}
.toolbar{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;margin-bottom:var(--space-4)}
.spacer{flex:1}
.seg{display:inline-flex;border:1px solid var(--color-divider);border-radius:var(--radius-md);overflow:hidden}
.seg button{padding:6px 9px;border:0;background:transparent;color:var(--color-text);cursor:pointer;display:inline-flex;align-items:center;gap:5px;font-size:12px}
.seg button + button{border-left:1px solid var(--color-divider)}
.seg button.on{color:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-accent)}
.tabs{display:flex;gap:var(--space-4);border-bottom:1px solid var(--color-divider);margin-bottom:var(--space-4)}
.tabs a{padding:8px 2px;font-size:13px;color:color-mix(in srgb,var(--color-text) 62%,transparent);text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs a.on{color:var(--color-accent);border-bottom-color:var(--color-accent)}

/* ---- kpi ---- */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);margin-bottom:var(--space-6)}
.kpi{gap:var(--space-1)}
.kpi .kpi-num{font-family:var(--font-heading);font-weight:var(--font-heading-weight);font-size:34px;line-height:1;margin-top:4px}
.grid2{display:grid;grid-template-columns:1fr 320px;gap:var(--space-6);align-items:start}
@media(max-width:1080px){.grid2{grid-template-columns:1fr}}

/* ---- tables ---- */
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3)}
.panel-head h4{margin:0}
.cell-item{display:flex;align-items:center;gap:var(--space-3);min-width:0}
.cell-item .ti{width:32px;height:32px;flex:none;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);background:color-mix(in srgb,var(--color-text) 8%,transparent);color:color-mix(in srgb,var(--color-text) 72%,transparent)}
.cell-item .nm{display:flex;flex-direction:column;line-height:1.35;gap:4px;min-width:0}
.cell-item .nm b{font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cell-item .nm small{font-size:11px;color:color-mix(in srgb,var(--color-text) 52%,transparent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rowacts{display:flex;gap:2px;justify-content:flex-end;opacity:.55;transition:opacity .12s}
tr:hover .rowacts{opacity:1}
.ib{width:30px;height:30px;border:0;background:transparent;color:var(--color-text);border-radius:var(--radius-sm);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.ib:hover{background:color-mix(in srgb,var(--color-text) 10%,transparent);color:var(--color-accent)}
.ib.danger:hover{color:#e29a9a}
.table td{vertical-align:middle}
.table.rows-lg td{padding:calc(var(--space-2) + 2px) var(--space-2)}

/* ---- badges (status = colour + icon, never colour alone) ---- */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;line-height:1;padding:3.5px 8px;border-radius:var(--radius-sm);font-weight:500;white-space:nowrap}
.badge svg{width:12px;height:12px}
.badge.ok{color:#93cfa9;background:color-mix(in srgb,#93cfa9 14%,transparent)}
.badge.danger{color:#e6a0a0;background:color-mix(in srgb,#e6a0a0 15%,transparent)}
.badge.warn{color:#ddbd7c;background:color-mix(in srgb,#ddbd7c 15%,transparent)}
.badge.muted{color:var(--color-neutral-200);background:color-mix(in srgb,var(--color-text) 10%,transparent)}
.badge.accent{color:var(--color-accent-200);background:color-mix(in srgb,var(--color-accent) 20%,transparent)}
.badge.outline{color:var(--color-accent-200);background:transparent;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--color-accent) 55%,transparent)}

/* ---- cards / grid view ---- */
.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--space-4)}
.doc-card{cursor:pointer}
.doc-card:hover{box-shadow:var(--shadow-md)}
.doc-card .thumb{height:96px;border-radius:var(--radius-sm);background:color-mix(in srgb,var(--color-text) 7%,transparent);display:flex;align-items:center;justify-content:center;color:color-mix(in srgb,var(--color-text) 45%,transparent);margin-bottom:var(--space-1)}
.chips{display:flex;flex-wrap:wrap;gap:5px}

/* ---- empty / states ---- */
.empty{text-align:center;padding:var(--space-8) var(--space-4);border:1px dashed var(--color-divider);border-radius:var(--radius-md);color:color-mix(in srgb,var(--color-text) 60%,transparent)}
.empty .i{--sz:34px;color:color-mix(in srgb,var(--color-text) 30%,transparent);margin-bottom:var(--space-2)}
.empty h4{margin:0 0 6px;color:var(--color-text)}
.readonly-note{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:color-mix(in srgb,var(--color-accent) 12%,transparent);color:var(--color-accent-200);margin-bottom:var(--space-4)}

/* ---- forms ---- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.form-grid .full{grid-column:1/-1}
.field-hint{font-size:11px;color:color-mix(in srgb,var(--color-text) 50%,transparent);margin-top:4px}
.field-err{font-size:11px;color:#e6a0a0;margin-top:4px;display:flex;align-items:center;gap:5px}
.secret-row{display:flex;gap:var(--space-2);align-items:stretch}
.secret-row .input{flex:1}
.dropzone{border:1.5px dashed var(--color-divider);border-radius:var(--radius-md);padding:var(--space-8) var(--space-4);text-align:center;cursor:pointer;transition:.12s;color:color-mix(in srgb,var(--color-text) 60%,transparent)}
.dropzone:hover,.dropzone.drag{border-color:var(--color-accent);background:color-mix(in srgb,var(--color-accent) 8%,transparent);color:var(--color-accent-200)}
.dropzone .i{--sz:30px;margin-bottom:var(--space-2)}
.filemeta{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);background:color-mix(in srgb,var(--color-text) 6%,transparent)}
.bar{height:5px;border-radius:999px;background:color-mix(in srgb,var(--color-text) 14%,transparent);overflow:hidden}
.bar > i{display:block;height:100%;background:var(--color-accent);width:0;transition:width .2s}
.gen-pop{position:absolute;z-index:30;margin-top:6px;width:290px;padding:var(--space-3);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-lg);border:1px solid var(--color-divider)}
.rng{width:100%}
.classrow{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:var(--space-2) 0}
.classrow label{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;cursor:pointer}

/* ---- detail ---- */
.detail{display:grid;grid-template-columns:1fr 300px;gap:var(--space-6);align-items:start}
@media(max-width:980px){.detail{grid-template-columns:1fr}}
.meta-list{display:flex;flex-direction:column;gap:var(--space-2)}
.meta-list .row{display:flex;justify-content:space-between;gap:var(--space-3);font-size:13px;padding:var(--space-1) 0;border-bottom:1px solid var(--color-divider)}
.meta-list .row span:first-child{color:color-mix(in srgb,var(--color-text) 55%,transparent)}
.ver{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--color-divider)}
.ver:last-child{border-bottom:0}
.ver .vn{width:30px;height:30px;flex:none;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;background:color-mix(in srgb,var(--color-text) 9%,transparent)}

/* ---- matrix ---- */
.matrix{width:100%;border-collapse:collapse;font-size:13px}
.matrix th,.matrix td{padding:var(--space-2);border-bottom:1px solid var(--color-divider);text-align:center}
.matrix th:first-child,.matrix td:first-child{text-align:left}
.matrix thead th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:color-mix(in srgb,var(--color-text) 60%,transparent)}
.acc-pick{display:inline-flex;border:1px solid var(--color-divider);border-radius:var(--radius-sm);overflow:hidden}
.acc-pick button{border:0;background:transparent;color:color-mix(in srgb,var(--color-text) 55%,transparent);cursor:pointer;padding:4px 9px;font-size:11px}
.acc-pick button.on{color:var(--color-accent);box-shadow:inset 0 0 0 1px var(--color-accent)}

/* ---- reveal field ---- */
.reveal-val{font-family:ui-monospace,monospace;font-size:13px;letter-spacing:.04em}
.spin{width:14px;height:14px;border-radius:999px;border:2px solid color-mix(in srgb,var(--color-text) 25%,transparent);border-top-color:var(--color-accent);animation:spin .7s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
.copytimer{font-size:11px;color:var(--color-accent-200);display:inline-flex;align-items:center;gap:5px}

/* ---- auth layout ---- */
.auth{height:100vh;display:grid;place-items:center;padding:var(--space-4);background:
  radial-gradient(120% 90% at 15% 0%, color-mix(in srgb,var(--color-accent) 10%,transparent), transparent 60%),
  var(--color-bg)}
.auth-card{width:min(420px,100%);padding:var(--space-6);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-lg);border:1px solid var(--color-divider)}
.auth-brand{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-5);font-family:var(--font-heading);font-size:20px}
.auth-brand .mark{width:34px;height:34px;border:1.5px solid var(--color-accent);color:var(--color-accent);border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center}
.otp{display:flex;gap:var(--space-2);justify-content:space-between}
.otp input{width:100%;text-align:center;font-size:22px;font-family:ui-monospace,monospace;padding:12px 0}
.qr{width:150px;height:150px;border-radius:var(--radius-sm);background:
  repeating-conic-gradient(var(--color-text) 0 25%, transparent 0 50%) 0 0/16px 16px,
  var(--color-neutral-100);border:6px solid var(--color-neutral-100);margin:0 auto}
.strength{height:5px;border-radius:999px;background:color-mix(in srgb,var(--color-text) 14%,transparent);overflow:hidden;margin-top:6px}
.strength > i{display:block;height:100%;width:60%;background:#ddbd7c}
.authnote{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:color-mix(in srgb,#ddbd7c 14%,transparent);color:#ddbd7c;margin-bottom:var(--space-4)}

/* ---- mobile ---- */
.backdrop{position:fixed;inset:0;background:color-mix(in srgb,#000 55%,transparent);z-index:35;opacity:0;pointer-events:none;transition:opacity .15s}
.backdrop.on{opacity:1;pointer-events:auto}
@media(max-width:900px){
  .app{grid-template-columns:1fr}
  .sidebar{position:fixed;top:0;bottom:0;left:0;width:280px;transform:translateX(-100%);transition:transform .2s}
  .sidebar.open{transform:none}
  .icon-btn{display:inline-flex}
  .role-seg,.user .who{display:none}
  .content{padding:var(--space-4)}
  .kpis{grid-template-columns:1fr 1fr}
  .form-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .search{max-width:none}
  .input,.otp input{font-size:16px}
  .tbar-actions .btn .lbl{display:none}
  .kpis{grid-template-columns:1fr 1fr}
}
@media(max-width:380px){ .topbar{padding-left:var(--space-2);padding-right:var(--space-2)} .content{padding:var(--space-3)} }

/* ============================================================
   filters.js plugin — ships NO CSS. These classes are its
   styling contract, dressed in Nocturne tokens.
   ============================================================ */
.filter-fieldset{border:0;margin:0 0 var(--space-2);padding:0;min-inline-size:0}
.filter-fieldset-legend{font-weight:600;font-size:12px;color:color-mix(in srgb,var(--color-text) 62%,transparent);display:flex;align-items:center;gap:6px;margin-bottom:var(--space-2);padding:0}
.filter-pills-row{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.active-filter{position:relative;display:inline-flex;align-items:center;gap:6px;background:var(--color-surface);border:1px solid var(--color-divider);border-radius:999px;padding:5px 12px;font-size:12.5px;cursor:pointer;min-height:34px;user-select:none;color:var(--color-text)}
.active-filter:hover{border-color:color-mix(in srgb,var(--color-text) 35%,transparent)}
.active-filter.is-set{border-color:var(--color-accent)}
.active-filter.is-dirty{border-style:dashed;border-color:var(--color-accent-400)}
.active-filter .af-key{font-weight:500;color:color-mix(in srgb,var(--color-text) 62%,transparent)}
.active-filter.is-set .af-key{color:var(--color-text)}
.active-filter .af-val{font-weight:600;color:var(--color-accent-200)}
.af-close{border:0;background:transparent;cursor:pointer;color:color-mix(in srgb,var(--color-text) 50%,transparent);display:inline-flex;padding:0;margin-left:2px;line-height:1}
.af-close:hover{color:#e6a0a0}
.af-popover{position:absolute;top:calc(100% + 6px);left:0;z-index:50;min-width:220px;background:var(--color-surface);border:1px solid var(--color-divider);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:8px;cursor:default}
.af-popover-hint{font-size:12px;color:color-mix(in srgb,var(--color-text) 60%,transparent);padding:2px 4px 8px}
.af-popover-search{display:flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid var(--color-divider);border-radius:var(--radius-sm);margin-bottom:6px;color:color-mix(in srgb,var(--color-text) 50%,transparent)}
.af-popover-search input{border:0;outline:0;font:inherit;width:100%;background:transparent;color:var(--color-text)}
.af-popover-list{list-style:none;margin:0;padding:0;max-height:240px;overflow:auto}
.af-popover-item{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:var(--radius-sm);cursor:pointer}
.af-popover-item:hover{background:color-mix(in srgb,var(--color-text) 8%,transparent)}
.af-popover-item.is-highlighted{color:var(--color-accent);font-weight:600}
.af-popover-check{width:16px;display:inline-flex;justify-content:center;color:var(--color-accent)}
.af-popover-textfield{width:100%;font:inherit;padding:6px 8px;border:1px solid var(--color-divider);border-radius:var(--radius-sm);outline:0;background:var(--color-bg);color:var(--color-text)}
.af-popover-textfield:focus{border-color:var(--color-accent)}
.af-popover-foot{display:flex;align-items:center;gap:8px;margin-top:8px;padding-top:8px;border-top:1px solid var(--color-divider)}
.af-popover-foot-spacer{flex:1}
.af-chip-input{display:flex;flex-wrap:wrap;gap:4px;padding:4px;border:1px solid var(--color-divider);border-radius:var(--radius-sm);min-height:36px;align-items:center;background:var(--color-bg)}
.af-chip-input-field{border:0;outline:0;font:inherit;flex:1;min-width:90px;background:transparent;color:var(--color-text)}
.af-input-chip{display:inline-flex;align-items:center;gap:4px;background:color-mix(in srgb,var(--color-accent) 18%,transparent);color:var(--color-accent-200);border-radius:var(--radius-sm);padding:2px 4px 2px 8px;font-size:12px}
.af-input-chip-x{border:0;background:transparent;cursor:pointer;color:inherit;display:inline-flex;padding:0;line-height:1}
.filter-footer{display:none;align-items:center;gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--color-divider)}
.filter-footer.is-visible{display:flex}
.filter-footer-left{flex:1}
.filter-footer-hint{font-size:12px;color:color-mix(in srgb,var(--color-text) 45%,transparent)}
.filter-clear-all{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:color-mix(in srgb,var(--color-text) 62%,transparent);text-decoration:none}
.filter-clear-all:hover{color:#e6a0a0}
.filter-footer-right{display:flex;gap:8px}
.filter-apply-count{background:color-mix(in srgb,var(--color-accent) 30%,transparent);border-radius:var(--radius-sm);padding:0 6px;font-size:12px;font-variant-numeric:tabular-nums}
.btn-sm{padding:5px 10px!important;font-size:12.5px!important}
.btn-outline-secondary{border-color:var(--color-divider)!important;color:var(--color-text)!important}

/* ---- SweetAlert2 → Nocturne ---- */
.swal2-popup{background:var(--color-surface)!important;color:var(--color-text)!important;border-radius:var(--radius-lg)!important;border:1px solid var(--color-divider)!important;font-family:var(--font-body)!important}
.swal2-title{color:var(--color-text)!important;font-family:var(--font-heading)!important;font-weight:var(--font-heading-weight)!important}
.swal2-html-container{color:color-mix(in srgb,var(--color-text) 78%,transparent)!important}
.swal2-actions{gap:8px}
.swal2-styled{border-radius:var(--radius-md)!important;box-shadow:none!important;font-size:14px!important;margin:0!important}
.swal2-styled.swal2-confirm{background:transparent!important;color:#ecb6b6!important;box-shadow:inset 0 0 0 1px #d98b8b!important}
.swal2-styled.swal2-confirm.safe{color:var(--color-accent-200)!important;box-shadow:inset 0 0 0 1px var(--color-accent)!important}
.swal2-styled.swal2-cancel{background:transparent!important;color:var(--color-text)!important;box-shadow:inset 0 0 0 1px var(--color-divider)!important}
.swal2-timer-progress-bar{background:var(--color-accent)!important}
.swal2-toast{background:var(--color-surface)!important;box-shadow:var(--shadow-lg)!important;border:1px solid var(--color-divider)!important}

/* ---- Litepicker → Nocturne ---- */
.litepicker .container__main{background:var(--color-surface);color:var(--color-text);box-shadow:var(--shadow-lg);border:1px solid var(--color-divider);border-radius:var(--radius-md)}
.litepicker .container__months .month-item-header,.litepicker .container__days>div{color:var(--color-text)}
.litepicker .container__days .day-item:hover{box-shadow:inset 0 0 0 1px var(--color-accent)!important;color:var(--color-accent)!important}
.litepicker .container__days .day-item.is-start-date,.litepicker .container__days .day-item.is-end-date{background:var(--color-accent)!important;color:var(--color-bg)!important}
.litepicker .container__days .day-item.is-in-range{background:color-mix(in srgb,var(--color-accent) 18%,transparent)!important}
.litepicker .container__predefined-ranges{background:var(--color-bg)}
.litepicker .container__predefined-ranges button{color:var(--color-text)}