.lz-host{display:contents}
  /* Sentinel γραμμή για lazy μέσα σε <tbody> (lazyBoxRows — 02e-lazy).
     Ειδικότητα 0,1,2 ώστε να νικά το `.gate-tbl td` (0,1,1) χωρίς !important. */
  tr.lz-sent-row{height:0}
  tr.lz-sent-row>td{padding:0;border:0;height:0;line-height:0}
  :root{
    --navy:#15243b; --navy-2:#1d3050; --accent:#e8622d; --accent-soft:#fdeee6;
    --bg:#f4f6fa; --card:#ffffff; --border:#e3e8f0; --text:#1c2536; --muted:#66738a;
    --green:#1e9e5a; --green-soft:#e2f5ea; --red:#d64541; --amber:#e09c1a; --amber-soft:#fdf3df; --blue:#2e6fd8; --blue-soft:#e7effc;
    /* Συντελεστής zoom προβολής (04-zoom). ΤΟ 100vh ΔΕΝ ΚΛΙΜΑΚΩΝΕΤΑΙ με το
       body.style.zoom: μένει το ύψος του viewport σε CSS px και ΜΕΤΑ σμικρύνεται,
       οπότε στο 70% ένα height:100vh έφτανε ως το 70% της οθόνης. Ό,τι πρέπει να
       πιάνει ΟΛΟ το ύψος γράφεται calc(100vh / var(--zf,1)). */
    --zf:1;
    --radius:12px; --shadow:0 1px 3px rgba(21,36,59,.08), 0 4px 16px rgba(21,36,59,.06);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  body{font-family:"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);font-size:14px}
  button{font-family:inherit;cursor:pointer}
  input,select,textarea{font-family:inherit;font-size:13px}

  /* ---------- Topbar (χωρίς χρωματιστό header) — ανοιχτόχρωμα toolbars ---------- */
  .toolbar{display:flex;align-items:center;gap:6px;height:46px;background:#e1edff;border:1px solid #c7dbfb;border-radius:14px;padding:5px;box-shadow:0 3px 10px rgba(37,73,150,.14),0 1px 2px rgba(37,73,150,.08)}
  .tb-sep{width:1px;height:22px;background:#b9d0f5;margin:0 3px;flex:none}
  .hdr-ctrl{display:flex;align-items:center;gap:6px;background:transparent;border:none;border-radius:10px;padding:5px 9px}
  .hdr-ctrl label{font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:#6b83a8}
  .hdr-ctrl select{background:transparent;color:#1c2536;border:none;outline:none;font-size:13px;font-weight:600;max-width:170px}
  .hdr-ctrl select option{color:#1c2536}
  .icon-btn{position:relative;width:34px;height:34px;border-radius:9px;border:none;background:transparent;color:#3f5578;font-size:17px;display:grid;place-items:center}
  .icon-btn:hover{background:#cfe0fb}
  .badge{position:absolute;top:1px;right:1px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:#ff0000;color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center;border:2px solid #e1edff}
  #logoutBtn{height:46px;display:inline-flex;align-items:center;background:#e1edff;color:#c0322e;border:1px solid #c7dbfb;border-radius:12px;padding:0 16px;font-weight:600;box-shadow:0 3px 10px rgba(37,73,150,.14),0 1px 2px rgba(37,73,150,.08)}
  #logoutBtn:hover{background:#d3e3fe}
  /* God Mode badge — ορατό μόνο στον ίδιο, δίπλα στο όνομά του */
  .god-badge{display:inline-flex;align-items:center;gap:3px;vertical-align:middle;margin-left:6px;padding:1px 7px 1px 5px;border-radius:999px;font-size:9.5px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:#fff;background:linear-gradient(120deg,#6d28d9,#c026d3 55%,#f59e0b);box-shadow:0 1px 4px rgba(192,38,211,.45);border:1px solid rgba(255,255,255,.35)}
  .god-badge svg{width:10px;height:10px}
  /* ---------- Live search ---------- */
  /* ΠΑΓΙΔΑ flex-wrap: το σπάσιμο γραμμής μετράει το ΜΗ-συρρικνωμένο basis.
     Με basis 480 τα .toolbar/.user-chip έπεφταν σε 2η γραμμή πριν προλάβει
     η αναζήτηση να στενέψει (ίδιο bug με το mobile topbar). basis 0 =>
     μετράει ως μηδέν, γεμίζει με grow, max-width κρατά την παλιά όψη. */
  .search{position:relative;flex:1 1 0%;min-width:120px;max-width:480px}
  .search .sic{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:#98a0ad;pointer-events:none;display:flex}
  .search input{width:100%;height:46px;background:#fff;border:1px solid #ccd4de;border-radius:14px;padding:0 16px 0 44px;color:#1c2536;outline:none;font-size:14px;transition:.15s;box-shadow:0 3px 10px rgba(37,73,150,.14),0 1px 2px rgba(37,73,150,.08)}
  .search input::placeholder{color:#98a0ad}
  .search input:focus{border-color:#4478c4;box-shadow:0 0 0 4px rgba(68,120,196,.16)}
  .search-drop{position:absolute;top:54px;left:0;right:0;min-width:300px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 14px 38px rgba(21,36,59,.25);overflow:hidden;display:none;z-index:95;color:var(--text)}
  .search-drop.open{display:block}
  .sd-h{padding:8px 14px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);background:#fafbfd;border-bottom:1px solid var(--border)}
  .sd-list{max-height:330px;overflow-y:auto}
  .s-res{display:flex;align-items:center;gap:10px;padding:9px 14px;cursor:pointer;border-bottom:1px solid #f2f4f8}
  .s-res:last-child{border-bottom:none}
  .s-res:hover,.s-res.hover{background:var(--accent-soft)}
  .s-res .sn{font-size:13px;font-weight:600}
  .s-res .sd{font-size:11px;color:var(--muted);margin-top:1px}
  .s-res mark{background:var(--amber-soft);color:inherit;border-radius:3px;padding:0 1px}
  .s-res .go{margin-left:auto;color:var(--muted);opacity:.5;font-size:13px}
  .sd-empty{padding:18px;text-align:center;color:var(--muted);font-size:12.5px}
  .s-res.dir{background:linear-gradient(90deg,#f4eeff 0%,#fff 75%)}
  .s-res.dir:hover,.s-res.dir.hover{background:#ece1ff}
  .s-res.dir .avatar{background:#6d3fd4}
  .rrole{color:#6d3fd4;font-weight:700}
  svg.i{vertical-align:-2px;flex:none;display:inline-block}
  .btn svg.i{vertical-align:-2.5px;margin-right:3px}
  .nav-item svg.i{flex:none}
  .ic.task{color:var(--accent)} .ic.note{color:var(--blue)} .ic.rem{color:#b98410} .ic.report{color:var(--green)}
  /* ---------- Spotlight (διπλό Ctrl): overlay με blur, μεγάλο & ευδιάκριτο ---------- */
  .spot-ov{position:fixed;inset:0;z-index:1200;display:none;align-items:flex-start;justify-content:center;
    background:rgba(18,28,48,.42);backdrop-filter:blur(7px) saturate(1.05);-webkit-backdrop-filter:blur(7px) saturate(1.05);padding:12vh 16px 16px}
  .spot-ov.open{display:flex}
  .spot-box{width:min(680px,94vw);max-height:82vh;display:flex;flex-direction:column;background:#fff;border-radius:18px;overflow:hidden;
    box-shadow:0 30px 80px rgba(15,26,48,.5),0 2px 8px rgba(15,26,48,.25);animation:spotIn .14s ease-out}
  @keyframes spotIn{from{opacity:0;transform:translateY(-10px) scale(.985)}to{opacity:1;transform:none}}
  .spot-in{display:flex;align-items:center;gap:12px;padding:15px 18px;border-bottom:1px solid var(--border);flex:none}
  .spot-in .spot-ic{color:#4478c4;display:flex;flex:none}
  .spot-in input{flex:1;min-width:0;border:none;outline:none;font-size:20px;color:#1c2536;background:none}
  .spot-in input::placeholder{color:#98a0ad}
  .spot-esc{flex:none;font-size:10.5px;font-weight:700;color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:2px 7px;text-transform:uppercase;letter-spacing:.5px}
  .spot-body{overflow-y:auto}
  .spot-body .sd-list{max-height:none}
  .spot-tip{padding:22px 18px;text-align:center;color:var(--muted);font-size:12.5px}
  /* ---------- Zoom (προσβασιμότητα / πρεσβυωπία) ---------- */
  .zoom-ctrl{display:flex;align-items:center;background:transparent;border:none;border-radius:10px;overflow:hidden}
  .zoom-ctrl button{border:none;background:none;color:#3f5578;width:30px;height:34px;font-size:17px;font-weight:700;display:grid;place-items:center;border-radius:8px}
  .zoom-ctrl button:hover{background:#cfe0fb}
  .zoom-ctrl .zl{width:auto;min-width:44px;padding:0 6px;font-size:11.5px;font-weight:700;color:#4a6285;border-left:1px solid #b9d0f5;border-right:1px solid #b9d0f5;border-radius:0}
  .user-chip{display:flex;align-items:center;gap:8px;height:46px;background:#e1edff;border:1px solid #c7dbfb;border-radius:14px;padding:0 12px 0 6px;box-shadow:0 3px 10px rgba(37,73,150,.14),0 1px 2px rgba(37,73,150,.08)}
  .avatar{width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:700;flex:none;overflow:hidden}
  .avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
  .user-chip .nm{font-size:12.5px;font-weight:600;line-height:1.15;color:#1c2536}
  .user-chip .rl{font-size:10px;color:#8a94a8}

  /* ---------- Layout ---------- */
  .layout{display:flex;min-height:calc(100vh / var(--zf,1))}
  /* Πλαϊνό μενού full-height (χωρίς header) — μένει σταθερό, λογότυπο πάνω */
  aside{width:240px;flex:none;background:linear-gradient(180deg,#15243b,#182a47);border-right:1px solid #0e1a2c;padding:0;display:flex;flex-direction:column;position:sticky;top:0;height:calc(100vh / var(--zf,1));align-self:flex-start}
  .side-brand{display:flex;align-items:center;gap:9px;padding:16px 14px 12px;flex:none}
  .side-brand .mark{width:36px;height:36px;border-radius:9px;background:#fff;display:grid;place-items:center;padding:3px;box-shadow:0 1px 3px rgba(0,0,0,.3);flex:none}
  .side-brand .mark img{width:100%;height:100%;object-fit:contain;display:block}
  .side-brand .brandtxt{color:#fff;font-weight:700;font-size:15px;line-height:1.1}
  .side-brand small{display:block;font-weight:400;font-size:9.5px;color:#8595ad;letter-spacing:.3px;margin-top:2px}
  /* Badge «Beta» στο τέλος του ονόματος. Flex ώστε να ΜΗΝ πέφτει ποτέ σε δεύτερη
     γραμμή: αν στενέψει ο χώρος, κόβεται το όνομα με «…», όχι το badge. */
  .side-brand .brow{display:flex;align-items:baseline;gap:6px;min-width:0}
  .side-brand .bname{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .side-brand .beta{flex:none;padding:2px 5px 3px;border-radius:999px;
    font-size:8px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;
    line-height:1;color:#fff;background:linear-gradient(135deg,#f0723d,#c4470f);
    box-shadow:0 1px 3px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.28)}
  #sidebar{flex:1;min-height:0;overflow-y:auto;padding:2px 10px 14px}
  .mainwrap{flex:1;min-width:0;display:flex;flex-direction:column}
  .spacer{flex:1}
  #topbar{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;padding:16px 26px 2px}
  .nav-title{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:#7f8ea8;padding:8px 10px 6px}
  .nav-item{display:flex;align-items:center;gap:11px;width:100%;text-align:left;padding:11px 12px;border:none;background:none;border-radius:8px;font-size:15px;color:#dde3ee;line-height:1.25}
  .nav-item svg.i{width:20px;height:20px;flex:none}
  .nav-item:hover{background:rgba(255,255,255,.07)}
  /* χρώμα εικονιδίου ανά module — ίδιο με το banner του περιεχομένου του */
  .nav-item.ni-ann  svg.i{color:#818cf8}
  .nav-item.ni-meet svg.i{color:#a78bfa}
  .nav-item.ni-proj svg.i{color:#4f8ef7}
  .nav-item.ni-cal  svg.i{color:#ef4444}
  .nav-item.ni-note svg.i{color:#7fb0f5}
  .nav-item.ni-todo svg.i{color:#fbbf24}
  .nav-item.ni-rep  svg.i{color:#34d399}
  .nav-item.ni-ct   svg.i{color:#38bdf8}
  .nav-item.ni-doc  svg.i{color:#eab308}
  .nav-item.ni-need svg.i{color:#2dd4bf}
  .nav-item.ni-task svg.i{color:#ff7a3d}
  .nav-item.ni-team svg.i{color:#93c5fd}
  .nav-item.ni-bug  svg.i{color:#e879f9}
  .nav-item.ni-set  svg.i{color:#94a3b8}
  .nav-item.god-nav svg.i{color:#ff5a4d}
  /* ενεργό μενού — έντονο πορτοκαλί, εικονίδιο & κείμενο λευκά */
  .nav-item.active{background:linear-gradient(90deg,#e8622d,#ff7a3d);color:#fff;font-weight:700;box-shadow:0 2px 10px rgba(232,98,45,.45)}
  .nav-item.active svg.i{color:#fff}
  /* badges — ένα έντονο χρώμα */
  .nav-item .cnt{margin-left:auto;font-size:12px;font-weight:700;background:#ff3b47;border-radius:9px;padding:2px 8px;color:#fff}
  .nav-item.active .cnt{background:#fff;color:#e8622d}
  .nav-scroll{max-height:none;overflow:visible}
  .priv-note{margin:14px 8px 0;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);border-radius:9px;padding:9px 11px;font-size:11px;color:#c3cde0;line-height:1.5}
  .priv-note svg{color:#9fb0cc}
  main{flex:1;padding:14px 26px 104px;min-width:0}

  
  /* ---------- Ομαδοποίηση πλαϊνού μενού (God Mode → Μενού, module 47) ----------
     Τρία στυλ: γραμμή / κενό / πλαίσιο. Το ίδιο CSS δουλεύει και στην
     προεπισκόπηση του πάνελ, γιατί χρησιμοποιεί τις ίδιες κλάσεις. */
  .nav-sep{height:1px;margin:9px 10px;background:rgba(255,255,255,.14);border-radius:1px}
  .nav-sep.gap{height:0;background:none;margin:14px 0 0}
  .nav-grp{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);
    border-radius:12px;padding:5px;margin-bottom:9px}
  .nav-grp .nav-item{border-radius:7px}
/* ---------- Calculator ---------- */
  .calc{width:302px;background:linear-gradient(160deg,#1d2637,#131b2a);border-radius:22px;padding:14px 16px 16px;box-shadow:0 24px 60px rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.09)}
  .calc-head{display:flex;align-items:center;color:rgba(255,255,255,.55);font-size:12px;font-weight:700;padding-bottom:2px}
  .calc-head button{margin-left:auto;border:none;background:none;color:rgba(255,255,255,.5);cursor:pointer;display:flex}
  .calc-head button:hover{color:#fff}
  .calc-hist{max-height:62px;overflow-y:auto;margin:2px 0}
  .calc-hist div{font-size:10.5px;color:rgba(255,255,255,.38);text-align:right;padding:1px 5px;cursor:pointer;border-radius:5px;font-variant-numeric:tabular-nums}
  .calc-hist div:hover{color:#fff;background:rgba(255,255,255,.09)}
  .calc-expr{height:18px;font-size:13px;color:rgba(255,255,255,.5);text-align:right;padding-right:6px;font-variant-numeric:tabular-nums}
  .calc-disp{font-size:37px;font-weight:300;color:#fff;text-align:right;padding:0 6px 12px;overflow:hidden;white-space:nowrap;font-variant-numeric:tabular-nums}
  .calc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
  .calc-grid button{height:55px;border:none;border-radius:50%;font-size:20px;font-weight:600;cursor:pointer;background:#33415c;color:#fff;transition:filter .1s,transform .08s}
  .calc-grid button:hover{filter:brightness(1.25)}
  .calc-grid button:active{transform:scale(.93)}
  .calc-grid .fn{background:#9aa4b8;color:#141c2b}
  .calc-grid .op{background:var(--accent);font-size:24px}
  .calc-grid .op.on{background:#fff;color:var(--accent)}
  .calc-grid .zero{grid-column:span 2;border-radius:28px}

  /* ---------- Κειμενογράφος ---------- */
  .wp-ov{position:fixed;inset:0;background:rgba(15,23,40,.45);z-index:98;display:grid;place-items:center;padding:18px;animation:fadeIn .15s}
  .wp{width:min(920px,95vw);height:min(700px,90vh);background:#f2f4f8;border-radius:16px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.4)}
  .wp-title{display:flex;align-items:center;gap:9px;background:linear-gradient(115deg,#7a1f3d,#d63d6e 140%);padding:10px 14px}
  .wp-dot{width:13px;height:13px;border-radius:50%;border:none;cursor:pointer;display:grid;place-items:center;color:transparent;font-size:9px;padding:0}
  .wp-dot.close{background:#ff5f57} .wp-dot.min{background:#febc2e}
  .wp-dot:hover{color:rgba(0,0,0,.6)}
  .wp-title input{flex:1;max-width:340px;margin:0 auto;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:8px;color:#fff;text-align:center;font-size:12.5px;font-weight:700;padding:5px 10px;outline:none}
  .wp-title input:focus{border-color:var(--accent)}
  .wp-tools{display:flex;align-items:center;gap:6px;background:#fff;border-bottom:1px solid var(--border);padding:8px 12px;flex-wrap:wrap}
  .wp-tools select{border:1px solid var(--border);border-radius:8px;padding:6px 9px;font-size:12.5px;outline:none;background:#fff}
  .wp-btn{width:32px;height:32px;border:1px solid transparent;background:none;border-radius:8px;cursor:pointer;color:#3c4761;display:grid;place-items:center;font-size:14px}
  .wp-btn:hover{background:var(--bg)}
  .wp-btn.on{background:var(--accent-soft);color:var(--accent);border-color:#f3c9b2}
  .wp-sep{width:1px;height:22px;background:var(--border);margin:0 4px}
  .wp-color{position:relative;width:34px;height:32px;border-radius:8px;display:grid;place-items:center;cursor:pointer}
  .wp-color:hover{background:var(--bg)}
  .wp-color .a{font-weight:800;font-size:14.5px;line-height:1;color:#3c4761;margin-bottom:5px}
  .wp-color .bar{position:absolute;bottom:5px;left:8px;right:8px;height:4px;border-radius:2px;background:#e8622d}
  .wp-color input{position:absolute;inset:0;opacity:0;cursor:pointer}
  .wp-body{flex:1;overflow:auto;padding:26px 16px;background:linear-gradient(180deg,#e8ebf2,#eef0f6)}
  .wp-pages{display:flex;flex-direction:column;gap:28px;align-items:center;min-width:min-content;width:100%}
  .wp-page{width:794px;height:1123px;flex:none;background:#fff;border-radius:3px;box-shadow:0 3px 18px rgba(21,36,59,.18);padding:76px 72px;outline:none;font-size:14.5px;line-height:1.75;color:#1c2536;overflow:visible;position:relative}
  .wp-page:focus{box-shadow:0 3px 18px rgba(21,36,59,.18),0 0 0 3px rgba(232,98,45,.15)}
  .wp-page::after{content:attr(data-num);position:absolute;bottom:30px;left:50%;transform:translateX(-50%);font-size:10px;color:#aab3c2;pointer-events:none}
  .wp-foot{display:flex;gap:14px;align-items:center;background:#fff;border-top:1px solid var(--border);padding:7px 14px;font-size:11px;color:var(--muted)}
  .dock-item.temp .dock-ic{outline:2.5px solid var(--accent);outline-offset:2px;background:linear-gradient(135deg,#20b2aa,#0e8a84)!important}
  .temp-dot{position:absolute;top:-3px;right:-3px;width:11px;height:11px;border-radius:50%;background:var(--red);border:2px solid #fff;animation:tpulse 1.2s ease-in-out infinite}
  @keyframes tpulse{0%,100%{transform:scale(1)}50%{transform:scale(1.35)}}

  /* ---------- Έγγραφα (Finder-style) ---------- */
  .fd-left{width:230px;flex:none;border-right:1px solid var(--border);background:#fafbfd;display:flex;flex-direction:column;min-height:0}
  .fd-left h6{font-size:10px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);padding:12px 14px 6px}
  .fd-root{display:flex;align-items:center;gap:9px;padding:8px 14px;cursor:pointer;font-size:12.5px;font-weight:600;border-left:3px solid transparent;color:var(--text)}
  .fd-root:hover{background:var(--bg)}
  .fd-root.sel{background:var(--accent-soft);border-left-color:var(--accent);color:#b34a17}
  .fd-root .fico{color:#e9b64c;display:flex}
  .fd-newroot{margin:8px 10px;display:flex;gap:5px}
  .fd-newroot input{flex:1;border:1.5px solid var(--accent);border-radius:8px;padding:6px 8px;font-size:11.5px;outline:none;min-width:0}
  .fd-main{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}
  .fd-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--border);background:#fff}
  .fd-crumb{display:flex;align-items:center;gap:4px;flex-wrap:wrap;font-size:12px;font-weight:600;color:var(--muted)}
  .fd-crumb span{cursor:pointer;padding:3px 7px;border-radius:6px}
  .fd-crumb span:hover{background:var(--bg);color:var(--text)}
  .fd-crumb b{color:var(--text);padding:3px 7px}
  .fd-scroll{flex:1;overflow-y:auto}
  .fd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px;padding:16px}
  .fd-item{text-align:center;cursor:pointer;padding:12px 6px 9px;border-radius:12px;border:1.5px solid transparent;position:relative}
  .fd-item:hover{background:var(--bg);border-color:var(--border)}
  .fd-ic{width:52px;height:52px;margin:0 auto;display:grid;place-items:center}
  .fd-ic.folder{color:#e9b64c}
  .fd-ic.doc{color:var(--blue);background:var(--blue-soft);border-radius:12px;width:46px;height:52px}
  .fd-name{font-size:11.5px;font-weight:600;margin-top:6px;word-break:break-word;line-height:1.3}
  .fd-meta{font-size:9.5px;color:var(--muted);margin-top:2px}
  .fd-x{position:absolute;top:4px;right:4px;border:none;background:#fff;border-radius:6px;color:var(--muted);cursor:pointer;padding:3px;display:flex;opacity:0;transition:.15s;box-shadow:0 1px 4px rgba(21,36,59,.15)}
  .fd-item:hover .fd-x{opacity:.9}
  .fd-x:hover{color:var(--red)}
  .fd-s{right:30px!important}
  .fd-s:hover{color:var(--blue)!important}
  .fd-pickrow{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:8px;cursor:pointer;font-size:12.5px}
  .fd-pickrow:hover{background:var(--bg)}
  .fd-pickrow.sel{background:var(--accent-soft);color:#b34a17;font-weight:700}
  .fd-item.dragging{opacity:.45;transform:scale(.96)}
  .fd-item.drop,.fd-root.drop{outline:2.5px dashed var(--accent);outline-offset:-2px;background:var(--accent-soft)!important}
  .fd-crumb span.drop{background:var(--accent-soft);color:#b34a17;outline:1.5px dashed var(--accent)}

  /* ---------- Διάλογος κλεισίματος κειμενογράφου ---------- */
  .wpc-opt{display:flex;align-items:center;gap:12px;width:100%;border:1.5px solid var(--border);background:#fff;border-radius:12px;padding:12px 14px;cursor:pointer;text-align:left;margin-top:9px;transition:.15s;font-family:inherit}
  .wpc-opt:hover{border-color:var(--accent);background:#fff9f5;transform:translateY(-1px);box-shadow:0 3px 10px rgba(21,36,59,.08)}
  .wpc-opt .wic{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;color:#fff;flex:none}
  .wpc-opt .wt b{font-size:13.5px;display:block}
  .wpc-opt .wt span{font-size:11px;color:var(--muted)}
  .wpc-opt .wgo{margin-left:auto;color:var(--muted);opacity:.5;font-size:15px}
  .wpc-discard{border:none;background:none;color:var(--red);font-size:12.5px;font-weight:600;cursor:pointer;padding:8px 4px}
  .wpc-discard:hover{text-decoration:underline}

  /* ---------- Ανάγκες ---------- */
  .np{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:800;padding:3px 10px;border-radius:9px;white-space:nowrap;letter-spacing:.2px}
  .np.pending{background:var(--amber-soft);color:#8a6408}
  .np.delayed{background:#fdeaea;color:var(--red)}
  .np.admin{background:#f0e9fd;color:#6d3fd4}
  .np.approved{background:var(--green-soft);color:var(--green)}
  .nd-row{display:flex;gap:12px;padding:13px 16px;border-bottom:1px solid #f2f4f8;align-items:flex-start;transition:background .3s}
  .nd-row:last-child{border-bottom:none}
  .nd-row:hover{background:#fafbfd}
  .nd-main{flex:1;min-width:0}
  .nd-item{font-size:13.5px;font-weight:700}
  .nd-item .q{color:var(--accent);font-weight:800}
  .nd-why{font-size:11.5px;color:var(--muted);margin-top:2px;line-height:1.5}
  .nd-meta{font-size:10px;color:var(--muted);margin-top:4px}
  .nd-com{background:var(--blue-soft);border-radius:9px;padding:7px 10px;font-size:11.5px;margin-top:7px;line-height:1.5}
  .nd-com b{font-size:10.5px;color:#2b4d86}
  .nd-acts{display:flex;gap:5px;flex-wrap:wrap;flex:none;align-items:flex-start}
  .nd-acts .btn{padding:6px 10px;font-size:11px}
  .nd-grp{position:sticky;top:0;background:#f4f6fa;padding:8px 16px;font-size:11px;font-weight:800;color:#3c4761;
    display:flex;align-items:center;gap:6px;border-bottom:1px solid var(--border);text-transform:uppercase;letter-spacing:.4px;z-index:1}
  .nd-grp span{color:var(--muted);font-weight:600;text-transform:none}
  .nd-dept{background:#e7effc;color:#2b4d86;font-weight:800;font-size:10px;padding:2.5px 9px;border-radius:8px;
    display:inline-flex;gap:4px;align-items:center;white-space:nowrap}
  .nd-name{font-size:14px;font-weight:800}
  .nd-open{font-size:10.5px;color:var(--muted);display:flex;align-items:center;gap:3px;margin-top:6px}
  .nd-row.click{cursor:pointer}
  .nd-row.click:hover{background:var(--accent-soft)}
  .nda-btn{display:flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:11px;
    padding:12px 16px;font-size:13px;font-weight:700;cursor:pointer;transition:.15s;font-family:inherit;flex:1;min-width:150px}
  .nda-btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
  .nda-btn.ok{background:var(--green);color:#fff;box-shadow:0 3px 10px rgba(30,158,90,.3)}
  .nda-btn.fwd{background:#f0e9fd;color:#6d3fd4;border:1.5px solid #d9c8f7}
  .nda-btn.late{background:#fdeaea;color:var(--red);border:1.5px solid #f3c3c1}
  .nd-cin{display:flex;gap:6px;margin-top:8px;width:100%}
  .nd-cin input{flex:1;border:1.5px solid var(--accent);border-radius:9px;padding:7px 10px;font-size:12px;outline:none}
  /* Συζήτηση ανάγκης (αιτών ↔ Γραμματεία) */
  .nd-thread{display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto;padding:2px}
  .nd-msg{align-self:flex-start;max-width:85%;background:#eef2f7;border-radius:12px 12px 12px 4px;padding:7px 11px;
    font-size:12.5px;line-height:1.5;overflow-wrap:anywhere;white-space:pre-wrap}
  .nd-msg.me{align-self:flex-end;background:#d6f5f1;border-radius:12px 12px 4px 12px}
  .nd-msg b{display:block;font-size:10.5px;color:#0b5f57;margin-bottom:1px;white-space:normal}
  .nd-msg .t{color:var(--muted);font-weight:600;margin-left:6px}
  .nd-side{display:flex;flex-direction:column;gap:7px;align-items:flex-end;flex:none}
  .nd-chat{color:#0d9488;font-weight:700}
  .nd-q{background:var(--amber-soft);color:#8a6408;font-weight:800;padding:1px 7px;border-radius:7px;margin-left:4px}
  .nd-del{display:inline-flex;align-items:center;gap:4px;background:none;border:1.5px solid #f3c3c1;color:var(--red);
    border-radius:8px;padding:4px 9px;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit}
  .nd-del:hover{background:#fdeaea}

  /* ---------- Dock (macOS-style) ---------- */
  .dock{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:64;display:flex;gap:11px;align-items:flex-end;padding:10px 15px;background:rgba(255,255,255,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(21,36,59,.13);border-radius:20px;box-shadow:0 12px 34px rgba(21,36,59,.24)}
  .dock-item{position:relative;border:none;background:none;padding:0;cursor:pointer}
  /* Κουμπί "+" που ξεχωρίζει */
  .dock-item.plus .dock-ic{width:52px;height:52px;border-radius:15px;color:#fff;
    background:linear-gradient(135deg,#ff9d5c,#e8622d 55%,#c2410c);
    box-shadow:0 5px 16px rgba(232,98,45,.5),inset 0 1.5px 0 rgba(255,255,255,.45)}
  .dock-item.plus:hover .dock-ic{transform:scale(1.12) translateY(-6px)}
  /* Συννεφάκι γρήγορης δημιουργίας */
  .qa-pop{position:absolute;bottom:66px;left:50%;transform:translateX(-50%) translateY(16px) scale(.65);
    transform-origin:50% 100%;opacity:0;pointer-events:none;z-index:80;
    transition:transform .3s cubic-bezier(.22,1.3,.32,1),opacity .22s ease}
  .qa-pop.open{opacity:1;pointer-events:auto;transform:translateX(-50%)}
  .qa-pop::after{content:"";position:absolute;top:calc(100% - 9px);left:50%;
    transform:translateX(-50%) rotate(45deg);width:16px;height:16px;
    background:rgba(255,255,255,.92);border-right:1px solid rgba(21,36,59,.14);border-bottom:1px solid rgba(21,36,59,.14)}
  .qa-card{background:rgba(255,255,255,.92);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);
    border:1px solid rgba(21,36,59,.14);border-radius:18px;box-shadow:0 16px 42px rgba(21,36,59,.3);padding:12px}
  .qa-grid{display:grid;grid-template-columns:repeat(2,96px);gap:10px}
  .qa-t{border:1px solid rgba(21,36,59,.08);background:rgba(255,255,255,.65);border-radius:14px;
    padding:12px 6px 10px;display:flex;flex-direction:column;align-items:center;gap:7px;
    font-size:11.5px;font-weight:700;color:var(--text);cursor:pointer;transition:.15s;font-family:inherit}
  .qa-t:hover{transform:translateY(-3px);background:#fff;box-shadow:0 7px 18px rgba(21,36,59,.16)}
  .qa-i{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
  .dock-item.plus .qa-pop.open~.dock-tip,.dock-item.plus:hover .qa-pop.open+.dock-tip{opacity:0!important}
  .dock-ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:#fff;box-shadow:0 4px 10px rgba(21,36,59,.22),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .18s ease}
  .dock-item:hover .dock-ic{transform:scale(1.1) translateY(-5px)}
  .dock-item:active .dock-ic{transform:scale(1.02) translateY(-1px)}
  .dock-tip{position:absolute;bottom:60px;left:50%;transform:translateX(-50%) translateY(5px);background:var(--navy);color:#fff;font-size:11px;font-weight:600;padding:5px 11px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;transition:.16s ease}
  .dock-tip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--navy)}
  .dock-item:hover .dock-tip{opacity:1;transform:translateX(-50%) translateY(0)}
  .page-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:18px;flex-wrap:wrap}
  .page-hero{display:flex;align-items:center;gap:13px;flex-wrap:wrap;border-radius:16px;padding:17px 22px;color:#fff;margin-bottom:16px;box-shadow:0 8px 24px rgba(21,36,59,.22)}
  .page-hero h1{font-size:19px;color:#fff}
  .page-hero p{font-size:12px;color:rgba(255,255,255,.78);margin-top:3px}
  .ph-ic{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.18);display:grid;place-items:center;flex:none}
  .page-hero .hactions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
  .page-head h1{font-size:20px}
  .page-head p{color:var(--muted);font-size:13px;margin-top:3px}
  .btn{border:none;border-radius:9px;padding:9px 16px;font-size:13px;font-weight:600}
  .btn-primary{background:var(--accent);color:#fff}
  .btn-primary:hover{background:#d1531f}
  .btn-ghost{background:#fff;border:1px solid var(--border);color:var(--text)}
  .btn-ghost:hover{background:var(--bg)}
  .btn-sm{padding:6px 11px;font-size:12px}

  /* ---------- Cards / stats ---------- */
  .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:18px}
  .stat{background:var(--card);border:1px solid var(--border);border-left:4px solid transparent;border-radius:var(--radius);padding:13px 15px;box-shadow:var(--shadow);display:flex;gap:11px;align-items:center;cursor:pointer;transition:.15s}
  .stat:has(.ico[style*="--accent-soft"]){border-left-color:var(--accent);background:linear-gradient(135deg,#fff 45%,#fdeee6)}
  .stat:has(.ico[style*="--green-soft"]){border-left-color:var(--green);background:linear-gradient(135deg,#fff 45%,#e2f5ea)}
  .stat:has(.ico[style*="#fdeaea"]){border-left-color:var(--red);background:linear-gradient(135deg,#fff 45%,#fdeaea)}
  .stat:has(.ico[style*="--blue-soft"]){border-left-color:var(--blue);background:linear-gradient(135deg,#fff 45%,#e7effc)}
  .stat:has(.ico[style*="--amber-soft"]){border-left-color:var(--amber);background:linear-gradient(135deg,#fff 45%,#fdf3df)}
  .stat:hover{border-color:var(--accent);transform:translateY(-2px)}
  .stat .hint{margin-left:auto;color:var(--muted);font-size:13px;opacity:.5}
  .stat .ico{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font-size:18px;flex:none}
  .stat .lbl{font-size:11px;color:var(--muted)}
  .stat .val{font-size:21px;font-weight:800;line-height:1.15}
  .card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
  /* Χρωματική ταυτότητα ανά τύπο κάρτας */
  .card.t-orange{border-left:4px solid var(--accent)}
  .card.t-orange>.card-h{background:linear-gradient(90deg,#fdeee6,#fff 75%);color:#a34412}
  .card.t-red{border-left:4px solid var(--red)}
  .card.t-red>.card-h{background:linear-gradient(90deg,#fdeaea,#fff 75%);color:#b4322e}
  .card.t-amber{border-left:4px solid var(--amber)}
  .card.t-amber>.card-h{background:linear-gradient(90deg,#fdf3df,#fff 75%);color:#8a6408}
  .card.t-blue{border-left:4px solid var(--blue)}
  .card.t-blue>.card-h{background:linear-gradient(90deg,#e7effc,#fff 75%);color:#2b4d86}
  .card.t-green{border-left:4px solid var(--green)}
  .card.t-green>.card-h{background:linear-gradient(90deg,#e2f5ea,#fff 75%);color:#177a46}
  .card.t-purple{border-left:4px solid #6d3fd4}
  .card.t-purple>.card-h{background:linear-gradient(90deg,#f0e9fd,#fff 75%);color:#5b2fc4}
  .card-h{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;font-weight:700;font-size:13.5px}
  .card-h .cnt{font-size:11px;font-weight:600;color:var(--muted);background:var(--bg);border-radius:8px;padding:2px 8px}
  .grid2{display:grid;grid-template-columns:1.35fr 1fr;gap:16px;align-items:start;margin-bottom:16px}
  @media (max-width:1100px){ .grid2{grid-template-columns:1fr} }
  .stack{display:flex;flex-direction:column;gap:16px}

  .dept-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px}
  .dept-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow);cursor:pointer;transition:.15s}
  .dept-card:hover{border-color:var(--accent);transform:translateY(-2px)}
  .dept-card h3{font-size:13.5px;margin-bottom:2px}
  .dept-card .meta{font-size:11px;color:var(--muted);margin-bottom:9px}
  .mini-bar{height:6px;background:var(--bg);border-radius:3px;overflow:hidden}
  .mini-bar i{display:block;height:100%;background:var(--accent);border-radius:3px}
  .dept-card .foot{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:7px}
  .dept-card .warn{color:var(--red);font-weight:700}

  /* ---------- Donut / graphics ---------- */
  .donut-wrap{display:flex;align-items:center;gap:18px;padding:16px}
  .legend{display:flex;flex-direction:column;gap:8px;font-size:12.5px}
  .legend .li{display:flex;align-items:center;gap:8px}
  .legend .sw{width:11px;height:11px;border-radius:3px;flex:none}
  .legend b{margin-left:auto;padding-left:14px}

  /* ---------- Task list ---------- */
  .task-row{display:flex;align-items:center;gap:13px;padding:11px 16px;border-bottom:1px solid var(--border);cursor:pointer}
  .task-row:last-child{border-bottom:none}
  .task-row:hover{background:#fafbfd}
  .prio{width:4px;height:36px;border-radius:2px;flex:none}
  .prio.high{background:var(--red)} .prio.med{background:var(--amber)} .prio.low{background:var(--green)}
  .task-row .tt{font-weight:600;font-size:13.5px}
  .task-row .ts{font-size:11.5px;color:var(--muted);margin-top:2px}
  /* Task που προέρχεται από έργο: διακριτικό chip με το όνομα του έργου */
  .task-row.from-prj{border-left:2px solid var(--prj-soft)}
  .tr-prj{display:inline-flex;align-items:center;gap:3px;margin-left:7px;vertical-align:1px;
    font-size:10px;font-weight:700;color:var(--prj-d);background:var(--prj-soft);
    border-radius:6px;padding:1px 6px;max-width:210px;overflow:hidden;
    text-overflow:ellipsis;white-space:nowrap}
  /* Κεφαλίδα ομάδας έργου μέσα στη λίστα tasks */
  .tg-hd{display:flex;align-items:center;gap:7px;padding:9px 16px 7px;cursor:pointer;
    color:var(--prj-d);font-size:11.5px;font-weight:800;background:linear-gradient(90deg,var(--prj-soft),transparent 78%)}
  .tg-hd:hover{filter:brightness(.97)}
  .tg-hd .tg-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tg-hd .tg-n{background:#fff;border-radius:7px;padding:0 6px;font-size:10px;color:var(--prj-d);flex:none}
  .tg-hd .tg-bar{margin-left:auto;width:70px;height:5px;border-radius:3px;background:#fff;overflow:hidden;flex:none}
  .tg-hd .tg-bar i{display:block;height:100%;background:var(--prj);border-radius:3px}
  .tg-hd .tg-pct{font-size:10px;flex:none;min-width:28px;text-align:right}
  .tg-hd.loose{color:var(--muted);background:none;border-top:1px solid var(--border);margin-top:6px;cursor:default}
  .tg-hd.loose .tg-n{background:var(--bg);color:var(--muted)}
  .task-main{flex:1;min-width:0}
  .deadline{font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:8px;background:var(--bg);color:var(--muted);white-space:nowrap}
  .deadline.overdue{background:#fdeaea;color:var(--red)}
  .deadline.soon{background:var(--amber-soft);color:#a06e07}
  .prog-wrap{width:100px;flex:none;text-align:right}
  .prog-wrap .pct{font-size:11px;font-weight:700;color:var(--muted)}
  .chip{font-size:10.5px;font-weight:600;padding:2px 8px;border-radius:8px;white-space:nowrap}
  .chip.done{background:var(--green-soft);color:var(--green)}
  .chip.run{background:var(--blue-soft);color:var(--blue)}
  .chip.open{background:var(--bg);color:var(--muted)}
  .empty{padding:26px;text-align:center;color:var(--muted);font-size:12.5px}

  
  /* ---- Ζωντανή αναζήτηση στη «Λίστα παρακολούθησης» ----
     ΙΔΙΑ γραμμή με τις καρτέλες: καρτέλες αριστερά, αναζήτηση στη δεξιά γωνία. */
  .wl-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 16px 4px}
  .wl-bar .tabs{flex:none;margin:0}
  .wl-find{display:flex;align-items:center;gap:8px;margin-left:auto;flex:0 1 300px;min-width:190px;
    padding:7px 11px;border:2px solid #f3c5ac;border-radius:12px;background:#fff;
    box-shadow:0 2px 10px rgba(232,98,45,.16),inset 0 1px 0 #fff;
    transition:border-color .16s,box-shadow .16s,transform .16s}
  .wl-find:hover{border-color:#eda87f;box-shadow:0 4px 14px rgba(232,98,45,.22)}
  .wl-find:focus-within{border-color:var(--accent);transform:translateY(-1px);
    box-shadow:0 6px 18px rgba(232,98,45,.3),0 0 0 3px rgba(232,98,45,.16)}
  .wl-find>svg{color:var(--accent);flex:none}
  .wl-find input{flex:1;min-width:0;border:none;background:none;outline:none;
    font:inherit;font-size:13px;font-weight:600;color:var(--text)}
  .wl-find input::placeholder{color:#c08a6c;font-weight:500}
  .wl-cnt{font-size:10.5px;font-weight:800;color:#b34a17;flex:none;white-space:nowrap}
  .wl-x{border:none;background:#f7ded1;color:#b34a17;flex:none;cursor:pointer;
    width:20px;height:20px;border-radius:50%;display:grid;place-items:center;padding:0;
    transition:background .15s,color .15s}
  .wl-x:hover{background:var(--accent);color:#fff}

  /* Το task βρέθηκε από συνομιλία: μικρή προεπισκόπηση του μηνύματος */
  .wl-hit{display:flex;align-items:center;gap:9px;cursor:pointer;
    padding:7px 16px 9px 33px;margin-top:-4px;font-size:11.5px;color:var(--muted);
    background:linear-gradient(90deg,#f6f9ff,transparent 85%);border-bottom:1px solid var(--border)}
  .wl-hit:hover{background:linear-gradient(90deg,#eef4ff,transparent 85%)}
  .wl-hit-ic{flex:none;color:var(--prj);display:flex}
  .wl-hit-tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.5}
  .wl-hit-tx b{color:var(--text);font-weight:700}
  .wl-hit-go{flex:none;color:var(--muted);opacity:.6;display:flex}
  .wl-hit mark{background:#ffe9a8;color:#6b4b00;border-radius:3px;padding:0 2px;font-weight:700}

  /* ---------- ΚΑΡΤΕΣ TASK (σελίδα «Tasks» διευθυντή) ----------
     Ίδια γεωμετρία με τις κάρτες project (.prj-card στο 32), με τα χρώματα του task.
     Η λωρίδα αριστερά είναι η προτεραιότητα. */
  .tk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:6px}
  .tk-grid>.lz-host{display:contents}
  .tk-grid .lz-sent{grid-column:1/-1;height:1px}
  .tk-card{background:var(--card);border:1px solid var(--border);border-left:3px solid var(--border);
    border-radius:var(--radius);padding:14px 15px;cursor:pointer;
    transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
  .tk-card:hover{transform:translateY(-2px);box-shadow:0 6px 22px rgba(232,98,45,.16);border-color:#f0c4ac;border-left-color:#e8622d}
  .tk-card.p-high{border-left-color:#d43a1e}
  .tk-card.p-med{border-left-color:#e09c1a}
  .tk-card.p-low{border-left-color:#1e9e5a}
  .tk-top{display:flex;align-items:center;gap:9px;margin-bottom:4px}
  .tk-ic{width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;color:#fff;
    background:linear-gradient(135deg,#832f0d,#e8622d)}
  /* ΟΧΙ άλλο χρώμα για το σύνθετο: το task είναι πορτοκαλί παντού (dock, hero,
     popup). Ένα τσεκ = απλό · δύο τσεκ (το εικονίδιο του μενού) = σύνθετο. */
  .tk-ic.cx{background:linear-gradient(135deg,#8f3a12,#f0762f)}
  .tk-tt{font-weight:700;font-size:14.5px;line-height:1.25;flex:1;min-width:0;color:var(--text)}
  .tk-sub{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin:2px 0 11px}
  .tk-sub .tk-who{display:inline-flex;align-items:center;gap:4px;color:var(--text);font-weight:600}
  .tk-bar{display:flex;align-items:center;gap:9px;margin-bottom:10px}
  .tk-bar b{font-size:12.5px;color:#832f0d;min-width:38px;text-align:right}
  .tk-bar .mini-bar i{background:linear-gradient(90deg,#832f0d,#e8622d)}
  .tk-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:var(--muted)}
  /* Ενότητες της σελίδας «Tasks»: η σχέση μου με την εργασία δίνει το χρώμα —
     πορτοκαλί = δική μου δουλειά, τιρκουάζ = ανάθεση (ίδιος κώδικας με τα Projects),
     γκρι = ό,τι τρέχει στο τμήμα χωρίς να με αφορά άμεσα. */
  .tk-sec{display:flex;align-items:center;gap:7px;margin:22px 2px 10px;padding:2px 0 2px 10px;
    border-left:3px solid var(--border);color:var(--muted)}
  .tk-sec:first-of-type{margin-top:6px}
  .tk-sec .cnt{background:var(--bg);border-radius:7px;padding:1px 8px;font-size:11px;font-weight:800}
  .tk-sec.s-mine{border-left-color:#e8622d;color:#832f0d}
  .tk-sec.s-mine .cnt{background:#fdeadf;color:#832f0d}
  .tk-sec.s-given{border-left-color:#14b8a6;color:#0f766e}
  .tk-sec.s-given .cnt{background:#d9f5f1;color:#0f766e}
  .tk-sec.s-dept{border-left-color:#94a3b8}
  .tk-from{display:inline-flex;align-items:center;gap:4px;color:var(--muted)}
/* ---------- Notes / reminders ---------- */
  .item-row{display:flex;gap:10px;padding:10px 16px;border-bottom:1px solid #f2f4f8;align-items:flex-start}
  .item-row:last-child{border-bottom:none}
  .item-row .ic{width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;font-size:14px}
  .ic.note{background:var(--blue-soft)} .ic.rem{background:var(--amber-soft)} .ic.task{background:var(--accent-soft)}
  .item-row .it{font-size:12.5px;line-height:1.45}
  .item-row .id2{font-size:10.5px;color:var(--muted);margin-top:2px}
  .item-row .tm{margin-left:auto;font-size:11px;font-weight:700;color:var(--muted);white-space:nowrap}

  /* ---------- Calendar ---------- */
  .cal-toolbar{display:flex;align-items:center;gap:9px;margin-bottom:14px;flex-wrap:wrap}
  .cal-toolbar h2{font-size:16px;min-width:210px;text-transform:capitalize}
  .seg{display:flex;background:#fff;border:1px solid var(--border);border-radius:9px;overflow:hidden}
  .seg button{border:none;background:none;padding:7px 13px;font-size:12px;font-weight:600;color:var(--muted)}
  .seg button.active{background:var(--navy);color:#fff}
  .cal-month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-left:1px solid var(--border);border-top:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:var(--shadow)}
  .cal-dow{padding:8px;font-size:11px;font-weight:700;text-align:center;color:var(--muted);background:#fafbfd;border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
  .cal-cell{min-height:96px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:5px;cursor:pointer;background:#fff}
  .cal-cell:hover{background:#fafbfd}
  .cal-cell.dim{background:#f7f8fb;color:#aab3c2}
  .cal-cell.today .cal-num{background:var(--accent);color:#fff}
  .cal-num{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11.5px;font-weight:700;margin-bottom:3px}
  .cal-chip{display:block;width:100%;text-align:left;border:none;font-size:10px;font-weight:600;padding:2px 5px;border-radius:5px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
  .cal-chip.task{background:var(--accent-soft);color:#b34a17}
  .cal-chip.note{background:var(--blue-soft);color:#2b4d86}
  .cal-chip.rem{background:var(--amber-soft);color:#8a6408}
  .cal-more{font-size:10px;color:var(--muted);padding-left:4px}
  .cal-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
  .cal-wcol{background:#fff;border:1px solid var(--border);border-radius:10px;min-height:230px;padding:9px;box-shadow:var(--shadow)}
  .cal-wcol.today{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
  .cal-wcol h4{font-size:11px;color:var(--muted);margin-bottom:7px}
  .cal-wcol h4 b{display:block;font-size:15px;color:var(--text)}
  .cal-year{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:13px}
  .cal-ycard{background:#fff;border:1px solid var(--border);border-radius:10px;padding:13px;cursor:pointer;box-shadow:var(--shadow)}
  .cal-ycard:hover{border-color:var(--accent)}
  .cal-ycard h4{font-size:13px;margin-bottom:8px;text-transform:capitalize}
  .cal-ycard .yline{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);padding:2px 0}

  /* ---------- Popup ημέρας (calDayPopup) ----------
     Κλικ σε μέρα από Μήνα/Εβδομάδα ανοίγει ΕΔΩ, χωρίς αλλαγή προβολής.
     Το σώμα είναι το ίδιο HTML με την προβολή «Ημέρα» (calDayBodyHTML). */
  .cal-daypop .modal-b{padding:16px}
  .cal-daypop .card{margin-bottom:0}
  /* ΠΑΝΤΑ μονόστηλο: το .grid2 είναι 1.35fr/1fr για ΣΕΛΙΔΑ ~1200px. Μέσα σε
     modal 720px οι τίτλοι των task έσπαγαν σε 3 γραμμές ενώ η δεξιά στήλη
     έμενε μισοάδεια. Το media query του .grid2 μετράει viewport, όχι modal. */
  .cal-daypop .grid2{grid-template-columns:1fr;margin-bottom:0;gap:12px}

  /* Το dock ζει κάτω-κέντρο (bottom:14px, ~76px ύψος) και το popup είναι
     κεντραρισμένο: με max-height:90vh η κάτω ακμή έπεφτε ΠΑΝΩ στο dock και
     έκρυβε τα κουμπιά. Σε κινητό δεν ισχύει — εκεί το dock είναι κρυμμένο. */
  @media (min-width:901px){ .modal.cal-daypop{max-height:calc(100vh - 200px)} }

  /* Κινητό: τα δύο κουμπιά δεν χωρούν δίπλα-δίπλα → στοίβα, πρωτεύον πάνω. */
  @media (max-width:600px){
    .cal-daypop .modal-f{flex-direction:column-reverse;gap:8px}
    .cal-daypop .modal-f .btn{width:100%;justify-content:center}
  }

  /* ---------- Tabs (Αναφορές κ.ά.) ---------- */
  .tabs{display:flex;gap:7px;margin-bottom:14px;flex-wrap:wrap;align-items:center}
  .tabs .tab{border:1px solid var(--border);background:#fff;border-radius:9px;padding:7px 14px;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer}
  .tabs .tab:hover{border-color:var(--accent)}
  .tabs .tab.active{background:var(--navy);color:#fff;border-color:var(--navy)}
  .tabs .tab .tcnt{font-size:10px;background:var(--bg);border-radius:8px;padding:1px 6px;margin-left:5px;color:var(--muted)}
  .tabs .tab.active .tcnt{background:rgba(255,255,255,.2);color:#fff}
  .sd-tabs{display:flex;gap:3px;padding:7px 9px;background:#fafbfd;border-bottom:1px solid var(--border);flex-wrap:wrap}
  .sd-tabs button{border:1px solid transparent;background:none;border-radius:7px;padding:4px 8px;font-size:11px;font-weight:600;color:var(--muted);cursor:pointer}
  .sd-tabs button:hover{background:var(--bg)}
  .sd-tabs button.active{background:var(--accent-soft);color:var(--accent)}
  .sd-tabs button .c{opacity:.5;font-weight:400}
  .sd-tabs button .c.has{opacity:1;font-weight:800;font-size:10.5px;color:var(--blue);background:var(--blue-soft);
    border-radius:6px;padding:1px 5px;margin-left:2px;letter-spacing:.2px}
  .sd-tabs button.active .c.has{background:#fff;box-shadow:inset 0 0 0 1px rgba(46,111,216,.28)}
  .s-res .sic2{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-size:14px;flex:none}

  /* ---------- Chat panel ---------- */
  /* πλάτος 342 → 410px (+20%)· `min()` ώστε σε στενό desktop παράθυρο να μη
     σκεπάζει όλη την οθόνη — σε ≤900px το 36-mobile το κάνει ούτως ή άλλως 100% */
  #chatPanel{position:fixed;top:70px;right:0;bottom:0;width:min(410px,92vw);background:#fff;border-left:1px solid var(--border);border-top:1px solid var(--border);border-top-left-radius:16px;overflow:hidden;box-shadow:-8px 0 28px rgba(21,36,59,.14);z-index:70;display:flex;flex-direction:column;transform:translateX(100%);transition:.22s}
  body.has-preview #chatPanel{top:104px}
  #chatPanel.open{transform:none}
  .chat-head{padding:13px 15px;border-bottom:none;display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px;background:linear-gradient(120deg,#1e3a8a,#3b82f6);color:#fff}
  .chat-head button{border:none;background:none;font-size:16px;color:#fff}
  .chat-head button:last-child{margin-left:auto}
  .chat-head .avatar{background:rgba(255,255,255,.22)}
  .chat-head [style*="--muted"]{color:rgba(255,255,255,.82)!important}
  .chat-body{flex:1;overflow-y:auto}
  .chat-priv{font-size:10.5px;color:var(--muted);background:#fafbfd;padding:7px 14px;border-bottom:1px solid var(--border)}
  .chat-group-h{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:none;background:#fafbfd;padding:9px 14px;font-size:12px;font-weight:700;color:var(--text);border-bottom:1px solid var(--border)}
  .chat-group-h .arr{transition:.15s;color:var(--muted);font-size:10px}
  .chat-group-h.open .arr{transform:rotate(90deg)}
  .chat-group-h .gb{margin-left:auto;min-width:17px;height:17px;padding:0 5px;border-radius:9px;background:var(--red);color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center}
  .contact{display:flex;align-items:center;gap:10px;padding:8px 14px;cursor:pointer;border-bottom:1px solid #f2f4f8}
  .contact:hover{background:var(--bg)}
  .contact .cn{font-size:12.5px;font-weight:600}
  .contact .cr{font-size:10.5px;color:var(--muted)}
  .contact .ub{margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--accent);color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center}
  .cv-item{display:flex;align-items:center;gap:11px;padding:10px 12px;margin:3px 8px;border-radius:12px;cursor:pointer;transition:.12s}
  .cv-item:hover{background:#f4f7fb}
  .cv-item .avatar{width:42px;height:42px;font-size:14px}
  /* Αδιάβαστα — έντονα ευδιάκριτα */
  .cv-item.un{background:#e6f0ff}
  .cv-item.un:hover{background:#dbe9ff}
  .cv-item.un .cv-top b{font-weight:800;color:#0f2c66}
  .cv-item.un .cv-prev{color:#33415c;font-weight:600}
  .cv-item.un .cv-time{color:#2563eb;font-weight:800}
  .cv-item .ub{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:#2563eb;color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;box-shadow:0 2px 6px rgba(37,99,235,.4);flex:none}
  .cv-main{flex:1;min-width:0}
  .cv-top{display:flex;align-items:baseline;gap:8px}
  .cv-top b{font-size:13.5px;font-weight:600;color:#1c2536;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .cv-time{margin-left:auto;font-size:10px;color:#9aa2b1;white-space:nowrap;flex:none}
  .cv-prev{font-size:12px;color:#8a94a8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
  .chat-search{padding:10px 12px 4px;border-bottom:none}
  .chat-search input{width:100%;border:1px solid transparent;border-radius:20px;padding:10px 14px;outline:none;font-size:12.5px;background:#f1f3f8}
  .chat-search input:focus{border-color:#3b82f6;background:#fff}
  .dot{width:8px;height:8px;border-radius:50%;flex:none}
  .dot.on{background:var(--green)} .dot.off{background:#c8cfda}
  .cv-avw{position:relative;flex:none}
  .cv-avw .pres{position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:50%;border:2px solid #fff;box-sizing:border-box}
  .cv-item.un .cv-avw .pres{border-color:#e6f0ff}
  .cv-avw .pres.on{background:var(--green)} .cv-avw .pres.off{background:#c8cfda}
  .conv{display:flex;flex-direction:column;height:100%;min-height:0}
  .conv-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;background:#fff}
  .msg{max-width:82%;padding:9px 12px;border-radius:16px;font-size:12.5px;line-height:1.45}
  .msg .mt{font-size:10px;opacity:.6;margin-top:3px}
  .msg .mrow{display:flex;align-items:center;gap:4px;margin-top:3px}
  .msg.out .mrow{justify-content:flex-end}
  .msg .mrow .mt{margin-top:0}
  .tick{display:inline-flex;align-items:center;opacity:.5}
  .tick svg{width:13px;height:13px}
  .tick.read{opacity:1;background:#15803d;color:#fff;width:17px;height:17px;border-radius:50%;justify-content:center;box-shadow:0 0 0 1px rgba(255,255,255,.25)}
  .tick.read svg{width:11px;height:11px;stroke-width:3.5}
  .msg.in{background:#eef0f4;color:#1c2536;align-self:flex-start;border-bottom-left-radius:5px}
  .msg.out{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;align-self:flex-end;border-bottom-right-radius:5px}
  .conv-input{display:flex;align-items:center;gap:8px;padding:10px;border-top:1px solid #eef1f5}
  .conv-input input{flex:1;border:1px solid transparent;border-radius:20px;padding:10px 14px;outline:none;background:#f1f3f8;font-size:12.5px}
  .conv-input input:focus{border-color:#3b82f6;background:#fff}
  .conv-input .btn-primary{width:38px;height:38px;flex:none;padding:0;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);border:none;display:grid;place-items:center;box-shadow:0 2px 8px rgba(37,99,235,.4)}
  .cv-att{width:36px;height:36px;flex:none;border:none;background:transparent;border-radius:50%;display:grid;place-items:center;color:#8a94a8;cursor:pointer}
  .cv-att:hover{color:#3b82f6;background:#eef2fb}
  .msg-img{max-width:100%;max-height:180px;border-radius:9px;display:block;cursor:zoom-in}
  .msg-file{display:flex;align-items:center;gap:8px;color:inherit;min-width:0;cursor:pointer}
  .msg-file:hover .mf-n{text-decoration:underline}
  .mf-i{min-width:0;display:flex;flex-direction:column}
  .mf-n{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
  .mf-s{font-size:10px;opacity:.7}
  .msg .msg-img+div,.msg .msg-file+div{margin-top:5px}
  /* ---------- Ομαδικές συνομιλίες ---------- */
  .gc-av{background:linear-gradient(135deg,#312e81,#6366f1);color:#fff;display:grid;place-items:center;flex:none}
  .gm-s{font-size:10px;font-weight:700;color:var(--accent);margin-bottom:2px}
  .msg.in .gm-s{color:var(--accent)}
  .gc-newrow{padding:10px 10px 0}
  .gc-newbtn{width:100%;display:flex;align-items:center;justify-content:center;gap:7px;border:1.5px dashed var(--border);background:#fff;border-radius:10px;padding:8px;font-size:12px;font-weight:700;color:var(--accent);cursor:pointer}
  .gc-newbtn:hover{border-color:var(--accent);background:var(--bg)}
  .gc-form{padding:12px;display:flex;flex-direction:column;gap:9px;border-bottom:1px solid var(--border)}
  .gc-form input{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:9px 12px;outline:none;font-size:12.5px;background:#fff}
  .gc-form input:focus{border-color:var(--accent)}
  .gc-chips{display:flex;flex-wrap:wrap;gap:6px;min-height:18px}
  .gc-none{font-size:10.5px;color:var(--muted)}
  .gc-chip{display:flex;align-items:center;gap:5px;background:var(--bg);border:1px solid var(--border);border-radius:20px;padding:3px 9px;font-size:11px;font-weight:600}
  .gc-chip button{border:none;background:none;color:var(--muted);cursor:pointer;display:flex;padding:0}
  .gc-chip button:hover{color:var(--red)}
  .contact .ck{margin-left:auto;width:17px;height:17px;border-radius:50%;border:1.5px solid var(--border);display:grid;place-items:center;color:#fff;flex:none}
  .contact .ck.on{background:var(--accent);border-color:var(--accent)}
  .gc-foot{padding:11px;border-top:1px solid var(--border)}
  /* ---------- Quick Look (macOS-style) ---------- */
  .ql-ov{position:fixed;inset:0;background:rgba(13,18,28,.72);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);z-index:210;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;padding:26px;animation:qlIn .16s ease}
  @keyframes qlIn{from{opacity:0}to{opacity:1}}
  .ql-bar{display:flex;align-items:center;gap:10px;background:rgba(30,37,52,.94);color:#fff;border-radius:12px;padding:8px 8px 8px 14px;width:min(860px,92vw);box-shadow:0 10px 34px rgba(0,0,0,.35)}
  .ql-name{font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .ql-size{font-size:10.5px;opacity:.6;white-space:nowrap;flex:none}
  .ql-btn{display:flex;align-items:center;gap:6px;border:none;background:rgba(255,255,255,.13);color:#fff;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:600;cursor:pointer;text-decoration:none;flex:none}
  .ql-btn:hover{background:rgba(255,255,255,.24)}
  .ql-body{max-width:92vw;flex:0 1 auto;min-height:0;display:grid;place-items:center;animation:qlPop .18s ease}
  @keyframes qlPop{from{transform:scale(.96);opacity:0}to{transform:none;opacity:1}}
  .ql-media{max-width:92vw;max-height:72vh;border-radius:12px;object-fit:contain;background:#10141c;box-shadow:0 22px 70px rgba(0,0,0,.5)}
  .ql-frame{width:min(860px,92vw);height:72vh;border:none;border-radius:12px;background:#fff;box-shadow:0 22px 70px rgba(0,0,0,.5)}
  .ql-doc{background:#fff;border-radius:14px;padding:36px 46px;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--text);box-shadow:0 22px 70px rgba(0,0,0,.5);max-width:min(420px,88vw);text-align:center}
  .ql-doc b{font-size:13.5px;word-break:break-all}
  .ql-doc span{font-size:11px;color:var(--muted)}
  .ql-hint{margin-top:4px}

  /* ---------- Notifications ---------- */
  #notifDrop{position:fixed;top:64px;right:96px;width:340px;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 12px 34px rgba(21,36,59,.18);z-index:80;display:none;overflow:hidden}
  #notifDrop.open{display:block}
  .notif-h{padding:12px 15px;border-bottom:1px solid var(--border);font-weight:700;display:flex;align-items:center}
  .notif-h button{margin-left:auto;border:none;background:none;color:var(--blue);font-size:11.5px;font-weight:600}
  .notif-list{max-height:340px;overflow-y:auto}
  .notif{display:flex;gap:10px;padding:11px 15px;border-bottom:1px solid #f2f4f8;cursor:pointer}
  .notif:hover{background:var(--bg)}
  .notif.unread{background:#e7f0ff;border-left:3px solid #2e6fd8;padding-left:12px}
  .notif.unread:hover{background:#d9e7ff}
  .notif.unread .nt{font-weight:700;color:#12294a}
  .notif.unread::after{content:"";width:9px;height:9px;border-radius:50%;background:#2e6fd8;flex:none;align-self:center;margin-left:auto}
  /* Εικονίδια ειδοποιήσεων = η ΧΡΩΜΑΤΙΚΗ ΤΑΥΤΟΤΗΤΑ του module (δες PROJECT-MAP).
     Πριν: «ann» και «meet» δεν είχαν ΚΑΝΕΝΑΝ κανόνα (άχρωμο τετράγωνο) και μόνο
     το «need» όριζε χρώμα εικονιδίου — τα υπόλοιπα κληρονομούσαν σκούρο κείμενο.
     Τώρα κάθε τύπος: απαλό φόντο + εικονίδιο στο χρώμα του module. */
  .notif .ic{width:32px;height:32px;border-radius:9px;flex:none;display:grid;place-items:center}
  .notif .ic svg{width:16px;height:16px}
  .notif .ic.task  {background:var(--accent-soft);color:#c2410c}   /* task πορτοκαλί */
  .notif .ic.rem   {background:var(--amber-soft); color:#8a5f06}   /* to-do amber */
  .notif .ic.report{background:var(--green-soft); color:#12603a}   /* αναφορές πράσινο */
  .notif .ic.chat  {background:var(--blue-soft);  color:#1e3a8a}   /* chat μπλε */
  .notif .ic.note  {background:var(--blue-soft);  color:#1d4ed8}   /* σημειώσεις μπλε */
  .notif .ic.need  {background:#d6f5f1;           color:#0b6f66}   /* ανάγκες teal */
  .notif .ic.ann   {background:#e8eafe;           color:#4338ca}   /* ανακοινώσεις indigo */
  .notif .ic.meet  {background:#f1e9fd;           color:#6d28d9}   /* συσκέψεις βιολετί */
  .notif .ic.doc   {background:#fdf0dc;           color:#a85706}   /* έγγραφα χρυσό */
  .notif .ic.bug   {background:#fdf4ff;           color:#a21caf}   /* αναφορές fuchsia */
  .notif .nt{font-size:12.5px;line-height:1.4}
  .notif .nd{font-size:10.5px;color:var(--muted);margin-top:2px}

  /* ---------- Modal ---------- */
  .overlay{position:fixed;inset:0;background:rgba(15,23,40,.5);z-index:100;display:grid;place-items:center;padding:20px}
  .modal{background:#fff;border-radius:14px;width:100%;max-width:640px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.3);transition:width .22s ease,max-height .22s ease}
  .modal-h{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:flex-start;gap:12px}
  .modal-h h2{font-size:16px;line-height:1.3}
  .modal-h .sub{font-size:12px;color:var(--muted);margin-top:3px}
  .modal-h .x{margin-left:auto;border:none;background:none;font-size:18px;color:var(--muted);flex:none}
  /* Εικονίδιο κεφαλίδας popup — ΚΛΑΣΗ, ποτέ inline style: το inline νικά κάθε
     media query, οπότε δεν θα μπορούσε να συμπυκνωθεί σε κινητό (36-mobile). */
  .mh-ic{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.18);display:grid;place-items:center;flex:none}
  .mh-ic.sm{width:40px;height:40px;border-radius:11px}
  .mh-ic.xs{width:38px;height:38px;border-radius:11px}
  .mh-ic.pw-ok{background:rgba(30,158,90,.22)}
  /* --- Αλλαγή κωδικού (καρτέλα → Επεξεργασία προφίλ) --- */
  .pf-pw{margin-top:14px;padding-top:12px;border-top:1px solid var(--border);
    display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  .pf-pw-t{flex:1;min-width:150px;font-size:12.5px}
  .pf-pw-t div{font-size:11px;color:var(--muted);margin-top:2px}
  .pw-list{margin:10px 0 0;padding-left:18px}
  .pw-list li{margin-bottom:6px}
  .pw-err{display:none;margin-top:10px;color:#c0392b;font-size:12px}
  .pf-depts{margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
  /* Προστατευμένος λογαριασμός στη λίστα Ρυθμίσεων — ουδέτερη ένδειξη */
  .prot-chip{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;
    background:var(--bg);border:1px solid var(--border);color:var(--muted);flex:none}
  .modal-b{padding:18px 20px;overflow-y:auto}
  .info-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-bottom:16px}
  .info-cell{background:var(--bg);border-radius:9px;padding:9px 12px;min-width:0}
  /* Ένα άτομο της ανάθεσης: avatar + όνομα + ποσοστό σε μία γραμμή στο desktop.
     ΚΛΑΣΗ, όχι inline style — σε κινητό πρέπει να μπορεί να τυλιχτεί. */
  .ig-p{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;max-width:100%}
  .info-cell .k{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
  .info-cell .v{font-size:13px;font-weight:600;margin-top:2px}
  .desc-box{font-size:13px;line-height:1.55;color:#39445a;background:var(--bg);border-radius:9px;padding:12px;margin-bottom:6px}
  .sec-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:16px 0 8px}
  .prog-ctrl{display:flex;align-items:center;gap:12px}
  .prog-ctrl input[type=range]{flex:1;accent-color:var(--accent)}
  .prog-ctrl .big{font-size:18px;font-weight:800;width:52px;text-align:right}
  .task-chat{border:1px solid var(--border);border-radius:10px;overflow:hidden}
  .task-chat .tc-msgs{max-height:210px;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;background:#f8f9fc}
  .priv-box{background:var(--blue-soft);border-radius:10px;padding:14px;font-size:12.5px;color:#2b4d86;line-height:1.5}
  .frm label{display:block;font-size:12px;font-weight:700;margin:13px 0 5px}
  .frm label .req{color:var(--red)}
  .frm input,.frm select,.frm textarea{width:100%;border:1px solid var(--border);border-radius:9px;padding:9px 11px;outline:none;background:#fff}
  .frm input:focus,.frm select:focus,.frm textarea:focus{border-color:var(--accent)}
  .frm .row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .modal-f{padding:14px 20px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:9px}
  .err{color:var(--red);font-size:11.5px;margin-top:5px;display:none}
  .type-seg{display:flex;gap:8px;margin-top:4px}
  .type-seg button{flex:1;border:1.5px solid var(--border);background:#fff;border-radius:10px;padding:10px 6px;font-size:12px;font-weight:600;color:var(--muted)}
  .type-seg button.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
  .type-seg button:disabled{opacity:.4;cursor:not-allowed}

    .as-box{display:flex;flex-wrap:wrap;gap:6px;align-items:center;border:1px solid var(--border);border-radius:10px;padding:8px;background:#fff}
  .as-chip{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);border:1px solid var(--border);border-radius:20px;padding:3px 6px 3px 4px;font-size:12px;font-weight:600}
  .as-chip i{font-style:normal;color:var(--muted);font-size:10px;font-weight:400}
  .as-chip button{border:none;background:none;cursor:pointer;color:var(--muted);display:grid;place-items:center;padding:2px}
  .as-chip button:hover{color:var(--red)}
  .as-add{border:1.5px dashed var(--border);background:#fff;border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;color:var(--accent);cursor:pointer}
  .as-add:hover{border-color:var(--accent);background:var(--accent-soft)}
  .as-menu{border:1px solid var(--border);border-radius:10px;margin-top:6px;max-height:200px;overflow-y:auto;background:#fff;box-shadow:0 8px 20px rgba(0,0,0,.08)}
  .sp-dept{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:7px;background:#1c2e4a;border-bottom:1px solid rgba(255,255,255,.08);padding:9px 16px;font-size:12px;font-weight:800;color:#fff;letter-spacing:.2px}
  .sp-dept svg{color:#8fb2e6}
  /* Κεφαλίδα στο ΧΡΩΜΑ του τμήματος (--dc από το dtColor· module 14 → popup «Ομάδα»).
     Ίδια απόχρωση με τις κάρτες της Γενικής Εποπτείας, ώστε το τμήμα να αναγνωρίζεται με τη ματιά. */
  .sp-dept.sp-c{background:var(--dc,#1c2e4a);
    background-image:linear-gradient(120deg,rgba(255,255,255,.14),rgba(0,0,0,.12))}
  .sp-dept.sp-c svg{color:rgba(255,255,255,.9)}
  .sp-dept.sp-c .cnt{background:rgba(255,255,255,.22)}
  .sp-dept .cnt{margin-left:auto;background:rgba(255,255,255,.16);color:#fff;border-radius:8px;padding:1px 8px;font-weight:700}
  .prow-dir{background:#eef4ff;border-left:3px solid #2e6fd8}
  .prow-dir:hover{background:#e2edff}
  .dir-tag{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:800;color:#1e4fa0;background:#dbe8ff;border-radius:6px;padding:1px 7px;margin-left:6px;vertical-align:middle}
  .dir-tag svg{width:10px;height:10px}
/* Υπόδειξη μήκους κωδικού (pwHintHTML, 02c): διακριτική, γκρι → πορτοκαλί όσο λείπουν → πράσινη με ✓ */
.pw-hint{display:flex;align-items:center;gap:5px;margin:5px 2px 0;font-size:11px;color:var(--muted);transition:color .15s}
.pw-hint svg{width:11px;height:11px;flex:none}
.pw-hint.short{color:#b45309}
.pw-hint.ok{color:var(--green)}
.pw-hint.ok span::after{content:" ✓";font-weight:700}
/* ---------- Hero & modern dashboard ---------- */
  .hero{position:relative;border-radius:18px;padding:22px 26px 20px;color:#fff;background:linear-gradient(115deg,#141f35 0%,#1d3050 48%,#3d2b73 85%,#6d3fd4 125%);box-shadow:0 8px 28px rgba(21,36,59,.28);margin-bottom:18px;overflow:hidden}
  .hero::before{content:"";position:absolute;right:-70px;top:-90px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(232,98,45,.42),transparent 70%)}
  .hero::after{content:"";position:absolute;left:35%;bottom:-130px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,rgba(109,63,212,.5),transparent 70%)}
  .hero>*{position:relative;z-index:1}
  .hero .hrow{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap}
  .hero h1{font-size:22px;letter-spacing:.2px}
  .hero .hd{font-size:12.5px;opacity:.78;margin-top:5px;text-transform:capitalize}
  .hero .hactions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
  .hbtn{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:#fff;border-radius:10px;padding:8px 14px;font-size:12.5px;font-weight:600}
  .hbtn:hover{background:rgba(255,255,255,.2)}
  .hbtn.hb-pri{background:var(--accent);border-color:var(--accent)}
  .hbtn.hb-pri:hover{background:#d1531f}
  .hkpis{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
  .hk{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.15);border-radius:13px;padding:10px 14px;min-width:126px}
  .hk.clk{cursor:pointer;transition:.15s}
  .hk.clk:hover{background:rgba(255,255,255,.2);transform:translateY(-2px)}
  .hki{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:#fff;flex:none}
  .hkv{font-size:19px;font-weight:800;line-height:1.1}
  .hkl{font-size:10.5px;opacity:.72}
  /* ΠΑΓΙΔΑ GRID: το `1fr` σημαίνει `minmax(auto,1fr)` — η στήλη ΔΕΝ κατεβαίνει
     ποτέ κάτω από το min-content του πλατύτερου παιδιού της. Μία κάρτα με
     φαρδιά κεφαλίδα (flex nowrap) κλείδωνε τη στήλη στα 455px σε οθόνη 390px
     και σκρόλαρε ΟΛΗ η σελίδα οριζόντια. ΚΑΝΟΝΑΣ: κάθε grid track εδώ μέσα
     γράφεται `minmax(0,1fr)`, ποτέ σκέτο `1fr`. */
  .dgrid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px;align-items:start;margin-bottom:16px}
  .dgrid>.stack{min-width:0}
  /* Στοιχείο που πιάνει ΟΛΟ το πλάτος του dashboard (λωρίδα υποτμημάτων, ζευγάρι
     καρτών από κάτω). Μένει ΜΕΣΑ στο .dgrid ώστε να κρατά τα `.dgrid .card` στυλ. */
  .dgrid>.dg-wide{grid-column:1/-1;min-width:0}
  @media (max-width:1100px){.dgrid{grid-template-columns:minmax(0,1fr)}}
  @keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  body.rt-quiet main *,body.rt-quiet aside *{animation-duration:0s!important;animation-delay:0s!important}
  .hero,.dgrid>.stack>*,main>.card,.dept-grid>*{animation:rise .3s ease both}
  .hbar{display:flex;align-items:center;gap:10px;padding:9px 16px;border-bottom:1px solid #f2f4f8;cursor:pointer}
  .hbar:hover{background:#fafbfd}
  .hbar:last-child{border-bottom:none}
  .hb-main{flex:1;min-width:0}
  .hb-top{display:flex;justify-content:space-between;font-size:12px;margin-bottom:4px}
  .hb-top b{font-size:12.5px}
  .hb-top span{color:var(--muted);font-size:11px}
  /* Μέλος ομάδας χωρίς ενεργά tasks: φαίνεται, αλλά δεν τραβά το βλέμμα */
  .hbar.hb-idle{opacity:.62}
  .hbar.hb-idle .hb-top span{font-style:italic}
  .hb-note{padding:8px 16px 11px;font-size:11px;color:var(--muted);text-align:center}
  .ag-row{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid #f2f4f8;cursor:pointer}
  .ag-row:hover{background:#fff7f5}
  .ag-row:last-child{border-bottom:none}
  .ag-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none}
  .ag-t{flex:1;min-width:0}
  .ag-t b{display:block;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ag-t span{font-size:10.5px;color:var(--muted)}
  .ag-time{font-size:11px;font-weight:700;background:var(--bg);border-radius:8px;padding:3px 8px;color:var(--muted);white-space:nowrap}

  /* ---------- «Τι έχω να κάνω»: κεφαλίδα με εικονίδιο ημερομηνίας & πλοήγηση ----------
     Το εικονίδιο είναι λευκή «κάρτα» με κόκκινη ταινία μήνα (στιλ iOS/macOS) και
     λειτουργεί ΚΑΙ ως κουμπί επιστροφής στο σήμερα. Ο μήνας (όχι η ημέρα της
     εβδομάδας) στην ταινία: αλλάζει μόνο όταν περνάς όριο μήνα, που ο αριθμός
     από μόνος του δεν το δείχνει — την ημέρα τη λέει ο υπότιτλος. */
  .ag-head{gap:10px}
  .ag-cal{width:44px;height:44px;flex:none;padding:0;border:none;border-radius:11px;overflow:hidden;
    background:#fff;box-shadow:0 2px 7px rgba(21,36,59,.22);cursor:pointer;
    display:flex;flex-direction:column;font-family:inherit;transition:transform .12s ease}
  .ag-cal:hover{transform:translateY(-1px)}
  .ag-cal:active{transform:translateY(0)}
  .ag-cal .agc-m{display:block;background:linear-gradient(180deg,#e8483a,#d1372b);color:#fff;
    font-size:8.5px;font-weight:800;letter-spacing:.6px;line-height:14px}
  .ag-cal .agc-d{flex:1;display:grid;place-items:center;font-size:19px;font-weight:800;color:#1c2536;line-height:1}
  /* Τίτλος + σχετική ημέρα ΣΤΗΝ ΙΔΙΑ ΓΡΑΜΜΗ: «Τι έχω να κάνω [σήμερα]».
     Η ημερομηνία δεν επαναλαμβάνεται — τη λέει το εικονίδιο. */
  .ag-ttl{flex:1;min-width:0;display:flex;align-items:baseline;gap:8px}
  .ag-ttl b{font-size:14px;white-space:nowrap;flex:none}
  .ag-when{font-size:11.5px;font-weight:700;background:rgba(255,255,255,.26);
    border-radius:999px;padding:2px 9px;white-space:nowrap;min-width:0;
    overflow:hidden;text-overflow:ellipsis}

  /* Κεφαλίδα κατηγορίας μέσα στην κάρτα (Projects / Tasks / Υπενθυμίσεις / Σημειώσεις).
     Οι κενές κατηγορίες δεν εμφανίζονται καθόλου. */
  .ag-grp{display:flex;align-items:center;gap:6px;padding:7px 16px;
    background:#f6f8fc;border-bottom:1px solid #eaeef5;
    font-size:10.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:#67788f}
  .ag-grp svg{flex:none}
  .ag-grp span{margin-left:auto;background:#e5eaf2;color:#4a5a72;
    border-radius:8px;padding:1px 7px;font-size:10px;letter-spacing:0}
  .ag-grp.ag-proj{color:#2f5fc0} .ag-grp.ag-task{color:#b34a17}
  .ag-grp.ag-rem{color:#8a6408}  .ag-grp.ag-note{color:#2b4d86}
  .ag-nav{display:flex;align-items:center;gap:4px;flex:none}
  .ag-nav button{border:none;background:rgba(255,255,255,.22);color:#fff;cursor:pointer;padding:0;
    width:26px;height:26px;border-radius:8px;font-size:17px;font-weight:700;line-height:1;
    display:grid;place-items:center;font-family:inherit}
  .ag-nav button:hover{background:rgba(255,255,255,.4)}
  .ag-nav .ag-now{width:auto;padding:0 9px;font-size:11px;font-weight:700}
  @media (max-width:600px){
    .ag-cal{width:40px;height:40px}
    .ag-cal .agc-d{font-size:17px}
    .ag-ttl b{font-size:13px}
    .ag-nav .ag-now{padding:0 7px;font-size:10px}
  }
  .ag-time.late{background:#fdeaea;color:var(--red)}
  .ag-chk{width:23px;height:23px;border:2px solid #c8cfda;border-radius:50%;display:grid;place-items:center;color:transparent;flex:none;cursor:pointer;transition:.15s;background:#fff}
  .ag-chk:hover{border-color:var(--green);color:var(--green);transform:scale(1.1)}
  .ag-chk.on{background:var(--green);border-color:var(--green);color:#fff}
  .item-row.edit{cursor:pointer}
  .item-row.edit:hover{background:#f6f9ff}
  .rowact{margin-left:auto;color:var(--muted);opacity:0;transition:.15s;flex:none;align-self:center}
  .item-row.edit:hover .rowact{opacity:.85}

  /* δύο κάρτες δίπλα-δίπλα (μισό πλάτος) μέσα σε στήλη dashboard */
  .row2c{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
  @media (max-width:760px){.row2c{grid-template-columns:1fr}}
  /* ===== Κάρτες dashboard — έντονη κεφαλίδα + σειρές «chip» με κενό + μικρή σκιά (scope: .dgrid) ===== */
  .dgrid .card{box-shadow:0 2px 9px rgba(21,36,59,.11);border-left:0}
  .dgrid .card.t-orange{background:linear-gradient(180deg,#fff7f2,#fff)}
  .dgrid .card.t-red{background:linear-gradient(180deg,#fff6f5,#fff)}
  .dgrid .card.t-blue{background:linear-gradient(180deg,#f5f8fe,#fff)}
  .dgrid .card.t-purple{background:linear-gradient(180deg,#f8f5ff,#fff)}
  .dgrid .card.t-royal{background:linear-gradient(180deg,#f4f7fe,#fff)}
  /* κεφαλίδα: γεμάτο gradient στο χρώμα της κάρτας, λευκό κείμενο & εικονίδιο */
  .dgrid .card>.card-h{color:#fff;border-bottom:none;font-size:14px}
  /* εικονίδιο κεφαλίδας μέσα σε ημιδιαφανές λευκό chip */
  .dgrid .card>.card-h>svg{width:16px;height:16px;padding:7px;border-radius:9px;box-sizing:content-box;background:rgba(255,255,255,.22);flex:none}
  .dgrid .card.t-orange>.card-h{background:linear-gradient(90deg,#d97e5b,#e79067)}
  .dgrid .card.t-red>.card-h{background:linear-gradient(90deg,#d4746f,#e08b86)}
  .dgrid .card.t-blue>.card-h{background:linear-gradient(90deg,#5586cd,#75a1e0)}
  .dgrid .card.t-purple>.card-h{background:linear-gradient(90deg,#7c61c8,#977fd8)}
  .dgrid .card.t-royal>.card-h{background:linear-gradient(90deg,#4d6cb0,#6d92d5)}
  /* count pill / hint / ghost κουμπιά ευανάγνωστα πάνω στο gradient */
  .dgrid .card-h .cnt{background:rgba(255,255,255,.92);color:#1c2536;font-weight:800}
  .dgrid .card-h [style*="--muted"]{color:rgba(255,255,255,.85)!important}
  .dgrid .card-h .btn-ghost{color:#fff;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4)}
  .dgrid .card-h .btn-ghost:hover{background:rgba(255,255,255,.28)}
  /* σειρές → λευκά chip με κενό μεταξύ τους */
  .dgrid .card .ag-row,.dgrid .card .item-row,.dgrid .card .hbar,.dgrid .card .task-row{
    background:#fff;margin:8px 10px;padding:10px 12px;border-radius:12px;border-bottom:none;
    box-shadow:0 1px 6px rgba(21,36,59,.07);transition:.15s}
  .dgrid .card .ag-row:hover,.dgrid .card .item-row.edit:hover,.dgrid .card .hbar:hover,.dgrid .card .task-row:hover{
    background:#fff;box-shadow:0 3px 12px rgba(21,36,59,.14);transform:translateY(-1px)}
  /* λίγο μεγαλύτερα γράμματα στις σειρές για ευκρίνεια */
  .dgrid .ag-t b,.dgrid .item-row .it,.dgrid .task-row .tt{font-size:13.5px}
  .dgrid .ag-t span,.dgrid .item-row .id2,.dgrid .task-row .ts{font-size:11.5px}
  .btn-danger{background:#fdeaea;color:var(--red);border:1px solid #f3c3c1}
  .btn-danger:hover{background:#fbd9d7}
  /* ---------- Badge προτεραιότητας ---------- */
  .prio-badge{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:8px;white-space:nowrap;vertical-align:middle}
  .prio-badge.high{background:#ffe6dd;color:#d43a1e}
  .prio-badge.high svg{animation:flick 
1s ease-in-out infinite alternate}
  @keyframes flick{from{transform:scale(1)}to{transform:scale(1.3)}}
  .prio-badge.med{background:var(--amber-soft);color:#8a6408}
  .prio-badge.low{background:var(--green-soft);color:var(--green)}
  /* ---------- Accordion tasks (popup υπαλλήλου) ---------- */
  .acc{border-bottom:1px solid var(--border);border-left:4px solid transparent;background:#fff;
    transition:background var(--tr-in,260ms) ease,box-shadow var(--tr-in,260ms) ease,
      border-left-color var(--tr-in,260ms) ease,opacity var(--tr-in,260ms) ease,
      filter var(--tr-in,260ms) ease}
  .acc:last-child{border-bottom:none}
  .acc:not(.open){opacity:.92}
  .acc-h{display:flex;align-items:center;gap:11px;padding:11px 16px;cursor:pointer}
  .acc:not(.open) .acc-h:hover{background:#fafbfd;opacity:1}
  .acc-h .chev{margin-left:2px;color:var(--muted);flex:none;
    transition:transform var(--tr-in,260ms) var(--tr-ein,cubic-bezier(.34,1.2,.4,1)),background .2s,color .2s;display:flex;width:22px;height:22px;border-radius:7px;background:var(--bg);align-items:center;justify-content:center}
  .acc.open{border-left-color:var(--accent);background:#fff7f2;box-shadow:0 2px 12px rgba(232,98,45,.12);opacity:1}
  .acc.open .acc-h{background:linear-gradient(90deg,#fdeee6,#fff7f2 70%)}
  .acc.open .acc-h .tt{color:#b34a17}
  .acc.open .acc-h .chev{transform:rotate(90deg);color:#fff;background:var(--accent)}
  /* ---- Ξεδίπλωμα ----
     grid 0fr→1fr: κινείται ΟΠΟΙΟΔΗΠΟΤΕ ύψος περιεχομένου, χωρίς μαγικά
     max-height που είτε κόβουν το περιεχόμενο είτε αργούν στην αρχή.
     Ίδιοι χρόνοι/καμπύλη με το πλαϊνό μενού (--tr-in/--tr-ein) ώστε όλη
     η εφαρμογή να κινείται το ίδιο — και να σέβεται τη ρύθμιση God Mode. */
  .acc-b{display:grid;grid-template-rows:0fr;opacity:0;
    transition:grid-template-rows var(--tr-in,260ms) var(--tr-ein,cubic-bezier(.4,0,.2,1)),
      opacity calc(var(--tr-in,260ms) * .65) ease}
  .acc.open .acc-b{grid-template-rows:1fr;opacity:1}
  .acc-bi{min-height:0;overflow:hidden;padding:12px 16px 16px;
    background:#fffdfb;border-top:1px dashed #f0cbb4}
  /* Το περιεχόμενο «ανεβαίνει» λίγο καθώς ξεδιπλώνεται — δίνει την αίσθηση
     ότι βγαίνει από μέσα, αντί να εμφανίζεται στο κενό. */
  .acc-bi>*{transform:translateY(-6px);opacity:.35;
    transition:transform var(--tr-in,260ms) var(--tr-ein,cubic-bezier(.4,0,.2,1)),
      opacity var(--tr-in,260ms) ease}
  .acc.open .acc-bi>*{transform:none;opacity:1}

  /* ---- Εστίαση: το ανοιχτό μπροστά, τα υπόλοιπα υποχωρούν ----
     ΟΧΙ blur στο κείμενο: σε μικρά μεγέθη διαβάζεται σαν σφάλμα render και
     κοστίζει σε GPU. Το ίδιο αποτέλεσμα το δίνουν διαφάνεια + ξεθώριασμα
     χρώματος, που παραμένουν ευανάγνωστα και επανέρχονται στο hover. */
  .acc-list.has-open .acc:not(.open){opacity:.42;filter:saturate(.3)}
  .acc-list.has-open .acc:not(.open):hover{opacity:.9;filter:none}
  .acc-list.has-open .tg-hd{opacity:.5;transition:opacity var(--tr-in,260ms) ease}
  .acc-list.has-open .tg-hd:hover{opacity:1}
  .acc-list.has-open .acc.open{box-shadow:0 6px 26px rgba(232,98,45,.22);
    border-left-width:5px;position:relative;z-index:1}

  
  /* Γέφυρα προς το πλήρες παράθυρο: μέσα στο ακορντεόν δεν υπάρχει πίνακας
     kanban (επίτηδες — θα το έπνιγε), οπότε λέμε πού είναι και δίνουμε κουμπί. */
  .acc-open{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;
    padding:9px 11px;border:1px solid #f0cbb4;border-radius:11px;background:#fff}
  .acc-open span{flex:1;min-width:170px;font-size:11.5px;color:var(--muted);
    display:flex;align-items:center;gap:6px;line-height:1.45}
  .acc-open .btn{flex:none}

  /* Σεβασμός στη ρύθμιση «χωρίς κίνηση» (God Mode) και στη συσκευή:
     το ακορντεόν ανοίγει ακαριαία, χωρίς να χάνεται τίποτα. */
  body.tr-off .acc,body.tr-off .acc-b,body.tr-off .acc-bi>*,
  body.tr-off .acc-h .chev,body.tr-off .acc-list.has-open .tg-hd{transition:none}
  @media (prefers-reduced-motion:reduce){
    .acc,.acc-b,.acc-bi>*,.acc-h .chev,.acc-list.has-open .tg-hd{transition:none!important}
  }
/* ---------- Tabs μέσα στο task modal ---------- */
  .tabbar{display:flex;gap:6px;border-bottom:2px solid var(--border);margin:16px 0 12px}
  .tbtn{border:none;background:none;padding:9px 14px;font-size:13px;font-weight:700;color:var(--muted);border-bottom:2.5px solid transparent;margin-bottom:-2px;display:flex;align-items:center;gap:6px;cursor:pointer}
  .tbtn:hover{color:var(--text)}
  .tbtn.active{color:var(--accent);border-bottom-color:var(--accent)}
  .dotN{width:9px;height:9px;border-radius:50%;background:var(--red);display:inline-block;box-shadow:0 0 0 3px #fdeaea}

    /* ---------- Kanban board (μέσα στο task) ----------
     Κεφαλίδα στήλης = συμπαγής χρωματιστή μπάρα που δηλώνει την ΚΑΤΑΣΤΑΣΗ.
     Το χρώμα ορίζεται από τη ΘΕΣΗ της στήλης (kbColTone στο 12-kanban), όχι
     από το όνομά της — οι στήλες μετονομάζονται/προστίθενται από τον χρήστη.
     Μεταβλητή --kbc ανά στήλη → όλα τα υπόλοιπα (μετρητής, hover, κάρτες)
     διαβάζουν από εκεί, άρα νέα κατάσταση = 1 γραμμή CSS. */
  .kb-top{display:flex;align-items:center;gap:10px;margin-bottom:8px}
  .kb-top .id2{color:var(--muted);font-size:11.5px}
  .kb{display:flex;gap:10px;overflow-x:auto;padding:12px;background:#f3f5f9;border-radius:12px;align-items:flex-start}

  .kb-col{flex:0 0 178px;background:#e9edf3;border-radius:11px;display:flex;flex-direction:column;
    max-height:330px;overflow:hidden;transition:.15s;--kbc:#64748b;--kbc-d:#3f4a5c}
  .kb-todo{--kbc:#64748b;--kbc-d:#3f4a5c}
  .kb-prog{--kbc:#e09c1a;--kbc-d:#8a5f06}
  .kb-rev{--kbc:#6d3fd4;--kbc-d:#4b2a94}
  .kb-done{--kbc:#1e9e5a;--kbc-d:#12603a}
  .kb-col.done{background:#e2f3e9}

  /* Κεφαλίδα: γεμάτο χρώμα + λευκά γράμματα (μοτίβο καρτών dashboard) */
  .kb-head{background:var(--kbc);color:#fff;font-size:11px;font-weight:800;letter-spacing:.3px;
    padding:7px 9px;display:flex;align-items:center;gap:6px;flex:none;text-transform:uppercase;
    line-height:1.25;box-shadow:inset 0 -1px 0 rgba(0,0,0,.08)}
  .kb-head svg{flex:none;opacity:.95}
  .kb-cname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .kb-cn{flex:none;font-weight:800;background:rgba(255,255,255,.26);border-radius:7px;
    padding:1px 7px;font-size:10.5px;letter-spacing:0}
  .kb-colx{border:none;background:none;color:#fff;cursor:pointer;opacity:0;transition:.15s;
    display:flex;padding:2px 3px;border-radius:5px;margin-left:1px;flex:none}
  .kb-col:hover .kb-colx{opacity:.8}
  .kb-colx:hover{background:rgba(255,255,255,.25);opacity:1}

  .kb-body{padding:8px;display:flex;flex-direction:column;gap:7px;overflow-y:auto;min-height:0;flex:1}

  .kb-card{background:#fff;border-radius:9px;padding:9px 10px;box-shadow:0 1px 3px rgba(21,36,59,.12);
    cursor:pointer;transition:transform .15s,box-shadow .15s}
  .kb-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(21,36,59,.16)}
  .kb-card.done{outline:1.5px solid #bfe6cf}
  .kb-labels{display:flex;gap:3px;margin-bottom:6px}
  .kb-label{width:24px;height:5px;border-radius:3px;display:inline-block}
  .kb-label.big{width:34px;height:8px}
  .kb-title{font-size:12px;font-weight:600;line-height:1.35}
  .kb-ok{color:var(--green);vertical-align:-1px}
  /* Μπάρα προόδου checklist: η μόνη προσθήκη που δίνει νέα πληροφορία με μια ματιά */
  .kb-cbar{height:4px;background:#eef1f6;border-radius:3px;overflow:hidden;margin-top:8px}
  .kb-cbar i{display:block;height:100%;border-radius:3px;background:var(--kbc);transition:width .25s}
  .kb-meta{display:flex;align-items:center;margin-top:7px;min-height:16px}
  .kb-check{font-size:10px;font-weight:700;color:var(--muted);background:var(--bg);border-radius:6px;padding:1px 6px;display:inline-flex;align-items:center;gap:3px}
  .kb-check.full{background:var(--green-soft);color:var(--green)}
  /* Ανατεθειμένη κάρτα: ανήκει στην ομάδα — δεν σέρνεται, δείχνει ποιος & πόσο */
  /* ανατεθειμένη κάρτα = τιρκουάζ, ίδιο χρώμα με το παράθυρο που ανοίγει */
  .kb-card.kb-deleg{background:linear-gradient(180deg,#f2fbf9,#e6f6f3);outline:1.5px solid #a7ded5}
  .kb-card.kb-deleg.done{outline:1.5px solid #bfe6cf}
  .kb-who{display:flex;align-items:center}
  .kb-who .avatar{margin-right:-6px;box-shadow:0 0 0 2px #fff}
  .kb-who .avatar:last-child{margin-right:0}
  .kb-pct{margin-left:auto;font-size:10px;font-weight:800;color:var(--kbc-d);
    background:#fff;border-radius:6px;padding:1px 6px}
  .kb-pct.full{background:var(--green-soft);color:var(--green)}
  .kb-arrows{margin-left:auto;display:flex;gap:3px;opacity:0;transition:.15s}
  .kb-card:hover .kb-arrows{opacity:1}
  .kb-arrows button{border:none;background:var(--bg);border-radius:6px;width:20px;height:20px;font-size:13px;
    color:var(--kbc-d);cursor:pointer;line-height:1;font-weight:700}
  .kb-arrows button:hover{background:var(--kbc);color:#fff}
  .kb-add{border:1.5px dashed #c9d2e0;background:none;border-radius:8px;padding:6px;font-size:11px;font-weight:600;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:4px;flex:none}
  .kb-add:hover{border-color:var(--kbc);color:var(--kbc-d);background:rgba(255,255,255,.55)}
  .kb-form{display:flex;gap:5px;flex:0 0 178px;align-items:center}
  .kb-form input{flex:1;border:1.5px solid var(--accent);border-radius:8px;padding:7px 9px;font-size:12px;outline:none;min-width:0}
/* ---------- Card modal (2ο επίπεδο) ---------- */
  .ce{cursor:text;border-radius:8px}
  .ce:hover{outline:1.5px dashed #c9d2e0;outline-offset:3px}
  .cd-in{width:100%;font-size:15px;font-weight:700;border:1.5px solid var(--accent);border-radius:8px;padding:7px 10px;outline:none;font-family:inherit}
  .cd-bar{height:8px;background:var(--bg);border-radius:4px;overflow:hidden;margin-bottom:10px}
  .cd-bar i{display:block;height:100%;border-radius:4px;transition:width .25s}
  .cd-check{display:flex;align-items:center;gap:9px;padding:6px 4px;border-radius:7px}
  .cd-check:hover{background:var(--bg)}
  .cd-check input{width:16px;height:16px;accent-color:var(--green);flex:none;cursor:pointer}
  .cd-check span{flex:1;font-size:13px}
  .cd-check span.done{text-decoration:line-through;color:var(--muted)}
  .cd-del{border:none;background:none;color:var(--muted);opacity:0;cursor:pointer;display:flex}
  .cd-check:hover .cd-del{opacity:.8}
  .cd-labels{display:flex;gap:8px}
  .cd-sw{width:38px;height:26px;border-radius:8px;border:2.5px solid transparent;cursor:pointer;display:grid;place-items:center;color:#fff;transition:.15s}
  .cd-sw:hover{transform:scale(1.08)}
  .cd-sw.on{border-color:var(--navy)}
  .kind-seg{display:flex;gap:10px;margin-top:6px}
  .kind-card{flex:1;border:2px dashed #c9d2e0;background:#fff;border-radius:12px;padding:12px 13px;cursor:pointer;text-align:left;transition:.15s;font-family:inherit}
  .kind-card b{display:flex;align-items:center;gap:6px;font-size:13px;margin-bottom:4px;color:var(--text)}
  .kind-card span{font-size:11px;color:var(--muted);line-height:1.45;display:block}
  .kind-card:hover{border-color:var(--accent)}
  .kind-card.sel{border:2px solid var(--accent);background:var(--accent-soft);box-shadow:0 0 0 3px rgba(232,98,45,.16)}
  .kind-card.sel b{color:#b34a17}
  .simple-wrap{background:#f8faf9;border:1px solid var(--border);border-radius:12px;padding:18px;text-align:center}
  .btn-done{background:var(--green);color:#fff;border:none;border-radius:12px;padding:13px 30px;font-size:15px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 14px rgba(30,158,90,.35);transition:.15s}
  .btn-done:hover{background:#177a46;transform:translateY(-2px)}
  .done-banner{background:var(--green-soft);color:var(--green);border-radius:12px;padding:16px;font-size:15px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:8px}
  /* ---------- Attachments ---------- */
  .att-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:10px;margin-top:4px}
  .att{min-width:0}
  .att-th{display:block;height:72px;border-radius:9px;overflow:hidden;background:var(--bg);position:relative;border:1px solid var(--border);text-decoration:none}
  .att-th img,.att-th video{width:100%;height:100%;object-fit:cover;display:block}
  .att-th:hover{border-color:var(--accent)}
  .att-dl{position:absolute;inset:0;display:grid;place-items:center;background:rgba(21,36,59,.55);color:#fff;opacity:0;transition:.15s}
  .att-th:hover .att-dl{opacity:1}
  .att-play{position:absolute;right:5px;bottom:5px;background:rgba(0,0,0,.6);color:#fff;border-radius:6px;padding:2px 4px;display:flex}
  .att-file{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:4px;color:var(--muted)}
  .att-file b{font-size:9.5px;letter-spacing:.5px}
  .att-nm{font-size:10.5px;font-weight:600;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .att-meta{font-size:9.5px;color:var(--muted);display:flex;align-items:center;gap:4px}
  .att-x{border:none;background:none;color:var(--muted);cursor:pointer;padding:0;display:flex;margin-left:auto}
  .att-x:hover{color:var(--red)}
  /* ---------- Επαφές ---------- */
  .ct-wrap{display:flex;min-height:0;flex:1}
  .ct-left{width:295px;flex:none;border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:0;background:#fafbfd}
  .ct-search{padding:10px 10px 8px}
  .ct-search input{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:9px 12px;outline:none;font-size:13px;background:#fff}
  .ct-search input:focus{border-color:var(--accent)}
  .ct-cattabs{display:flex;gap:4px;padding:0 10px 8px}
  .ct-cattabs button{flex:1;border:1px solid var(--border);background:#fff;border-radius:8px;padding:5px 4px;font-size:11px;font-weight:700;color:var(--muted);cursor:pointer}
  .ct-cattabs button.active{background:var(--navy);color:#fff;border-color:var(--navy)}
  .ct-tagbar{display:flex;gap:5px;flex-wrap:wrap;padding:0 10px 9px;border-bottom:1px solid var(--border)}
  .tagch{display:inline-flex;align-items:center;gap:4px;border:1.5px solid transparent;border-radius:8px;padding:2px 8px;font-size:10.5px;font-weight:700;color:#fff;cursor:pointer;opacity:.55;transition:.15s}
  .tagch.on,.tagch:hover{opacity:1}
  .tagch.on{border-color:var(--navy)}
  .tagch.add{background:#fff!important;color:var(--muted);border:1.5px dashed #c9d2e0;opacity:1}
  .tagch.add:hover{color:var(--accent);border-color:var(--accent)}
  .ct-list{flex:1;overflow-y:auto}
  .ct-item{display:flex;align-items:center;gap:10px;padding:10px 12px;cursor:pointer;border-bottom:1px solid #f0f2f7;border-left:3px solid transparent;background:#fff}
  .ct-item:hover{background:var(--bg)}
  .ct-item.sel{background:var(--accent-soft);border-left-color:var(--accent)}
  .ct-item .cn{font-size:12.5px;font-weight:700}
  .ct-item .cs{font-size:10.5px;color:var(--muted);margin-top:1px}
  .ct-dots{margin-left:auto;display:flex;gap:3px;flex:none}
  /* Βελάκι «άνοιγμα καρτέλας» — μόνο σε κινητό (δες 36-mobile) */
  .ct-go{display:none;color:#b6c0d0;flex:none;margin-left:6px}
  .ct-dot{width:8px;height:8px;border-radius:50%}
  .ct-av{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#fff;font-size:12px;font-weight:800;flex:none}
  .ct-right{flex:1;overflow-y:auto;padding:18px 20px;min-width:0}
  .ct-kind{font-size:10px;font-weight:800;padding:3px 9px;border-radius:8px;text-transform:uppercase;letter-spacing:.5px}
  .ct-kind.business{background:var(--blue-soft);color:var(--blue)}
  .ct-kind.person{background:var(--green-soft);color:var(--green)}
  .ct-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
  /* ΚΛΑΣΕΙΣ, ΟΧΙ inline style: το inline νικά κάθε media query, οπότε τίποτα
     από αυτά δεν θα μπορούσε να αλλάξει σε κινητό (δες PROJECT-MAP «παγίδες»). */
  .ct-newbtn{margin-left:auto;flex:none}
  .ct-top{display:flex;align-items:flex-start;gap:13px}
  .ct-av-lg{width:52px;height:52px;font-size:17px}
  .ct-acts{display:flex;flex-direction:column;gap:6px;flex:none}
  /* Γρήγορες ενέργειες καρτέλας (κλήση/SMS/email/χάρτης) — βάση για ΟΛΕΣ τις
     οθόνες· σε ≤900px το 36-mobile τα κάνει πλέγμα με στοιβαγμένη ετικέτα. */
  .ct-qa{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 2px}
  .ct-qa-b{display:inline-flex;align-items:center;justify-content:center;gap:7px;
    padding:8px 14px;border-radius:11px;text-decoration:none;font-size:12px;font-weight:700;
    background:var(--bg);border:1px solid var(--border);color:#1c2e4a;cursor:pointer;transition:.15s}
  .ct-qa-b svg{width:16px;height:16px;flex:none}
  .ct-qa-b:hover{transform:translateY(-1px);box-shadow:0 4px 10px rgba(20,35,60,.13)}
  .ct-qa-b:active{transform:none;opacity:.75}
  .ct-qa-b.call{background:#e8f7ee;border-color:#bfe6ce;color:#12724a}
  .ct-qa-b.msg{background:linear-gradient(135deg,#f2efff,#eaf9f0);border-color:#d9d3f6;color:#3b2f7a}
  .ct-qa-b.mail{background:#fff4e5;border-color:#f6ddb8;color:#a35a06}
  .ct-qa-b.map{background:#f0ecff;border-color:#d8cffb;color:#4c1d95}
  .pp-call{text-decoration:none;color:var(--blue);white-space:nowrap}

  /* Πλήθος αποδεκτών πάνω στο κουμπί — δηλώνει ότι θα ρωτήσει «ποιον;» */
  .ct-qa-b .ct-qa-n{font-style:normal;font-size:9.5px;font-weight:800;line-height:1;
    background:rgba(255,255,255,.8);border-radius:6px;padding:2px 5px;margin-left:1px}

  /* «Σε ποιον;» — λίστα αποδεκτών με ιδιότητα */
  .ct-pk{display:flex;flex-direction:column;gap:8px}
  .ct-pk-row{display:flex;align-items:center;gap:11px;padding:11px 13px;border:1.5px solid var(--border);
    border-radius:12px;background:#fff;text-decoration:none;color:inherit;transition:.15s}
  a.ct-pk-row:hover{border-color:var(--accent);background:var(--accent-soft);transform:translateY(-1px)}
  .ct-pk-av{width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center;
    background:var(--navy);color:#fff;font-size:12px;font-weight:800}
  .ct-pk-t{flex:1;min-width:0}
  .ct-pk-t b{display:block;font-size:13px;color:#16233a}
  .ct-pk-t span{display:block;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ct-pk-go{color:#b6c0d0;flex:none;display:flex}
  .ct-pk-ch{display:flex;gap:6px;flex:none}
  .ct-pk-b{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    min-width:60px;padding:7px 8px 6px;border-radius:11px;flex:none;
    border:1.5px solid var(--border);background:#fff;transition:.15s;text-decoration:none}
  .ct-pk-b span{font-size:9.5px;font-weight:800;line-height:1;color:var(--muted);letter-spacing:.1px}
  .ct-pk-b:hover{transform:translateY(-1px)}
  .ct-pk-b.viber:hover{border-color:#7360F2;box-shadow:0 5px 12px rgba(115,96,242,.22)}
  .ct-pk-b.wa:hover{border-color:#25D366;box-shadow:0 5px 12px rgba(37,211,102,.22)}
  .ct-pk-b.sms:hover{border-color:#2e6fd8;box-shadow:0 5px 12px rgba(46,111,216,.22)}
  .ct-pk-b.viber:hover span{color:#7360F2}
  .ct-pk-b.wa:hover span{color:#1a9c4b}
  .ct-pk-b.sms:hover span{color:#2e6fd8}

  /* Επιλογή καναλιού μηνύματος (Viber / WhatsApp / SMS) — modalRoot2 */
  .ct-msg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .ct-msg-b{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:7px;
    padding:16px 8px 13px;border-radius:14px;text-decoration:none;text-align:center;
    border:1.5px solid var(--border);background:#fff;transition:.16s}
  .ct-msg-b b{font-size:13px;color:#16233a}
  .ct-msg-b span{font-size:10.5px;color:var(--muted);line-height:1.35}
  .ct-msg-b:hover{transform:translateY(-2px)}
  .ct-msg-b.viber:hover{border-color:#7360F2;box-shadow:0 8px 18px rgba(115,96,242,.22)}
  .ct-msg-b.wa:hover{border-color:#25D366;box-shadow:0 8px 18px rgba(37,211,102,.22)}
  .ct-msg-b.sms:hover{border-color:#2e6fd8;box-shadow:0 8px 18px rgba(46,111,216,.22)}
  .ct-msg-b:active{transform:none;opacity:.8}
  .ct-msg-note{margin-top:13px;font-size:11px;color:var(--muted);display:flex;align-items:center;gap:6px}

  /* Αντιγραφή πεδίου με ένα κλικ */
  .ct-fields .info-cell.copyable{cursor:pointer;transition:.14s}
  .ct-fields .info-cell.copyable:hover{background:var(--accent-soft)}
  .ct-fields .cp-ic{display:inline-flex;vertical-align:-2px;margin-left:6px;color:var(--muted);opacity:0;transition:.14s}
  .ct-fields .info-cell.copyable:hover .cp-ic{opacity:.85}
  .ct-2col{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .ct-addp{width:100%}
  .ct-noterow{padding:0 0 10px;border:none;gap:7px;flex-wrap:wrap}
  .ct-noterow input{flex:2;min-width:180px}
  .ct-noterow select{flex:1;min-width:120px;border:1px solid var(--border);border-radius:9px;padding:8px}
  .ct-persons .pers{display:flex;align-items:center;gap:10px;background:var(--bg);border-radius:10px;padding:9px 12px;margin-bottom:7px}
  .ct-persons .pers b{font-size:12.5px}
  .ct-persons .pers .pt{font-size:10.5px;color:var(--muted)}
  .ct-persons .pers .pp{margin-left:auto;font-size:12px;font-weight:700;color:var(--blue)}
  /* timeline */
  .tl{position:relative;margin:8px 0 0 6px;padding-left:18px;border-left:2px solid var(--border)}
  .tl-item{position:relative;padding:0 0 14px}
  .tl-item::before{content:"";position:absolute;left:-24.5px;top:3px;width:11px;height:11px;border-radius:50%;background:var(--tlc,var(--accent));border:2.5px solid #fff;box-shadow:0 0 0 2px rgba(20,35,60,.08)}
  .tl-item .tld{font-size:10.5px;color:var(--muted);font-weight:700}
  .tl-item .tlw{font-size:12px;font-weight:700;color:var(--tlc,var(--blue));margin:1px 0;display:flex;align-items:center;gap:5px}
  .tl-item .tlw svg{flex:none}

  /* ---- Διαχωρισμός περιοχών στην καρτέλα ----
     Τα «στοιχεία επαφής» και το «timeline» είναι δύο διαφορετικά πράγματα:
     το πρώτο είναι σταθερά πεδία, το δεύτερο ροή γεγονότων. Χωρίς οπτικό
     όριο μπερδεύονται. Ετικέτα ενότητας + κλειστό πάνελ για το timeline. */
  .ct-lbl{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:800;letter-spacing:.7px;
    text-transform:uppercase;color:var(--muted);margin:16px 0 7px;padding-top:14px;border-top:1px solid var(--border)}
  .ct-lbl svg{opacity:.75}
  .ct-panel{border:1px solid var(--border);border-radius:14px;background:#fff;overflow:hidden;
    margin-top:18px;box-shadow:0 1px 3px rgba(20,35,60,.05)}
  .ct-panel-h{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:11px 14px;
    background:linear-gradient(135deg,#eef3fb,#e7eefa);border-bottom:1px solid #dbe4f2}
  .ct-panel-h h3{margin:0;font-size:13px;font-weight:800;color:#16233a;display:flex;align-items:center;gap:7px}
  .ct-panel-h h3 svg{color:var(--accent)}
  .ct-panel-h .cnt{font-size:10.5px;font-weight:800;background:#fff;color:var(--accent);
    border:1px solid #cfdef7;border-radius:7px;padding:1px 7px}
  .ct-panel-b{padding:13px 14px 4px;background:#fcfdff}

  /* Φίλτρο timeline ανά είδος επικοινωνίας */
  .ct-tlf{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 11px}
  .ct-tlf-b{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:#fff;font-family:inherit;
    border-radius:999px;padding:4px 11px;font-size:11.5px;font-weight:700;color:var(--muted);cursor:pointer;transition:.14s}
  .ct-tlf-b:hover{color:var(--accent);border-color:var(--accent)}
  .ct-tlf-b.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .ct-tlf-b i{font-style:normal;font-size:10px;font-weight:800;background:var(--bg);color:var(--muted);border-radius:6px;padding:1px 5px}
  .ct-tlf-b.on i{background:rgba(255,255,255,.22);color:#fff}

  /* «Τελευταία επικοινωνία» — παράγωγο των καταγραφών */
  .ct-last{flex:none;margin-left:6px;font-size:9.5px;font-weight:800;padding:2px 6px;border-radius:7px;white-space:nowrap}
  .ct-last.ok{background:#e8f7ee;color:#12724a}
  .ct-last.warn{background:#fff4e5;color:#a35a06}
  .ct-last.old{background:#fdeceb;color:#b3261e}
  .ct-last.none{background:transparent;color:#c3ccd9;font-weight:700}
  .ct-last-inline{margin-left:auto;font-size:10.5px;font-weight:700;color:var(--muted)}
  .ct-form .ct-hint{font-size:10.5px;color:var(--muted);margin-top:5px;line-height:1.45}
  .tl-item .tlt{font-size:12.5px;line-height:1.5;background:var(--bg);border-radius:9px;padding:8px 11px;margin-top:3px}
  .ct-form label{display:block;font-size:12px;font-weight:700;margin:11px 0 4px}
  .ct-form input,.ct-form textarea,.ct-form select{width:100%;border:1px solid var(--border);border-radius:9px;padding:8px 11px;outline:none;background:#fff}
  .ct-form input:focus,.ct-form textarea:focus{border-color:var(--accent)}
  .ct-prow{display:grid;grid-template-columns:1.05fr .85fr .8fr 1fr 26px;gap:6px;margin-bottom:7px;align-items:center}
  .ct-tagrow{display:flex;align-items:center;gap:7px;padding:0 10px 9px;border-bottom:1px solid var(--border)}
  .ct-tagrow select{flex:1;border:1px solid var(--border);border-radius:8px;padding:6px 8px;font-size:11.5px;outline:none;background:#fff;min-width:0}
  .tagadd{width:28px;height:28px;flex:none;border-radius:8px;border:1.5px dashed #c9d2e0;background:#fff;color:var(--muted);cursor:pointer;display:grid;place-items:center}
  .tagadd:hover{color:var(--accent);border-color:var(--accent)}
  .ct-tagnew{display:flex;gap:5px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--border);background:#fff}
  .ct-tagnew input{flex:1;border:1.5px solid var(--accent);border-radius:8px;padding:5px 8px;font-size:11px;outline:none;min-width:0}
  .palette{display:flex;gap:6px}
  .palette button{width:24px;height:24px;border-radius:7px;border:2.5px solid transparent;cursor:pointer}
  .palette button.on{border-color:var(--navy)}
  .ov2{background:rgba(15,23,40,.55);animation:fadeIn .15s}
  @keyframes fadeIn{from{opacity:0}to{opacity:1}}

  /* ---------- Login ---------- */
  .login-ov{position:fixed;inset:0;z-index:400;background:linear-gradient(115deg,#141f35,#1d3050 55%,#3d2b73);display:grid;place-items:center;padding:20px}
  .login-card{background:#fff;border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.5);padding:30px 30px 22px;width:min(410px,94vw);text-align:center}
  .login-card h1{font-size:18px}
  .login-card p{font-size:12px;color:var(--muted);margin-top:4px}
  .login-card input{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:11px 13px;margin-top:10px;outline:none;font-size:14px}
  .login-card input:focus{border-color:var(--accent)}
  .li-err{color:var(--red);font-size:12px;margin-top:10px;min-height:15px}
    /* Επιλογή desktop notifications στο login */
  .li-push{display:flex;gap:9px;align-items:flex-start;text-align:left;margin-top:12px;background:rgba(124,58,237,.06);
    border:1px solid rgba(124,58,237,.22);border-radius:10px;padding:10px 12px;font-size:11px;color:var(--muted);line-height:1.55;cursor:pointer}
  .li-push input{width:16px;height:16px;margin-top:1px;accent-color:#7c3aed;cursor:pointer;flex:none}
  .li-push b{color:var(--text);font-size:12px;display:inline-flex;align-items:center;gap:5px}
  .li-push-tag{background:linear-gradient(120deg,#6d28d9,#c026d3);color:#fff;font-size:9px;font-weight:800;
    text-transform:uppercase;letter-spacing:.4px;border-radius:999px;padding:1px 7px}
/* ---------- Notification banners (macOS-style) ---------- */
  /* Το bannerRoot ζει ΜΕΣΑ στο dock: η ειδοποίηση είναι προέκταση του σχήματός του */
  #bannerRoot{position:absolute;bottom:calc(100% - 2px);left:50%;width:0;height:0;pointer-events:none;z-index:3}
  .bn{pointer-events:auto;position:absolute;bottom:0;left:50%;width:384px;max-width:88vw;
    background:rgba(255,255,255,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    border:1px solid rgba(21,36,59,.13);border-radius:18px;box-shadow:0 12px 34px rgba(21,36,59,.22);
    padding:13px 15px;display:flex;gap:12px;align-items:flex-start;cursor:pointer;
    transform-origin:50% 100%;transform:translateX(-50%) scaleY(.08);opacity:0;
    transition:transform .48s cubic-bezier(.22,1.3,.32,1),opacity .32s ease,bottom .38s cubic-bezier(.3,1.2,.4,1)}
  .bn.in{transform:translateX(-50%) scaleY(1);opacity:1}
  /* το κάτω banner "φυτρώνει" από το dock: ίσιωμα βάσης, χωρίς κουτάκια */
  .bn:last-child{border-bottom-left-radius:8px;border-bottom-right-radius:8px;border-bottom-color:rgba(21,36,59,.05)}
  /* pop: "σκάει" σαν φούσκα */
  @keyframes bnPop{0%{transform:translateX(-50%) scale(1);opacity:1}45%{transform:translateX(-50%) scale(1.14);opacity:.85}100%{transform:translateX(-50%) scale(1.45);opacity:0;filter:blur(2px)}}
  .bn.pop{animation:bnPop .3s ease-out forwards}
  /* Το dock "ζωντανεύει" όταν έρχεται ειδοποίηση */
  @keyframes dockPulse{0%{transform:translateX(-50%) scale(1)}30%{transform:translateX(-50%) translateY(-8px) scale(1.035)}62%{transform:translateX(-50%) translateY(2px) scale(.99)}100%{transform:translateX(-50%) scale(1)}}
  .dock.alive{animation:dockPulse .72s cubic-bezier(.34,1.56,.64,1)}
  .dock.glow{box-shadow:0 12px 34px rgba(21,36,59,.24),0 0 34px var(--bn-glow,rgba(232,98,45,.4));border-top-color:transparent;transition:box-shadow .45s ease,border-color .3s ease}
  .bn-ic{width:43px;height:43px;border-radius:12px;display:grid;place-items:center;color:#fff;flex:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
  .bn-t{min-width:0;cursor:pointer;flex:1}
  .bn-t b{font-size:13.5px;display:block;margin-bottom:2px}
  .bn-t span{font-size:12.5px;color:#414d66;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5}
  .bn-time{font-size:9px;color:var(--muted);opacity:.7;flex:none;margin-top:2px}
  .bn-x{position:absolute;top:-7px;left:-7px;width:20px;height:20px;border-radius:50%;border:1px solid var(--border);background:#fff;color:var(--muted);display:grid;place-items:center;cursor:pointer;opacity:0;transition:.15s;box-shadow:0 2px 7px rgba(0,0,0,.18);padding:0}
  .bn:hover .bn-x{opacity:1}
  .bn-x:hover{color:var(--red);transform:scale(1.1)}
  /* Διακριτικό bubble ΚΑΤΩ ΔΕΞΙΑ. Ήταν κεντραρισμένο στο `bottom:22px`, δηλαδή
     ακριβώς πάνω στο dock (`.dock` bottom:14px, κεντραρισμένο) — σκέπαζε αυτό
     που μόλις είχε συμβεί (π.χ. το εικονίδιο ελαχιστοποίησης που προσγειωνόταν).
     Μπαίνει έξω από τη διαδρομή του ματιού, με μικρότερα γράμματα και μια
     πράσινη κουκκίδα «έγινε». Το `toast()` γράφει με textContent — το ::before
     είναι ψευδοστοιχείο, δεν σβήνεται. */
  .toast{position:fixed;bottom:18px;right:18px;left:auto;
    transform:translateY(10px) scale(.97);transform-origin:100% 100%;
    display:flex;align-items:center;gap:8px;
    background:rgba(24,40,66,.93);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.11);color:#fff;
    padding:8px 13px 8px 11px;border-radius:11px;font-size:12px;font-weight:600;line-height:1.35;
    max-width:min(310px,calc(100vw - 36px));z-index:200;
    box-shadow:0 6px 20px rgba(21,36,59,.3);opacity:0;pointer-events:none;
    transition:opacity .2s ease,transform .3s cubic-bezier(.22,1,.36,1)}
  .toast::before{content:"";width:6px;height:6px;border-radius:50%;background:#4ade80;flex:none;
    box-shadow:0 0 0 3px rgba(74,222,128,.17)}
  .toast.show{opacity:1;transform:translateY(0) scale(1)}
  @media (max-width:900px){ .hdr-ctrl label{display:none} }
/* ---------- Ανακοινώσεις & Συσκέψεις ---------- */
  .ev-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin-bottom:16px}
  .ev-card{position:relative;border-radius:14px;padding:14px 16px;color:#fff;display:flex;gap:12px;align-items:center;cursor:pointer;box-shadow:0 8px 22px rgba(49,46,129,.28);transition:transform .16s,box-shadow .16s;animation:evIn .35s ease}
  .ev-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(49,46,129,.36)}
  @keyframes evIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  .ev-ic{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.18);display:grid;place-items:center;flex:none}
  .ev-t{font-weight:800;font-size:13.5px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ev-s{font-size:11px;opacity:.85;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ev-chip{margin-left:auto;flex:none;font-size:10.5px;font-weight:800;padding:5px 11px;border-radius:20px;background:rgba(255,255,255,.22)}
  .ev-new{position:absolute;top:-7px;right:10px;background:#f59e0b;color:#fff;font-size:9px;font-weight:900;letter-spacing:.5px;padding:3px 9px;border-radius:10px;box-shadow:0 3px 8px rgba(0,0,0,.28);animation:evPulse 1.6s infinite}
  @keyframes evPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
  .am-dirs{max-height:210px;overflow-y:auto;border:1px solid var(--border);border-radius:10px;margin-top:2px;background:#fff}
  .am-dir{display:flex;align-items:center;gap:9px;padding:7px 11px;cursor:pointer;border-bottom:1px solid var(--border);font-size:12.5px}
  .am-dir:last-child{border-bottom:none}
  .am-dir:hover{background:var(--accent-soft)}
  .am-dir .bx{width:17px;height:17px;border:1.6px solid var(--border);border-radius:5px;display:grid;place-items:center;color:#fff;flex:none;background:#fff}
  .am-dir.on .bx{background:#4f46e5;border-color:#4f46e5}
  .am-tool{display:flex;gap:4px;margin:2px 0 6px}
  .am-tool button{border:1px solid var(--border);background:#fff;border-radius:7px;min-width:30px;height:28px;font-size:12.5px;cursor:pointer;color:var(--ink)}
  .am-tool button:hover{background:var(--accent-soft)}
  .am-body{border:1px solid var(--border);border-radius:10px;min-height:110px;max-height:220px;overflow-y:auto;padding:10px 12px;font-size:13px;outline:none;background:#fff;line-height:1.55}
  .am-body:focus{border-color:#4f46e5}
  .am-html ul{margin:6px 0 6px 18px}
  .am-html p{margin:0 0 7px}
  .am-lic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none}
  .am-hic{width:40px;height:40px;border-radius:11px;background:rgba(255,255,255,.18);display:grid;place-items:center;flex:none}
  .st-chip{font-size:10px;font-weight:800;padding:3px 9px;border-radius:20px;flex:none;white-space:nowrap}
  .st-acc{background:#e7f6ec;color:#1e9e5a}
  .st-pen{background:#fdf3dc;color:#b47d0e}
  .st-dec{background:#fdeaea;color:#c0392b}
  .am-dirs.tall{max-height:320px}
  .am-q{width:100%;padding:7px 11px;border:1px solid var(--border);border-radius:9px;font-size:12.5px;margin-top:2px;background:#fff;color:var(--ink)}
  .am-q:focus{outline:none;border-color:#7c3aed}
  .am-grp{position:sticky;top:0;z-index:1;background:#f4f2fb;color:#5b21b6;font-size:10.5px;font-weight:900;letter-spacing:.4px;text-transform:uppercase;padding:5px 11px;border-bottom:1px solid var(--border)}
  .notif .ic.ann{background:#e7e7fb;color:#4f46e5}
  .notif .ic.meet{background:#f0e7fb;color:#7c3aed}
/* =====================================================================
   ΧΡΗΣΗ ΒΑΣΗΣ ΔΕΔΟΜΕΝΩΝ — admin panel (μόνο Administration)
   Καθαρό, μοντέρνο, με radial gauges & διακριτικά "!" tooltips.
===================================================================== */
/* Generic presence badge πάνω σε avatar (ομάδα, λίστες προσωπικού κ.λπ.) */
.avwrap{position:relative;display:inline-flex;flex:none}
.avwrap .avdot{position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:50%;
  border:2px solid #fff;box-sizing:border-box;background:#c8cfda}
.avwrap .avdot.on{background:#16a34a}

/* Tabs ρυθμίσεων — segmented control (ξεκάθαρα εναλλάξιμα) */
.st-tabs{display:inline-flex;gap:5px;margin:4px 2px 18px;background:#e8edf4;border:1px solid #d5deea;
  border-radius:13px;padding:5px;box-shadow:inset 0 1px 2px rgba(15,23,42,.05)}
.st-tab{position:relative;display:inline-flex;align-items:center;gap:8px;border:none;background:transparent;
  padding:10px 20px;font-size:13.5px;font-weight:800;color:#5b6b82;cursor:pointer;border-radius:9px;transition:.16s}
.st-tab svg{opacity:.7;transition:.16s}
.st-tab:hover{color:#1c2637;background:rgba(255,255,255,.65)}
.st-tab:hover svg{opacity:1}
.st-tab.on{color:#fff;background:linear-gradient(135deg,#3a475f,#1c2637);
  box-shadow:0 3px 8px rgba(28,38,55,.28),0 1px 0 rgba(255,255,255,.4) inset}
.st-tab.on svg{opacity:1}
/* ≤560px: λωρίδα με οριζόντια κύλιση. Το flex:1 άφηνε min-width:auto στα tabs, οπότε οι
   μεγάλες ελληνικές ετικέτες ξεχείλιζαν ΟΛΗ τη σελίδα Ρυθμίσεων (522px σε οθόνη 390). */
@media(max-width:560px){
  .st-tabs{display:flex;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;
    scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .st-tabs::-webkit-scrollbar{display:none}
  .st-tab{flex:0 0 auto;min-width:0;justify-content:center;padding:10px 12px;font-size:12.5px}
}
/* Κλειδωμένα πεδία (διευθυντής): τμήμα & θέση δεν αλλάζουν από εδώ */
.st-lock{font-size:11.5px;line-height:1.7;color:var(--muted);background:var(--bg);
  border:1px solid var(--border);border-radius:8px;padding:9px 11px}
.st-lock svg{vertical-align:-2px;margin-right:4px}
.st-lock b{color:var(--text)}

.dbu-wrap{margin-top:16px}
.dbu-card{border-left:4px solid #4d5d7d}
.dbu-card .card-h{display:flex;align-items:center;gap:8px}
.dbu-refresh{margin-left:auto;display:inline-flex;align-items:center;gap:6px;
  border:1px solid var(--border);background:#fff;border-radius:8px;padding:6px 12px;
  font-size:12px;font-weight:600;color:#334155;cursor:pointer;transition:.15s}
.dbu-refresh:hover{background:#f1f5f9;border-color:#cbd5e1}
.dbu-body{padding:16px}
.dbu-loading,.dbu-msg{padding:34px 16px;text-align:center;color:var(--muted);font-size:13px}
.dbu-stamp{font-size:11px;color:var(--muted);margin:2px 2px 14px}
.dbu-stamp b{color:#475569;font-weight:700}

/* Προειδοποίηση υπέρβασης */
.dbu-alert{display:flex;gap:10px;align-items:flex-start;background:#fef2f2;border:1px solid #fecaca;
  color:#b91c1c;border-radius:12px;padding:12px 14px;font-size:12.5px;line-height:1.55;margin-bottom:14px}
.dbu-alert.warn{background:#fffbeb;border-color:#fde68a;color:#b45309}

/* Grids */
.dbu-gauges{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.dbu-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}
@media(max-width:820px){.dbu-gauges,.dbu-tiles{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.dbu-gauges,.dbu-tiles{grid-template-columns:1fr}}

/* Radial gauge card */
.dbu-g{position:relative;background:linear-gradient(180deg,#fff,#fbfcfe);border:1px solid var(--border);
  border-radius:16px;padding:18px 16px 16px;display:flex;flex-direction:column;align-items:center;text-align:center;
  box-shadow:0 1px 2px rgba(15,23,42,.04)}
.dbu-ring{--pct:0;--col:#3b82f6;width:118px;height:118px;border-radius:50%;
  background:conic-gradient(var(--col) calc(var(--pct)*1%),#eef2f7 0);
  display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.dbu-ring::after{content:"";position:absolute;width:88px;height:88px;border-radius:50%;background:#fff;
  box-shadow:inset 0 0 0 1px #eef2f7}
.dbu-ring .dbu-pct{position:relative;z-index:1;font-size:22px;font-weight:800;color:#1e293b;line-height:1}
.dbu-ring .dbu-pct small{display:block;font-size:10px;font-weight:600;color:var(--muted);margin-top:2px}
.dbu-g-lbl{font-size:13px;font-weight:800;color:#1e293b;display:flex;align-items:center;gap:6px}
.dbu-g-sub{font-size:11.5px;color:var(--muted);margin-top:3px}

/* Stat tiles */
.dbu-tile{background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px 16px;
  box-shadow:0 1px 2px rgba(15,23,42,.04)}
.dbu-tile .t-top{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#475569}
.dbu-tile .t-val{font-size:26px;font-weight:800;color:#1e293b;margin-top:8px;line-height:1}
.dbu-tile .t-note{font-size:11px;color:var(--muted);margin-top:5px}
.dbu-approx{display:inline-block;font-size:9.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;
  color:#7c5b12;background:#fef3c7;border-radius:6px;padding:2px 6px;margin-left:6px;vertical-align:middle}

/* Link-out κάρτα (egress / χρεώσεις) */
.dbu-linkcard{background:linear-gradient(120deg,#f8fafc,#eef2f9);border:1px dashed #c7d2e0;border-radius:14px;
  padding:16px;margin-top:14px}
.dbu-linkcard h4{margin:0 0 4px;font-size:13.5px;font-weight:800;color:#1e293b;display:flex;align-items:center;gap:6px}
.dbu-linkcard p{margin:0 0 12px;font-size:12px;color:var(--muted);line-height:1.55}
.dbu-lbtns{display:flex;gap:10px;flex-wrap:wrap}
.dbu-lbtn{display:inline-flex;align-items:center;gap:7px;background:#1c2637;color:#fff;text-decoration:none;
  border-radius:9px;padding:9px 14px;font-size:12px;font-weight:700;transition:.15s}
.dbu-lbtn:hover{background:#2d3b52}
.dbu-lbtn.alt{background:#fff;color:#334155;border:1px solid var(--border)}
.dbu-lbtn.alt:hover{background:#f1f5f9}

/* Πίνακες */
.dbu-tables{margin-top:16px;border:1px solid var(--border);border-radius:14px;overflow:hidden}
.dbu-tables summary{list-style:none;cursor:pointer;padding:12px 16px;font-size:13px;font-weight:800;color:#1e293b;
  display:flex;align-items:center;gap:8px;background:#fbfcfe}
.dbu-tables summary::-webkit-details-marker{display:none}
.dbu-tables summary .cnt{margin-left:auto;font-size:11px;color:var(--muted);font-weight:600}
.dbu-trow{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;
  padding:9px 16px;border-top:1px solid var(--border);font-size:12.5px}
.dbu-trow:nth-child(even){background:#fbfcfe}
.dbu-trow .nm{font-weight:600;color:#334155}
.dbu-trow .rw{color:var(--muted);font-variant-numeric:tabular-nums;min-width:74px;text-align:right}
.dbu-trow .sz{color:#475569;font-weight:700;font-variant-numeric:tabular-nums;min-width:64px;text-align:right}

/* ── Χρήση Εφαρμογής ── */
.au-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.au-range,.au-inner{display:inline-flex;gap:4px;background:#eef2f7;border:1px solid #d5deea;border-radius:11px;padding:4px}
.au-rbtn,.au-ibtn{border:none;background:transparent;padding:8px 15px;font-size:12.5px;font-weight:800;color:#5b6b82;cursor:pointer;border-radius:8px;transition:.15s}
.au-rbtn:hover,.au-ibtn:hover{background:#fff;color:#1c2637}
.au-rbtn.on{background:#1c2637;color:#fff;box-shadow:0 2px 6px rgba(28,38,55,.25)}
.au-ibtn.on{background:linear-gradient(135deg,#3a475f,#1c2637);color:#fff;box-shadow:0 2px 6px rgba(28,38,55,.25)}
.au-list{display:flex;flex-direction:column;gap:2px}
.au-row{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;cursor:pointer;transition:.12s}
.au-row:hover:not(.static){background:#f6f8fb}
.au-row.static{cursor:default}
.au-row.open{background:#f1f5f9}
.au-rank{width:22px;text-align:center;font-size:12.5px;font-weight:800;color:#94a3b8;flex:none}
.au-av{flex:none}
.au-main{flex:1;min-width:0}
.au-nm{font-size:13px;font-weight:700;color:#1e293b;margin-bottom:7px;display:flex;align-items:center;flex-wrap:wrap;gap:2px}
.au-bar{height:9px;background:#eef2f7;border-radius:6px;overflow:hidden}
.au-bar>i{display:block;height:100%;border-radius:6px;transition:width .45s cubic-bezier(.4,0,.2,1)}
.au-metric{flex:none;text-align:right;min-width:80px}
.au-metric b{display:block;font-size:13.5px;font-weight:800;color:#1e293b;font-variant-numeric:tabular-nums}
.au-metric span{font-size:11px;color:var(--muted);font-weight:600}
.au-chev{flex:none;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #94a3b8;transition:.18s}
.au-row.open .au-chev{transform:rotate(180deg)}
.au-row.static .au-chev{display:none}
.au-drill{padding:2px 12px 14px 46px;display:flex;flex-direction:column;gap:8px;animation:auIn .18s ease}
@keyframes auIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.au-mrow{display:grid;grid-template-columns:140px 1fr auto;gap:10px;align-items:center;font-size:12px}
.au-mnm{color:#475569;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.au-mbar{height:7px;background:#e9eef5;border-radius:5px;overflow:hidden}
.au-mbar>i{display:block;height:100%;background:linear-gradient(90deg,#7c93b5,#4d5d7d);border-radius:5px}
.au-mval{color:#475569;font-weight:700;font-variant-numeric:tabular-nums;min-width:62px;text-align:right}
.au-empty{color:var(--muted);font-size:12px;padding:2px 0}
@media(max-width:560px){.au-mrow{grid-template-columns:96px 1fr auto}.au-metric{min-width:64px}.au-controls{gap:8px}}

/* "!" info button + tooltip */
.dbu-i{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;
  border:1.4px solid #94a3b8;color:#64748b;font-size:10px;font-weight:800;cursor:pointer;line-height:1;
  font-family:Georgia,serif;flex:none;transition:.15s;background:#fff}
.dbu-i:hover{border-color:#475569;color:#334155;background:#f1f5f9}
.dbu-tipwrap{position:relative;display:inline-flex}
.dbu-tip{position:absolute;z-index:40;top:calc(100% + 8px);left:50%;transform:translateX(-50%);
  width:230px;background:#0f172a;color:#e2e8f0;border-radius:10px;padding:10px 12px;font-size:11.5px;
  font-weight:500;line-height:1.55;box-shadow:0 8px 24px rgba(15,23,42,.28);text-align:left;
  opacity:0;visibility:hidden;transition:.15s}
.dbu-tip::after{content:"";position:absolute;bottom:100%;left:50%;transform:translateX(-50%);
  border:6px solid transparent;border-bottom-color:#0f172a}
.dbu-tipwrap.open .dbu-tip{opacity:1;visibility:visible}
@media(max-width:560px){.dbu-tip{width:180px}}

/* ---------- God Mode ---------- */
.god-nav{color:#6d28d9;font-weight:700}
.god-nav .ico,.god-nav svg{color:#7c3aed}
.god-nav.active{background:linear-gradient(90deg,rgba(124,58,237,.16),rgba(192,38,211,.06));color:#6d28d9}
.gm-sec-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin:14px 4px 6px}
.gm-sec-title .cnt{background:#ede9fe;color:#6d28d9;border-radius:9px;padding:1px 7px;font-size:10px;margin-left:4px}
.gm-note{background:rgba(124,58,237,.07);border:1px solid rgba(124,58,237,.2);border-radius:9px;padding:9px 12px;margin:10px 14px;font-size:11.5px;color:#4c1d95;line-height:1.5}
.gm-row .gm-pv{background:linear-gradient(120deg,#6d28d9,#c026d3)}
/* Preview bar (fixed, πάνω από όλα) */
.preview-bar{position:fixed;top:0;left:0;right:0;height:34px;z-index:220;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;
  background:linear-gradient(120deg,#4c1d95,#7c3aed 60%,#c026d3);color:#fff;font-size:12px;box-shadow:0 2px 10px rgba(76,29,149,.4)}
.preview-bar .pv-l{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;white-space:nowrap}
.preview-bar .pv-role{opacity:.85}
.preview-bar .pv-ro{display:inline-flex;align-items:center;gap:3px;background:rgba(255,255,255,.2);border-radius:999px;padding:1px 8px;font-size:10.5px;font-weight:700}
.preview-bar .pv-exit{display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);color:#fff;
  border-radius:8px;padding:4px 11px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap}
.preview-bar .pv-exit:hover{background:rgba(255,255,255,.28)}
body.has-preview{padding-top:34px}
body.has-preview aside{top:34px;height:calc(100vh / var(--zf,1) - 34px)}

/* ---------- Push notifications toggle (popup προφίλ) ---------- */
.push-row{display:flex;align-items:center;gap:11px;margin-top:14px;padding:11px 13px;border:1px solid var(--border);
  border-radius:11px;background:rgba(124,58,237,.05)}
.push-row.push-denied{background:rgba(214,69,65,.06);border-color:rgba(214,69,65,.25)}
.push-ic{width:34px;height:34px;flex:none;border-radius:9px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(135deg,#6d28d9,#c026d3)}
.push-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.push-tx b{font-size:12.5px}
.push-tx span{font-size:11px;color:var(--muted);line-height:1.45}
.pswitch{flex:none;width:44px;height:25px;border-radius:999px;border:none;background:#c7ccd6;position:relative;cursor:pointer;transition:background .18s;padding:0}
.pswitch.on{background:linear-gradient(120deg,#6d28d9,#c026d3)}
.pswitch .pknob{position:absolute;top:3px;left:3px;width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:left .18s}
.pswitch.on .pknob{left:22px}
.push-test-btn{align-self:flex-start;margin-top:5px;display:inline-flex;align-items:center;gap:4px;background:rgba(124,58,237,.1);
  border:1px solid rgba(124,58,237,.3);color:#6d28d9;border-radius:7px;padding:3px 9px;font-size:11px;font-weight:700;cursor:pointer}
.push-test-btn:hover{background:rgba(124,58,237,.18)}
/* Χρήση AI — tiles */
.aiu-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}
.aiu-tile{background:#fff;border:1px solid var(--border);border-radius:12px;padding:13px 15px;display:flex;flex-direction:column;gap:3px;box-shadow:var(--shadow)}
.aiu-tile span{font-size:11px;color:var(--muted);font-weight:600}
.aiu-tile b{font-size:22px;font-weight:800;color:var(--text);line-height:1.1}
.aiu-tile i{font-size:10.5px;color:var(--muted);font-style:normal}
.aiu-tile.hi{background:linear-gradient(135deg,#f5f3ff,#eef2ff);border-color:#d9d0f5}
.aiu-tile.hi b{color:#5b3fd4}
@media(max-width:720px){ .aiu-tiles{grid-template-columns:1fr} }

/* ================= God Mode → «Μενού»: σειρά & ομαδοποίηση (module 47) ================= */
.nv-roles{display:inline-flex;gap:5px;background:#e8edf4;border:1px solid #d5deea;border-radius:11px;padding:4px;margin:2px 0 14px}
.nv-rl{border:none;background:none;font-family:inherit;font-size:12.5px;font-weight:700;color:var(--muted);
  padding:7px 15px;border-radius:8px;cursor:pointer}
.nv-rl.on{background:#fff;color:#4c1d95;box-shadow:0 1px 3px rgba(21,36,59,.14)}
.nv-styles{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:16px}
.nvs{display:flex;align-items:center;gap:11px;padding:10px 12px;border:1.5px solid var(--border);
  border-radius:12px;background:#fff;cursor:pointer;font-family:inherit;text-align:left}
.nvs:hover{border-color:#c4b5fd;background:#faf8ff}
.nvs.on{border-color:#6d28d9;background:#f5f1ff;box-shadow:0 0 0 3px rgba(109,40,217,.13)}
.nvs-vis{width:42px;flex:none;display:flex;flex-direction:column;gap:3px;background:#15243b;border-radius:7px;padding:6px 5px}
.nvs-vis i{display:block;height:4px;border-radius:2px;background:rgba(255,255,255,.55)}
.nvs-line{display:block;height:1px;background:rgba(255,255,255,.35);margin:3px 1px}
.nvs-gap{display:block;height:7px}
.nvs-box{display:block;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);
  border-radius:4px;padding:2px;margin-bottom:3px}
.nvs-box i{margin-bottom:2px}.nvs-box i:last-child{margin-bottom:0}
.nvs-tx b{display:block;font-size:12.5px;color:var(--text)}
.nvs-tx small{font-size:10.5px;color:var(--muted)}
.nv-cols{display:grid;grid-template-columns:1fr 236px;gap:16px;align-items:start}
@media(max-width:820px){.nv-cols{grid-template-columns:1fr}}
.nv-list{display:flex;flex-direction:column;gap:6px}
.nv-row{display:flex;align-items:center;gap:9px;padding:9px 11px;background:#fff;border:1px solid var(--border);
  border-radius:10px;cursor:grab;user-select:none}
.nv-row:hover{border-color:#c4b5fd;box-shadow:0 2px 8px rgba(76,29,149,.08)}
.nv-row .nv-h{color:#b9c2d2;font-size:13px;letter-spacing:-3px;flex:none;cursor:grab}
.nv-row .nv-ic{color:#6d28d9;display:grid;place-items:center;flex:none}
.nv-row .nv-l{flex:1;min-width:0;font-size:13px;font-weight:600;color:var(--text)}
.nv-cond{display:block;font-style:normal;font-size:10px;font-weight:500;color:var(--amber);margin-top:1px}
.nv-b{border:1px solid var(--border);background:#fff;border-radius:7px;width:26px;height:26px;flex:none;
  display:grid;place-items:center;cursor:pointer;color:var(--muted);font-size:12px;font-family:inherit}
.nv-b:hover{border-color:#6d28d9;color:#6d28d9;background:#f5f1ff}
.nv-b.danger:hover{border-color:var(--red);color:var(--red);background:#fdeaea}
.nv-row.nv-sep{background:#f5f1ff;border-style:dashed;border-color:#c4b5fd;padding:6px 11px}
.nv-sepline{flex:1;height:1px;background:#c4b5fd}
.nv-seplbl{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#6d28d9;flex:none}
.nv-dropend{border:1.5px dashed var(--border);border-radius:10px;padding:10px;text-align:center;
  font-size:11px;color:var(--muted)}
.nv-prevwrap{position:sticky;top:8px}
.nv-prevh{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-bottom:7px}
.nv-prev{background:var(--navy,#15243b);border-radius:14px;padding:12px 10px}
.nv-prev .nav-item{font-size:12.5px;padding:8px 10px;pointer-events:none}
.nv-prev .nav-item svg{width:13px;height:13px}
.nv-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px;padding-top:14px;
  border-top:1px solid var(--border)}
.nv-note{flex:1;min-width:200px;font-size:11px;color:var(--muted);display:flex;align-items:center;gap:5px}

/* ---------- Διαχείριση τμημάτων (51-departments) ---------- */
.dp-new{display:inline-flex;align-items:center;gap:5px;margin-left:8px;border:1px solid var(--border);border-radius:8px;
  padding:6px 11px;font-size:12px;font-weight:700;background:#fff;color:#1c2637;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s}
.dp-new:hover{background:#eef3fb;border-color:#c7dbfb}
.sp-dept .dp-a{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:0;border-radius:7px;
  background:rgba(255,255,255,.10);color:#cfe0f7;cursor:pointer;transition:background .15s,color .15s}
.sp-dept .dp-a:hover{background:rgba(255,255,255,.22);color:#fff}
.sp-dept .dp-a.dp-del:hover{background:rgba(239,68,68,.9);color:#fff}
.sp-dept .dp-off{background:transparent;color:rgba(255,255,255,.3);cursor:not-allowed}
.sp-dept .dp-off:hover{background:transparent;color:rgba(255,255,255,.3)}
.sp-dept .dp-lock{display:inline-flex;align-items:center;color:rgba(255,255,255,.45)}
.dp-arch{border-top:1px solid var(--border);padding:10px 16px 14px}
.dp-arch-h{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:8px}
.dp-arch-h .cnt{background:var(--border);color:var(--muted);border-radius:8px;padding:1px 7px;font-size:11px}
.dp-arch-row{display:flex;align-items:center;gap:8px;padding:6px 0}
.dp-arch-n{flex:1;min-width:0;font-size:13px;color:var(--muted);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dp-restore{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--border);border-radius:8px;padding:4px 10px;
  font-size:11px;font-weight:700;background:#fff;color:#1c2637;cursor:pointer}
.dp-restore:hover{background:#eef3fb;border-color:#c7dbfb}

/* ===== ΔΟΜΗ ΤΜΗΜΑΤΩΝ — γονικά & υποτμήματα (52-dept-tree.js) ===== */
.dp-new.dp-tree{margin-left:6px}
.dt-modal{max-width:560px}
/* κεφαλίδα τμήματος στη λίστα λογαριασμών: κουκκίδα χρώματος + εσοχή υποτμήματος */
.sp-dept .sp-dot{width:9px;height:9px;border-radius:50%;background:var(--dtc,#8fb2e6);flex:0 0 auto;
  box-shadow:0 0 0 2px rgba(255,255,255,.18)}
.sp-dept.sp-sub{padding-left:34px;background:#22374f}
.sp-dept.sp-sub::before{content:"";position:absolute;left:16px;top:50%;width:10px;height:1px;background:rgba(255,255,255,.3)}
.sp-dept.sp-sub{position:sticky}

/* --- popup δέντρου --- */
.dt-list{position:relative;border:1px solid var(--border);border-radius:10px;background:var(--card,#fff);
  max-height:min(54vh,520px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
.dt-row{display:flex;align-items:center;gap:9px;padding:9px 11px;border-bottom:1px solid var(--border);
  background:var(--card,#fff);user-select:none;transition:background .12s,padding-left .12s}
.dt-row:last-of-type{border-bottom:0}
.dt-row.dt-sub{padding-left:37px;background:rgba(120,140,170,.09)}
.dt-row.dt-sub::before{content:"";position:absolute;margin-left:-22px;width:11px;height:11px;
  border-left:1.5px solid rgba(120,140,170,.5);border-bottom:1.5px solid rgba(120,140,170,.5);
  border-radius:0 0 0 3px;transform:translateY(-3px)}
.dt-row.dt-dim{opacity:.45}
.dt-grip{display:inline-flex;flex-direction:column;justify-content:center;gap:2.5px;width:16px;height:20px;
  cursor:grab;flex:0 0 auto;touch-action:none;padding:0 2px}
.dt-grip:active{cursor:grabbing}
.dt-grip i{display:block;height:1.8px;border-radius:2px;background:var(--muted);opacity:.55}
.dt-dot{width:14px;height:14px;border-radius:50%;flex:0 0 auto;cursor:pointer;
  box-shadow:0 0 0 2px rgba(0,0,0,.06);transition:transform .12s}
.dt-dot:hover{transform:scale(1.18)}
.dt-n{font-size:13px;font-weight:700;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dt-badge{font-size:10px;font-weight:800;letter-spacing:.2px;padding:2px 7px;border-radius:7px;
  background:rgba(30,58,138,.1);color:#1e3a8a;flex:0 0 auto}
.dt-cnt{font-size:11px;font-weight:700;color:var(--muted);min-width:20px;text-align:right;flex:0 0 auto}
.dt-ind{display:none;position:absolute;left:0;right:0;height:2px;background:#2e6fd8;
  border-radius:2px;pointer-events:none;z-index:3;transition:margin-left .1s}
.dt-ind::before{content:"";position:absolute;left:-1px;top:-3px;width:8px;height:8px;border-radius:50%;background:#2e6fd8}
.dt-hint{font-size:11.5px;color:var(--muted);line-height:1.65;margin:10px 2px 4px}
/* παλέτα χρωμάτων */
.dt-sw{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:9px 11px 9px 37px;
  background:rgba(120,140,170,.13);border-bottom:1px solid var(--border)}
.dt-swc{width:20px;height:20px;border-radius:6px;cursor:pointer;box-shadow:0 0 0 2px rgba(0,0,0,.06);transition:transform .12s}
.dt-swc:hover{transform:scale(1.12)}
.dt-swc.on{box-shadow:0 0 0 2px #fff,0 0 0 4px #2e6fd8}
.dt-swr{margin-left:auto;border:1px solid var(--border);background:var(--card,#fff);border-radius:7px;
  padding:4px 10px;font-size:11px;font-weight:700;color:var(--muted);cursor:pointer}
.dt-swr:hover{color:var(--ink)}
@media(max-width:680px){
  .dt-modal{max-width:calc(100vw - 20px)}
  .dt-row{padding:11px 10px;gap:8px}
  .dt-row.dt-sub{padding-left:32px}
  .dt-n{font-size:12.5px}
  .dt-badge{display:none}
}

/* ===== ΧΡΩΜΑΤΑ ΤΜΗΜΑΤΩΝ — Ρυθμίσεις → tab διευθυντή (src/modules/53-dept-colors.js) ===== */
.dc-body{padding:12px 14px 16px;display:flex;flex-direction:column;gap:10px}
.dc-hint{margin-left:auto;font-size:11px;font-weight:400;color:var(--muted)}
.dc-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#fff;
  border:1px solid var(--border);border-radius:14px;padding:10px 12px}
.dc-id{display:flex;align-items:center;gap:10px;min-width:210px}
/* Προεπισκόπηση: αριστερά η απόχρωση του πλαϊνού μενού, δεξιά το χρώμα της καρτέλας */
.dc-prev{position:relative;display:block;width:52px;height:34px;border-radius:9px;overflow:hidden;
  flex:none;box-shadow:0 1px 5px rgba(21,36,59,.18)}
.dc-prev .dc-p1{position:absolute;inset:0 0 0 16px;background:var(--c,#15243b)}
.dc-prev .dc-p2{position:absolute;inset:0 auto 0 0;width:16px;background:var(--c2,#15243b)}
.dc-nm{min-width:0}
.dc-nm b{display:block;font-size:13.5px;line-height:1.2}
.dc-nm span{font-size:11px;color:var(--muted)}
.dc-sw{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto}
.dc-c{width:24px;height:24px;padding:0;border-radius:7px;border:2px solid transparent;cursor:pointer;
  box-shadow:0 1px 3px rgba(21,36,59,.2);transition:.15s}
.dc-c:hover{transform:translateY(-1px)}
.dc-c.on{border-color:#fff;outline:2px solid #1c2637;outline-offset:1px}
.dc-custom{position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:8px;border:1px dashed var(--border);color:var(--muted);cursor:pointer}
.dc-custom input{position:absolute;inset:0;width:100%;height:100%;opacity:0;padding:0;border:none;cursor:pointer}
.dc-auto{border:1px solid var(--border);background:#fff;border-radius:8px;padding:5px 9px;
  font-size:11.5px;font-weight:700;color:var(--muted);cursor:pointer}
.dc-auto.on{background:#1c2637;border-color:#1c2637;color:#fff}
.dc-warn{flex:1 0 100%;display:flex;align-items:center;gap:6px;font-size:11.5px;color:#b4322e}
@media(max-width:900px){
  .dc-id{min-width:100%}
  .dc-sw{margin-left:0}
}

/* ---------- Αρχειοθετημένοι λογαριασμοί (54-acct-archive) ---------- */
.st-n{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;
  background:#94a3b8;color:#fff;font-size:10.5px;font-weight:700;line-height:1}
.st-tab.on .st-n{background:rgba(255,255,255,.25)}
.ac-card{border-left:4px solid #94a3b8;max-width:880px}
.ac-card .card-h{flex-wrap:wrap}
.ac-q{margin-left:auto;border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:12px;outline:none;width:180px}
.ac-note{display:flex;gap:7px;align-items:flex-start;margin:0 16px 8px;padding:9px 12px;border-radius:9px;
  background:#f1f5f9;color:#475569;font-size:12px;line-height:1.55}
.ac-note svg,.ac-warn svg{flex:0 0 auto;margin-top:2px}
.ac-row{align-items:center;gap:10px}
.ac-av{filter:grayscale(1);opacity:.7}
.ac-meta{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-top:1px}
.ac-restore{display:inline-flex;align-items:center;gap:5px;border:1px solid #bbf7d0;background:#f0fdf4;color:#166534;
  border-radius:8px;padding:6px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;flex:0 0 auto}
.ac-restore:hover{background:#dcfce7}
.ac-list{margin:8px 0 4px;padding-left:18px}
.ac-list li{margin:2px 0}
.ac-warn{display:flex;gap:8px;align-items:flex-start;margin-top:10px;padding:9px 12px;border-radius:9px;
  background:#fffbeb;border:1px solid #fde68a;color:#92400e;font-size:12.5px;line-height:1.5}
.ac-go{background:linear-gradient(135deg,#b45309,#e09c1a);border:none}
.dp-an{display:inline-flex;gap:5px;align-items:center;margin-top:6px;color:#475569}
@media(max-width:600px){
  .ac-q{flex:1 0 100%;width:auto;margin-left:0}
  .ac-rt{display:none}
}

/* ---------- Διαγραφή & μεταφορά δεδομένων (55-acct-delete) + επιλογή ατόμου (56) ---------- */
.xd-modal .modal-b{font-size:13px;line-height:1.65}
.xd-p1{margin:0 0 10px}
.xd-load{display:flex;align-items:center;gap:10px;color:var(--muted);padding:6px 0}
.xd-spin{width:16px;height:16px;border-radius:50%;border:2px solid #cbd5e1;border-top-color:#0f766e;animation:xdSpin .8s linear infinite}
@keyframes xdSpin{to{transform:rotate(360deg)}}
.xd-chips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}
.xd-chip{display:inline-flex;align-items:center;gap:5px;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:999px;
  padding:3px 10px;font-size:12px;font-weight:600;color:#334155}
.xd-hint{font-size:12px;color:var(--muted);margin-top:6px}
.xd-hist,.xd-alert,.xd-warn,.xd-msg{display:flex;gap:8px;align-items:flex-start;border-radius:10px;padding:9px 12px;font-size:12.5px;margin:8px 0}
.xd-hist svg,.xd-alert svg,.xd-warn svg,.xd-msg svg{flex:0 0 auto;margin-top:2px}
.xd-hist{background:#f0fdfa;border:1px solid #99f6e4;color:#115e59}
.xd-alert{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}
.xd-warn{background:#fffbeb;border:1px solid #fde68a;color:#92400e}
.xd-msg{background:#f0fdfa;border:1px solid #5eead4;color:#115e59}
.xd-msg a{color:#0f766e;font-weight:700;text-decoration:underline;cursor:pointer}
.xd-keep{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:9px 12px;font-size:12px;color:#475569;margin-top:8px}
.xd-steps-h{display:flex;gap:6px;margin:0 0 12px;flex-wrap:wrap}
.xd-steps-h span{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:#94a3b8}
.xd-steps-h span+span::before{content:"";width:16px;height:1px;background:#cbd5e1;margin-right:2px}
.xd-steps-h i{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#e2e8f0;
  color:#64748b;font-style:normal;font-size:10.5px}
.xd-steps-h .on{color:#0f766e}.xd-steps-h .on i{background:#0f766e;color:#fff}
.xd-steps-h .ok{color:#0f766e}.xd-steps-h .ok i{background:#ccfbf1;color:#0f766e}
.xd-q{width:100%;box-sizing:border-box;border:1px solid var(--border);border-radius:9px;padding:8px 11px;font-size:13px;outline:none;margin-bottom:8px}
.xd-list{max-height:300px;overflow-y:auto;border:1px solid #e2e8f0;border-radius:10px}
.xd-p{display:flex;align-items:center;gap:10px;padding:8px 11px;cursor:pointer;border-bottom:1px solid #f1f5f9}
.xd-p:last-child{border-bottom:none}
.xd-p:hover{background:#f8fafc}
.xd-p.on{background:#f0fdfa}
.xd-rad{flex:0 0 auto;width:16px;height:16px;border-radius:50%;border:2px solid #cbd5e1;box-sizing:border-box}
.xd-p.on .xd-rad{border:5px solid #0f766e}
.xd-pn{flex:1;min-width:0;display:flex;flex-direction:column}
.xd-pn b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xd-pn b i{font-weight:500;color:var(--muted)}
.xd-pn span{font-size:11px;color:var(--muted)}
.xd-got{flex:0 0 auto;display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;color:#0f766e;
  background:#ccfbf1;border-radius:999px;padding:2px 8px}
.xd-kinds{display:flex;flex-direction:column;gap:8px}
.xd-k{display:flex;align-items:flex-start;gap:10px;border:1px solid #e2e8f0;border-radius:11px;padding:10px 12px;cursor:pointer}
.xd-k:has(input:checked){border-color:#5eead4;background:#f0fdfa}
.xd-k.off{opacity:.55;cursor:default}
.xd-k input{margin-top:3px;width:16px;height:16px;accent-color:#0f766e;flex:0 0 auto}
.xd-kic{flex:0 0 auto;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:#ccfbf1;color:#0f766e}
.xd-kt{flex:1;min-width:0}
.xd-kt em{font-style:normal;font-weight:700;color:#0f766e;margin-left:4px}
.xd-kt small{display:block;font-size:11.5px;color:var(--muted);margin-top:2px;line-height:1.45}
.xd-flow{display:flex;align-items:center;gap:10px;margin:6px 0 16px}
.xd-end{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:6px;width:92px;text-align:center}
.xd-end span{font-size:11.5px;font-weight:600;color:#334155;line-height:1.3;overflow-wrap:break-word}
.xd-end:first-child .avatar,.xd-end:first-child img{filter:grayscale(1);opacity:.75}
.xd-track{position:relative;flex:1;height:6px;border-radius:3px;background:repeating-linear-gradient(90deg,#cbd5e1 0 6px,transparent 6px 12px);overflow:hidden}
.xd-track i{position:absolute;top:-2px;left:-12%;width:10px;height:10px;border-radius:3px;background:#14b8a6;
  box-shadow:0 0 8px rgba(20,184,166,.6);animation:xdFly 1.6s cubic-bezier(.5,0,.5,1) infinite}
.xd-track i:nth-child(2){animation-delay:.4s;background:#0ea5e9}
.xd-track i:nth-child(3){animation-delay:.8s;background:#f59e0b}
.xd-track i:nth-child(4){animation-delay:1.2s;background:#8b5cf6}
@keyframes xdFly{0%{left:-12%;transform:scale(.6)}50%{transform:scale(1)}100%{left:105%;transform:scale(.6)}}
.xd-bar{height:12px;border-radius:6px;background:#e2e8f0;overflow:hidden}
.xd-bar i{display:block;height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,#0f766e,#14b8a6,#5eead4);
  background-size:200% 100%;animation:xdShine 1.4s linear infinite;transition:width .12s linear}
@keyframes xdShine{to{background-position:-200% 0}}
.xd-pct{display:flex;align-items:baseline;gap:10px;margin:8px 0 10px}
.xd-pct b{font-size:22px;color:#0f766e;font-variant-numeric:tabular-nums}
.xd-pct span{font-size:12px;color:var(--muted)}
.xd-run{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.xd-run li{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#94a3b8}
.xd-run li b{color:inherit}
.xd-run li .xd-st{margin-left:auto;width:14px;height:14px;border-radius:50%;border:2px solid #e2e8f0;box-sizing:border-box}
.xd-run li.on{color:#0f766e}.xd-run li.on .xd-st{border-color:#99f6e4;border-top-color:#0f766e;animation:xdSpin .8s linear infinite}
.xd-run li.ok{color:#166534}.xd-run li.ok .xd-st{border:none;background:#22c55e;box-shadow:inset 0 0 0 3px #dcfce7}
.xd-got-l{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:5px}
.xd-got-l li{display:flex;align-items:center;gap:7px;color:#166534;font-weight:600}
@media (prefers-reduced-motion:reduce){.xd-track i,.xd-bar i,.xd-spin{animation:none}}
@media(max-width:600px){ .xd-end{width:88px} .xd-end span{font-size:11px} .xd-modal .modal-f{flex-wrap:wrap} .xd-modal .modal-f .btn{flex:1 1 auto} }
  /* Διακόπτης δικαιώματος στη φόρμα λογαριασμού (26-rythmiseis) */
  .st-chk{display:flex;align-items:flex-start;gap:9px;padding:9px 11px;border:1px solid var(--border);border-radius:10px;background:#fff;font-size:12.5px;font-weight:600;cursor:pointer;margin-top:2px;line-height:1.45}
  .st-chk:hover{background:var(--accent-soft)}
  .st-chk input{margin-top:2px;flex:none;width:16px;height:16px;accent-color:#7c3aed;cursor:pointer}
/* =====================================================================
   PROJECTS — royal blue ταυτότητα (#1e3a8a → #3b82f6)
===================================================================== */
:root{ --prj:#2563eb; --prj-d:#1e3a8a; --prj-soft:#e8effd;
  /* ανάθεση σε άλλον = τιρκουάζ, παντού: κάρτα kanban, γραμμή, παράθυρο */
  --dlg:#0d9488; --dlg-d:#0f766e; --dlg-soft:#e6f6f3; }

/* ---- Κεφαλίδα με βάθος: λωρίδες + μονοπάτι + ετικέτα επιπέδου ---- */
.modal-h.mh-lvl{ position:relative; padding-left:24px; }
.mh-spine{ position:absolute; left:0; top:0; bottom:0; display:flex; pointer-events:none; }
.mh-spine i{ display:block; width:5px; background:#fff; }
.mh-crumb{ display:flex; align-items:center; flex-wrap:wrap; gap:5px; margin-bottom:4px;
  font-size:10.5px; line-height:1.35; color:rgba(255,255,255,.72); }
.mh-crumb a{ color:rgba(255,255,255,.88); cursor:pointer; max-width:220px; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; border-bottom:1px dotted rgba(255,255,255,.45); }
.mh-crumb a:hover{ color:#fff; border-bottom-style:solid; }
.mh-crumb .cr-sep{ opacity:.55; }
.mh-lv{ display:inline-block; font-size:10px; font-weight:800; letter-spacing:.03em;
  padding:1px 8px; border-radius:999px; margin-right:6px; color:#fff;
  background:rgba(255,255,255,.2); border:1px solid rgba(255,255,255,.32); }
.mh-av{ flex:none; display:grid; place-items:center; }
.mh-av .avatar{ box-shadow:0 0 0 2px rgba(255,255,255,.55); }

/* ---- Λίστα (grid καρτών) ---- */
.prj-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px; }
.prj-grid>.lz-host{display:contents}
.prj-grid .lz-sent{grid-column:1/-1;height:1px}
.prj-card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:15px 16px; cursor:pointer; transition:transform .12s, box-shadow .12s, border-color .12s;
  border-top:3px solid var(--prj); }
.prj-card:hover{ transform:translateY(-2px); box-shadow:0 6px 22px rgba(37,99,235,.16); border-color:#c7d7f7; }
.prj-card-top{ display:flex; align-items:center; gap:9px; margin-bottom:4px; }
.prj-ic{ width:30px; height:30px; border-radius:9px; flex:none; display:grid; place-items:center; color:#fff;
  background:linear-gradient(135deg,var(--prj-d),var(--prj)); }
.prj-tt{ font-weight:700; font-size:14.5px; line-height:1.25; flex:1; min-width:0; color:var(--text); }
.prj-sub{ font-size:11.5px; color:var(--muted); margin:2px 0 11px; }
.prj-bar{ display:flex; align-items:center; gap:9px; margin-bottom:10px; }
.prj-bar b{ font-size:12.5px; color:var(--prj-d); min-width:38px; text-align:right; }
.prj-foot{ display:flex; align-items:center; justify-content:space-between; font-size:11px; color:var(--muted); }
.prj-badge{ font-size:10.5px; font-weight:700; padding:2px 9px; border-radius:999px; white-space:nowrap; }

/* ---- Σελίδα project ---- */
.prj-detail{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
@media (max-width:1050px){ .prj-detail{ grid-template-columns:1fr; } }
.prj-detail .stack{ display:flex; flex-direction:column; gap:16px; }
.prj-person{ display:flex; align-items:center; gap:11px; padding:9px 16px; border-top:1px solid var(--border); }
.prj-person:first-child{ border-top:none; }
.pp-main{ flex:1; min-width:0; }
.pp-name{ font-size:12.5px; font-weight:600; margin-bottom:4px; }
.pp-main .mini-bar{ height:7px; }
.pp-pct{ font-size:13px; font-weight:800; color:var(--prj-d); min-width:40px; text-align:right; }
.pp-meta{ font-size:10.5px; color:var(--muted); min-width:56px; text-align:right; }
.prj-pct{ font-size:12.5px; font-weight:800; color:var(--prj-d); min-width:40px; text-align:right; }

/* ---- Popup ανάλυσης project ---- */
.prj-modal{ width:580px; max-width:94vw; }
.prj-modal .modal-b{ max-height:min(64vh,600px); overflow:auto; }
.prj-hbadge{ flex:none; }
.prj-hbadge .prj-badge{ background:rgba(255,255,255,.2)!important; color:#fff!important; border-color:rgba(255,255,255,.4)!important; }
.prjm-hero{ display:flex; align-items:center; gap:18px; background:var(--prj-soft); border:1px solid #d5e3fb;
  border-radius:14px; padding:14px 16px; margin-bottom:4px; }
.prjm-metrics{ flex:1; display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.prjm-metric{ background:#fff; border:1px solid var(--border); border-radius:10px; padding:9px 11px; }
.prjm-metric .k{ font-size:10.5px; color:var(--muted); display:flex; align-items:center; gap:4px; margin-bottom:3px; }
.prjm-metric .k .i{ color:var(--prj); }
.prjm-metric .v{ font-size:20px; font-weight:800; color:#1c2536; line-height:1.1; }
.prjm-metric .v small{ font-size:12px; font-weight:600; color:var(--muted); }
.prjm-metric .km{ font-size:10px; color:var(--muted); margin-top:2px; }
.prjm-metric .km.overdue{ color:var(--red); }
.prjm-metric .km.soon{ color:var(--amber); }
/* Το mobile layout του popup (≤600px) ζει συγκεντρωμένο στο 36-mobile.css */

/* ---- Wizard δημιουργίας (redesign: 2 βήματα, κάρτες, καθαρή ιεραρχία) ---- */
#npWin .modal-b.np-body, #ntWin .modal-b.np-body{ padding:18px 20px; background:#fbfcff; display:flex; flex-direction:column; gap:15px; }
.np-section{ border-radius:14px; padding:16px; box-shadow:0 1px 2px rgba(21,36,59,.05); }
/* Βήμα 1: μπλε τόνος · Βήμα 2: ουδέτερο ψυχρό (οι λευκές κάρτες ξεχωρίζουν) */
.np-section.s1{ background:#eef4ff; border:1px solid #d5e3fb; }
.np-section.s2{ background:#f3f6fc; border:1px solid #e0e6f2; }
.np-section.s1 .np-in{ background:#fff; }
.np-step{ display:flex; align-items:center; gap:11px; margin-bottom:14px; }
.np-step-n{ width:26px; height:26px; border-radius:50%; flex:none; display:grid; place-items:center;
  font-weight:800; font-size:13px; color:#fff; background:linear-gradient(135deg,var(--prj-d),var(--prj));
  box-shadow:0 2px 6px rgba(37,99,235,.35); }
.np-step b{ font-size:14px; display:block; color:var(--text); }
.np-step small{ font-size:11px; color:var(--muted); }
.np-count{ margin-left:auto; background:var(--prj-soft); color:var(--prj-d); font-weight:800; font-size:12px;
  padding:3px 12px; border-radius:999px; border:1px solid #c7d7f7; }

.np-field{ margin-bottom:12px; }
.np-field:last-child{ margin-bottom:0; }
.np-field label{ display:flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700; color:#42506a;
  margin-bottom:6px; text-transform:none; letter-spacing:0; }
.np-field label .i{ color:var(--prj); }
.np-opt{ font-weight:500; color:var(--muted); font-size:10.5px; }
.req{ color:var(--red); }
.np-hint{ display:block; font-size:10.5px; color:var(--muted); margin-top:5px; }

.np-in{ width:100%; padding:10px 12px; border:1.5px solid var(--border); border-radius:10px; font-size:13.5px;
  background:#fff; font-family:inherit; color:var(--text); transition:border-color .12s, box-shadow .12s; }
textarea.np-in{ resize:vertical; min-height:44px; }
.np-in:focus{ outline:none; border-color:var(--prj); box-shadow:0 0 0 3px rgba(37,99,235,.14); }
.np-in:disabled{ background:#f1f4f9; color:var(--muted); cursor:not-allowed; }
select.np-in{ cursor:pointer; }
.np-grid2{ display:grid; grid-template-columns:1fr 150px; gap:12px; }

.np-card{ background:#fff; border:1px solid var(--border); border-left:3px solid var(--prj); border-radius:12px;
  padding:14px; margin-bottom:12px; box-shadow:0 2px 10px rgba(21,36,59,.06); }
.np-card-h{ display:flex; align-items:center; gap:9px; margin-bottom:12px; }
.np-card-h .spacer{ flex:1; }
.np-num{ width:24px; height:24px; border-radius:50%; flex:none; display:grid; place-items:center; font-weight:800;
  font-size:12px; color:var(--prj-d); background:var(--prj-soft); border:1px solid #c7d7f7; }
.np-card-h b{ font-size:13px; color:#42506a; }
/* Ζωντανός δείκτης πληρότητας ανάθεσης */
.np-status{ display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:700;
  padding:3px 9px; border-radius:999px; white-space:nowrap; }
.np-status.warn{ background:var(--amber-soft); color:#8a5a06; border:1px solid #f0d79a; }
.np-status.ok{ background:var(--green-soft); color:#0f7a41; border:1px solid #a9e0c1; }
/* Αριθμημένα βήματα μέσα στην κάρτα ανάθεσης */
.np-fnum{ display:inline-grid; place-items:center; width:16px; height:16px; border-radius:50%;
  background:var(--prj-soft); color:var(--prj-d); font-size:9.5px; font-weight:800; border:1px solid #c7d7f7; }
/* Υπογράμμιση όσων λείπουν */
.np-in.miss{ border-color:#e6b34d; background:#fffdf6; }
.np-kind.miss{ border:1.5px solid #e6b34d; border-radius:12px; padding:6px; background:#fffdf6; }
.np-del{ background:none; border:none; color:var(--muted); cursor:pointer; padding:5px; border-radius:8px;
  display:grid; place-items:center; transition:.12s; }
.np-del:hover{ background:#fdeaea; color:var(--red); }

.np-kind{ display:flex; gap:10px; }
.np-kbtn{ flex:1; display:flex; align-items:center; gap:9px; padding:10px 11px; border:1.5px solid var(--border);
  border-radius:11px; background:#fff; cursor:pointer; text-align:left; transition:.12s; }
.np-kbtn:hover{ border-color:#c7d7f7; background:#fbfcff; }
.np-kbtn.sel{ border-color:var(--prj); background:var(--prj-soft); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.np-kbtn .k-ic{ width:30px; height:30px; border-radius:8px; flex:none; display:grid; place-items:center;
  color:var(--muted); background:#eef1f6; transition:.12s; }
.np-kbtn.sel .k-ic{ background:linear-gradient(135deg,var(--prj-d),var(--prj)); color:#fff; }
.np-kbtn .k-tx b{ font-size:12.5px; color:var(--text); display:block; line-height:1.2; }
.np-kbtn .k-tx small{ font-size:10px; color:var(--muted); }

.np-addbtn{ width:100%; padding:11px; border:1.5px dashed #b9c6dd; border-radius:11px; background:#fff;
  color:var(--prj-d); font-weight:700; font-size:12.5px; cursor:pointer; display:flex; align-items:center;
  justify-content:center; gap:7px; transition:.12s; }
.np-addbtn:hover{ border-color:var(--prj); background:var(--prj-soft); }

#npWin .err{ margin:0; }
.btn.np-go{ background:linear-gradient(135deg,var(--prj-d),var(--prj)); border-color:transparent; color:#fff;
  box-shadow:0 3px 10px rgba(37,99,235,.35); }
.btn.np-go:hover{ filter:brightness(1.06); }

/* ---- Multi-step: stepper ---- */
.np-stepper{ display:flex; align-items:center; gap:6px; margin-bottom:15px; }
.np-sdot{ display:flex; align-items:center; gap:6px; font-size:11px; font-weight:700; color:var(--muted); white-space:nowrap; }
.np-sdot .np-sn{ width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:10.5px;
  background:#e6eaf2; color:var(--muted); border:1px solid var(--border); }
.np-sdot.on{ color:var(--prj-d); }
.np-sdot.on .np-sn{ background:linear-gradient(135deg,var(--prj-d),var(--prj)); color:#fff; border-color:transparent; box-shadow:0 2px 6px rgba(37,99,235,.35); }
.np-sdot.done .np-sn{ background:var(--green); color:#fff; border-color:transparent; }
.np-sline{ flex:1; height:2px; background:var(--border); border-radius:2px; min-width:12px; }

/* ---- Step 2: αναζήτηση + λίστα ατόμων ---- */
.np-searchbox{ display:flex; align-items:center; gap:8px; padding:9px 12px; border:1.5px solid var(--border);
  border-radius:10px; background:#fff; margin-bottom:10px; color:var(--muted); }
.np-searchbox input{ border:none; outline:none; flex:1; font-size:13.5px; background:transparent; color:var(--text); font-family:inherit; }
.np-searchbox:focus-within{ border-color:var(--prj); box-shadow:0 0 0 3px rgba(37,99,235,.14); color:var(--prj); }
.np-people{ max-height:280px; overflow:auto; border:1px solid var(--border); border-radius:10px; background:#fff; }
.np-prow{ display:flex; align-items:center; gap:10px; padding:9px 12px; border-top:1px solid var(--border); cursor:pointer; }
.np-prow:first-child{ border-top:none; }
.np-prow:hover{ background:#f6f9ff; }
.np-prow.sel{ background:var(--prj-soft); }
.np-prow input[type=checkbox]{ width:16px; height:16px; accent-color:var(--prj); flex:none; cursor:pointer; }
.np-pmeta{ flex:1; min-width:0; }
.np-pmeta b{ font-size:12.5px; display:block; color:var(--text); }
.np-pmeta small{ font-size:10.5px; color:var(--muted); }
.np-pcheck{ color:var(--prj-d); display:grid; place-items:center; flex:none; }

/* ---- Steps 3..N: ανά άτομο ---- */
.np-person-h{ display:flex; align-items:center; gap:11px; padding:10px 12px; background:var(--prj-soft);
  border:1px solid #c7d7f7; border-radius:11px; margin-bottom:14px; }
.np-person-h b{ font-size:14px; display:block; color:#1c2536; }
.np-person-h small{ font-size:11px; color:var(--muted); }
.np-item{ display:flex; align-items:center; gap:9px; margin-bottom:8px; }
.np-inum{ width:22px; height:22px; border-radius:50%; flex:none; display:grid; place-items:center; font-size:11px;
  font-weight:800; color:var(--prj-d); background:var(--prj-soft); border:1px solid #c7d7f7; }
.np-item .np-in{ flex:1; }
.np-item .np-del{ flex:none; padding:6px; border:none; background:none; color:var(--muted); cursor:pointer; border-radius:8px; }
.np-item .np-del:hover{ background:#fdeaea; color:var(--red); }

/* ---- Nested: container / delegate ---- */
.prj-container{ padding:4px 2px; }
.pc-banner{ background:var(--prj-soft); border:1px solid #c7d7f7; color:var(--prj-d);
  border-radius:10px; padding:11px 13px; font-size:12.5px; line-height:1.5; }
/* ---- «Ποιος έχει τι»: λωρίδα στο task & πάνελ στο popup του έργου ---- */
.dlg-strip{ background:var(--prj-soft); border:1px solid #c7d7f7; border-radius:12px;
  padding:11px 13px; margin-bottom:14px; }
.dlg-strip.on{ background:#fff; border-color:#cfe0fb; }
.dlg-head{ display:flex; align-items:center; gap:11px; flex-wrap:wrap; }
.dlg-htxt{ flex:1; min-width:170px; }
.dlg-htxt b{ display:block; font-size:13px; font-weight:700; color:var(--prj-d); line-height:1.35; }
.dlg-htxt small{ display:block; font-size:11.5px; color:var(--muted); margin-top:3px; }
.dlg-lines{ display:flex; flex-direction:column; gap:8px; margin-top:11px; }
.dlg-line{ display:flex; align-items:center; gap:10px; cursor:pointer; border-radius:8px;
  padding:3px 4px; margin:0 -4px; }
.dlg-line:hover{ background:var(--bg); }
.dlg-av{ display:flex; flex:none; }
.dlg-av .avatar{ margin-right:-6px; box-shadow:0 0 0 2px #fff; }
.dlg-av .avatar:last-child{ margin-right:0; }
.dlg-t{ flex:1; min-width:0; font-size:12px; font-weight:600;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dlg-bar{ width:96px; height:6px; border-radius:4px; background:#eef1f6; overflow:hidden; flex:none; }
.dlg-bar i{ display:block; height:100%; border-radius:4px; background:var(--dlg); }
.dlg-pct{ font-size:11px; font-weight:800; color:var(--dlg-d); width:34px; text-align:right; flex:none; }
.dlg-mine{ font-size:11px; color:var(--muted); flex:none; }

/* ---- Popup ανάθεσης στην ομάδα: ΜΙΑ οθόνη, χωρίς καρτέλες ---- */
#dgWin .btn-primary{ background:linear-gradient(135deg,var(--prj-d),var(--prj));
  border-color:transparent; color:#fff; box-shadow:0 2px 7px rgba(37,99,235,.28); }
.dg-find{ display:flex; align-items:center; gap:9px; background:var(--bg);
  border:1px solid var(--border); border-radius:10px; padding:7px 11px; margin-bottom:13px; }
.dg-find input{ flex:1; min-width:0; border:none; background:none; font:inherit; font-size:12.5px; }
.dg-find input:focus{ outline:none; }
.dg-cnt{ font-size:10.5px; font-weight:700; color:var(--muted); background:#fff;
  border:1px solid var(--border); border-radius:6px; padding:1px 7px; flex:none; }
.dg-lab{ font-size:11px; font-weight:800; letter-spacing:.4px; color:var(--muted); margin-bottom:9px; }

.dg-row{ position:relative; display:flex; align-items:center; gap:12px; padding:10px 12px;
  background:#fff; border:1px solid var(--border); border-radius:12px; }
.dg-row.sel{ border-color:#bfd4fa; background:#f6f9ff; }
.dg-row.done{ border-color:#bfe6cf; background:var(--green-soft); }
.dg-row.dim{ opacity:.45; }
.dg-main{ flex:1; min-width:0; }
.dg-main b{ display:block; font-size:13px; font-weight:600; line-height:1.35; }
.dg-main small{ display:block; font-size:11px; color:var(--muted); margin-top:2px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dg-n,.dg-ic{ width:22px; height:22px; border-radius:7px; background:#eef1f6; color:var(--muted);
  display:grid; place-items:center; font-size:11px; font-weight:800; flex:none; }
.dg-row.sel .dg-n,.dg-row.sel .dg-ic{ background:var(--prj-soft); color:var(--prj-d); }
.dg-row.done .dg-n,.dg-row.done .dg-ic{ background:#cdeedd; color:var(--green); }
.dg-lock{ color:var(--green); display:inline-flex; align-items:center; padding:0 6px; }

.dg-or{ display:flex; align-items:center; gap:10px; margin:12px 0 10px; }
.dg-or span{ height:1px; background:var(--border); flex:1; }
.dg-or b{ font-size:11px; font-weight:700; color:#98a3b5; }
.dg-steps{ display:flex; flex-direction:column; gap:8px; }

/* Πρόσωπα ως κουμπιά. Το πλήθος είναι ΣΤΑΘΕΡΟ — δες dgRowPeople. */
.dg-avs{ display:flex; gap:7px; margin-left:auto; flex:none; }
.dg-av{ width:30px; height:30px; border-radius:50%; display:grid; place-items:center;
  flex:none; cursor:pointer; border:2px solid transparent; transition:box-shadow .12s,transform .12s; }
.dg-av .avatar{ filter:grayscale(1); opacity:.5; transition:.12s; }
.dg-av:hover{ transform:translateY(-1px); }
.dg-av:hover .avatar{ opacity:.8; }
.dg-av.on{ border-color:#fff; box-shadow:0 0 0 2px var(--prj),0 2px 6px rgba(21,36,59,.18); }
.dg-av.on .avatar{ filter:none; opacity:1; }
.dg-av.more{ background:#fff; border:1.5px dashed #c3cede; color:var(--muted);
  font-size:10px; font-weight:800; }
.dg-av.more.on{ border-style:solid; border-color:var(--prj); color:var(--prj-d); background:var(--prj-soft); }

/* Tooltip ονόματος — ακαριαίο, θέση από JS (dgTipShow) ώστε να μην το κόβει κανένα overflow */
.dg-tip{ position:fixed; z-index:9999; display:none; transform:translate(-50%,calc(-100% - 8px));
  background:var(--navy); color:#fff; font-size:11px; font-weight:600; line-height:1;
  white-space:nowrap; padding:6px 9px; border-radius:7px; pointer-events:none;
  box-shadow:0 6px 18px rgba(21,36,59,.3); }
.dg-tip::after{ content:""; position:absolute; top:100%; left:50%; transform:translateX(-50%);
  border:5px solid transparent; border-top-color:var(--navy); }

/* Αιωρούμενο παράθυρο επιλογής: ΔΕΝ σπρώχνει τη λίστα */
.dg-popveil{ position:fixed; inset:0; z-index:5; }
.dg-pop{ position:absolute; z-index:6; right:8px; top:calc(100% - 4px); width:250px;
  background:#fff; border:1px solid #cfe0fb; border-radius:11px; padding:7px;
  box-shadow:0 14px 34px rgba(21,36,59,.24); }
.dg-popfind{ display:flex; align-items:center; gap:7px; background:var(--bg);
  border:1px solid var(--border); border-radius:8px; padding:5px 8px; margin-bottom:6px; }
.dg-popfind input{ flex:1; min-width:0; border:none; background:none; font:inherit; font-size:11.5px; }
.dg-popfind input:focus{ outline:none; }
.dg-popx{ border:none; background:none; color:var(--muted); display:grid; place-items:center; padding:0; }
.dg-poplist{ max-height:210px; overflow:auto; display:flex; flex-direction:column; gap:2px; }
.dg-poprow{ display:flex; align-items:center; gap:8px; padding:6px 7px; border-radius:8px; cursor:pointer; }
.dg-poprow b{ font-size:11.5px; font-weight:600; flex:1; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); }
.dg-poprow:hover{ background:var(--bg); }
.dg-poprow.on{ background:var(--prj-soft); }
.dg-poprow.on b{ color:var(--text); }
.dg-poprow svg{ color:var(--prj-d); flex:none; }

.dg-add{ display:flex; gap:7px; margin-top:2px; }
.dg-add input{ flex:1; min-width:0; border:1px dashed #d3dbe8; border-radius:12px;
  padding:10px 13px; font:inherit; font-size:12.5px; background:#fff; }
.dg-add input:focus{ outline:none; border-style:solid; border-color:var(--prj);
  box-shadow:0 0 0 3px rgba(37,99,235,.13); }

/* ---- Calendar milestone chip ---- */
.cal-chip.proj{ background:var(--prj-soft); color:var(--prj-d); border-color:#c7d7f7; }

/* ---- «Η δουλειά μου σε αυτό το έργο» ----------------------------------
   Το μόνο κομμάτι του παραθύρου που είναι ΔΙΚΗ ΣΟΥ δουλειά. Κρατά το
   πορτοκαλί της εργασίας, ώστε να «σπάει» οπτικά μέσα στο μπλε παράθυρο
   του έργου και να το βρίσκει το μάτι χωρίς διάβασμα. */
.mywork{ margin-top:10px; border:1.5px solid #f6d3bf; border-radius:14px; overflow:hidden;
  background:#fff; box-shadow:0 8px 24px rgba(131,47,13,.10); }
.mw-head{ display:flex; align-items:center; gap:12px; padding:12px 15px; color:#fff;
  background:linear-gradient(115deg,#832f0d,#e8622d 130%); }
.mw-ic{ width:36px; height:36px; border-radius:11px; background:rgba(255,255,255,.2);
  display:grid; place-items:center; flex:none; }
.mw-ht{ flex:1; min-width:0; }
.mw-ht b{ display:block; font-size:14.5px; font-weight:800; line-height:1.25; }
.mw-ht small{ display:block; font-size:11px; color:rgba(255,255,255,.85); margin-top:2px; }
.mw-pct{ flex:none; font-size:22px; font-weight:800; line-height:1; font-variant-numeric:tabular-nums; }
.mw-pct small{ font-size:12px; font-weight:700; opacity:.8; margin-left:1px; }
.mw-list{ background:#fff; }
.mywork.empty-mw .mw-head{ background:linear-gradient(115deg,#7b8496,#aab3c2 130%); }

/* Οι γραμμές: πιο μεγάλες, πιο έντονες, με ζεστό hover */
.mywork .task-row{ padding:13px 15px; gap:12px; border-bottom:1px solid #f4e6de; }
.mywork .task-row:last-child{ border-bottom:none; }
.mywork .task-row:hover{ background:#fff6f1; }
.mywork .task-row.from-prj{ border-left:none; }
.mywork .task-row .prio{ width:5px; height:44px; border-radius:3px; }
.mywork .task-row .tt{ font-size:15px; font-weight:800; line-height:1.3; color:var(--text); }
.mywork .task-row .ts{ font-size:12px; margin-top:4px; }
.mywork .task-row .deadline{ font-weight:700; }
.mywork .task-row .prog-wrap{ width:116px; }
.mywork .task-row .prog-wrap .pct{ font-size:14.5px; font-weight:800; color:#832f0d; }
.mywork .task-row .prog-wrap .mini-bar{ height:8px; margin-top:4px; border-radius:4px; }
.mywork .task-row .prog-wrap .mini-bar i{ background:linear-gradient(90deg,#832f0d,#e8622d); border-radius:4px; }
.mywork .empty{ padding:18px 15px; }
.pp-dept{ font-weight:600; font-size:11.5px; color:var(--muted); }

/* ---- Wizard βήμα «Αναθέσεις»: Τίτλος + Περιγραφή μαζί, ξεχωριστά από τα βήματα ---- */
.np-block{ background:#fff; border:1px solid #dbe3f1; border-radius:12px;
  padding:13px 13px 14px; margin-bottom:15px; box-shadow:0 1px 2px rgba(21,36,59,.05); }
.np-block .np-field:last-child{ margin-bottom:0; }
textarea.np-ta{ min-height:74px; line-height:1.5; }

/* ---- Περιγραφή ανάθεσης μέσα στο popup του διευθυντή ---- */
.dg-note{ background:#fff; border:1px solid #dbe3f1; border-radius:12px;
  padding:10px 12px 11px; margin:-2px 0 10px; }
.dg-note label{ display:flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700;
  color:#42506a; margin-bottom:6px; }
.dg-note label .i{ color:var(--prj); }
.dg-note textarea{ font-size:13px; }

/* ================= Wizard ΝΕΟΥ TASK (module 46) =================
   Ίδιο σχήμα με τον wizard των projects (κλάσεις .np-*), αλλά με τα
   χρώματα του task: το #ntWin ξαναορίζει ΜΟΝΟ τα --prj* και όλα τα
   .np-* το ακολουθούν. Δικές του κλάσεις: .nt-type (επιλογή τύπου)
   και .nt-dept/.nt-dhd/.nt-dbody (πλοήγηση ανά τμήμα για τον admin). */
#ntWin{ --prj:#e8622d; --prj-d:#832f0d; --prj-soft:#fdeadf; }
#ntWin .np-in:focus,
#ntWin .np-searchbox:focus-within{ box-shadow:0 0 0 3px rgba(232,98,45,.16); }
#ntWin .np-sdot.on .np-sn{ box-shadow:0 2px 6px rgba(232,98,45,.32); }
#ntWin .np-person-h,#ntWin .np-inum{ border-color:#f2c4ab; }
#ntWin .np-section.s1{ background:#fdf3ee; border-color:#f5d9c8; }

/* Βήμα 1: Απλό ή Σύνθετο */
.nt-type{ width:100%; display:flex; align-items:center; gap:12px; padding:13px 14px; margin-bottom:10px;
  border:1.5px solid var(--border); border-radius:12px; background:#fff; cursor:pointer;
  font-family:inherit; text-align:left; transition:border-color .15s,box-shadow .15s,background .15s; }
.nt-type:last-child{ margin-bottom:0; }
.nt-type:hover{ border-color:#f2c4ab; background:#fffaf7; }
.nt-type.sel{ border-color:var(--prj); background:var(--prj-soft); box-shadow:0 0 0 3px rgba(232,98,45,.14); }
.nt-tic{ width:38px; height:38px; border-radius:10px; flex:none; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--prj-d),var(--prj)); color:#fff; }
.nt-ttx{ flex:1; min-width:0; }
.nt-ttx b{ display:block; font-size:13.5px; color:var(--text); line-height:1.25; }
.nt-ttx small{ display:block; font-size:11px; color:var(--muted); line-height:1.4; margin-top:2px; }
.nt-tgo{ flex:none; color:var(--muted); font-size:19px; line-height:1; }

/* Επιλογή ατόμων ανά τμήμα (admin) */
.nt-dept{ border-top:1px solid var(--border); }
.nt-dept:first-child{ border-top:none; }
.nt-dhd{ width:100%; display:flex; align-items:center; gap:8px; padding:9px 12px; background:#f7f9fd;
  border:none; cursor:pointer; font-family:inherit; text-align:left; }
.nt-dhd:hover{ background:#f0f4fa; }
.nt-dhd b{ font-size:12.5px; color:var(--text); }
.nt-dhd small{ font-size:10.5px; color:var(--muted); }
.nt-dch{ flex:none; color:var(--muted); font-size:16px; line-height:1; transition:transform .16s; }
.nt-dept.open .nt-dch{ transform:rotate(90deg); }
.nt-dsel{ margin-left:auto; background:var(--prj-soft); color:var(--prj-d); font-weight:800;
  font-size:10.5px; padding:2px 8px; border-radius:20px; }
.nt-dbody{ display:none; }
.nt-dept.open .nt-dbody{ display:block; }
.nt-dbody .np-prow{ padding-left:26px; }
/* Στο «Απλό» οι δύο ενότητες είναι μαζί: κοντύτερη λίστα για να μη σκεπάζει
   το dock τα κουμπιά του footer σε οθόνες ~900px. */
#ntWin .nt-tight .np-people{ max-height:min(190px,24vh); }
/* Σε λειτουργία παραθύρων το dock περνά ΠΑΝΩ από τα popup (body.mdi .dock z-index:110).
   Ο wizard δεν φτάνει ποτέ τόσο χαμηλά ώστε να σκεπαστούν τα κουμπιά του footer —
   το σώμα του popup κυλά από μόνο του. Μόνο desktop: στο κινητό δεν υπάρχει επικάλυψη. */
@media (min-width:901px){ #ntWin{ max-height:min(90vh,calc(100vh - 200px)); } }
.np-prow input[type=radio]{ width:16px; height:16px; accent-color:var(--prj); flex:none; cursor:pointer; }
/* Αρχειοθετημένο έργο (57-project-archive): ουδέτερο γκρι, χωρίς το μπλε της ενέργειας */
.prj-card.arch{background:#f7f9fc;border-style:dashed;border-top:3px dashed #94a3b8}
.prj-card.arch:hover{border-color:#b8c3d3;box-shadow:0 6px 22px rgba(71,85,105,.14)}
/* Επαναφορά · Οριστική διαγραφή · Κλείσιμο: σε στενό παράθυρο τυλίγεται η ΣΕΙΡΑ, όχι το κείμενο */
.prj-modal .modal-f{flex-wrap:wrap}
.prj-modal .modal-f .btn{white-space:nowrap}
.prj-card.arch .prj-ic{background:#e3e8f0;color:#475569}
.prj-card.arch .prj-bar .mini-bar i{background:#94a3b8}
/* Επεξεργασία έργου (58-project-edit): νέα ανάθεση = γραμμή ατόμου + μικρή φόρμα από κάτω */
.pe-new{display:flex;flex-direction:column;border:1px solid #a6ddbc;border-radius:10px;overflow:hidden;background:#fff}
.pe-new .te-p.new{border:none;border-radius:0;border-bottom:1px solid #d6efe0}
.pe-newf{padding:6px 12px 12px;display:flex;flex-direction:column}
.pe-newf label{margin-top:8px}
.pe-newf .opt{font-weight:500;color:var(--muted);text-transform:none;letter-spacing:0}
/* ---------- AI Βοηθός ---------- */
  /* Κουμπί «Ai» στο header — στρογγυλό, ζωντανό gradient & σκιά, ξεχωρίζει */
  #aiBtn{position:relative;width:40px;height:40px;flex:none;border-radius:50%;border:none;cursor:pointer;
    color:#fff;font-weight:800;font-size:15px;letter-spacing:.2px;display:grid;place-items:center;
    background:linear-gradient(135deg,#7c3aed,#4f46e5 45%,#06b6d4);
    box-shadow:0 2px 12px rgba(124,58,237,.55), inset 0 0 0 1px rgba(255,255,255,.18);
    transition:transform .15s ease, box-shadow .2s ease}
  #aiBtn:hover{transform:translateY(-1px) scale(1.06);box-shadow:0 5px 18px rgba(124,58,237,.72), inset 0 0 0 1px rgba(255,255,255,.3)}
  #aiBtn:active{transform:scale(.97)}
  #aiBtn span{font-style:normal;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.22)}
  #aiBtn::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid rgba(124,58,237,.5);opacity:0;pointer-events:none;animation:aiPulse 2.8s ease-out infinite}
  @keyframes aiPulse{0%{transform:scale(.92);opacity:.55}70%{transform:scale(1.4);opacity:0}100%{opacity:0}}

  /* Overlay (κλικ έξω = ελαχιστοποίηση) — κεντραρισμένο popup */
  .ai-ov{position:fixed;inset:0;z-index:120;background:rgba(12,17,30,.34);
    backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
    display:flex;align-items:center;justify-content:center;padding:20px;animation:aiOvIn .18s ease}
  @keyframes aiOvIn{from{opacity:0}to{opacity:1}}

  .ai-win{width:min(720px,94vw);height:min(680px,88vh);background:#fff;border-radius:20px;overflow:hidden;
    display:flex;flex-direction:column;
    box-shadow:0 26px 72px rgba(15,23,42,.42), 0 0 0 1px rgba(124,58,237,.12);
    animation:aiWinIn .24s cubic-bezier(.2,.85,.25,1)}
  @keyframes aiWinIn{from{transform:translateY(18px) scale(.98);opacity:0}to{transform:none;opacity:1}}

  .ai-head{display:flex;align-items:center;gap:11px;padding:12px 13px;color:#fff;
    background:linear-gradient(120deg,#4f46e5,#7c3aed 55%,#0891b2)}
  .ai-head-l{display:flex;align-items:center;gap:10px;min-width:0}
  .ai-head-t{display:flex;flex-direction:column;line-height:1.28;min-width:0}
  .ai-head-t b{font-size:14px}
  .ai-head-t span{font-size:10.5px;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ai-x{margin-left:auto;width:30px;height:30px;flex:none;border:none;border-radius:9px;cursor:pointer;
    background:rgba(255,255,255,.16);color:#fff;display:grid;place-items:center;transition:.15s}
  .ai-x:hover{background:rgba(255,255,255,.32)}

  .ai-orb{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;
    font-weight:800;font-size:14px;color:#fff;
    background:linear-gradient(135deg,#c084fc,#818cf8 50%,#22d3ee);
    box-shadow:0 2px 8px rgba(0,0,0,.22), inset 0 0 0 2px rgba(255,255,255,.4)}

  .ai-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;
    background:linear-gradient(180deg,#f7f8fc,#eef1f8)}

  .ai-msg{display:flex;gap:8px;max-width:100%}
  .ai-msg.out{justify-content:flex-end}
  .ai-msg.in{justify-content:flex-start}
  .ai-av{width:28px;height:28px;flex:none;align-self:flex-end;border-radius:50%;display:grid;place-items:center;
    font-weight:800;font-size:10.5px;color:#fff;
    background:linear-gradient(135deg,#c084fc,#818cf8 50%,#22d3ee);box-shadow:0 1px 5px rgba(99,102,241,.4)}
  .ai-bub{max-width:82%;padding:10px 13px;border-radius:15px;font-size:13px;line-height:1.5;
    word-wrap:break-word;overflow-wrap:anywhere}
  .ai-msg.out .ai-bub{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;
    border-bottom-right-radius:5px;box-shadow:0 2px 9px rgba(79,70,229,.32)}
  .ai-msg.in .ai-bub{background:#fff;color:var(--text);border:1px solid var(--border);
    border-bottom-left-radius:5px;box-shadow:var(--shadow)}
  .ai-bub.err{background:#fef2f2;border-color:#f3c9c7;color:#a12b28}
  .ai-bub>div{margin:0}
  .ai-bub>div+div{margin-top:5px}
  .ai-bub ul{margin:5px 0;padding-left:17px;display:flex;flex-direction:column;gap:3px}
  .ai-bub li{margin:0}
  .ai-bub b{font-weight:700}
  .ai-bub code{background:rgba(99,102,241,.12);padding:1px 5px;border-radius:5px;font-size:12px;
    font-family:ui-monospace,Menlo,Consolas,monospace}
  .ai-msg.out .ai-bub code{background:rgba(255,255,255,.22)}

  /* Clickable inline chip (μικρό έγχρωμο εικονίδιο μέσα στο κείμενο) */
  .ai-chip{display:inline-grid;place-items:center;width:23px;height:23px;border-radius:7px;border:none;cursor:pointer;
    vertical-align:-6px;margin:0 2px;color:#fff;transition:.12s;box-shadow:0 1px 3px rgba(0,0,0,.22)}
  .ai-chip:hover{transform:translateY(-1px);filter:brightness(1.08)}
  .ai-chip svg{width:14px;height:14px}
  .ai-chip.task{background:linear-gradient(135deg,#e8622d,#832f0d)}
  .ai-chip.project{background:linear-gradient(135deg,#3b82f6,#1e3a8a)}
  .ai-chip.contact{background:linear-gradient(135deg,#2e6fd8,#123c74)}
  .ai-chip.person{background:linear-gradient(135deg,#66738a,#3a4557)}

  /* Clickable κάρτα (γραμμή = κωδικός) */
  .ai-card{display:flex;align-items:center;gap:10px;width:100%;text-align:left;cursor:pointer;
    border:1px solid var(--border);border-radius:12px;background:#fff;padding:9px 11px;margin:6px 0;
    box-shadow:0 1px 3px rgba(21,36,59,.06);transition:.14s}
  .ai-card:hover{border-color:#c9b8f5;box-shadow:0 5px 16px rgba(124,58,237,.16);transform:translateY(-1px)}
  .ai-card-ic{width:34px;height:34px;flex:none;border-radius:9px;display:grid;place-items:center;color:#fff;overflow:hidden}
  .ai-card-ic svg{width:18px;height:18px}
  .ai-card.task .ai-card-ic{background:linear-gradient(135deg,#e8622d,#832f0d)}
  .ai-card.project .ai-card-ic{background:linear-gradient(135deg,#3b82f6,#1e3a8a)}
  .ai-card.contact .ai-card-ic{background:linear-gradient(135deg,#2e6fd8,#123c74)}
  .ai-card.person .ai-card-ic{background:transparent}
  .ai-card-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
  .ai-card-t{font-size:13px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ai-card-sub{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ai-card-go{flex:none;color:#b7c0d0;font-size:19px;font-weight:700;line-height:1}
  .ai-card:hover .ai-card-go{color:#7c3aed}

  /* Badges μέσα σε κάρτες */
  .ai-b{flex:none;font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:20px;background:#eef1f8;color:#4a5568;white-space:nowrap}
  .ai-b.high{background:#fdecea;color:#c0392b}
  .ai-b.done{background:#e2f5ea;color:#1e7e45}
  .ai-b.mid{background:#fff3df;color:#a5710b}
  .ai-b.proj{background:#e7effc;color:#1e3a8a}
  .ai-b.on{background:#e2f5ea;color:#1e7e45}

  /* Στήλη περιεχομένου στην πλευρά του βοηθού (bubble + κάρτες ενεργειών) */
  .ai-in-col{display:flex;flex-direction:column;gap:7px;max-width:86%;min-width:0}
  .ai-in-col .ai-bub{max-width:100%}
  .ai-in-col .ai-card{margin:0}

  /* Κάρτα ενέργειας (επιβεβαίωση αλλαγής) */
  .ai-act{border:1px solid #d9d0f5;border-radius:13px;background:linear-gradient(180deg,#fbfaff,#f4f1fe);
    padding:11px 12px;box-shadow:0 2px 8px rgba(124,58,237,.1)}
  .ai-act-top{display:flex;align-items:flex-start;gap:10px}
  .ai-act-ic{width:32px;height:32px;flex:none;border-radius:9px;display:grid;place-items:center;color:#fff;
    background:linear-gradient(135deg,#7c3aed,#4f46e5)}
  .ai-act.task .ai-act-ic{background:linear-gradient(135deg,#e8622d,#832f0d)}
  .ai-act.todo .ai-act-ic{background:linear-gradient(135deg,#eab545,#c67f0a)}
  .ai-act.note .ai-act-ic{background:linear-gradient(135deg,#5b8def,#2e6fd8)}
  .ai-act.report .ai-act-ic{background:linear-gradient(135deg,#34c17b,#1e9e5a)}
  .ai-act.notif .ai-act-ic{background:linear-gradient(135deg,#f5854f,#e8622d)}
  .ai-act-ic svg{width:17px;height:17px}
  .ai-act-tt{display:flex;flex-direction:column;gap:2px;min-width:0}
  .ai-act-tt b{font-size:12.5px;color:var(--text)}
  .ai-act-tt span{font-size:11.5px;color:var(--muted);line-height:1.45}
  .ai-act-f{display:flex;justify-content:flex-end;gap:8px;margin-top:11px}
  .ai-act-no{border:1px solid var(--border);background:#fff;color:var(--muted);border-radius:9px;padding:7px 13px;
    font-size:12px;font-weight:600;cursor:pointer;transition:.14s}
  .ai-act-no:hover{border-color:#c8cfda;color:var(--text);background:#fafbfd}
  .ai-act-yes{border:none;border-radius:9px;padding:7px 15px;font-size:12px;font-weight:700;cursor:pointer;color:#fff;
    background:linear-gradient(135deg,#7c3aed,#4f46e5);box-shadow:0 2px 8px rgba(124,58,237,.4);transition:.14s}
  .ai-act-yes:hover{transform:translateY(-1px);filter:brightness(1.05)}
  /* Αποτέλεσμα (done/cancelled) */
  .ai-act.res{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:#1e7e45;
    background:#f1fbf5;border-color:#c7ead4;box-shadow:none;padding:9px 12px}
  .ai-act.res.cancelled{color:var(--muted);background:#f6f7fa;border-color:var(--border)}
  .ai-act-rc{width:20px;height:20px;flex:none;border-radius:50%;display:grid;place-items:center;color:#fff;background:#9aa3b2}
  .ai-act-rc.ok{background:#1e9e5a}

  .ai-typing{display:flex;gap:5px;align-items:center;padding:12px 14px}
  .ai-typing span{width:7px;height:7px;border-radius:50%;background:#a3adc2;animation:aiBlink 1.2s infinite ease-in-out}
  .ai-typing span:nth-child(2){animation-delay:.18s}
  .ai-typing span:nth-child(3){animation-delay:.36s}
  @keyframes aiBlink{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

  .ai-welcome{margin:auto;text-align:center;padding:12px;display:flex;flex-direction:column;align-items:center;gap:11px}
  .ai-welcome-orb{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;
    font-weight:800;font-size:25px;color:#fff;
    background:linear-gradient(135deg,#c084fc,#818cf8 50%,#22d3ee);
    box-shadow:0 8px 26px rgba(124,58,237,.42), inset 0 0 0 3px rgba(255,255,255,.55);
    animation:aiFloat 3.2s ease-in-out infinite}
  @keyframes aiFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
  .ai-welcome h3{font-size:16px;color:var(--text)}
  .ai-welcome p{font-size:12.5px;color:var(--muted);max-width:290px;line-height:1.5}
  .ai-sugs{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-top:2px}
  .ai-sug{border:1px solid var(--border);background:#fff;border-radius:20px;padding:7px 13px;
    font-size:12px;font-weight:600;color:#5b3fd4;box-shadow:var(--shadow);cursor:pointer;transition:.15s}
  .ai-sug:hover{border-color:#7c3aed;background:#f5f3ff;transform:translateY(-1px)}

  /* Αναδιπλούμενη μπάρα έτοιμων ερωτήσεων (κρύβεται/εμφανίζεται) */
  .ai-sugbar{max-height:0;overflow:hidden;transition:max-height .24s ease;background:#faf9ff}
  .ai-sugbar.open{max-height:260px;overflow-y:auto}
  .ai-sugbar-in{padding:11px 13px;border-top:1px solid var(--border)}
  .ai-sugbar-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;
    font-size:10.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:#7c5fe0}
  .ai-sugbar-x{border:none;background:none;color:var(--muted);cursor:pointer;display:flex;padding:2px;border-radius:6px}
  .ai-sugbar-x:hover{color:var(--text);background:rgba(124,58,237,.1)}
  .ai-sugbar .ai-sugs{justify-content:flex-start}

  .ai-sugtoggle{width:40px;height:40px;flex:none;border:1.5px solid var(--border);border-radius:50%;cursor:pointer;
    background:#fff;color:#7c3aed;display:grid;place-items:center;transition:.15s}
  .ai-sugtoggle:hover{border-color:#7c3aed;background:#f5f3ff}
  .ai-sugtoggle.on{background:#f5f3ff;border-color:#7c3aed;box-shadow:0 0 0 3px rgba(124,58,237,.1)}

  /* Κουμπί μικροφώνου (υπαγόρευση) */
  .ai-mic{width:40px;height:40px;flex:none;border:1.5px solid var(--border);border-radius:50%;cursor:pointer;
    background:#fff;color:#66738a;display:grid;place-items:center;transition:.15s}
  .ai-mic:hover{border-color:#7c3aed;color:#7c3aed;background:#f5f3ff}
  .ai-mic.live{border-color:#e0393f;color:#fff;background:linear-gradient(135deg,#f0575c,#d0272d);
    box-shadow:0 0 0 0 rgba(224,57,63,.5);animation:aiMicPulse 1.4s infinite}
  @keyframes aiMicPulse{0%{box-shadow:0 0 0 0 rgba(224,57,63,.5)}70%{box-shadow:0 0 0 9px rgba(224,57,63,0)}100%{box-shadow:0 0 0 0 rgba(224,57,63,0)}}

  .ai-inrow{display:flex;align-items:flex-end;gap:9px;padding:11px 12px;border-top:1px solid var(--border);background:#fff}
  .ai-inrow textarea{flex:1;border:1.5px solid var(--border);border-radius:14px;padding:10px 13px;outline:none;
    font-size:13px;resize:none;max-height:120px;line-height:1.45;background:#fff;color:var(--text)}
  .ai-inrow textarea:focus{border-color:#7c3aed;box-shadow:0 0 0 3px rgba(124,58,237,.12)}
  .ai-send{width:40px;height:40px;flex:none;border:none;border-radius:50%;cursor:pointer;display:grid;place-items:center;
    color:#fff;background:linear-gradient(135deg,#7c3aed,#4f46e5 55%,#06b6d4);
    box-shadow:0 2px 10px rgba(124,58,237,.5);transition:.15s}
  .ai-send:hover{transform:scale(1.06)}
  .ai-send:active{transform:scale(.95)}

  /* Dock chip (σε αναμονή) — χρυσαφί/AI gradient icon */
  .dock-item .dock-ic.ai-dock{background:linear-gradient(135deg,#7c3aed,#4f46e5 50%,#06b6d4);
    color:#fff;font-weight:800;font-size:15px}

  @media(max-width:520px){
    .ai-ov{padding:0}
    /* dvh = πραγματικό ορατό ύψος (χωρίς τη μπάρα browser) → δεν κόβεται η γραμμή γραφής */
    .ai-win{width:100vw;max-width:100vw;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;border-radius:0}
    /* η γραμμή γραφής πάνω από το home indicator του iPhone */
    .ai-inrow{padding-bottom:calc(11px + env(safe-area-inset-bottom))}
  }
/* ---------- ΒΟΗΘΕΙΑ (Help) ----------
   Χρώμα ΟΥΔΕΤΕΡΟ γραφίτη επίτηδες: τα covers των άρθρων φέρνουν ήδη τα χρώματα
   όλων των modules· έγχρωμο πλαίσιο από πάνω θα τα έπνιγε. */
  :root{ --hlp-1:#111827; --hlp-2:#374151; }

  /* Hero — η αναζήτηση μόνη της, ευδιάκριτη */
  .hlp-hero{position:relative;overflow:hidden;border-radius:16px;padding:34px 20px 28px;text-align:center;
    background:linear-gradient(135deg,var(--hlp-1),var(--hlp-2));margin-bottom:6px}
  .hlp-hero::after{content:"";position:absolute;right:-70px;top:-90px;width:280px;height:280px;border-radius:50%;
    background:rgba(255,255,255,.045);pointer-events:none}
  .hlp-hero h1{font-size:26px;color:#fff;letter-spacing:-.3px}
  .hlp-hero p{font-size:13.5px;color:rgba(255,255,255,.68);margin-top:6px}
  .hlp-search{position:relative;z-index:1;display:flex;align-items:center;gap:12px;width:min(640px,100%);
    margin:20px auto 0;background:#fff;border-radius:15px;padding:13px 17px;
    box-shadow:0 18px 40px rgba(8,14,28,.28),0 2px 6px rgba(8,14,28,.18)}
  .hlp-search .i{color:#64748b;flex:none}
  .hlp-search input{flex:1;min-width:0;border:none;outline:none;background:none;font-size:17px;color:#1c2536}
  .hlp-search input::placeholder{color:#9aa3b0}
  .hlp-clr{border:none;background:none;color:var(--muted);display:flex;flex:none;cursor:pointer;padding:2px}
  .hlp-chips{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin-top:14px}
  .hlp-chip{border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.1);color:#e6eaf1;
    border-radius:20px;padding:5px 13px;font-size:12px;font-weight:600;cursor:pointer}
  .hlp-chip:hover{background:rgba(255,255,255,.2)}
  .hlp-new{position:relative;z-index:1;margin-top:14px;border:1px solid rgba(255,255,255,.25);background:none;
    color:#fff;border-radius:9px;padding:6px 13px;font-size:12px;font-weight:700;cursor:pointer;
    display:inline-flex;align-items:center;gap:6px}

  /* Ενότητες */
  .hlp-sec{display:flex;align-items:center;gap:9px;margin:26px 0 12px}
  .hlp-sec h2{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.7px;color:var(--muted)}
  .hlp-sec::after{content:"";flex:1;height:1px;background:var(--border)}
  .hlp-cnt{font-size:11px;font-weight:800;color:var(--blue);background:var(--blue-soft);border-radius:6px;padding:1px 6px;order:-1}
  .hlp-sec .hlp-cnt{order:0}

  /* Grid δημοφιλών */
  .hlp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:16px}
  .hlp-card{background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden;cursor:pointer;
    text-align:left;transition:transform .16s ease,box-shadow .16s ease;display:flex;flex-direction:column}
  .hlp-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(15,26,48,.13)}
  .hlp-card:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
  .hlp-cov{display:block;line-height:0}
  .hlp-cover{display:block;width:100%;height:auto;aspect-ratio:16/9}
  .hlp-card .b{padding:12px 14px 14px}
  .hlp-card .tp{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
  .hlp-card h3{font-size:14.5px;line-height:1.35;margin-top:5px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .hlp-card p{font-size:12px;color:var(--muted);line-height:1.5;margin-top:5px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .hlp-meta{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:11px;color:var(--muted)}
  .hlp-done{font-style:normal;color:var(--green);font-weight:700;display:inline-flex;align-items:center;gap:3px}

  /* Λίστα / αποτελέσματα */
  .hlp-list{display:flex;flex-direction:column;gap:3px}
  .hlp-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:1px solid transparent;
    background:none;border-radius:11px;padding:9px 11px;cursor:pointer}
  .hlp-row:hover{background:#fff;border-color:var(--border)}
  .hlp-row .ic{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;color:#fff;flex:none}
  .hlp-row .tx{display:flex;flex-direction:column;min-width:0;flex:1}
  .hlp-row .t{font-size:13.5px;font-weight:700;color:var(--ink,#1c2536)}
  .hlp-row .s{font-size:12px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hlp-row .go{color:var(--muted);font-size:17px;flex:none}
  .hlp-empty{background:#fff;border:1px dashed var(--border);border-radius:12px;padding:20px;
    text-align:center;color:var(--muted);font-size:13px}

  /* Κατηγορίες & σελιδοποίηση */
  .hlp-cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
  .hlp-cats button{border:1px solid var(--border);background:#fff;border-radius:20px;padding:5px 12px;
    font-size:12px;font-weight:600;color:var(--muted);cursor:pointer}
  .hlp-cats button.active{background:var(--hlp-1);border-color:var(--hlp-1);color:#fff}
  .hlp-pag{display:flex;justify-content:center;align-items:center;gap:5px;margin-top:22px}
  .hlp-pag button{min-width:32px;height:32px;border:1px solid var(--border);background:#fff;border-radius:9px;
    font-size:12.5px;font-weight:700;color:var(--muted);cursor:pointer}
  .hlp-pag button.active{background:var(--hlp-1);border-color:var(--hlp-1);color:#fff}
  .hlp-pag button:disabled{opacity:.4;cursor:default}

  /* Ai block */
  .hlp-ai{margin-top:18px;border:1px solid #e6ddfb;background:#faf7ff;border-radius:13px;padding:13px 14px}
  .hlp-ai-h{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:800;color:#7c3aed;margin-bottom:6px}

  /* Ανάγνωση άρθρου */
  .hlp-art{max-width:860px;margin:0 auto}
  /* Λωρίδα, όχι μισή οθόνη: στην ανάγνωση προτεραιότητα έχει το κείμενο.
     Το SVG έχει preserveAspectRatio="slice" → κόβει, δεν παραμορφώνει. */
  .hlp-artcov{border-radius:16px;overflow:hidden;line-height:0;margin-bottom:18px}
  .hlp-artcov .hlp-cover{aspect-ratio:auto;height:200px}
  .hlp-pop .hlp-artcov .hlp-cover{height:130px}
  .hlp-bc{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
  .hlp-art h1{font-size:27px;line-height:1.25;margin-top:7px;letter-spacing:-.3px}
  .hlp-lead{font-size:15px;color:var(--muted);line-height:1.6;margin-top:9px;max-width:68ch}
  /* 68ch: το μήκος γραμμής είναι ο #1 παράγοντας αναγνωσιμότητας */
  .hlp-body{max-width:68ch;font-size:16.5px;line-height:1.75;color:#243044;margin-top:22px}
  .hlp-body h2{font-size:19px;line-height:1.3;margin:30px 0 10px;color:#111827}
  .hlp-body h3{font-size:16px;margin:24px 0 8px;color:#111827}
  .hlp-body p{margin:0 0 15px}
  .hlp-body ul{margin:0 0 15px;padding-left:20px}
  .hlp-body li{margin-bottom:8px}
  .hlp-body code{background:var(--bg);border:1px solid var(--border);border-radius:5px;padding:1px 5px;font-size:14px}
  .hlp-body a{color:var(--blue);font-weight:600}
  .hlp-tip{background:var(--blue-soft);border-left:3px solid var(--blue);border-radius:0 10px 10px 0;
    padding:12px 14px;margin:0 0 16px;font-size:15px;color:#2b4d86}

  /* Popup βοήθειας (contextual «?») — δικό του root, πάνω από όλα */
  .hlp-ov{z-index:1150}
  .hlp-modal{max-width:720px}
  .hlp-pop .hlp-artcov{margin-bottom:14px}
  .hlp-pop h1{font-size:21px}
  .hlp-pop .hlp-lead{font-size:14px}
  .hlp-pop .hlp-body{font-size:15px;line-height:1.7;margin-top:16px}
  .hlp-pop .hlp-body h2{font-size:17px;margin:22px 0 8px}
  .hlp-pop .hlp-tip{font-size:14px}

  /* Το «?» στις κεφαλίδες */
  .mh-help{margin-left:auto;border:none;background:rgba(255,255,255,.18);color:#fff;width:26px;height:26px;
    border-radius:50%;font-size:14px;font-weight:800;line-height:1;flex:none;cursor:pointer;display:grid;place-items:center}
  .mh-help:hover{background:rgba(255,255,255,.32)}
  .modal-h .mh-help + .x{margin-left:8px}
  .hlp-q{border:1px solid var(--border);background:#fff;color:var(--muted);width:26px;height:26px;border-radius:50%;
    font-size:14px;font-weight:800;line-height:1;flex:none;cursor:pointer;display:inline-grid;place-items:center;margin-left:8px}
  .hlp-q:hover{border-color:var(--blue);color:var(--blue)}

  /* Συντάκτης (God Mode) */
  .hlp-aud{display:flex;flex-wrap:wrap;gap:14px;margin-top:5px}
  .hlp-cb{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;margin:0}
  .hlp-cb input{width:auto}
  .hlp-warn{display:flex;align-items:flex-start;gap:7px;background:var(--amber-soft);border-radius:9px;
    padding:9px 11px;font-size:11.5px;color:#7a5104;line-height:1.45;margin-top:9px}
  .chat-head .ch-help{border:none;background:rgba(255,255,255,.16);color:inherit;width:22px;height:22px;
    border-radius:50%;font-size:12px;font-weight:800;line-height:1;margin-left:auto;cursor:pointer;
    display:grid;place-items:center;opacity:.75}
  .chat-head .ch-help:hover{opacity:1}
  .chat-head .ch-help + button{margin-left:6px}
  .calc-head .ch-help{margin-left:auto;background:rgba(255,255,255,.14);color:inherit;border:none;
    width:22px;height:22px;border-radius:50%;font-size:12px;font-weight:800;line-height:1;cursor:pointer;
    display:grid;place-items:center;opacity:.7}
  .calc-head .ch-help:hover{opacity:1}
/* =====================================================================
   ΠΥΛΗ (Gate) — module 34-gate · steel/teal #0f3b52→#1d7a99
   Φάση 1: interface + λειτουργίες με mock δεδομένα (καμία βάση)
===================================================================== */
  /* Sidebar accordion (υπομενού Πύλης) */
  .nav-item .nav-caret{margin-left:auto;font-size:11px;opacity:.85}
  .nav-subwrap{display:flex;flex-direction:column;gap:2px;margin:2px 0 6px 10px;padding-left:8px;border-left:2px solid rgba(255,255,255,.14)}
  .nav-sub{display:flex;align-items:center;gap:9px;background:none;border:none;color:rgba(255,255,255,.82);font-size:13px;text-align:left;padding:7px 10px;border-radius:8px;cursor:pointer}
  .nav-sub svg.i{width:16px;height:16px;flex:none;color:#9fd0e6}
  .nav-sub:hover{background:rgba(255,255,255,.07)}
  .nav-sub.active{background:linear-gradient(90deg,#0f6e8c,#1d7a99);color:#fff;font-weight:700}
  .nav-sub.active svg.i{color:#fff}
  .nav-item.ni-gate svg.i{color:#7dd3fc}

  /* Stat cards */
  .gate-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
  @media(max-width:900px){.gate-stats{grid-template-columns:repeat(2,1fr)}}
  .gstat{display:flex;align-items:center;gap:13px;padding:16px;border-radius:14px;color:#fff;cursor:pointer;box-shadow:0 2px 10px rgba(21,36,59,.12);transition:.15s}
  .gstat:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(21,36,59,.18)}
  .gstat .gic{width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.2);display:grid;place-items:center;flex:none}
  .gstat .gl{font-size:12.5px;opacity:.9;font-weight:600}
  .gstat .gv{font-size:28px;font-weight:800;line-height:1.1}
  .gstat.g-in{background:linear-gradient(135deg,#3b82f6,#4f46e5)}
  .gstat.g-drv{background:linear-gradient(135deg,#fb923c,#ef4444)}
  .gstat.g-stf{background:linear-gradient(135deg,#34d399,#0d9488)}
  .gstat.g-active{outline:3px solid rgba(255,255,255,.6);outline-offset:2px}
  .gstat.g-clock{background:#fff;color:var(--ink);border:1px solid var(--border);cursor:default;justify-content:center}
  .gstat.g-clock .gic{background:var(--blue-soft);color:var(--blue)}
  .gstat.g-clock .gv{font-size:22px;color:var(--ink)}
  .gstat.g-clock .gl{color:var(--muted)}

  /* Add form */
  .gate-card{background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);margin-bottom:16px}
  .gate-card>.gc-h{display:flex;align-items:center;gap:9px;padding:14px 16px;border-bottom:1px solid var(--border);font-weight:700;font-size:15px}
  .gate-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:14px 16px}
  @media(max-width:900px){.gate-grid{grid-template-columns:1fr 1fr}}
  .gate-grid label{display:block;font-size:12px;font-weight:700;margin-bottom:5px}
  .gate-grid input,.gate-grid select{width:100%;border:1px solid var(--border);border-radius:9px;padding:9px 11px;outline:none;background:#fff;font-size:13px}
  .gate-grid input:focus,.gate-grid select:focus{border-color:var(--blue)}
  .gate-foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:0 16px 16px}
  .gate-qa{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
  .gate-qa .qa,.gqa-it .qa{background:#eef4ff;border:1px solid #cfe0fb;color:#1e40af;border-radius:8px;padding:6px 11px;font-size:12px;font-weight:600;cursor:pointer}
  .gate-qa .qa:hover,.gqa-it .qa:hover{background:#dfeaff}
  .gate-qa .qa.rsn,.gqa-it .qa.rsn{background:#f0fdfa;border-color:#bff0e6;color:#0d7a6b}
  .gqa-it .qa.rsn:hover{background:#dcfaf2}
  .qa-round{width:30px;height:30px;border-radius:50%;border:1px solid var(--border);background:#fff;cursor:pointer;display:grid;place-items:center}
  .qa-round.del{border-color:#f3c7c5;color:var(--red)}
  .paralavi{background:none;border:none;color:var(--blue);font-weight:700;font-size:11px;cursor:pointer}
  /* Κάρτα «Γρήγορες Επιλογές» (ξεχωριστή, κάτω από τη φόρμα) */
  .gate-qa-card .gqa-body{padding:14px 16px;display:flex;flex-direction:column;gap:14px}
  /* Δύο στήλες (καρτέλα «Οδηγοί»): Οδηγοί | Πινακίδες */
  .gate-qa-card .gqa-body.two{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
  .gqa-col{border:1px solid var(--border);border-radius:12px;background:var(--bg-soft,#f8fafc);padding:10px 11px 8px;min-width:0}
  .gqa-n{margin-left:auto;background:#e2e8f0;color:#475569;border-radius:20px;padding:1px 7px;font-size:10px}
  /* 3 καταχωρήσεις ανά σειρά, μετά συνεχίζει από κάτω */
  .gqa-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;max-height:300px;overflow-y:auto;margin-top:6px}
  .gqa-grid .gqa-empty{grid-column:1/-1}
  .gqa-it{display:flex;align-items:center;gap:1px;background:#fff;border:1px solid var(--border);border-radius:9px;padding:3px 3px 3px 1px}
  .gqa-it:hover{border-color:#9ec5fb}
  .gqa-it.drag{opacity:.45}
  .gqa-it .ggrip{width:12px;flex:none;text-align:center;color:#94a3b8;font-size:11px;cursor:grab;line-height:1;user-select:none}
  .gqa-it .qa{flex:1;min-width:0;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:6px 7px;font-size:11.5px}
  /* «Εντός Χώρου»: τα κουμπιά μένουν το ένα δίπλα στο άλλο, με λαβή για σύρσιμο */
  .gqa-in{display:inline-flex;align-items:center;gap:1px}
  .gqa-in .ggrip{width:12px;flex:none;text-align:center;color:#94a3b8;font-size:11px;cursor:grab;line-height:1;user-select:none}
  .gate-wrap{width:100%}
  .gw-pick{position:relative;display:inline-flex}
  /* ΠΡΟΣΟΧΗ: το .glay δηλώνεται ΠΙΟ ΚΑΤΩ (grid, σταθερό 34px) — χρειάζεται
     διπλή κλάση για να υπερισχύσει, αλλιώς το κείμενο τυλίγεται κάτω από το εικονίδιο. */
  .glay.gw-btn{width:auto;height:30px;padding:0 10px;gap:6px;font-size:11.5px;color:var(--ink);
    display:inline-flex;align-items:center;white-space:nowrap;flex:none}
  .glay.gw-btn:hover{background:var(--bg)}
  .glay.gw-btn b{font-weight:800}
  .gw-car{color:var(--muted);font-size:9px}
  .gw-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:60;background:#fff;border:1px solid var(--border);
    border-radius:12px;box-shadow:0 14px 34px rgba(15,59,82,.22);padding:5px;min-width:232px}
  .gw-menu[hidden]{display:none}
  .gw-opt{display:flex;align-items:center;gap:9px;width:100%;border:0;background:none;cursor:pointer;
    padding:7px 9px;border-radius:9px;font-size:12px;color:var(--ink);text-align:left}
  .gw-opt:hover{background:var(--accent-soft)}
  .gw-opt.on{background:#e8f2fb}
  .gw-opt b{flex:none;font-weight:700}
  .gw-prev{flex:none;width:34px;height:15px;border:1px solid var(--border);border-radius:4px;background:#f1f5f9;
    display:grid;place-items:center;overflow:hidden}
  .gw-prev i{height:9px;background:linear-gradient(90deg,#1d7a99,#0f3b52);border-radius:2px;display:block}
  .gw-px{margin-left:auto;color:var(--muted);font-size:10.5px}
  .gw-ck{flex:none;width:14px;color:#1d7a99;display:grid;place-items:center}
  .gl-sep{width:1px;height:18px;background:var(--border);margin:0 4px}
  .g-ret{margin-left:6px;font-size:9.5px;font-weight:800;color:#0d7a6b;background:#e6f7f3;border-radius:20px;padding:2px 7px;letter-spacing:.2px}
  .g-mv{flex:none;width:16px;height:24px;border:1px solid var(--border);background:#fff;border-radius:6px;cursor:pointer;color:#475569;font-size:13px;line-height:1;display:grid;place-items:center;padding:0}
  .g-mv:hover:not(:disabled){background:#eef4ff;border-color:#9ec5fb}
  .g-mv:disabled{opacity:.3;cursor:default}
  .gqa-empty{padding:14px 8px;text-align:center;color:var(--muted);font-size:11.5px}
  .gqa-acts{display:flex;justify-content:center;gap:8px;padding-top:9px}
  @media(max-width:1180px){ .gqa-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
  @media(max-width:860px){ .gate-qa-card .gqa-body.two{grid-template-columns:1fr}
    .gqa-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
  @media(max-width:620px){ .gqa-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
  .gqa-lbl{width:100%;font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;display:flex;align-items:center;gap:6px;margin-bottom:1px}
  .gate-col>*:last-child{margin-bottom:0}

  /* Table */
  .gate-tbl-wrap{background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}
  .gate-tbl-wrap>.gc-h{display:flex;align-items:center;gap:9px;padding:14px 16px;border-bottom:1px solid var(--border);font-weight:700;font-size:15px}
  table.gate-tbl{width:100%;border-collapse:collapse}
  .gate-tbl th{text-align:left;padding:10px 14px;font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;border-bottom:1px solid var(--border)}
  .gate-tbl td{padding:11px 14px;border-bottom:1px solid #f2f4f8;font-size:13px;vertical-align:middle}
  .gate-tbl tr:last-child td{border-bottom:none}
  .gate-tbl .g-name{font-weight:700}
  .gate-tbl .g-sub{font-size:12px;color:var(--muted)}
  .gelap{font-size:12px;font-weight:700;color:#0d7a6b}
  .g-acts{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
  .g-btn{border:none;border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;cursor:pointer;color:#fff;display:inline-flex;align-items:center;gap:6px}
  .g-btn.exit{background:#ef4444}.g-btn.exit:hover{background:#dc2626}
  .g-btn.enter{background:#3b82f6}.g-btn.enter:hover{background:#2563eb}
  .g-mini{width:32px;height:32px;border-radius:8px;border:1px solid var(--border);background:#fff;cursor:pointer;display:grid;place-items:center;color:var(--muted)}
  .g-mini:hover{background:var(--bg)}
  .g-mini.del{color:var(--red);border-color:#f3c7c5}
  .g-mini.warn{color:#b8860b;border-color:#f0d98a}
  .gate-empty{padding:40px 20px;text-align:center;color:var(--muted);font-size:13px}
  .g-chip{display:inline-block;font-size:10.5px;font-weight:800;border-radius:6px;padding:2px 8px}
  .g-chip.ent{background:#dcfce7;color:#166534}.g-chip.ex{background:#fee2e2;color:#991b1b}
  @media(max-width:760px){.gate-rep-ctrls{grid-template-columns:1fr!important}}

  /* Toggle διάταξης dashboard (στοίβα / δύο στήλες) — κάτω από το ρολόι, δεξιά */
  .gate-layout-bar{display:flex;align-items:center;justify-content:flex-end;gap:7px;margin:-2px 0 14px}
  .gl-lbl{font-size:12px;font-weight:700;color:var(--muted);margin-right:2px}
  .glay{width:34px;height:30px;border:1px solid var(--border);background:#fff;border-radius:9px;cursor:pointer;display:grid;place-items:center;color:var(--muted);transition:all .15s}
  .glay:hover{background:var(--bg);color:var(--ink)}
  .glay.active{background:linear-gradient(135deg,#0f3b52,#1d7a99);border-color:#0f3b52;color:#fff}

  /* Διάταξη δύο στηλών: αριστερά «Νέα Καταχώρηση», δεξιά ο πίνακας */
  .gate-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
  .gate-cols>*{margin-bottom:0}
  @media(max-width:900px){.gate-cols{grid-template-columns:1fr}}

  /* Στατιστικά — οριζόντιες μπάρες (επισκέπτες/παραμονές/οδηγοί) */
  .gsb-list{display:flex;flex-direction:column;gap:9px}
  .gsb-row{display:grid;grid-template-columns:180px 1fr 78px;align-items:center;gap:12px}
  .gsb-name{font-size:12.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gsb-track{height:16px;background:var(--bg);border-radius:8px;overflow:hidden}
  .gsb-fill{height:100%;border-radius:8px;min-width:4px;transition:width .3s}
  .gsb-val{font-size:12px;font-weight:700;color:var(--muted);text-align:right}
  @media(max-width:640px){.gsb-row{grid-template-columns:110px 1fr 60px;gap:8px}.gsb-name{font-size:11.5px}}

  /* Στατιστικά — κάθετες μπάρες (ώρες αιχμής) */
  .gpeak{overflow-x:auto}
  .gpeak-bars{display:flex;align-items:flex-end;gap:4px;height:220px;min-width:560px;padding-top:6px}
  .gpeak-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;height:100%}
  .gpeak-wrap{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center}
  .gpeak-bar{width:70%;max-width:20px;border-radius:5px 5px 0 0;background:linear-gradient(180deg,#ef4444,#dc2626);min-height:0;transition:height .3s}
  .gpeak-h{font-size:10px;color:var(--muted);font-weight:600}

  /* Εκτύπωση αναφοράς: μόνο η περιοχή #gatePrintArea (όπως το no-print του εισαγόμενου app) */
  .gate-print-header{display:none}
  @media print{
    body.gate-printing *{visibility:hidden!important}
    body.gate-printing #gatePrintArea,body.gate-printing #gatePrintArea *{visibility:visible!important}
    body.gate-printing #gatePrintArea{position:absolute;left:0;top:0;width:100%;padding:12px}
    body.gate-printing .no-print{display:none!important}
    body.gate-printing .gate-print-header{display:block!important;font-size:17px;font-weight:800;text-align:center;margin-bottom:14px;color:#000}
    body.gate-printing .gate-tbl-wrap{border:none;box-shadow:none}
    body.gate-printing .gate-tbl th{color:#000}
  }
/* ================= ΣΗΜΕΙΩΣΕΙΣ — σελίδα «σημειωματάριο» (module 48) =================
   ΘΕΣΗ ΣΤΟ MANIFEST: ΠΡΙΝ το 36-mobile.css — όλο το mobile ζει εκεί και πρέπει
   να μπορεί να υπερισχύει (τα media queries ΔΕΝ ανεβάζουν ειδικότητα).
   Δύο προβολές: .nb-book (ευρετήριο + γραμμωμένη σελίδα) και .nb-wall (post-it).
   Το χρώμα του χαρτιού έρχεται ως inline μεταβλητές --pg/--ln/--ed/--tx. */
.nb-tools{display:flex;align-items:center;gap:10px;margin:12px 2px 14px}
.nb-srch{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--border);
  border-radius:11px;padding:9px 13px;flex:1;max-width:420px;color:var(--muted)}
.nb-srch input{border:none;outline:none;flex:1;font-size:13.5px;background:transparent;color:var(--text);font-family:inherit}
.nb-srch:focus-within{border-color:#2e6fd8;box-shadow:0 0 0 3px rgba(46,111,216,.14);color:#2e6fd8}

/* ---------- Προβολή «Σημειωματάριο» ----------
   Το ΕΥΡΕΤΗΡΙΟ είναι ΣΚΟΥΡΟ, με το ίδιο σώμα χρώματος με την αριθμομηχανή
   (`.calc` στο 05-calculator: linear-gradient(160deg,#1d2637,#131b2a), επιλογή #33415c).
   ΚΑΝΟΝΑΣ: κάθε χρώμα κειμένου μέσα στο `.nb-idx` γράφεται ΣΥΜΠΑΓΕΣ (όχι rgba πάνω
   στο gradient) ώστε η αντίθεση να είναι μετρήσιμη — τίτλος ≥7:1, προεπισκόπηση ≥4.5:1.
   Μην αφήσεις εκεί μέσα `var(--text)`/`var(--muted)`: είναι φτιαγμένα για ανοιχτό φόντο. */
.nb-book{display:grid;grid-template-columns:268px 34px minmax(0,1fr);background:var(--card);border:1px solid var(--border);
  border-radius:var(--radius);overflow:hidden;box-shadow:0 4px 18px rgba(21,36,59,.09);min-height:520px}
.nb-idx{background:linear-gradient(160deg,#1d2637,#131b2a);border-right:1px solid rgba(255,255,255,.07);
  padding:8px;overflow-y:auto;max-height:70vh;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent}
.nb-idx::-webkit-scrollbar{width:8px}
.nb-idx::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:8px}
.nb-idx::-webkit-scrollbar-track{background:transparent}
.nb-ir{display:flex;align-items:flex-start;gap:9px;padding:10px;border-radius:10px;cursor:pointer;
  border-left:3px solid transparent}
.nb-ir:hover{background:rgba(255,255,255,.07)}
.nb-ir.on{background:#33415c;border-left-color:#7ea6f5;box-shadow:0 1px 4px rgba(0,0,0,.35)}
.nb-dot{width:10px;height:10px;border-radius:3px;flex:none;margin-top:3px;box-shadow:0 0 0 1px rgba(255,255,255,.22)}
.nb-irt{flex:1;min-width:0}
.nb-irt b{display:block;font-size:12.8px;font-weight:700;color:#eef2f9;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nb-irt small{display:block;font-size:10.5px;color:#a3b0c6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nb-ir.on .nb-irt small{color:#c3cee1}
/* Το «κανένα αποτέλεσμα» ζει ΜΕΣΑ στη σκοτεινή στήλη — το var(--muted) εκεί πέφτει στο 3.3:1 */
.nb-idx .empty{color:#8e9bb2}

/* ---------- Η ΡΑΧΗ: σπιράλ ανάμεσα στο ευρετήριο και το χαρτί ----------
   ΔΙΚΗ ΤΗΣ ΣΤΗΛΗ στο grid (34px) — όχι επικάλυψη πάνω στο χαρτί: έτσι είναι
   ΑΔΥΝΑΤΟ να πέσει πάνω στους χαρακτήρες, ό,τι κι αν αλλάξει στο κείμενο.
   Οι κρίκοι ξεχειλίζουν 14px πάνω στο χαρτί (`right:-14px`) για να «τυλίγουν»
   την άκρη — μένουν 12px, πολύ πριν το κόκκινο περιθώριο (44px) και το
   κείμενο (60px). ΑΝ αλλάξεις το πλάτος της στήλης ή το overhang, ξαναμέτρησε:
   δεξιά άκρη κρίκου = 34 + 12 = 46px < 44px+padding χαρτιού. Φρουροί: tests/notes.js.
   ΒΗΜΑ 32px + background-position-y 14px = ΑΚΡΙΒΩΣ ο ρυθμός των γραμμών του χαρτιού. */
.nb-spiral{position:relative;z-index:2;
  background:linear-gradient(90deg,rgba(0,0,0,.5),rgba(0,0,0,.12) 48%,rgba(0,0,0,.34)),
             linear-gradient(160deg,#1d2637,#131b2a)}
/* σκιά του χαρτιού καθώς «γυρίζει» μέσα στη ράχη */
.nb-spiral::after{content:"";position:absolute;left:100%;top:0;bottom:0;width:16px;z-index:1;
  background:linear-gradient(90deg,rgba(28,20,4,.24),rgba(28,20,4,0));pointer-events:none}
/* οι μεταλλικοί κρίκοι */
.nb-spiral::before{content:"";position:absolute;top:0;bottom:0;left:0;right:-14px;z-index:2;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='54' height='32' viewBox='0 0 54 32'%3E%3Cdefs%3E%3ClinearGradient id='m' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23f6f9ff'/%3E%3Cstop offset='.32' stop-color='%23c8d4e8'/%3E%3Cstop offset='.6' stop-color='%238492a8'/%3E%3Cstop offset='.82' stop-color='%235a6779'/%3E%3Cstop offset='1' stop-color='%238a97ab'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cellipse cx='46' cy='16' rx='3' ry='4.6' fill='%23000' opacity='.18'/%3E%3Cg transform='rotate(-24 29 16)'%3E%3Cellipse cx='29' cy='18.2' rx='17' ry='8.8' fill='none' stroke='%23070c14' stroke-opacity='.5' stroke-width='4.6'/%3E%3Cellipse cx='29' cy='16' rx='17' ry='8.8' fill='none' stroke='url(%23m)' stroke-width='3.5'/%3E%3Cpath d='M12 16a17 8.8 0 0 1 17-8.8' fill='none' stroke='%23fff' stroke-opacity='.8' stroke-width='1.15' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E");
  background-size:54px 32px;background-repeat:repeat-y;background-position:0 14px;pointer-events:none}

.nb-page{display:flex;flex-direction:column;min-width:0;background:var(--pg,#fdf6d8)}
.nb-page.empty-page{background:#fff}
/* padding-left = overhang κρίκων (12px) + αέρας· δες «Η ΡΑΧΗ» παραπάνω */
.nb-ptop{display:flex;align-items:center;gap:9px;padding:10px 14px 10px 22px;border-bottom:1px solid var(--ed,#e3d38f);
  background:rgba(255,255,255,.35)}
.nb-date{border:1px solid var(--ed,#e3d38f);background:rgba(255,255,255,.6);border-radius:8px;
  padding:5px 9px;font-size:12px;font-family:inherit;color:var(--tx,#463a12);outline:none}
.nb-saved{font-size:11px;font-weight:700;color:#1e9e5a;opacity:0;transition:opacity .3s}
.nb-colors{margin-left:auto;display:flex;gap:5px}
.nb-cdot{width:19px;height:19px;border-radius:6px;border:1.5px solid rgba(0,0,0,.14);cursor:pointer;padding:0}
.nb-cdot.on{box-shadow:0 0 0 2.5px rgba(21,36,59,.35)}
.nb-back{display:none;border:1px solid var(--ed,#e3d38f);background:rgba(255,255,255,.6);border-radius:8px;
  width:30px;height:28px;place-items:center;cursor:pointer;color:var(--tx,#463a12);font-size:16px;line-height:1;font-family:inherit}
.nb-del{border:1px solid var(--ed,#e3d38f);background:rgba(255,255,255,.6);border-radius:8px;width:28px;height:28px;
  display:grid;place-items:center;cursor:pointer;color:var(--tx,#463a12)}
.nb-del:hover{background:#fdeaea;border-color:#e8a3a0;color:var(--red)}

/* Το «χαρτί»: κόκκινο περιθώριο + οριζόντιες γραμμές κάθε 32px */
.nb-sheet{flex:1;min-height:420px;padding:14px 26px 26px 0;
  background-image:linear-gradient(90deg,transparent 44px,rgba(198,40,40,.62) 44px,rgba(198,40,40,.62) 46px,transparent 46px),
    repeating-linear-gradient(var(--pg,#fdf6d8) 0 31px,var(--ln,#e8dca8) 31px 32px);
  background-position:0 14px}
.nb-title,.nb-text{width:100%;border:none;outline:none;background:transparent;font-family:inherit;
  color:var(--tx,#463a12);padding:0 0 0 60px;display:block}
.nb-title{font-size:19px;font-weight:800;line-height:32px;height:32px}
.nb-title::placeholder,.nb-text::placeholder{color:rgba(21,36,59,.32);font-weight:400}
.nb-text{font-size:14.5px;line-height:32px;min-height:352px;resize:none;overflow:hidden}
.nb-text:focus,.nb-title:focus{outline:none}

/* ---------- Προβολή «Τοίχος» (post-it) ---------- */
/* GRID, ΟΧΙ `column-count`: το multicol γεμίζει ΣΤΗΛΗ-ΣΤΗΛΗ (πάνω→κάτω, μετά
   επόμενη στήλη), άρα η 2η πιο πρόσφατη έπεφτε ΚΑΤΩ από την 1η. Το grid γεμίζει
   ΓΡΑΜΜΗ-ΓΡΑΜΜΗ → διαβάζεις όπως γράφεις: πάνω αριστερά η πιο πρόσφατη, δεξιά οι
   παλιότερες, μετά επόμενη γραμμή. ΜΗΝ το γυρίσεις πίσω σε multicol.
   `min(224px,100%)` και όχι σκέτο 224px: αλλιώς σε στενό δοχείο η στήλη δεν
   συρρικνώνεται και το πλέγμα ξεχειλίζει (02-pitfalls, «grid blowout»). */
.nb-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(224px,100%),1fr));
  gap:16px;align-items:start}
.nb-wall>.lz-host{display:contents}
.nb-wall .lz-sent{grid-column:1/-1;height:1px}
/* Ίδιο ύψος σε όλα: το πλέγμα μένει καθαρό και η σειρά ανάγνωσης αδιατάρακτη.
   Το πλήρες κείμενο είναι ένα κλικ μακριά (nbZoom), οπότε εδώ αρκεί προεπισκόπηση. */
.nb-pit{height:178px;display:flex;flex-direction:column;overflow:hidden;
  padding:12px 16px 13px;border-radius:3px 3px 12px 3px;
  background:var(--pg,#fdf6d8);color:var(--tx,#463a12);cursor:pointer;
  box-shadow:0 5px 16px rgba(21,36,59,.16);transition:transform .16s ease,box-shadow .16s ease}
.nb-pit:hover{transform:translateY(-3px) rotate(0deg)!important;box-shadow:0 10px 26px rgba(21,36,59,.22)}
.nb-pit.r0{transform:rotate(-.7deg)}.nb-pit.r1{transform:rotate(.5deg)}
.nb-pit.r2{transform:rotate(-.35deg)}.nb-pit.r3{transform:rotate(.8deg)}
.nb-pit b{display:block;font-size:14px;line-height:1.3;margin-bottom:6px;flex:none;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nb-pit p{margin:0;font-size:13px;line-height:1.5;white-space:pre-wrap;opacity:.85;flex:1;min-height:0;
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
/* `margin-top:auto` → η ημερομηνία κάθεται ΠΑΝΤΑ στη βάση, ίδια γραμμή σε όλα τα χαρτάκια */
.nb-pdt{display:block;margin-top:auto;padding-top:9px;font-size:10.5px;font-weight:700;opacity:.6;flex:none}
.nb-pin{display:block;width:13px;height:13px;border-radius:50%;background:#d64541;
  margin:-9px 3px 7px auto;box-shadow:0 2px 4px rgba(0,0,0,.25),inset 0 -2px 3px rgba(0,0,0,.2)}

/* ---------- Post-it σε ΜΕΓΕΘΥΝΣΗ (κλικ στον τοίχο· module 48 `nbZoom`) ----------
   Είναι κανονικό popup (.overlay > .modal) → το εφέ ανοίγματος/κλεισίματος το
   δίνει το 37/38-transitions. ΜΗΝ βάλεις εδώ δικό σου `animation`: θα ξανάπαιζε
   μόλις φεύγει το `.tr-enter` (02-pitfalls, «δεύτερη ανανέωση» §3).
   Χωρίς γραμμές χαρτιού επίτηδες — post-it, όχι σελίδα σημειωματαρίου. */
.nbz-ov{background:rgba(10,17,31,.6)}
.nb-zoom{background:var(--pg,#fdf6d8);color:var(--tx,#463a12);
  width:min(560px,92vw);max-width:560px;max-height:min(78vh,660px);
  border-radius:4px 18px 18px 4px;
  /* ΒΑΘΙΑ σκιά τεσσάρων στρώσεων: σε λειτουργία παραθύρων (body.mdi, ≥901px) το
     overlay ΔΕΝ έχει σκούρο πέπλο επίτηδες (40-window.css — τα κλικ περνούν στη
     σελίδα), οπότε ΜΟΝΟ η σκιά ξεχωρίζει το χαρτί από το φόντο. Μη τη μειώσεις. */
  box-shadow:0 44px 92px -20px rgba(6,12,24,.55),0 18px 40px -8px rgba(6,12,24,.34),
             0 6px 14px rgba(6,12,24,.18),0 0 0 1px rgba(12,20,36,.10),
             inset 0 1px 0 rgba(255,255,255,.55)}
/* Το dock περνά πάνω από τα popup (40-window.css) — δικό του όριο σε desktop,
   αλλιώς το κάτω μέρος του χαρτιού κάθεται από κάτω του (02-pitfalls). */
@media(min-width:901px){ .nb-zoom{max-height:min(78vh,calc(100vh - 200px))} }
.nbz-top{display:flex;align-items:center;gap:9px;flex:none;padding:12px 14px 11px 16px;
  border-bottom:1px solid var(--ed,#e3d38f);background:rgba(255,255,255,.34)}
.nb-zoom .nb-colors{margin-left:auto}
.nbz-pin{width:15px;height:15px;border-radius:50%;background:#d64541;flex:none;
  box-shadow:0 3px 6px rgba(0,0,0,.3),inset 0 -3px 4px rgba(0,0,0,.22),inset 0 2px 3px rgba(255,255,255,.45)}
.nbz-x{border:1px solid var(--ed,#e3d38f);background:rgba(255,255,255,.6);border-radius:8px;
  width:28px;height:28px;display:grid;place-items:center;cursor:pointer;color:var(--tx,#463a12);flex:none}
.nbz-x:hover{background:rgba(255,255,255,.95)}
.nbz-sheet{flex:1;min-height:0;display:flex;flex-direction:column;gap:6px;padding:16px 20px 6px}
.nbz-title,.nbz-text{width:100%;border:none;outline:none;background:transparent;
  font-family:inherit;color:inherit}
.nbz-title{flex:none;font-size:20px;font-weight:800;line-height:1.3}
.nbz-title::placeholder,.nbz-text::placeholder{color:currentColor;opacity:.38;font-weight:400}
/* Ο ΚΥΛΙΝΔΡΟΣ είναι το ίδιο το textarea: πολύ κείμενο → κύλιση μέσα στο χαρτί,
   το κουτί δεν μεγαλώνει άλλο (min-height:0 στον γονέα, αλλιώς το flex δεν κόβει). */
.nbz-text{flex:1;min-height:clamp(160px,32vh,360px);resize:none;font-size:15px;line-height:1.65;overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:var(--ed,#e3d38f) transparent}
.nbz-text::-webkit-scrollbar{width:9px}
.nbz-text::-webkit-scrollbar-thumb{background:var(--ed,#e3d38f);border-radius:9px}
.nbz-text::-webkit-scrollbar-track{background:transparent}
.nbz-foot{flex:none;display:flex;padding:0 18px 14px}
.nb-zoom .btn-ghost{background:rgba(255,255,255,.55);border-color:var(--ed,#e3d38f);color:var(--tx,#463a12)}
.nb-zoom .btn-ghost:hover{background:rgba(255,255,255,.92)}

/* ---------- Προεπισκόπηση στο popup επιβεβαίωσης διαγραφής ---------- */
.nb-cfm{background:var(--pg,#fdf6d8);border:1px solid var(--ed,#e3d38f);
  border-left:4px solid var(--ed,#e3d38f);border-radius:3px 10px 10px 3px;
  padding:12px 14px;color:var(--tx,#4a4020)}
.nb-cfm b{display:block;font-size:14px;line-height:1.35;margin-bottom:5px}
.nb-cfm p{margin:0 0 8px;font-size:12.5px;line-height:1.55;opacity:.85;
  word-break:break-word;overflow-wrap:anywhere}
.nb-cfm-dt{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;opacity:.7}
/* =====================================================================
   ΑΝΑΦΟΡΕΣ ΠΡΟΒΛΗΜΑΤΩΝ — χρώμα module: fuchsia #701a75 → #c026d3
   ΠΡΙΝ το 36-mobile.css στο manifest, ώστε τα @media του mobile να
   μπορούν να υπερισχύουν χωρίς !important.

   ΑΡΧΗ ΣΧΕΔΙΑΣΗΣ: η κατάσταση είναι ΤΟ ΕΝΑ πράγμα που πρέπει να φαίνεται
   αμέσως. Κάθε κατάσταση ορίζει τρεις μεταβλητές (--st γραμμή/κουκκίδα,
   --st-bg φόντο, --st-tx κείμενο) μέσω μιας κλάσης `s-*` στο δοχείο, και
   όλα τα επιμέρους (λωρίδα, chip, κεφαλίδα κάρτας) τις κληρονομούν.
   Έτσι μια αναφορά έχει ΠΑΝΤΑ το ίδιο χρώμα σε λίστα, κάρτα και πίνακα.
===================================================================== */
:root{ --bug1:#701a75; --bug2:#c026d3; --bug-soft:#fdf4ff; --bug-line:#f0abfc;
       --bug-ink:#86198f; --th-bg:#f0f3f9; }

/* ---------- Παλέτα καταστάσεων ---------- */
.s-new  {--st:#64748b;--st-bg:#eef2f7;--st-tx:#41506b}
.s-look {--st:#2563eb;--st-bg:#e5eefd;--st-tx:#1d4ed8}
.s-info {--st:#d97706;--st-bg:#fdf0d2;--st-tx:#8a4b06}
.s-fix  {--st:#7c3aed;--st-bg:#ece7fe;--st-tx:#6425d0}
.s-done {--st:#15803d;--st-bg:#d8f3e2;--st-tx:#15653a}
.s-no   {--st:#64748b;--st-bg:#e8ecf2;--st-tx:#41506b}

/* Ετικέτα κατάστασης. Το «Διορθώθηκε» είναι ΓΕΜΑΤΟ — δεν συγχέεται με τίποτε. */
.bg-sp{font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;display:inline-flex;
  align-items:center;gap:6px;white-space:nowrap;line-height:1.55;border:1px solid transparent}
.bg-sp:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.bg-sp.new {background:#eef2f7;color:#41506b;border-color:#dde4ee}
.bg-sp.look{background:#e5eefd;color:#1d4ed8;border-color:#c7dbfb}
.bg-sp.info{background:#fdf0d2;color:#8a4b06;border-color:#f5d99a}
.bg-sp.fix {background:#ece7fe;color:#6425d0;border-color:#d6cbfb}
.bg-sp.done{background:#15803d;color:#fff;border-color:#15803d;box-shadow:0 1px 4px rgba(21,128,61,.35)}
.bg-sp.done:before{background:#fff}
.bg-sp.no  {background:#e8ecf2;color:#41506b;border-color:#dde4ee}

.bg-imp{width:9px;height:9px;border-radius:50%;flex:none;display:inline-block}
.bg-imp.i3{background:#d64541;box-shadow:0 0 0 3px rgba(214,69,65,.18)}
.bg-imp.i2{background:#e09c1a;box-shadow:0 0 0 3px rgba(224,156,26,.18)}
.bg-imp.i1{background:#1e9e5a;box-shadow:0 0 0 3px rgba(30,158,90,.18)}

.bg-tag{font-size:10.5px;font-weight:700;padding:2.5px 8px;border-radius:6px;white-space:nowrap;
  background:#eef2f7;color:#41506b;display:inline-block;border:1px solid #e1e7f0}
.bg-tag.idea{background:#fdf0d2;color:#8a4b06;border-color:#f5d99a}
.bg-tag.q{background:#e5eefd;color:#1d4ed8;border-color:#c7dbfb}
.bg-code{font-size:10.5px;font-weight:800;letter-spacing:.05em;color:#6b7a90;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}

/* ---------- Φίλτρα ---------- */
.bg-fbar{display:flex;gap:7px;align-items:center;margin:14px 0 12px;flex-wrap:wrap}
.bg-chip{height:31px;padding:0 12px;border-radius:999px;background:#fff;border:1px solid var(--border);
  font-size:12.5px;font-weight:600;color:#41506b;display:inline-flex;align-items:center;gap:7px;
  transition:border-color .12s,background .12s}
.bg-chip .c{font-size:11px;font-weight:800;color:#5b6a80;background:#eef2f7;border-radius:999px;padding:1px 7px}
.bg-chip .sd{width:8px;height:8px;border-radius:50%;flex:none}
.bg-chip:hover{border-color:#b9c6d8;background:#fbfcfe}
/* Ενεργό φίλτρο = το χρώμα ΤΗΣ ΚΑΤΑΣΤΑΣΗΣ, όχι ένα γενικό navy: βλέπεις τι κοιτάς. */
.bg-chip.on{color:var(--st-tx);background:var(--st-bg);border-color:var(--st);
  box-shadow:0 0 0 1px var(--st) inset,0 2px 8px -3px var(--st)}
.bg-chip.on .c{background:rgba(255,255,255,.72);color:var(--st-tx)}
.bg-chip.st-new.on {--st:#64748b;--st-bg:#eef2f7;--st-tx:#33415c}
.bg-chip.st-look.on{--st:#2563eb;--st-bg:#e5eefd;--st-tx:#1d4ed8}
.bg-chip.st-info.on{--st:#d97706;--st-bg:#fdf0d2;--st-tx:#8a4b06}
.bg-chip.st-fix.on {--st:#7c3aed;--st-bg:#ece7fe;--st-tx:#6425d0}
.bg-chip.st-done.on{--st:#15803d;--st-bg:#d8f3e2;--st-tx:#15653a}
.bg-chip.st-no.on  {--st:#64748b;--st-bg:#e8ecf2;--st-tx:#33415c}
.bg-chip.all.on{background:var(--navy);color:#fff;border-color:var(--navy);box-shadow:0 2px 8px -3px rgba(21,36,59,.6)}
.bg-chip.all.on .c{background:rgba(255,255,255,.22);color:#fff}
.bg-fbar .gap{flex:1;min-width:8px}
.bg-seg{display:flex;background:#fff;border:1px solid var(--border);border-radius:9px;padding:2px}
.bg-seg button{padding:5px 12px;border-radius:7px;font-size:12.5px;font-weight:600;color:#5b6a80;
  border:none;background:none}
.bg-seg button.on{background:var(--navy);color:#fff}
.bg-srch{display:flex;align-items:center;gap:7px;height:31px;padding:0 12px;border-radius:999px;
  background:#fff;border:1px solid var(--border);color:#6b7a90}
.bg-srch input{border:none;outline:none;background:none;width:180px;font-size:12.5px;color:var(--text)}

/* ---------- Inbox (λίστα + νήμα) ---------- */
.bg-split{display:grid;grid-template-columns:346px minmax(0,1fr);gap:14px;align-items:start}
.bg-list{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;box-shadow:0 1px 2px rgba(21,36,59,.06),0 10px 26px -18px rgba(21,36,59,.35)}
.bg-lh{padding:10px 14px;border-bottom:1px solid var(--border);font-size:11px;font-weight:800;
  text-transform:uppercase;letter-spacing:.07em;color:#5b6a80;display:flex;align-items:center;gap:8px;
  background:#fafbfd}
.bg-ti{padding:12px 13px;border-bottom:1px solid #eef2f7;display:flex;gap:10px;width:100%;
  text-align:left;border-left:4px solid var(--st,transparent);background:none;position:relative}
.bg-ti:hover{background:#f8fafc}
.bg-ti.on{background:var(--bug-soft);box-shadow:inset 0 0 0 1px var(--bug-line)}
.bg-ti.s-done{border-left-color:#15803d}
.bg-ti .bd{flex:1;min-width:0;display:block}
.bg-ti .r1{display:flex;align-items:center;gap:7px;margin-bottom:4px}
.bg-ti .tt{display:block;font-size:13px;font-weight:600;color:var(--text);line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bg-ti.unread .tt{font-weight:800}
.bg-ti.unread{background:#fffdf7}
.bg-ti .r3{display:flex;align-items:center;gap:7px;margin-top:7px;font-size:11px;color:#5b6a80}
.bg-ti .tm{margin-left:auto;font-size:10.5px;color:#8593a8;white-space:nowrap}
.bg-udot{width:7px;height:7px;border-radius:50%;background:var(--red);flex:none;
  box-shadow:0 0 0 3px rgba(214,69,65,.16)}
.bg-mc{margin-left:auto;display:inline-flex;align-items:center;gap:3px;color:#5b6a80}

/* ---------- Λεπτομέρεια ---------- */
.bg-det{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:0 1px 2px rgba(21,36,59,.06),0 14px 34px -22px rgba(21,36,59,.5);
  display:flex;flex-direction:column;min-height:520px;overflow:hidden}
/* Η κεφαλίδα παίρνει ΑΠΑΛΟ τόνο της κατάστασης + έγχρωμη γραμμή στην κορυφή:
   καταλαβαίνεις σε τι στάδιο είσαι πριν καν διαβάσεις την ετικέτα. */
.bg-dh{padding:14px 16px;border-bottom:1px solid var(--border);border-top:3px solid var(--st,var(--border));
  background:linear-gradient(180deg,var(--st-bg,#fff) -40%,#fff 78%)}
.bg-dh .r1{display:flex;align-items:center;gap:9px;margin-bottom:8px;flex-wrap:wrap}
.bg-dh h3{font-size:16px;line-height:1.35;margin:0;color:var(--text)}
.bg-dh .r2{display:flex;align-items:center;gap:8px;font-size:12px;color:#5b6a80;
  margin-top:8px;flex-wrap:wrap}
.bg-stwrap{margin-left:auto;position:relative}
.bg-stbtn{height:32px;padding:0 12px;border-radius:9px;font-size:12.5px;font-weight:700;
  display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(0,0,0,.08);cursor:pointer}
.bg-stmenu{position:absolute;right:0;top:36px;background:#fff;border:1px solid var(--border);
  border-radius:11px;box-shadow:0 18px 44px -14px rgba(21,36,59,.45);padding:5px;z-index:40;min-width:214px}
.bg-stmenu button{display:flex;align-items:center;gap:8px;width:100%;padding:7px 9px;border-radius:8px;
  border:none;background:none;font-size:12.5px;text-align:left;color:var(--text)}
.bg-stmenu button:hover{background:#f1f5f9}
.bg-acts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.bg-gbtn{height:31px;padding:0 12px;border-radius:9px;border:1px solid var(--border);background:#fff;
  font-size:12px;font-weight:700;color:#33415c;display:inline-flex;align-items:center;gap:7px}
.bg-gbtn:hover{background:#f4f7fb;border-color:#b9c6d8}
.bg-gbtn .n{font-size:10.5px;font-weight:800;background:#eef2f7;color:#41506b;border-radius:999px;padding:1px 6px}
.bg-gbtn.on{background:var(--navy);border-color:var(--navy);color:#fff}
.bg-gbtn.on .n{background:rgba(255,255,255,.2);color:#fff}

/* ---------- Τεχνικά στοιχεία ---------- */
.bg-tech{margin:12px 16px 0;border:1px solid var(--border);border-radius:11px;overflow:hidden;background:#fafbfd}
.bg-tech summary{padding:9px 12px;font-size:12px;font-weight:700;color:#33415c;cursor:pointer;
  display:flex;align-items:center;gap:8px;list-style:none}
.bg-tech summary::-webkit-details-marker{display:none}
.bg-tech summary .er{margin-left:auto;font-size:11px;font-weight:800;color:#fff;background:#c0322e;
  padding:2px 9px;border-radius:999px}
.bg-techb{padding:0 12px 12px;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px}
.bg-kv{background:#fff;border:1px solid var(--border);border-radius:9px;padding:7px 10px;min-width:0}
.bg-kv .k{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#7a879c;font-weight:800}
.bg-kv .v{font-size:12px;color:var(--text);margin-top:2px;word-break:break-word;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.bg-crumbs{grid-column:1/-1;background:#fff;border:1px solid var(--border);border-radius:9px;padding:8px 10px}
.bg-crumb{font-size:11px;font-family:ui-monospace,Menlo,monospace;color:#41506b;background:#eef2f7;
  border-radius:6px;padding:2px 7px;display:inline-block;margin:2px 3px 0 0}
.bg-crumb.err{background:#fde3e2;color:#a3231f;font-weight:700}

/* ---------- Συζήτηση: ΞΕΧΩΡΙΣΤΗ ζώνη, όχι συνέχεια της καρτέλας ----------
   Δικό της φόντο, δική της κεφαλίδα και εσωτερική σκιά στην κορυφή. */
.bg-thwrap{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--th-bg);
  border-top:1px solid var(--border)}
.bg-thh{display:flex;align-items:center;gap:8px;padding:9px 16px;font-size:11px;font-weight:800;
  text-transform:uppercase;letter-spacing:.07em;color:#41506b;background:#e4e9f2;
  border-bottom:1px solid #d3dbe8}
.bg-thh .n{margin-left:auto;background:#fff;border:1px solid var(--border);border-radius:999px;
  padding:1px 8px;font-size:11px;letter-spacing:0;color:#41506b}
.bg-thread{flex:1;padding:15px 16px;display:flex;flex-direction:column;gap:12px;overflow:auto;
  max-height:430px;box-shadow:inset 0 7px 9px -9px rgba(21,36,59,.35)}
.bg-msg{display:flex;gap:9px;max-width:86%}
.bg-msg .bub{background:#fff;border:1px solid #e1e7f0;border-radius:13px 13px 13px 4px;padding:9px 12px;
  font-size:13px;color:var(--text);line-height:1.55;white-space:pre-wrap;word-break:break-word;
  box-shadow:0 1px 2px rgba(21,36,59,.06)}
.bg-msg .who{font-size:10.5px;color:#6b7a90;margin-bottom:4px;font-weight:700}
.bg-msg.me{margin-left:auto;flex-direction:row-reverse}
.bg-msg.me .bub{background:#f7e6fb;border-color:#eec2f6;border-radius:13px 13px 4px 13px;color:#5b1466}
.bg-msg.me .who{text-align:right}
.bg-msg.int .bub{background:#fff8e6;border:1px dashed #e0a90c;color:#6b3d05}
.bg-msg.int .who{color:#8a4b06}
.bg-sys{align-self:center;font-size:11px;color:#41506b;background:#fff;border:1px solid var(--border);
  border-radius:999px;padding:4px 13px;display:inline-flex;align-items:center;gap:6px;text-align:center;
  box-shadow:0 1px 2px rgba(21,36,59,.05)}
.bg-sys b{color:var(--text);font-weight:800}

/* ---------- Εικόνες ---------- */
.bg-shots{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.bg-shot{width:132px;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:#fff;
  padding:0;display:block;text-align:left}
.bg-shot img{width:100%;height:84px;object-fit:cover;display:block;background:#eef2f7}
.bg-shot .n{font-size:10.5px;color:#5b6a80;padding:5px 7px;display:block;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.bg-shot:hover{border-color:var(--bug-line)}
.bg-drop{border:2px dashed var(--bug-line);border-radius:11px;padding:14px;text-align:center;
  background:var(--bug-soft);color:var(--bug-ink);cursor:pointer;display:block;width:100%}
.bg-drop .t{display:block;font-size:12.5px;font-weight:700;margin-top:4px}
.bg-drop .s{display:block;font-size:11px;color:#9d2ba9;margin-top:3px}
.bg-thumbs{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}
.bg-th{position:relative;width:104px;border:1px solid var(--border);border-radius:9px;overflow:hidden;background:#fff}
.bg-th img{width:100%;height:66px;object-fit:cover;display:block}
.bg-th .sz{font-size:10px;color:#5b6a80;padding:3px 6px;display:block}
.bg-th .rm{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:50%;border:none;
  background:rgba(15,23,42,.72);color:#fff;display:grid;place-items:center;line-height:1}

/* ---------- Σύνθεση απάντησης ---------- */
.bg-comp{border-top:1px solid #dfe5ee;padding:12px 16px;background:#fff}
.bg-qr{display:flex;gap:6px;margin-bottom:9px;flex-wrap:wrap}
.bg-qr button{font-size:11.5px;padding:5px 11px;border-radius:999px;background:#f4f7fb;
  border:1px solid var(--border);color:#33415c;font-weight:600}
.bg-qr button:hover{background:#e9eef6;border-color:#b9c6d8}
.bg-cbox{border:1px solid #d5dde9;border-radius:11px;padding:10px 12px;background:#fff;
  transition:border-color .12s,box-shadow .12s}
.bg-cbox:focus-within{border-color:var(--bug2);box-shadow:0 0 0 3px rgba(192,38,211,.13)}
.bg-cbox textarea{width:100%;border:none;outline:none;resize:vertical;min-height:54px;font-size:13px;
  color:var(--text);background:none;line-height:1.55}
.bg-crow{display:flex;align-items:center;gap:9px;margin-top:8px;flex-wrap:wrap}
.bg-tgl{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:#5b6a80;font-weight:600;
  border:none;background:none;padding:0}
.bg-tgl .sw{width:32px;height:18px;border-radius:999px;background:#d9e0ea;position:relative;flex:none;
  transition:background .15s}
.bg-tgl .sw:after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .15s}
.bg-tgl.on .sw{background:var(--amber)}
.bg-tgl.on .sw:after{transform:translateX(14px)}
.bg-tgl.on{color:#8a4b06}
.bg-send{margin-left:auto;height:33px;padding:0 17px;border-radius:9px;color:#fff;font-weight:700;
  font-size:12.5px;border:none;background:linear-gradient(135deg,var(--bug1),var(--bug2));
  display:inline-flex;align-items:center;gap:7px;box-shadow:0 3px 12px -4px rgba(112,26,117,.8)}
.bg-send:hover{filter:brightness(1.07)}

/* ---------- Πίνακας (kanban) ---------- */
.bg-kb{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;margin-top:4px}
.bg-kcol{background:#f2f5f9;border:1px solid var(--border);border-radius:12px;padding:9px;min-height:220px}
.bg-kh{display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:800;text-transform:uppercase;
  letter-spacing:.04em;padding:2px 3px 9px}
.bg-kh .d{width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.bg-kh .n{margin-left:auto;background:#fff;border:1px solid var(--border);border-radius:999px;
  padding:0 7px;font-size:11px;color:#41506b}
.bg-kc{background:#fff;border:1px solid var(--border);border-top:3px solid;border-radius:10px;
  padding:9px 10px;margin-bottom:8px;width:100%;text-align:left;display:block;
  box-shadow:0 1px 2px rgba(21,36,59,.07)}
.bg-kc:hover{box-shadow:0 4px 14px -6px rgba(21,36,59,.4)}
.bg-kc .t{display:block;font-size:12.5px;font-weight:600;line-height:1.35;margin:4px 0 7px;color:var(--text)}
.bg-kc .f{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:10.5px;color:#5b6a80}

/* ---------- Πλευρά χρήστη ---------- */
.bg-mine{display:flex;flex-direction:column;gap:12px}
.bg-card{background:var(--card);border:1px solid var(--border);border-left:4px solid var(--st,var(--border));
  border-radius:var(--radius);padding:14px 16px;
  box-shadow:0 1px 2px rgba(21,36,59,.06),0 10px 26px -20px rgba(21,36,59,.45)}
.bg-card.open{box-shadow:0 1px 2px rgba(21,36,59,.08),0 18px 40px -22px rgba(21,36,59,.6)}
/* Ολοκληρωμένη: πράσινη λωρίδα + απαλό πράσινο πλαίσιο. Δεν χρειάζεται να διαβάσεις τίποτα. */
.bg-card.s-done{border-color:#b7e3c8;border-left-color:#15803d;background:linear-gradient(180deg,#f4fcf7,#fff 70px)}
.bg-card .r1{display:flex;align-items:center;gap:9px;margin-bottom:6px;flex-wrap:wrap}
.bg-card h4{font-size:14.5px;margin:0;line-height:1.35;color:var(--text)}
.bg-card .meta{font-size:11.5px;color:#5b6a80;margin-top:4px}
.bg-cfoot{margin-top:12px;padding-top:11px;border-top:1px dashed #dfe5ee;display:flex;gap:8px;flex-wrap:wrap}

/* Stepper: παχύτερες μπάρες, μεγαλύτερες κουκκίδες, ξεκάθαρο «τρέχον» */
.bg-step{display:flex;align-items:flex-start;margin:14px 0 2px;max-width:490px}
.bg-step .n{display:flex;flex-direction:column;align-items:center;gap:6px;width:78px;flex:none}
.bg-step .d{width:17px;height:17px;border-radius:50%;background:#dbe2ec;display:grid;place-items:center;color:#fff}
.bg-step .d.ok{background:#15803d}
.bg-step .d.cur{background:#7c3aed;box-shadow:0 0 0 4px rgba(124,58,237,.2)}
.bg-step .lb{font-size:10.5px;color:#7a879c;font-weight:600;text-align:center;line-height:1.2}
.bg-step .n.act .lb{color:var(--text);font-weight:700}
.bg-step .bar{flex:1;height:3px;border-radius:2px;background:#dbe2ec;margin:7px -8px 0}
.bg-step .bar.ok{background:#15803d}

.bg-ask{background:#fdf0d2;border:1px solid #f0cf80;border-radius:11px;padding:10px 12px;
  display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.bg-ask .tx{font-size:12.5px;color:#7a4205;font-weight:700}
.bg-ask .b{margin-left:auto;height:30px;padding:0 14px;border-radius:8px;background:#b45309;
  color:#fff;font-weight:700;font-size:12px;border:none}
.bg-note{display:flex;align-items:center;gap:9px;border-radius:10px;padding:9px 12px;
  font-size:12.5px;margin-top:12px;flex-wrap:wrap;font-weight:600}
.bg-note.blue{background:#e5eefd;border:1px solid #bcd3f8;color:#1d4ed8}
.bg-note.green{background:#d8f3e2;border:1px solid #a6ddbc;color:#15653a}
.bg-note .b{margin-left:auto;height:29px;padding:0 13px;border-radius:8px;background:var(--blue);
  color:#fff;font-weight:700;font-size:11.5px;border:none}

/* Η συζήτηση μέσα στην κάρτα του χρήστη: βυθισμένο πάνελ, ΟΧΙ συνέχεια της κάρτας */
.bg-conv{margin:12px -16px -14px;border-top:1px solid var(--border);border-radius:0 0 8px 8px;
  overflow:hidden;background:var(--th-bg)}
.bg-conv .bg-thread{max-height:340px}
.bg-conv .bg-thwrap{border-top:none}

/* ---------- Φόρμα ---------- */
.bg-opts{display:grid;gap:8px}
.bg-opt{border:1px solid #d5dde9;border-radius:10px;padding:10px 12px;display:flex;align-items:center;
  gap:10px;font-size:13px;color:var(--text);text-align:left;width:100%;background:#fff}
.bg-opt:hover{border-color:#b9c6d8;background:#fbfcfe}
.bg-opt .rd{width:16px;height:16px;border-radius:50%;border:2px solid #b9c6d8;flex:none}
.bg-opt.on{border-color:var(--bug2);background:var(--bug-soft);box-shadow:0 0 0 1px var(--bug2) inset}
.bg-opt.on .rd{border-color:var(--bug2);background:var(--bug2);box-shadow:inset 0 0 0 3px #fff}
.bg-opt .d{display:block;font-size:11px;color:#5b6a80;margin-top:1px}
.bg-opt>span:last-child>span{display:block}
.bg-types{display:flex;gap:8px}
.bg-types .bg-opt{flex:1;justify-content:center;gap:6px}
.bg-auto{background:#f4f7fb;border:1px solid var(--border);border-radius:10px;padding:10px 12px;
  display:flex;align-items:center;gap:9px;font-size:11.5px;color:#41506b}
.bg-auto .ck{width:16px;height:16px;border-radius:5px;background:var(--green);color:#fff;
  display:grid;place-items:center;flex:none}
.bg-auto .lnk{margin-left:auto;color:var(--blue);font-weight:700;white-space:nowrap;border:none;
  background:none;font-size:11.5px}

/* ---------- Στατιστικά hero ---------- */
.bg-stats{display:flex;gap:9px;flex-wrap:wrap}
.bg-stat{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);border-radius:11px;
  padding:8px 14px;min-width:94px;color:#fff}
.bg-stat b{display:block;font-size:20px;line-height:1.15;font-weight:800}
.bg-stat span{font-size:10.5px;opacity:.9}
.bg-stat.alert{background:#fff;color:var(--bug1);border-color:#fff;box-shadow:0 4px 14px -6px rgba(0,0,0,.5)}
.bg-stat.alert span{opacity:.75}

@media(max-width:1200px){ .bg-split{grid-template-columns:1fr} .bg-kb{grid-template-columns:repeat(2,minmax(0,1fr))} }
/* =====================================================================
   ΕΠΕΞΕΡΓΑΣΙΑ & ΑΡΧΕΙΟΘΕΤΗΣΗ TASK (module 50) — πορτοκαλί οικογένεια task.
   ΠΡΙΝ το 36-mobile.css στο manifest, ώστε τα @media να υπερισχύουν.
===================================================================== */
.te-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.te-prio{display:flex;gap:6px}
.te-pr{flex:1;height:34px;border-radius:9px;border:1px solid #d5dde9;background:#fff;
  font-size:12.5px;font-weight:700;color:#41506b}
.te-pr:hover{border-color:#b9c6d8}
.te-pr.p-high.on{background:#fde3e2;border-color:#d64541;color:#a3231f}
.te-pr.p-med.on {background:#fdf0d2;border-color:#e09c1a;color:#8a4b06}
.te-pr.p-low.on {background:#d8f3e2;border-color:#1e9e5a;color:#15653a}

.te-sec{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;text-transform:uppercase;
  letter-spacing:.07em;color:#5b6a80;margin:18px 0 8px;padding-top:14px;border-top:1px solid var(--border)}
.te-sec .c{background:#eef2f7;border-radius:999px;padding:1px 8px;font-size:11px;letter-spacing:0;color:#41506b}
.te-sec.danger{color:#8f3a12}

.te-people{display:flex;flex-direction:column;gap:7px}
.te-p{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--border);
  border-radius:10px;background:#fff}
.te-p .nm{flex:1;min-width:0;font-size:13px;font-weight:600;color:var(--text);display:flex;flex-direction:column}
.te-p .nm .dp{font-size:10.5px;font-weight:500;color:#5b6a80}
.te-p.new{border-color:#a6ddbc;background:#f4fcf7}
.te-p.out{border-color:#f0b8b6;background:#fdf5f5}
.te-p.out .nm{text-decoration:line-through;color:#8a5754}
.te-pg{font-size:11.5px;font-weight:800;color:#5b6a80;background:#eef2f7;border-radius:999px;padding:2px 9px}
.te-pg.run{background:#fdf0d2;color:#8a4b06}
.te-pg.ok{background:#15803d;color:#fff}
.te-badge{font-size:10.5px;font-weight:800;border-radius:999px;padding:2px 9px}
.te-badge.new{background:#d8f3e2;color:#15653a}
.te-badge.out{background:#fde3e2;color:#a3231f}
.te-x{width:26px;height:26px;border-radius:8px;border:1px solid var(--border);background:#fff;
  display:grid;place-items:center;color:#5b6a80;flex:none}
.te-x:hover{background:#fde3e2;border-color:#f0b8b6;color:#a3231f}
.te-lock{width:26px;height:26px;display:grid;place-items:center;color:#8593a8;flex:none}

.te-addbtn{margin-top:9px;height:36px;width:100%;border-radius:10px;border:1.5px dashed #c3cddc;
  background:#fbfcfe;color:#41506b;font-size:12.5px;font-weight:700;display:flex;align-items:center;
  justify-content:center;gap:7px}
.te-addbtn:hover{border-color:var(--accent);color:var(--accent);background:#fff7f3}
.te-picker{margin-top:9px;border:1px solid var(--border);border-radius:11px;overflow:hidden;background:#fff}
.te-psearch{display:flex;align-items:center;gap:8px;padding:8px 11px;border-bottom:1px solid var(--border);
  background:#fafbfd;color:#6b7a90}
.te-psearch input{flex:1;border:none;outline:none;background:none;font-size:12.5px;color:var(--text)}
.te-plist{max-height:210px;overflow:auto}
.te-pick{display:flex;align-items:center;gap:9px;width:100%;padding:8px 11px;border:none;background:none;
  border-bottom:1px solid #eef2f7;text-align:left;color:#5b6a80}
.te-pick:last-child{border-bottom:none}
.te-pick:hover{background:#fff7f3}
.te-pick .nm{flex:1;min-width:0;font-size:12.5px;font-weight:600;color:var(--text);display:flex;flex-direction:column}
.te-pick .nm .dp{font-size:10.5px;font-weight:500;color:#5b6a80}
.te-hint{display:flex;align-items:flex-start;gap:7px;font-size:11px;color:#5b6a80;margin-top:9px;line-height:1.5}

.te-arch{display:flex;align-items:flex-start;gap:12px;border:1px solid #f0cbb4;background:#fff8f4;
  border-radius:11px;padding:11px 13px}
.te-arch .tx{flex:1;min-width:0;font-size:12px;color:#7a3d13;line-height:1.55}
.te-arch .tx b{display:block;font-size:13px;color:#6b2408;margin-bottom:2px}
.te-archbtn{flex:none;height:33px;padding:0 14px;border-radius:9px;border:1px solid #c86a3a;background:#fff;
  color:#8f3a12;font-size:12.5px;font-weight:700;display:inline-flex;align-items:center;gap:7px}
.te-archbtn:hover{background:#8f3a12;color:#fff;border-color:#8f3a12}
.te-ul{margin:0 0 4px 18px;font-size:12.5px;color:#41506b;line-height:1.75}

/* ---------- Το ΑΡΧΕΙΟΘΕΤΗΜΕΝΟ task μέσα στο popup ---------- */
.tk-archbar{display:flex;align-items:flex-start;gap:11px;background:#f4f6fa;border:1px solid #d5dde9;
  border-left:4px solid #64748b;border-radius:11px;padding:11px 13px;margin-bottom:13px;color:#41506b}
.tk-archbar b{display:block;font-size:13.5px;color:#33415c}
.tk-archbar span{font-size:12px;line-height:1.55}
.tk-lockrow{display:flex;align-items:center;gap:8px;justify-content:center;padding:12px;font-size:12px;
  color:#5b6a80;background:#f4f6fa;border-top:1px solid var(--border)}
.chip.arch{background:#e3e8f0;color:#33415c;border:1px solid #cfd8e6}
.tk-pp{font-size:11px;font-weight:800;color:#5b6a80;background:#eef2f7;border-radius:999px;padding:1px 7px}
.tk-pp.run{background:#fdf0d2;color:#8a4b06}
.tk-pp.ok{background:#15803d;color:#fff}

/* ---------- Κάρτα task: σήμανση διακοπής ---------- */
.tk-card.arch{background:#f7f9fc;border-color:#d5dde9;border-left-color:#94a3b8}
.tk-card.arch .tk-tt{color:#5b6a80}
.tk-stop{font-size:10.5px;font-weight:800;border-radius:999px;padding:2px 9px;background:#e3e8f0;
  color:#33415c;border:1px solid #cfd8e6;display:inline-flex;align-items:center;gap:5px}

/* ---------- Ανάδοχος βήματος (card modal) ---------- */
.cd-who{display:flex;gap:6px;flex-wrap:wrap}
.cd-p{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px;border-radius:999px;
  border:1px solid #d5dde9;background:#fff;font-size:12px;font-weight:600;color:#41506b}
.cd-p:hover{border-color:#b9c6d8;background:#fbfcfe}
.cd-p.on{border-color:var(--accent);background:#fff2ea;color:#8f3a12;box-shadow:0 0 0 1px var(--accent) inset}
.kb-card .kb-who{display:inline-flex;align-items:center}

@media(max-width:620px){ .te-row{grid-template-columns:1fr} }

/* ---------- Task χωρίς ανάδοχο (56-task-orphan) ---------- */
.tk-orphbar{display:flex;align-items:center;gap:11px;flex-wrap:wrap;background:#fff7ed;border:1px solid #fed7aa;
  border-radius:12px;padding:12px 14px;margin-bottom:12px;color:#9a3412}
.tk-orphbar>svg{flex:0 0 auto;color:#ea580c}
.tk-orphbar>div{flex:1 1 220px;min-width:0}
.tk-orphbar b{display:block;font-size:13.5px;color:#7c2d12}
.tk-orphbar span{font-size:12px;line-height:1.55}
.tk-orphbar span b{display:inline}
.tk-orph-go{background:linear-gradient(135deg,#c2410c,#f97316);border:none;white-space:nowrap}
.tk-orph{display:inline-flex;align-items:center;gap:5px;color:#c2410c;font-weight:700}
.tk-who.tk-orph{background:#fff7ed;border:1px solid #fed7aa;border-radius:999px;padding:2px 8px}

/* ---------- Οριστική διαγραφή αρχειοθετημένου (50-task-edit) ---------- */
.te-delbtn{background:#fff;color:var(--red);border:1px solid #f3c3c1}
.te-delbtn:hover{background:#fdeaea}
.tk-del{margin-left:auto;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;border:1px solid transparent;
  background:transparent;color:#94a3b8;cursor:pointer;transition:.15s}
.tk-del:hover{color:var(--red);background:#fdeaea;border-color:#f3c3c1}
/* =====================================================================
   TABS ΥΠΟΤΜΗΜΑΤΩΝ — segmented slider + χρωματισμός πλαϊνού μενού
   core/02f-dept-context.js · ΠΡΙΝ το 36-mobile.css (τα media queries δεν
   ανεβάζουν ειδικότητα — μετράει η σειρά στο manifest).
   ΚΑΜΙΑ `animation` εδώ, μόνο transitions: το #ctxTabs ξαναγράφεται σε κάθε
   renderAll και το aside δεν ξαναχτίζεται (δες «δεύτερη ανανέωση», 02-pitfalls).
===================================================================== */

/* --- δοχείο: παίρνει όλο τον χώρο μέχρι την αναζήτηση --- */
#ctxTabs{display:none}
#ctxTabs.on{display:flex;align-items:center;gap:4px;justify-content:flex-start;
  /* Το κουτί πιάνει ΟΣΟ χώρο καταλαμβάνουν πραγματικά τα tabs — μεγαλώνει και
     μικραίνει μαζί τους, δεν τεντώνεται μέχρι την αναζήτηση.
     ΠΡΟΣΟΧΗ ΣΤΗΝ ΠΑΓΙΔΑ: με flex-basis:auto το flex-wrap μετράει το ΜΗ
     συρρικνωμένο πλάτος (6 tabs ≈ 760px) και θα έσπαγε το topbar σε δεύτερη
     γραμμή. Το `max-width` περιορίζει ΚΑΙ το basis, άρα το σπάσιμο υπολογίζεται
     πάνω στο περιορισμένο μέγεθος. Μετρημένο σε 1600→940 + κινητό. */
  flex:0 1 auto;min-width:0;margin-right:auto}
/* ΤΟ ΟΡΙΟ ΠΛΑΤΟΥΣ ΤΟ ΒΑΖΕΙ ΤΟ ctxFit() (inline max-width), ΟΧΙ το CSS.
   Γιατί: το flex-wrap αποφασίζει ΠΡΙΝ το shrink, οπότε με basis:auto τα 6 tabs
   έσπαγαν το topbar σε δεύτερη γραμμή. Ένα ΣΤΑΘΕΡΟ max-width το απέτρεπε, αλλά
   έκοβε το κουτί πριν φτάσει την αναζήτηση (έβγαζε βελάκια ενώ υπήρχε ακόμη
   χώρος). Το ctxFit() μετράει τον πραγματικά διαθέσιμο χώρο, άρα το κουτί
   μεγαλώνει ΟΣΟ γίνεται και η αναδίπλωση είναι εξ ορισμού αδύνατη. */

/* --- το «αυλάκι» (liquid glass) --- */
.ctx-track{position:relative;display:flex;align-items:center;gap:2px;flex:0 1 auto;min-width:0;max-width:100%;
  padding:4px;border-radius:13px;overflow-x:auto;overflow-y:hidden;
  background:#fff;border:1px solid #ccd4de;
  box-shadow:0 1px 3px rgba(18,32,56,.10),0 4px 12px rgba(18,32,56,.05);
  scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;cursor:grab;touch-action:pan-x}
.ctx-track::-webkit-scrollbar{display:none}
.ctx-track.dragging{cursor:grabbing;scroll-behavior:auto}

/* --- η κάψουλα που γλιστράει --- */
.ctx-thumb{position:absolute;left:0;top:4px;bottom:4px;width:0;opacity:0;border-radius:10px;
  background:#15243b;pointer-events:none;z-index:0;
  box-shadow:0 3px 12px rgba(16,32,58,.32),0 1px 2px rgba(16,32,58,.24),
             inset 0 1px 0 rgba(255,255,255,.24);
  transition:transform .36s cubic-bezier(.32,1.28,.5,1),width .36s cubic-bezier(.32,1.28,.5,1),
             background .26s ease}

/* --- τα segments --- */
.ctx-seg{position:relative;z-index:1;flex:0 0 auto;display:inline-flex;align-items:center;
  height:32px;padding:0 15px;border:0;background:transparent;border-radius:10px;
  font-size:12.5px;font-weight:800;letter-spacing:.15px;color:#43536b;cursor:pointer;
  white-space:nowrap;max-width:210px;transition:color .2s ease}
.ctx-seg:hover{color:#15243b}
.ctx-seg.on,.ctx-seg.on:hover{color:#fff}    /* όλη η παλέτα είναι ≥4.5:1 με λευκό */
.ctx-l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

/* --- βελάκια: μόνο όταν δεν χωράνε όλα --- */
.ctx-arrow{display:none;flex:0 0 auto;width:26px;height:32px;padding:0;border:0;cursor:pointer;
  align-items:center;justify-content:center;border-radius:9px;color:#5b6b85;
  background:#fff;border:1px solid #ccd4de;transition:background .16s ease,color .16s ease,opacity .16s ease}
#ctxTabs.scrollable .ctx-arrow{display:inline-flex}
.ctx-arrow:hover:not(:disabled){background:#e1edff;border-color:#b9cfee;color:#15243b}
.ctx-arrow:disabled{opacity:.28;cursor:default}

/* --- το πλαϊνό μενού παίρνει βαθιά απόχρωση του ενεργού υποτμήματος --- */
/* Ειδικότητα (0,1,1) > το `aside` (0,0,1) του 04-layout· το aside ΔΕΝ
   ξαναχτίζεται (μόνο το #sidebar μέσα του) άρα το transition είναι ασφαλές. */
aside.sidebar-wrap{transition:background .3s ease}
body.ctx-on aside.sidebar-wrap{background:linear-gradient(180deg,var(--sb1,#15243b),var(--sb2,#182a47))}
/* ΑΝΤΙΘΕΣΗ: το ενεργό στοιχείο του μενού είναι πορτοκαλί gradient. Πάνω σε navy
   ξεχωρίζει· πάνω σε ΘΕΡΜΗ απόχρωση (αμπέρ/κόκκινο υποτμήματος) πλησιάζει
   επικίνδυνα. Ένα λεπτό λευκό δαχτυλίδι εγγυάται τον διαχωρισμό σε ΚΑΘΕ χρώμα
   της παλέτας, χωρίς να χαθεί η ταυτότητα του πορτοκαλί. */
body.ctx-on #sidebar .nav-item.active{
  box-shadow:0 0 0 2px rgba(255,255,255,.92),0 6px 16px rgba(0,0,0,.28)}

body.tr-off .ctx-thumb,body.tr-off aside.sidebar-wrap{transition:none}
@media(prefers-reduced-motion:reduce){
  .ctx-thumb,aside.sidebar-wrap{transition:none}
  .ctx-track{scroll-behavior:auto}
}

/* --- κινητό: δική της γραμμή, πλήρους πλάτους· η αφή κυλά, τα βελάκια περισσεύουν --- */
@media(max-width:900px){
  #topbar #ctxTabs.on{order:6;flex:0 1 100%;max-width:100%;margin-right:auto;margin-top:2px}
  #ctxTabs.scrollable .ctx-arrow{display:none}
  .ctx-seg{height:31px;padding:0 13px;font-size:12px;max-width:170px}
}

/* ===== Γενική Εποπτεία: μία κάρτα ανά τμήμα (ctxDeptCards, 07b) ===== */
.ctxd-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:12px}
/* minmax(min(100%,230px),1fr): το σκέτο 230px θα κλείδωνε το πλέγμα σε στενή
   οθόνη (ίδια οικογένεια με την παγίδα «1fr = minmax(auto,1fr)»).
   auto-FIT και όχι auto-fill: οι άδειες στήλες συμπτύσσονται, άρα οι κάρτες
   απλώνονται από άκρη σε άκρη· όσες δεν χωρούν πέφτουν από κάτω — ποτέ
   οριζόντια κύλιση. */
.dgrid .card.ctxd{min-width:0}
.dgrid .card.ctxd>.card-h{cursor:pointer;color:#fff;background-color:var(--dc,#15243b);
  background-image:linear-gradient(120deg,rgba(255,255,255,.18),rgba(0,0,0,.14))}
.dgrid .card.ctxd>.card-h svg{color:#fff}
.dgrid .card.ctxd>.card-h .cnt{background:rgba(255,255,255,.22);color:#fff}
.dgrid .card.ctxd>.card-h:hover{background-image:linear-gradient(120deg,rgba(255,255,255,.3),rgba(0,0,0,.1))}
.ctxd-go{margin-left:auto;font-size:10.5px;font-weight:700;color:rgba(255,255,255,.9);white-space:nowrap}
.ctxd .hbar{cursor:pointer}
/* Στενή κάρτα (έως 6 υποτμήματα σε μία σειρά): τίποτα δεν ξεχειλίζει. */
.dgrid .card.ctxd>.card-h{flex-wrap:wrap;row-gap:3px;padding:11px 13px}
.ctxd .hb-top{gap:8px}
.ctxd .hb-top b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctxd .hb-top span{flex:none}
@media(max-width:900px){ .ctxd-grid{grid-template-columns:1fr} }
/* ---------- God Mode → «Αναφορές» (module 59) — μωβ του God Mode ---------- */
.dr-wrap{max-width:980px}
.dr-top{display:flex;gap:12px;align-items:stretch;flex-wrap:wrap;margin-bottom:16px}
.dr-search{flex:1;min-width:260px;display:flex;align-items:center;gap:10px;background:#fff;border:1.5px solid #ddd3f5;
  border-radius:14px;padding:0 14px;box-shadow:0 2px 10px rgba(76,29,149,.06);color:#6d28d9}
.dr-search:focus-within{border-color:#8b5cf6;box-shadow:0 0 0 4px rgba(139,92,246,.14)}
.dr-search input{flex:1;min-width:0;border:none;outline:none;background:transparent;font-size:14px;padding:13px 0;color:var(--text)}
.dr-clear{border:none;background:#f1ecfd;color:#6d28d9;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;cursor:pointer}
.dr-stats{display:flex;gap:8px}
.dr-stat{background:linear-gradient(135deg,#f5f0ff,#fbf7ff);border:1px solid #e4dbfa;border-radius:14px;padding:8px 16px;min-width:92px;
  display:flex;flex-direction:column;justify-content:center}
.dr-stat b{font-size:19px;color:#4c1d95;line-height:1.1}
.dr-stat span{font-size:10.5px;color:#7c6aa6;text-transform:uppercase;letter-spacing:.4px}
.dr-month{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:#7c6aa6;margin:18px 4px 8px}
.dr-found{font-size:12px;color:#6d28d9;font-weight:700;margin:0 4px 4px}
.dr-card{display:flex;gap:14px;align-items:flex-start;width:100%;text-align:left;background:#fff;border:1px solid var(--border);
  border-radius:16px;padding:14px 16px;margin-bottom:10px;cursor:pointer;font-family:inherit;color:inherit;
  box-shadow:0 1px 3px rgba(20,30,50,.04);transition:border-color .15s,box-shadow .15s,transform .15s}
.dr-card:hover{border-color:#c4b5fd;box-shadow:0 8px 24px rgba(76,29,149,.12);transform:translateY(-1px)}
.dr-date{flex:none;width:58px;border-radius:12px;background:linear-gradient(160deg,#4c1d95,#7c3aed);color:#fff;
  display:flex;flex-direction:column;align-items:center;padding:7px 0 6px;box-shadow:0 4px 12px rgba(109,40,217,.28)}
.dr-date b{font-size:22px;line-height:1}
.dr-date i{font-style:normal;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;margin-top:2px}
.dr-date small{font-size:9.5px;opacity:.75;margin-top:1px}
.dr-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.dr-title{font-size:15px;font-weight:800;color:#1f1640;line-height:1.3}
.dr-snip{font-size:12.5px;color:#5b6479;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dr-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.dr-chips i{font-style:normal;font-size:10.5px;font-weight:700;color:#5b21b6;background:#f3edff;border:1px solid #e4dbfa;border-radius:999px;padding:2px 9px}
.dr-chips i.more{color:#7c6aa6;background:#f7f5fb}
.dr-hits{flex:none;min-width:26px;height:26px;padding:0 7px;border-radius:999px;background:#fde68a;color:#78350f;font-size:12px;font-weight:800;display:grid;place-items:center}
.dr-go{flex:none;color:#a78bfa;margin-top:4px}
.dr-card mark,.dr-read mark{background:#fde68a;color:inherit;border-radius:3px;padding:0 1px}
.dr-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:46px 20px;color:#7c6aa6;background:#fff;border:1px dashed #ddd3f5;border-radius:16px}
.dr-empty span{font-size:12.5px}
/* Ανάγνωση */
.dr-modal{width:760px;max-width:95vw}
.dr-read{max-height:min(68vh,720px);overflow:auto;padding:20px 26px 24px;font-size:14px;line-height:1.7;color:#27304a}
.dr-h{font-size:15.5px;font-weight:800;color:#4c1d95;margin:20px 0 6px;padding-bottom:5px;border-bottom:2px solid #efe8fd}
.dr-h:first-child{margin-top:0}
.dr-p{margin:6px 0}
.dr-ul{margin:4px 0 8px;padding-left:22px}
.dr-ul li{margin:4px 0}
.dr-ul li::marker{color:#8b5cf6}
.dr-gain{display:flex;gap:9px;align-items:flex-start;background:linear-gradient(135deg,#ecfdf5,#f0fdf9);border:1px solid #bbf7d0;
  border-radius:12px;padding:9px 12px;margin:8px 0 4px;color:#14532d;font-size:13.5px}
.dr-gain svg{flex:none;margin-top:4px;color:#16a34a}
@media(max-width:640px){
  .dr-top{flex-direction:column}
  .dr-search{min-width:0}
  .dr-stats .dr-stat{flex:1}
  .dr-card{padding:12px;gap:11px}
  .dr-date{width:50px}
  .dr-date b{font-size:19px}
  .dr-read{padding:16px}
  .dr-modal .modal-f{flex-wrap:wrap}
}
/* =====================================================================
   ΕΠΕΚΤΑΣΗ ΕΓΓΥΗΣΗΣ (module 60) — χρώμα module: petrol #123c49 → #1f7a8c
   ΠΡΙΝ το 36-mobile.css στο manifest.
   ΑΡΧΗ ΣΧΕΔΙΑΣΗΣ: λίστα αριστερά, στοιχεία δεξιά στην ΙΔΙΑ σελίδα (όπως οι
   Αναφορές Προβλημάτων). Στη γραμμή το μάτι βρίσκει πρώτα το SERIAL (έντονο)·
   όλα τα υπόλοιπα σε γκρι. Χρώμα μόνο εκεί που σημαίνει κάτι.
   ≤1100px: μία στήλη — με επιλογή φαίνεται μόνο η λεπτομέρεια (κουμπί «Λίστα»).
===================================================================== */
:root{ --wr1:#123c49; --wr2:#1f7a8c; --wr-soft:#e9f4f6; --wr-ink:#0f4c5c; --wr-line:#cfe3e8; }

.nav-item.ni-wr svg.i{color:#67c7dc}

.wr-page{max-width:1360px}
.wr-hero{background:linear-gradient(115deg,var(--wr1),var(--wr2) 130%)}
.wr-stats{display:flex;gap:8px;flex-wrap:wrap}
.wr-stat{min-width:92px;padding:8px 14px;border-radius:12px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);line-height:1.15}
.wr-stat b{display:block;font-size:20px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.wr-stat span{font-size:11px;color:rgba(255,255,255,.78)}
.wr-stat.warn b{color:#fde68a}

/* ---------- Διάταξη ---------- */
.wr-split{display:grid;grid-template-columns:minmax(330px,410px) minmax(0,1fr);gap:16px;align-items:start}
.wr-listcol{min-width:0}
.wr-detcol{min-width:0;position:sticky;top:12px}

/* ---------- Αναζήτηση & φίλτρα ---------- */
.wr-bar{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.wr-srch{display:flex;align-items:center;gap:10px;height:44px;padding:0 8px 0 14px;background:#fff;border:1.5px solid var(--border);border-radius:12px;color:var(--muted);transition:border-color .15s,box-shadow .15s;cursor:text}
.wr-srch:focus-within{border-color:var(--wr2);box-shadow:0 0 0 4px rgba(31,122,140,.14)}
.wr-srch input{flex:1;min-width:0;border:0;outline:none;background:transparent;font:inherit;font-size:14px;color:var(--text);height:100%}
.wr-srch input::-webkit-search-cancel-button{display:none}
.wr-clr{display:none;width:28px;height:28px;border:0;border-radius:8px;background:#eef2f6;color:var(--muted);cursor:pointer;place-items:center}
.wr-srch.has .wr-clr{display:grid}
.wr-clr:hover{background:#e2e8f0;color:var(--text)}
.wr-chips{display:flex;gap:6px;flex-wrap:wrap}
.wr-chips:empty{display:none}
.wr-chip{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--border);background:#fff;color:var(--text);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.wr-chip:hover{border-color:#c5cfdb}
.wr-chip .d{width:8px;height:8px;border-radius:50%;background:#ea580c}
.wr-chip .c{min-width:20px;padding:1px 6px;border-radius:999px;background:#eef2f6;color:var(--muted);font-size:11px;font-weight:700;text-align:center;font-variant-numeric:tabular-nums}
.wr-chip.on{background:var(--wr1);border-color:var(--wr1);color:#fff}
.wr-chip.review.on{background:#c2410c;border-color:#c2410c}
.wr-chip.on .c{background:rgba(255,255,255,.2);color:#fff}
.wr-chip.on .d{background:#fff}

/* ---------- Λίστα ---------- */
.wr-list{background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden}
.wr-found{padding:9px 14px;font-size:12px;color:var(--muted);border-bottom:1px solid var(--border);background:#fbfcfd}
.wr-row{display:flex;flex-direction:column;gap:3px;width:100%;padding:11px 14px 11px 12px;border:0;border-bottom:1px solid #eef1f5;border-left:3px solid transparent;background:#fff;text-align:left;font:inherit;color:var(--text);cursor:pointer;transition:background .12s}
.wr-row:hover{background:#f7fafb}
.wr-row.on{background:var(--wr-soft);border-left-color:var(--wr2)}
.wr-row:focus-visible{outline:2px solid var(--wr2);outline-offset:-2px}
.wr-row>span{display:flex;align-items:center;gap:8px;min-width:0}
.wr-r1 .wr-code6{font-size:15px;color:var(--wr-ink)}
.wr-mdl{font-size:12px;font-weight:700;color:#5b6b7c;letter-spacing:.03em}
.wr-r1 time{margin-left:auto;font-size:11.5px;color:var(--muted);white-space:nowrap}
.wr-r2 b{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:none;max-width:55%}
.wr-r2 small,.wr-r3{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wr-r3{gap:10px}
.wr-ic{display:inline-flex;align-items:center;gap:3px;color:var(--wr2);font-weight:700}
.wr-rcode{margin-left:auto;color:#9aa6b2}
.wr-rcb{display:inline-flex;align-items:center;gap:4px;padding:1px 7px;border-radius:999px;background:#ffedd5;color:#9a3412;border:1px solid #fed7aa;font-size:10.5px;font-weight:700;white-space:nowrap}
.wr-row mark,.wr-det mark{background:#fff1a8;color:inherit;border-radius:3px;padding:0 1px}
.wr-code6{font-weight:800;letter-spacing:.06em;font-variant-numeric:tabular-nums}
.wr-more,.wr-end{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;font-size:12.5px;color:var(--muted)}
.wr-spin{width:15px;height:15px;border-radius:50%;border:2px solid #d5dde6;border-top-color:var(--wr2);animation:wr-rot .7s linear infinite;display:inline-block}
@keyframes wr-rot{to{transform:rotate(360deg)}}
.wr-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:46px 20px;text-align:center}
.wr-empty b{font-size:14px;color:var(--text)}
.wr-empty span{max-width:44ch}
.wr-empty.sm{padding:22px}
.wr-skel{cursor:default;gap:8px}
.wr-skel span{height:11px;border-radius:6px;background:linear-gradient(90deg,#eef1f5,#f6f8fa,#eef1f5);background-size:200% 100%;animation:wr-sk 1.2s ease-in-out infinite}
.wr-skel span:nth-child(1){width:45%;height:14px}.wr-skel span:nth-child(2){width:75%}.wr-skel span:nth-child(3){width:55%}
@keyframes wr-sk{to{background-position:-200% 0}}

/* ---------- Λεπτομέρεια ---------- */
.wr-det{background:#f6f8fb;border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:0 1px 2px rgba(21,36,59,.06),0 14px 34px -22px rgba(21,36,59,.5);
  max-height:calc(100vh - 124px);display:flex;flex-direction:column}      /* 124 = πάνω κενό + dock: το κάτω μέρος δεν κρύβεται πίσω από το dock */
.wr-det-empty{align-items:center;justify-content:center;gap:6px;min-height:340px;background:#fff;color:#9aa6b2;text-align:center;padding:20px}
.wr-det-empty b{font-size:14px;color:var(--text)}
.wr-det-empty span{font-size:12.5px;color:var(--muted)}
.wr-dh{display:flex;align-items:center;gap:12px;padding:14px 16px;background:linear-gradient(115deg,var(--wr1),var(--wr2) 130%);color:#fff;flex:none}
.wr-dh-t{flex:1;min-width:0}
.wr-dh h2{margin:0;font-size:21px;line-height:1.2;color:#fff}
.wr-dh .sub{font-size:12.5px;color:rgba(255,255,255,.82);margin-top:2px}
.wr-dh .sub b{color:#fff}
.wr-dh .x{width:34px;height:34px;border:0;border-radius:9px;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;cursor:pointer}
.wr-dh .x:hover{background:rgba(255,255,255,.26)}
.wr-back{display:none;align-items:center;gap:4px;height:32px;padding:0 10px 0 6px;border:0;border-radius:9px;background:rgba(255,255,255,.14);color:#fff;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
.wr-back svg{transform:rotate(180deg)}
.wr-db{padding:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;overflow:auto;min-height:0}
#wrDetInfo{display:contents}
.wr-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:13px 14px;min-width:0}
.wr-card h4{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--muted);margin:0 0 9px;text-transform:uppercase}
.wr-kv{display:flex;flex-direction:column;gap:1px;padding:6px 0;border-top:1px solid #f0f3f6;min-width:0}
.wr-card>.wr-kv:first-of-type,.wr-kv2:first-of-type .wr-kv{border-top:0;padding-top:0}
.wr-kv span{font-size:11px;color:var(--muted)}
.wr-kv b{font-size:13.5px;font-weight:600;color:var(--text);overflow-wrap:anywhere}
.wr-kv a{color:var(--wr-ink);text-decoration:none}
.wr-kv a:hover{text-decoration:underline}
.wr-kv2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.wr-by{display:flex;align-items:center;gap:6px;margin:9px 0 0;font-size:11.5px;color:var(--muted)}
.wr-load{display:flex;align-items:center;gap:8px;padding:10px 0;font-size:12.5px;color:var(--muted)}

/* παραστατικό: πλήρες πλάτος πάνω */
.wr-rc{grid-column:1/-1}
.wr-rc.is-review{border-color:#fdba74;box-shadow:0 0 0 3px #fff7ed}
.wr-rc-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.wr-rc-warn{display:flex;gap:9px;align-items:flex-start;margin:0 0 10px;padding:9px 11px;border-radius:10px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}
.wr-rc-warn svg{flex:none;margin-top:1px}
.wr-rc-warn b{display:block;font-size:12.5px}
.wr-rc-warn span{display:block;font-size:12px;color:#7c2d12}
.wr-rc-file{display:flex;align-items:center;gap:12px;flex:1 1 260px;min-width:0;padding:8px;border:1px solid var(--border);border-radius:11px;background:#fafbfc;font:inherit;color:var(--text);text-align:left;cursor:pointer}
.wr-rc-file:hover{border-color:var(--wr2);background:var(--wr-soft)}
.wr-rc-th{flex:none;display:grid;place-items:center;width:64px;height:64px;border-radius:9px;background:#fff center top/cover no-repeat;border:1px solid var(--border);color:var(--wr2)}
.wr-rc-m{min-width:0;display:flex;flex-direction:column;line-height:1.3}
.wr-rc-m b{font-size:13.5px;font-weight:700;color:var(--wr-ink)}
.wr-rc-m small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wr-rc-date{flex:1 1 180px;border-top:0;padding:0}
.wr-rc-date b{font-size:17px;font-weight:800}
.wr-rc-none{margin:0;flex:1 1 260px;font-size:12.5px;color:var(--muted);font-style:italic}
.wr-rc-days{display:block;font-style:normal;font-size:11.5px;font-weight:600;color:#166534}
.wr-rc-days.late{color:#b91c1c}
.wr-rc-no{font-size:13px;font-weight:500;color:var(--muted)}
.wr-rc-txt{font-size:11.5px;font-weight:500;color:var(--muted)}
.wr-rc-form{display:flex;gap:6px;margin-top:10px}
.wr-rc-form input{flex:1;min-width:0;max-width:220px;height:34px;padding:0 9px;border:1px solid var(--border);border-radius:8px;font:inherit;font-size:13px;color:var(--text);background:#fff}
.wr-rc-form input:focus{outline:none;border-color:var(--wr2);box-shadow:0 0 0 3px var(--wr-soft)}

/* σημειώσεις: πλήρες πλάτος κάτω */
.wr-notes{grid-column:1/-1}
.wr-notes h4 span{min-width:18px;padding:0 6px;border-radius:999px;background:#eef2f6;color:var(--muted);font-size:10.5px;text-align:center;letter-spacing:0}
.wr-notes h4 span:empty{display:none}
.wr-ncomp{display:flex;gap:8px;align-items:flex-end;margin-bottom:10px}
.wr-ncomp textarea{flex:1;min-width:0;resize:vertical;min-height:40px;padding:9px 11px;border:1px solid var(--border);border-radius:9px;font:inherit;font-size:13.5px;line-height:1.5;color:var(--text);outline:none}
.wr-ncomp textarea:focus{border-color:var(--wr2);box-shadow:0 0 0 3px rgba(31,122,140,.12)}
.wr-ncomp .btn{flex:none;white-space:nowrap}
.wr-nempty{margin:0;font-size:12.5px;color:var(--muted);font-style:italic}
.wr-note{padding:10px 0;border-top:1px solid #f0f3f6}
.wr-nh{display:flex;align-items:center;gap:7px;font-size:12px}
.wr-nh b{font-weight:700;color:var(--text)}
.wr-nh time{color:var(--muted)}
.wr-ndel{margin-left:auto;width:28px;height:28px;border:0;border-radius:7px;background:transparent;color:#9aa6b2;cursor:pointer;display:grid;place-items:center}
.wr-ndel:hover{background:#fee2e2;color:#b91c1c}
.wr-nk{display:inline-block;margin:6px 0 0 29px;padding:0 7px;border-radius:999px;background:#eef2f6;font-size:10.5px;font-weight:700;color:#5b6b7c}
.wr-nb{margin:5px 0 0 29px;font-size:13.5px;line-height:1.55;color:var(--text);white-space:pre-wrap;overflow-wrap:anywhere}
.wr-ned{display:block;margin:3px 0 0 29px;font-size:11px;font-style:normal;color:#8a6d1d}
.btn.wr-del{background:#b91c1c;color:#fff;border:0}
.btn.wr-del:hover{background:#991b1b}

/* ---------- Στενά / κινητό ---------- */
@media (max-width:1400px){
  .wr-db{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:1100px){
  .wr-split{grid-template-columns:minmax(0,1fr)}
  .wr-page:not(.has-sel) .wr-detcol{display:none}
  .wr-page.has-sel .wr-listcol{display:none}
  .wr-detcol{position:static}
  .wr-det{max-height:none}
  .wr-back{display:inline-flex}
  .wr-dh .x{display:none}
}
@media (max-width:760px){
  .wr-stat{min-width:0;flex:1 1 40%}
  .wr-db{padding:10px;gap:10px}
  .wr-kv2{grid-template-columns:minmax(0,1fr)}
  .wr-kv2 .wr-kv{border-top:1px solid #f0f3f6!important;padding-top:6px!important}
  .wr-kv2:first-of-type .wr-kv:first-child{border-top:0!important;padding-top:0!important}
  .wr-ncomp{flex-direction:column;align-items:stretch}
  .wr-dh{padding:12px}
  .wr-dh h2{font-size:19px}
}
/* ============================================================
   MOBILE / TABLET (≤900px) — drawer + «+» sheet + PWA chrome
   Όλα κλεισμένα σε @media: το desktop (>900px) μένει ΑΘΙΚΤΟ.
   Τα mobile-only στοιχεία είναι display:none by default.
   ============================================================ */
.m-hamb,.m-brand,.m-fab,.m-nav-ov,.m-sheet-root,.m-logout{display:none}

/* Κουμπί «Έξοδος» μέσα στο πλαϊνό μενού: τα ΟΠΤΙΚΑ ορίζονται εδώ μία φορά
   (εκτός @media) γιατί το χρησιμοποιούν ΔΥΟ εύρη — mobile (≤900) και
   διπλωμένο μενού tablet/laptop (901–1400, 41-sidebar-fold.css).
   Κάθε εύρος αλλάζει ΜΟΝΟ το `display` και τα περιθώρια. */
.m-logout{align-items:center;justify-content:center;gap:10px;flex:none;padding:12px;
  border:none;border-top:1px solid rgba(255,255,255,.1);border-radius:10px;
  background:rgba(255,90,71,.12);color:#ffb3a3;font-size:15px;font-weight:600;
  font-family:inherit;cursor:pointer}
.m-logout svg{width:19px;height:19px;flex:none}
.m-logout:active{background:rgba(255,90,71,.28);color:#fff}

@media (max-width:900px){

  /* ---------- Off-canvas drawer (το υπάρχον aside) ---------- */
  aside.sidebar-wrap{position:fixed;top:0;left:0;height:calc(100vh / var(--zf,1));height:calc(100dvh / var(--zf,1));width:min(82vw,300px);
    z-index:120;transform:translateX(-100%);transition:transform .28s ease;
    box-shadow:0 0 44px rgba(0,0,0,.42);will-change:transform}
  body.mnav-open aside.sidebar-wrap{transform:none}
  body.has-preview aside.sidebar-wrap{top:0}

  .m-nav-ov{display:block;position:fixed;inset:0;background:rgba(11,21,36,.5);z-index:110;
    opacity:0;pointer-events:none;transition:opacity .28s ease}
  body.mnav-open .m-nav-ov{opacity:1;pointer-events:auto}

  /* Έξοδος: κάτω-κάτω στο drawer (το #sidebar είναι flex:1 → το σπρώχνει κάτω).
     Τα οπτικά είναι στο base block παραπάνω — εδώ μόνο εμφάνιση + safe-area. */
  .m-logout{display:flex;margin:6px 10px calc(12px + env(safe-area-inset-bottom))}

  /* ---------- Topbar mobile: [☰] [καρτέλα χρήστη] [🔍] ... [notif][chat] ---------- */
  #topbar{justify-content:flex-start;flex-wrap:wrap;gap:8px;padding:9px 12px 6px}
  /* Hamburger = pill στο στιλ του topbar· μεταμορφώνεται σε «X» + navy όταν ανοίγει το μενού */
  .m-hamb{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;order:0;cursor:pointer;
    background:linear-gradient(135deg,#ff9d5c,#e8622d 55%,#c2410c);border:none;border-radius:13px;color:#fff;
    box-shadow:0 5px 16px rgba(232,98,45,.5),inset 0 1.5px 0 rgba(255,255,255,.4);
    transition:transform .1s ease}
  .m-hamb:active{transform:scale(.94)}
  .m-hamb .mh-box{position:relative;width:20px;height:14px}
  .m-hamb .mh-box i{position:absolute;left:0;right:0;height:2px;border-radius:2px;background:#fff;
    transition:transform .28s cubic-bezier(.4,.2,.2,1),opacity .18s ease}
  .m-hamb .mh-box i:nth-child(1){top:0}
  .m-hamb .mh-box i:nth-child(2){top:6px}
  .m-hamb .mh-box i:nth-child(3){top:12px}
  body.mnav-open .m-hamb .mh-box i:nth-child(1){transform:translateY(6px) rotate(45deg)}
  body.mnav-open .m-hamb .mh-box i:nth-child(2){opacity:0}
  body.mnav-open .m-hamb .mh-box i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
  .m-brand{display:none}                                  /* αντικαθίσταται από την καρτέλα χρήστη */
  /* Καρτέλα χρήστη: ελαστική + truncation → ΠΟΤΕ δεν σπρώχνει τα εικονίδια σε 2η γραμμή.
     flex-basis:0% (ΟΧΙ auto) ώστε στο line-break να «μετράει» ως μηδέν → όλα μένουν σε μία γραμμή. */
  #topbar .user-chip{order:1;flex:1 1 0%;min-width:0;overflow:hidden}
  #topbar .user-chip>div:last-child{min-width:0}
  #topbar .user-chip .nm,#topbar .user-chip .rl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  #topbar .toolbar{order:3;flex:none}                     /* notif/chat στη δεξιά άκρη, σταθερά */
  #topbar #logoutBtn{display:none}
  #topbar #roleWrap,#topbar #deptWrap,#topbar .tb-sep,#topbar .zoom-ctrl{display:none}

  /* Αναζήτηση = μεγεθυντικός φακός (κλειστό), δεξιά από την καρτέλα, σταθερό πλάτος */
  #topbar .search{order:2;flex:none;min-width:0;width:44px;height:46px}
  #topbar .search .sic{left:0;right:0;justify-content:center;pointer-events:auto;cursor:pointer;color:#1c2e4a}
  #topbar .search input{display:none}
  /* Ανοιχτό = δική του πλήρης γραμμή με το πεδίο */
  #topbar .search.m-open{order:5;flex:0 0 100%;width:100%;margin-right:0;height:auto;margin-top:2px}
  #topbar .search.m-open input{display:block;width:100%}
  #topbar .search.m-open .sic{left:15px;right:auto;justify-content:flex-start;pointer-events:none;color:#98a0ad}
  #topbar .search.m-open .search-drop{max-width:100%}

  main{padding:12px 14px 96px}

  /* ---------- Dock → αόρατο, κρατάμε ΜΟΝΟ τα banners ---------- */
  .dock{background:none;border:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
    padding:0;gap:0}
  .dock .dock-item{display:none}
  .dock.glow{box-shadow:none}

  /* ---------- «+» FAB κάτω δεξιά ---------- */
  .m-fab{display:flex;align-items:center;justify-content:center;position:fixed;
    right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:56px;height:56px;border-radius:18px;
    color:#fff;border:none;cursor:pointer;z-index:95;
    background:linear-gradient(135deg,#ff9d5c,#e8622d 55%,#c2410c);
    box-shadow:0 6px 20px rgba(232,98,45,.5),inset 0 1.5px 0 rgba(255,255,255,.4)}
  .m-fab:active{transform:scale(.96)}

  /* Το bubble μηνυμάτων κάθεται ΠΑΝΩ από το «+» FAB (κι εκείνο κάτω δεξιά),
     αλλιώς το σκέπαζε. Ίδια γωνία, απλώς πιο ψηλά. */
  .toast{bottom:calc(84px + env(safe-area-inset-bottom));right:14px;
    max-width:min(300px,calc(100vw - 28px))}

  /* ---------- Bottom-sheet (δημιουργία + εφαρμογές) ---------- */
  .m-sheet-root{display:none}
  .m-sheet-root.open{display:block}
  .m-sheet-ov{position:fixed;inset:0;background:rgba(11,21,36,.5);z-index:130;
    display:flex;align-items:flex-end}
  .m-sheet{background:#fff;width:100%;border-radius:20px 20px 0 0;
    padding:8px 16px calc(20px + env(safe-area-inset-bottom));
    max-height:82vh;max-height:82dvh;overflow-y:auto;animation:mSheetUp .26s cubic-bezier(.22,1,.36,1)}
  @keyframes mSheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
  .m-grab{width:38px;height:4px;border-radius:2px;background:#cfd6de;margin:6px auto 4px}
  .m-sheet-h{display:flex;align-items:center;justify-content:flex-end;margin-bottom:2px}
  .m-sheet-x{border:none;background:none;color:var(--muted);font-size:20px;padding:4px 6px;cursor:pointer;line-height:1}
  .m-sec{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:#7f8ea8;font-weight:700;margin:10px 2px 8px}
  .m-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
  .m-tile{border:none;background:none;display:flex;flex-direction:column;align-items:center;gap:6px;
    font-size:11px;font-weight:600;color:var(--text);cursor:pointer;font-family:inherit;padding:4px 2px}
  .m-tile:active{opacity:.6}
  .m-ti{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;color:#fff;
    box-shadow:0 4px 10px rgba(21,36,59,.18),inset 0 1px 0 rgba(255,255,255,.35)}
  .m-ti svg{width:22px;height:22px}
  .m-inst{width:100%;margin-top:16px;border:1px solid var(--border);background:var(--bg);
    border-radius:12px;padding:12px;display:flex;align-items:center;justify-content:center;gap:8px;
    font-size:13px;font-weight:600;color:#1c2e4a;cursor:pointer;font-family:inherit}
  .m-inst svg{width:16px;height:16px;flex:none}

  /* ---------- Chat panel full-screen ---------- */
  #chatPanel{top:0;left:0;right:0;width:100%;border-top-left-radius:0;border-left:none;z-index:140}
  body.has-preview #chatPanel{top:0}

  /* ---------- Dropdown ειδοποιήσεων: πλήρες πλάτος κάτω από το topbar ---------- */
  #notifDrop{top:62px;left:8px;right:8px;width:auto;max-width:none;max-height:74vh;max-height:74dvh;overflow-y:auto;z-index:145}
  #notifDrop .notif-list{max-height:none}

  /* ---------- Modals: να χωράνε στο πλάτος ΚΑΙ στο ύψος της οθόνης ----------
     ΓΙΑΤΙ: το `max-height:90vh` (19-modal) μετράει το ΜΕΓΑΛΟ viewport (σαν να
     μην υπάρχει η μπάρα διεύθυνσης του browser) → σε κινητό το popup ξεπερνούσε
     την ορατή περιοχή και «κοβόταν» (χανόταν ο footer + το κάτω περιεχόμενο).
     Το `dvh` = ΟΡΑΤΟ ύψος τώρα (ίδιο μοτίβο με το AI popup).
     Επιπλέον: header/footer `flex:none` (να μη συμπιέζονται) και body
     `flex:1;min-height:0` → το scroll γίνεται ΜΟΝΟ μέσα στο body. */
  .overlay{padding:12px}
  .modal{max-width:100%;max-height:90vh;max-height:90dvh}
  .modal-h,.modal-f{flex:none}
  .modal-b{flex:1 1 auto;min-height:0}

  /* Hero: τίτλος ΔΙΠΛΑ στο εικονίδιο (όχι από κάτω) — flex-basis:0 στο κείμενο ώστε
     να μη «μετράει» φαρδύ στο line-break· η περιγραφή αναδιπλώνεται μέσα του. */
  .page-hero>div:not(.hactions){flex:1 1 0;min-width:0}

  /* Σημειώσεις (module 48): ευρετήριο ΚΑΙ σελίδα δεν χωράνε μαζί → master/detail */
  .nb-book{grid-template-columns:1fr;min-height:0}
  .nb-idx{max-height:none;border-right:none}
  .nb-book .nb-page{display:none}
  .nb-book.pg .nb-idx{display:none}
  .nb-book.pg .nb-page{display:flex}
  /* Ράχη: στο ευρετήριο δεν έχει νόημα (δεν φαίνεται χαρτί) — μόνο στη σελίδα.
     Στενότερη στήλη, μεγαλύτερο overhang ώστε ο κρίκος να φαίνεται ΟΛΟΚΛΗΡΟΣ
     (πλάτος tile 54px): 26 + 22 = 48 ≥ 46. Παραμένει πριν το περιθώριο (44px). */
  .nb-spiral{display:none}
  .nb-book.pg{grid-template-columns:26px minmax(0,1fr)}
  .nb-book.pg .nb-spiral{display:block}
  .nb-book.pg .nb-spiral::before{right:-22px}
  .nb-book.pg .nb-spiral::after{width:12px}
  /* overhang 20px στο κινητό → τα κουμπιά της μπάρας ξεκινούν πιο μέσα,
     αλλιώς οι κρίκοι σκεπάζουν το «←» (pointer-events:none, άρα πατιόταν αόρατο). */
  .nb-book.pg .nb-ptop{padding-left:28px}
  .nb-back{display:grid}
  /* Η μπάρα του χαρτιού ΔΕΝ χωράει σε μία γραμμή σε τηλέφωνο: το flex συνέθλιβε τα
     κουμπιά (το «←» έπεφτε στα 15px) και το ✕ έβγαινε έξω από το χαρτί — ΑΟΡΑΤΟ,
     γιατί το .nb-book έχει overflow:hidden (καμία μπάρα κύλισης να το προδώσει).
     Λύση: ΔΥΟ γραμμές — «← ημερομηνία … ✕» πάνω, τα 6 χρώματα από κάτω.
     Τα κουμπιά κλειδώνουν σε πλήρες μέγεθος (tap targets). Δουλεύει και στα 360px.
     Φρουρός: scrollWidth <= clientWidth ΚΑΙ δεξιά άκρη τελευταίου ≤ δεξιά άκρη χαρτιού. */
  .nb-ptop{gap:6px;padding:9px 10px 9px 22px;flex-wrap:wrap}
  .nb-back,.nb-del{flex:none}
  .nb-date{font-size:11px;padding:5px 7px;flex:0 1 auto;min-width:0}
  .nb-del{order:1;margin-left:auto}
  .nb-colors{order:2;flex:0 0 100%;margin-left:0;justify-content:flex-start}
  .nb-cdot{width:17px;height:17px;border-radius:5px}
  /* Μεγέθυνση post-it: ίδιο πρόβλημα με τη μπάρα του σημειωματαρίου — δεν χωράει
     σε μία γραμμή (καρφίτσα+ημερομηνία+6 χρώματα+κάδος+✕). ΔΥΟ γραμμές. */
  .nbz-top{flex-wrap:wrap;gap:7px;padding:10px 12px 10px 14px}
  .nb-zoom .nb-del,.nbz-x{order:1}
  .nb-zoom .nb-del{margin-left:auto}
  .nb-zoom .nb-colors{order:2;flex:0 0 100%;margin-left:0;justify-content:flex-start}
  .nbz-sheet{padding:14px 16px 6px}
  .nbz-title{font-size:18px}
  .nbz-text{font-size:14.5px}
  .nb-sheet{padding-right:12px}
  .nb-title,.nb-text{padding-left:56px}
  .nb-wall{grid-template-columns:1fr;gap:13px}
  .nb-srch{max-width:none}
  /* δύο κουμπιά στο hero: σε στοίβα κάτω από τον τίτλο, όχι στριμωγμένα δίπλα */
  .page-hero .hactions{flex:1 1 100%;margin-left:0;justify-content:flex-end}

  @media (max-width:560px){ .m-grid{grid-template-columns:repeat(3,1fr)} }
}

/* ============================================================
   Heroes/banners modules — ΣΥΜΠΥΚΝΩΣΗ ύψους σε phone (≤600px)
   Λιγότερο padding/εικονίδιο/γραμματοσειρά/περιθώριο → δεν τρώνε οθόνη.
   ============================================================ */
@media (max-width:600px){
  /* Γενικό banner-hero modules (.page-hero: Ημερολόγιο/Αναφορές/Ανάγκες/Ρυθμίσεις/Ανακοινώσεις/Projects/God/Gate) */
  .page-hero{padding:11px 14px;border-radius:13px;gap:10px;margin-bottom:12px;box-shadow:0 5px 16px rgba(21,36,59,.18)}
  .page-hero h1{font-size:16px;line-height:1.2}
  .page-hero p{font-size:11px;margin-top:2px}
  .ph-ic{width:34px;height:34px;border-radius:10px}
  .ph-ic svg{width:18px;height:18px}
  .page-hero .hactions{gap:6px}
  .page-hero .hactions .btn{padding:7px 11px;font-size:12px}

  /* Dashboard hero (.hero — με τα διακοσμητικά) */
  .hero{padding:14px 16px 13px;border-radius:15px;margin-bottom:13px;box-shadow:0 6px 18px rgba(21,36,59,.22)}
  .hero .hrow{gap:10px}
  .hero h1{font-size:18px}
  .hero .hd{font-size:11.5px;margin-top:3px}
  .hero::before{width:150px;height:150px;right:-50px;top:-60px}
  .hero::after{width:140px;height:140px;bottom:-90px;left:30%}

  /* .page-head (τίτλοι σελίδων χωρίς gradient) */
  .page-head{margin-bottom:12px;gap:10px}
  .page-head h1{font-size:17px}
  .page-head p{font-size:12px}

  /* Modal headers λίγο πιο μαζεμένα + εικονίδιο κεφαλίδας μικρότερο */
  .modal-h{padding:12px 15px}
  .modal-b{padding:14px 15px}
  .mh-ic,.mh-ic.sm,.mh-ic.xs{width:34px;height:34px;border-radius:10px}
  .mh-ic svg{width:17px;height:17px}
  .modal-h h2{font-size:15px}
  .modal-h .sub{font-size:11px;line-height:1.45}
  .modal-f{padding:11px 15px}

  /* Φόρμα επαφών: 2 στήλες → 1 σε phone */
  .ct-fields{grid-template-columns:1fr}
}

/* ============================================================
   PROJECTS σε κινητό (≤900px popup / ≤600px phone)
   Το popup ανάλυσης έργου «κοβόταν»: 90vh + δεύτερο σκληρό
   max-height στο body + κεφαλίδα/σειρές που δεν χωρούσαν.
   Το ύψος το λύνει το γενικό dvh/flex block πιο πάνω· εδώ
   μπαίνει η διάταξη (πλάτος/στοίχιση/συμπύκνωση).
   ============================================================ */
@media (max-width:900px){
  /* Το popup γεμίζει την οθόνη· ΚΑΤΩ το δεύτερο max-height —
     το scroll το αναλαμβάνει το flex body (δες γενικό block). */
  .prj-modal{width:auto;max-width:100%}
  .prj-modal .modal-b{max-height:none}
  /* Λίστα ατόμων του wizard: όχι δεύτερο scroll-box μέσα σε scroll-box */
  .np-people{max-height:min(44vh,280px)}
  /* Κάρτες λίστας project: ποτέ πιο φαρδιές από τη στήλη */
  .prj-grid{grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:11px}
}

@media (max-width:600px){
  /* ---- Κεφαλίδα popup: ο τίτλος παίρνει όλο το πλάτος,
          το badge κατάστασης πέφτει σε δική του γραμμή ---- */
  .prj-modal .modal-h{flex-wrap:wrap;gap:10px;align-items:center}
  .prj-hbadge{order:4;flex:1 0 100%}

  /* ---- Hero: δακτύλιος πάνω, μετρικά από κάτω (2 + 1 πλήρους πλάτους) ---- */
  .prjm-hero{flex-direction:column;align-items:center;gap:11px;padding:12px;border-radius:12px}
  .prjm-hero>svg{width:72px;height:72px}
  .prjm-metrics{width:100%;grid-template-columns:1fr 1fr;gap:8px}
  .prjm-metric{padding:8px 10px;border-radius:9px}
  .prjm-metric .k{font-size:10px;margin-bottom:2px}
  .prjm-metric .v{font-size:17px}
  /* Προθεσμία: μία οριζόντια γραμμή σε όλο το πλάτος (η ημερομηνία δεν σπάει) */
  .prjm-metric:nth-child(3){grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:3px 8px}
  .prjm-metric:nth-child(3) .k{margin-bottom:0}
  .prjm-metric:nth-child(3) .v{margin-left:auto}
  .prjm-metric:nth-child(3) .km{margin-top:0}

  /* ---- Πρόοδος ανά άτομο: όνομα με «…», μικρότερες στήλες ---- */
  .prj-person{gap:9px;padding:9px 12px}
  .pp-name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pp-pct{font-size:12.5px;min-width:34px}
  .pp-meta{font-size:9.5px;min-width:44px}

  /* ---- Footer: το κουμπί «← γονικό έργο» δεν σπρώχνει το «Κλείσιμο» έξω ---- */
  .modal-f{flex-wrap:wrap;padding:11px 15px;gap:8px}
  .modal-f .btn{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}

  /* ---- Κάρτες λίστας project ---- */
  .prj-card{padding:13px 13px}
  .prj-tt{font-size:13.5px}
  .prj-card-top{flex-wrap:wrap;gap:8px}
  .prj-badge{font-size:10px;padding:2px 8px}

  /* ---- Wizard δημιουργίας: πιο μαζεμένος ---- */
  #npWin .modal-b.np-body, #ntWin .modal-b.np-body{padding:14px 14px;gap:12px}
  .np-section{padding:13px}
  .np-grid2{grid-template-columns:1fr 1fr;gap:9px}
  .np-stepper{gap:4px;margin-bottom:12px}
  .np-sdot{font-size:10px}
  .np-person-h{padding:9px 11px;margin-bottom:11px}
  .np-item{gap:7px}

  /* ---- Σειρές task (λίστα αναθέσεων έργου & κάθε λίστα tasks) ----
     Σε phone ο τίτλος παίρνει ολόκληρη γραμμή και προθεσμία/πρόοδος
     πέφτουν από κάτω — αλλιώς στριμώχνονταν και κόβονταν δεξιά.
     Η χρωματιστή μπάρα προτεραιότητας γίνεται απόλυτη στα αριστερά. */
  .task-row{flex-wrap:wrap;gap:7px 10px;padding:10px 12px 10px 15px;position:relative;align-items:center}
  .task-row .prio{position:absolute;left:6px;top:10px;bottom:10px;width:3px;height:auto}
  .task-row .task-main{flex:1 1 100%}
  .task-row .tt{font-size:13px;line-height:1.35}
  .task-row .ts{font-size:11px;line-height:1.6}
  .task-row .deadline{order:2;font-size:11px;padding:2px 8px}
  .task-row .prog-wrap{order:3;flex:1 1 auto;width:auto;display:flex;align-items:center;gap:8px;justify-content:flex-end}
  .task-row .prog-wrap .pct{flex:none}
  .task-row .prog-wrap .mini-bar{flex:1 1 auto;max-width:120px;min-width:52px}
  /* Στις κάρτες dashboard η μπάρα προτεραιότητας μπαίνει μέσα στο chip */
  .dgrid .card .task-row{padding-left:15px}
}

/* ============================================================
   TASKS σε κινητό — popup λεπτομερειών, kanban, κάρτα 2ου επιπέδου
   ------------------------------------------------------------
   Η ΚΥΡΙΑ αιτία που «κοβόταν» ήταν JS, όχι CSS: το `fitTaskModal()`
   έβαζε inline `width/maxWidth/maxHeight` με **ελάχιστο 500px**
   (`Math.max(500,…)`) → σε οθόνη 360px το popup έβγαινε εκτός.
   Το inline style νικά κάθε media query, γι' αυτό το fitTaskModal
   κάνει πλέον early-return + καθάρισμα σε ≤900px (11-task-modal).
   Εδώ μένει η διάταξη.
   ============================================================ */
@media (max-width:900px){
  /* Ο τίτλος της κεφαλίδας να μπορεί να συρρικνωθεί (min-width:auto = overflow) */
  .modal-h>div{min-width:0}

  /* ---- Kanban μέσα στο task ----
     Οι στήλες μένουν οριζόντιο scroll (μοτίβο Trello) αλλά με snap
     και πλάτος «μιας οθόνης» ώστε να μη φαίνονται μισές. */
  .kb{gap:9px;padding:9px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .kb-col{flex:0 0 min(76vw,240px);scroll-snap-align:start;max-height:none}
  .kb-form{flex:0 0 min(76vw,240px)}
  /* ΚΡΙΣΙΜΟ σε touch: τα βελάκια ‹ › ήταν `opacity:0` και εμφανίζονταν ΜΟΝΟ
     σε :hover — σε κινητό δεν υπάρχει hover ΚΑΙ το HTML5 drag-and-drop δεν
     δουλεύει, οπότε η μετακίνηση κάρτας ήταν αδύνατη. Πάντα ορατά + πιο
     μεγάλος στόχος αφής. Ίδια λογική για το ✕ της στήλης και του checklist. */
  .kb-arrows{opacity:1}
  .kb-arrows button{width:26px;height:26px;font-size:15px}
  .kb-colx{opacity:.75}
  .cd-del{opacity:.7}
  .att-dl{opacity:.9;background:rgba(21,36,59,.35)}
}

@media (max-width:600px){
  /* ---- Κεφαλίδα task: κατάσταση/προτεραιότητα σε δική τους γραμμή ---- */
  #taskModal .modal-h .sub{display:flex;flex-wrap:wrap;align-items:center;gap:5px 7px;margin-top:5px}

  /* ---- Στοιχεία task: 2 στήλες, αλλά η προθεσμία αναδιπλώνεται
          (το .deadline είναι nowrap → ξεχείλιζε δεξιά) ---- */
  .info-grid{gap:8px;margin-bottom:13px}
  .info-cell{padding:8px 10px}
  .info-cell .k{font-size:9.5px}
  .info-cell .v{font-size:12px}
  .info-cell .deadline{white-space:normal;display:inline-block;line-height:1.5}

  /* ---- Tabs (Πίνακας / Συζήτηση): να χωράνε χωρίς κόψιμο ---- */
  .tabbar{gap:2px;margin:13px 0 10px}
  .tbtn{padding:8px 10px;font-size:12px;gap:5px}

  /* ---- Kanban: λίγο μικρότερες κάρτες ---- */
  .kb-top{flex-wrap:wrap;gap:7px}
  .kb-top .btn{padding:6px 10px;font-size:11.5px}
  .kb-head{font-size:10.5px;padding:8px 9px}
  .kb-title{font-size:12.5px}

  /* ---- Συζήτηση task: ψηλότερο παράθυρο, πεδίο που δεν κάνει zoom στο iOS ---- */
  .task-chat .tc-msgs{max-height:min(46vh,320px)}
  .conv-input input{font-size:16px}          /* <16px = auto-zoom σε iOS Safari */
  .conv-input .btn-primary{width:40px;height:40px}

  /* ---- Απλό task ---- */
  .simple-wrap{padding:14px}
  .btn-done{padding:12px 22px;font-size:14px;width:100%;justify-content:center}
  .done-banner{padding:13px;font-size:13.5px}

  /* ---- Κάρτα kanban (2ο επίπεδο) ---- */
  .cd-check{padding:8px 4px}
  .cd-check span{font-size:12.5px}
  .cd-check input{width:19px;height:19px}    /* μεγαλύτερος στόχος αφής */
  .cd-labels{flex-wrap:wrap;gap:7px}
  .kind-seg{flex-direction:column;gap:8px}   /* «Απλό/Σύνθετο» στοιβαγμένα */

  /* ---- Συνημμένα ---- */
  .att-grid{grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:8px}
  .att-th{height:64px}
}

/* ============================================================
   ΕΠΑΦΕΣ σε κινητό — ΔΥΟ ΕΠΙΠΕΔΑ (λίστα → καρτέλα με «Πίσω»)
   ΓΙΑΤΙ: το master-detail (.ct-left σταθερά 295px + .ct-right
   flex:1) άφηνε ~45px για την καρτέλα σε οθόνη 360px, ενώ το
   ctRender έγραφε inline width/height από το window.innerHeight
   (ΜΕΓΑΛΟ viewport) → το popup «κοβόταν» κάτω ΚΑΙ ακύρωνε το
   90dvh του γενικού block. Πλέον το JS δεν βάζει καμία inline
   διάσταση σε ≤900px· η διάταξη ζει ΜΟΝΟ εδώ.
   Ποιο πάνελ φαίνεται το λέει η κλάση pane-list/pane-detail
   στο .ct-wrap (state `_ct.pane`, module 16).
   ============================================================ */
@media (max-width:900px){
  /* ---- Τα δύο επίπεδα ---- */
  .ct-wrap{min-width:0}
  .ct-left{width:auto;flex:1 1 auto;min-width:0;border-right:none;background:#fff}
  .ct-right{display:none;padding:14px 15px}
  .ct-wrap.pane-detail .ct-left{display:none}
  .ct-wrap.pane-detail .ct-right{display:block}

  /* ---- Κεφαλίδα: «‹ Πίσω» + τίτλος που δεν σπάει τη γραμμή ---- */
  .ct-head{align-items:center}
  .ct-back{border:none;background:rgba(255,255,255,.18);color:#fff;width:34px;height:34px;
    border-radius:10px;display:grid;place-items:center;flex:none;padding:0;cursor:pointer}
  .ct-back svg{transform:rotate(180deg)}   /* το `chev` δείχνει δεξιά */
  .ct-back:active{background:rgba(255,255,255,.3)}
  .ct-head h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ct-newbtn{padding:7px 11px}

  /* ---- Λίστα: μεγαλύτεροι στόχοι αφής + βελάκι «άνοιγμα» ---- */
  .ct-item{padding:12px 13px;gap:11px}
  .ct-item .cn{font-size:13.5px}
  .ct-item .cs{font-size:11.5px;margin-top:2px}
  .ct-av{width:38px;height:38px;font-size:13px}
  .ct-go{display:grid;place-items:center}
  .ct-cattabs button{padding:8px 4px;font-size:12px}
  .tagch{padding:4px 9px;font-size:11px}
  .tagadd{width:32px;height:32px}

  /* iOS: input με font-size <16px κάνει auto-zoom στο focus */
  .ct-search input,.ct-tagrow select,.ct-tagnew input,
  .ct-noterow input,.ct-noterow select,
  .ct-form input,.ct-form select,.ct-form textarea{font-size:16px}

  /* ---- Γρήγορες ενέργειες: πλέγμα με στοιβαγμένη ετικέτα (βάση: 27-epafes) ---- */
  .ct-qa{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:8px}
  .ct-qa-b{flex-direction:column;gap:5px;padding:11px 4px;border-radius:12px;font-size:11px;width:100%}
  .ct-qa-b svg{width:19px;height:19px}
  .ct-qa-b:hover{transform:none;box-shadow:none}
  /* Το εικονίδιο αντιγραφής δεν έχει hover στην αφή → μόνιμα ορατό, διακριτικά */
  .ct-fields .cp-ic{opacity:.5}
  /* Λίστα: το badge «τελευταία επαφή» δεν πρέπει να στριμώξει το όνομα */
  .ct-last{font-size:9px;padding:2px 5px;margin-left:5px}
  .ct-last-inline{flex:1 1 100%;margin:2px 0 0;font-size:10px}
  /* Πάνελ timeline: πιο σφιχτό στο κινητό */
  .ct-lbl{margin:14px 0 7px;padding-top:12px}
  .ct-panel{margin-top:15px;border-radius:13px}
  .ct-panel-h{padding:10px 12px;gap:8px}
  .ct-panel-b{padding:11px 12px 3px}
  /* Φίλτρο timeline: μεγαλύτεροι στόχοι αφής */
  .ct-tlf{gap:7px}
  .ct-tlf-b{padding:7px 13px;font-size:12px}
  .ct-tlf-b:hover{color:var(--muted);border-color:var(--border)}
  .ct-tlf-b.on:hover{color:#fff;border-color:var(--navy)}
  /* «Σε ποιον;»: τα 3 κανάλια πάνε σε δική τους σειρά, πλήρους πλάτους */
  .ct-pk-row{flex-wrap:wrap;gap:10px;padding:12px 13px}
  .ct-pk-ch{flex:1 1 100%;margin-left:45px;gap:8px}
  .ct-pk-b{flex:1;min-width:0;padding:9px 6px 8px}
  .ct-pk-b span{font-size:10.5px}
  .ct-pk-b:hover,a.ct-pk-row:hover{transform:none;box-shadow:none;background:#fff;border-color:var(--border)}
  .ct-pk-t span{white-space:normal}
  /* Επιλογή καναλιού: μία στήλη, οριζόντια γραμμή ανά κανάλι */
  .ct-msg-grid{grid-template-columns:1fr;gap:9px}
  .ct-msg-b{flex-direction:row;align-items:center;justify-content:flex-start;gap:13px;
    padding:13px 15px;text-align:left;flex-wrap:wrap}
  .ct-msg-b span{flex:1 1 100%;margin-left:47px;margin-top:-4px}
  .ct-msg-b:hover{transform:none;box-shadow:none}

  /* ---- Φόρμα: τα επιπλέον άτομα σε κουτί, ο «✕» σε δική του σειρά ---- */
  .ct-prow{grid-template-columns:1fr 1fr;gap:8px;padding:10px;margin-bottom:9px;
    border:1px solid var(--border);border-radius:11px;background:#fafbfd}
  .ct-prow>button{grid-column:1/-1;justify-self:end}
}

@media (max-width:600px){
  /* Καρτέλα: όνομα κάτω από το avatar δεν χρειάζεται — τα κουμπιά ενεργειών
     όμως θέλουν ολόκληρη γραμμή, αλλιώς στριμώχνουν τον τίτλο. */
  .ct-top{flex-wrap:wrap;gap:11px}
  .ct-acts{flex-direction:row;flex:1 1 100%}
  .ct-acts .btn{flex:1;justify-content:center}
  .ct-av-lg{width:46px;height:46px;font-size:15px}

  /* Φόρμα & καταχώρηση timeline: μία στήλη, κουμπί πλήρους πλάτους */
  .ct-2col,.ct-prow{grid-template-columns:1fr}
  .ct-noterow input,.ct-noterow select{flex:1 1 100%;min-width:0}
  .ct-noterow .btn{width:100%;justify-content:center}
}

/* ============================================================
   TABLET ΚΑΘΕΤΑ (601–900px) — αναλογίες topbar
   ------------------------------------------------------------
   Στο κινητό (≤600) η καρτέλα χρήστη απλώνει (flex:1 1 0%) και η
   αναζήτηση μαζεύεται σε φακό 44px, γιατί αλλιώς δεν χωρούν σε μία
   γραμμή. Σε tablet κάθετα (744/800/820/834) ο χώρος περισσεύει:
   η αναζήτηση γίνεται ΚΑΝΟΝΙΚΟ πεδίο και παίρνει ό,τι περισσεύει,
   η καρτέλα μαζεύεται στο περιεχόμενό της.
   Ισχύει και για κινητό ΟΡΙΖΟΝΤΙΑ (844×390) — εκεί επίσης χωράει.
   ============================================================ */
@media (min-width:601px) and (max-width:900px){
  /* Καρτέλα: όσο χρειάζεται, όχι όσο περισσεύει (το ellipsis μένει). */
  #topbar .user-chip{flex:0 1 auto;max-width:230px}

  /* Αναζήτηση: κανονικό πεδίο, μεγαλώνει με ό,τι περισσεύει. */
  #topbar .search{flex:1 1 0%;width:auto;min-width:120px;max-width:480px;height:46px}
  #topbar .search input{display:block}
  #topbar .search .sic{left:15px;right:auto;justify-content:flex-start;
    pointer-events:none;cursor:default;color:#98a0ad}

  /* Το .m-open (φακός → πλήρης γραμμή) δεν έχει νόημα εδώ: αν έμεινε από
     rotate σε στενότερο πλάτος, το εξουδετερώνουμε ώστε να μη σπάει γραμμή. */
  #topbar .search.m-open{order:2;flex:1 1 0%;width:auto;margin-top:0;height:46px}
}

/* ============================================================
   ΗΜΕΡΟΛΟΓΙΟ σε κινητό & tablet (≤900px)
   ------------------------------------------------------------
   Η ρίζα του «κόβονται οι μέρες» διορθώθηκε στο 15-calendar.css
   (minmax(0,1fr)). Εδώ κάνουμε το περιεχόμενο ΧΡΗΣΙΜΟ στο στενό
   πλέγμα: σε στήλη ~48px δεν χωράει κείμενο, σε ~100px χωράει.
   Ο μήνας πρέπει να χωράει ΟΛΟΚΛΗΡΟΣ, κάθετα και οριζόντια.
   ============================================================ */
@media (max-width:900px){
  .cal-toolbar{gap:7px;margin-bottom:10px}
  .cal-toolbar h2{min-width:0;flex:1 1 100%;font-size:15px}

  /* Εβδομάδα: 7 στήλες των 48px είναι άχρηστες → στοίβα καρτών. */
  .cal-week{grid-template-columns:1fr;gap:8px}
  .cal-wcol{min-height:0}

  .cal-dow{padding:6px 2px;font-size:10px}
  .cal-cell{padding:4px 2px;text-align:center}
  .cal-num{margin:0 auto 3px}
}

/* Κινητό (≤600): στήλη ~47px — ΚΟΥΚΚΙΔΕΣ αντί για κείμενο.
   Τα χρώματα των chips (task/note/rem/proj) μένουν, οπότε η κουκκίδα
   λέει ήδη το είδος· το tap στη μέρα ανοίγει την προβολή Ημέρας.
   Μόνο CSS — καμία αλλαγή στο dayChips(). */
@media (max-width:600px){
  .cal-cell{min-height:58px}
  .cal-num{width:20px;height:20px;font-size:11px}
  /* background:currentColor => η κουκκίδα παίρνει το ΧΡΩΜΑ ΚΕΙΜΕΝΟΥ κάθε τύπου
     (task/note/rem/proj), που είναι κορεσμένο — τα παστέλ φόντα των chips είναι
     αόρατα σε 7px. Μηδέν νέα χρώματα προς συντήρηση. */
  .cal-chip{display:inline-block;width:7px;height:7px;min-width:0;
    padding:0;margin:0 1.5px;border-radius:50%;font-size:0;line-height:0;
    vertical-align:middle;overflow:hidden;border:none}
  /* ΕΙΔΙΚΟΤΗΤΑ: το .cal-chip.task/.note/.rem/.proj είναι (0,2,0) και το media
     query ΔΕΝ προσθέτει ειδικότητα — χρειάζεται ίδιο βάρος + μεταγενέστερη θέση. */
  .cal-cell .cal-chip{background:currentColor}
  .cal-chip svg{display:none}
  .cal-more{font-size:8.5px;padding:0;line-height:1.3}
}

/* Tablet κάθετα (601–900): στήλη ~100px — χωράει κείμενο, φεύγει
   μόνο το εικονίδιο για να κερδίσουμε πλάτος. */
@media (min-width:601px) and (max-width:900px){
  .cal-cell{min-height:84px}
  .cal-chip{font-size:9.5px;padding:2px 4px}
  .cal-chip svg{display:none}
  .cal-more{font-size:9px}
}

/* Κεφαλίδα βάθους (μονοπάτι/λωρίδες): σε στενή οθόνη ο κάθε κρίκος κόβεται
   ώστε να μη σπάσει η γραμμή σε τρεις σειρές και φάει την κεφαλίδα. */
@media (max-width:600px){
  .modal-h.mh-lvl{padding-left:20px}
  .mh-spine i{width:4px}
  .mh-crumb{font-size:10px;gap:4px;flex-wrap:nowrap;overflow:hidden}
  .mh-crumb a{max-width:110px}
  .mh-lv{font-size:9.5px;padding:1px 7px}
}

/* «Η δουλειά μου σε αυτό το έργο»: ίδια έμφαση, μικρότερη κλίμακα */
@media (max-width:600px){
  .mw-head{padding:11px 12px;gap:10px}
  .mw-ic{width:32px;height:32px;border-radius:10px}
  .mw-ht b{font-size:13.5px}
  .mw-pct{font-size:19px}
  .mywork .task-row{padding:12px 12px 12px 15px}
  .mywork .task-row .tt{font-size:14px}
  .mywork .task-row .prog-wrap{width:auto}
}

/* Λίστα παρακολούθησης: σε στενή οθόνη η αναζήτηση πέφτει κάτω από τις
   καρτέλες σε όλο το πλάτος (στη δεξιά γωνία δεν χωράει). */
@media (max-width:600px){
  .wl-bar{gap:8px;padding:10px 12px 4px}
  .wl-find{flex:1 1 100%;margin-left:0;min-width:0}
  .wl-hit{padding-left:22px}
}

/* ---------- ΒΟΗΘΕΙΑ (κινητό) ---------- */
@media (max-width:900px){
  .hlp-hero{border-radius:14px;padding:24px 14px 20px}
  .hlp-hero h1{font-size:22px}
  .hlp-hero p{font-size:12.5px}
  .hlp-search{padding:11px 14px;border-radius:13px}
  .hlp-search input{font-size:16px}   /* <16px → ο iOS Safari κάνει zoom στο focus */
  .hlp-grid{grid-template-columns:1fr;gap:13px}
  .hlp-card .hlp-cover{aspect-ratio:2/1}
  .hlp-art h1{font-size:22px}
  .hlp-artcov .hlp-cover{height:140px}
  .hlp-body{font-size:15.5px;line-height:1.7}
  .hlp-body h2{font-size:17.5px;margin:24px 0 8px}
  .hlp-lead{font-size:14px}
  .hlp-row{padding:10px 8px}
  .hlp-row .ic{width:34px;height:34px}
}

/* =====================================================================
   ΠΛΑΤΟΣ DASHBOARD ΣΕ ΚΙΝΗΤΟ (Σεπ 2026)
   Η ρίζα (grid `1fr` → `minmax(0,1fr)`) διορθώθηκε στο 20-hero. Εδώ μένει το
   δεύτερο μισό: με τη στήλη να μπορεί πια να στενέψει, οι κεφαλίδες καρτών
   (flex, nowrap) θα ξεχείλιζαν μέσα στην κάρτα — τις αφήνουμε να τυλίγονται.
===================================================================== */
@media (max-width:900px){
  .dgrid,.dgrid>.stack,.dgrid .card,main>.card{min-width:0}
  .card-h{flex-wrap:wrap;row-gap:5px}
  .card-h>*{min-width:0}
}
@media (max-width:600px){
  /* Chips του hero: πλέγμα 2 στηλών με ΙΣΑ πλάτη αντί για «ό,τι χωρέσει» —
     το τελευταίο μονό πιάνει ολόκληρη τη γραμμή, καμία ραγισμένη σειρά. */
  .hkpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:13px}
  .hkpis>.hk{min-width:0;padding:9px 11px;gap:8px}
  .hkpis>.hk>div{min-width:0}
  .hkpis>.hk:last-child:nth-child(odd){grid-column:1/-1}
  .hki{width:28px;height:28px;border-radius:8px}
  .hkv{font-size:17px}
  .hkl{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hero .hactions{margin-left:0;width:100%}
}

/* =====================================================================
   ΣΤΟΙΧΕΙΑ TASK ΣΕ ΚΙΝΗΤΟ (Σεπ 2026)
   Το `.info-grid` έμενε 2 στηλών ακόμη και στα 390px, και το «Ανάθεση σε»
   είχε τα ονόματα σε inline `white-space:nowrap` → η πρώτη στήλη κλείδωνε
   στα 251px, η δεύτερη («Τμήμα», «Δημιουργήθηκε από») στα 121px, και το
   σώμα του popup σκρόλαρε οριζόντια. Μία στήλη + ονόματα που τυλίγονται.
===================================================================== */
@media (max-width:600px){
  .info-grid{grid-template-columns:minmax(0,1fr)}
  .info-cell .v{overflow-wrap:anywhere}
  .ig-p{white-space:normal}
}
/* =====================================================================
   GAMIFICATION — Ευχαριστώ / Μπράβο
   Μπράβο = πορτοκαλί (ταυτότητα task) · Ευχαριστώ = teal (ταυτότητα αναγκών)
===================================================================== */

/* ---- Μπλοκ στην καρτέλα ατόμου ---- */
.kd-box{margin-top:14px;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#fff}
.kd-box-h{display:flex;align-items:center;gap:7px;padding:9px 13px;font-size:11px;font-weight:800;
  letter-spacing:.5px;text-transform:uppercase;color:#7a3a12;background:linear-gradient(115deg,#fdeee6,#fdf3df)}
.kd-counts{display:flex;gap:10px;padding:12px 13px 4px}
.kd-load{font-size:12px;color:var(--muted)}
.kd-cnt{flex:1;border-radius:11px;padding:10px 12px;display:flex;flex-direction:column;gap:1px}
.kd-cnt .n{font-size:23px;font-weight:800;line-height:1}
.kd-cnt small{font-size:10.5px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;opacity:.8}
.kd-cb{background:#fdeee6;color:#9a3412}
.kd-ct{background:#d6f5f1;color:#0b6f66}
.kd-recent{padding:4px 13px 2px}
.kd-row{font-size:11.5px;line-height:1.55;color:#42506a;display:flex;align-items:baseline;gap:7px}
.kd-row b{color:var(--text)}
.kd-row i{color:var(--muted);font-style:italic}
.kd-dot{width:7px;height:7px;border-radius:50%;flex:none;transform:translateY(-1px)}
.kd-empty{font-size:11.5px;color:var(--muted);padding:2px 0 4px}
.kd-actions{display:flex;gap:8px;padding:11px 13px 13px}
.kd-actions .btn{flex:1;justify-content:center;border:none;color:#fff;font-weight:700}
.kd-b{background:linear-gradient(135deg,#9a3412,#f97316);box-shadow:0 2px 8px rgba(154,52,18,.28)}
.kd-t{background:linear-gradient(135deg,#0b6f66,#14b8a6);box-shadow:0 2px 8px rgba(11,111,102,.28)}
.kd-b:hover,.kd-t:hover{filter:brightness(1.07)}

/* ---- Popup αποστολής ---- */
.kd-pick{display:flex;gap:10px;margin-bottom:14px}
.kd-opt{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:11px 12px;
  border:1.5px solid var(--border);border-radius:12px;background:#fff;cursor:pointer;font-family:inherit;transition:.14s}
.kd-opt b{font-size:13px;color:var(--text)}
.kd-opt small{font-size:10.5px;color:var(--muted)}
.kd-opt .kd-ic{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:#fff;margin-bottom:5px}
.kd-opt:hover{border-color:#c9d2e0}
.kd-opt.on{border-color:#f97316;background:#fffaf6;box-shadow:0 0 0 3px rgba(249,115,22,.14)}
.kd-opt.on:nth-child(2){border-color:#14b8a6;background:#f4fffd;box-shadow:0 0 0 3px rgba(20,184,166,.14)}
.kd-lbl{display:block;font-size:11.5px;font-weight:700;color:#42506a;margin:0 0 6px}
.kd-hint{margin-top:10px;font-size:11px;line-height:1.5;color:var(--muted);display:flex;align-items:flex-start;gap:5px}
.kd-hint svg{flex:none;margin-top:2px}

/* ---- Γιορτή στο κέντρο της οθόνης ---- */
.kd-cel{position:fixed;inset:0;z-index:300;display:grid;place-items:center;pointer-events:none;
  background:radial-gradient(closest-side,rgba(15,23,40,.32),rgba(15,23,40,0) 72%);
  animation:kdCelIn .32s cubic-bezier(.2,.9,.25,1)}
.kd-cel.out{animation:kdCelOut .5s ease forwards}
.kd-cel-card{pointer-events:auto;cursor:pointer;background:#fff;border-radius:20px;padding:26px 34px 22px;
  text-align:center;box-shadow:0 26px 70px rgba(15,23,40,.4);border:1px solid rgba(255,255,255,.6);
  max-width:min(340px,86vw);animation:kdPop .5s cubic-bezier(.2,1.15,.3,1)}
.kd-cel-burst{width:74px;height:74px;border-radius:24px;margin:0 auto 13px;display:grid;place-items:center;color:#fff;
  box-shadow:0 10px 26px color-mix(in srgb,var(--kc) 45%,transparent);animation:kdBurst 2.4s ease-in-out infinite}
.kd-cel-t{font-size:23px;font-weight:800;color:var(--kc);line-height:1.1}
.kd-cel-s{font-size:13px;color:var(--muted);margin-top:5px}
.kd-cel-s b{color:var(--text)}
.kd-cel-n{margin-top:11px;font-size:12.5px;line-height:1.55;color:#42506a;background:var(--bg);
  border-radius:11px;padding:9px 12px;font-style:italic}
/* Η κάρτα ΜΕΝΕΙ μέχρι να την κλείσει ο χρήστης (✕ / κλικ έξω / Esc) */
.kd-cel-card{position:relative}
.kd-cel-x{position:absolute;top:9px;right:9px;width:28px;height:28px;border:none;border-radius:9px;
  background:var(--bg);color:var(--muted);cursor:pointer;display:grid;place-items:center;transition:.14s}
.kd-cel-x:hover{background:#e6eaf2;color:var(--text)}
@keyframes kdCelIn{from{opacity:0}to{opacity:1}}
@keyframes kdCelOut{from{opacity:1}to{opacity:0}}
@keyframes kdPop{0%{opacity:0;transform:scale(.7) translateY(14px)}60%{opacity:1;transform:scale(1.03)}100%{transform:none}}
@keyframes kdBurst{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.07) rotate(-4deg)}}
@media (prefers-reduced-motion: reduce){
  .kd-cel,.kd-cel-card,.kd-cel-burst{animation:none!important}
}

/* ---- Πάνελ ρυθμίσεων (God Mode → Gamification)· επαναχρησιμοποιεί τα .tr-* ---- */
.gm-badge{margin-left:auto;font-size:10.5px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;
  padding:3px 10px;border-radius:999px;background:var(--green-soft);color:#12603a;border:1px solid #a9e0c1}
.gm-badge.off{background:#eef1f6;color:#66738a;border-color:var(--border)}
.gm-matrix{width:100%;border-collapse:collapse;font-size:11.5px;margin-top:8px;background:#fff;
  border:1px solid var(--border);border-radius:10px;overflow:hidden}
.gm-matrix th,.gm-matrix td{padding:7px 10px;text-align:left;border-bottom:1px solid var(--border)}
.gm-matrix th{background:var(--bg);font-weight:800;color:#42506a;font-size:10.5px;text-transform:uppercase;letter-spacing:.4px}
.gm-matrix tr:last-child td{border-bottom:none}
.gm-yes{color:#12603a;font-weight:700}
.gm-no{color:var(--muted)}

/* ---- Ειδοποίηση kudos ---- */
.notif .ic.kudos{background:#fdeee6;color:#c2410c}

@media (max-width:600px){
  .kd-pick{flex-direction:column}
  .kd-counts{flex-direction:row}
  .kd-actions{flex-direction:column}
  .kd-cel-card{padding:22px 24px 18px}
  .kd-cel-burst{width:64px;height:64px;border-radius:20px}
  .kd-cel-t{font-size:20px}
}

/* Ετικέτα δίπλα στα sliders ορίων */
.kd-lim-l{flex:none;min-width:76px;font-size:12px;font-weight:700;color:#42506a}

/* Πρόσκληση αναγνώρισης όταν οι μετρητές είναι κρυμμένοι για τους άλλους */
.kd-promo{display:flex;align-items:flex-start;gap:9px;padding:13px 13px 4px;
  font-size:12.5px;line-height:1.55;color:#42506a}
.kd-promo svg{flex:none;margin-top:1px;color:#c2410c}
.kd-promo b{color:var(--text)}

/* =====================================================================
   ΟΡΟΣΗΜΑ — μετάλλια με βαθμίδα, λάμψη και κλείδωμα
===================================================================== */
.kd-cnt{border:none;font-family:inherit;text-align:left;cursor:pointer;transition:.14s;position:relative}
.kd-cnt:hover{transform:translateY(-2px);filter:brightness(1.03);box-shadow:0 4px 14px rgba(21,36,59,.14)}
.kd-cm{background:linear-gradient(140deg,#f3ecff,#ede9fe);color:#5b21b6}

.ms-head{background:linear-gradient(120deg,#4c1d95,#7c3aed 50%,#c026d3 130%);color:#fff;border-bottom:none}
.ms-sec{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;letter-spacing:.5px;
  text-transform:uppercase;color:#5b21b6;margin:16px 0 10px}
.ms-sec .cnt{background:#f3ecff;color:#5b21b6;border:1px solid #ddd0fb}
.ms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:12px}

.ms-badge{border:1px solid var(--border);border-radius:14px;padding:14px 11px 11px;text-align:center;
  background:#fff;transition:.16s}
.ms-badge.earned{border-color:var(--mr);box-shadow:0 3px 14px color-mix(in srgb,var(--mr) 24%,transparent)}
.ms-badge.earned:hover{transform:translateY(-3px);box-shadow:0 8px 24px color-mix(in srgb,var(--mr) 34%,transparent)}
.ms-badge.locked{background:#fbfcfe;border-style:dashed}

/* Το μετάλλιο: εξάγωνο με βάθος, εσωτερικό δαχτυλίδι και λάμψη που περνά */
.ms-medal{width:62px;height:62px;margin:0 auto 9px;position:relative;display:grid;place-items:center;
  border-radius:19px;color:#fff;overflow:hidden;
  background:var(--mg,linear-gradient(140deg,#94a3b8,#e2e8f0));
  box-shadow:0 6px 18px color-mix(in srgb,var(--mr,#94a3b8) 42%,transparent),
             inset 0 2px 0 rgba(255,255,255,.55), inset 0 -3px 8px rgba(0,0,0,.18)}
.ms-medal::after{content:"";position:absolute;inset:5px;border-radius:14px;
  border:1.5px solid rgba(255,255,255,.4);pointer-events:none}
.ms-medal svg{position:relative;z-index:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.28))}
.ms-shine{position:absolute;top:-60%;left:-120%;width:60%;height:220%;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);
  transform:rotate(22deg);animation:msShine 4.5s ease-in-out infinite}
@keyframes msShine{0%,72%{left:-120%}88%,100%{left:150%}}

.ms-badge.locked .ms-medal{background:#e6eaf2;color:#9aa6bb;box-shadow:inset 0 2px 0 rgba(255,255,255,.6)}
.ms-lock{position:absolute;right:-2px;bottom:-2px;width:22px;height:22px;border-radius:50%;
  background:#fff;color:#8894ab;display:grid;place-items:center;box-shadow:0 2px 6px rgba(21,36,59,.22)}
.ms-t{font-size:12.5px;font-weight:800;color:var(--text);line-height:1.25}
.ms-badge.earned .ms-t{color:var(--mc)}
.ms-d{font-size:10.5px;color:var(--muted);line-height:1.4;margin-top:3px;min-height:29px}
.ms-when{font-size:10px;font-weight:700;color:var(--muted);margin-top:6px}
.ms-prog{height:5px;background:#e9edf3;border-radius:3px;overflow:hidden;margin-top:8px}
.ms-prog i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#a78bfa,#7c3aed)}
.ms-note{margin-top:16px;background:#f3ecff;border:1px solid #ddd0fb;border-radius:10px;padding:10px 12px;
  font-size:11.5px;line-height:1.55;color:#4c1d95}

/* ---- Αναλυτική λίστα αναγνωρίσεων ---- */
.kd-tabs{margin-bottom:12px}
.kdv-cnt{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:8px}
.kdv-row{display:flex;align-items:flex-start;gap:10px;padding:10px 2px;border-bottom:1px solid var(--border)}
.kdv-row:last-child{border-bottom:none}
.kdv-ic{width:28px;height:28px;border-radius:9px;flex:none;display:grid;place-items:center;color:#fff}
.kdv-main{flex:1;min-width:0}
.kdv-who{font-size:12.5px;display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.kdv-dept{font-size:10.5px;color:var(--muted)}
.kdv-note{font-size:11.5px;line-height:1.5;color:#42506a;font-style:italic;margin-top:2px}
.kdv-note.muted{color:#9aa6bb;font-style:normal}
.kdv-meta{flex:none;text-align:right;font-size:10.5px;line-height:1.5}
.kdv-meta b{display:block;font-size:11px}
.kdv-meta span{color:var(--muted)}

/* ---- Γιορτή ορόσημου: πιο μεγαλειώδης από την απλή αναγνώριση ---- */
.ms-cel-card{--kc:var(--mc);padding:30px 34px 24px;max-width:min(380px,88vw);overflow:hidden}
.ms-rays{position:absolute;inset:-40%;pointer-events:none;opacity:.16;
  background:repeating-conic-gradient(from 0deg, var(--mr) 0deg 8deg, transparent 8deg 20deg);
  animation:msSpin 22s linear infinite}
@keyframes msSpin{to{transform:rotate(360deg)}}
.ms-cel-medal{position:relative;z-index:1;width:96px;height:96px;margin:0 auto 15px;border-radius:28px;
  display:grid;place-items:center;color:#fff;overflow:hidden;background:var(--mg);
  box-shadow:0 14px 34px color-mix(in srgb,var(--mr) 48%,transparent),
             inset 0 3px 0 rgba(255,255,255,.55), inset 0 -4px 10px rgba(0,0,0,.2);
  animation:msPulse 2.6s ease-in-out infinite}
.ms-cel-medal::after{content:"";position:absolute;inset:7px;border-radius:21px;border:2px solid rgba(255,255,255,.42)}
@keyframes msPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
.ms-cel-k{position:relative;z-index:1;font-size:10.5px;font-weight:800;letter-spacing:1.2px;
  text-transform:uppercase;color:var(--mr)}
.ms-cel-t{position:relative;z-index:1;font-size:25px;font-weight:800;color:var(--mc);line-height:1.15;margin-top:4px}
.ms-cel-d{position:relative;z-index:1;font-size:12.5px;color:var(--muted);margin-top:7px;line-height:1.5}
.ms-cel-tier{position:relative;z-index:1;display:inline-block;margin-top:13px;padding:4px 14px;border-radius:999px;
  font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:#fff;background:var(--mg);
  box-shadow:0 3px 10px color-mix(in srgb,var(--mr) 40%,transparent)}

/* ---- Ειδοποίηση ορόσημου ---- */
.notif .ic.milestone{background:#f3ecff;color:#7c3aed}

@media (prefers-reduced-motion: reduce){
  .ms-shine,.ms-rays,.ms-cel-medal{animation:none!important}
}
@media (max-width:600px){
  .ms-grid{grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px}
  .ms-medal{width:54px;height:54px;border-radius:17px}
  .ms-cel-medal{width:82px;height:82px;border-radius:24px}
  .ms-cel-t{font-size:21px}
  .kdv-meta{text-align:left}
}

/* Υπόδειξη ότι η κάρτα γιορτής είναι κλικαρίσιμη → ανοίγει την αναλυτική προβολή */
.kd-cel-more,.ms-cel-more{position:relative;z-index:1;margin-top:14px;padding-top:12px;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;gap:5px;
  font-size:11.5px;font-weight:700;opacity:.75}
.kd-cel-more{color:var(--kc)}
.ms-cel-more{color:var(--mr)}
.kd-cel-card{cursor:pointer}
.kd-cel-card:hover .kd-cel-more,.ms-cel-card:hover .ms-cel-more{opacity:1}
.ms-cel-card:hover .ms-cel-more{color:var(--mc)}
/* =====================================================================
   TRANSITIONS — άνοιγμα/κλείσιμο popups & πάνελ (στιλ iOS)
   ---------------------------------------------------------------------
   ΜΙΑ πηγή αλήθειας: οι CSS μεταβλητές παρακάτω. Κάθε animation τις
   διαβάζει, οπότε η αλλαγή ρύθμισης = setProperty στο :root — κανένα
   re-render, κανένα module δεν ξέρει ότι υπάρχει ρύθμιση.
   Οι κλάσεις τις βάζει το 38-transitions.js στα roots:
     .tr-enter   → μπήκε ΝΕΟ περιεχόμενο σε άδειο root (άνοιγμα)
     .tr-closing → φεύγει (το JS καθαρίζει το DOM μετά από --tr-out)
   Το `.tr-enter` υπάρχει επειδή πολλά popup κάνουν re-render στον εαυτό
   τους (π.χ. renderCardModal σε κάθε checkbox) — χωρίς αυτό το animation
   θα ξανάπαιζε σε κάθε κλικ.
   ΜΟΝΟ transform/opacity → GPU, μηδέν layout, μηδέν κόστος.
===================================================================== */
:root{
  --tr-in:260ms;            /* διάρκεια ανοίγματος */
  --tr-out:170ms;           /* κλείσιμο: πιο γρήγορο = αίσθηση απόκρισης */
  --tr-ein:cubic-bezier(.32,.72,0,1);   /* ξεκινά γρήγορα, «κάθεται» απαλά */
  --tr-eout:cubic-bezier(.4,0,1,1);
  --tr-lift:14px;           /* μετατόπιση εισόδου */
  --tr-scale:.965;          /* κλίμακα εισόδου */
  --tr-lift-o:8px;
  --tr-scale-o:.985;
}

@keyframes trOvIn{from{opacity:0}to{opacity:1}}
@keyframes trOvOut{from{opacity:1}to{opacity:0}}
@keyframes trWinIn{from{opacity:0;transform:translateY(var(--tr-lift)) scale(var(--tr-scale))}
  to{opacity:1;transform:none}}
@keyframes trWinOut{from{opacity:1;transform:none}
  to{opacity:0;transform:translateY(var(--tr-lift-o)) scale(var(--tr-scale-o))}}

/* ---- ΚΡΙΣΙΜΟ: μηδενισμός των base animations των modules ----
   Το `.ai-win`/`.ai-ov` (33-ai), το `.wp-ov` (06-κειμενογράφος) και το
   `.ov2` (27-επαφές) έχουν ΔΙΚΟ ΤΟΥΣ `animation` στη βάση τους. Όσο υπάρχει
   το `.tr-enter` υπερισχύει ο δικός μας κανόνας — μόλις όμως αφαιρεθεί, το
   `animation-name` ΕΠΙΣΤΡΕΦΕΙ στο δικό τους και ο browser ΞΑΝΑΤΡΕΧΕΙ την
   κίνηση: δεύτερη «είσοδος» ~340ms μετά το άνοιγμα (το «refresh» του Ai και
   των popup 2ου επιπέδου). Τα μηδενίζουμε — την είσοδο την κάνει το tr-enter. */
.ai-ov,.ai-win,.wp-ov,.overlay.ov2{animation:none}

/* ---- Άνοιγμα (μόνο όταν το root ήταν άδειο) ---- */
.tr-enter>.overlay,.tr-enter>.ai-ov,.tr-enter>.wp-ov{animation:trOvIn var(--tr-in) ease}
.tr-enter>.overlay>.modal,.tr-enter>.ai-ov>.ai-win,.tr-enter>.wp-ov>.wp{
  animation:trWinIn var(--tr-in) var(--tr-ein)}

/* ---- «Δεύτερη ανανέωση» στο ΑΝΟΙΓΜΑ — ΔΙΟΡΘΩΣΗ ----
   Πολλά popup έχουν δικά τους transitions που ξεκινούν τη στιγμή που
   προσαρτώνται και «έπαιζαν» πάνω στο animation εισόδου, σαν δεύτερο render:
     · `.modal{transition:width .22s, max-height .22s}` (19-modal) — τα
       ctRender/fdRender/fitTaskModal ορίζουν μέγεθος με JS, και όταν το
       περιεχόμενο γεμίζει (π.χ. lazy λίστες σε rAF) το παράθυρο «πηδούσε».
     · `.ai-sugbar{transition:max-height .24s}` (33-ai) — η μπάρα έτοιμων
       ερωτήσεων ξεδιπλωνόταν αμέσως μετά την εμφάνιση του βοηθού Ai.
   Όσο διαρκεί η είσοδος: ΚΑΝΕΝΑ transition μέσα στο παράθυρο. Μετά, όλα
   επανέρχονται κανονικά. */
.tr-enter>.overlay>.modal,.tr-enter>.ai-ov>.ai-win,.tr-enter>.wp-ov>.wp,
.tr-enter>.overlay>.modal *,.tr-enter>.ai-ov>.ai-win *,.tr-enter>.wp-ov>.wp *{
  transition:none!important}

/* ---- Κλείσιμο (το JS κρατά το DOM μέχρι να τελειώσει) ---- */
.tr-closing>.overlay,.tr-closing>.ai-ov,.tr-closing>.wp-ov{
  animation:trOvOut var(--tr-out) ease forwards;pointer-events:none}
.tr-closing>.overlay>.modal,.tr-closing>.ai-ov>.ai-win,.tr-closing>.wp-ov>.wp{
  animation:trWinOut var(--tr-out) var(--tr-eout) forwards}

/* ---- Στιλ «άνοιγμα από το σημείο αφής» ----
   Καθαρό scale με transform-origin στο σημείο του κλικ. Οι --tr-ox/--tr-oy
   μπαίνουν από το JS στο ROOT και κληρονομούνται (custom properties), οπότε
   επιβιώνουν των re-render και ισχύουν και στο κλείσιμο: το παράθυρο μαζεύεται
   πίσω εκεί απ' όπου άνοιξε. Χωρίς κλικ → fallback 50% 50% (κέντρο). */
/* ΔΥΟ ξεχωριστές animations (κλίμακα + διαφάνεια) αντί για μία με ενδιάμεσο
   keyframe: έτσι η καμπύλη της κλίμακας μένει ΚΑΘΑΡΗ (ένα keyframe στη μέση
   θα την έσπαγε σε δύο τμήματα) και η διαφάνεια προλαβαίνει να κλείσει στο
   ~42% → βλέπεις το παράθυρο να ΜΕΓΑΛΩΝΕΙ αντί απλώς να εμφανίζεται. */
@keyframes trZoomIn{from{transform:scale(var(--tr-scale))}to{transform:none}}
@keyframes trZoomOut{from{transform:none}to{transform:scale(var(--tr-scale-o))}}
@keyframes trFadeIn{from{opacity:0}to{opacity:1}}
@keyframes trFadeOut{from{opacity:1}to{opacity:0}}
body.tr-st-origin .tr-enter>.overlay>.modal,
body.tr-st-origin .tr-enter>.ai-ov>.ai-win,
body.tr-st-origin .tr-enter>.wp-ov>.wp{
  transform-origin:var(--tr-ox,50%) var(--tr-oy,50%);
  will-change:transform,opacity;
  animation:trZoomIn var(--tr-in) var(--tr-ein) both,
            trFadeIn calc(var(--tr-in) * 0.42) ease-out both}
body.tr-st-origin .tr-closing>.overlay>.modal,
body.tr-st-origin .tr-closing>.ai-ov>.ai-win,
body.tr-st-origin .tr-closing>.wp-ov>.wp{
  transform-origin:var(--tr-ox,50%) var(--tr-oy,50%);
  animation:trZoomOut var(--tr-out) var(--tr-eout) both,
            trFadeOut var(--tr-out) ease-in both}
/* Το σκούρο φόντο μπαίνει ΠΙΟ ΑΡΓΑ από το παράθυρο: η διαδρομή φαίνεται
   πάνω στη φωτεινή σελίδα αντί να «χάνεται» μέσα στο σκοτάδι. */
body.tr-st-origin .tr-enter>.overlay{animation-duration:calc(var(--tr-in) * 1.15)}
/* Σε κινητό ΠΟΤΕ origin-zoom (το JS ήδη γυρίζει σε «φύλλο» — δικλείδα ασφαλείας) */
@media (max-width:900px){
  body.tr-st-origin .tr-enter>.overlay>.modal,body.tr-st-origin .tr-closing>.overlay>.modal{
    transform-origin:center;animation-name:trWinIn}
  body.tr-st-origin .tr-closing>.overlay>.modal{animation-name:trWinOut}
}

/* ---- Spotlight: ίδια καμπύλη με τα υπόλοιπα (αντικαθιστά το spotIn) ---- */
.spot-ov{animation:trOvIn var(--tr-in) ease}
.spot-box{animation:trWinIn var(--tr-in) var(--tr-ein)}

/* ---- Πάνελ που ζουν πάντα στο DOM: transition, όχι animation ----
   ΠΡΟΣΟΧΗ: μόνο `transform` — το σκέτο `transition:.22s` του 17-chat-panel
   κινούσε ΚΑΘΕ ιδιότητα (top/width), που σε mobile προκαλεί layout jank. */
#chatPanel{transition:transform var(--tr-in) var(--tr-ein)}
aside.sidebar-wrap{transition:transform var(--tr-in) var(--tr-ein)}
.m-nav-ov{transition:opacity var(--tr-in) ease}
.m-sheet{animation:mSheetUp var(--tr-in) var(--tr-ein)}
#notifDrop.open{animation:trWinIn var(--tr-in) var(--tr-ein)}

/* ---- Καθολικός διακόπτης (God Mode) + σεβασμός της συσκευής ----
   Το `prefers-reduced-motion` υπερισχύει ΠΑΝΤΑ της ρύθμισης — χρήστες με
   ευαισθησία στην κίνηση δεν πρέπει να εξαρτώνται από τον διαχειριστή. */
body.tr-off .tr-enter>.overlay,body.tr-off .tr-enter>.ai-ov,body.tr-off .tr-enter>.wp-ov,
body.tr-off .tr-enter>.overlay>.modal,body.tr-off .tr-enter>.ai-ov>.ai-win,body.tr-off .tr-enter>.wp-ov>.wp,
body.tr-off .spot-ov,body.tr-off .spot-box,body.tr-off #notifDrop.open,body.tr-off .m-sheet{animation:none}
body.tr-off #chatPanel,body.tr-off aside.sidebar-wrap,body.tr-off .m-nav-ov{transition:none}

/* =====================================================================
   «Μικρή ανανέωση» μετά το κλείσιμο — ΔΙΟΡΘΩΣΗ
   ---------------------------------------------------------------------
   Το closeModal() καλεί renderMain(), και το 20-hero έβαζε `animation:rise`
   σε ΚΑΘΕ hero/κάρτα — άρα όλο το περιεχόμενο «ξαναέμπαινε» σε κάθε
   re-render. Πριν ήταν αόρατο (γινόταν την ίδια στιγμή με το ακαριαίο
   κλείσιμο)· με το animated κλείσιμο τρέχει ~200ms αργότερα και φαίνεται
   σαν refresh της σελίδας.
   ΛΥΣΗ: η είσοδος περιεχομένου παίζει ΜΟΝΟ όταν αλλάζει όντως το view
   (κλάση `main-fresh`, την βάζει το 38-transitions πάνω στο renderMain).
   Ίδια φιλοσοφία με το υπάρχον `body.rt-quiet` των realtime ενημερώσεων.
===================================================================== */
.hero,.dgrid>.stack>*,#main>.card,.dept-grid>*,.ev-card{animation:none}

/* =====================================================================
   ΕΦΕ ΠΛΟΗΓΗΣΗΣ (πλαϊνό μενού → full-screen οθόνες)
   ---------------------------------------------------------------------
   Παίζει ΜΟΝΟ όταν αλλάζει το state.view (κλάση `main-fresh`) — δηλαδή σε
   πραγματική πλοήγηση, ΟΧΙ σε εναλλαγή tab, live search ή realtime.
   Στιλ = κλάση `nv-*` στο body· παράμετροι = μεταβλητές `--nv-*`.
   Μόνο είσοδος: το renderMain αντικαθιστά το innerHTML ακαριαία, οπότε
   δεν υπάρχει «παλιά» οθόνη για να βγει — όπως και στο rise που υπήρχε.
===================================================================== */
:root{--nv-dur:340ms;--nv-ease:cubic-bezier(.32,.72,0,1);--nv-dx:34px;--nv-dy:18px;--nv-scale:.97;--nv-step:45ms}
@keyframes nvFade{from{opacity:0}to{opacity:1}}
@keyframes nvSlide{from{opacity:0;transform:translateX(var(--nv-dx))}to{opacity:1;transform:none}}
@keyframes nvUp{from{opacity:0;transform:translateY(var(--nv-dy))}to{opacity:1;transform:none}}
@keyframes nvZoom{from{opacity:0;transform:scale(var(--nv-scale))}to{opacity:1;transform:none}}

/* Ενιαία οθόνη: όλο το περιεχόμενο μπαίνει σαν ένα σώμα */
body:not(.nv-stagger) #main.main-fresh>*{animation:nvFade var(--nv-dur) var(--nv-ease) both}
body.nv-slide #main.main-fresh>*{animation-name:nvSlide}
body.nv-up    #main.main-fresh>*{animation-name:nvUp}
body.nv-zoom  #main.main-fresh>*{animation-name:nvZoom}
body.nv-none  #main.main-fresh>*{animation:none}

/* Διαδοχικά: hero πρώτα, μετά οι κάρτες μία-μία (η παλιά συμπεριφορά «rise»,
   αλλά σε σειρά). ΔΕΝ animate-άρουμε τα layout containers (.dgrid) — θα
   ξεθώριαζαν δύο φορές τα παιδιά τους. */
body.nv-stagger #main.main-fresh .hero,
body.nv-stagger #main.main-fresh .page-hero,
body.nv-stagger #main.main-fresh .page-head,
body.nv-stagger #main.main-fresh>.card,
body.nv-stagger #main.main-fresh .dgrid>.stack>*,
body.nv-stagger #main.main-fresh .dept-grid>*{animation:nvUp var(--nv-dur) var(--nv-ease) both}
body.nv-stagger #main.main-fresh .dgrid>.stack>*:nth-child(2),
body.nv-stagger #main.main-fresh .dept-grid>*:nth-child(2){animation-delay:calc(var(--nv-step)*1)}
body.nv-stagger #main.main-fresh .dgrid>.stack>*:nth-child(3),
body.nv-stagger #main.main-fresh .dept-grid>*:nth-child(3){animation-delay:calc(var(--nv-step)*2)}
body.nv-stagger #main.main-fresh .dgrid>.stack>*:nth-child(4),
body.nv-stagger #main.main-fresh .dept-grid>*:nth-child(4){animation-delay:calc(var(--nv-step)*3)}
body.nv-stagger #main.main-fresh .dgrid>.stack>*:nth-child(5),
body.nv-stagger #main.main-fresh .dept-grid>*:nth-child(5){animation-delay:calc(var(--nv-step)*4)}
body.nv-stagger #main.main-fresh .dgrid>.stack>*:nth-child(n+6),
body.nv-stagger #main.main-fresh .dept-grid>*:nth-child(n+6){animation-delay:calc(var(--nv-step)*5)}
body.nv-stagger #main.main-fresh .dgrid>.dg-wide{animation:nvUp var(--nv-dur) var(--nv-ease) both;
  animation-delay:calc(var(--nv-step)*2)}
#main.main-fresh .ev-card{animation:evIn var(--nv-dur) var(--nv-ease) both}

/* Ο κύριος διακόπτης & το realtime «ησυχία» σβήνουν και την πλοήγηση */
body.tr-off #main.main-fresh>*,body.tr-off #main.main-fresh .dgrid>.stack>*,
body.tr-off #main.main-fresh .dgrid>.dg-wide,
body.tr-off #main.main-fresh .hero,body.tr-off #main.main-fresh .page-hero,
body.tr-off #main.main-fresh .dept-grid>*,body.tr-off #main.main-fresh .ev-card{animation:none}

/* =====================================================================
   Πάνελ ρυθμίσεων (God Mode → «Εμφάνιση & Κίνηση»)
===================================================================== */
.tr-set{padding:6px 16px 16px}
.tr-row{display:flex;align-items:center;gap:14px;padding:13px 0;border-top:1px solid var(--border)}
.tr-row:first-child{border-top:none}
.tr-row.tr-col{flex-direction:column;align-items:stretch;gap:9px}
.tr-lbl b{display:block;font-size:13px;color:var(--text)}
.tr-lbl small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.tr-master .tr-lbl{flex:1;min-width:0}
.tr-body.tr-dim{opacity:.45;pointer-events:none}

/* Διακόπτης */
.tr-sw{flex:none;width:48px;height:28px;border-radius:999px;border:none;cursor:pointer;
  background:#c9d2e0;position:relative;transition:background .2s;padding:0}
.tr-sw i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(21,36,59,.35);transition:transform .2s}
.tr-sw.on{background:#6d28d9}
.tr-sw.on i{transform:translateX(20px)}

/* Sliders — εύρος 60ms έως 1500ms */
.tr-slide{display:flex;align-items:center;gap:12px}
.tr-slide input[type=range]{flex:1;accent-color:#6d28d9;min-width:0}
.tr-val{flex:none;min-width:74px;text-align:right;font-size:13px;font-weight:800;color:#5b21b6;
  font-variant-numeric:tabular-nums}

/* Έτοιμοι συνδυασμοί */
.tr-pres{display:flex;flex-wrap:wrap;gap:7px}
.tr-pre{border:1.5px solid var(--border);background:#fff;border-radius:999px;padding:6px 13px;
  font-size:12px;font-weight:700;color:var(--muted);cursor:pointer;font-family:inherit;transition:.12s}
.tr-pre:hover{border-color:#c4b5fd;color:#5b21b6}
.tr-pre.on{border-color:#6d28d9;background:#f3ecff;color:#5b21b6}

.tr-sel{border:1.5px solid var(--border);border-radius:10px;padding:9px 11px;font-size:13px;
  background:#fff;font-family:inherit;color:var(--text);cursor:pointer;outline:none;min-width:210px}
.tr-sel:focus{border-color:#6d28d9;box-shadow:0 0 0 3px rgba(109,40,217,.15)}

.tr-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:14px;border-top:1px solid var(--border);margin-top:4px}
.tr-note{margin-top:11px;background:#f3ecff;border:1px solid #ddd0fb;border-radius:10px;padding:10px 12px;
  font-size:11.5px;line-height:1.55;color:#4c1d95}
.tr-warn{background:var(--amber-soft);border:1px solid #f0d79a;border-radius:10px;padding:10px 12px;
  font-size:11.5px;line-height:1.55;color:#8a5a06;margin:10px 0 2px}
@media (max-width:600px){
  .tr-set{padding:4px 12px 14px}
  .tr-row{gap:10px}
  .tr-sel{min-width:0;width:100%}
  .tr-acts .btn{flex:1 1 auto;justify-content:center}
  .tr-acts .btn-primary{margin-left:0!important;flex:1 1 100%}
}

@media (prefers-reduced-motion: reduce){
  .tr-enter>.overlay,.tr-enter>.ai-ov,.tr-enter>.wp-ov,
  .tr-enter>.overlay>.modal,.tr-enter>.ai-ov>.ai-win,.tr-enter>.wp-ov>.wp,
  .tr-closing>.overlay,.tr-closing>.ai-ov,.tr-closing>.wp-ov,
  .tr-closing>.overlay>.modal,.tr-closing>.ai-ov>.ai-win,.tr-closing>.wp-ov>.wp,
  .spot-ov,.spot-box,#notifDrop.open,.m-sheet,.ev-card,.au-drill,
  #main.main-fresh>*,#main.main-fresh .dgrid>.stack>*,#main.main-fresh .hero,
  #main.main-fresh .page-hero,#main.main-fresh .dept-grid>*{animation:none!important}
  #chatPanel,aside.sidebar-wrap,.m-nav-ov,.kb-card,.prj-card{transition:none!important}
}

/* Υπότιτλος ενότητας μέσα στο πάνελ ρυθμίσεων */
.tr-sub{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;letter-spacing:.5px;
  text-transform:uppercase;color:#6d28d9;background:#f3ecff;border:1px solid #ddd0fb;border-radius:9px;
  padding:7px 11px;margin:14px 0 2px}
.tr-sub:first-child{margin-top:4px}
.tr-sub svg{flex:none}
/* =====================================================================
   ΕΦΕ ΣΥΝΔΕΣΗΣ — «διάφραγμα» + συναρμολόγηση χώρου εργασίας
   ---------------------------------------------------------------------
   Τρεις πράξεις:
     1. Η κάρτα σύνδεσης ρουφιέται μέσα στο λογότυπο (liSink).
     2. Όσο τρέχει το loadAll(), το σήμα πάλλεται — ο χρόνος αναμονής
        ΚΑΛΥΠΤΕΤΑΙ, δεν επιμηκύνεται. Το «Φόρτωση δεδομένων…» card του
        22-supabase κρύβεται (body.li-run) αντί να αφαιρεθεί: μηδενική
        παρέμβαση στη ροή σύνδεσης.
     3. Μόλις έρθουν τα δεδομένα, το σκούρο πέπλο κλείνει σαν διάφραγμα
        φωτογραφικής ΠΑΝΩ ΣΤΟ ΛΟΓΟΤΥΠΟ (liIris) και ταυτόχρονα η
        εφαρμογή συναρμολογείται: μενού από αριστερά, μπάρα από πάνω,
        κάρτες με σκάλα (body.li-asm).
   Παράμετροι: μεταβλητές --li-* που γράφει το 40-login-transition.js.
   ΠΑΓΙΔΑ clip-path: δεν είναι GPU-composited. Αν λείπει υποστήριξη, το
   JS βάζει .li-nofx και πέφτουμε σε καθαρό ξεθώριασμα.
===================================================================== */
:root{--li-dur:1800ms;--li-sink:760ms;--li-step:60ms;
  --li-e:cubic-bezier(.32,.72,0,1);--li-z:1}

/* ΚΕΝΤΡΟ ΟΘΟΝΗΣ ΠΑΝΤΑ: το σήμα κεντράρεται με grid (όχι με συντεταγμένες από
   JS) και το διάφραγμα κλείνει στο 50%/50%. Έτσι είναι σωστό σε κάθε ανάλυση,
   σε rotate, σε αλλαγή zoom — χωρίς κανέναν υπολογισμό. 75vmax καλύπτει σίγουρα
   την οθόνη (η μισή διαγώνιος δεν ξεπερνά ποτέ ~71vmax). */
/* Το πέπλο μπαίνει στο <html>, ΕΞΩ από το <body> → δεν κληρονομεί τη γραμματοσειρά του (έβγαινε serif) */
.li-veil{position:fixed;inset:0;z-index:500;overflow:hidden;font-family:"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  display:grid;place-items:center;
  background:linear-gradient(115deg,#141f35,#1d3050 55%,#3d2b73);
  clip-path:circle(75vmax at 50% 50%)}
/* Το πέπλο κουμαντάρει την οθόνη — καμία αλληλεπίδραση με ό,τι είναι από κάτω */
body.li-run{overflow:hidden}
body.li-run #loginRoot{opacity:0;pointer-events:none}

/* Η κάρτα που μεταφέρθηκε μέσα στο πέπλο: κρατά τη ΘΕΣΗ που είχε */
.li-veil .login-card{position:absolute;margin:0;animation:liSink var(--li-sink) cubic-bezier(.4,0,1,1) both}
@keyframes liSink{
  from{transform:scale(var(--li-z));opacity:1}
  to{transform:scale(calc(var(--li-z)*.28));opacity:0}
}

/* Το σήμα φόρτωσης: λογότυπο εφαρμογής + «Φόρτωση δεδομένων…», στο κέντρο */
.li-mark{position:relative;display:flex;align-items:center;gap:14px;max-width:90vw;
  animation:liMarkIn calc(var(--li-sink)*.7) ease calc(var(--li-sink)*.55) both}
.li-mark .li-ic{position:relative;flex:none;width:54px;height:54px;border-radius:15px;background:#fff;
  display:grid;place-items:center;padding:5px;box-shadow:0 8px 26px rgba(0,0,0,.35);
  animation:liBreathe 1.9s ease-in-out .9s infinite}
/* Ίδια απόδοση με το πλαϊνό μενού (04-layout): contain + padding, ΟΧΙ cover —
   το λογότυπο δεν είναι τετράγωνο και το cover θα του έκοβε τις άκρες. */
.li-mark .li-ic img{width:100%;height:100%;object-fit:contain;display:block}
.li-mark .li-ic svg{color:var(--accent)}
.li-mark .li-txt{min-width:0;text-align:left}
.li-mark .li-txt b{display:block;font-size:14.5px;font-weight:600;color:#fff;letter-spacing:.2px}
.li-mark .li-txt small{display:block;font-size:11px;color:rgba(255,255,255,.55);margin-top:3px;letter-spacing:.6px}
.li-mark .li-ring{position:absolute;left:0;top:0;width:54px;height:54px;border-radius:15px;
  border:2px solid rgba(232,98,45,.6);opacity:0;pointer-events:none}
@keyframes liMarkIn{from{opacity:0;transform:translateY(10px) scale(.8)}to{opacity:1;transform:none}}
@keyframes liBreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}

/* ---------- Η αποκάλυψη ---------- */
.li-veil.li-go{animation:liIris calc(var(--li-dur)*.78) cubic-bezier(.5,0,.15,1) both}
@keyframes liIris{
  from{clip-path:circle(75vmax at 50% 50%)}
  to{clip-path:circle(0px at 50% 50%)}
}
/* Λάμψη τη στιγμή που ξεκινά το διάφραγμα */
.li-veil.li-go .li-mark{animation:none}
.li-veil.li-go .li-txt{animation:liTxtOut 300ms ease both}
.li-veil.li-go .li-ring{animation:liFlash calc(var(--li-dur)*.32) cubic-bezier(.2,.9,.25,1) both}
.li-veil.li-go .li-ic{animation:liPop calc(var(--li-dur)*.32) cubic-bezier(.2,.9,.25,1) both}
@keyframes liTxtOut{to{opacity:0;transform:translateX(10px)}}
@keyframes liFlash{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(3.4)}}
@keyframes liPop{from{transform:scale(1);opacity:1}60%{opacity:.9}to{transform:scale(.2);opacity:0}}

/* Χωρίς clip-path (παλιός browser) → καθαρό ξεθώριασμα, ποτέ σπασμένη οθόνη */
.li-veil.li-nofx{clip-path:none}
.li-veil.li-nofx.li-go{animation:liVeilFade calc(var(--li-dur)*.6) ease both}
@keyframes liVeilFade{to{opacity:0}}

/* ---------- Συναρμολόγηση χώρου εργασίας ---------- */
body.li-asm .sidebar-wrap{animation:liSide calc(var(--li-dur)*.62) var(--li-e) calc(var(--li-dur)*.16) both}
body.li-asm #topbar{animation:liTop calc(var(--li-dur)*.62) var(--li-e) calc(var(--li-dur)*.27) both}
body.li-asm #main>*{animation:liCard calc(var(--li-dur)*.55) var(--li-e) calc(var(--li-dur)*.38) both}
body.li-asm #main>*:nth-child(2){animation-delay:calc(var(--li-dur)*.38 + var(--li-step))}
body.li-asm #main>*:nth-child(3){animation-delay:calc(var(--li-dur)*.38 + var(--li-step)*2)}
body.li-asm #main>*:nth-child(n+4){animation-delay:calc(var(--li-dur)*.38 + var(--li-step)*3)}
@keyframes liSide{from{transform:translateX(-102%)}to{transform:none}}
@keyframes liTop{from{transform:translateY(-102%);opacity:0}to{transform:none;opacity:1}}
@keyframes liCard{from{opacity:0;transform:translateY(22px) scale(.985)}to{opacity:1;transform:none}}

/* Χωρίς συναρμολόγηση: η εφαρμογή απλώς «ανάβει».
   ΜΟΝΟ opacity — ένα transform στο .layout θα γινόταν containing block
   για τα position:fixed παιδιά (dock, FAB, toast) και θα τα μετακινούσε. */
body.li-fade .layout{animation:liWake calc(var(--li-dur)*.55) ease both}
@keyframes liWake{from{opacity:.35}to{opacity:1}}

/* Σε κινητό το πλαϊνό μενού είναι συρτάρι εκτός οθόνης — δεν το κινούμε,
   και το πέπλο δεν κρύβει το safe area. */
@media(max-width:900px){
  body.li-asm .sidebar-wrap{animation:none}
  body.li-asm #main>*{animation-delay:calc(var(--li-dur)*.3)}
}

/* Η ρύθμιση «μειωμένη κίνηση» του χρήστη υπερισχύει πάντα */
@media(prefers-reduced-motion:reduce){
  .li-veil,.li-veil .login-card,.li-mark,.li-mark .li-ic,
  body.li-asm .sidebar-wrap,body.li-asm #topbar,body.li-asm #main>*,
  body.li-fade .layout{animation:none!important}
  .li-veil.li-go{opacity:0;clip-path:none}
}

/* =====================================================================
   ΕΞΟΔΟΣ — ΑΚΡΙΒΩΣ ΤΟ ΑΝΤΙΣΤΡΟΦΟ ΤΗΣ ΕΙΣΟΔΟΥ
   ---------------------------------------------------------------------
   Ό,τι μπήκε, βγαίνει — με αντίστροφη σειρά:
     είσοδος:  μενού → μπάρα → κάρτες   |  διάφραγμα ΚΛΕΙΝΕΙ στο κέντρο
     έξοδος:   κάρτες → μπάρα → μενού   |  διάφραγμα ΑΝΟΙΓΕΙ από το κέντρο
   Και η σκάλα των καρτών αντιστρέφεται: η ΤΕΛΕΥΤΑΙΑ που μπήκε φεύγει πρώτη.
   Το `doLogout` κάνει location.reload(), οπότε η συνέχεια μετά το reload
   κρατιέται με sessionStorage → `.li-hold` (δες κάτω).
===================================================================== */
.li-veil.li-bye{clip-path:circle(0px at 50% 50%)}
.li-veil.li-bye.lo-in{animation:liIrisOut calc(var(--li-dur)*.78) cubic-bezier(.5,0,.15,1) both}
@keyframes liIrisOut{
  from{clip-path:circle(0px at 50% 50%)}
  to{clip-path:circle(75vmax at 50% 50%)}
}
.li-veil.li-bye.li-nofx{clip-path:none;opacity:0}
.li-veil.li-bye.li-nofx.lo-in{animation:liVeilIn calc(var(--li-dur)*.6) ease both}
@keyframes liVeilIn{to{opacity:1}}

/* Το σήμα εμφανίζεται αντίστροφα από ό,τι έφυγε στην είσοδο */
.li-veil.li-bye .li-mark{animation:none}
.li-veil.li-bye .li-ic{animation:liPopIn calc(var(--li-dur)*.32) cubic-bezier(.2,.9,.25,1) both,
                                 liBreathe 1.9s ease-in-out calc(var(--li-dur)*.42) infinite}
.li-veil.li-bye .li-ring{animation:liFlashIn calc(var(--li-dur)*.32) cubic-bezier(.2,.9,.25,1) both}
.li-veil.li-bye .li-txt{animation:liTxtIn calc(var(--li-dur)*.3) ease calc(var(--li-dur)*.2) both}
@keyframes liPopIn{from{transform:scale(.2);opacity:0}40%{opacity:.9}to{transform:scale(1);opacity:1}}
@keyframes liFlashIn{from{opacity:0;transform:scale(3.4)}to{opacity:.9;transform:scale(1)}}
@keyframes liTxtIn{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}

/* Αποσυναρμολόγηση — αντίστροφες καθυστερήσεις από το body.li-asm */
body.lo-dis #main>*{animation:loCard calc(var(--li-dur)*.5) var(--li-e) both}
body.lo-dis #main>*:nth-child(1){animation-delay:calc(var(--li-step)*2)}
body.lo-dis #main>*:nth-child(2){animation-delay:calc(var(--li-step))}
body.lo-dis #main>*:nth-child(n+3){animation-delay:0s}
body.lo-dis #topbar{animation:loTop calc(var(--li-dur)*.5) var(--li-e) calc(var(--li-dur)*.14) both}
body.lo-dis .sidebar-wrap{animation:loSide calc(var(--li-dur)*.5) var(--li-e) calc(var(--li-dur)*.24) both}
@keyframes loCard{from{opacity:1;transform:none}to{opacity:0;transform:translateY(22px) scale(.985)}}
@keyframes loTop{from{transform:none;opacity:1}to{transform:translateY(-102%);opacity:0}}
@keyframes loSide{from{transform:none}to{transform:translateX(-102%)}}
/* Ανοιχτό popup «Αποσύνδεση;» — φεύγει αθόρυβα πρώτο */
body.lo-dis #modalRoot,body.lo-dis #modalRoot2{opacity:0;transition:opacity 140ms ease}
body.lo-fade .layout{animation:loWake calc(var(--li-dur)*.55) ease both}
@keyframes loWake{from{opacity:1}to{opacity:.35}}
@media(max-width:900px){ body.lo-dis .sidebar-wrap{animation:none} }

/* ---------- Συνέχεια ΜΕΤΑ το reload ----------
   Το πέπλο έχει ΤΟ ΙΔΙΟ gradient με το .login-ov, οπότε αφαιρείται ΤΗ ΣΤΙΓΜΗ
   που εμφανίζεται η κάρτα: η εναλλαγή είναι κυριολεκτικά αόρατη.
   ΠΑΓΙΔΑ που αποφεύγεται έτσι: με z-index κάτω από το #loginRoot θα
   εξαρτιόμασταν από το αν το body δημιουργεί stacking context — και το
   δημιουργεί όταν είναι ενεργό το body.style.zoom (04-zoom). */
.li-veil.li-hold{clip-path:none}
body.li-hold-on{overflow:hidden}
/* Η κάρτα «ανθίζει» από το κέντρο — ακριβώς αντίστροφο του liSink */
body.li-bloom #loginRoot .login-card{animation:liBloom var(--li-sink) cubic-bezier(.2,.9,.25,1) both}
@keyframes liBloom{from{transform:scale(.28);opacity:0}to{transform:none;opacity:1}}

@media(prefers-reduced-motion:reduce){
  .li-veil.li-bye,.li-veil.li-bye .li-ic,.li-veil.li-bye .li-ring,.li-veil.li-bye .li-txt,
  body.lo-dis #main>*,body.lo-dis #topbar,body.lo-dis .sidebar-wrap,
  body.lo-fade .layout,body.li-bloom #loginRoot .login-card{animation:none!important}
}
/* ---------- Παράθυρα desktop: μετακίνηση / snap / αλλαγή μεγέθους ----------
   Όλα κλεισμένα σε @media (min-width:901px) → σε κινητό ΤΙΠΟΤΑ δεν αλλάζει.
   Το JS (41-window-drag) βάζει: .wd-win (μετακινημένο), .wd-sized (χειροκίνητο
   μέγεθος), .wd-live (όσο σέρνεται), .wd-rz (λαβή), .wd-prev (προεπισκόπηση). */
@media (min-width:901px){
  .modal-h,.ai-head,.wp-title{cursor:move}
  .modal-h button,.modal-h a,.modal-h select,
  .ai-head button,.ai-head a,.wp-title button{cursor:pointer}
  .modal-h input,.wp-title input{cursor:text}

  body.wd-dragging,body.wd-resizing{user-select:none;-webkit-user-select:none}
  body.wd-dragging *{cursor:move!important}
  body.wd-resizing *{cursor:nwse-resize!important}

  /* Όσο σέρνεις: ΚΑΜΙΑ μετάβαση. Το .modal έχει `transition:width .22s,
     max-height .22s` (19-modal) — χωρίς αυτό η αλλαγή μεγέθους θα
     «κυνηγούσε» το ποντίκι με καθυστέρηση. */
  .wd-live,.wd-live *{transition:none!important}
  .wd-live{animation:none!important}

  /* Το μετακινημένο παράθυρο πάνω από την προεπισκόπηση snap */
  .wd-win{z-index:1}

  /* Λαβή αλλαγής μεγέθους — δύο διαγώνιες γραμμές στη γωνία */
  .wd-rz{position:absolute;right:2px;bottom:2px;width:17px;height:17px;z-index:6;
    cursor:nwse-resize;border-radius:0 0 10px 0;
    background:linear-gradient(135deg,transparent 44%,rgba(28,46,74,.3) 44%,rgba(28,46,74,.3) 52%,
      transparent 52%,transparent 66%,rgba(28,46,74,.3) 66%,rgba(28,46,74,.3) 74%,transparent 74%)}
  .wd-rz:hover{background-color:rgba(28,46,74,.07)}

  /* Χειροκίνητο μέγεθος: σε desktop το .modal-b ΔΕΝ είναι flexible (μόνο το
     36-mobile το κάνει) → χωρίς αυτό, μεγαλώνοντας το παράθυρο έμενε κενό
     κάτω αντί να μεγαλώσει η περιοχή περιεχομένου. */
  .wd-sized{max-width:none!important;max-height:none!important}
  .wd-sized>.modal-h,.wd-sized>.modal-f,.wd-sized>.wp-title,.wd-sized>.wp-foot{flex:none}
  .wd-sized>.modal-b,.wd-sized>.ct-wrap,.wd-sized>.ai-body,.wd-sized>.wp-body{flex:1 1 auto;min-height:0}
  .wd-sized>.modal-b{max-height:none}

  /* Προεπισκόπηση snap (ζωντανό ορθογώνιο-στόχος κατά το σύρσιμο) */
  .wd-prev{position:absolute;z-index:0;border-radius:14px;pointer-events:none;
    background:rgba(46,111,216,.15);border:2px solid rgba(46,111,216,.5);
    box-shadow:0 10px 34px rgba(21,36,59,.16);animation:wdPrev .15s ease}
  @keyframes wdPrev{from{opacity:0}to{opacity:1}}
}

/* ---------- Ελαχιστοποίηση στο dock — «genie» (module 42-window-min) ----------
   Τα keyframes ΔΕΝ μπαίνουν σε media query: το εφέ πρέπει να μπορεί να παίξει
   και κατά την επαναφορά σε στενή οθόνη (δίχτυ διάσωσης — δες `.wm-chip` πιο
   κάτω). Η ελαχιστοποίηση όμως προσφέρεται ΜΟΝΟ σε desktop (JS: wmOn()).

   Το `!important` είναι σκόπιμο: το 37-transitions δίνει δικό του `animation`
   στο ίδιο στοιχείο όταν μπαίνει περιεχόμενο σε άδειο root (κλάση `tr-enter`).
   Στην επαναφορά θα έπαιζαν ΔΥΟ animations μαζί — εδώ πρέπει να νικήσει το
   genie, γιατί το παράθυρο δεν «ανοίγει», ΕΠΙΣΤΡΕΦΕΙ από το dock. */
/* «Ελατήριο» (squash & stretch): μαζεύεται πριν ξεκινήσει, τεντώνεται στην
   επιτάχυνση, περνά ελάχιστα τον στόχο και κάθεται. Μόνο `transform`+`opacity`
   ⇒ GPU, μηδέν layout — γι' αυτό έφυγε και το `clip-path`.
   ΟΡΑΤΟΤΗΤΑ: το παράθυρο μένει ΠΛΗΡΩΣ ορατό ως το 88% της διαδρομής και
   σβήνει μόνο πάνω στο εικονίδιο. Πρέπει να φαίνεται ΠΟΥ πάει. */
@keyframes wmGenie{
  0%  {transform:translate(0,0) scale(1,1);opacity:1}
  15% {transform:translate(calc(var(--wm-x,0px)*.015),calc(var(--wm-y,0px)*.01)) scale(1.07,.9);opacity:1}
  52% {transform:translate(calc(var(--wm-x,0px)*.52),calc(var(--wm-y,0px)*.58)) scale(.52,.74);opacity:1}
  84% {transform:translate(calc(var(--wm-x,0px)*1.03),calc(var(--wm-y,0px)*1.04))
       scale(calc(var(--wm-sx,.05)*1.32),calc(var(--wm-sy,.05)*.7));opacity:1}
  92% {transform:translate(var(--wm-x,0px),var(--wm-y,0px)) scale(var(--wm-sx,.05),var(--wm-sy,.05));opacity:1}
  100%{transform:translate(var(--wm-x,0px),var(--wm-y,0px)) scale(var(--wm-sx,.05),var(--wm-sy,.05));opacity:0}
}
/* ΤΟ ΣΚΟΤΕΙΝΟ ΦΟΝΤΟ ΦΕΥΓΕΙ ΜΕ background-color, ΟΧΙ ΜΕ opacity.
   Το παράθυρο είναι ΠΑΙΔΙ του overlay — η διαφάνεια του γονέα πολλαπλασιάζεται
   στο παιδί, οπότε το `opacity` έσβηνε το ίδιο το παράθυρο στα μισά της
   διαδρομής (φαινόταν πού πάει, αλλά εξαφανιζόταν πριν φτάσει).
   Χωρίς `from`, το 0% είναι η ΤΡΕΧΟΥΣΑ τιμή κάθε overlay (.overlay/.ai-ov/.wp-ov
   έχουν διαφορετικά rgba) — μία δήλωση, σωστή παντού. */
@keyframes wmOv{to{background-color:transparent}}
/* Αναπήδηση εικονιδίου: προσγείωση (μάζεμα) & απογείωση (επαναφορά) */
@keyframes wmBump{
  0%{transform:scale(1,1)}
  34%{transform:scale(1.32,.76)}
  62%{transform:scale(.93,1.11)}
  100%{transform:scale(1,1)}
}
.wm-bump .dock-ic{animation:wmBump 460ms cubic-bezier(.3,1.15,.4,1)}
.wm-out{animation:wmGenie var(--wm-dur,480ms) cubic-bezier(.5,0,.35,1) forwards!important;
  will-change:transform,opacity}
.wm-in{animation:wmGenie var(--wm-dur,480ms) cubic-bezier(.5,0,.35,1) reverse forwards!important;
  will-change:transform,opacity}
/* Το φόντο φεύγει ΓΡΗΓΟΡΑ (ease-out) ώστε η διαδρομή να φαίνεται πάνω στη
   φωτεινή σελίδα αντί να χάνεται μέσα στο σκοτάδι. */
.wm-ov-out{animation:wmOv var(--wm-dur,480ms) cubic-bezier(.2,.85,.3,1) forwards!important}
.wm-ov-in{animation:wmOv var(--wm-dur,480ms) cubic-bezier(.2,.85,.3,1) reverse forwards!important}
/* Το περιεχόμενο ΠΑΓΩΝΕΙ όσο το παράθυρο πετάει — όπως το «στιγμιότυπο» που
   δείχνει το macOS. Επιπλέον κόβει στη ρίζα το «διπλό εφέ»: το `animationend`
   ΑΝΑΔΥΕΤΑΙ, οπότε ένα animation παιδιού τερμάτιζε πρόωρα το genie (το JS
   φιλτράρει πλέον και τον στόχο — δύο δικλείδες, μία αιτία). */
.wm-fly *,.wm-out *,.wm-in *{animation-play-state:paused!important;transition:none!important}
.wm-fly{will-change:transform,clip-path,opacity}
@media (prefers-reduced-motion:reduce){
  .wm-out,.wm-in,.wm-ov-out,.wm-ov-in,.wm-bump .dock-ic{animation:none!important}
}

/* Κουμπί «−» δίπλα στο ✕ — το εμφυτεύει ο observer, κανένα module δεν το γράφει */
@media (min-width:901px){
  .wm-min{margin-left:auto;flex:none;border:none;background:none;color:inherit;cursor:pointer;
    padding:0;width:27px;height:27px;border-radius:8px;display:grid;place-items:center;opacity:.8}
  .wm-min:hover{opacity:1;background:rgba(255,255,255,.2)}
  /* Το .x έχει margin-left:auto (19-modal) — με το «−» μπροστά, εκείνο παίρνει
     το κενό και το ✕ κάθεται ακριβώς δίπλα του. */
  .modal-h .wm-min~.x,.ai-head .wm-min~.ai-x{margin-left:6px}
  .modal-h:not([style]) .wm-min:hover{background:rgba(21,36,59,.09)}
}

/* Προσωρινό εικονίδιο στο dock (δεξιά, όπως Ai/Κειμενογράφος) */
.wm-ic svg{width:21px;height:21px}
.wm-x{position:absolute;top:-3px;right:-5px;width:19px;height:19px;border-radius:50%;
  background:#1c2e4a;color:#fff;font-size:10px;line-height:1;place-items:center;
  box-shadow:0 2px 7px rgba(0,0,0,.35);display:none;cursor:pointer}
.wm-chip:hover .wm-x{display:grid}
/* ΔΙΧΤΥ ΔΙΑΣΩΣΗΣ: σε κινητό το 36 κρύβει ΟΛΑ τα .dock-item. Ένα παράθυρο που
   ελαχιστοποιήθηκε σε desktop και μετά στένεψε το παράθυρο του browser θα
   έμενε απρόσιτο — το chip του παραμένει ορατό ώστε να επιστρέφεται πάντα. */
@media (max-width:900px){
  .dock .wm-chip{display:block}
  .dock .wm-chip .dock-tip{display:none}
}

/* ---------- MDI: πολλά παράθυρα ταυτόχρονα (module 43-window-mdi) ----------
   Το ΕΣΤΙΑΣΜΕΝΟ παράθυρο ζει στο #modalRoot (z-index 100 του .overlay),
   τα υπόλοιπα σε πλαίσια μέσα στο #mdiDeck (z-index 99) ⇒ το ενεργό είναι
   ΠΑΝΤΑ μπροστά χωρίς κανέναν υπολογισμό z-index. */
#mdiDeck{position:fixed;inset:0;z-index:99;pointer-events:none}

@media (min-width:901px){
  /* ΤΟ «ΚΑΠΑΚΙ» ΦΕΥΓΕΙ — η πιο κερδοφόρα γραμμή του module:
     το overlay δεν δέχεται πλέον κλικ, άρα τα **51** inline
     `if(event.target===this)closeModal()/closeCard()` δεν πυροδοτούνται ΠΟΤΕ
     (δεν χρειάστηκε να πειραχτεί ούτε ένα) ΚΑΙ τα κλικ περνούν στην εφαρμογή
     από κάτω: μπορείς να πλοηγηθείς με τα popup ανοιχτά. */
  body.mdi .overlay,body.mdi .ai-ov,body.mdi .wp-ov{
    background:none;backdrop-filter:none;-webkit-backdrop-filter:none;pointer-events:none}
  body.mdi .overlay>.modal,body.mdi .ai-ov>.ai-win,body.mdi .wp-ov>.wp{pointer-events:auto}
  /* `position:relative` πάντα: το ::after του ανενεργού παραθύρου πρέπει να
     αγκυρώνεται στο ΠΑΡΑΘΥΡΟ — αλλιώς θα άπλωνε σε όλη την οθόνη. */
  body.mdi .overlay>.modal{position:relative}
  body.mdi .mdi-host{position:fixed;inset:0;pointer-events:none}

  /* Ανενεργό παράθυρο: πιο ήσυχο, όπως η ανενεργή μπάρα τίτλου των Windows */
  body.mdi .mdi-idle>.modal{box-shadow:0 10px 26px rgba(21,36,59,.15)}
  body.mdi .mdi-idle .modal-h{filter:saturate(.8) brightness(1.03)}
  body.mdi .mdi-idle>.modal::after{content:"";position:absolute;inset:0;z-index:3;
    border-radius:inherit;background:rgba(21,36,59,.05);pointer-events:none}
  body.mdi .mdi-idle>.modal .wd-rz{display:none}   /* αλλαγή μεγέθους μόνο στο ενεργό */
}

/* Το dock ΜΠΡΟΣΤΑ από τα παράθυρα (μόνο σε MDI — χωρίς αυτό θα φώτιζε πάνω
   από το σκούρο φόντο του κλασικού modal). Πάνω από τα 99/100 των παραθύρων,
   κάτω από chat (140) / ειδοποιήσεις (145) / μηνύματα (200). */
body.mdi .dock{z-index:110}

/* ΜΕΤΑΚΙΝΗΣΗ ΠΑΡΑΘΥΡΟΥ ≠ ΑΝΟΙΓΜΑ: όταν ένας κόμβος αλλάζει γονέα (παρκάρισμα,
   εστίαση, προαγωγή) ο browser ΞΑΝΑΠΑΙΖΕΙ όλα τα animations του — γι' αυτό
   «ανανεώνονταν» τα άλλα παράθυρα όταν ελαχιστοποιούσες κάποιο. Η κλάση
   μπαίνει για λίγο γύρω από τη μετακίνηση και τα σβήνει. */
.mdi-quiet,.mdi-quiet *{animation:none!important}

/* ---------- EXPOSÉ: όλα τα παράθυρα με μια ματιά (module 44) ---------- */
#xpVeil{position:fixed;inset:0;z-index:98;background:rgba(15,23,40,.5);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity .3s ease}
#xpVeil.on{opacity:1}
/* Κουμπί dock: τέσσερα τετραγωνάκια = «όλα τα παράθυρα».
   ΤΟ `place-items:stretch` ΕΙΝΑΙ ΑΠΑΡΑΙΤΗΤΟ: το `.dock-ic` έχει
   `place-items:center`, που θα συρρίκνωνε τα κενά <i> στο μηδέν —
   το εικονίδιο θα έβγαινε τελείως άδειο. Ίδιος λόγος για τα rows. */
.xp-ic{background:linear-gradient(135deg,#5b8def,#1e3a8a);
  grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;
  place-items:stretch;gap:3.5px;padding:11px}
.xp-ic i{display:block;background:rgba(255,255,255,.94);border-radius:2.5px}
@media (min-width:901px){
  /* Το παράθυρο ταξιδεύει προς το κελί του. Το `transition` μπαίνει ΜΟΝΟ εδώ:
     το .modal έχει δικό του transition σε width/max-height (19-modal) και δεν
     πρέπει να το πειράξουμε. */
  .xp-win{transition:transform var(--xp-dur,340ms) cubic-bezier(.22,1,.36,1)!important;
    cursor:pointer;will-change:transform}
  /* Μία στιγμή χωρίς μετάβαση: εκεί «κλειδώνει» η αφετηρία του FLIP αφού το
     παράθυρο έχει ήδη αλλάξει γονέα (δες xpFlipFrom). */
  .xp-win.xp-nofx{transition:none!important}
  .xp-win.xp-min{opacity:.86}
  /* Ασπίδα κλικ: στο exposé ένα κλικ σημαίνει ΜΟΝΟ «διάλεξέ με» */
  .xp-hit{position:absolute;inset:0;z-index:20;cursor:pointer;background:transparent}
  .xp-win:hover{box-shadow:0 0 0 3px rgba(46,111,216,.75),0 26px 60px rgba(21,36,59,.4)!important}
  /* Όσο είμαστε σε exposé: καμία σκίαση ανενεργού, όλα ισότιμα */
  body.xp .mdi-idle>.modal::after{display:none}
  body.xp .mdi-idle .modal-h{filter:none}
  body.xp .wd-rz{display:none}
}
/* ============================================================
   ΔΙΠΛΩΜΑ ΠΛΑΪΝΟΥ ΜΕΝΟΥ — λωρίδα εικονιδίων 72px (901–1400px)
   ------------------------------------------------------------
   Ζώνη-στόχος: tablet landscape (1133–1368) + μικρά laptop, όπου
   τα 240px του μενού κοστίζουν. >1400px & ≤900px: ΑΘΙΚΤΑ
   (≤900 έχει ήδη το off-canvas drawer του 36-mobile).

   ΚΑΝΟΝΑΣ: ΜΟΝΟ `transition` σε στοιχεία που ΔΕΝ ξαναχτίζονται
   (το <aside> ζει πάντα· το #sidebar innerHTML αλλάζει συνεχώς από
   το renderSidebar). Καμία `animation` εδώ — θα ξανάπαιζε σε κάθε
   re-render («η δεύτερη ανανέωση»).

   ΠΛΑΤΟΣ 72px, όχι 64: τα badges φτάνουν τα 3 ψηφία («128 tasks»)
   και στα 64px κόβονταν από την άκρη της λωρίδας.
   ============================================================ */

/* Εκτός εύρους: το κουμπί δεν υπάρχει καν. */
.side-fold{display:none}

@media (min-width:901px) and (max-width:1400px){

  /* ---------- Το ίδιο το πλάτος ---------- */
  /* Το 37-transitions δίνει μόνο `transform`· εδώ προσθέτουμε το width
     με ΤΗΝ ΙΔΙΑ διάρκεια/καμπύλη ώστε να κινούνται μαζί. Το
     `body.tr-off aside` του 37 έχει μεγαλύτερη ειδικότητα → ο
     καθολικός διακόπτης God Mode εξακολουθεί να το σβήνει. */
  aside.sidebar-wrap{transition:transform var(--tr-in) var(--tr-ein),
                                width var(--tr-in) var(--tr-ein)}
  body.sb-fold aside.sidebar-wrap{width:72px}

  /* ---------- Κουμπί διπλώματος: ΣΤΗ ΓΡΑΜΜΗ ΤΟΥ ΛΟΓΟΤΥΠΟΥ ----------
     Δική του σειρά θα κατέβαζε ΟΛΟ το μενού μια γραμμή. Εδώ κάθεται
     δεξιά στο `.side-brand` (margin-left:auto) και δεν κοστίζει ύψος.
     Κλειστό: το σήμα φεύγει και μένει ΜΟΝΟ το βελάκι, κεντραρισμένο —
     στα 72px δεν χωρούν και τα δύο χωρίς να στριμωχτούν. */
  .side-fold{display:grid;place-items:center;width:30px;height:30px;padding:0;
    margin-left:auto;flex:none;
    border:none;border-radius:8px;background:rgba(255,255,255,.08);color:#cdd7e8;
    cursor:pointer;
    transition:background .15s ease,color .15s ease,transform var(--tr-in) var(--tr-ein)}
  .side-fold:hover{background:rgba(255,255,255,.18);color:#fff}
  .side-fold svg{width:17px;height:17px;display:block}
  body.sb-fold .side-fold{transform:rotate(180deg);margin:0}

  body.sb-fold .side-brand{justify-content:center;padding:14px 0 10px}
  body.sb-fold .side-brand .mark{display:none}
  body.sb-fold .side-brand .brandtxt{display:none}

  /* ---------- Στοιχεία μενού: font-size 0 αντί για clip ----------
     Το ΚΟΨΙΜΟ (overflow:hidden) θα άφηνε μισά γράμματα, γιατί τα labels
     είναι γυμνά text nodes χωρίς wrapper. Το font-size:0 τα εξαφανίζει
     καθαρά και ΚΙΝΕΙΤΑΙ — «μαζεύονται» μαζί με το πλάτος.
     Το εικονίδιο (20px) κεντράρεται με padding-left 16:
     10 (#sidebar) + 16 + 10 (μισό εικονίδιο) = 36 = 72/2. */
  .nav-item{transition:font-size var(--tr-in) var(--tr-ein)}
  body.sb-fold #sidebar{overflow-x:hidden}
  body.sb-fold .nav-item{font-size:0;position:relative;padding:11px 0 11px 16px}

  /* Το badge βγαίνει από τη ροή (το margin-left:auto θα το έσπρωχνε έξω)
     και κεντράρεται ΠΑΝΩ ΣΤΗ ΔΕΞΙΑ ΑΚΜΗ του εικονιδίου. Έτσι μεγαλώνει
     συμμετρικά: 3 ψηφία = ~26px → 33…59px, μέσα στα 72 με περιθώριο. */
  body.sb-fold .nav-item .cnt{position:absolute;top:2px;left:36px;
    transform:translateX(-50%);margin:0;
    font-size:9.5px;line-height:1.65;padding:0 4px;min-width:16px;
    text-align:center;white-space:nowrap;box-shadow:0 0 0 2px #17263f}
  body.sb-fold .nav-item.active .cnt{box-shadow:0 0 0 2px #e8622d}

  /* Σημείωμα ιδιωτικότητας: άσχημο και άχρηστο σε λωρίδα 72px. */
  body.sb-fold .priv-note{display:none}

  /* ---------- Έξοδος μέσα στο μενού (όπως στο κινητό) ---------- */
  /* Τα οπτικά του .m-logout ορίζονται ΜΙΑ φορά στο 36-mobile.css (base)·
     εδώ μόνο το εμφανίζουμε και το συμπυκνώνουμε στη λωρίδα. */
  .m-logout{display:flex;margin:6px 10px 12px;
    transition:background .15s ease,color .15s ease,font-size var(--tr-in) var(--tr-ein)}
  .m-logout:hover{background:rgba(255,90,71,.22);color:#fff}
  body.sb-fold .m-logout{font-size:0;gap:0;margin:6px 10px 12px;padding:11px 0}

  /* Το topbar «Έξοδος» φεύγει — ένα κουμπί εξόδου, ένα μέρος. */
  #topbar #logoutBtn{display:none}

  /* ---------- Topbar: να ΜΗΝ σπάει σε δεύτερη γραμμή ----------
     Η βασική διόρθωση είναι στο 02-live-search (`flex:1 1 0%`).
     Εδώ κερδίζουμε κι άλλο πλάτος για τη στενή ζώνη: τα μίνι labels
     «ΡΟΛΟΣ»/«ΤΜΗΜΑ» είναι διακοσμητικά (τα selects λένε ήδη τι είναι),
     και το όνομα χρήστη κόβεται με «…» αντί να σπρώχνει τη γραμμή.
     Σε πραγματική συνεδρία τα roleWrap/deptWrap είναι ήδη display:none
     (applySessionUI) — αυτό αφορά κυρίως το mock/demo mode. */
  #topbar .hdr-ctrl{padding:5px 6px}
  #topbar .hdr-ctrl label{display:none}
  #topbar .hdr-ctrl select{max-width:130px}
  #topbar .user-chip{flex:none;min-width:0}
  #topbar .user-chip .nm,#topbar .user-chip .rl{max-width:130px;overflow:hidden;
    text-overflow:ellipsis;white-space:nowrap}
}

/* Σεβασμός στη ρύθμιση «χωρίς κίνηση» (God Mode) και στη συσκευή. */
body.tr-off aside.sidebar-wrap,body.tr-off .nav-item,
body.tr-off .m-logout,body.tr-off .side-fold{transition:none}
@media (prefers-reduced-motion:reduce){
  aside.sidebar-wrap,.nav-item,.m-logout,.side-fold{transition:none!important}
}
/* ---------- Brand: OMNIK (brand/omnik) — μπαίνει ΤΕΛΕΥΤΑΙΟ στο CSS από το build.py ----------
   Γραμματοσειρά: Quebra Expa Bold (Vanarchiv) — ΜΟΝΟ τα γράμματα O M N I K (o m n i k),
   subset woff2 ~2 KB ενσωματωμένο. Πηγή: brand/omnik/QuebraExpa-Bold.otf. Για άλλα γράμματα:
   pyftsubset QuebraExpa-Bold.otf --text="…" --flavor=woff2 --output-file=omnik-subset.woff2  */
@font-face{font-family:"Quebra Expa";font-weight:700;font-style:normal;font-display:block;
  src:url(data:font/woff2;base64,d09GMk9UVE8AAAiUAA0AAAAADcgAAAhDAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAADY89GhYbgWgcghoGYABcEQgBNgIkA0QEBgWDBAcgG+AMEdWszaD5WWA3vjQ0nHBCGZglJ+FPOBfKEDMppEcZeltWLl4AaGwQ5yrdGsGKydnwjf/Dzkw3GDpkytZiHlQKvLunfIAjyiabvTttmtTVVzZpkOAwggThNOi3z/1MZeYJ02rd8ScLfMjZ/AJ+SArE6siisCfMKUYVrqI4pQM+V2tq7xJ2/y07QInCsGahalTClw1jFTCOr9F1dQCoEISqrKywbARqpNunqsDVg4iMTL4jgVhAiBByyG21OMzbvOXmxU9aCWurJmsGoMUH4sITdFqiXosQ87k8H//6/x7ILMG98/H9YUwJBX4RcFDU/LSMXFfNrnSnMzNrn/0Mhem2shzb0cN7CitEhjUrPTPpsgCFxhyT4X3dXMfNpa8zUKXv14IuaudfyxEvqMZgdq35ZwFBGnA5kF5gN3vZX6A74SOC0AIC0WUGYsIOYVpn0T2qv6h/QlwpPgshtMLX0Fp0E++VZsp+i2JpSFUvv6KhZsK9LEpWITchRe7m0XDGiJt4NJTY+o7fQ2whux+/Sx8PNs41zpq7xFIyJTNmRP1TrJWtOMVQ2svkE3bgORZXNQH5YuSRLTzkEI+Hji675gDhD7EoNC3MmEYUtePnhzDr4ldeecCYHk2NfdWyqSHB+LN0qSozZnK+SATUMnEvi/YMQ74IuRX+Cv8B1iP+GfvRbUKeiBSll8dMBR/imNDLcbSKmf2TiiMBjdcup6XhbhalqJAbkSz3jjQNvxfXdfw7tbVuzZGElGrZBI/cwi4d2NhX6BE6jQ3S/VRDL1lFS+WNil5OV2LV9AhaEx1iqzG993pw1j5rHTQ9dU+tuGAx1RFOJg4Iwr9G/AxNTad8H+GbMLVE81M2FWKWFsq33vJMqsaVm8YnEB7Obo5kGzG9P90rVNQ2B/odCHsBPdV+x3HelXemC3CWOLG1i6cF2w6PI6/6eDvhL6KjNE/3VDBrXQ9zkmZav7az1NWtGg3ZO1iecPBCRg8cXq0n2jFNImmpcGuVNC6zK1rLvIoSSqIQofEJ1jWpFVFG7jZ/kydFheVdbs0HD1y35TdEUWCbwivgJGnyOztLQap69QnfYxQ/RNvHOUfOkTonttOkzNgipE6wdhZW+MWuGfmEnThgpk9GFb5j/HJY33EkfM4xBrUFSJni8fXevV5ugDMm3MIToKRt/mZfQdHNLfjqsVqyAaqc6yFaCuAM8SzcGKmNqzrjSkzHuH6Tqchait44FV1D1YV+lK2K++AmnnFgqVMm/Fi7MWXwyDNcpISno6304PbZ3PK7LuT3gXAj2k9PHuaWkjpUP3xkQR6GvL4+vgjynfvGsOsXkcrB1zIS8U6jJ+l1XhwnKaQiDiSVoy6+ol7DGkxZyN4XeSgl/BA6Qk8dni8jdahh4FDNYImr2auVNlaFvqEv5+8YpVXVHd6i17Dr3bmzjrCdvflsSng14uvo8o2Um8hO7B/py41fGyjJZrbIzzC9IVmU0pLlZBvE8pDyls7NA9x6wgkbrcB0v9O2nxKeh4qoM6lIRTYU0SCJf8jOa6bIP9FfHY8t8EH3Y/qVY57UQZLRUZpzXO5UU1cXUQuZMTXrRTWnerLjmjtK+EK+N3Kw7jkCmRW93jKUZn/imsGd15Bb0Y7uulP2CXNG3orpHUr1QX+i29rlHgrIiqn3uuqi/vzs8NoLkoy8tCrWkDpLXRvIkzSz9N4W20fdkK1EH7SM59j3WJnafA21U/idVrWCkqfWLcmXoXXd8jZMx6rvvQvOtCu34JAS6/jGzhKRqt58RfWz+/tjX6f40Dmn7Rk2NnCb+Hu0zcAGdIZkZbtBRSHFb5h/G3oF+84TFotkpQP5FPUGNdP6zdhTTjZqclq/ZUX4NC8N1zC1TXILOShhaTQyoo4wIiSKkFzeWFQ9DKu6fMIDH2ReqXg1NWEyl6E4Z5q/NYdcTGu1JHSwtWarZ3OrpuFi/ODsSNOpzaeeLC5SGUWs4muSK+i3uZsayRwZy8gpQiY0qVtXLm4FDdWy8VZaocAzIkXDrHNMBFXzsLh1KxEyApVO2gslzHdLaqvDFK5AnpsFOxsx/bItAQCBEtCVHSEEcVx/aVbS79v3HgURD5/DBiJeZlcpiCACANz1t3laHaWAAAgl0oXr+EuAQJoWhIEwAxtcJ2BvS6uzSkFIkr9LWjle+rvVBYgOhBF+/AmTxIJNT0xBVwcBi0YDoNPodRVc0dy2k6kYkhC1ttPbDCBqlaEnAvoSHhDsmuJttrlA3OOJHSS8NYXxEcVQOi/ZNGIpGW1uPShQtp1yNROizQYhLbYgASkJgQrS5f4kes4lSAodkuCRCdSlqUOAKIHoOmF/iQjBFlMcj0gM7U+nCt5Ne0HENtQjMKD7lgMAsEdMSLhAtj+QQjjQsePEfsFgl7LSLoUIG8XQRFOhwk/3iMqwIQEIEmGBAFq0E6QFWh3ZZY8DChUrW1LD3IdKXtjMzSiSlQCHsKwMBvsD1vONhy8Er/0TP/0PAACfHUwjRNtIn4jDv/Z8M0hHES+6lsS2897V8wyWC63VjDkLDveXDs+YwP80TbMxW8DO3p3z5lt+Hyk+AFbmL7rmsPmTYSdRJduAlO3ajMBBIBQA2OlN0G78AABFQClaEKUoWoeojdZbqjVaZPBINJTpk+0iCxMItihTzsehUL4CLr7YKIdJkGyQ7NRmYGGaGxxnVspMkxyruJBHehi2iY2t6yTAWSZWga3EY5Fc1naIWxJLQMxE8TZe5VrxZmVsIFk2ZKZN1zhmjxP2691Gklnqxeh1kt0JOL4AkzsVKlPKMBOyPbRtsqdV7bL6MzuDXlLQJbVsAAAA) format("woff2")}
/* Το νέο σήμα έχει δικό του φόντο (τιρκουάζ, στρογγυλεμένο) → χωρίς το λευκό πλαίσιο */
.side-brand[data-brand="omnik"] .mark{background:transparent;padding:0;box-shadow:0 1px 4px rgba(0,0,0,.4)}
.side-brand[data-brand="omnik"] .mark img{border-radius:9px}
.side-brand[data-brand="omnik"] .brow{align-items:center}
.side-brand[data-brand="omnik"] .bname{font-family:"Quebra Expa",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-weight:700;font-size:15px;letter-spacing:.04em;line-height:1.05;color:#dc8033}
/* Οθόνη σύνδεσης (brand/omnik/login.html · brandLoginMark στο 22) — το ίδιο αρχείο με το εικονίδιο της εφαρμογής */
.login-card .brand-login-img{display:block;margin:0 auto;width:92px;height:92px;border-radius:21px;
  box-shadow:0 6px 18px rgba(21,36,59,.28)}
.login-card .brand-login-sub{font-size:10px;color:var(--muted);letter-spacing:.5px;margin:8px 0 6px}
/* Εφέ σύνδεσης/εξόδου (40): το εικονίδιο της εφαρμογής ΧΩΡΙΣ λευκό πλαίσιο + «OMNIK» στη γραμματοσειρά του brand */
html[data-brand="omnik"] .li-mark .li-ic{background:transparent;padding:0}
html[data-brand="omnik"] .li-mark .li-ic img{object-fit:cover;border-radius:15px}
html[data-brand="omnik"] .li-mark .li-txt small.li-bn{font-family:"Quebra Expa",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-weight:700;font-size:12.5px;letter-spacing:.08em;color:#dc8033;margin-top:5px}