*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#F2F2F7;
  --sidebar:#1C1C1E;
  --stext:rgba(235,235,245,0.95);
  --smuted:rgba(235,235,245,0.58);
  --accent:#007AFF;
  --card:#FFFFFF;
  --border:rgba(60,60,67,0.10);
  --border2:rgba(60,60,67,0.16);
  --text:#1C1C1E;
  --text2:#3A3A3C;
  --muted:#767679;
  --red:#FF3B30;
  --green:#34C759;
  --orange:#FF9500;
  --r:12px;
  --sh:0 1px 2px rgba(0,0,0,0.04),0 4px 14px rgba(0,0,0,0.05);
}
/* ── DARK MODE — Apple / Tesla ─────────────────────────────── */
body.dark{
  --bg:#000000;
  --sidebar:#0A0A0A;
  --card:#111111;
  --border:rgba(255,255,255,0.08);
  --border2:rgba(255,255,255,0.13);
  --text:#FFFFFF;
  --text2:rgba(235,235,245,0.85);
  --muted:rgba(235,235,245,0.62);
  --accent:#0A84FF;
  --green:#30D158;
  --red:#FF453A;
  --orange:#FF9F0A;
  --sh:0 1px 0 rgba(255,255,255,0.04),0 4px 20px rgba(0,0,0,0.6);
}
/* Surfaces */
body.dark .topbar{background:#111111;border-color:rgba(255,255,255,0.06)}
body.dark .add-form{background:#111111;border-color:rgba(255,255,255,0.06)}
body.dark .add-form input[type=text]{background:#1C1C1E;color:#fff;border-color:rgba(255,255,255,0.08)}
body.dark .add-form input[type=text]::placeholder{color:rgba(255,255,255,0.28)}
body.dark .add-form input[type=text]:focus{background:#222;border-color:var(--accent);box-shadow:0 0 0 3px rgba(10,132,255,0.18)}
body.dark .dsel,body.dark .psel{background:#1C1C1E;color:#fff;border-color:rgba(255,255,255,0.08)}
body.dark .ddl-add-input{background:#1C1C1E;color:#fff;border-color:rgba(255,255,255,0.08);color-scheme:dark}
body.dark .ddl-add-input:focus{background:#222}
body.dark .voice-btn{border-color:rgba(255,255,255,0.1);color:rgba(255,255,255,0.45)}
/* Cards */
body.dark .tcard-inner{background:#111111;border-color:rgba(255,255,255,0.05)}
body.dark .tcard-inner:hover{background:#161616}
body.dark .tcheck{background:transparent;border-color:rgba(255,255,255,0.2)}
body.dark .tcheck:hover{border-color:var(--green);background:rgba(48,209,88,.1)}
body.dark .k-card{background:#111111;border:1px solid rgba(255,255,255,0.06)}
body.dark .top-task-card{background:linear-gradient(135deg,#111,#1a1a1a);border:1px solid rgba(255,255,255,0.08)}
/* Toggle */
body.dark .ios-toggle{background:#2C2C2E}
body.dark .ios-toggle:checked{background:var(--accent)}
/* Topbar buttons */
body.dark .tb-btn,body.dark #darkBtn{border-color:rgba(255,255,255,0.1);color:rgba(255,255,255,0.5)}
body.dark .tb-btn:hover,body.dark #darkBtn:hover{border-color:rgba(255,255,255,0.22);color:#fff}
body.dark #waProjBtn{border-color:#25D36644;color:#25D366}
/* Modals */
body.dark .moverlay{background:rgba(0,0,0,0.75)}
body.dark .mbox{background:#111111;border:1px solid rgba(255,255,255,0.08);box-shadow:0 24px 80px rgba(0,0,0,0.8)}
body.dark .mhead{border-color:rgba(255,255,255,0.07)}
body.dark .mhead h2{color:#fff}
body.dark .mfoot{border-color:rgba(255,255,255,0.07)}
body.dark .f-input{background:#1C1C1E;color:#fff;border-color:rgba(255,255,255,0.1)}
body.dark .f-input:focus{background:#222;border-color:var(--accent);box-shadow:0 0 0 3px rgba(10,132,255,0.18)}
body.dark .f-input::placeholder{color:rgba(255,255,255,0.28)}
body.dark .f-label{color:rgba(255,255,255,0.62)}
body.dark .set-info{background:#1C1C1E;color:rgba(255,255,255,0.5);border:1px solid rgba(255,255,255,0.08)}
body.dark .mclose{background:#1C1C1E;color:rgba(255,255,255,0.5)}
body.dark .mclose:hover{background:#222;color:#fff}
body.dark .mi{color:#fff;border-color:rgba(255,255,255,0.06)}
body.dark .mi:hover{background:#1C1C1E}
/* Kanban */
body.dark .k-col{background:#0A0A0A;border-color:rgba(255,255,255,0.06)}
body.dark .k-head{border-color:rgba(255,255,255,0.06)}
body.dark .k-nav{background:#111111;border-color:rgba(255,255,255,0.06)}
body.dark .k-tabs{background:rgba(255,255,255,0.07)}
body.dark .k-tab{color:rgba(255,255,255,0.55)}
body.dark .k-tab.active{color:#fff;border-color:rgba(255,255,255,0.15);background:rgba(255,255,255,0.12);box-shadow:0 1px 4px rgba(0,0,0,.4)}
/* Task badges — quiet hairline chips */
body.dark .dbadge{border-color:rgba(255,255,255,0.14);color:rgba(235,235,245,0.65)}
body.dark .dbadge.clickable:hover{border-color:rgba(255,255,255,0.3);color:#fff}
body.dark .asn-badge{border-color:rgba(255,255,255,0.14);color:rgba(235,235,245,0.65)}
body.dark .asn-badge.clickable:hover{border-color:rgba(255,255,255,0.3);color:#fff}
body.dark .pbadge{border-color:rgba(255,255,255,0.14)!important;color:rgba(235,235,245,0.8)!important}
body.dark .pbadge-none{color:rgba(235,235,245,0.5)!important}
body.dark .sched-badge{border-color:rgba(255,255,255,0.14);color:#4DA3FF}
body.dark .sched-badge:hover{border-color:rgba(10,132,255,0.5)}
body.dark .sched-badge-empty{color:rgba(235,235,245,0.45)}
body.dark .sched-badge-empty:hover{border-color:rgba(255,255,255,0.3)}
body.dark .bkt-badge{border-color:rgba(255,255,255,0.14)}
body.dark .role-tag{border-color:rgba(255,255,255,0.14)}
body.dark .tacbtn{color:rgba(235,235,245,0.5)}
body.dark .tacbtn:hover{background:#2C2C2E;color:rgba(235,235,245,0.9)}
body.dark .tnotes{color:rgba(235,235,245,0.62)}
body.dark .tnotes:empty:before{color:rgba(235,235,245,0.38)}
body.dark .tnotes:focus{color:rgba(235,235,245,0.9)}
/* Misc */
body.dark .bkt-section-hdr{color:rgba(255,255,255,0.52)}
body.dark .hist-head{color:rgba(255,255,255,0.5)}
body.dark .del-proj-row{border-color:rgba(255,255,255,0.07)}
body.dark .del-proj-name{color:#fff}
body.dark .role-tag{border-color:rgba(255,255,255,0.12);color:rgba(255,255,255,0.45)}
body{
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text',
              'Helvetica Neue','Segoe UI',Arial,sans-serif;
  background:var(--bg);color:var(--text);
  -webkit-font-smoothing:antialiased;font-size:15px
}

/* ── LOGIN ────────────────────────────────────────────────── */
#loginScreen{
  display:flex;align-items:center;justify-content:center;min-height:100vh;
  background:linear-gradient(150deg,#1C1C1E 0%,#2C2C2E 60%,#1a1a2e 100%)
}
.lcard{
  background:#fff;color:var(--text);
  padding:44px 36px;width:340px;max-width:92vw;
  border-radius:24px;
  box-shadow:0 32px 80px rgba(0,0,0,.45);
  text-align:center
}
.llogo{font-size:52px;margin-bottom:14px}
.llogo-img{width:84px;height:84px;border-radius:20px;box-shadow:0 12px 36px rgba(10,132,255,.28)}
.ltitle{font-size:28px;font-weight:700;margin-bottom:6px;letter-spacing:-.5px}
.lsub{color:var(--muted);margin-bottom:32px;font-size:15px}
.gbtn{
  width:100%;padding:14px;background:#F2F2F7;color:var(--text);
  border:none;border-radius:14px;font-size:16px;font-weight:600;
  cursor:pointer;font-family:inherit;
  display:flex;align-items:center;justify-content:center;gap:12px;transition:all .15s
}
.gbtn:hover{background:#E5E5EA;box-shadow:0 2px 12px rgba(0,0,0,.1)}
.gbtn:active{transform:scale(.97)}
.gbtn img{width:22px;height:22px}
/* Opening screen in dark mode — applied early via html.dark (before body.dark) */
html.dark .lcard{background:#111;color:#fff;box-shadow:0 32px 80px rgba(0,0,0,.6)}
html.dark .lsub{color:rgba(235,235,245,.5)}
html.dark .gbtn{background:#1C1C1E;color:#fff}
html.dark .gbtn:hover{background:#262626;box-shadow:0 2px 12px rgba(0,0,0,.4)}
#lerr{color:var(--red);margin-top:14px;font-size:13px;min-height:18px;text-align:center}

/* ── APP LAYOUT ───────────────────────────────────────────── */
#app{display:none;height:100vh;flex-direction:row}

/* ── SIDEBAR ──────────────────────────────────────────────── */
.sidebar{
  width:242px;min-width:242px;
  background:var(--sidebar);color:var(--stext);
  display:flex;flex-direction:column;overflow-y:auto
}
.sb-head{
  padding:20px 16px 14px;
  display:flex;align-items:center;gap:10px;
  border-bottom:1px solid rgba(255,255,255,.06)
}
.sb-logo{font-size:17px;font-weight:700;flex:1;color:#fff;letter-spacing:-.3px}
.av{
  cursor:pointer;flex-shrink:0;
  width:32px;height:32px;border-radius:50%;
  background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:600;font-size:13px;overflow:hidden;transition:opacity .15s
}
.av:hover{opacity:.75}
.av img{width:32px;height:32px;border-radius:50%}
.sb-sec{
  padding:16px 16px 6px;
  font-size:11px;font-weight:600;
  text-transform:uppercase;letter-spacing:.8px;color:var(--smuted)
}
.pitem{
  display:flex;align-items:center;gap:9px;
  padding:9px 16px;cursor:pointer;
  transition:background .12s;font-size:14px;position:relative;
  flex-wrap:wrap;
  /* Long-press starts drag/reveal — never the OS text-selection callout */
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none
}
.proj-progress{
  height:4px;background:rgba(255,255,255,.12);
  border-radius:2px;overflow:hidden;
  transition:background .2s;flex:1
}
.proj-progress-fill{
  height:100%;border-radius:2px;position:relative;
  background:linear-gradient(90deg,var(--green),#30D158);
  transition:width .55s ease
}
.proj-progress-fill.just-completed::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);
  animation:pbarSweep .9s ease-out;
}
@keyframes pbarSweep{
  0%{transform:translateX(-100%)}
  100%{transform:translateX(100%)}
}
.top-task-card{
  background:linear-gradient(135deg,#1C1C1E,#2C2C2E);
  color:#fff;border-radius:var(--r);padding:13px 16px;
  margin-bottom:8px;cursor:pointer;
  display:flex;align-items:center;gap:10px;
  animation:sIn .25s ease;flex-shrink:0;
  border:1px solid rgba(255,255,255,.07)
}
.top-task-card:hover{border-color:rgba(255,213,0,.3);box-shadow:0 4px 18px rgba(0,0,0,.15)}
.top-task-label{font-size:11px;font-weight:700;color:#FFD60A;flex-shrink:0;letter-spacing:.2px}
.top-task-name{flex:1;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-empty-today{
  text-align:center;padding:32px 16px;
  color:var(--muted);font-size:13px;font-weight:500;
  animation:sIn .4s ease
}
.pitem:hover{background:rgba(255,255,255,.06)}
.pitem.active{background:rgba(255,255,255,.1)}
.pitem.active .pname{color:#fff;font-weight:500}
.pdot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.pname{flex:1;white-space:normal;word-break:break-word;color:var(--stext)}
.proj-member-avs{display:inline-flex;flex-direction:row-reverse;align-items:center;flex-shrink:0;margin-right:4px}
.proj-member-avs .asn-av{width:18px;height:18px;font-size:8px;border:1.5px solid #1c1c1e;flex-shrink:0}
.proj-member-avs .asn-av+.asn-av{margin-left:-6px}
.pcnt{
  background:rgba(255,255,255,.1);border-radius:20px;
  padding:1px 8px;font-size:11px;color:rgba(235,235,245,.65);flex-shrink:0
}
.pitem.active .pcnt{background:rgba(255,255,255,.16);color:rgba(235,235,245,.9)}
.pbtn{background:none;border:none;cursor:pointer;padding:4px 9px;font-size:12px;border-radius:7px;flex-shrink:0;transition:background .12s}
.pbtn.share{color:rgba(235,235,245,.6)}
.pbtn.share:hover{color:var(--accent);background:rgba(0,122,255,.12)}
.pbtn.del-proj-btn{color:rgba(235,235,245,.6)}
.pbtn.del-proj-btn:hover{color:#FF3B30;background:rgba(255,59,48,.12)}
.proj-actions{
  display:none;flex:0 0 100%;
  padding:2px 12px 6px;gap:4px;align-items:center;
}
.pitem:hover .proj-actions{display:flex}
.pbtn.default-btn{color:rgba(235,235,245,.6)}
.pbtn.default-btn:hover{color:#FFD60A;background:rgba(255,214,10,.1)}
.pbtn.default-btn.is-default{color:#FFD60A}
.proj-default-star{font-size:10px;flex-shrink:0;opacity:.7;pointer-events:none}
.proj-handle{
  color:rgba(235,235,245,.3);cursor:grab;padding:0;font-size:13px;flex-shrink:0;
  user-select:none;-webkit-user-select:none;touch-action:none;letter-spacing:1px;
  display:none
}
.pitem[data-pid]:hover .proj-handle{display:block}
.pitem[data-pid].dragging{opacity:.3;background:rgba(255,255,255,.04)!important}
.pitem[data-pid].drop-above{box-shadow:inset 0 2px 0 var(--accent)}
.pitem[data-pid].drop-below{box-shadow:inset 0 -2px 0 var(--accent)}
.pitem[data-pid].lp-active{background:rgba(255,59,48,.09)!important;outline:1px solid rgba(255,59,48,.3);border-radius:8px}
#projTrash{
  display:none;margin:4px 12px 6px;
  border:2px dashed rgba(255,59,48,.45);border-radius:12px;
  padding:13px 8px;text-align:center;
  color:rgba(255,59,48,.65);font-size:12px;cursor:default;
  transition:all .2s;background:rgba(255,59,48,.05);
  animation:trash-in .22s ease;user-select:none
}
#projTrash.visible{display:block}
#projTrash.drag-over{
  border-color:var(--red);background:rgba(255,59,48,.18);
  color:var(--red);transform:scale(1.03)
}
#projTrash .trash-icon{font-size:22px;display:block;margin-bottom:4px;line-height:1}
@keyframes trash-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
/* Deleted projects in settings */
.del-proj-row{
  display:flex;align-items:center;gap:8px;
  padding:8px 0;border-bottom:1px solid var(--border)
}
.del-proj-row:last-child{border-bottom:none}
.del-proj-name{flex:1;font-size:14px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.del-proj-date{font-size:11px;color:var(--muted);flex-shrink:0}
.del-proj-restore{
  background:none;border:1px solid var(--border2);border-radius:8px;
  color:var(--accent);font-size:12px;padding:4px 10px;cursor:pointer;
  font-family:inherit;flex-shrink:0;transition:all .15s
}
.del-proj-restore:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.add-proj-btn{
  margin:6px 12px;
  background:none;border:1px dashed rgba(255,255,255,.14);
  color:rgba(235,235,245,.45);border-radius:10px;
  padding:8px 12px;cursor:pointer;font-size:13px;
  display:flex;align-items:center;gap:6px;
  width:calc(100% - 24px);font-family:inherit;transition:all .15s
}
.add-proj-btn:hover{border-color:var(--accent);color:var(--accent)}
.sb-bot{
  margin-top:auto;padding:10px 12px 16px;
  border-top:1px solid rgba(255,255,255,.06);
  display:flex;flex-direction:column;gap:2px
}
.sb-btn{
  width:100%;background:none;border:none;
  color:rgba(235,235,245,.62);font-size:14px;
  cursor:pointer;padding:9px 12px;border-radius:10px;
  text-align:right;display:flex;align-items:center;gap:10px;
  font-family:inherit;transition:all .15s
}
.sb-btn:hover{background:rgba(255,255,255,.07);color:rgba(235,235,245,.9)}
.sb-btn.active{color:#fff;background:rgba(255,255,255,.09)}
.sb-btn-icon{font-size:15px;flex-shrink:0;width:20px;text-align:center}

/* ── MAIN AREA ────────────────────────────────────────────── */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden}
.topbar{
  background:var(--card);border-bottom:1px solid var(--border);
  padding:14px 24px;display:flex;align-items:center;gap:12px;flex-shrink:0
}
.topbar-mid{flex:1;min-width:0}
.topbar-t{font-size:20px;font-weight:700;letter-spacing:-.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar-s{font-size:13px;color:var(--muted);margin-top:1px}
.topbar-opts{display:flex;align-items:center;gap:16px}
.topbar-opts label{
  display:flex;align-items:center;gap:7px;
  font-size:13px;color:var(--muted);cursor:pointer;user-select:none
}
/* iOS-style toggle */
.ios-toggle{
  -webkit-appearance:none;appearance:none;
  width:36px;height:22px;background:#E5E5EA;border-radius:11px;
  cursor:pointer;position:relative;transition:background .2s;
  flex-shrink:0;display:inline-block;vertical-align:middle;outline:none
}
.ios-toggle:checked{background:var(--accent)}
.ios-toggle::before{
  content:'';position:absolute;
  width:18px;height:18px;background:#fff;border-radius:50%;
  top:2px;left:2px;transition:transform .2s;
  box-shadow:0 1px 3px rgba(0,0,0,.18)
}
.ios-toggle:checked::before{transform:translateX(14px)}

.add-form{
  background:var(--card);border-bottom:1px solid var(--border);
  padding:12px 24px;display:flex;gap:8px;align-items:center;
  flex-shrink:0;flex-wrap:wrap
}
.add-form input[type=text]{
  flex:1;min-width:180px;padding:10px 14px;
  background:#F2F2F7;border:1.5px solid transparent;
  border-radius:10px;font-size:14px;outline:none;font-family:inherit;
  color:var(--text);transition:all .2s
}
.add-form input[type=text]:focus{background:#fff;border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,122,255,.09)}
.dsel,.psel{
  padding:10px 12px;background:#F2F2F7;border:1.5px solid transparent;
  border-radius:10px;font-size:14px;outline:none;cursor:pointer;
  font-family:inherit;color:var(--text);transition:all .2s
}
.dsel{padding:8px 2px;font-size:12px;min-width:0;width:44px;text-align:center}
.dsel:focus,.psel:focus{background:#fff;border-color:var(--accent)}
.ddl-add-input{
  padding:8px 8px;background:#F2F2F7;border:1.5px solid transparent;
  border-radius:10px;font-size:12px;min-width:0;width:118px;text-align:center;
  outline:none;cursor:pointer;font-family:inherit;color:var(--text);transition:all .2s
}
.ddl-add-input:focus{background:#fff;border-color:var(--accent)}
.abtn{
  background:var(--accent);color:#fff;border:none;
  padding:10px 20px;border-radius:10px;font-size:14px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:all .15s
}
.abtn:hover{background:#0066DD}
.abtn:active{transform:scale(.97)}

/* ── VOICE BUTTON ─────────────────────────────────────────── */
.voice-btn{
  flex-shrink:0;width:36px;height:36px;border-radius:50%;border:1.5px solid var(--border);
  background:none;cursor:pointer;font-size:16px;display:flex;align-items:center;
  justify-content:center;transition:all .2s;color:var(--muted);padding:0;
}
.voice-btn:hover{border-color:var(--accent);color:var(--accent)}
.mentor-btn{color:#C99700;border-color:rgba(201,151,0,.4)}
.mentor-btn:hover{color:#fff;background:#FFB800;border-color:#FFB800}
.mentor-btn:disabled{opacity:.6;cursor:default}
body.dark .mentor-btn{color:#FFD60A;border-color:rgba(255,214,10,.35)}
.voice-btn.recording{
  background:#FF3B30;border-color:#FF3B30;color:#fff;
  animation:mic-pulse 1s ease-in-out infinite;
}
@keyframes mic-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,59,48,.4)}
  50%{box-shadow:0 0 0 7px rgba(255,59,48,0)}
}

/* ── TASK CARDS ───────────────────────────────────────────── */
.task-area{flex:1;overflow-y:auto;padding:20px 24px}
.tlist{display:flex;flex-direction:column;gap:8px;min-height:40px}
.tcard{
  border-radius:var(--r);
  box-shadow:var(--sh);border:1px solid var(--border);
  transition:box-shadow .2s;
  cursor:grab;animation:sIn .2s ease;
  position:relative;overflow:hidden
}
.tcard-inner{
  display:flex;align-items:center;gap:10px;
  padding:13px 14px;background:var(--card);
  border-radius:var(--r);position:relative;z-index:1;width:100%
}
.swipe-bg{
  position:absolute;inset:0;direction:ltr;
  display:flex;align-items:center;gap:8px;
  color:#fff;font-size:22px;opacity:0;pointer-events:none;
  z-index:0;border-radius:var(--r)
}
.swipe-bg .sw-label{font-size:14px;font-weight:600}
.swipe-complete{background:var(--green);justify-content:flex-start;padding-left:24px}
.swipe-delete{background:var(--red);justify-content:flex-end;padding-right:24px}
/* Priority stripe — right border (leading edge in RTL) */
.pi-high  { border-right:3px solid #FF3B30 }
.pi-medium{ border-right:3px solid #FF9500 }
.pi-low   { border-right:3px solid #34C759 }
/* Bucket section headers in list view */
.bkt-section-hdr{
  display:flex;align-items:center;gap:7px;
  font-size:11px;font-weight:700;color:var(--muted);
  text-transform:uppercase;letter-spacing:.7px;
  padding:14px 2px 6px;user-select:none
}
.bkt-section-hdr:first-child{padding-top:2px}
.bkt-section-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.bkt-section-cnt{
  background:var(--bg);border-radius:20px;padding:1px 7px;
  font-size:10px;color:var(--muted);font-weight:600
}
/* Completion pop animation */
@keyframes check-done{
  0%  {transform:scale(1);border-color:#D1D1D6;background:#fff}
  45% {transform:scale(1.45);border-color:var(--green);background:var(--green)}
  100%{transform:scale(1);border-color:var(--green);background:var(--green)}
}
.tcheck.pop{animation:check-done .3s ease forwards;pointer-events:none}
.tcheck-svg{opacity:0;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.tcheck-svg path{stroke-dasharray:20;stroke-dashoffset:20}
.tcheck.pop .tcheck-svg{opacity:1}
.tcheck.pop .tcheck-svg path{animation:checkDraw .25s ease-out .1s forwards}
@keyframes checkDraw{to{stroke-dashoffset:0}}
/* Pulsing bolt on top-task-card */
@keyframes pulse-bolt{0%,100%{opacity:1}50%{opacity:.55}}
.top-task-label{animation:pulse-bolt 2.2s ease-in-out infinite}
@keyframes sIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.tcard:hover{box-shadow:0 4px 22px rgba(0,0,0,.1);border-color:rgba(0,122,255,.14)}
.tcard.dragging{opacity:.4}
.tcard.drag-over{border-color:var(--accent);border-style:dashed;box-shadow:0 0 0 2px rgba(0,122,255,.18)}
.tcard.readonly{cursor:default}
.tcheck{
  width:22px;height:22px;border:2px solid #D1D1D6;border-radius:50%;
  cursor:pointer;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  transition:all .15s;background:#fff
}
.tcheck:hover{border-color:var(--green);background:rgba(52,199,89,.08)}
.tcheck.disabled{opacity:.4;cursor:not-allowed;pointer-events:none}
.tbody{flex:1;min-width:0}
.ttitle{
  font-size:15px;font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  outline:none;cursor:text;color:var(--text)
}
.ttitle:focus{white-space:normal;overflow:visible}
.ttitle[contenteditable=false]{cursor:default;color:var(--muted)}
.tmeta{display:flex;gap:6px;margin-top:5px;align-items:center;flex-wrap:wrap}
.dbadge{
  font-size:11px;padding:3px 9px;border-radius:7px;font-weight:500;
  background:transparent;border:1px solid var(--border2);color:var(--muted);
  letter-spacing:.2px;white-space:nowrap
}
.dbadge.clickable{cursor:pointer}
.dbadge.clickable:hover{border-color:rgba(60,60,67,.3);color:var(--text)}
.pbadge{
  font-size:11px;padding:3px 9px;border-radius:7px;font-weight:500;
  border:1px solid var(--border2)!important;background:transparent!important;
  color:var(--text2)!important;letter-spacing:.2px;
  display:inline-flex;align-items:center;gap:5px;white-space:nowrap
}
.pdot{width:6px;height:6px;border-radius:50%;flex-shrink:0;display:inline-block}
.pbadge.clickable{cursor:pointer}
.pbadge.clickable:hover{border-color:rgba(60,60,67,.3)}
.pbadge-none{color:var(--muted)!important}
.role-tag{font-size:11px;padding:3px 8px;border-radius:7px;font-weight:500;border:1px solid var(--border2);background:transparent}
.role-admin{color:var(--accent)}
.role-editor{color:#1A7F3C}
.role-viewer{color:#B86B00}
/* Priority dot — colored circle only */
.prio-dot{
  width:11px;height:11px;border-radius:50%;
  flex-shrink:0;display:inline-block;align-self:center;
  transition:transform .18s
}
.prio-dot.clickable{cursor:pointer}
.prio-dot.clickable:hover{transform:scale(1.5)}
.prio-dot-high{background:#FF3B30}
.prio-dot-medium{background:#FF9500}
.prio-dot-low{background:#34C759}
/* Priority circles in add form */
.prio-pick{
  width:18px;height:18px;border-radius:50%;
  cursor:pointer;flex-shrink:0;
  transition:transform .15s,box-shadow .15s
}
.prio-pick:hover{transform:scale(1.2)}
/* Scheduled time badge */
.sched-badge{
  font-size:11px;padding:3px 9px;border-radius:7px;font-weight:500;
  background:transparent;border:1px solid var(--border2);color:var(--accent);
  letter-spacing:.2px;white-space:nowrap;cursor:pointer;transition:border-color .15s
}
.sched-badge:hover{border-color:rgba(0,122,255,.4)}
.sched-badge-empty{color:var(--muted);border-style:dashed}
.sched-badge-empty:hover{border-color:rgba(60,60,67,.3);color:var(--text)}
/* Assignee */
.asn-badge{
  font-size:11px;padding:2px 8px 2px 4px;border-radius:20px;font-weight:500;
  background:transparent;border:1px solid var(--border2);color:var(--muted);
  white-space:nowrap;overflow:hidden;
  max-width:150px;display:inline-flex;align-items:center;gap:5px;vertical-align:middle;
}
.asn-badge.clickable{cursor:pointer}
.asn-badge.clickable:hover{border-color:rgba(60,60,67,.3);color:var(--text)}
.asn-badge-empty{border-style:dashed;padding:3px 9px;}
/* Avatar circle */
.asn-av{
  border-radius:50%;flex-shrink:0;overflow:hidden;
  border:1.5px solid var(--card);vertical-align:middle;
  display:inline-flex;align-items:center;justify-content:center;
}
img.asn-av{object-fit:cover;display:inline-block;}
/* Overlapping avatar stack */
.asn-stack{display:inline-flex;align-items:center;flex-direction:row-reverse;}
.asn-stack .asn-av{margin-left:-7px;}
.asn-stack .asn-av:first-child{margin-left:0;}
/* Deadline badge */
.ddl-badge{
  font-size:11px;padding:3px 9px;border-radius:7px;font-weight:500;
  background:transparent;border:1px solid var(--border2);color:var(--muted);
  letter-spacing:.2px;white-space:nowrap
}
.ddl-badge.clickable{cursor:pointer}
.ddl-badge.clickable:hover{border-color:rgba(60,60,67,.3);color:var(--text)}
.ddl-badge-empty{border-style:dashed}
.ddl-badge.overdue{color:#FF3B30;border-color:rgba(255,59,48,.4);background:rgba(255,59,48,.08);font-weight:700}
body.dark .ddl-badge.overdue{background:rgba(255,59,48,.14)}
/* Combined dates badge */
.dates-badge{
  font-size:11px;padding:3px 9px;border-radius:7px;font-weight:500;
  background:transparent;border:1px solid var(--border2);color:var(--muted);
  white-space:nowrap;display:inline-flex;align-items:center;gap:4px;cursor:pointer;
  transition:border-color .15s;
}
.dates-badge:hover{border-color:rgba(60,60,67,.3);color:var(--text)}
.dates-empty{border-style:dashed}
.dates-empty:hover{color:var(--text)}
.dates-sched-txt{color:var(--accent)}
.dates-ddl-overdue{color:#FF3B30;font-weight:700}
.dates-dot{color:var(--border2);font-size:10px}
body.dark .dates-badge{border-color:rgba(255,255,255,0.14);}
body.dark .dates-badge:hover{border-color:rgba(255,255,255,0.3);}
body.dark .dates-sched-txt{color:#4DA3FF;}
/* Dates combined popup */
/* ── Dates bottom sheet (mobile) ── */
.dates-sheet-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:3000;opacity:0;transition:opacity .22s;}
.dates-sheet-overlay.open{opacity:1;}
.dates-sheet{position:fixed;bottom:0;left:0;right:0;background:var(--card);border-radius:18px 18px 0 0;z-index:3001;padding:0 0 env(safe-area-inset-bottom,16px);transform:translateY(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);}
.dates-sheet.open{transform:translateY(0);}
.dates-sheet-handle{width:40px;height:4px;background:var(--border2);border-radius:2px;margin:10px auto 0;}
.dates-sheet-title{font-size:15px;font-weight:700;color:var(--text);text-align:center;padding:12px 16px 6px;}
.dates-sheet-body{padding:0 18px 16px;}
.dates-sheet-done{display:block;width:calc(100% - 36px);margin:6px 18px 12px;padding:13px;background:var(--accent);color:#fff;border:none;border-radius:12px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;}
.dates-pop{padding:14px;min-width:250px;max-width:92vw;}
.dates-pop-head{font-size:13px;font-weight:700;color:var(--text);margin-bottom:12px;}
.dates-pop-row{margin-bottom:10px;}
.dates-pop-lbl{font-size:11px;font-weight:600;color:var(--muted);display:block;margin-bottom:5px;}
.dates-pop-inp{padding:8px 10px;font-size:13px;width:100%;}
.dates-sched-row{display:flex;gap:6px;}
.dates-sched-row .dates-pop-inp:first-child{flex:1;}
.dates-sched-row .dates-pop-inp:last-child{width:90px;direction:ltr;}
.dates-clr-row{display:flex;gap:6px;margin-top:4px;flex-wrap:wrap;}
.dates-clr-btn{
  font-size:11px;padding:5px 10px;border-radius:7px;
  border:1px solid var(--border2);background:none;
  color:var(--muted);cursor:pointer;font-family:inherit;transition:all .15s;
}
.dates-clr-btn:hover{background:rgba(255,59,48,.08);border-color:rgba(255,59,48,.35);color:var(--red);}
.tnotes{font-size:13px;color:var(--muted);margin-top:3px;outline:none;cursor:text}
.tnotes:empty:before{content:'הוסף הערה...';color:#C7C7CC}
.tnotes:focus{color:var(--text)}
.tnotes[contenteditable=false]{cursor:default}
.notes-link{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .15s;direction:ltr;display:inline-block;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
.notes-link:hover{border-color:var(--accent)}
body.dark .notes-link{color:#4DA3FF}
.tnotes-open-link{
  display:inline-flex;align-items:center;gap:4px;
  margin-top:6px;padding:5px 10px;
  font-size:12px;font-weight:600;
  color:var(--accent);background:rgba(0,122,255,.08);
  border:1px solid rgba(0,122,255,.2);border-radius:8px;
  text-decoration:none;cursor:pointer;width:fit-content;
}
.tnotes-open-link:hover{background:rgba(0,122,255,.14)}
body.dark .tnotes-open-link{color:#4DA3FF;background:rgba(77,163,255,.1);border-color:rgba(77,163,255,.25)}
body.dark .tnotes-open-link:hover{background:rgba(77,163,255,.18)}
.tactions{display:flex;gap:2px;opacity:0;transition:opacity .15s;flex-shrink:0}
.tcard:hover .tactions{opacity:1}
.tacbtn{background:none;border:none;cursor:pointer;padding:5px 7px;border-radius:8px;color:var(--muted);font-size:14px}
.tacbtn:hover{background:var(--bg)}
.tacbtn.del:hover{color:var(--red)}
.tacbtn.repeat-tacbtn{font-size:22px;width:38px;height:38px;padding:0;display:inline-flex;align-items:center;justify-content:center;line-height:1;border:1.5px solid var(--border2)!important;border-radius:50%!important;margin-top:6px;flex-shrink:0}
.tacbtn.repeat-tacbtn.repeat-weekly{color:#30D158;border-color:rgba(48,209,88,.45)!important;animation:repeat-spin 4s linear infinite}
.tacbtn.repeat-tacbtn.repeat-biweekly{color:#0A84FF;border-color:rgba(10,132,255,.45)!important;animation:repeat-spin 4s linear infinite}
.tacbtn.repeat-tacbtn.repeat-monthly{color:#BF5AF2;border-color:rgba(191,90,242,.45)!important;animation:repeat-spin 4s linear infinite}
@keyframes repeat-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.dhandle{color:#C7C7CC;cursor:grab;font-size:16px;padding:2px 4px;flex-shrink:0}

/* ── HISTORY ──────────────────────────────────────────────── */
.hist-sec{margin-top:24px;border-top:1px solid var(--border);padding-top:16px}
.hist-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;cursor:pointer;padding:4px 0}
.hist-head h3{font-size:14px;color:var(--muted);font-weight:600}
.harrow{color:var(--muted);font-size:11px;transition:transform .2s}
.hist-head.open .harrow{transform:rotate(90deg)}
.hlist{display:flex;flex-direction:column;gap:6px}
.hcard{
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--r);padding:11px 14px;
  display:flex;align-items:center;gap:12px;opacity:.72
}
.hcheck{
  width:22px;height:22px;border-radius:50%;
  background:var(--green);color:#fff;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;font-size:12px
}
.hcheck.deleted{background:var(--red)}
.hdel-badge{
  font-size:10px;font-weight:600;padding:2px 7px;border-radius:6px;
  background:rgba(255,59,48,.12);color:var(--red);flex-shrink:0
}
body.dark .hdel-badge{background:rgba(255,69,58,.18);color:#FF6961}
.htitle{flex:1;font-size:14px;text-decoration:line-through;color:var(--muted)}
.hdate{font-size:11px;color:#C7C7CC}
.rbtn{
  background:none;border:1px solid #D1D1D6;color:var(--muted);
  padding:4px 10px;border-radius:8px;cursor:pointer;font-size:11px;font-family:inherit;transition:all .15s
}
.rbtn:hover{border-color:var(--accent);color:var(--accent)}

/* ── PROJECT GROUPS ───────────────────────────────────────── */
.pgroup{margin-bottom:24px}
.pgh{
  display:flex;align-items:center;gap:8px;
  margin-bottom:10px;font-size:13px;font-weight:600;
  color:var(--muted);letter-spacing:.3px
}
.pgd{width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* ── POPOVER PICKERS ──────────────────────────────────────── */
.msel{
  position:fixed;background:var(--card);border-radius:14px;
  box-shadow:0 8px 32px rgba(0,0,0,.15),0 0 0 0.5px rgba(0,0,0,.06);
  z-index:300;overflow-y:auto;overflow-x:hidden;animation:pIn .28s cubic-bezier(.34,1.56,.64,1);min-width:170px;
  max-height:70vh;-webkit-overflow-scrolling:touch
}
@keyframes pIn{0%{opacity:0;transform:scale(.9)}60%{opacity:1;transform:scale(1.015)}100%{opacity:1;transform:scale(1)}}

/* ── FLASH TASK — calm full-screen focus ─────────────────── */
@keyframes flash-in{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@keyframes glow-breathe{
  0%,100%{transform:scale(1);opacity:.45}
  50%{transform:scale(1.2);opacity:.85}
}
@keyframes glow-breathe2{
  0%,100%{transform:scale(1);opacity:.2}
  50%{transform:scale(1.35);opacity:.45}
}
@keyframes ring-breathe{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.045)}
}

#flashOverlay{
  position:fixed;inset:0;z-index:2200;
  background:#03080f;
  animation:flash-in .5s ease;
  display:none;flex-direction:column;align-items:center;
  justify-content:space-between;
  padding-top:max(env(safe-area-inset-top,0px),44px);
  padding-bottom:max(env(safe-area-inset-bottom,0px),40px);
  padding-left:28px;padding-right:28px;
}

/* Task info top */
.flash-top{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  width:100%;max-width:400px;
}
.flash-header{
  font-size:10px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;
  color:rgba(255,255,255,.2);
}
.flash-task-name{
  font-size:24px;font-weight:500;color:rgba(255,255,255,.88);text-align:center;
  line-height:1.35;word-break:break-word;
}
.flash-proj-badge{
  font-size:12px;font-weight:500;padding:3px 12px;border-radius:20px;opacity:.7;
}

/* Center — timer + glows */
.flash-mid{
  position:relative;display:flex;align-items:center;justify-content:center;
  flex:1;
}
.flash-glow-outer{
  position:absolute;width:320px;height:320px;border-radius:50%;
  background:radial-gradient(circle, rgba(80,160,255,.08) 0%, transparent 65%);
  animation:glow-breathe2 6s ease-in-out infinite;pointer-events:none;
}
.flash-glow-inner{
  position:absolute;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle, rgba(100,180,255,.14) 0%, transparent 60%);
  animation:glow-breathe 6s ease-in-out infinite;pointer-events:none;
}
/* Ring wrapper — breathes, does NOT rotate */
.flash-timer-wrap{
  position:relative;width:220px;height:220px;flex-shrink:0;
  animation:ring-breathe 6s ease-in-out infinite;
}
/* SVG rotated so arc starts at top */
.flash-ring{
  width:220px;height:220px;
  display:block;
  transform:rotate(-90deg);
  overflow:visible;
}
.flash-ring-bg{fill:none;stroke:rgba(255,255,255,.06);stroke-width:3}
.flash-ring-fill{
  fill:none;stroke:rgba(130,200,255,.75);stroke-width:3;stroke-linecap:round;
  /* r=90, viewBox 200×200 → circumference = 2π×90 ≈ 565.5 */
  stroke-dasharray:565.5;stroke-dashoffset:0;
  transition:stroke-dashoffset .95s linear, stroke 1.5s ease;
  filter:drop-shadow(0 0 6px rgba(130,200,255,.5));
}
.flash-ring-fill.urgent{
  stroke:rgba(255,160,130,.75);
  filter:drop-shadow(0 0 6px rgba(255,130,100,.45));
}
/* Time sits in its own non-rotated div — always upright */
.flash-time{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:56px;font-weight:200;color:rgba(255,255,255,.85);
  letter-spacing:-3px;font-variant-numeric:tabular-nums;
  pointer-events:none;
}

/* Buttons bottom */
.flash-btns{
  display:flex;flex-direction:column;gap:10px;
  width:100%;max-width:340px;
}
.flash-btn{
  width:100%;padding:17px;border:none;border-radius:16px;
  font-size:16px;font-weight:500;cursor:pointer;font-family:inherit;
  transition:all .2s;
}
.flash-btn.done{
  background:rgba(48,209,88,.15);color:rgba(48,209,88,.9);
  border:1px solid rgba(48,209,88,.2);
}
.flash-btn.done:hover{background:rgba(48,209,88,.22);color:#fff}
.flash-btn.done:active{transform:scale(.98)}
.flash-row{display:flex;gap:10px}
.flash-btn.skip{
  flex:1;background:rgba(255,255,255,.04);color:rgba(235,235,245,.4);
  border:1px solid rgba(255,255,255,.07);font-size:14px;padding:15px;
}
.flash-btn.skip:hover{background:rgba(255,255,255,.08);color:rgba(235,235,245,.7)}
.flash-btn.close{
  flex:0 0 52px;background:none;border:1px solid rgba(255,255,255,.07);
  color:rgba(235,235,245,.25);font-size:18px;padding:15px 0;border-radius:16px;
}
.flash-btn.close:hover{border-color:rgba(255,255,255,.18);color:rgba(235,235,245,.6)}
/* ── ZEN TIMER OVERLAY (mobile stopwatch full-screen) ─────── */
/* Monolith — pure black, giant type, Tesla-minimal */
#zenOverlay{
  position:fixed;inset:0;z-index:2200;
  background:#000;
  display:none;flex-direction:column;align-items:center;justify-content:space-between;
  padding-top:max(env(safe-area-inset-top,0px),44px);
  padding-bottom:max(env(safe-area-inset-bottom,0px),36px);
  padding-left:28px;padding-right:28px;
  animation:flash-in .6s ease;
}
#zenOverlay.open{display:flex}
#zenCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.5}
.zen-top{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%;max-width:420px;position:relative;z-index:1}
.zen-header{font-size:9px;font-weight:600;letter-spacing:6px;color:rgba(255,255,255,.22)}
.zen-name{font-size:30px;font-weight:300;color:rgba(255,255,255,.94);text-align:center;line-height:1.3;word-break:break-word;letter-spacing:-.5px}
.zen-mid{flex:1;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.zen-time{
  font-size:min(110px,26vw);font-weight:100;color:#fff;
  letter-spacing:-5px;font-variant-numeric:tabular-nums;
  animation:zen-breathe 7s ease-in-out infinite;
}
@keyframes zen-breathe{0%,100%{opacity:.82;transform:scale(1)}50%{opacity:1;transform:scale(1.03)}}
.zen-btns{display:flex;flex-direction:column;gap:10px;width:100%;max-width:340px;position:relative;z-index:1}
@keyframes focus-pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,214,10,0)}50%{box-shadow:0 0 0 5px rgba(255,214,10,0.18)}}
#focusBtn.focus-on{background:linear-gradient(135deg,#1C1C1E,#2C2C2E);color:#FFD60A;border-color:#FFD60A;animation:focus-pulse 2.5s ease-in-out infinite}
.mi{padding:11px 16px;cursor:pointer;font-size:14px;color:var(--text);transition:background .1s}
.mi:not(:last-child){border-bottom:1px solid var(--border)}
.mi:hover{background:#F2F2F7}
.mi.s{color:var(--accent);font-weight:600}

/* ── TASK TIMER ───────────────────────────────────────────── */
#taskTimerBar{
  display:none;background:linear-gradient(90deg,#1C1C1E,#2C2C2E);
  border-bottom:1px solid rgba(255,255,255,.07);
  padding:8px 20px;align-items:center;gap:10px;flex-shrink:0;
  animation:sIn .2s ease;
}
#taskTimerBar.active{display:flex}
.ttb-bolt{font-size:16px;animation:pulse-bolt 1.8s ease-in-out infinite;flex-shrink:0}
.ttb-name{flex:1;font-size:13px;font-weight:600;color:#fff;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ttb-elapsed{font-size:15px;font-weight:700;color:#FFD60A;
  font-variant-numeric:tabular-nums;letter-spacing:-.5px;flex-shrink:0}
.ttb-stop{background:none;border:1px solid rgba(255,255,255,.15);border-radius:8px;
  color:rgba(255,255,255,.6);cursor:pointer;padding:4px 10px;font-size:12px;
  font-family:inherit;transition:all .15s;flex-shrink:0}
.ttb-stop:hover{border-color:rgba(255,255,255,.35);color:#fff}
.tcard-inner.timer-active{outline:2px solid rgba(255,214,10,.35);outline-offset:-2px}
.tacbtn.bolt{
  width:40px;height:40px;border-radius:50%;flex-shrink:0;
  background:transparent;border:1.5px solid var(--border2);
  color:var(--muted);padding:0;
  display:flex;align-items:center;justify-content:center;gap:5px;
  transition:all .15s;
}
.tacbtn.bolt:hover{border-color:var(--accent);color:var(--accent);background:rgba(0,122,255,.05)}
.tacbtn.bolt:active{transform:scale(.92)}
.tacbtn.bolt svg{width:16px;height:16px;display:block;flex-shrink:0}
.tacbtn.bolt .ic-pause{display:none}
.tacbtn.bolt .bolt-time{display:none}
.tacbtn.bolt.running{
  width:auto;height:34px;border-radius:17px;padding:0 13px;
  background:#FF9500;border-color:#FF9500;color:#fff;
}
.tacbtn.bolt.running:hover{background:#E68600;border-color:#E68600;color:#fff}
.tacbtn.bolt.running .ic-play{display:none}
.tacbtn.bolt.running .ic-pause{display:block;width:12px;height:12px}
.tacbtn.bolt.running .bolt-time{
  display:block;font-size:13px;font-weight:600;
  font-variant-numeric:tabular-nums;letter-spacing:.3px;line-height:1;
}
body.dark .tacbtn.bolt{border-color:rgba(255,255,255,.18);color:rgba(235,235,245,.55);background:transparent}
body.dark .tacbtn.bolt:hover{border-color:#0A84FF;color:#0A84FF;background:rgba(10,132,255,.08)}
body.dark .tacbtn.bolt.running{background:#FF9500;border-color:#FF9500;color:#fff}
.timed-badge{
  font-size:11px;padding:3px 2px;font-weight:600;letter-spacing:.2px;
  background:transparent;color:#FF9500;flex-shrink:0;white-space:nowrap;
}
body.dark .timed-badge{color:#FF9F0A}
/* Stats row in sidebar */
#timerStats{
  padding:6px 16px 2px;font-size:11px;color:var(--smuted);
  display:none;flex-direction:column;gap:4px;
}
#timerStats.has-data{display:flex}
.pace-insight{font-size:10.5px;line-height:1.5;opacity:.85}

@media(max-width:600px){
  #taskTimerBar{padding:7px 14px;gap:8px}
  .ttb-name{font-size:12px}
}

/* ── EMPTY STATE ──────────────────────────────────────────── */
.empty{text-align:center;padding:60px 20px;color:var(--muted)}
.empty .ei{font-size:52px;margin-bottom:14px;opacity:.4}
.empty .ei-logo{width:64px;height:64px;border-radius:15px;opacity:.55;filter:drop-shadow(0 8px 22px rgba(10,132,255,.2))}
.empty p{font-size:15px}

/* ── MODAL OVERLAY ────────────────────────────────────────── */
.moverlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  z-index:500;align-items:center;justify-content:center
}
.moverlay.open{display:flex}
.mbox{
  background:var(--card);border-radius:20px;
  width:440px;max-height:88vh;
  overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 24px 64px rgba(0,0,0,.26);
  animation:pIn .34s cubic-bezier(.34,1.4,.64,1)
}
.mhead{padding:22px 24px 16px;border-bottom:1px solid var(--border)}
.mhead h2{font-size:18px;font-weight:700;margin-bottom:2px;letter-spacing:-.3px}
.mhead p{font-size:13px;color:var(--muted)}
.mbody{flex:1;overflow-y:auto;padding:18px 24px}
.mfoot{padding:16px 24px;border-top:1px solid var(--border)}

/* Members list in share modal */
.mrow{
  display:flex;align-items:center;gap:10px;
  padding:10px 0;border-bottom:1px solid var(--border)
}
.mrow:last-child{border-bottom:none}
.mav{
  width:36px;height:36px;border-radius:50%;
  background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:600;flex-shrink:0;overflow:hidden
}
.mav img{width:36px;height:36px;border-radius:50%}
.minfo{flex:1;min-width:0}
.memail{font-size:13px;direction:ltr;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mname{font-size:12px;color:var(--muted)}
.role-sel{
  padding:5px 8px;border:1.5px solid var(--border);
  border-radius:8px;font-size:13px;font-family:inherit;
  cursor:pointer;outline:none;background:#F2F2F7;color:var(--text);transition:all .15s
}
.role-sel:focus{border-color:var(--accent);background:#fff}
.mrm{
  background:none;border:none;color:var(--red);cursor:pointer;
  font-size:20px;line-height:1;padding:4px 6px;border-radius:8px;transition:background .15s
}
.mrm:hover{background:rgba(255,59,48,.08)}
.invite-row{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.sinput{
  flex:1;min-width:0;padding:10px 12px;background:#F2F2F7;border:1.5px solid transparent;
  border-radius:10px;font-size:14px;outline:none;direction:ltr;
  font-family:inherit;color:var(--text);transition:all .2s
}
.sinput:focus{background:#fff;border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,122,255,.09)}
.srole{
  padding:10px;background:#F2F2F7;border:1.5px solid transparent;
  border-radius:10px;font-size:13px;font-family:inherit;
  outline:none;cursor:pointer;color:var(--text);transition:all .2s;flex-shrink:0
}
.srole:focus{background:#fff;border-color:var(--accent)}
.sadd{
  background:var(--accent);color:#fff;border:none;
  padding:10px 16px;border-radius:10px;font-weight:600;
  cursor:pointer;font-size:14px;font-family:inherit;white-space:nowrap;transition:all .15s;flex-shrink:0
}
.sadd:hover{background:#0066DD}
.serr{font-size:13px;min-height:18px;margin-top:4px}
.serr.err{color:var(--red)}
body.dark .sinput,body.dark .srole{background:#2C2C2E;color:#fff}
body.dark .sinput::placeholder{color:rgba(235,235,245,.4)}
body.dark .sinput:focus,body.dark .srole:focus{background:#1C1C1E;border-color:#0A84FF;box-shadow:0 0 0 3px rgba(10,132,255,.15)}
body.dark .srole option{background:#2C2C2E;color:#fff}
.serr.ok{color:var(--green)}
.mclose{
  width:100%;background:#F2F2F7;border:none;color:var(--muted);
  cursor:pointer;font-size:14px;font-family:inherit;
  padding:11px;border-radius:10px;transition:all .15s;margin-top:8px
}
.mclose:hover{background:#E5E5EA;color:var(--text)}

/* ── FORM INPUTS (modals) ─────────────────────────────────── */
.f-input{
  width:100%;padding:12px 14px;
  background:#F2F2F7;border:1.5px solid transparent;
  border-radius:10px;font-size:15px;outline:none;
  font-family:inherit;color:var(--text);transition:all .2s
}
.f-input:focus{background:#fff;border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,122,255,.09)}
.f-input::placeholder{color:var(--muted)}
.f-label{font-size:13px;font-weight:500;color:var(--muted);display:block;margin-bottom:6px}
.f-err{font-size:13px;min-height:18px;margin-top:8px}
/* Button styles */
.btn-primary{
  width:100%;padding:13px;background:var(--accent);color:#fff;
  border:none;border-radius:12px;font-size:15px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:all .15s;display:block
}
.btn-primary:hover{background:#0066DD}
.btn-primary:active{transform:scale(.98)}
.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn-danger{
  width:100%;padding:12px;background:rgba(255,59,48,.08);color:var(--red);
  border:none;border-radius:12px;font-size:14px;font-weight:500;
  cursor:pointer;font-family:inherit;transition:all .15s;margin-top:8px;display:block
}
.btn-danger:hover{background:rgba(255,59,48,.14)}
.btn-ghost{
  width:100%;padding:10px;background:none;border:none;
  color:var(--muted);font-size:13px;cursor:pointer;font-family:inherit;
  transition:color .15s;margin-top:4px;display:block
}
.btn-ghost:hover{color:var(--text)}
/* ── WEEKLY REPORT ─────────────────────────────────────────── */
.rep-range{font-size:13px;color:var(--muted);margin-bottom:14px;text-align:center}
.rep-stats{display:flex;gap:10px;margin-bottom:6px}
.rep-stat{flex:1;background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:14px 6px;text-align:center;min-width:0}
.rep-stat .rs-num{font-size:23px;font-weight:800;letter-spacing:-.5px;line-height:1.05;white-space:nowrap}
.rep-stat .rs-lbl{font-size:11px;color:var(--muted);margin-top:6px}
.rep-stat .rs-delta{font-size:10.5px;font-weight:600;margin-top:4px}
.rep-stat .rs-delta.up{color:var(--green)}
.rep-stat .rs-delta.down{color:var(--muted)}
.rep-section-title{font-size:12px;font-weight:600;color:var(--muted);margin:18px 0 6px;letter-spacing:.2px}
.rep-proj-row{display:flex;align-items:center;gap:8px;font-size:14px;padding:5px 0}
.rep-proj-row .rp-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.rep-proj-row .rp-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rep-proj-row .rp-cnt{font-weight:700;color:var(--muted);font-size:13px}
.rep-open{margin-top:16px;padding:12px 14px;background:var(--bg);border-radius:12px;font-size:14px}
.rep-empty{text-align:center;color:var(--muted);font-size:14px;padding:22px 0;line-height:1.5}
.rep-insight{font-size:14px;line-height:1.55;padding:7px 0;border-bottom:1px solid var(--border);color:var(--text2)}
.rep-insight:last-child{border-bottom:none}
.rep-insight b{color:var(--text);font-weight:700}
.rep-trend{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;height:64px;margin:6px 2px 0}
.rep-bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px}
.rep-bar-n{font-size:11px;font-weight:700;color:var(--muted)}
.rep-bar{width:100%;max-width:34px;border-radius:6px 6px 0 0;background:var(--border2)}
.rep-bar.cur{background:var(--accent)}
.rep-trend-verdict{font-size:13px;font-weight:600;color:var(--text2);margin-top:9px}
/* ── CONTACTS (phone book) ─────────────────────────────────── */
.ct-add{display:flex;gap:8px;margin:12px 0 14px}
.ct-add .f-input{flex:1;min-width:0}
.ct-add #ctName{flex:1.3}
.ct-add-btn{width:46px;flex:0 0 46px;padding:0;font-size:24px;line-height:1}
.ct-list{display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow-y:auto}
.ct-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;background:var(--bg);border:1px solid var(--border)}
.ct-info{flex:1;min-width:0;cursor:pointer}
.ct-name{font-size:15px;font-weight:600;word-break:break-word}
.ct-phone{font-size:13px;color:var(--muted);margin-top:1px;word-break:break-all}
.ct-fu-line{font-size:12px;color:var(--accent);margin-top:3px;opacity:.85;word-break:break-word}
.ct-actions{display:flex;gap:6px;flex-shrink:0}
.ct-btn{width:44px;height:44px;border-radius:14px;border:1.5px solid var(--border2);background:var(--card);display:flex;align-items:center;justify-content:center;font-size:19px;cursor:pointer;text-decoration:none;transition:transform .12s,background .15s}
.ct-btn:active{transform:scale(.92)}
.ct-btn.call{background:rgba(0,122,255,.1);border-color:var(--accent)}
.ct-btn.wa{background:rgba(37,211,102,.1);border-color:#25D36655}
.ct-empty{text-align:center;color:var(--muted);font-size:14px;padding:30px 0;line-height:1.6}
body.dark .ct-row{background:#1C1C1E;border-color:rgba(255,255,255,0.06)}
body.dark .ct-btn{background:#262626;border-color:rgba(255,255,255,0.1)}
.ct-shared-tag{font-size:10px;font-weight:700;color:var(--accent);background:rgba(0,122,255,.12);padding:1px 6px;border-radius:6px;vertical-align:middle;margin-right:4px}
#ctSharePanel{background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:14px;margin-bottom:14px}
.ct-sort-bar{display:flex;gap:6px;margin:10px 0 4px}
.ct-sort-btn{flex:1;padding:6px 0;font-size:13px;border:1px solid var(--border2);border-radius:10px;background:var(--card);color:var(--muted);cursor:pointer;font-family:inherit;transition:all .15s}
.ct-sort-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}
body.dark .ct-sort-btn{background:#1C1C1E;border-color:rgba(255,255,255,0.1)}
body.dark .ct-sort-btn.active{background:var(--accent);border-color:var(--accent)}
.ct-share-title{font-size:14px;font-weight:700;margin-bottom:4px}
.ct-share-note{font-size:12px;color:var(--muted);margin-bottom:10px;line-height:1.5}
.ct-share-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.ct-share-chip{display:inline-flex;align-items:center;gap:6px;font-size:13px;background:var(--card);border:1px solid var(--border2);border-radius:20px;padding:4px 6px 4px 12px;direction:ltr}
.ct-share-chip button{border:none;background:rgba(255,59,48,.12);color:var(--red);width:18px;height:18px;border-radius:50%;cursor:pointer;font-size:11px;line-height:1;display:flex;align-items:center;justify-content:center;font-family:inherit}
.ct-share-empty{font-size:13px;color:var(--muted)}
.ct-share-add{display:flex;gap:8px}
.ct-share-add .f-input{flex:1;min-width:0}
body.dark #ctSharePanel{background:#1C1C1E;border-color:rgba(255,255,255,0.06)}
body.dark .ct-share-chip{background:#262626;border-color:rgba(255,255,255,0.1)}
body.dark .rep-stat,body.dark .rep-open{background:#1C1C1E;border-color:rgba(255,255,255,0.06)}
/* ── CONTACT DETAIL / CRM ──────────────────────────────────── */
.ctd-avatar{position:relative;width:68px;height:68px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:600;color:#fff;margin-bottom:8px;letter-spacing:.5px;overflow:hidden}
.ctd-av-img{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;object-fit:cover;opacity:0;transition:opacity .25s}
.ctd-av-img.loaded{opacity:1}
.ctd-action-bar{display:flex;gap:8px;padding:4px 0 14px}
.ctd-action-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:10px 6px;cursor:pointer;text-decoration:none;color:var(--text);font-size:11px;transition:background .15s}
.ctd-action-btn:hover{background:var(--hover,rgba(120,120,128,.08))}
.ctd-action-btn span{font-size:20px}
.ctd-section{padding:12px 0;border-bottom:1px solid var(--border)}
.ctd-section:last-child{border-bottom:none;padding-bottom:4px}
.ctd-section-title{font-size:11px;font-weight:700;color:var(--muted);letter-spacing:.6px;text-transform:uppercase;margin-bottom:10px}
.ctd-details-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.ctd-details-hdr .ctd-section-title{margin-bottom:0}
.ctd-details-save{
  font-size:12px;font-weight:600;padding:4px 13px;border-radius:10px;
  background:rgba(0,122,255,.1);color:var(--accent);border:1px solid rgba(0,122,255,.2);
  cursor:pointer;font-family:inherit;transition:all .2s
}
.ctd-details-save.saved{background:rgba(52,199,89,.12);color:#34C759;border-color:rgba(52,199,89,.3)}
.ctd-details-ta{
  font-size:13px;line-height:1.7;font-family:inherit;
  resize:vertical;min-height:110px;width:100%;box-sizing:border-box;
  letter-spacing:.1px
}
.ctd-details-view{
  font-size:13px;color:var(--text);line-height:1.7;
  white-space:pre-wrap;word-break:break-word;
  background:rgba(0,0,0,.03);border-radius:10px;
  padding:10px 12px;border:1px solid var(--border)
}
.ctd-field{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.ctd-field-label{font-size:12px;color:var(--muted);min-width:56px;flex-shrink:0}
.ctd-field-input{flex:1;border:none;border-bottom:1px solid var(--border);background:transparent;color:var(--text);font-size:14px;padding:3px 0;outline:none;font-family:inherit}
.ctd-field-input:focus{border-bottom-color:var(--accent)}
.ctd-field-input[readonly]{border-bottom-color:transparent;cursor:default}
.ctd-fu-section{background:rgba(0,122,255,.05);border-radius:14px;padding:14px;margin:10px 0;border:1px solid rgba(0,122,255,.15)}
.ctd-fu-due{background:rgba(255,59,48,.05);border-color:rgba(255,59,48,.25)}
.ctd-prop-section{background:rgba(52,199,89,.05);border-radius:14px;padding:14px;margin:10px 0;border:1px solid rgba(52,199,89,.2)}
.ctd-note-item{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}
.ctd-note-item:last-child{border-bottom:none}
.ctd-note-avatar{width:28px;height:28px;border-radius:50%;background:rgba(0,122,255,.1);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--accent);flex-shrink:0;margin-top:2px}
.ctd-note-body{flex:1;min-width:0}
.ctd-note-meta{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:3px}
.ctd-note-author{font-size:12px;font-weight:600;color:var(--text)}
.ctd-note-date{font-size:10px;color:var(--muted)}
.ctd-note-text{font-size:13px;color:var(--text);line-height:1.55;white-space:pre-wrap;word-break:break-word}
.ctd-note-del{font-size:11px;color:var(--red);opacity:.5;background:none;border:none;cursor:pointer;padding:0 2px;line-height:1}
.ctd-note-del:hover{opacity:1}
.ctd-doc-section{margin-top:10px;padding-top:10px;border-top:1px solid rgba(52,199,89,.2)}
.ctd-doc-row{display:flex;align-items:center;gap:8px;margin-bottom:8px;background:rgba(52,199,89,.08);border-radius:10px;padding:8px 10px}
.ctd-doc-link{flex:1;display:flex;align-items:center;gap:7px;font-size:13px;color:var(--accent);text-decoration:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctd-doc-icon{font-size:18px;flex-shrink:0}
.ctd-doc-del{border:none;background:none;color:var(--red);opacity:.6;cursor:pointer;font-size:14px;flex-shrink:0;padding:2px 4px}
.ctd-doc-del:hover{opacity:1}
.ctd-upload-btn{display:inline-flex;align-items:center;gap:6px;font-size:13px;padding:7px 14px;border:1px solid var(--border2);border-radius:10px;background:var(--card);color:var(--text);cursor:pointer;font-family:inherit;transition:background .15s}
.ctd-upload-btn:hover{background:var(--hover,rgba(120,120,128,.08))}
.ctd-upload-hint{font-size:11px;color:var(--muted)}
body.dark .ctd-doc-row{background:rgba(52,199,89,.1)}
body.dark .ctd-upload-btn{background:#1C1C1E;border-color:rgba(255,255,255,.1)}
body.dark .ctd-action-btn{background:#1C1C1E;border-color:rgba(255,255,255,.08)}
body.dark .ctd-action-btn:hover{background:#2C2C2E}
body.dark .ctd-fu-section{background:rgba(0,122,255,.08);border-color:rgba(0,122,255,.2)}
body.dark .ctd-prop-section{background:rgba(52,199,89,.08);border-color:rgba(52,199,89,.2)}
body.dark .ctd-note-avatar{background:rgba(0,122,255,.15)}
/* ── MEETING RECORDER ──────────────────────────────────────── */
#meetOverlay{position:fixed;inset:0;z-index:9997;display:none;flex-direction:column;
  background:radial-gradient(circle at 50% 32%,#1d2738,#0a0e16 70%);color:#fff;
  align-items:center;justify-content:flex-start;padding:0 22px;-webkit-user-select:none;user-select:none}
#meetOverlay.open{display:flex}
.meet-head{margin-top:max(46px,env(safe-area-inset-top));text-align:center;flex-shrink:0}
.meet-status{font-size:13px;letter-spacing:.5px;color:rgba(255,255,255,.55);text-transform:uppercase}
.meet-time{font-size:38px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-1px;margin-top:6px}
.meet-pulse{width:14px;height:14px;border-radius:50%;background:#FF453A;display:inline-block;
  margin-left:9px;vertical-align:middle;box-shadow:0 0 0 0 rgba(255,69,58,.6);animation:meet-pulse 1.6s ease-out infinite}
@keyframes meet-pulse{0%{box-shadow:0 0 0 0 rgba(255,69,58,.55)}70%{box-shadow:0 0 0 16px rgba(255,69,58,0)}100%{box-shadow:0 0 0 0 rgba(255,69,58,0)}}
.meet-paused .meet-pulse{background:#8E8E93;animation:none}
.meet-live{flex:1;width:100%;max-width:560px;overflow-y:auto;margin:22px 0;
  font-size:16px;line-height:1.7;color:rgba(255,255,255,.9);text-align:right;
  -webkit-mask-image:linear-gradient(transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(transparent,#000 8%,#000 92%,transparent)}
.meet-live .ml-interim{color:rgba(255,255,255,.45)}
.meet-live-empty{color:rgba(255,255,255,.4);text-align:center;margin-top:40px;font-size:15px;line-height:1.6}
.meet-btns{flex-shrink:0;width:100%;max-width:420px;padding-bottom:max(30px,env(safe-area-inset-bottom));display:flex;gap:12px}
.meet-btn{flex:1;padding:16px;border-radius:16px;border:none;font-size:16px;font-weight:700;
  cursor:pointer;font-family:inherit;transition:transform .12s,opacity .2s}
.meet-btn:active{transform:scale(.97)}
.meet-btn.stop{background:#fff;color:#0a0e16}
.meet-btn.pause{background:rgba(255,255,255,.14);color:#fff}
.meet-btn.cancel{background:transparent;color:rgba(255,255,255,.5);flex:0 0 auto;padding:16px 18px}
/* Review modal */
.mr-sub{font-size:13px;color:var(--muted);margin-bottom:14px}
.mr-controls{display:flex;gap:8px;margin-bottom:14px}
.mr-controls select{flex:1;min-width:0}
.mr-list{display:flex;flex-direction:column;gap:7px;margin-bottom:6px}
.mr-line{display:flex;align-items:flex-start;gap:10px;padding:11px 13px;border-radius:12px;
  border:1.5px solid var(--border2);background:var(--bg);cursor:pointer;font-size:14.5px;line-height:1.45;
  transition:border-color .15s,background .15s}
.mr-line.on{border-color:var(--accent);background:rgba(0,122,255,.07)}
.mr-check{width:21px;height:21px;border-radius:7px;border:2px solid var(--border2);flex-shrink:0;
  margin-top:1px;display:flex;align-items:center;justify-content:center;font-size:13px;color:#fff;transition:all .15s}
.mr-line.on .mr-check{background:var(--accent);border-color:var(--accent)}
.mr-txt{flex:1;min-width:0;word-break:break-word}
.mr-hint{font-size:11px;font-weight:700;color:var(--orange);background:rgba(255,149,0,.12);
  padding:2px 7px;border-radius:6px;flex-shrink:0;align-self:center}
.mr-empty{text-align:center;color:var(--muted);font-size:14px;padding:26px 0;line-height:1.6}
.mr-transcript-toggle{font-size:12.5px;color:var(--accent);cursor:pointer;text-align:center;margin-top:10px}
body.dark .mr-line{background:#1C1C1E;border-color:rgba(255,255,255,0.08)}
body.dark .mr-line.on{background:rgba(10,132,255,.12);border-color:var(--accent)}
/* ── MENTOR QUOTE — wisdom on completion ───────────────────── */
#mentorQuote{position:fixed;top:max(64px,calc(env(safe-area-inset-top) + 14px));left:50%;
  transform:translateX(-50%) translateY(-18px);z-index:9999;max-width:min(520px,92vw);
  display:flex;align-items:flex-start;gap:14px;padding:18px 24px;border-radius:18px;
  background:rgba(20,20,22,.97);color:#fff;box-shadow:0 16px 50px rgba(0,0,0,.45);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(255,214,10,.25);border-right:4px solid #FFD60A;
  opacity:0;transition:opacity .42s ease,transform .42s cubic-bezier(.2,.9,.3,1.2);
  pointer-events:none;text-align:right}
#mentorQuote.show{opacity:1;transform:translateX(-50%) translateY(0)}
#mentorQuote .mq-mark{color:#FFD60A;font-size:24px;flex-shrink:0;line-height:1.3}
#mentorQuote .mq-text{font-size:17px;font-weight:600;line-height:1.55;letter-spacing:-.2px}
@media(max-width:600px){
  #mentorQuote{padding:16px 18px;max-width:94vw}
  #mentorQuote .mq-mark{font-size:21px}
  #mentorQuote .mq-text{font-size:15.5px;line-height:1.5}
}
/* Color swatches */
.csw{
  width:22px;height:22px;border-radius:50%;cursor:pointer;
  border:2.5px solid transparent;transition:transform .1s,border-color .1s;flex-shrink:0
}
.csw:hover{transform:scale(1.18)}
.csw.sel{border-color:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.22)}
/* Settings section */
.set-section{margin-bottom:20px}
.set-section-label{
  font-size:12px;font-weight:600;color:var(--muted);
  text-transform:uppercase;letter-spacing:.7px;margin-bottom:10px
}
.set-info{
  font-size:14px;color:var(--muted);padding:12px 14px;
  background:#F2F2F7;border-radius:10px;direction:ltr
}
.biz-logo-row{display:flex;align-items:center;gap:14px}
.biz-logo-preview{
  width:56px;height:56px;border-radius:14px;flex-shrink:0;
  border:1.5px dashed var(--border2);background:var(--card);
  display:flex;align-items:center;justify-content:center;overflow:hidden
}
.biz-logo-preview span{font-size:11px;color:var(--muted)}
.biz-logo-preview img{width:100%;height:100%;object-fit:contain}

/* Scrollbar */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-thumb{background:#D1D1D6;border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:#AEAEB2}

/* ── MOBILE ───────────────────────────────────────────────── */
.mob-ham{
  display:none;background:none;border:none;
  color:var(--muted);font-size:22px;cursor:pointer;
  padding:3px 6px;border-radius:8px;line-height:1;flex-shrink:0
}
.mob-ham:hover{background:var(--bg)}
.mob-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.4);backdrop-filter:blur(2px);z-index:390
}
.mob-overlay.open{display:block}
@media(max-width:600px){
  .mob-ham{display:block}
  .sidebar{
    display:flex!important;position:fixed;right:0;top:0;
    bottom:calc(75px + max(16px,env(safe-area-inset-bottom)));
    z-index:400;transform:translateX(105%);
    transition:transform .25s ease;
    box-shadow:-4px 0 24px rgba(0,0,0,.35);
  }
  .sidebar.mob-open{transform:translateX(0)}

  /* Topbar — 3 rows on mobile */
  .topbar{padding:10px 12px;gap:4px 6px;flex-wrap:wrap;align-items:center}
  .topbar-mid{display:contents}
  /* Row 1: ☰ + project name */
  .mob-ham{order:-2;flex-shrink:0}
  .topbar-t{order:-2;flex:1;text-align:center;font-size:17px;
             white-space:normal;overflow:visible;text-overflow:clip}
  /* Row 2: action buttons — uniform grid */
  .topbar-opts{order:-1;width:100%;justify-content:center;gap:8px;flex-wrap:nowrap}
  .tb-btn{width:52px!important;height:52px!important;border-radius:15px!important;font-size:22px!important;}
  .tb-btn-icon{font-size:20px!important;}
  .tb-btn-lbl{font-size:9px!important;}
  #blockBtn.block-on{width:auto!important;min-width:80px!important;padding:0 12px!important;font-size:13px!important;}
  .tb-btn-wa{border-color:rgba(37,211,102,.3)!important;}
  /* Hide groupBy toggle on mobile, show tips button instead */
  #groupByLabel{display:none!important;}
  #tipsBtn{display:inline-flex!important;}
  /* Row 3: subtitle */
  .topbar-s{order:2;flex:0 0 100%;text-align:center;font-size:11px;
            padding-top:6px;border-top:1px solid var(--border);margin-top:4px}
  .plan-label{display:none}

  /* Add form — 2 clean rows:
     Row 1: 🎤  [text input──────────]
     Row 2: 1h  project  ●●●  ✦  [+ הוסף] */
  .add-form{padding:10px 12px;gap:8px;row-gap:8px}
  .voice-btn{order:1;flex-shrink:0;width:44px;height:44px;border-radius:12px;}
  .add-form input[type=text]{order:2;flex:1 0 auto;min-width:calc(100% - 60px);}
  .ddl-add-input{display:none}
  /* Row 2 — right-to-left: + הוסף | ✦ | ●●● | project | 1h */
  .abtn{order:3;flex:1;padding:10px 16px;font-size:15px;font-weight:700;border-radius:12px;min-width:0;}
  .mentor-btn{order:4;flex-shrink:0;width:44px;height:44px;border-radius:12px;}
  [title="דחיפות"]{order:5;flex-shrink:0;}
  .psel{order:6;flex:1;min-width:0;font-size:13px;padding:9px 8px;}
  .dsel{order:7;flex:0 0 48px;width:48px;font-size:12px;padding:9px 2px;}

  /* Task area — compact mobile */
  .task-area{padding:8px 11px}
  .tlist{gap:5px}
  .tcard-inner{padding:9px 11px 9px 13px;gap:6px;align-items:stretch}
  .tmeta{gap:5px 8px;margin-top:4px;flex-wrap:wrap}
  .ttitle{font-size:14px;line-height:1.35;white-space:normal}
  /* Notes: compact on mobile — show subtle "+ הערה" tap target when empty */
  .tnotes{font-size:12px;margin-top:2px;padding:4px 0;min-height:20px}
  .tnotes:empty:before{content:'+ הערה';font-size:11px;color:#888}
  /* Badges: finger-friendly tap height (~28px) */
  .dbadge,.pbadge,.bkt-badge,.sched-badge,.ddl-badge{font-size:11px;padding:6px 10px}
  .gem-task-badge{font-size:11px;padding:3px 7px;}
  #topGems{font-size:12px;}
  .dates-badge{font-size:11px;padding:5px 10px;}
  .asn-badge{font-size:11px;padding:3px 8px 3px 4px;max-width:140px;}
  .asn-badge{font-size:11px;padding:6px 10px;max-width:90px}
  /* Priority dot: visual stays 11px, tap area grows to 31x31 via transparent border */
  .prio-dot{border:10px solid transparent;background-clip:padding-box;box-sizing:content-box}
  /* Action column: just the timer — delete is via swipe-left on mobile */
  .tactions{opacity:1;flex-direction:column;justify-content:center;align-self:stretch;gap:0;padding:1px 0}
  .tacbtn{padding:4px 5px;font-size:13px}
  .tacbtn.del{display:none}
  .tacbtn.bolt{width:44px;height:44px;align-self:flex-end}
  .tacbtn.bolt.running{width:auto;height:36px;border-radius:18px}
  .dhandle{display:none}
  .tcheck{display:none}
  /* Top task card — label+project on row 1, name wraps on row 2 */
  .top-task-card{flex-wrap:wrap;padding:11px 14px;gap:6px}
  .top-task-label{flex:1}
  .top-task-name{flex:1 0 100%;white-space:normal;overflow:visible;text-overflow:clip;font-size:15px;margin-top:1px}

  /* Modals — lifted above the bottom nav so footer buttons breathe */
  .moverlay{padding-bottom:calc(128px + env(safe-area-inset-bottom,0px))}
  .mbox{width:96vw!important;max-width:96vw!important;border-radius:16px;max-height:70vh}

  /* Sidebar: no hover on touch — tapping a project expands its actions with a spring */
  .pitem.active .proj-actions{
    display:flex;
    animation:pa-expand .34s cubic-bezier(.34,1.3,.64,1);
  }
  @keyframes pa-expand{
    from{max-height:0;opacity:0;transform:translateY(-4px)}
    to{max-height:44px;opacity:1;transform:translateY(0)}
  }
  .mhead{padding:16px 16px 12px}
  .mbody{padding:12px 16px}
  .mfoot{padding:12px 16px}

  /* Share modal invite row: email full width, role+button below */
  .invite-row{flex-wrap:wrap}
  .sinput{flex:1 0 100%}
  .srole{flex:1}
  .sadd{flex:1;text-align:center}

  /* Member rows: prevent overflow */
  .mrow{flex-wrap:wrap;gap:8px}
  .minfo{min-width:0;flex:1}
  .memail{font-size:12px}
  .role-sel{font-size:12px;padding:4px 6px}
  .mrm{padding:6px 8px}
}

/* ═══════════════════════════════════════════════
   KANBAN VIEW
═══════════════════════════════════════════════ */
.kanban-wrap{display:none;flex:1;flex-direction:column;overflow:hidden;min-height:0}
.kanban-wrap.open{display:flex}

/* Column tabs bar (mobile only) */
.k-nav{
  background:var(--card);border-bottom:1px solid var(--border);
  padding:10px 14px;flex-shrink:0;display:flex;align-items:center;gap:10px
}
.k-tabs{display:flex;background:#F2F2F7;border-radius:11px;padding:3px;gap:2px;flex:1}
.k-tab{
  flex:1;padding:7px 4px;text-align:center;cursor:pointer;
  font-size:13px;font-weight:500;color:var(--muted);
  border-radius:8px;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:5px;
  border:none;background:none;font-family:inherit
}
.k-tab.active{background:#fff;color:var(--text);font-weight:600;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.k-tab-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* Slider (mobile: snap-scroll; desktop: 3-col flex) */
.k-slider{
  display:flex;flex:1;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;min-height:0
}
.k-slider::-webkit-scrollbar{display:none}

.k-col{
  flex:0 0 100%;scroll-snap-align:start;
  display:flex;flex-direction:column;overflow-y:auto;min-height:0;
  padding:12px 14px 80px;gap:10px
}
@keyframes kDropBounce{
  0%{transform:scale(.93)}
  55%{transform:scale(1.035)}
  80%{transform:scale(.99)}
  100%{transform:scale(1)}
}
.k-drop-bounce{animation:kDropBounce .38s cubic-bezier(.34,1.56,.64,1)}
.k-col-head{
  display:flex;align-items:center;gap:8px;
  font-size:14px;font-weight:700;color:var(--text);
  margin-bottom:4px;flex-shrink:0
}
.k-col-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.k-cnt{
  font-size:12px;font-weight:600;
  background:rgba(60,60,67,.1);color:var(--muted);
  padding:2px 7px;border-radius:20px;margin-right:auto
}
/* Inline add in column */
.k-add-row{
  display:flex;gap:8px;align-items:center;
  background:rgba(120,120,128,.06);border-radius:12px;
  padding:10px 12px;cursor:pointer;margin-top:4px;
  border:1.5px dashed rgba(120,120,128,.2);transition:all .15s;flex-shrink:0
}
.k-add-row:hover{background:rgba(0,122,255,.06);border-color:var(--accent)}
.k-add-row input{
  flex:1;border:none;background:none;font-size:14px;
  font-family:inherit;color:var(--text);outline:none
}
.k-add-row input::placeholder{color:var(--muted)}
.k-add-btn{
  background:var(--accent);color:#fff;border:none;
  border-radius:8px;padding:5px 11px;font-size:13px;
  font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap;transition:all .15s
}
.k-add-btn:hover{background:#0066DD}

/* Move arrows on kanban cards */
.k-arrows{display:flex;align-items:center;gap:4px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}
.k-arr{
  border:1.5px solid var(--border);background:none;color:var(--muted);
  border-radius:8px;padding:5px 10px;font-size:14px;cursor:pointer;
  transition:all .15s;font-family:inherit;line-height:1
}
.k-arr:hover{background:var(--bg);color:var(--text);border-color:rgba(60,60,67,.3)}
.k-arr:active{transform:scale(.92)}
.k-arr-spacer{flex:1}

/* Bucket badge in normal view */
.bkt-badge{
  font-size:11px;padding:3px 9px;border-radius:7px;
  font-weight:500;cursor:pointer;white-space:nowrap;letter-spacing:.2px;
  background:transparent;border:1px solid var(--border2);
  transition:all .15s;flex-shrink:0
}
.bkt-today{color:#FF3B30}
.bkt-tomorrow{color:#FF9500}
.bkt-dream{color:#007AFF}
.bkt-badge:hover{border-color:rgba(60,60,67,.3)}

/* Desktop kanban overrides */
@media(min-width:601px){
  .k-tabs{display:none}
  .k-slider{overflow-x:hidden;gap:10px;padding:12px}
  .k-col{
    flex:1;background:#F6F6F8;border-radius:14px;
    padding:0;overflow-y:auto;min-width:0
  }
  .k-col-head{
    padding:14px 16px 10px;
    position:sticky;top:0;z-index:2;
    background:inherit;border-radius:14px 14px 0 0
  }
  .k-col-body{padding:0 10px 12px;display:flex;flex-direction:column;gap:8px}
  .k-add-row{margin:0 10px 10px}
  /* Desktop DnD hover */
  .k-col.drag-over{outline:2px solid var(--accent);outline-offset:-2px}
}

/* ══════════════════════════════════════════════
   ERP SIDEBAR BUTTON
══════════════════════════════════════════════ */
.erp-pill{
  display:inline-flex;align-items:center;gap:5px;
  padding:5px 13px;border-radius:20px;font-size:13px;font-weight:600;
  background:rgba(184,150,62,.13);color:var(--accent);
  border:1px solid rgba(184,150,62,.35);
  cursor:pointer;font-family:inherit;letter-spacing:.3px;
  transition:all .18s;white-space:nowrap;flex-shrink:0
}
.erp-pill:hover{background:rgba(184,150,62,.22);border-color:var(--accent);}

/* ══════════════════════════════════════════════
   ERP OVERLAY + PANEL (Tesla/Mac style)
══════════════════════════════════════════════ */
.erp-overlay{
  position:fixed;inset:0;z-index:2000;
  background:rgba(0,0,0,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;transition:opacity .25s;
  display:flex;align-items:flex-end;justify-content:center
}
.erp-overlay.open{opacity:1;pointer-events:auto;}
.erp-panel{
  width:100%;max-width:540px;
  max-height:92dvh;
  background:var(--sidebar);
  border-radius:22px 22px 0 0;
  border:1px solid var(--border2);
  border-bottom:none;
  display:flex;flex-direction:column;
  transform:translateY(100%);transition:transform .32s cubic-bezier(.32,1,.44,1);
  overflow:hidden;
}
.erp-overlay.open .erp-panel{transform:translateY(0);}
.erp-hdr{
  display:flex;align-items:center;gap:10px;
  padding:16px 18px 12px;
  border-bottom:1px solid var(--border2);flex-shrink:0
}
.erp-title{flex:1;font-size:18px;font-weight:700;color:var(--accent);letter-spacing:.4px}
.erp-close{
  width:30px;height:30px;border-radius:50%;border:none;
  background:rgba(120,120,128,.15);color:var(--text);font-size:14px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0
}
.erp-close:hover{background:rgba(120,120,128,.28);}
.erp-3tabs{display:flex;border-bottom:1px solid var(--border2);flex-shrink:0;background:rgba(0,0,0,.1)}
.erp-3tab{
  flex:1;padding:13px 0;font-size:13px;font-weight:600;
  color:var(--muted);background:none;border:none;
  border-bottom:2px solid transparent;cursor:pointer;
  font-family:inherit;letter-spacing:.2px;transition:color .2s,border-color .2s
}
.erp-3tab.active{color:var(--accent);border-bottom-color:var(--accent);}
.erp-new-row{padding:4px 0 6px;flex-shrink:0}
.erp-new-fab{
  width:100%;padding:13px 0;border-radius:14px;
  background:var(--accent);color:#fff;border:none;
  font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;
  letter-spacing:.2px;transition:opacity .15s
}
.erp-new-fab:hover{opacity:.86;}
.erp-search-wrap{padding:10px 16px 0;flex-shrink:0}
.erp-search{
  width:100%;box-sizing:border-box;
  padding:9px 14px;border-radius:12px;font-size:14px;
  background:var(--card);border:1px solid var(--border2);
  color:var(--text);font-family:inherit;
  outline:none;
}
.erp-search:focus{border-color:var(--accent);}
.erp-list{flex:1;overflow-y:auto;padding:8px 12px 24px;display:flex;flex-direction:column;gap:0}
.erp-empty{text-align:center;padding:40px 20px;color:var(--muted);font-size:15px}
.erp-date-hdr{font-size:13px;font-weight:700;color:var(--accent);padding:12px 2px 5px;letter-spacing:.2px}
.erp-card{
  background:var(--card);border-radius:16px;padding:14px 14px 10px;
  border:1px solid var(--border2);cursor:pointer;
  transition:all .15s;margin-bottom:10px
}
.erp-card:hover{border-color:rgba(184,150,62,.4);transform:translateY(-1px);}
.erp-card:active{transform:translateY(0);}
.erp-card-top{display:flex;align-items:center;gap:11px;margin-bottom:8px}
.erp-av{
  width:44px;height:44px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:700;color:#fff;
  position:relative;overflow:hidden
}
.erp-card-info{flex:1;min-width:0}
.erp-card-name{font-size:15px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.erp-card-sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.erp-status-pill{
  padding:4px 11px;border-radius:14px;
  font-size:11px;font-weight:700;color:#fff;
  white-space:nowrap;flex-shrink:0;letter-spacing:.2px
}
.erp-time{font-size:11px;color:var(--muted)}
.erp-card-event{font-size:12px;color:var(--accent);font-weight:600;margin:2px 0 6px}
.erp-card-note{
  font-size:12px;color:var(--muted);line-height:1.5;
  padding:7px 10px;border-radius:9px;background:rgba(120,120,128,.08);
  margin-bottom:8px;direction:rtl
}
.erp-card-bot{display:flex;align-items:center;justify-content:space-between;gap:8px}
.erp-card-tags{display:flex;gap:5px;flex-wrap:wrap;min-width:0}
.erp-fu-tag{
  font-size:11px;padding:3px 8px;border-radius:8px;
  background:rgba(52,199,89,.12);color:#34C759;border:1px solid rgba(52,199,89,.25)
}
.erp-fu-tag.soon{background:rgba(255,149,0,.12);color:#FF9500;border-color:rgba(255,149,0,.3)}
.erp-fu-tag.overdue{background:rgba(255,59,48,.12);color:#FF3B30;border-color:rgba(255,59,48,.3)}
.erp-pr-tag{
  font-size:11px;padding:3px 8px;border-radius:8px;
  background:rgba(184,150,62,.12);color:var(--accent);border:1px solid rgba(184,150,62,.25)
}
.erp-card-actions{display:flex;gap:6px;flex-shrink:0}
.erp-act{
  font-size:19px;text-decoration:none;
  display:flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:13px;
  background:rgba(120,120,128,.1);transition:background .15s;border:1px solid rgba(120,120,128,.15)
}
.erp-act:hover{background:rgba(120,120,128,.22);}
.erp-act[href^="tel:"]{background:rgba(0,122,255,.1);border-color:rgba(0,122,255,.25);}
.erp-act[href^="https://wa.me"]{background:rgba(37,211,102,.1);border-color:rgba(37,211,102,.3);}
.erp-fu-note{border-left:2px solid rgba(184,150,62,.5);background:rgba(184,150,62,.06)!important;color:var(--accent)!important;margin-bottom:6px}

/* ══════════════════════════════════════════════
   STAGE BAR IN CONTACT DETAIL
══════════════════════════════════════════════ */
.ctd-stage-bar{
  display:flex;gap:5px;overflow-x:auto;padding:4px 0 8px;
  scrollbar-width:none;margin-bottom:4px
}
.ctd-stage-bar::-webkit-scrollbar{display:none}
.ctd-stage-btn{
  flex-shrink:0;padding:5px 12px;border-radius:14px;font-size:12px;font-weight:500;
  border:1px solid var(--border2);background:transparent;color:var(--muted);
  cursor:pointer;font-family:inherit;transition:all .15s
}
.ctd-stage-btn.active{font-weight:700;}
.ctd-stage-btn:not([onclick=""]){cursor:pointer;}
.ctd-stage-btn[onclick=""]{cursor:default;pointer-events:none;}

/* ══════════════════════════════════════════════
   ERP QUOTE BUTTON
══════════════════════════════════════════════ */
.erp-quote-btn{
  padding:6px 13px;border-radius:14px;font-size:12px;font-weight:600;
  background:rgba(52,199,89,.12);color:#34C759;
  border:1px solid rgba(52,199,89,.3);cursor:pointer;font-family:inherit;
  transition:all .15s
}
.erp-quote-btn:hover{background:rgba(52,199,89,.22);}

/* ══════════════════════════════════════════════
   QUOTE TEMPLATE MODAL
══════════════════════════════════════════════ */
.quote-tpl-bar{
  display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;
  scrollbar-width:none;margin-bottom:4px
}
.quote-tpl-bar::-webkit-scrollbar{display:none}
.quote-tpl-btn{
  flex-shrink:0;padding:6px 14px;border-radius:14px;font-size:12px;font-weight:500;
  border:1px solid var(--border2);background:var(--card);color:var(--muted);
  cursor:pointer;font-family:inherit;transition:all .15s
}
.quote-tpl-btn.active{
  background:var(--accent);color:#fff;border-color:var(--accent);font-weight:700
}

@media(min-width:601px){
  .erp-overlay{align-items:center}
  .erp-panel{border-radius:22px;border-bottom:1px solid var(--border2);max-height:85vh;transform:scale(.94);}
  .erp-overlay.open .erp-panel{transform:scale(1);}
}

/* ══════════════════════════════════════════════
   MEETING REVIEW — AI SUMMARY
══════════════════════════════════════════════ */
.mr-ai-summary{
  background:rgba(184,150,62,.08);border:1px solid rgba(184,150,62,.25);
  border-radius:14px;padding:14px 16px;margin-bottom:14px
}
.mr-ai-label{font-size:11px;font-weight:700;color:var(--accent);letter-spacing:.4px;margin-bottom:6px}
.mr-summary-text{font-size:14px;line-height:1.65;color:var(--text);white-space:pre-wrap;direction:rtl}
.mr-sum-acts{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.mr-sum-btn{flex:1;min-width:110px;padding:8px 12px;border-radius:11px;font-size:13px;font-weight:600;border:1.5px solid var(--border2);background:var(--card);color:var(--text);cursor:pointer;font-family:inherit;transition:all .15s}
.mr-sum-btn:hover{border-color:var(--accent);color:var(--accent);}
.mr-sum-btn.wa{border-color:rgba(37,211,102,.4);color:#25D366;background:rgba(37,211,102,.08);}
.mr-sum-btn.wa:hover{background:rgba(37,211,102,.15);}
.mr-ai-loading{
  display:flex;flex-direction:column;align-items:center;gap:14px;
  padding:32px 16px;color:var(--muted);font-size:14px
}
.mr-ai-spinner{
  width:32px;height:32px;border-radius:50%;
  border:3px solid rgba(184,150,62,.2);
  border-top-color:var(--accent);
  animation:spin .8s linear infinite
}
@keyframes spin{to{transform:rotate(360deg)}}
.ai-hint{background:rgba(184,150,62,.15);color:var(--accent);border-radius:6px;padding:1px 6px}

/* ══════════════════════════════════════════════
   MEETING OVERLAY — HISTORY BUTTON
══════════════════════════════════════════════ */
.meet-hist-btn{
  background:rgba(255,255,255,.12);border:none;border-radius:8px;
  color:rgba(255,255,255,.8);font-size:16px;cursor:pointer;
  width:32px;height:32px;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:background .15s
}
.meet-hist-btn:hover{background:rgba(255,255,255,.22);}

/* ══════════════════════════════════════════════
   MEETING HISTORY CARDS
══════════════════════════════════════════════ */
.meet-hist-card{
  background:var(--card);border-radius:16px;padding:14px;
  border:1px solid var(--border2);cursor:pointer;
  transition:border-color .15s;margin-bottom:0
}
.meet-hist-card:hover{border-color:rgba(184,150,62,.4);}
.meet-hist-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.meet-hist-date{font-size:14px;font-weight:600;color:var(--text)}
.meet-hist-meta{display:flex;gap:8px;font-size:12px;color:var(--muted)}
.meet-hist-summary{
  font-size:13px;color:var(--muted);line-height:1.55;direction:rtl;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}
.meet-hist-tasks{margin-top:10px;padding-top:10px;border-top:1px solid var(--border2)}
.meet-hist-task{font-size:13px;color:var(--text);padding:3px 0;direction:rtl}

/* VAT toggle button */
.ctd-vat-btn{
  flex-shrink:0;padding:0 10px;height:38px;border-radius:10px;font-size:11px;font-weight:700;
  border:1.5px solid var(--border);background:none;color:var(--muted);
  cursor:pointer;font-family:inherit;white-space:nowrap;letter-spacing:.2px;
  transition:all .18s;
}
.ctd-vat-btn:hover{border-color:var(--accent);color:var(--accent);}
.ctd-vat-btn.active{
  background:rgba(52,199,89,.12);color:#34C759;border-color:rgba(52,199,89,.4);
}
.ctd-vat-preview{
  font-size:12px;font-weight:600;color:#34C759;
  background:rgba(52,199,89,.08);border-radius:8px;
  padding:5px 10px;margin-bottom:8px;
  border:1px solid rgba(52,199,89,.2);
}
/* Proposal line-items editor */
.ctd-items-list{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.ctd-item-row{
  display:flex;flex-direction:column;gap:7px;padding:10px;
  border:1.5px solid var(--border);border-radius:12px;background:var(--card)
}
.ctd-item-row-top{display:flex;gap:6px;align-items:center}
.ctd-item-row-bottom{display:flex;gap:6px;align-items:center}
.ctd-item-desc{
  flex:1;min-width:0;width:100%;resize:none;overflow:hidden;
  min-height:44px;line-height:1.4;font-family:inherit
}
.ctd-item-qty{flex:1;text-align:center;padding-left:4px;padding-right:4px}
.ctd-item-price{flex:2;text-align:center;padding-left:4px;padding-right:4px}
.ctd-item-qty-lbl,.ctd-item-price-lbl{font-size:11px;color:var(--muted);flex-shrink:0;width:38px}
.ctd-item-del{
  flex-shrink:0;width:32px;height:38px;border-radius:9px;border:1.5px solid var(--border);
  background:none;color:var(--muted);cursor:pointer;font-size:14px;transition:all .15s
}
.ctd-item-del:hover{border-color:var(--red);color:var(--red);background:rgba(255,59,48,.08)}
.ctd-item-add{
  width:100%;padding:9px;border-radius:10px;border:1.5px dashed var(--border2);
  background:none;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;
  font-family:inherit;transition:all .15s;margin-bottom:6px
}
.ctd-item-add:hover{border-color:var(--accent);color:var(--accent)}
.ctd-prop-total{font-size:15px;font-weight:700;color:var(--text)}

/* PDF quote — live preview before sending */
.quote-pdf-preview-wrap{
  width:100%;min-height:160px;border-radius:14px;
  border:1px solid var(--border);background:#fff;
  display:flex;align-items:flex-start;justify-content:center;
  max-height:65vh;overflow-y:auto;overflow-x:hidden
}
.quote-pdf-preview-msg{font-size:13px;color:var(--muted);padding:40px 20px;text-align:center}
.quote-pdf-preview-wrap img{width:100%;height:auto;display:block}

/* ── PDF Quote document — mobile-first, card-based, luxurious ── */
.pq-doc{
  position:fixed;left:-9999px;top:0;width:600px;background:#ffffff;color:#1c1c1e;
  box-sizing:border-box;direction:rtl;overflow:hidden;
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text','Helvetica Neue','Segoe UI',Arial,sans-serif;
}
.pq-band{
  background:linear-gradient(135deg,#1c1c1e,#2c2c2e);
  padding:36px 32px 30px;color:#fff;
}
.pq-biz{display:flex;align-items:center;gap:16px}
.pq-logo{width:60px;height:60px;object-fit:contain;border-radius:12px;background:#fff;flex-shrink:0}
.pq-biz-name{font-size:23px;font-weight:700;color:#fff;letter-spacing:-.2px}
.pq-biz-sub{font-size:13px;color:rgba(255,255,255,.6);margin-top:3px;direction:ltr;text-align:right}
.pq-doc-title{font-size:15px;font-weight:700;color:#5AC8FA;letter-spacing:1px;margin-top:22px}
.pq-doc-date{font-size:13px;color:rgba(255,255,255,.55);margin-top:4px}
.pq-body{padding:28px 32px 8px}
.pq-client{
  font-size:16px;margin-bottom:22px;color:#1c1c1e;padding-bottom:18px;
  border-bottom:1px solid #e5e5ea
}
.pq-client-label{color:#8e8e93;font-size:13px;display:block;margin-bottom:3px}
.pq-client-name{font-weight:700}
.pq-client-phone{color:#8e8e93;direction:ltr;display:inline-block;font-size:14px}
.pq-items{margin-bottom:8px}
.pq-item{padding:16px 0;border-bottom:1px solid #f0f0f2}
.pq-item-desc{font-size:15.5px;font-weight:600;color:#1c1c1e;line-height:1.5;word-break:break-word}
.pq-item-meta{display:flex;justify-content:space-between;align-items:baseline;margin-top:8px}
.pq-item-qty{font-size:13px;color:#8e8e93}
.pq-item-total{font-size:16px;font-weight:700;color:#1c1c1e;direction:ltr}
.pq-totals{margin:20px 0;padding:18px 20px;background:#f7f7f9;border-radius:14px}
.pq-totals-row{display:flex;justify-content:space-between;font-size:14px;padding:5px 0;color:#5a5a5e}
.pq-total-final{
  font-size:21px;font-weight:800;color:#1c1c1e;
  border-top:1.5px solid #d8d8dc;padding-top:12px;margin-top:6px
}
.pq-meta-row{font-size:13.5px;color:#B8860B;font-weight:600;margin-bottom:10px}
.pq-terms{background:#fff8e8;border-radius:12px;padding:14px 18px;margin-bottom:14px}
.pq-terms-label{font-size:11.5px;font-weight:700;color:#a6790a;letter-spacing:.4px;margin-bottom:4px;text-transform:uppercase}
.pq-terms div:last-child{font-size:14px;color:#1c1c1e;line-height:1.5}
.pq-payment{background:#eef6ff;border-radius:12px;padding:14px 18px;margin-bottom:14px}
.pq-payment-label{font-size:11.5px;font-weight:700;color:#0A5FCC;letter-spacing:.4px;margin-bottom:4px;text-transform:uppercase}
.pq-payment div:last-child{font-size:14px;color:#1c1c1e;line-height:1.5;white-space:pre-wrap}
.pq-note{font-size:13px;color:#6e6e73;line-height:1.6;margin-bottom:18px;white-space:pre-wrap}
.pq-signature{font-size:15px;font-weight:600;color:#1c1c1e;margin-bottom:22px}
.pq-footer{
  padding:20px 32px 30px;border-top:1px solid #e5e5ea;
  font-size:12px;color:#8e8e93;line-height:1.8;text-align:center
}
.pq-footer b{color:#5a5a5e}
/* Phone pick button in contact form */
.ct-pick-btn{
  flex-shrink:0;width:38px;height:38px;border-radius:10px;
  background:none;border:1.5px solid var(--border);
  font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:border-color .15s,background .15s;-webkit-tap-highlight-color:transparent;
}
.ct-pick-btn:hover{border-color:var(--accent);background:rgba(0,122,255,.06);}
/* Google contacts picker list */
.gc-list{max-height:50vh;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
.gc-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:11px 12px;border-radius:11px;cursor:pointer;transition:background .15s
}
.gc-row:hover{background:var(--hover,rgba(120,120,128,.08))}
.gc-name{font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gc-phone{font-size:12.5px;color:var(--muted);flex-shrink:0}

/* ── Bookkeeping (הנהלת חשבונות) ── */
.bk-copy-row{display:flex;gap:8px;margin-bottom:14px}
.bk-copy-group{flex:1;display:flex;gap:6px;min-width:0}
.bk-copy-chip{
  flex:1;display:flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 8px;border-radius:11px;border:1.5px solid var(--border2);
  background:var(--card);color:var(--text);font-size:13px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:all .15s;min-width:0;line-height:1.35
}
.bk-copy-chip span{white-space:normal;word-break:break-word;text-align:center}
.bk-copy-chip:hover{border-color:var(--accent);color:var(--accent)}
.bk-edit-btn{
  flex-shrink:0;width:40px;height:40px;border-radius:11px;border:1.5px solid var(--border2);
  background:none;font-size:16px;cursor:pointer;transition:all .15s
}
.bk-edit-btn:hover{border-color:var(--accent);background:rgba(0,122,255,.06)}
.bk-camera-btn{
  width:100%;padding:14px;border-radius:14px;border:none;
  background:var(--accent);color:#fff;font-size:15px;font-weight:700;
  cursor:pointer;font-family:inherit;margin-bottom:14px;transition:opacity .15s
}
.bk-camera-btn:hover{opacity:.9}
.bk-toolbar{
  display:flex;align-items:center;gap:8px;margin-bottom:10px;padding:8px 10px;
  background:rgba(0,122,255,.08);border-radius:11px;border:1px solid rgba(0,122,255,.2)
}
.bk-toolbar span{flex:1;font-size:13px;font-weight:600;color:var(--accent)}
.bk-list{max-height:55vh;overflow-y:auto}
.bk-month-head{
  display:flex;justify-content:space-between;align-items:baseline;
  font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;
  margin:14px 0 8px;padding-bottom:6px;border-bottom:1px solid var(--border)
}
.bk-month-head:first-child{margin-top:0}
.bk-month-total{font-weight:600;text-transform:none;letter-spacing:0}
.bk-row{
  display:flex;flex-direction:column;gap:8px;padding:10px 8px;border-radius:11px;
  transition:background .15s;margin-bottom:4px
}
.bk-row:hover{background:var(--hover,rgba(120,120,128,.08))}
.bk-row.sel{background:rgba(0,122,255,.08)}
.bk-row-top{display:flex;align-items:center;gap:10px}
.bk-row-bottom{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.bk-check{
  flex-shrink:0;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border2);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  font-size:13px;font-weight:700;color:#fff;transition:all .15s
}
.bk-row.sel .bk-check{background:var(--accent);border-color:var(--accent)}
.bk-thumb{
  flex-shrink:0;width:48px;height:48px;border-radius:9px;object-fit:cover;
  cursor:pointer;background:var(--border);border:1px solid var(--border2)
}
.bk-thumb-pdf{
  display:flex;align-items:center;justify-content:center;font-size:20px;
  background:rgba(255,59,48,.08);border-color:rgba(255,59,48,.25)
}
.bk-info{flex:1;min-width:0}
.bk-vendor{font-size:14px;font-weight:600;color:var(--text);white-space:normal;word-break:break-word}
.bk-sub{font-size:12px;color:var(--muted);margin-top:1px;white-space:normal;word-break:break-word}
.bk-paidby{font-size:11.5px;color:var(--accent);margin-top:1px}
.bk-amount-col{flex-shrink:0;font-size:14px;font-weight:700;color:var(--text)}
.bk-flag{
  flex-shrink:0;padding:5px 10px;border-radius:8px;border:1.5px solid var(--border2);
  background:none;font-size:11.5px;font-weight:600;color:var(--muted);cursor:pointer;
  font-family:inherit;transition:all .15s;white-space:nowrap
}
.bk-flag:hover{border-color:var(--accent)}
.bk-flag.on{background:rgba(52,199,89,.12);color:#34C759;border-color:rgba(52,199,89,.4)}
@keyframes flagPulse{
  0%{transform:scale(1)}
  35%{transform:scale(1.16)}
  60%{transform:scale(.96)}
  100%{transform:scale(1)}
}
.bk-flag.flag-pulse{animation:flagPulse .38s cubic-bezier(.34,1.56,.64,1)}
.streak-badge{
  display:none;align-items:center;gap:6px;
  background:rgba(255,149,0,.1);border:1px solid rgba(255,149,0,.25);
  border-radius:12px;padding:6px 12px;margin-bottom:16px;width:fit-content;
}
.streak-badge-fire{font-size:16px}
.streak-badge-num{font-size:15px;font-weight:700;color:#FF9500}
.streak-badge-lbl{font-size:12px;color:var(--muted)}
@keyframes streakBump{
  0%{transform:scale(1) rotate(0)}
  30%{transform:scale(1.3) rotate(-6deg)}
  55%{transform:scale(.95) rotate(4deg)}
  100%{transform:scale(1) rotate(0)}
}
.streak-badge.streak-bump{box-shadow:0 0 0 5px rgba(255,149,0,.16)}
.streak-badge.streak-bump .streak-badge-fire{animation:streakBump .5s cubic-bezier(.34,1.56,.64,1)}
.bk-actions{display:flex;gap:6px;flex-shrink:0;margin-right:auto}
.bk-act{
  width:34px;height:34px;border-radius:9px;border:1.5px solid var(--border2);
  background:none;font-size:15px;cursor:pointer;transition:all .15s;display:flex;
  align-items:center;justify-content:center
}
.bk-act:hover{border-color:var(--accent);background:rgba(0,122,255,.06)}
.bk-add-btns{display:flex;gap:8px;margin-bottom:14px}
.bk-add-btns .bk-camera-btn{margin-bottom:0;width:auto;flex:1}
.bk-upload-btn{background:none;border:1.5px solid var(--accent);color:var(--accent)}
.bk-upload-btn:hover{background:rgba(0,122,255,.06);opacity:1}
.bk-pdf-preview{
  width:100%;padding:50px 0;border-radius:12px;margin-bottom:14px;text-align:center;
  font-size:18px;font-weight:600;color:var(--muted);background:var(--bg);border:1.5px dashed var(--border2)
}

/* ══════════════════════════════════════════════
   ERP SIDEBAR — compact name list
══════════════════════════════════════════════ */
.erp-sb{flex-shrink:0;border-top:1px solid rgba(184,150,62,.22);margin-top:auto;}
@media(max-width:600px){.erp-pill{display:none}}

.erp-sb-handle{
  padding:10px 14px 8px;cursor:pointer;user-select:none;
  -webkit-tap-highlight-color:transparent;transition:background .15s;
}
.erp-sb-handle:hover{background:rgba(255,255,255,.04);}
.erp-sb-handle:active{opacity:.75;}
.erp-sb-hrow{display:flex;align-items:center;gap:8px;padding:2px 0 6px;}
.erp-sb-label{font-size:14px;font-weight:700;color:var(--accent);letter-spacing:.2px;flex-shrink:0;}
.erp-sb-sub{font-size:11px;color:rgba(235,235,245,.6);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.erp-sb-cnt{
  min-width:20px;height:20px;border-radius:10px;
  background:rgba(184,150,62,.18);color:var(--accent);
  font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  padding:0 6px;flex-shrink:0;border:1px solid rgba(184,150,62,.35);
}
.erp-sb-chev{color:rgba(235,235,245,.55);font-size:18px;font-weight:300;flex-shrink:0;}

/* name list */
.erp-sb-names{padding:0 8px 12px;max-height:200px;overflow-y:auto;scrollbar-width:none;}
.erp-sb-names::-webkit-scrollbar{display:none}
.erp-sb-name-row{
  display:flex;align-items:center;gap:8px;
  padding:6px 8px;border-radius:10px;cursor:pointer;
  transition:background .12s;-webkit-tap-highlight-color:transparent;
}
.erp-sb-name-row:hover{background:rgba(255,255,255,.07);}
.erp-sb-name-row:active{background:rgba(255,255,255,.12);}
.erp-sb-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.erp-sb-nname{font-size:13px;color:var(--stext);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;}
.erp-sb-fu-dot{width:6px;height:6px;border-radius:50%;background:#FF453A;flex-shrink:0;}
.erp-sb-row-acts{display:flex;gap:4px;flex-shrink:0;}
.erp-sb-act-sm{
  font-size:15px;text-decoration:none;width:28px;height:28px;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:rgba(255,255,255,.06);transition:background .15s;
}
.erp-sb-act-sm:hover{background:rgba(255,255,255,.12);}
.erp-sb-empty{font-size:12px;color:rgba(235,235,245,.45);padding:8px 10px;}

@media(min-width:601px){.erp-sb{margin-top:0;}}

/* ══════════════════════════════════════════════
   BOTTOM NAV — mobile tab bar
══════════════════════════════════════════════ */
.bot-nav{display:none}
@media(max-width:600px){
  .bot-nav{
    display:flex;position:fixed;bottom:0;left:0;right:0;z-index:2100;
    background:rgba(14,14,16,.93);
    backdrop-filter:saturate(180%) blur(26px);
    -webkit-backdrop-filter:saturate(180%) blur(26px);
    border-top:1px solid rgba(255,255,255,.08);
    padding:8px 8px max(16px,env(safe-area-inset-bottom));
    direction:rtl;gap:6px;
  }

  /* pill element no longer needed — each button is its own pill */
  .bot-nav-pill{display:none;}

  .bot-nav-btn{
    flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;
    background:rgba(255,255,255,.06);
    border:1.5px solid rgba(255,255,255,.07);
    border-radius:16px;
    cursor:pointer;padding:7px 0 6px;
    font-family:inherit;-webkit-tap-highlight-color:transparent;
    transition:background .22s cubic-bezier(.32,1,.44,1),border-color .22s cubic-bezier(.32,1,.44,1);
  }
  .bot-nav-btn.active{
    background:rgba(0,122,255,.16);
    border-color:rgba(0,122,255,.32);
  }
  .bot-nav-ic{
    width:32px;height:32px;
    display:flex;align-items:center;justify-content:center;
    transition:transform .22s cubic-bezier(.32,1,.44,1);
  }
  .bot-nav-ic svg{
    width:26px;height:26px;
    stroke:rgba(235,235,245,.32);stroke-width:1.7;fill:none;
    transition:stroke .2s,stroke-width .2s;
  }
  .bot-nav-lbl{
    font-size:12px;font-weight:700;letter-spacing:.2px;line-height:1;
    color:rgba(235,235,245,.32);
    transition:color .2s;
  }
  .bot-nav-btn.active .bot-nav-ic{transform:scale(1.08);}
  .bot-nav-btn.active .bot-nav-ic svg{stroke:var(--accent);stroke-width:2.3;}
  .bot-nav-btn.active .bot-nav-lbl{color:var(--accent);font-size:12.5px;}
  .bot-nav-btn:active .bot-nav-ic{transform:scale(.88);}

  /* push main content above bottom nav */
  .main{padding-bottom:calc(84px + env(safe-area-inset-bottom));}

  /* ERP panel — full-screen, slides in horizontally from left */
  .erp-overlay{z-index:250;}
  .erp-panel{
    width:100%;max-width:100%;
    height:100dvh;max-height:100dvh;
    border-radius:0;border:none;
    transform:translateX(-100%);
  }
  .erp-overlay.open .erp-panel{transform:translateX(0);}
  .erp-list{flex:1;max-height:none;overflow-y:auto;
    padding-bottom:calc(84px + env(safe-area-inset-bottom));}

  /* hide sidebar ERP section on mobile */
  .erp-sb{display:none;}
}

/* ── WELCOME-BACK / EXIT MODAL ───────────────────────────── */
.wb-overlay{
  position:fixed;inset:0;
  background:rgba(0,0,0,.5);
  display:none;align-items:flex-end;justify-content:center;
  z-index:9800;
  padding:0 0 env(safe-area-inset-bottom);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.wb-overlay.open{display:flex;}
.wb-box{
  background:var(--card);
  border-radius:24px 24px 0 0;
  padding:28px 24px 32px;
  width:100%;max-width:480px;
  text-align:center;
  animation:wbSlideUp .32s cubic-bezier(.22,.61,.36,1);
}
@keyframes wbSlideUp{from{transform:translateY(60px);opacity:0}to{transform:translateY(0);opacity:1}}
.wb-emoji{font-size:52px;display:block;margin-bottom:12px;}
.wb-title{font-size:20px;font-weight:700;color:var(--text);margin-bottom:8px;}
.wb-msg{font-size:14px;color:var(--muted);line-height:1.6;margin-bottom:20px;}
.wb-week-done{
  background:rgba(52,199,89,.1);border-radius:16px;
  padding:14px 16px;margin-bottom:14px;
}
.wb-week-num{font-size:38px;font-weight:700;color:#34C759;}
.wb-week-lbl{font-size:12px;color:var(--muted);margin-top:2px;}
.wb-top3{
  background:var(--bg);border-radius:16px;
  padding:14px 14px 10px;margin-bottom:18px;
  text-align:right;
}
.wb-top3-lbl{font-size:11px;font-weight:600;color:var(--muted);margin-bottom:10px;text-align:center;text-transform:uppercase;letter-spacing:.4px;}
.wb-top3-item{
  display:flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:10px;
  margin-bottom:6px;background:var(--card);
}
.wb-top3-item:last-child{margin-bottom:0;}
.wb-top3-dot{font-size:11px;flex-shrink:0;}
.wb-top3-name{font-size:14px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.wb-push-btn{
  display:block;width:100%;margin-bottom:10px;
  padding:15px;
  background:linear-gradient(135deg,#FF9500 0%,#FF6000 100%);
  color:#fff;border:none;border-radius:16px;
  font-size:15px;font-weight:600;cursor:pointer;
  font-family:inherit;letter-spacing:-.3px;
  box-shadow:0 4px 16px rgba(255,149,0,.35);
}
.wb-go-btn{
  display:block;width:100%;
  padding:14px;
  background:transparent;color:var(--muted);
  border:none;border-radius:16px;
  font-size:15px;font-weight:600;cursor:pointer;
  font-family:inherit;transition:color .2s;
}

/* ── Productivity badges on task cards ─────────────────── */
.badge-2min{
  font-size:10px;font-weight:700;
  background:rgba(255,149,0,.13);color:#FF9500;
  border:1px solid rgba(255,149,0,.35);
  border-radius:5px;padding:1px 5px;white-space:nowrap;cursor:default;
}
.badge-impact{
  font-size:11px;cursor:default;
  background:rgba(255,214,10,.13);
  border:1px solid rgba(255,214,10,.4);
  border-radius:5px;padding:1px 5px;
}
.badge-top3{font-size:12px;cursor:default;}
.repeat-badge{
  font-size:10px;font-weight:700;padding:2px 6px;border-radius:5px;white-space:nowrap;
  background:rgba(52,199,89,.1);color:#30D158;border:1px solid rgba(52,199,89,.3);
  cursor:pointer;transition:background .15s;
}
.repeat-badge:hover{background:rgba(52,199,89,.2);}
body.dark .repeat-badge{background:rgba(48,209,88,.12);border-color:rgba(48,209,88,.35);color:#30D158;}

/* 80/20 gold top-stripe on high-priority today tasks */
.hi-impact{overflow:hidden;}
.hi-impact::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,#FFD60070,#FFD600,#FFD60070,transparent);
}

/* ── Positive tips modal ────────────────────────────────── */
.tip-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.52);
  display:none;align-items:flex-end;justify-content:center;
  z-index:9900;padding:0 0 env(safe-area-inset-bottom);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.tip-overlay.open{display:flex;}
.tip-box{
  background:var(--card);border-radius:28px 28px 0 0;
  padding:28px 24px 32px;width:100%;max-width:480px;
  text-align:center;animation:wbSlideUp .3s cubic-bezier(.22,.61,.36,1);
}
.tip-emoji{font-size:52px;display:block;margin-bottom:14px;}
.tip-title{font-size:19px;font-weight:700;color:var(--text);margin-bottom:10px;}
.tip-body{font-size:15px;color:var(--muted);line-height:1.7;margin-bottom:20px;}
.tip-dots{display:flex;justify-content:center;gap:6px;margin-bottom:22px;}
.tip-dot{width:7px;height:7px;border-radius:50%;background:var(--border);transition:all .2s;}
.tip-dot.active{background:var(--accent);transform:scale(1.3);}
.tip-next{
  display:block;width:100%;margin-bottom:10px;padding:15px;
  background:var(--accent);color:#fff;border:none;border-radius:16px;
  font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;
}
.tip-close{
  display:block;width:100%;padding:12px;
  background:transparent;color:var(--muted);border:none;border-radius:16px;
  font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;
}

/* ── "No" principle friction modal ─────────────────────── */
.no-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.52);
  display:none;align-items:flex-end;justify-content:center;
  z-index:9900;padding:0 0 env(safe-area-inset-bottom);
  backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
}
.no-overlay.open{display:flex;}
.no-box{
  background:var(--card);border-radius:24px 24px 0 0;
  padding:28px 24px 32px;width:100%;max-width:480px;
  text-align:center;animation:wbSlideUp .28s cubic-bezier(.22,.61,.36,1);
}
.no-emoji{font-size:44px;display:block;margin-bottom:10px;}
.no-title{font-size:18px;font-weight:700;color:var(--text);margin-bottom:8px;}
.no-msg{font-size:14px;color:var(--muted);line-height:1.7;margin-bottom:22px;}
.no-msg strong{color:var(--text);}
.no-confirm{
  display:block;width:100%;margin-bottom:10px;padding:15px;
  background:var(--accent);color:#fff;border:none;border-radius:16px;
  font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;
}
.no-cancel{
  display:block;width:100%;padding:14px;
  background:transparent;color:var(--muted);border:none;border-radius:16px;
  font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;
}

/* ── Welcome modal top-3 interactive items ──────────────── */
.wb-top3-item{cursor:pointer;transition:background .15s,transform .1s;}
.wb-top3-item:active{transform:scale(.97);}
.wb-top3-item.committed{background:rgba(52,199,89,.12);}
.wb-top3-check{
  font-size:14px;font-weight:700;color:#34C759;
  margin-right:auto;opacity:0;transition:opacity .18s,transform .18s;
  transform:scale(.6);flex-shrink:0;
}
.wb-top3-item.committed .wb-top3-check{opacity:1;transform:scale(1);}

/* ── Gem system ──────────────────────────────────────────── */
.topbar-gems{
  display:inline-flex;align-items:center;gap:3px;
  background:rgba(10,132,255,.1);border:1px solid rgba(10,132,255,.25);
  border-radius:20px;padding:2px 8px 2px 6px;
  font-size:12px;font-weight:700;color:#0A84FF;
  margin-right:6px;vertical-align:middle;white-space:nowrap;
  transition:background .2s;cursor:default;
}
body.dark .topbar-gems{background:rgba(10,132,255,.15);border-color:rgba(10,132,255,.35);}
body.dark .gem-task-badge{background:rgba(10,132,255,.14);border-color:rgba(10,132,255,.32);}
@keyframes gemBump{
  0%{transform:scale(1);}
  35%{transform:scale(1.45);}
  65%{transform:scale(0.88);}
  85%{transform:scale(1.1);}
  100%{transform:scale(1);}
}
.topbar-gems.gem-bump{animation:gemBump .55s cubic-bezier(.36,.07,.19,.97);}
.gem-task-badge{
  font-size:10px;font-weight:700;
  background:rgba(10,132,255,.08);color:#0A84FF;
  border:1px solid rgba(10,132,255,.22);
  border-radius:5px;padding:1px 5px;white-space:nowrap;cursor:default;
}

/* ── Unified topbar button ──────────────────────────────── */
.tb-btn{
  width:40px;height:40px;border-radius:10px;
  border:1.5px solid var(--border);background:none;
  font-size:20px;cursor:pointer;color:var(--muted);
  font-family:inherit;transition:all .2s;
  padding:0;line-height:1;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
}
.tb-btn:hover{background:var(--bg);}
.tb-btn:active{transform:scale(.93);}
.tb-btn-wa{border-color:rgba(37,211,102,.3);}
.tb-btn-wa:hover{background:rgba(37,211,102,.07);}
#blockBtn:not(.block-on){flex-direction:column;gap:2px;}
.tb-btn-icon{font-size:18px;line-height:1;}
.tb-btn-lbl{font-size:8px;line-height:1;font-weight:700;letter-spacing:.02em;color:var(--muted);}
#blockBtn.block-on{
  background:rgba(88,86,214,.13);border-color:rgba(88,86,214,.45);
  color:#5856D6;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;
  width:auto;padding:0 10px;
}

/* ══════════════════════════════════════════════
   PREMIUM — glass, dynamic island, ring, splash
══════════════════════════════════════════════ */

/* ── Deep glassmorphism ── */
.mbox{
  background:rgba(255,255,255,.8);
  backdrop-filter:saturate(180%) blur(32px);
  -webkit-backdrop-filter:saturate(180%) blur(32px);
  border:1px solid rgba(255,255,255,.55);
}
body.dark .mbox{
  background:rgba(20,20,23,.68);
  border:1px solid rgba(255,255,255,.1);
  backdrop-filter:saturate(180%) blur(32px);
  -webkit-backdrop-filter:saturate(180%) blur(32px);
}
.msel{
  background:rgba(255,255,255,.85);
  backdrop-filter:saturate(180%) blur(26px);
  -webkit-backdrop-filter:saturate(180%) blur(26px);
  border:1px solid rgba(255,255,255,.5);
}
body.dark .msel{
  background:rgba(26,26,30,.78);
  border:1px solid rgba(255,255,255,.1);
}
body.dark .msel .mi:hover{background:rgba(255,255,255,.08)}
.dates-sheet{
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(30px);
  -webkit-backdrop-filter:saturate(180%) blur(30px);
}
body.dark .dates-sheet{background:rgba(22,22,25,.8)}
@media(max-width:600px){
  .sidebar{
    background:rgba(20,20,23,.82);
    backdrop-filter:saturate(180%) blur(30px);
    -webkit-backdrop-filter:saturate(180%) blur(30px);
  }
}

/* ── Spring press feedback ── */
.tcard-inner{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.tcard:active .tcard-inner{transform:scale(.982)}
.abtn,.tb-btn,.bot-nav-btn,.flash-btn{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.abtn:active,.tb-btn:active{transform:scale(.93)}

/* ── Dynamic Island ── */
#dynIsland{
  position:fixed;top:calc(env(safe-area-inset-top,0px) + 6px);left:50%;
  transform:translateX(-50%) translateY(-160%);
  background:#000;color:#fff;
  border-radius:22px;z-index:2150;
  display:flex;align-items:center;gap:8px;
  padding:9px 16px;cursor:pointer;
  font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;
  box-shadow:0 8px 28px rgba(0,0,0,.45),0 0 0 .5px rgba(255,255,255,.12);
  transition:transform .45s cubic-bezier(.34,1.4,.64,1),border-radius .3s,padding .3s;
  -webkit-tap-highlight-color:transparent;
  direction:rtl;max-width:calc(100vw - 24px);
}
#dynIsland.show{transform:translateX(-50%) translateY(0)}
#dynIsland .di-dot{
  width:7px;height:7px;border-radius:50%;background:#30D158;flex-shrink:0;
  animation:di-pulse 1.6s ease-in-out infinite;
}
@keyframes di-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.8)}}
#dynIsland .di-name{
  display:none;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-weight:400;color:rgba(255,255,255,.75);
}
#dynIsland.exp{border-radius:26px;padding:13px 20px}
#dynIsland.exp .di-name{display:block}

/* ── Tesla progress ring (topbar) ── */
.day-ring{width:20px;height:20px;flex-shrink:0;transform:rotate(-90deg)}
.day-ring .ring-bg{fill:none;stroke:rgba(120,120,128,.2);stroke-width:2.5}
.day-ring .ring-fg{
  fill:none;stroke:#30D158;stroke-width:2.5;stroke-linecap:round;
  transition:stroke-dashoffset .9s cubic-bezier(.4,0,.2,1),stroke .3s;
}

/* ── Living splash ── */
#splash{
  position:fixed;inset:0;z-index:10000;
  background:#F2F2F7;
  display:flex;align-items:center;justify-content:center;
  transition:opacity .45s ease,visibility .45s;
}
html.dark #splash,body.dark #splash{background:#000}
#splash.hide{opacity:0;visibility:hidden;pointer-events:none}
.splash-logo{
  width:96px;height:96px;border-radius:22px;
  animation:splash-breathe 1.8s ease-in-out infinite;
  filter:drop-shadow(0 12px 32px rgba(0,122,255,.25));
}
@keyframes splash-breathe{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.1);opacity:1}}
.splash-glow{
  position:absolute;width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(0,122,255,.14) 0%,transparent 68%);
  animation:splash-drift 5s ease-in-out infinite alternate;
}
@keyframes splash-drift{from{transform:translate(-26px,-16px) scale(1)}to{transform:translate(26px,16px) scale(1.18)}}

/* ── OFFLINE — floating glass capsule, island-style ── */
#offlineBanner{
  position:fixed;top:calc(env(safe-area-inset-top,0px) + 8px);left:50%;
  transform:translateX(-50%) translateY(-260%);
  z-index:9500;max-width:calc(100vw - 32px);
  background:rgba(22,22,25,.82);
  backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);
  color:rgba(255,255,255,.85);font-size:12px;font-weight:500;letter-spacing:.1px;
  text-align:center;padding:9px 18px;border-radius:20px;
  border:.5px solid rgba(255,255,255,.14);
  box-shadow:0 8px 28px rgba(0,0,0,.35);
  transition:transform .5s cubic-bezier(.34,1.3,.64,1);
  direction:rtl;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#offlineBanner.show{transform:translateX(-50%) translateY(0)}

/* ── FULL-HEIGHT MODAL (settings) — spreads down to the bottom nav ── */
@media(max-width:600px){
  .mbox.mbox-full{height:100%;max-height:none!important}
  .moverlay:has(.mbox-full){align-items:stretch;padding-top:max(env(safe-area-inset-top,0px),14px)}
}

/* ── SCROLL HINT — fading gradient + chevron at the bottom of scrollable modal bodies ── */
.mbody{position:relative}
.mbody-scroll-hint{
  position:sticky;bottom:-18px;left:0;right:0;height:44px;margin-top:-44px;
  background:linear-gradient(to bottom,transparent,var(--card) 82%);
  display:flex;align-items:flex-end;justify-content:center;
  pointer-events:none;opacity:1;transition:opacity .25s;
}
.mbody-scroll-hint.gone{opacity:0}
.mbody-scroll-hint:after{
  content:'⌄';font-size:17px;line-height:1;color:var(--muted);
  animation:hint-bob 1.6s ease-in-out infinite;
}
@keyframes hint-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}

/* ── LICENSE / TRIAL — quiet glass, Mac-style ── */
.lic-banner{
  margin:0 12px 8px;padding:10px 16px;border-radius:14px;cursor:pointer;
  background:rgba(120,120,128,.08);
  backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);
  border:.5px solid rgba(120,120,128,.22);
  color:var(--muted);font-size:12px;font-weight:500;letter-spacing:.1px;
  text-align:center;direction:rtl;transition:background .2s;
}
.lic-banner:active{background:rgba(120,120,128,.14)}
body.dark .lic-banner{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1);color:rgba(235,235,245,.55)}

/* Lock — monolith: near-black glass, thin type, single accent */
.lic-lock-overlay{
  position:fixed;inset:0;z-index:9600;background:rgba(0,0,0,.62);
  backdrop-filter:saturate(140%) blur(22px);-webkit-backdrop-filter:saturate(140%) blur(22px);
  display:none;align-items:center;justify-content:center;padding:24px;
}
.lic-lock-overlay.open{display:flex;animation:pIn .4s cubic-bezier(.34,1.3,.64,1)}
.lic-lock-box{
  background:rgba(24,24,27,.86);
  backdrop-filter:saturate(180%) blur(30px);-webkit-backdrop-filter:saturate(180%) blur(30px);
  border:.5px solid rgba(255,255,255,.12);
  border-radius:26px;padding:40px 30px 28px;max-width:360px;width:100%;
  text-align:center;box-shadow:0 32px 90px rgba(0,0,0,.5);
}
.lic-lock-box .llk-emoji{font-size:38px;margin-bottom:18px;opacity:.9}
.lic-lock-box h2{
  font-size:21px;font-weight:600;letter-spacing:-.4px;
  margin-bottom:10px;color:#fff;
}
.lic-lock-box p{
  font-size:13.5px;color:rgba(235,235,245,.55);
  line-height:1.7;margin-bottom:6px;font-weight:400;
}
.llk-price{
  font-size:34px;font-weight:200;color:#fff;letter-spacing:-1.5px;
  margin:14px 0 2px;font-variant-numeric:tabular-nums;
}
.llk-price small{font-size:13px;font-weight:400;color:rgba(235,235,245,.45);letter-spacing:0}
.lic-lock-box .llk-cta{
  display:block;width:100%;padding:15px;margin-top:18px;
  border:none;border-radius:15px;
  background:#fff;color:#000;font-size:15px;font-weight:600;letter-spacing:-.2px;
  font-family:inherit;cursor:pointer;
  transition:transform .3s cubic-bezier(.34,1.56,.64,1),opacity .2s;
}
.lic-lock-box .llk-cta:active{transform:scale(.96)}
.llk-note{font-size:11px;color:rgba(235,235,245,.35);margin-top:12px}

/* ── ADMIN PANEL ── */
.adm-stat-row{display:flex;gap:8px;margin-bottom:14px}
.adm-stat{
  flex:1;background:var(--bg);border-radius:12px;padding:12px 8px;text-align:center;
}
.adm-stat b{display:block;font-size:20px;color:var(--text)}
.adm-stat span{font-size:10.5px;color:var(--muted)}
.adm-user{
  display:flex;align-items:center;gap:8px;padding:9px 4px;
  border-bottom:1px solid var(--border);font-size:13px;
}
.adm-user .au-mail{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;color:var(--text);direction:ltr;text-align:right}
.adm-user .au-tag{font-size:10px;font-weight:700;padding:2px 7px;border-radius:5px;white-space:nowrap}
.adm-user .au-tag.on{background:rgba(48,209,88,.13);color:#30D158}
.adm-user .au-tag.trial{background:rgba(255,149,0,.13);color:#FF9500}
.adm-user .au-tag.off{background:rgba(255,69,58,.13);color:#FF453A}
.adm-user button{
  border:1px solid var(--border2);background:none;border-radius:8px;
  padding:4px 10px;font-size:11.5px;font-family:inherit;cursor:pointer;color:var(--accent);
}

/* ── ADMIN — expandable user detail ── */
.adm-user{cursor:pointer;-webkit-tap-highlight-color:transparent}
.adm-det{
  display:none;background:var(--bg);border-radius:12px;
  padding:10px 14px;margin:2px 0 8px;
}
.adm-det.open{display:block;animation:pIn .25s cubic-bezier(.34,1.3,.64,1)}
.adm-det-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:5px 0;font-size:12px;color:var(--muted);
  border-bottom:1px solid var(--border);
}
.adm-det-row:last-of-type{border-bottom:none}
.adm-det-row b{color:var(--text);font-weight:600;font-size:12.5px}
.adm-det-btn{
  display:block;width:100%;margin-top:8px;padding:9px;
  border:1px solid var(--border2);border-radius:10px;background:none;
  color:var(--accent);font-size:12.5px;font-weight:600;font-family:inherit;cursor:pointer;
}

/* ── שדרג אותנו ── */
.about-txt p{font-size:13px;line-height:1.7;color:var(--muted);margin-bottom:12px}
.about-txt b{color:var(--text)}
.wa-cta{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;padding:13px;margin-top:8px;
  border:none;border-radius:13px;cursor:pointer;font-family:inherit;
  background:#25D366;color:#fff;font-size:14px;font-weight:700;
  transition:transform .3s cubic-bezier(.34,1.56,.64,1),filter .15s;
}
.wa-cta:active{transform:scale(.96)}
.wa-cta:hover{filter:brightness(1.06)}
.wa-cta.wa-help{
  background:rgba(37,211,102,.1);color:#1faa52;
  border:1.5px solid rgba(37,211,102,.4);
}
body.dark .wa-cta.wa-help{color:#25D366}

/* about modal — CTAs pinned in the footer, always visible on small screens */
.about-foot{display:flex;flex-direction:column;gap:8px}
.about-foot .wa-cta{margin-top:0}
.about-foot .mclose{margin-top:2px}
@media(max-width:600px){
  #aboutModal .mhead{padding:12px 16px 8px}
  #aboutModal .mhead img{width:44px!important;height:44px!important;margin-bottom:5px!important}
  #aboutModal .mhead h2{font-size:16px}
  .about-txt p{font-size:12.5px;line-height:1.6;margin-bottom:10px}
  .about-foot{padding:10px 14px}
  .about-foot .wa-cta{padding:12px;font-size:13.5px}
}
