@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Sora:wght@600;700;800&display=swap");

:root{
  --font-title:"Sora", "Avenir Next", "Segoe UI", sans-serif;
  --font-body:"Manrope", "Avenir Next", "Segoe UI", sans-serif;

  --bg:#f2f5fb;
  --bg-accent:#e4e9f6;
  --panel:#ffffff;
  --panel-soft:#f6f8fe;
  --card-bg:#ffffff;
  --line:#d8e1f0;
  --line-strong:#b8c8e0;
  --text:#1c2740;
  --muted:#64718a;
  --primary:#4a7cff;
  --primary-hover:#3b6ce6;
  --primary-soft:rgba(59,130,246,.08);
  --accent:#f3c85f;
  --accent-hover:#ddb34f;
  --accent-soft:#fff2cd;
  --danger:#be3543;
  --danger-soft:#ffeef1;
  --warn:#9b6a0e;
  --warn-soft:#fff6e8;
  --success:#1d8058;
  --success-soft:#e9f8f1;
  --shadow:0 16px 38px rgba(17,35,56,.12);
  --button-text:#ffffff;
  --radius:18px;
  --radius-sm:12px;
}

html[data-theme="dark"]{
  --bg:#070f21;
  --bg-accent:#0d1d3a;
  --panel:#0f1c35;
  --panel-soft:#142644;
  --card-bg:#0f1c35;
  --line:#243d63;
  --line-strong:#3a5886;
  --text:#e8efff;
  --muted:#a5b6d5;
  --primary:#6b9aff;
  --primary-hover:#5a87e8;
  --primary-soft:rgba(107,154,255,.12);
  --accent:#f0bb44;
  --accent-hover:#d9a733;
  --accent-soft:#2b3e5f;
  --danger:#ff7184;
  --danger-soft:#462332;
  --warn:#ffcf7d;
  --warn-soft:#45361d;
  --success:#68d8aa;
  --success-soft:#1f3f35;
  --shadow:0 20px 46px rgba(0,0,0,.38);
  --button-text:#1a1200;
}

html[data-theme="eclate"]{
  --bg:#050915;
  --bg-accent:#071427;
  --panel:rgba(10,18,38,.86);
  --panel-soft:rgba(13,23,48,.82);
  --card-bg:rgba(10,18,38,.86);
  --line:rgba(90,123,185,.42);
  --line-strong:rgba(255,185,95,.62);
  --text:#ecf3ff;
  --muted:#b4c3de;
  --primary:#7ba8ff;
  --primary-hover:#6994e8;
  --primary-soft:rgba(123,168,255,.12);
  --accent:#ffc24b;
  --accent-hover:#eca937;
  --accent-soft:rgba(255,194,75,.2);
  --danger:#ff6f7f;
  --danger-soft:rgba(92,34,45,.74);
  --warn:#ffd069;
  --warn-soft:rgba(86,60,22,.72);
  --success:#84e0ca;
  --success-soft:rgba(29,73,61,.72);
  --shadow:0 24px 58px rgba(2,6,20,.62);
  --button-text:#1a1200;
}

*{box-sizing:border-box}

html{
  background:var(--bg);
  color-scheme:light;
}

html[data-theme="dark"],
html[data-theme="eclate"]{
  color-scheme:dark;
}

body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(780px 360px at 0% -14%, color-mix(in srgb, var(--accent) 26%, transparent), transparent 64%),
    radial-gradient(720px 340px at 100% 0%, color-mix(in srgb, var(--warn) 22%, transparent), transparent 72%),
    linear-gradient(160deg, var(--bg) 0%, var(--bg-accent) 100%);
  color:var(--text);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
}

.app-shell{
  position:relative;
  min-height:100vh;
}

.app-sidebar{
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  width:260px;
  overflow:hidden;
  padding:16px 12px;
  border-right:1px solid var(--line);
  background:
    radial-gradient(460px 260px at 0% 0%, color-mix(in srgb, var(--accent) 28%, transparent), transparent 72%),
    linear-gradient(180deg, color-mix(in srgb, var(--panel) 88%, transparent), color-mix(in srgb, var(--panel-soft) 94%, transparent));
  box-shadow:inset -1px 0 0 rgba(255,255,255,.14);
  z-index:40;
  display:flex;
  flex-direction:column;
}

.app-sidebar-brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:16px;
  background:color-mix(in srgb, var(--panel) 90%, transparent);
}

.app-sidebar-logo{
  display:block;
  max-width:170px;
  max-height:80px;
  width:auto;
  height:auto;
  object-fit:contain;
  filter:contrast(1.08) saturate(1.05) brightness(1.03);
}

.app-nav{
  margin-top:14px;
  display:flex;
  flex-direction:column;
  gap:6px;
  flex:1;
  overflow-y:auto;
  min-height:0;
}

.app-nav-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:42px;
  padding:10px 12px;
  border:1px solid transparent;
  border-radius:12px;
  color:var(--text);
  text-decoration:none;
  font-weight:650;
  font-size:.94rem;
  background:transparent;
}

.app-nav-link:hover{
  text-decoration:none;
  border-color:var(--line);
  background:color-mix(in srgb, var(--panel-soft) 84%, transparent);
}

.app-nav-link.is-active{
  border-color:var(--line-strong);
  background:color-mix(in srgb, var(--accent) 18%, var(--panel) 82%);
  box-shadow:0 8px 16px rgba(8,20,36,.16);
}

/* Accordion nav groups */
.app-nav-group{
  margin:2px 0;
}
.app-nav-group-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  min-height:38px;
  padding:8px 12px;
  border:none;
  border-radius:12px;
  background:transparent;
  color:var(--muted);
  font-weight:700;
  font-size:.82rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  cursor:pointer;
  transition:background .15s, color .15s;
}
.app-nav-group-toggle:hover{
  background:color-mix(in srgb, var(--panel-soft) 60%, transparent);
  color:var(--text);
}
.app-nav-group.is-open > .app-nav-group-toggle{
  color:var(--text);
}
.app-nav-chevron{
  display:inline-block;
  width:16px;
  height:16px;
  transition:transform .2s;
}
.app-nav-chevron::after{
  content:"";
  display:block;
  width:7px;
  height:7px;
  margin:4px auto;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(-45deg);
  transition:transform .2s;
}
.app-nav-group.is-open .app-nav-chevron::after{
  transform:rotate(45deg);
}
.app-nav-group-items{
  display:none;
  padding:0 0 4px 0;
}
.app-nav-group.is-open > .app-nav-group-items{
  display:block;
}
.app-nav-group-items .app-nav-link{
  padding-left:24px;
  min-height:36px;
  font-size:.88rem;
  font-weight:500;
}

.app-sidebar-footer{
  margin-top:auto;
  padding:10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:color-mix(in srgb, var(--panel) 92%, transparent);
  flex-shrink:0;
  position:relative;
}

.app-user-card{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}

.app-user-avatar{
  width:34px;
  height:34px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:color-mix(in srgb, var(--accent) 28%, var(--panel) 72%);
  color:var(--text);
  font-weight:800;
}

.app-user-label{
  color:var(--muted);
  font-size:.75rem;
  line-height:1.2;
}

.app-user-name{
  color:var(--text);
  font-weight:700;
  font-size:.9rem;
  line-height:1.2;
}

.app-sidebar-logout{
  width:100%;
  min-height:38px;
  padding:8px 10px;
  border-radius:10px;
  font-size:.85rem;
}

.app-user-avatar{cursor:pointer}
.app-user-menu{
  display:none;
  position:absolute;
  bottom:100%;
  left:0;right:0;
  margin-bottom:6px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:12px;
  box-shadow:var(--shadow);
  padding:6px;
  z-index:50;
}
.app-user-menu.is-open{display:block}
.app-user-menu-item{
  display:block;
  width:100%;
  padding:8px 12px;
  border:none;
  border-radius:8px;
  background:transparent;
  color:var(--text);
  font-size:.82rem;
  font-weight:600;
  text-decoration:none;
  text-align:left;
  cursor:pointer;
}
.app-user-menu-item:hover{background:var(--panel-soft)}
.app-user-menu-item--danger{color:var(--danger,#ef4444)}

.app-main{
  position:relative;
  min-width:0;
  padding:18px 22px 24px;
  margin-left:260px;
  min-height:100vh;
}

.app-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin:0 auto 16px;
  max-width:1280px;
}

.app-header-left{
  display:flex;
  align-items:center;
  gap:10px;
}

.app-page-chip{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.app-header-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.app-header-user{
  display:inline-flex;
}

.app-burger{
  display:none;
  width:38px;
  min-width:38px;
  height:38px;
  min-height:38px;
  padding:0;
  border-radius:10px;
  border-color:var(--line-strong);
  background:var(--panel);
  color:var(--text);
  font-weight:800;
  font-size:1rem;
  line-height:1;
}

.app-burger:hover{
  border-color:var(--line-strong);
  background:var(--panel-soft);
  color:var(--text);
}

.app-sidebar-overlay{
  display:none;
  border:0;
  border-radius:0;
  padding:0;
  background:rgba(0,0,0,.44);
}

.app-main .wrap{
  max-width:1280px;
  margin:0 auto;
  padding:0;
}

.app-content{
  padding-bottom:8px;
}

/* ── Mention dropdown (shared by chrono + admin) ── */
.lun-mention-dropdown{
  background:var(--panel,#fff);border:1px solid var(--line,#ddd);border-radius:8px;
  box-shadow:0 4px 16px rgba(0,0,0,.18);overflow:hidden;max-height:240px;overflow-y:auto;
}
.lun-mention-item{
  display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;font-size:.82rem;
  color:var(--text,#222);
}
.lun-mention-item:hover,.lun-mention-item--active{
  background:var(--accent-soft,rgba(59,130,246,.12));
}
.lun-mention-item strong{font-weight:700}
.lun-mention-item-user{font-size:.7rem;color:var(--muted,#888);margin-left:auto}

html[data-theme="dark"] body{
  background:
    radial-gradient(930px 460px at 6% -18%, rgba(90,126,204,.22), transparent 62%),
    radial-gradient(720px 360px at 100% 0%, rgba(244,186,71,.16), transparent 72%),
    linear-gradient(155deg, #070f21 0%, #0b1832 48%, #070f1f 100%);
}

html[data-theme="eclate"] body{
  background:
    radial-gradient(760px 420px at 50% 34%, rgba(255,156,59,.28), transparent 56%),
    radial-gradient(820px 450px at 18% 80%, rgba(66,130,255,.24), transparent 64%),
    linear-gradient(152deg, rgba(3,6,15,.74) 0%, rgba(6,15,34,.82) 52%, rgba(3,7,19,.9) 100%),
    url("./fond.jpg") center / cover no-repeat fixed;
}

@media (max-width: 980px){
  html[data-theme="eclate"] body{
    background-attachment:scroll;
  }
}

html[data-theme="dark"] .app-sidebar{
  box-shadow:inset -1px 0 0 rgba(177,206,252,.12);
}

html[data-theme="eclate"] .app-sidebar{
  background:
    radial-gradient(540px 300px at 0% 0%, rgba(255,164,72,.3), transparent 72%),
    radial-gradient(540px 360px at 20% 100%, rgba(69,125,255,.26), transparent 74%),
    linear-gradient(180deg, rgba(8,14,30,.9), rgba(5,10,22,.96));
  border-right-color:color-mix(in srgb, var(--line-strong) 62%, transparent);
}

html[data-theme="eclate"] .app-nav-link.is-active{
  box-shadow:0 10px 24px rgba(2,8,24,.48), 0 0 0 1px rgba(255,191,88,.34);
}

.wrap{
  max-width:1100px;
  margin:0 auto;
  padding:28px 20px 40px;
}

.topbar{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:20px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:18px;
  background:color-mix(in srgb, var(--panel) 92%, transparent);
  box-shadow:var(--shadow);
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding:10px 12px;
  border:1px solid var(--line-strong);
  border-radius:16px;
  background:linear-gradient(145deg, color-mix(in srgb, var(--accent) 16%, var(--panel) 84%) 0%, color-mix(in srgb, var(--accent) 6%, var(--panel-soft) 94%) 100%);
  box-shadow:0 10px 24px rgba(17,35,56,.16);
}

.brand img,
.brand .mark{
  display:block;
  width:180px;
  max-width:52vw;
  height:auto;
  filter:contrast(1.2) saturate(1.06) brightness(1.02);
}

.brand .badge{
  background:color-mix(in srgb, var(--panel) 88%, transparent);
  border-color:var(--line);
}

.pill{
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  min-height:44px;
  padding:8px 12px;
  border:1px solid var(--line);
  border-radius:999px;
  background:color-mix(in srgb, var(--panel) 90%, transparent);
  box-shadow:0 1px 2px rgba(29,26,22,.04);
  color:var(--muted);
  font-size:.94rem;
}

.theme-switch{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--panel-soft);
}

.theme-switch button{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--muted);
  box-shadow:none;
}

.theme-switch button .theme-icon{
  position:relative;
  width:17px;
  height:17px;
  border-radius:50%;
  transition:transform .15s ease, box-shadow .15s ease;
}

.theme-switch button[data-theme-toggle="light"] .theme-icon{
  background:radial-gradient(circle at 68% 52%, #e8edf7 42%, transparent 43%), #ffffff;
  border:1px solid #d9e2ef;
  box-shadow:inset -2px -2px 0 rgba(228,235,246,.9), 0 1px 2px rgba(13,24,43,.2);
}

.theme-switch button[data-theme-toggle="dark"] .theme-icon{
  background:radial-gradient(circle at 68% 52%, #0a1428 42%, transparent 43%), #0f1a30;
  border:1px solid #314b74;
  box-shadow:inset -2px -2px 0 rgba(4,7,14,.55), 0 1px 2px rgba(0,0,0,.32);
}

.theme-switch button[data-theme-toggle="eclate"] .theme-icon{
  background:radial-gradient(circle at 68% 52%, #09132a 42%, transparent 43%), #101d34;
  border:1px solid #f4bc57;
  box-shadow:inset -2px -2px 0 rgba(5,9,16,.48), 0 0 8px rgba(244,188,87,.5);
}

.theme-switch button[data-theme-toggle="eclate"] .theme-icon::before,
.theme-switch button[data-theme-toggle="eclate"] .theme-icon::after{
  content:"";
  position:absolute;
  border-radius:999px;
  background:#f5c76d;
  box-shadow:0 0 6px rgba(245,199,109,.6);
}

.theme-switch button[data-theme-toggle="eclate"] .theme-icon::before{
  width:2px;
  height:8px;
  top:-5px;
  right:2px;
}

.theme-switch button[data-theme-toggle="eclate"] .theme-icon::after{
  width:8px;
  height:2px;
  top:-1px;
  right:-5px;
}

.theme-switch button:hover{
  border:0;
  background:color-mix(in srgb, var(--panel) 90%, transparent);
  box-shadow:none;
}

.theme-switch button.is-active{
  background:var(--panel);
  box-shadow:0 0 0 1px var(--line-strong), 0 5px 14px rgba(9,20,36,.22);
}

.theme-switch button.is-active .theme-icon{
  transform:scale(1.08);
}

.theme-switch button:focus-visible{
  outline:2px solid color-mix(in srgb, var(--accent) 72%, #ffffff 28%);
  outline-offset:2px;
}

html[data-theme="eclate"] .theme-switch button.is-active{
  box-shadow:0 0 0 1px rgba(255,188,87,.76), 0 8px 18px rgba(2,8,24,.52);
}

.pill-user{
  color:var(--muted);
}

.pill-ticket{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--text);
  font-weight:600;
}

.pill-ticket-move{
  padding:6px 10px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--panel-soft);
  color:var(--text);
  font-size:.84rem;
  font-weight:600;
}

.pill-ticket-move:hover{
  text-decoration:none;
  background:var(--panel);
}

.pill-menu{
  position:relative;
}

.pill-menu summary{
  list-style:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--panel-soft);
  color:var(--text);
  font-size:.84rem;
  font-weight:600;
  cursor:pointer;
  user-select:none;
}

.pill-menu summary::-webkit-details-marker{
  display:none;
}

.pill-menu summary::after{
  content:"▾";
  font-size:.8em;
  opacity:.7;
}

.pill-menu[open] summary{
  border-color:var(--line-strong);
  background:var(--panel);
}

.pill-menu-content{
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  min-width:220px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--panel);
  box-shadow:var(--shadow);
  overflow:hidden;
  z-index:20;
}

.pill-menu-content a,
.pill-menu-content .menu-link-button{
  display:block;
  width:100%;
  padding:10px 12px;
  border:0;
  border-top:1px solid var(--line);
  background:none;
  color:var(--text);
  text-align:left;
  font:inherit;
  text-decoration:none;
  cursor:pointer;
}

.pill-menu-content > :first-child{
  border-top:0;
}

.pill-menu-content a:hover,
.pill-menu-content .menu-link-button:hover{
  text-decoration:none;
  background:var(--panel-soft);
}

.pill-menu-content a.is-active{
  background:var(--accent-soft);
  font-weight:700;
}

.pill-menu-group-title{
  padding:8px 12px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:.72rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  background:var(--panel-soft);
}

.pill-menu-content form{
  margin:0;
}

.badge,
.chip,
.tag,
.status{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--panel-soft);
  color:var(--muted);
  font-size:.84rem;
  line-height:1.2;
}

.badge{font-weight:600}

.chip.red,
.tag.red,
.badge.red,
.status.priority-urgent,
.chip.priority-urgent{
  border-color:#ecc4be;
  background:var(--danger-soft);
  color:var(--danger);
}

.status.priority-important,
.chip.priority-important,
.status.warn,
.schedule-status-warn{
  border-color:#ead6a5;
  background:var(--warn-soft);
  color:var(--warn);
}

.status.priority-normal,
.chip.priority-normal{
  border-color:var(--line);
}

.schedule-status-on{
  border-color:#cfe4d9;
  background:var(--success-soft);
  color:var(--success);
}

.schedule-status-off{
  border-color:#ecc4be;
  background:var(--danger-soft);
  color:var(--danger);
}

.schedule-status-muted{
  border-color:var(--line);
  background:var(--panel-soft);
  color:var(--muted);
}

a{
  color:var(--text);
  text-decoration:none;
}

a:hover{text-decoration:underline}

.separator{opacity:.35}

.inline-form{
  display:inline;
  margin:0;
}

.link-button{
  padding:0;
  border:0;
  background:none;
  color:var(--text);
  font:inherit;
  cursor:pointer;
}

.link-button:hover{
  filter:none;
  text-decoration:underline;
}

.card,
.subcard,
.modal{
  background:color-mix(in srgb, var(--panel) 94%, transparent);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.card{padding:20px}

.subcard{
  padding:16px;
  border-radius:var(--radius-sm);
  background:var(--panel-soft);
  box-shadow:none;
}

.modal{
  width:min(520px, 96vw);
  padding:20px;
}

/* ── Tables ── */
table{width:100%;border-collapse:collapse;margin-top:12px;font-size:.88rem}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line)}
th{font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
tr:last-child td{border-bottom:none}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ── Utility classes ── */
.icon-link{text-decoration:none;position:relative;display:inline-flex;align-items:center}
.page-title{font-weight:600;font-size:.9rem}

h1,h2,h3,h4{margin:0 0 10px;font-family:var(--font-title);letter-spacing:.01em}

h2{font-size:1.12rem}

label{
  display:block;
  margin:12px 0 6px;
  color:var(--muted);
  font-size:.92rem;
  font-weight:600;
}

select,
input,
textarea{
  width:100%;
  padding:11px 12px;
  border:1px solid var(--line-strong);
  border-radius:12px;
  background:var(--panel);
  color:var(--text);
  outline:none;
  font:inherit;
}

select:focus,
input:focus,
textarea:focus{
  border-color:#bfb7ad;
  box-shadow:0 0 0 3px rgba(36,33,29,.06);
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
select:focus-visible,
input:focus-visible,
textarea:focus-visible{
  outline:2px solid #b78a3c;
  outline-offset:2px;
}

input[disabled],
select[disabled],
textarea[disabled]{
  background:var(--panel-soft);
  color:var(--muted);
}

/* Password toggle eye */
.pwd-wrap{position:relative;display:flex;align-items:center}
.pwd-wrap>input{flex:1;padding-right:38px!important}
.pwd-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;font-size:1.1rem;padding:4px 6px;opacity:.5;line-height:1;color:var(--text)}
.pwd-toggle:hover{opacity:1}

input[type="checkbox"],
input[type="radio"]{
  width:auto;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  accent-color:var(--accent);
}

textarea{
  min-height:110px;
  resize:vertical;
}

.row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:14px;
}

.row > *{flex:1 1 220px}

.row button{flex:1 1 180px}

.compact-row{margin-top:8px}

.compact-row > *{flex:1 1 160px}

.ui-form-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.ui-action-bar{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}

.ui-section-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  flex-wrap:wrap;
}

button{
  padding:11px 16px;
  border:1px solid var(--accent);
  border-radius:12px;
  background:var(--accent);
  color:var(--button-text);
  font:inherit;
  font-weight:600;
  cursor:pointer;
  box-shadow:none;
}

button:hover{
  border-color:var(--accent-hover);
  background:var(--accent-hover);
  filter:none;
}

button:disabled{
  opacity:.6;
  cursor:not-allowed;
}

button.link-button{
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  color:var(--text);
  font-weight:inherit;
  box-shadow:none;
}

button.link-button:hover{
  border:0;
  background:none;
  color:var(--text);
}

.ghost-button,
button.ghost-button{
  border-color:var(--line-strong);
  background:var(--panel);
  color:var(--text);
}

.ghost-button:hover,
button.ghost-button:hover{
  border-color:var(--line-strong);
  background:var(--panel-soft);
  color:var(--text);
}

.pill-action-button{
  padding:6px 10px;
  border-radius:999px;
  font-size:.84rem;
  font-weight:600;
}

.danger{
  border-color:var(--danger);
  background:var(--danger);
  color:#fff;
}

.danger:hover{
  border-color:#821e15;
  background:#821e15;
}

.small{font-size:.85rem}

.muted{
  color:var(--muted);
  font-size:.94rem;
}

.timer{
  margin:14px 0 4px;
  font-size:2.35rem;
  font-weight:700;
  letter-spacing:.04em;
}

.hidden{display:none !important}

.subgrid,
.context-columns,
.grid2{
  display:grid;
  gap:16px;
}

.subgrid{grid-template-columns:1.2fr 1fr}

.context-columns,
.grid2{grid-template-columns:1fr 1fr}

.subhead{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  flex-wrap:wrap;
}

.subhead .title{font-weight:700}

table{
  width:100%;
  margin-top:12px;
  border-collapse:collapse;
  background:transparent;
  font-size:.94rem;
}

th,
td{
  padding:11px 10px;
  border-bottom:1px solid var(--line);
  vertical-align:top;
  text-align:left;
}

th{
  color:var(--muted);
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

tr.due-soon-row td{background:var(--warn-soft)}

tr.overdue-row td{background:var(--danger-soft)}

.summary-row{
  cursor:pointer;
  transition:background .15s ease;
}

.feedback{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin-bottom:12px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--panel-soft);
  color:var(--text);
}

.feedback.is-success{
  border-color:#cfe4d9;
  background:var(--success-soft);
  color:var(--success);
}

.feedback.is-warn{
  border-color:#ead6a5;
  background:var(--warn-soft);
  color:var(--warn);
}

.feedback.is-error{
  border-color:#ecc4be;
  background:var(--danger-soft);
  color:var(--danger);
}

.feedback-stack{
  position:fixed;
  right:16px;
  top:16px;
  z-index:1200;
  display:flex;
  flex-direction:column;
  gap:8px;
  width:min(380px, 92vw);
}

.feedback-stack .feedback{
  margin:0;
  box-shadow:var(--shadow);
}

.u-inline{display:inline !important}
.u-m-0{margin:0 !important}
.u-mt-0{margin-top:0 !important}
.u-mt-6{margin-top:6px !important}
.u-mt-8{margin-top:8px !important}
.u-mt-10{margin-top:10px !important}
.u-mt-12{margin-top:12px !important}
.u-mt-16{margin-top:16px !important}
.u-mt-18{margin-top:18px !important}
.u-mt-20{margin-top:20px !important}
.u-mb-8{margin-bottom:8px !important}
.u-mb-10{margin-bottom:10px !important}
.u-mb-12{margin-bottom:12px !important}
.u-mb-16{margin-bottom:16px !important}
.u-mb-18{margin-bottom:18px !important}
.u-font-700{font-weight:700 !important}
.u-w-auto{width:auto !important}
.u-w-100{width:100px !important}
.u-w-120{width:120px !important}
.u-w-160{width:160px !important}
.u-w-180{width:180px !important}
.u-maxw-120{max-width:120px !important}
.u-overflow-auto{overflow:auto !important}
.u-flex-100{flex:1 1 100% !important}
.u-flex-220{flex:1 1 220px !important}
.u-flex-2-260{flex:2 1 260px !important}
.u-flex-280{flex:1 1 280px !important}
.u-flex-260{flex:1 1 260px !important}
.u-flex-320{flex:1 1 320px !important}
.u-align-end{align-self:end !important}
.u-align-center{align-self:center !important}
.u-flex-end{display:flex !important;justify-content:flex-end !important}
.u-justify-between{justify-content:space-between !important}
.u-items-start{align-items:flex-start !important}
.u-gap-12{gap:12px !important}
.u-text-center{text-align:center !important}
.u-flex-wrap-gap8{display:flex !important;gap:8px !important;flex-wrap:wrap !important}
.u-flex-wrap-gap8-mb10{display:flex !important;gap:8px !important;flex-wrap:wrap !important;margin-bottom:10px !important}
.u-flex-wrap-gap8-mb12{display:flex !important;gap:8px !important;flex-wrap:wrap !important;margin-bottom:12px !important}
.u-flex-wrap-gap8-mt12{display:flex !important;gap:8px !important;flex-wrap:wrap !important;margin-top:12px !important}
.u-check-row{display:flex !important;gap:10px !important;align-items:center !important;margin-top:34px !important}
.u-check-row-tight{display:flex !important;gap:10px !important;align-items:center !important;margin-top:10px !important}
.u-check-row-inline{display:flex !important;gap:10px !important;align-items:center !important;margin-top:0 !important}
.u-check-row-inline-sm{display:flex !important;gap:8px !important;align-items:center !important;margin-top:0 !important}
.u-check-row-sm-mt6{display:flex !important;gap:8px !important;align-items:center !important;margin-top:6px !important}
.u-check-row-end{display:flex !important;gap:10px !important;align-items:center !important;align-self:end !important}
.u-maxh-280{max-height:280px !important}
.u-h-12{height:12px !important}
.u-minw-260{min-width:260px !important}
.u-minw-280{min-width:280px !important}
.u-minw-320{min-width:320px !important}
.u-minw-340{min-width:340px !important}
.u-minw-240{min-width:240px !important}
.u-minw-220{min-width:220px !important}
.u-minw-420{min-width:420px !important}
.u-tag-offset{margin-left:8px !important}
.u-row-end-gap12{margin:0 !important;align-items:end !important;gap:12px !important}
.u-stack-grid-gap8{display:grid !important;gap:8px !important}
.u-pre-line{white-space:pre-line !important}

.summary-row:hover td{background:color-mix(in srgb, var(--accent-soft) 68%, var(--panel) 32%)}

.due-badge{
  display:inline-block;
  margin-left:8px;
  padding:2px 8px;
  border:1px solid #ead6a5;
  border-radius:999px;
  background:var(--warn-soft);
  color:var(--warn);
  font-size:.75rem;
}

.overdue-badge{
  border-color:#ecc4be;
  background:var(--danger-soft);
  color:var(--danger);
}

.status{
  font-size:.82rem;
  background:var(--panel-soft);
}

.status.running{
  border-color:#cfe4d9;
  background:var(--success-soft);
  color:var(--success);
}

.status.paused{
  border-color:var(--line-strong);
  background:var(--accent-soft);
  color:var(--text);
}

.status.todo{border-color:var(--line)}
.status.open{
  border-color:#d7d3cc;
  background:var(--panel-soft);
  color:var(--text);
}

.status.in_progress{
  border-color:#ead6a5;
  background:var(--warn-soft);
  color:var(--warn);
}

.status.resolved{
  border-color:#cfe4d9;
  background:var(--success-soft);
  color:var(--success);
}

.status.closed{
  border-color:#d7d3cc;
  background:var(--panel-soft);
  color:var(--muted);
}

.right{text-align:right}

.mono{font-variant-numeric:tabular-nums}

.hint{
  color:var(--muted);
  font-size:.84rem;
}

.app-footer-meta{
  margin-top:18px;
  color:var(--muted);
  font-size:.78rem;
  text-align:center;
}

.top-gap{margin-top:10px}

.danger-text,
.overdue-text{color:var(--danger)}

.overdue-chip{box-shadow:inset 0 0 0 1px #ecc4be}

.task-detail-block,
.history-item,
.schedule-slot{
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--panel);
}

.history-meta,
.schedule-meta,
.suggestion-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:.84rem;
}

.sensitive-inline-reveal{
  appearance:none;
  border:none;
  background:transparent;
  padding:0;
  margin:0;
  color:inherit;
  font:inherit;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-variant-numeric:tabular-nums;
  cursor:pointer;
  text-decoration:underline dotted;
  text-underline-offset:2px;
}

.sensitive-inline-reveal:hover,
.sensitive-inline-reveal:focus-visible{
  color:var(--text);
  outline:none;
}

.sensitive-inline-reveal.is-loading{
  opacity:.7;
  pointer-events:none;
}

.sensitive-inline-reveal.is-revealed{
  text-decoration:none;
}

.history-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  max-height:320px;
  overflow:auto;
  padding-right:4px;
}

.history-head,
.schedule-slot-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:6px;
  color:var(--muted);
  font-size:.84rem;
}

.schedule-slot-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
}

.schedule-slot.current-slot{
  border-color:#cfe4d9;
  background:var(--success-soft);
}

.schedule-slot.next-slot{
  border-style:dashed;
  background:var(--panel-soft);
}

.schedule-slot-note{
  margin-top:6px;
  color:var(--muted);
  font-size:.84rem;
}

.schedule-week-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.schedule-week-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px;
}

.schedule-day-card{
  min-height:100%;
  padding:14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--panel);
}

.schedule-day-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
  color:var(--muted);
  font-size:.84rem;
}

.current-day-card{
  border-color:var(--line-strong);
  background:var(--panel-soft);
}

.compact-slot-list{
  gap:8px;
}

.compact-slot-list .schedule-slot{
  padding:10px 12px;
}

.lune-dashboard{
  min-width:0;
}

.lune-dashboard-grid{
  display:grid;
  grid-template-columns:minmax(0, 1.7fr) minmax(300px, .86fr);
  gap:16px;
  align-items:start;
}

.lune-dashboard-left,
.lune-dashboard-right{
  display:grid;
  gap:14px;
  min-width:0;
}

.lune-dashboard-right{
  position:sticky;
  top:18px;
}

.lune-card-head{
  align-items:center;
}

.lune-card-head-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.lune-card-toggle{
  cursor:pointer;
  user-select:none;
}

.lune-card-toggle:focus-visible{
  outline:2px solid color-mix(in srgb, var(--accent) 46%, transparent);
  outline-offset:3px;
  border-radius:12px;
}

.lune-card-toggle.is-toggle-disabled{
  cursor:default;
  opacity:.88;
}

.lune-suggestions-card.is-expanded,
.lune-summary-card.is-expanded{
  border-color:var(--line-strong);
}

.lune-card-head .title{
  font-family:var(--font-title);
  font-size:1.24rem;
  letter-spacing:.01em;
}

.lune-work-card,
.lune-suggestions-card,
.lune-summary-card{
  padding:18px;
}

.lune-work-grid{
  display:grid;
  grid-template-columns:minmax(300px, 1.1fr) minmax(260px, .9fr);
  gap:14px;
  align-items:start;
}

.lune-work-form{
  display:flex;
  flex-direction:column;
}

.lune-work-fields{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.lune-field label{
  margin:0 0 6px;
}

.lune-field-full{
  grid-column:1 / -1;
}

.lune-work-form .hint + .hint{
  margin-top:4px;
}

.lune-work-timer{
  min-height:100%;
  padding:14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:color-mix(in srgb, var(--panel) 90%, transparent);
  display:flex;
  flex-direction:column;
  gap:10px;
}

.lune-time-ring{
  position:relative;
  padding:16px 12px;
  border:1px solid color-mix(in srgb, var(--line-strong) 64%, transparent);
  border-radius:16px;
  background:
    radial-gradient(120% 150% at 50% -20%, color-mix(in srgb, var(--accent) 24%, transparent), transparent 60%),
    linear-gradient(160deg, color-mix(in srgb, var(--panel) 92%, transparent), color-mix(in srgb, var(--panel-soft) 82%, transparent));
  overflow:hidden;
}

.lune-time-ring::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent);
}

.lune-work-timer .timer{
  margin:0;
  text-align:center;
  font-family:var(--font-title);
  font-size:clamp(2.1rem, 3vw, 3rem);
}

.lune-timer-meta{
  min-height:20px;
  text-align:center;
}

.lune-work-actions{
  margin-top:2px;
}

.lune-work-actions button{
  flex:1 1 calc(50% - 6px);
}

.lune-work-actions #startBtn{
  flex:1 1 100%;
  font-size:1.03rem;
}

#suggestionsWrap{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}

.suggestion-btn{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:0;
  min-height:148px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(160deg, color-mix(in srgb, var(--panel) 94%, transparent), color-mix(in srgb, var(--panel-soft) 84%, transparent));
  color:var(--text);
  text-align:left;
  position:relative;
  overflow:hidden;
  box-shadow:0 9px 20px rgba(15,29,46,.1);
  transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.suggestion-btn::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:color-mix(in srgb, var(--line-strong) 72%, transparent);
}

.suggestion-btn.priority-urgent::before{
  background:#e94f5f;
}

.suggestion-btn.priority-important::before{
  background:#efb542;
}

.suggestion-btn.priority-normal::before{
  background:#4f8fef;
}

.suggestion-btn:hover{
  transform:translateY(-2px);
  border-color:var(--line-strong);
  background:linear-gradient(160deg, color-mix(in srgb, var(--panel) 90%, transparent), color-mix(in srgb, var(--panel-soft) 80%, transparent));
  box-shadow:0 12px 26px rgba(15,29,46,.14);
}

.suggestion-btn.overdue{
  border-color:#ecc4be;
  background:linear-gradient(160deg, color-mix(in srgb, var(--danger-soft) 58%, var(--panel) 42%), color-mix(in srgb, var(--danger-soft) 42%, var(--panel-soft) 58%));
}

.suggestion-title{
  font-family:var(--font-title);
  font-size:1.02rem;
  font-weight:700;
  line-height:1.25;
}

.suggestion-meta{
  gap:6px 8px;
  font-size:.78rem;
}

.suggestion-meta span{
  display:inline-flex;
  align-items:center;
  padding:3px 8px;
  border:1px solid var(--line);
  border-radius:999px;
  background:color-mix(in srgb, var(--panel-soft) 90%, transparent);
}

.lune-summary-controls{
  margin-top:10px;
}

.lune-summary-body{
  margin-top:2px;
}

.lune-summary-controls > *{
  flex:1 1 200px;
}

.lune-summary-controls label{
  margin:0 0 6px;
  font-size:.84rem;
}

.lune-summary-card #summaryWrap{
  margin-top:10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:color-mix(in srgb, var(--panel) 94%, transparent);
  overflow:auto;
}

.summary-table{
  margin:0;
  min-width:780px;
}

.summary-table th{
  position:sticky;
  top:0;
  z-index:1;
  background:color-mix(in srgb, var(--panel-soft) 92%, transparent);
}

.summary-table tbody tr:last-child td{
  border-bottom:0;
}

.lune-preview-card,
.lune-controls-card,
.lune-selection-card{
  padding:16px;
}

.lune-preview-list{
  display:grid;
  gap:10px;
}

.lune-preview-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--panel);
}

.lune-preview-item span{
  color:var(--muted);
  font-size:.84rem;
}

.lune-preview-item strong{
  font-family:var(--font-title);
  font-size:1rem;
  text-align:right;
}

.lune-controls-card label:first-of-type{
  margin-top:8px;
}

.lune-selection-card #taskContextWrap{
  max-height:360px;
  overflow:auto;
  padding-right:4px;
}

.lune-selection-card .history-list{
  max-height:180px;
}

html[data-theme="dark"] .lune-work-card,
html[data-theme="dark"] .lune-suggestions-card,
html[data-theme="dark"] .lune-summary-card,
html[data-theme="dark"] .lune-preview-card,
html[data-theme="dark"] .lune-controls-card,
html[data-theme="dark"] .lune-selection-card{
  border-color:color-mix(in srgb, var(--line-strong) 84%, transparent);
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--panel) 94%, transparent), color-mix(in srgb, var(--panel-soft) 88%, transparent));
  box-shadow:0 18px 40px rgba(0,0,0,.34);
}

html[data-theme="dark"] .lune-time-ring{
  background:
    radial-gradient(120% 140% at 50% -20%, rgba(240,187,68,.16), transparent 60%),
    linear-gradient(160deg, rgba(17,30,56,.95), rgba(18,36,64,.88));
}

html[data-theme="eclate"] .lune-dashboard .lune-work-card,
html[data-theme="eclate"] .lune-dashboard .lune-suggestions-card,
html[data-theme="eclate"] .lune-dashboard .lune-summary-card,
html[data-theme="eclate"] .lune-dashboard .lune-preview-card,
html[data-theme="eclate"] .lune-dashboard .lune-controls-card,
html[data-theme="eclate"] .lune-dashboard .lune-selection-card{
  border-color:color-mix(in srgb, var(--line-strong) 78%, transparent);
  background:
    radial-gradient(130% 130% at 10% -10%, rgba(255,178,83,.14), transparent 55%),
    radial-gradient(120% 140% at 100% 0%, rgba(89,152,255,.14), transparent 55%),
    linear-gradient(160deg, rgba(10,18,38,.85), rgba(9,16,34,.78));
  box-shadow:
    0 18px 44px rgba(1,7,22,.56),
    0 0 0 1px rgba(255,192,88,.24),
    0 0 22px rgba(255,164,80,.2),
    0 0 34px rgba(76,137,250,.16);
}

html[data-theme="eclate"] .lune-time-ring{
  border-color:rgba(255,189,94,.58);
  background:
    radial-gradient(70% 110% at 52% 8%, rgba(255,165,76,.24), transparent 60%),
    linear-gradient(160deg, rgba(14,24,50,.92), rgba(10,20,42,.84));
}

html[data-theme="eclate"] .suggestion-btn{
  box-shadow:0 12px 30px rgba(1,8,22,.42), 0 0 0 1px rgba(255,188,87,.16);
}

html[data-theme="eclate"] .lune-dashboard .card,
html[data-theme="eclate"] .lune-dashboard .subcard{
  position:relative;
  overflow:visible;
}

html[data-theme="eclate"] .lune-dashboard .card::after,
html[data-theme="eclate"] .lune-dashboard .subcard::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  pointer-events:none;
  box-shadow:
    0 0 0 1px rgba(255,193,99,.2),
    0 0 16px rgba(255,152,71,.2),
    0 0 26px rgba(80,142,255,.16);
}

html[data-theme="eclate"] .lune-dashboard .card:hover::after,
html[data-theme="eclate"] .lune-dashboard .subcard:hover::after{
  box-shadow:
    0 0 0 1px rgba(255,204,122,.34),
    0 0 20px rgba(255,160,74,.3),
    0 0 32px rgba(90,151,255,.24);
}

.tickets-layout{
  display:grid;
  grid-template-columns:minmax(320px, 420px) minmax(0, 1fr);
  gap:16px;
  align-items:start;
}

.ticket-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
}

.ticket-list-item{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--panel);
  color:var(--text);
}

.ticket-list-item:hover{
  text-decoration:none;
  border-color:var(--line-strong);
  background:var(--panel-soft);
}

.ticket-list-item.is-active{
  border-color:#c9bea9;
  background:var(--accent-soft);
}

.ticket-list-head,
.ticket-list-meta,
.ticket-detail-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:flex-start;
}

.ticket-list-meta,
.ticket-detail-meta{
  color:var(--muted);
  font-size:.84rem;
}

.modal-backdrop{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(29,26,22,.22);
}

.modal h2{margin:0 0 8px}

.error{
  margin-top:10px;
  color:var(--danger);
}

#scanTaskPickerList{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.scan-task-option{
  width:100%;
  text-align:left;
  border-color:var(--line-strong);
  background:var(--panel);
  color:var(--text);
}

.scan-task-option:hover{
  border-color:var(--line-strong);
  background:var(--panel-soft);
  color:var(--text);
}

#moveModeLogWrap{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.move-mode-log-item{
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--panel);
  color:var(--text);
  font-size:.9rem;
}

.move-mode-log-item.is-warn{
  border-color:#ead6a5;
  background:var(--warn-soft);
  color:var(--warn);
}

.move-mode-log-item.is-error{
  border-color:#ecc4be;
  background:var(--danger-soft);
  color:var(--danger);
}

.dashboard-alert-card{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--panel-soft);
}

.preline{white-space:pre-line}

.compact-secondary{}

@media (max-width: 1240px){
  .lune-dashboard-grid{
    grid-template-columns:minmax(0, 1.54fr) minmax(280px, .96fr);
  }
  #suggestionsWrap{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1160px){
  .lune-dashboard-grid{
    grid-template-columns:1fr;
  }
  .lune-dashboard-right{
    position:static;
    top:auto;
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .lune-selection-card{
    grid-column:1 / -1;
  }
}

@media (max-width: 920px){
  .lune-preview-card{
    display:none;
  }
}

@media (max-width: 980px){
  .grid2{grid-template-columns:1fr}
  .lune-dashboard-grid{
    grid-template-columns:1fr;
  }
  .lune-dashboard-right{
    position:static;
    top:auto;
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .lune-selection-card{
    grid-column:1 / -1;
  }
  .lune-work-grid{
    grid-template-columns:1fr;
  }
  .lune-work-actions button{
    flex:1 1 180px;
  }
  .app-main{
    margin-left:0;
  }
  .app-sidebar{
    width:min(82vw, 320px);
    transform:translateX(-104%);
    transition:transform .22s ease;
  }
  .app-burger{
    display:inline-flex;
  }
  .app-sidebar-overlay{
    display:block;
    position:fixed;
    inset:0;
    opacity:0;
    pointer-events:none;
    transition:opacity .18s ease;
    z-index:35;
  }
  .app-main{
    padding:14px 14px 22px;
  }
  .app-header{
    margin-bottom:12px;
  }
  .app-header-user{
    display:none;
  }
  body.sidebar-open .app-sidebar{
    transform:translateX(0);
  }
  body.sidebar-open .app-sidebar-overlay{
    opacity:1;
    pointer-events:auto;
  }
}

@media (max-width: 760px){
  .wrap{padding:20px 14px 32px}
  .lune-dashboard-right{
    grid-template-columns:1fr;
  }
  .lune-work-fields{
    grid-template-columns:1fr;
  }
  .lune-work-card,
  .lune-suggestions-card,
  .lune-summary-card{
    padding:16px;
  }
  #suggestionsWrap{
    grid-template-columns:1fr;
  }
  .lune-work-actions button{
    flex:1 1 100%;
  }
  .summary-table{
    min-width:660px;
  }
  .topbar{flex-direction:column}
  .theme-switch{align-self:flex-start}
  .pill{justify-content:flex-start}
  .app-main .wrap{
    padding:0;
  }
  .app-header-actions{
    width:100%;
    justify-content:flex-start;
  }
  .pill-menu-content{
    right:auto;
    left:0;
    min-width:200px;
  }
  .subgrid,
  .context-columns,
  .schedule-week-grid,
  .tickets-layout{grid-template-columns:1fr}
  .timer{font-size:2rem}
  .compact-secondary{display:none}
}

html[data-theme="dark"] .modal-backdrop{
  background:rgba(3,8,16,.58);
}

html[data-theme="eclate"] .modal-backdrop{
  background:rgba(1,4,12,.7);
}

html[data-theme="dark"] .feedback-stack .feedback{
  box-shadow:0 14px 34px rgba(0,0,0,.42);
}

html[data-theme="eclate"] .feedback-stack .feedback{
  box-shadow:0 16px 40px rgba(1,5,16,.58);
}

html[data-theme="dark"] .brand img,
html[data-theme="dark"] .brand .mark{
  filter:contrast(1.06) saturate(1.02) brightness(1.06);
}

html[data-theme="eclate"] .brand img,
html[data-theme="eclate"] .brand .mark{
  filter:contrast(1.09) saturate(1.16) brightness(1.08);
}

html[data-theme="eclate"] .topbar,
html[data-theme="eclate"] .pill,
html[data-theme="eclate"] .card,
html[data-theme="eclate"] .subcard,
html[data-theme="eclate"] .modal,
html[data-theme="eclate"] .pill-menu-content{
  backdrop-filter:blur(7px);
  border-color:color-mix(in srgb, var(--line) 72%, transparent);
}

html[data-theme="eclate"] .topbar,
html[data-theme="eclate"] .card,
html[data-theme="eclate"] .modal,
html[data-theme="eclate"] .pill-menu-content{
  box-shadow:var(--shadow), 0 0 0 1px rgba(255,176,74,.14);
}

/* =========================================================
   LOADING STATES & SPINNERS
========================================================= */

/* Spinner inline (boutons, champs) */
.lun-spinner{
  display:inline-block;
  width:18px;
  height:18px;
  border:2.5px solid color-mix(in srgb, var(--muted) 30%, transparent);
  border-top-color:var(--accent);
  border-radius:50%;
  animation:lun-spin .6s linear infinite;
}

.lun-spinner.lg{
  width:28px;
  height:28px;
  border-width:3px;
}

.lun-spinner.xl{
  width:42px;
  height:42px;
  border-width:3.5px;
}

@keyframes lun-spin{
  to{transform:rotate(360deg)}
}

/* Loading overlay (cards, sections) */
.lun-loading{
  position:relative;
  pointer-events:none;
}

.lun-loading::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:color-mix(in srgb, var(--panel) 72%, transparent);
  backdrop-filter:blur(2px);
  z-index:5;
}

.lun-loading::before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  width:28px;
  height:28px;
  border:3px solid color-mix(in srgb, var(--muted) 30%, transparent);
  border-top-color:var(--accent);
  border-radius:50%;
  animation:lun-spin .6s linear infinite;
  z-index:6;
}

/* Skeleton loading (placeholder content) */
.lun-skeleton{
  background:linear-gradient(
    90deg,
    color-mix(in srgb, var(--line) 40%, transparent) 25%,
    color-mix(in srgb, var(--line) 20%, transparent) 50%,
    color-mix(in srgb, var(--line) 40%, transparent) 75%
  );
  background-size:200% 100%;
  animation:lun-shimmer 1.4s ease infinite;
  border-radius:8px;
}

.lun-skeleton.text{
  height:14px;
  width:80%;
  margin:6px 0;
}

.lun-skeleton.text-short{
  height:14px;
  width:40%;
  margin:6px 0;
}

.lun-skeleton.block{
  height:42px;
  width:100%;
  margin:8px 0;
}

@keyframes lun-shimmer{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}

/* Button loading state */
button.is-loading,
.btn.is-loading{
  position:relative;
  color:transparent !important;
  pointer-events:none;
}

button.is-loading::after,
.btn.is-loading::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  width:18px;
  height:18px;
  border:2.5px solid color-mix(in srgb, var(--button-text) 30%, transparent);
  border-top-color:var(--button-text);
  border-radius:50%;
  animation:lun-spin .6s linear infinite;
}

/* Transition smooth pour les chargements */
.lun-fade-in{
  animation:lun-fadeIn .24s ease-out;
}

@keyframes lun-fadeIn{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(0)}
}

/* =========================================================
   BREADCRUMBS
========================================================= */
.lun-breadcrumb{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin-bottom:14px;
  padding:0;
  list-style:none;
  font-size:.82rem;
  color:var(--muted);
}

.lun-breadcrumb li{
  display:flex;
  align-items:center;
  gap:6px;
}

.lun-breadcrumb li+li::before{
  content:"\203A";
  color:var(--line-strong);
  font-weight:700;
  font-size:1.1em;
}

.lun-breadcrumb a{
  color:var(--muted);
  text-decoration:none;
  font-weight:600;
  transition:color .14s ease;
}

.lun-breadcrumb a:hover{
  color:var(--text);
  text-decoration:underline;
}

.lun-breadcrumb .is-current{
  color:var(--text);
  font-weight:700;
}

/* =========================================================
   EMPTY STATES
========================================================= */
.lun-empty{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:32px 20px;
  text-align:center;
  color:var(--muted);
}

.lun-empty-icon{
  font-size:2rem;
  opacity:.5;
}

.lun-empty-title{
  font-size:1rem;
  font-weight:700;
  color:var(--text);
}

.lun-empty-hint{
  font-size:.85rem;
  max-width:380px;
}

/* =========================================================
   TOAST NOTIFICATIONS (amélioré)
========================================================= */
.lun-toast-stack{
  position:fixed;
  bottom:20px;
  right:20px;
  display:flex;
  flex-direction:column-reverse;
  gap:8px;
  z-index:9999;
  pointer-events:none;
}

.lun-toast{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:280px;
  max-width:440px;
  padding:12px 16px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--panel);
  box-shadow:0 12px 32px rgba(10,20,40,.22);
  font-size:.88rem;
  font-weight:600;
  color:var(--text);
  pointer-events:auto;
  animation:lun-toastIn .28s ease-out;
}

.lun-toast.success{
  border-color:color-mix(in srgb, var(--success) 40%, var(--line));
  background:var(--success-soft);
}

.lun-toast.warn{
  border-color:color-mix(in srgb, var(--warn) 40%, var(--line));
  background:var(--warn-soft);
}

.lun-toast.error{
  border-color:color-mix(in srgb, var(--danger) 40%, var(--line));
  background:var(--danger-soft);
}

.lun-toast.is-leaving{
  animation:lun-toastOut .22s ease-in forwards;
}

@keyframes lun-toastIn{
  from{opacity:0;transform:translateY(12px) scale(.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@keyframes lun-toastOut{
  from{opacity:1;transform:translateY(0) scale(1)}
  to{opacity:0;transform:translateY(12px) scale(.96)}
}

/* =========================================================
   STATUS INDICATORS
========================================================= */
.lun-status-dot{
  display:inline-block;
  width:8px;
  height:8px;
  border-radius:50%;
  flex-shrink:0;
}

.lun-status-dot.online{background:var(--success)}
.lun-status-dot.offline{background:var(--muted)}
.lun-status-dot.busy{background:var(--warn)}
.lun-status-dot.error{background:var(--danger)}
.lun-status-dot.pulse{animation:lun-pulse 1.6s ease infinite}

/* =========================================================
   NOTIFICATION BELL + PANEL
========================================================= */
.lun-notif-bell{
  position:relative;
  background:none;
  border:none;
  font-size:1.25rem;
  cursor:pointer;
  padding:4px 6px;
  line-height:1;
  color:var(--text);
}
.lun-notif-badge{
  display:none;
  position:absolute;
  top:-2px;right:-4px;
  min-width:16px;height:16px;
  border-radius:8px;
  background:var(--danger);
  color:#fff;
  font-size:.65rem;
  font-weight:700;
  text-align:center;
  line-height:16px;
  padding:0 4px;
}
.lun-notif-badge.has-unread{display:block}

.lun-notif-panel{
  position:fixed;
  top:56px;right:16px;
  width:340px;max-height:420px;
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:0 8px 32px rgba(0,0,0,.18);
  z-index:9999;
  overflow:hidden;
  display:flex;flex-direction:column;
}
.lun-notif-panel[hidden]{display:none!important}
.lun-notif-header{
  display:flex;justify-content:space-between;align-items:center;
  padding:10px 14px;
  border-bottom:1px solid var(--line);
}
.lun-notif-header button{
  background:none;border:none;color:var(--primary);cursor:pointer;font-size:.78rem;
}
.lun-notif-list{
  overflow-y:auto;flex:1;
}
.lun-notif-item{
  display:block;
  padding:10px 14px;
  padding-right:32px;
  border-bottom:1px solid var(--line-soft, var(--line));
  text-decoration:none;
  color:var(--text);
  transition:background .15s;
  position:relative;
}
.lun-notif-item:hover{background:var(--bg-soft, rgba(0,0,0,.03))}
.lun-notif-item.unread{background:var(--primary-soft, rgba(59,130,246,.06))}
.lun-notif-item .notif-title{font-weight:600;font-size:.85rem}
.lun-notif-item .notif-body{font-size:.78rem;color:var(--muted);margin-top:2px}
.lun-notif-item .notif-time{font-size:.7rem;color:var(--muted);margin-top:3px}
.notif-delete{position:absolute;top:8px;right:6px;background:none;border:none;cursor:pointer;font-size:.65rem;color:var(--muted);width:20px;height:20px;border-radius:50%;line-height:20px;text-align:center;padding:0;opacity:0;transition:opacity .15s}
.lun-notif-item:hover .notif-delete{opacity:.5}
.notif-delete:hover{opacity:1!important;color:var(--danger,#ef4444);background:rgba(239,68,68,.1)}
.lun-notif-empty{padding:24px;text-align:center;color:var(--muted);font-size:.85rem}

@media(max-width:420px){
  .lun-notif-panel{width:calc(100vw - 24px);right:-40px}
}

/* =========================================================
   KANBAN BOARD
========================================================= */
#lunKanbanBoard{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
  min-height:400px;
}
.kanban-col{
  background:var(--bg-soft, #f8f8fa);
  border:1px solid var(--line);
  border-radius:var(--radius);
  display:flex;flex-direction:column;
  overflow:hidden;
}
.kanban-col[data-priority="normal"]{background:var(--success-soft)}
.kanban-col[data-priority="important"]{background:var(--warn-soft)}
.kanban-col[data-priority="urgente"]{background:var(--danger-soft)}
.kanban-col-header{
  display:flex;justify-content:space-between;align-items:center;
  padding:10px 12px;
  border-bottom:1px solid var(--line);
  background:var(--bg);
}
.kanban-col-title{font-weight:700;font-size:.85rem}
.kanban-col-count{
  background:var(--primary-soft, rgba(59,130,246,.1));
  color:var(--primary);
  font-size:.72rem;font-weight:700;
  padding:2px 8px;border-radius:10px;
}
.kanban-col-body{
  flex:1;padding:8px;
  min-height:80px;
  transition:background .15s;
}
.kanban-col-body.drag-over{
  background:var(--primary-soft, rgba(59,130,246,.08));
}
.kanban-card{
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:6px;
  padding:10px 12px;
  margin-bottom:8px;
  cursor:grab;
  transition:box-shadow .15s, opacity .15s;
}
.kanban-card:hover{box-shadow:var(--shadow)}
.kanban-card.is-dragging{opacity:.5}
.kanban-card-client{font-size:.7rem;font-weight:700;color:var(--primary);margin-bottom:2px;text-transform:uppercase;letter-spacing:.02em}
.kanban-card-title{font-weight:600;font-size:.82rem;margin-bottom:4px}
.kanban-card-meta{display:flex;gap:8px;font-size:.72rem;color:var(--muted)}
.kanban-priority{
  padding:1px 6px;border-radius:4px;font-weight:600;font-size:.68rem;text-transform:uppercase;
}
.kanban-priority-high,.kanban-priority-urgent{background:var(--danger-soft);color:var(--danger)}
.kanban-priority-medium,.kanban-priority-normal{background:var(--warn-soft);color:#b45309}
.kanban-priority-low{background:var(--success-soft);color:var(--success)}
.kanban-due{color:var(--muted)}

@media(max-width:768px){
  #lunKanbanBoard{grid-template-columns:1fr;gap:8px}
}

@keyframes lun-pulse{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.5;transform:scale(1.3)}
}

@media (max-width: 760px){
  .lun-toast-stack{
    bottom:12px;
    right:12px;
    left:12px;
  }
  .lun-toast{
    min-width:0;
    max-width:none;
  }
}

.cal-chrono-link{text-decoration:none;background:var(--primary);color:#fff!important;cursor:pointer}
.cal-chrono-link:hover{opacity:.85}
.cal-day-name-mobile{display:none}
.cal-cell.cal-empty{border:none}

/* ── LŪN Athena — Dashboard personnel ────────────────────── */
.athena-briefing{background:var(--panel-soft, var(--panel))}
.athena-briefing-items{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.athena-briefing-item{display:flex;align-items:center;gap:8px;font-size:.88rem}
.athena-briefing-icon{font-size:1.1rem;flex-shrink:0}

.athena-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;width:100%}
.athena-kpi-card{display:block;background:var(--panel);border-radius:12px;padding:16px;box-shadow:var(--shadow, 0 1px 3px rgba(0,0,0,.08));text-align:center;transition:box-shadow .2s,transform .15s}
.athena-kpi-card:hover{box-shadow:var(--shadow);transform:translateY(-1px)}
.athena-kpi-card.is-alert{border-left:4px solid var(--danger)}
.athena-kpi-card.is-warn{border-left:4px solid var(--warn)}
.athena-kpi-card.is-active{border-left:4px solid var(--success)}
.athena-kpi-card.is-info{border-left:4px solid var(--primary)}
.athena-kpi-icon{font-size:1.6rem;margin-bottom:4px}
.athena-kpi-value{font-size:1.8rem;font-weight:800;line-height:1.1}
.athena-kpi-label{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);margin-top:4px}
.athena-kpi-detail{font-size:.72rem;color:var(--muted);margin-top:2px}

.athena-task-list{display:flex;flex-direction:column;gap:2px}
.athena-task-row{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:8px;transition:background .15s;text-decoration:none;color:inherit;cursor:pointer}
.athena-task-row:hover{background:var(--panel-soft, rgba(0,0,0,.03))}
.athena-task-action{flex-shrink:0;opacity:0;transition:opacity .15s}
.athena-task-row:hover .athena-task-action{opacity:1}
.athena-task-row.is-overdue{background:var(--danger-soft, rgba(231,76,60,.06))}
.athena-task-row.is-today{background:var(--warn-soft, rgba(243,156,18,.06))}
.athena-task-priority{flex-shrink:0;width:80px}
.athena-task-info{flex:1;min-width:0}
.athena-task-label{font-weight:600;font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.athena-task-client{font-size:.75rem}
.athena-task-due{flex-shrink:0}

@media(max-width:640px){
  .athena-kpi-card{padding:12px}
  .athena-kpi-value{font-size:1.4rem}
  .athena-task-priority{width:60px}
}

/* ── Task Notes (commentaires) ────────────────────── */
.task-notes-list{max-height:300px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
.task-note-item{padding:8px 10px;border-radius:8px;background:var(--panel-soft, rgba(0,0,0,.02));font-size:.82rem}
.task-note-item.is-system{opacity:.7;font-style:italic;background:transparent;padding:4px 10px}
.task-note-header{display:flex;justify-content:space-between;gap:8px;margin-bottom:2px}
.task-note-author{font-weight:700;font-size:.78rem}
.task-note-time{font-size:.72rem;color:var(--muted)}
.task-note-body{line-height:1.4;white-space:pre-wrap;word-break:break-word}
.task-note-mention{color:var(--primary);font-weight:700}

/* ── Calendrier visuel ────────────────────────────── */
.cal-header{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.cal-title{margin:0;font-size:1.2rem;min-width:180px;text-align:center}
.cal-nav-btn{background:none;border:1px solid var(--line);border-radius:8px;padding:6px 14px;cursor:pointer;font-size:1rem;color:var(--text);transition:background .15s}
.cal-nav-btn:hover{background:var(--panel-soft, rgba(0,0,0,.05))}
.cal-filters{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.cal-filters select{max-width:220px}
.cal-weekdays{display:flex;margin-bottom:1px}
.cal-weekdays>div{flex:1 1 calc(100%/7);text-align:center;font-weight:700;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;padding:6px 0;color:var(--muted)}
.cal-weekdays .cal-weekend{opacity:.5}
.cal-grid{display:flex;flex-wrap:wrap;background:var(--line);gap:1px}
.cal-cell{flex:0 0 calc((100% - 6px)/7);background:var(--panel);padding:4px 6px;min-height:90px;cursor:pointer;transition:background .12s;position:relative;box-sizing:border-box}
.cal-cell:hover{background:var(--panel-soft)}
.cal-cell.cal-empty{background:var(--panel);opacity:.3;cursor:default}
.cal-cell.is-today{background:var(--accent-soft)}
.cal-day-num{font-size:.78rem;font-weight:600;margin-bottom:2px;color:var(--muted)}
.cal-day-num.is-today{color:var(--accent);font-weight:800;font-size:.88rem}
.cal-event{padding:2px 4px;margin-bottom:2px;border-radius:4px;background:var(--panel-soft);color:var(--text);font-size:.68rem;line-height:1.25;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer}
.cal-event.is-done{opacity:.4;text-decoration:line-through}
.cal-event-label{font-weight:600;color:var(--text)}
.cal-event-client{display:block;color:var(--muted);font-size:.62rem}
.cal-event-more{font-size:.65rem;color:var(--accent);cursor:pointer;padding:2px 4px}
.cal-popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow);padding:20px;min-width:320px;max-width:500px;max-height:80vh;overflow-y:auto;z-index:1000}
.cal-popup-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;color:var(--text)}
.cal-popup-close{background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--muted);padding:0 4px}
.cal-popup-close:hover{color:var(--text)}
.cal-popup-item{padding:8px 10px;margin-bottom:6px;border-radius:6px;background:var(--panel-soft);color:var(--text)}
.cal-popup-item.is-done{opacity:.5}
.cal-popup-item-title{font-weight:700;font-size:.88rem;color:var(--text)}
.cal-popup-item-meta{display:flex;gap:6px;align-items:center;margin-top:4px;font-size:.75rem;flex-wrap:wrap;color:var(--muted)}
.cal-nav-btn{background:none;border:1px solid var(--line);border-radius:8px;padding:6px 14px;cursor:pointer;font-size:1rem;color:var(--text);transition:background .15s}
.cal-nav-btn:hover{background:var(--panel-soft)}

@media(max-width:640px){
  .cal-cell{min-height:60px;padding:2px 3px}
  .cal-event{font-size:.6rem}
  .cal-day-num{font-size:.7rem}
  .cal-popup{min-width:280px;left:10px;right:10px;transform:translateY(-50%)}
}

/* ── Mobile polish < 640px ── */
@media(max-width:640px){
  .grid2{grid-template-columns:1fr !important}
  .row{flex-direction:column}
  table{font-size:.75rem}
  table th,table td{padding:4px 6px}
  .dashboard-kpi-grid{grid-template-columns:repeat(2,1fr) !important}
  .subhead{flex-wrap:wrap}
  h2{font-size:1rem}
  .card{padding:12px}
  .app-header-actions{gap:4px}
  .lun-notif-bell{font-size:1rem;padding:4px}
}

/* ── Mobile Bottom Nav ────────────── */
.lun-bottom-nav{
  display:none;
  position:fixed;
  bottom:0;left:0;right:0;
  z-index:50;
  background:var(--card-bg,#fff);
  border-top:1px solid var(--line);
  padding:4px 0 max(4px, env(safe-area-inset-bottom));
  box-shadow:0 -2px 10px rgba(0,0,0,.08);
}
.lun-bottom-nav-inner{
  display:flex;
  justify-content:space-around;
  align-items:center;
  max-width:500px;
  margin:0 auto;
}
.lun-bottom-nav a,.lun-bottom-nav button{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
  padding:6px 8px;
  font-size:.62rem;
  color:var(--muted,#888);
  text-decoration:none;
  background:none;
  border:none;
  cursor:pointer;
  line-height:1.1;
  -webkit-tap-highlight-color:transparent;
}
.lun-bottom-nav a.active,.lun-bottom-nav button.active{
  color:var(--primary,#4a7cff);
}
.lun-bottom-nav .bnav-icon{
  font-size:1.25rem;
  line-height:1;
  position:relative;
}
.lun-bottom-nav .bnav-badge{
  position:absolute;
  top:-4px;right:-8px;
  background:var(--danger,#ef4444);
  color:#fff;
  font-size:.55rem;
  font-weight:700;
  padding:1px 4px;
  border-radius:8px;
  line-height:1.2;
  min-width:14px;
  text-align:center;
}
html[data-theme="dark"] .lun-bottom-nav{background:var(--card-bg,#1a1e2e);border-top-color:var(--line,#2a2e3e)}
html[data-theme="eclate"] .lun-bottom-nav{background:rgba(10,10,30,.85);border-top-color:rgba(255,255,255,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

@media(max-width:920px){
  .lun-bottom-nav{display:block}
  .app-main{padding-bottom:70px!important}
}

/* ── Global mobile overflow prevention ────────────── */
html,body{max-width:100%;overflow-x:hidden}

/* ── PWA: offline bar ────────────── */
.lun-offline-bar{position:fixed;top:0;left:0;right:0;z-index:9999;background:var(--warn, #f39c12);color:#1a1200;text-align:center;padding:6px 12px;font-size:.82rem;font-weight:700}

/* ══════════════════════════════════════════════════════════
   MOBILE OPTIMIZATION — Sprint v1.3.x
   ══════════════════════════════════════════════════════════ */

/* ── Tablet (640-980px) ── */
@media(max-width:980px){
  /* Remove problematic min-widths */
  .u-minw-260,.u-minw-280,.u-minw-320,.u-minw-340,.u-minw-420,.u-minw-240,.u-minw-220{min-width:0!important}
  /* Grid fixes */
  .grid2{grid-template-columns:1fr}
  /* Row flex basis: reduce for tablets */
  .row>*{flex:1 1 180px}
  .compact-row>*{flex:1 1 140px}
  /* Admin filter bars: wrap */
  .admin-filter-bar{flex-wrap:wrap}
  .admin-filter-bar>div{flex:1 1 calc(50% - 8px);min-width:140px}
}

/* ── Small tablet / large phone (480-760px) ── */
@media(max-width:760px){
  /* Summary table less wide */
  .summary-table{min-width:0;width:100%}
  .summary-table th:nth-child(4),.summary-table td:nth-child(4),
  .summary-table th:nth-child(5),.summary-table td:nth-child(5){display:none}
  /* Athena task rows: allow wrap */
  .athena-task-label{white-space:normal}
  .athena-task-row{flex-wrap:wrap;gap:6px}
  .athena-task-priority{width:auto}
  .athena-task-action{opacity:1}
  /* KPIs: auto-fit géré par le grid principal */
  /* Admin filter: single column */
  .admin-filter-bar>div{flex:1 1 100%}
  /* Constellation: full width panels */
  .constellation-grid{grid-template-columns:1fr!important}
  .constellation-left-panel,.constellation-right-panel{max-height:300px;overflow-y:auto}
  .constellation-surface{min-width:800px;min-height:400px}
  /* Tables: smaller text + hide non-essential cols */
  table{font-size:.8rem}
  th,td{padding:6px 8px}
  /* Calendar: compact */
  .cal-header-day{font-size:.65rem;padding:4px 2px}
  .cal-cell{min-height:50px;padding:2px}
  .cal-event-label{font-size:.6rem}
  .cal-event-client{display:none}
  /* Breadcrumb: hide on small */
  .lun-breadcrumb{display:none}
  /* Form row: stack completely */
  .row{flex-direction:column}
  .row>*{flex:1 1 100%!important;min-width:0!important;max-width:100%!important}
  .compact-row>*{flex:1 1 100%!important;min-width:0!important}
  /* Utility widths: reset on mobile */
  .u-flex-100,.u-flex-2-260,.u-flex-220{flex:1 1 100%!important;min-width:0!important}
  /* Force no horizontal overflow */
  .wrap,.admin-content-wrap,.card,.subcard{max-width:100vw;overflow-x:hidden}
  /* Labels + inputs: full width block */
  label{display:block;text-align:left}
  select,input[type="text"],input[type="email"],input[type="number"],input[type="date"],input[type="time"],input[type="search"],input[type="password"],textarea{width:100%;box-sizing:border-box}
  /* Details/disclosures: prevent overflow */
  details{max-width:100%;overflow:hidden}
  /* Buttons: keep original size, just ensure tap-friendly inline */
  /* Topbar header: compact */
  .app-header{padding:8px 12px}
  .app-page-chip{display:none}
  /* Reports workspace */
  .reports-shell{grid-template-columns:1fr!important}
  .reports-sidebar{max-height:200px;overflow-y:auto}
}

/* ── Phone (< 480px) ── */
@media(max-width:480px){
  /* Chrono: bigger touch targets */
  .lune-timer-controls{flex-wrap:wrap;gap:6px}
  .lune-timer-controls button{flex:1 1 auto}
  .lune-timer-display{font-size:2.2rem}
  /* Select fields: full width */
  .lune-field select,.lune-field input{font-size:1rem;padding:10px 12px}
  /* KPIs: 1 col sur très petit écran */
  .athena-kpi-grid{grid-template-columns:1fr}
  /* Header: minimal */
  .app-header-actions{gap:6px}
  .theme-switch button{width:32px;min-width:32px;height:32px}
  .pill-ticket{font-size:.72rem;padding:4px 8px}
  /* Cards: less padding */
  .card{padding:14px}
  .subcard{padding:10px}
  /* Calendar: list view instead of grid */
  .cal-grid{display:flex;flex-direction:column;gap:2px}
  .cal-cell{min-height:auto;border:none;padding:6px 8px;border-bottom:1px solid var(--border)}
  .cal-cell.cal-empty{display:none}
  .cal-day-num{font-size:.82rem;font-weight:700;margin-bottom:4px}
  .cal-day-name-mobile{display:inline;font-weight:600;color:var(--muted)}
  .cal-header-row{display:none}
  .cal-nav{flex-wrap:wrap;gap:8px}
  /* Summary table: scroll hint */
  .summary-table-wrap{position:relative}
  .summary-table-wrap::after{content:'← glissez →';position:absolute;bottom:4px;right:8px;font-size:.65rem;color:var(--muted);opacity:.7;pointer-events:none}
  /* Tab bars: scroll */
  .client-tabs-bar{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:4px}
  .client-tabs-bar::-webkit-scrollbar{display:none}
  .client-tabs-bar button{white-space:nowrap;flex-shrink:0;font-size:.75rem;padding:6px 10px}
  /* Preferences table */
  .pref-device-table{font-size:.75rem}
  .pref-device-table th:nth-child(2),.pref-device-table td:nth-child(2){display:none}
  /* Sidebar footer: compact */
  .app-sidebar-footer{padding:10px 16px}
  .app-user-card{gap:8px}
  /* Notification panel: full width */
  .lun-notif-panel{width:calc(100vw - 20px);right:-10px}
  /* Ticket layout */
  .ticket-detail-grid{grid-template-columns:1fr!important}
  /* Timesheet: hide some columns */
  .ts-col-break-am,.ts-col-break-pm,.ts-col-source,.ts-col-updated{display:none}
  /* Onboarding checklist */
  .odin-checklist-grid{grid-template-columns:1fr!important}
}

/* ═══ PWA Mobile UX Enhancements (Phase 3 #4) ═══ */

/* Touch-friendly inputs on mobile */
@media (max-width: 760px) {
  input, select, textarea, button {
    min-height: 44px;
    font-size: max(.85rem, 16px); /* prevent iOS zoom on focus */
  }
  button { padding: 10px 16px; }
  .ghost-button { min-height: 36px; }
}

/* FAB (Floating Action Button) — mobile only */
.lun-fab {
  display: none;
  position: fixed;
  bottom: max(70px, calc(56px + env(safe-area-inset-bottom) + 12px));
  right: 16px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--accent, #ffc24b);
  color: var(--button-text, #1a1200);
  border: none;
  font-size: 1.5rem;
  box-shadow: 0 4px 12px rgba(0,0,0,.3);
  cursor: pointer;
  z-index: 100;
  transition: transform .15s ease, box-shadow .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.lun-fab:active { transform: scale(.92); }
@media (max-width: 920px) { .lun-fab { display: flex; align-items: center; justify-content: center; } }

/* FAB menu (popup on tap) */
.lun-fab-menu {
  display: none;
  position: fixed;
  bottom: max(132px, calc(56px + env(safe-area-inset-bottom) + 72px));
  right: 16px;
  background: var(--card-bg, #1a1a2e);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
  z-index: 101;
  overflow: hidden;
  min-width: 180px;
  border: 1px solid var(--line, #333);
}
.lun-fab-menu.open { display: block; }
.lun-fab-menu a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  color: var(--text);
  text-decoration: none;
  font-size: .85rem;
  border-bottom: 1px solid var(--line, #333);
}
.lun-fab-menu a:last-child { border-bottom: none; }
.lun-fab-menu a:active { background: var(--panel-soft); }

/* Pull-to-refresh indicator */
.lun-pull-indicator {
  position: fixed;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--accent);
  color: var(--button-text);
  padding: 6px 20px;
  border-radius: 0 0 12px 12px;
  font-size: .78rem;
  z-index: 9998;
  transition: top .2s ease;
}
.lun-pull-indicator.visible { top: 0; }

/* Bottom nav badge improvements */
.bnav-badge {
  position: absolute;
  top: 2px;
  right: 50%;
  transform: translateX(14px);
  background: var(--danger, #e74c3c);
  color: #fff;
  font-size: .6rem;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  text-align: center;
  border-radius: 8px;
  padding: 0 4px;
}

/* ═══ Accessibility (Phase 4 #4.2.4) ═══ */

/* Skip to content link */
.lun-skip-link {
  position: absolute;
  top: -100px;
  left: 16px;
  background: var(--accent, #ffc24b);
  color: var(--button-text, #000);
  padding: 8px 16px;
  border-radius: 0 0 8px 8px;
  font-size: .85rem;
  font-weight: 600;
  z-index: 99999;
  text-decoration: none;
  transition: top .2s;
}
.lun-skip-link:focus {
  top: 0;
}

/* Flash messages announced to screen readers */
.admin-flash { role: alert; }