:root{
  --bg:#f3f5f8; --panel:#fff; --line:#e3e7ec; --line-2:#eef1f4;
  --text:#1d2733; --muted:#6b7886; --faint:#9aa5b1;
  --accent:#1f5f8b; --accent-2:#e8f1f8; --accent-ink:#174a6d;
  --danger:#c0392b; --ok:#2e7d4f; --warn:#b7791f;
  --radius:10px; --shadow:0 8px 28px rgba(20,35,55,.14), 0 2px 6px rgba(20,35,55,.06);
  --top:58px; --side:248px; --chatw:340px;
  font-family:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--text); font-size:14px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg)}
button,input,textarea,select{font:inherit;color:inherit}
a{color:var(--accent)}
svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.muted{color:var(--muted)} .small{font-size:12px}
[hidden]{display:none!important}

/* ---------- butoane ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:var(--panel);
  padding:9px 16px;border-radius:8px;cursor:pointer;font-weight:600;text-decoration:none;color:var(--text)}
.btn:hover{background:#f7f9fb}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-ink)}
.btn-danger{background:var(--danger);border-color:var(--danger);color:#fff}
.btn-danger:hover{filter:brightness(.93)}
.btn-block{width:100%}
.btn-sm{padding:6px 11px;font-size:13px}
.icon-btn{display:inline-grid;place-items:center;width:36px;height:36px;border:0;background:transparent;border-radius:8px;cursor:pointer;color:var(--muted)}
.icon-btn:hover{background:var(--line-2);color:var(--text)}

/* ---------- pagini de autentificare ---------- */
.auth-body{display:grid;place-items:center;min-height:100%;padding:24px 16px;
  background:radial-gradient(1200px 500px at 50% -10%, #dbe8f2 0%, var(--bg) 60%)}
.auth-card{width:100%;max-width:400px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:28px 26px;box-shadow:0 10px 30px rgba(20,35,55,.07)}
.auth-brand{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--accent);margin-bottom:22px}
.auth-card h1{font-size:21px;margin:0 0 8px}
.auth-form{display:grid;gap:14px;margin-top:16px}
.auth-form label,.form label{display:grid;gap:6px;font-weight:600;font-size:13px}
.auth-form small,.form small{font-weight:400;color:var(--muted)}
input[type=text],input[type=email],input[type=password],input[type=search],input:not([type]),textarea,select{
  width:100%;border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:#fff;outline:none}
input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-2)}
.auth-links{margin:18px 0 0;text-align:center;font-size:13px}
.alert{padding:10px 12px;border-radius:8px;margin:12px 0;font-size:13px}
.alert-err{background:#fdecea;color:#8a2a1f}
.alert-ok{background:#e7f4ec;color:#1f5e3b}
.checks{list-style:none;padding:0;margin:14px 0;display:grid;gap:6px;font-size:13px}
.checks .ok{color:var(--ok)} .checks .bad{color:var(--danger);font-weight:600}
code{background:var(--line-2);padding:1px 5px;border-radius:4px;font-size:12.5px}

/* ---------- aplicația ---------- */
.app{overflow:hidden}
.topbar{height:var(--top);display:flex;align-items:center;gap:14px;padding:0 14px;background:var(--panel);border-bottom:1px solid var(--line);position:relative;z-index:20}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px;color:var(--text);text-decoration:none;width:calc(var(--side) - 28px);white-space:nowrap}
.search{flex:1;max-width:640px;position:relative}
.search input{background:var(--bg);border-color:transparent;padding-left:38px;height:40px;border-radius:20px}
.search input:focus{background:#fff}
.search-ico{position:absolute;left:13px;top:11px;color:var(--muted)}
.user-menu{margin-left:auto;position:relative}
.user-btn{display:flex;align-items:center;gap:8px;border:0;background:transparent;padding:5px 8px;border-radius:22px;cursor:pointer;font-weight:600}
.user-btn:hover{background:var(--line-2)}
.chev{width:15px;height:15px;color:var(--muted)}
.avatar{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;color:#fff;font-weight:700;font-size:12px;flex:none;letter-spacing:.3px}

.dropdown{position:absolute;top:calc(100% + 6px);right:0;min-width:200px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:6px;z-index:50}
.dropdown button,.dropdown a,.ctx button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;background:none;padding:9px 10px;border-radius:7px;cursor:pointer;color:var(--text);text-decoration:none}
.dropdown button:hover,.dropdown a:hover,.ctx button:hover{background:var(--line-2)}
.dropdown svg,.ctx svg{color:var(--muted)}

.layout{display:grid;grid-template-columns:var(--side) 1fr var(--chatw);height:calc(100% - var(--top))}

/* sidebar */
.sidebar{padding:14px 10px;overflow:auto;display:flex;flex-direction:column;background:var(--bg)}
.new-wrap{position:relative;margin:0 4px 14px}
.new-wrap .dropdown{left:0;right:auto}
.btn-new{border-radius:14px;padding:12px 20px;box-shadow:0 1px 3px rgba(20,35,55,.12);background:var(--panel)}
.btn-new svg{color:var(--accent);width:20px;height:20px}
.tree{flex:1}
.tree ul{list-style:none;margin:0;padding:0}
.tree ul ul{padding-left:14px}
.t-row{display:flex;align-items:center;gap:4px;padding:6px 8px 6px 2px;border-radius:0 18px 18px 0;cursor:pointer;color:var(--text);user-select:none}
.t-row:hover{background:#e6eaef}
.t-row.active{background:var(--accent-2);color:var(--accent-ink);font-weight:600}
.t-row.drop{outline:2px dashed var(--accent);outline-offset:-2px}
.t-tog{width:20px;height:20px;display:grid;place-items:center;border:0;background:none;cursor:pointer;color:var(--muted);padding:0;border-radius:4px}
.t-tog svg{width:14px;height:14px;transition:transform .15s}
.t-tog.open svg{transform:rotate(90deg)}
.t-tog.t-none{visibility:hidden}
.t-row .fico{width:17px;height:17px;color:var(--muted)}
.t-row.active .fico{color:var(--accent)}
.t-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-foot{font-size:12px;padding:10px 8px 0}

/* zona principală */
.main{background:var(--panel);border-radius:14px 14px 0 0;margin-top:8px;display:flex;flex-direction:column;min-width:0;position:relative;border:1px solid var(--line);border-bottom:0}
.toolbar{display:flex;align-items:center;gap:10px;padding:10px 12px 10px 18px;border-bottom:1px solid var(--line-2);min-height:56px}
.crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:2px;flex:1;min-width:0;font-size:17px}
.crumbs button{border:0;background:none;padding:5px 9px;border-radius:8px;cursor:pointer;color:var(--muted);white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis}
.crumbs button:hover{background:var(--line-2);color:var(--text)}
.crumbs button.cur{color:var(--text);font-weight:600}
.crumbs .sep{width:14px;height:14px;color:var(--faint)}
.tools{display:flex;gap:2px}
.files{flex:1;overflow:auto;padding:4px 8px 90px}

.list-head,.row{display:grid;grid-template-columns:30px minmax(0,1fr) 150px 160px 90px 40px;align-items:center;gap:10px;padding:0 10px}
.list-head{position:sticky;top:0;background:var(--panel);z-index:2;height:40px;color:var(--muted);font-size:12.5px;font-weight:600;border-bottom:1px solid var(--line-2)}
.list-head button{border:0;background:none;color:inherit;font:inherit;cursor:pointer;padding:0;text-align:left;display:flex;align-items:center;gap:4px}
.row{height:46px;border-bottom:1px solid var(--line-2);border-radius:8px;cursor:default;user-select:none}
.row:hover{background:#f6f8fa}
.row.sel{background:var(--accent-2)}
.row.drop{outline:2px dashed var(--accent);outline-offset:-2px}
.row.flash{animation:flash 1.6s ease}
@keyframes flash{0%,40%{background:#fff4c2}100%{background:transparent}}
.r-name{display:flex;align-items:center;gap:12px;min-width:0;font-weight:500}
.r-name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.r-meta{color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .icon-btn{width:32px;height:32px;opacity:0}
.row:hover .icon-btn,.row.sel .icon-btn{opacity:1}

/* iconițe de tip fișier */
.ft{width:30px;height:30px;border-radius:7px;display:grid;place-items:center;font-size:9px;font-weight:800;color:#fff;letter-spacing:.2px;flex:none}
.ft svg{width:18px;height:18px}
.ft-folder{background:none;color:#5f7286}
.ft-folder svg{width:24px;height:24px;fill:#c9d4df;stroke:#8297ab}
.ft-pdf{background:#d64541} .ft-doc{background:#2b6cb0} .ft-xls{background:#2f855a} .ft-ppt{background:#dd6b20}
.ft-cad{background:#b7791f} .ft-img{background:#805ad5} .ft-zip{background:#718096} .ft-txt{background:#4a5568} .ft-other{background:#a0aec0}

/* afișare iconițe */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;padding:14px 8px}
.card{border:1px solid var(--line);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px;cursor:default;user-select:none;background:#fff;min-width:0}
.card:hover{background:#f6f8fa}
.card.sel{background:var(--accent-2);border-color:#b9d3e6}
.card.drop{outline:2px dashed var(--accent)}
.card .thumb{height:96px;border-radius:8px;background:var(--bg);display:grid;place-items:center;overflow:hidden}
.card .thumb img{width:100%;height:100%;object-fit:cover}
.card .thumb .ft{width:46px;height:46px;font-size:12px;border-radius:10px}
.card .thumb .ft-folder svg{width:52px;height:52px}
.card .c-name{display:flex;align-items:center;gap:8px;font-weight:500;min-width:0}
.card .c-name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.section-title{padding:14px 10px 4px;color:var(--muted);font-weight:600;font-size:12.5px}

.empty{display:grid;place-items:center;text-align:center;padding:60px 20px;color:var(--muted)}
.empty svg{width:56px;height:56px;stroke-width:1.2;color:#b5c2cf;margin-bottom:10px}
.empty b{display:block;color:var(--text);font-size:15px;margin-bottom:4px}

.drop-hint{position:absolute;inset:0;background:rgba(31,95,139,.07);border:2px dashed var(--accent);border-radius:14px 14px 0 0;display:none;place-items:center;pointer-events:none;z-index:5}
.drop-hint>div{background:var(--accent);color:#fff;padding:16px 24px;border-radius:12px;display:grid;justify-items:center;gap:4px;box-shadow:var(--shadow)}
.drop-hint svg{width:28px;height:28px}
.main.dragging .drop-hint{display:grid}

/* ---------- chat ---------- */
.chat{display:flex;flex-direction:column;background:var(--panel);border-left:1px solid var(--line);margin-top:8px;border-top:1px solid var(--line);border-radius:14px 0 0 0;min-height:0}
.chat-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line-2)}
.chat-head b{font-size:15px}
.chat-msgs{flex:1;overflow:auto;padding:10px 12px 6px;display:flex;flex-direction:column}
.msg{display:grid;grid-template-columns:30px 1fr;gap:9px;padding:5px 0}
.msg.cont{padding-top:0}
.msg.cont .avatar{visibility:hidden;height:0}
.msg-top{display:flex;align-items:baseline;gap:8px;margin-bottom:2px}
.msg-top b{font-size:13px}
.msg-top time{font-size:11px;color:var(--faint)}
.msg.cont .msg-top{display:none}
.msg-body{font-size:13.5px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere}
.msg.mine .msg-body{color:#0f2a40}
.day-sep{display:flex;align-items:center;gap:10px;color:var(--faint);font-size:11.5px;margin:12px 0 6px}
.day-sep::before,.day-sep::after{content:"";flex:1;height:1px;background:var(--line-2)}
.unread-sep{display:flex;align-items:center;gap:10px;color:var(--danger);font-size:11.5px;font-weight:600;margin:8px 0 4px}
.unread-sep::after{content:"";flex:1;height:1px;background:#f0b8b1}
.ref{display:inline-flex;align-items:center;gap:5px;background:var(--accent-2);color:var(--accent-ink);border:1px solid #cfe0ee;
  padding:1px 8px 1px 5px;border-radius:6px;cursor:pointer;font-weight:600;font-size:12.5px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:baseline}
.ref:hover{background:#d8e8f4}
.ref .ft{width:16px;height:16px;font-size:0;border-radius:3px}
.ref .ft-folder svg{width:16px;height:16px}
.ref.gone{background:#f3f3f3;color:var(--faint);border-color:var(--line);cursor:default;text-decoration:line-through}
.more-btn{align-self:center;margin:4px 0 10px}

.composer{position:relative;display:flex;gap:8px;align-items:flex-end;padding:10px 12px 12px;border-top:1px solid var(--line-2)}
.composer textarea{resize:none;max-height:140px;border-radius:18px;padding:9px 14px;line-height:1.4}
.send-btn{width:38px;height:38px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:grid;place-items:center;cursor:pointer;flex:none}
.send-btn:hover{background:var(--accent-ink)}
.mention-pop{position:absolute;left:12px;right:12px;bottom:calc(100% - 4px);background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);max-height:260px;overflow:auto;padding:5px;z-index:30}
.mention-pop .mi{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:7px;cursor:pointer}
.mention-pop .mi.on,.mention-pop .mi:hover{background:var(--accent-2)}
.mention-pop .mi .ft{width:22px;height:22px;font-size:7px;border-radius:5px}
.mention-pop .mi .ft-folder svg{width:20px;height:20px}
.mention-pop .mi div{min-width:0}
.mention-pop .mi b{display:block;font-weight:600;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mention-pop .mi small{display:block;color:var(--muted);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mention-pop .hint{padding:8px;color:var(--muted);font-size:12.5px}

/* ---------- upload, meniu contextual, modal, toast ---------- */
.uploads{position:fixed;right:calc(var(--chatw) + 18px);bottom:18px;width:360px;background:var(--panel);border-radius:12px;box-shadow:var(--shadow);border:1px solid var(--line);z-index:40;overflow:hidden}
.uploads-head{display:flex;align-items:center;justify-content:space-between;padding:8px 8px 8px 14px;background:#243443;color:#fff}
.uploads-head .icon-btn{color:#cdd6df}
.uploads-head .icon-btn:hover{background:rgba(255,255,255,.1);color:#fff}
.uploads-list{max-height:260px;overflow:auto}
.up{display:grid;grid-template-columns:24px 1fr auto;gap:10px;align-items:center;padding:9px 14px;border-bottom:1px solid var(--line-2)}
.up .ft{width:24px;height:24px;font-size:7px;border-radius:5px}
.up-name{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.up-bar{height:4px;background:var(--line-2);border-radius:2px;margin-top:5px;overflow:hidden}
.up-bar i{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.up-st{font-size:12px;color:var(--muted);white-space:nowrap}
.up.done .up-st{color:var(--ok)} .up.err .up-st{color:var(--danger)}
.up.err .up-bar i{background:var(--danger)}

.ctx{position:fixed;min-width:220px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:6px;z-index:60}
.ctx hr{border:0;border-top:1px solid var(--line-2);margin:5px 0}
.ctx .danger{color:var(--danger)} .ctx .danger svg{color:var(--danger)}

.modal-back{position:fixed;inset:0;background:rgba(18,28,40,.45);display:grid;place-items:center;padding:16px;z-index:80}
.modal{background:var(--panel);border-radius:14px;box-shadow:var(--shadow);width:100%;max-width:440px;max-height:calc(100vh - 32px);overflow:auto}
.modal.wide{max-width:640px}
.modal.preview{max-width:min(1100px,96vw);height:min(90vh,900px);display:flex;flex-direction:column;overflow:hidden}
.m-head{display:flex;align-items:center;gap:10px;padding:16px 16px 6px 20px}
.m-head h2{font-size:17px;margin:0;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-body{padding:8px 20px 6px}
.m-foot{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px 18px}
.preview .m-body{flex:1;padding:0 16px 16px;display:flex;min-height:0}
.preview iframe{flex:1;border:1px solid var(--line);border-radius:8px;background:#525659}
.preview .img-wrap{flex:1;display:grid;place-items:center;background:#20262d;border-radius:8px;overflow:auto}
.preview .img-wrap img{max-width:100%;max-height:100%;object-fit:contain}
.form{display:grid;gap:14px}
.check{display:flex!important;grid-template-columns:none!important;align-items:flex-start;gap:10px!important;font-weight:400!important;font-size:14px!important;cursor:pointer}
.check input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--accent)}
.kv{display:grid;grid-template-columns:120px 1fr;gap:8px 14px;font-size:13.5px;margin:4px 0 14px}
.kv dt{color:var(--muted)} .kv dd{margin:0;overflow-wrap:anywhere}
.vlist{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.vrow{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid var(--line-2);font-size:13px}
.vrow:last-child{border-bottom:0}
.vrow .grow{flex:1;min-width:0}
.tag{display:inline-block;font-size:11px;font-weight:700;padding:2px 7px;border-radius:10px;background:var(--accent-2);color:var(--accent-ink)}
.tag-red{background:#fdecea;color:#8a2a1f} .tag-green{background:#e7f4ec;color:#1f5e3b} .tag-gray{background:var(--line-2);color:var(--muted)}
.logl{font-size:12.5px;color:var(--muted);padding:5px 0;border-bottom:1px dashed var(--line-2)}
h3.sub{font-size:13px;margin:18px 0 8px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#243443;color:#fff;padding:11px 18px;border-radius:10px;box-shadow:var(--shadow);z-index:90;max-width:min(520px,92vw);font-size:13.5px}
.toast.err{background:var(--danger)}
.badge{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;border-radius:10px;background:var(--danger);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;padding:0 5px;border:2px solid #fff}

.only-mobile{display:none!important}
.scrim{display:none}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  :root{--chatw:300px;--side:220px}
  .list-head,.row{grid-template-columns:30px minmax(0,1fr) 130px 90px 40px}
  .col-by{display:none}
}
@media (max-width:900px){
  :root{--top:56px}
  .only-mobile{display:inline-grid!important}
  .hide-mobile{display:none}
  .brand{width:auto}
  .brand span{display:none}
  .layout{grid-template-columns:1fr}
  .sidebar{position:fixed;top:var(--top);bottom:0;left:0;width:280px;z-index:45;background:var(--bg);transform:translateX(-100%);transition:transform .2s;box-shadow:var(--shadow)}
  .sidebar.open{transform:none}
  .scrim.on{display:block;position:fixed;inset:var(--top) 0 0 0;background:rgba(18,28,40,.35);z-index:44}
  .main{margin:0;border-radius:0;border:0}
  .chat{position:fixed;inset:var(--top) 0 0 0;z-index:46;margin:0;border-radius:0;transform:translateX(100%);transition:transform .2s}
  .chat.open{transform:none}
  .chat-fab{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#fff;place-items:center;box-shadow:var(--shadow);z-index:35;cursor:pointer}
  .chat-fab svg{width:24px;height:24px}
  .list-head,.row{grid-template-columns:0 minmax(0,1fr) 40px}
  .files.selecting .list-head,.files.selecting .row{grid-template-columns:30px minmax(0,1fr) 40px}
  .col-date,.col-size,.col-by{display:none!important}
  .list-head{display:none}
  .row{height:auto;padding-top:8px;padding-bottom:8px}
  .row .r-txt>span.r-sub{display:block}
  .row .icon-btn{opacity:1}
  .uploads{left:12px;right:12px;width:auto;bottom:86px}
  .toolbar{padding-left:10px}
  .crumbs{font-size:15px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
}
.r-txt>span.r-sub{display:none;font-size:12px;color:var(--muted);font-weight:400;margin-top:1px}
.r-txt{min-width:0;overflow:hidden}
.r-txt>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- admin ---------- */
.admin-wrap{max-width:1000px;margin:0 auto;padding:20px 16px 60px;height:calc(100% - var(--top));overflow:auto}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:18px;overflow-x:auto}
.tabs button{border:0;background:none;padding:10px 14px;cursor:pointer;font-weight:600;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs button.on{color:var(--accent);border-bottom-color:var(--accent)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin-bottom:16px}
.panel h2{font-size:16px;margin:0 0 12px}
.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.tbl th{text-align:left;color:var(--muted);font-weight:600;font-size:12px;padding:8px 10px;border-bottom:1px solid var(--line)}
.tbl td{padding:10px;border-bottom:1px solid var(--line-2);vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl-wrap{overflow-x:auto}
.switch-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.switch{position:relative;width:46px;height:26px;flex:none}
.switch input{opacity:0;width:0;height:0}
.switch span{position:absolute;inset:0;background:#cbd3db;border-radius:13px;cursor:pointer;transition:.2s}
.switch span::before{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.switch input:checked+span{background:var(--ok)}
.switch input:checked+span::before{transform:translateX(20px)}
.copy-row{display:flex;gap:8px;margin-top:10px}
.copy-row input{font-family:ui-monospace,Consolas,monospace;font-size:12.5px;background:var(--bg)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.stat{background:var(--bg);border-radius:10px;padding:12px 14px}
.stat b{display:block;font-size:20px;margin-top:2px}

/* ---------- pagina de editare ---------- */
.editor-page{--edtop:64px;background:var(--bg)}
.ed-top{height:var(--edtop);display:flex;align-items:center;gap:12px;padding:0 14px;background:var(--panel);border-bottom:1px solid var(--line)}
.ed-back{display:grid;place-items:center;width:40px;height:40px;border-radius:10px}
.ed-back:hover{background:var(--line-2)}
.ed-title{min-width:0;flex:1}
.ed-name{display:flex;align-items:center;gap:8px;font-size:16px;min-width:0}
.ed-name b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.ft-mini{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;color:#fff;font-size:11px;font-weight:800;flex:none}
.ft-mini.ft-doc{background:#2b6cb0}.ft-mini.ft-xls{background:#2f855a}
.ed-sub{display:flex;align-items:center;gap:12px;font-size:12px;margin-top:2px;min-width:0;white-space:nowrap;overflow:hidden}
.ed-status{display:inline-flex;align-items:center;gap:6px;color:var(--muted)}
.ed-status i{width:8px;height:8px;border-radius:50%;background:#adb5bd;flex:none}
.ed-status.st-ok i{background:var(--ok)}
.ed-status.st-saving i{background:var(--warn);animation:pulse 1s infinite}
.ed-status.st-dirty i{background:var(--warn)}
.ed-status.st-err{color:var(--danger)} .ed-status.st-err i{background:var(--danger)}
@keyframes pulse{50%{opacity:.35}}
.ed-peers{display:flex;align-items:center}
.ed-peer{width:32px;height:32px;margin-left:-6px;border:2px solid var(--panel);font-size:12px;box-shadow:0 0 0 1px var(--line)}
.ed-peers:not(:empty)::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ok);margin-right:12px;box-shadow:0 0 0 4px rgba(46,125,79,.15)}
.ed-actions{display:flex;gap:8px;align-items:center}
.ed-actions .dropdown{right:0;left:auto;min-width:190px}
.ed-actions .btn svg{width:15px;height:15px}
.ed-banner{display:block;padding:9px 16px;font-size:13.5px;border-bottom:1px solid var(--line)}
.ed-banner.info{background:#eef5fb;color:#174a6d}
.ed-banner.warn{background:#fff4e5;color:#7a4a00}
.editor-page .ed-root{height:calc(100% - var(--edtop))}
.editor-page:has(.ed-banner:not([hidden])) .ed-root{height:calc(100% - var(--edtop) - 44px)}
@media (max-width:900px){.ed-sub .muted{display:none}.ed-top{gap:8px;padding:0 8px}}
.ed-banner .btn{margin-left:10px;vertical-align:middle}

/* ================= v2: Acasă, selecție multiplă, mutare, mod întunecat ================= */
:root{--hover:#f5f7fa;--input:#fff;--card:#fff;--ring:rgba(31,95,139,.18);--ease:cubic-bezier(.2,.7,.2,1)}
body.app{transition:background .2s}
.row,.card{transition:background .12s,border-color .12s,box-shadow .15s}
.row:hover,.card:hover{background:var(--hover)}
input[type=text],input[type=email],input[type=password],input[type=search],input:not([type]),textarea,select{background:var(--input);color:var(--text)}
.card{background:var(--card);position:relative}
.card:hover{box-shadow:0 4px 14px rgba(20,35,55,.07)}
.dropdown hr{border:0;border-top:1px solid var(--line-2);margin:5px 0}
.ft-xs{width:20px;height:20px;font-size:10px;border-radius:5px}
.ctx .accent{color:var(--accent);font-weight:600} .ctx .accent svg{color:var(--accent)}

/* checkbox de selecție */
.ck{display:grid;place-items:center;width:30px;height:30px;cursor:pointer;opacity:0;transition:opacity .12s}
.ck input{width:17px;height:17px;margin:0;accent-color:var(--accent);cursor:pointer}
.row:hover .ck,.card:hover .ck,.row.sel .ck,.card.sel .ck,.files.selecting .ck{opacity:1}
.card .ck{position:absolute;top:6px;left:6px;z-index:2;background:var(--card);border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.row.sel{background:var(--accent-2)!important}
.card.sel{background:var(--accent-2);border-color:#9fc3df;box-shadow:0 0 0 1px #9fc3df}
.sort-ar svg{width:14px;height:14px;transition:transform .15s}
.sort-ar.up svg{transform:rotate(180deg)}
.col-by{display:flex;align-items:center;gap:7px}
.col-by .avatar{width:22px;height:22px;font-size:9.5px}
.c-meta{font-size:12px;color:var(--muted);margin-top:-4px}

/* bara de selecție */
.toolbar{position:relative}
.sel-bar{position:absolute;inset:6px 8px;display:flex;align-items:center;gap:8px;background:var(--accent-2);border-radius:12px;padding:0 10px 0 6px;z-index:3;animation:pop .18s var(--ease)}
.sel-bar b{font-size:14px;color:var(--accent-ink);white-space:nowrap}
.sb-sp{flex:1}
.sel-bar .btn{background:var(--panel)}
.sel-bar .btn svg{width:16px;height:16px}
.sb-danger{color:var(--danger)}
@keyframes pop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* intrare animată a listei */
.listing.anim .row,.listing.anim .card{animation:rowIn .28s var(--ease) both}
.listing.anim .row:nth-child(2),.listing.anim .card:nth-child(1){animation-delay:.02s}
.listing.anim .row:nth-child(3),.listing.anim .card:nth-child(2){animation-delay:.04s}
.listing.anim .row:nth-child(4),.listing.anim .card:nth-child(3){animation-delay:.06s}
.listing.anim .row:nth-child(5),.listing.anim .card:nth-child(4){animation-delay:.08s}
.listing.anim .row:nth-child(n+6),.listing.anim .card:nth-child(n+5){animation-delay:.1s}
@keyframes rowIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}

/* cine editează acum */
.live-badge{display:inline-flex;align-items:center;gap:5px;margin-left:8px;padding:1px 8px 1px 6px;border-radius:10px;background:#e7f4ec;color:#1f5e3b;font-size:11px;font-weight:700;vertical-align:middle;white-space:nowrap}
.live-badge i{width:7px;height:7px;border-radius:50%;background:#2f9e44;box-shadow:0 0 0 0 rgba(47,158,68,.6);animation:live 1.6s infinite}
@keyframes live{70%{box-shadow:0 0 0 6px rgba(47,158,68,0)}100%{box-shadow:0 0 0 0 rgba(47,158,68,0)}}
.card .thumb{position:relative}
.card .thumb .live-badge{position:absolute;bottom:6px;left:6px;margin:0}
.r-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* mutare */
body.moving .t-row,body.moving .crumbs button{outline:1px dashed transparent}
.drag-ghost{position:fixed;top:-100px;left:0;padding:7px 12px;background:var(--accent);color:#fff;border-radius:8px;font-weight:600;font-size:13px;box-shadow:var(--shadow)}
.mv-crumbs{font-size:14px;margin:0 0 8px}
.mv-list{border:1px solid var(--line);border-radius:10px;max-height:300px;overflow:auto;min-height:120px}
.mv-row{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;padding:10px 12px;cursor:pointer;text-align:left;border-bottom:1px solid var(--line-2);color:var(--text)}
.mv-row:hover{background:var(--hover)}
.mv-row span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mv-row svg{color:var(--muted)}

/* ecranul Acasă */
.home{padding:18px 12px 4px}
.home-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:18px 20px;border-radius:16px;
  background:linear-gradient(120deg,#1f5f8b 0%,#2a7bb0 55%,#3a93c2 100%);color:#fff;position:relative;overflow:hidden}
.home-hero::after{content:"";position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.08)}
.home-hero::before{content:"";position:absolute;right:120px;bottom:-110px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.06)}
.home-hero h1{font-size:23px;margin:0 0 4px;letter-spacing:-.2px}
.home-hero .muted{color:rgba(255,255,255,.82);margin:0;font-size:13.5px}
.home-actions{display:flex;gap:8px;flex-wrap:wrap;position:relative;z-index:1}
.qa{display:flex;align-items:center;gap:9px;border:0;background:rgba(255,255,255,.96);color:#1d2733;padding:9px 14px 9px 9px;border-radius:11px;font-weight:600;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.12);transition:transform .15s var(--ease)}
.qa:hover{transform:translateY(-2px)}
.qa .ft{width:26px;height:26px;font-size:11px;border-radius:7px}
.qa-ico{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;background:var(--accent-2);color:var(--accent)}
.home-sec{margin-top:22px}
.home h2{font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:0 2px 10px}
.home-all{margin-top:26px!important;margin-bottom:0!important}
.rc-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.rc{display:flex;flex-direction:column;gap:6px;text-align:left;border:1px solid var(--line);background:var(--card);border-radius:12px;padding:12px;cursor:pointer;min-width:0;color:var(--text);transition:transform .15s var(--ease),box-shadow .15s}
.rc:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(20,35,55,.09)}
.rc-top{display:flex;align-items:center;justify-content:space-between;min-height:30px}
.rc-top .live-badge{margin:0}
.rc-name{font-weight:600;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rc-meta{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2px 18px}
.fd{display:flex;gap:10px;align-items:flex-start;padding:8px 4px;border-bottom:1px solid var(--line-2)}
.fd .avatar{width:28px;height:28px;font-size:11px}
.fd-txt{font-size:13.5px;line-height:1.45;min-width:0}
.fd-link{border:0;background:none;padding:0;color:var(--accent);font-weight:600;cursor:pointer;text-align:left;font-size:inherit;overflow-wrap:anywhere}
.fd-link:hover{text-decoration:underline}
.fd-time{font-size:11.5px;color:var(--faint)}
@media (max-width:900px){.home{padding:12px 6px 0}.home-hero{padding:16px}.home-hero h1{font-size:19px}.feed{grid-template-columns:1fr}.rc-row{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------------- mod întunecat ---------------- */
:root[data-theme=dark]{
  --bg:#0f1419;--panel:#171d24;--line:#2a333d;--line-2:#222a33;--text:#e3e8ee;--muted:#93a1af;--faint:#6b7886;
  --accent:#4a9fd6;--accent-2:#1b3346;--accent-ink:#9fd0f0;--hover:#1d252e;--input:#12181e;--card:#1a2129;
  --shadow:0 10px 30px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.3);color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#0f1419;--panel:#171d24;--line:#2a333d;--line-2:#222a33;--text:#e3e8ee;--muted:#93a1af;--faint:#6b7886;
  --accent:#4a9fd6;--accent-2:#1b3346;--accent-ink:#9fd0f0;--hover:#1d252e;--input:#12181e;--card:#1a2129;
  --shadow:0 10px 30px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.3);color-scheme:dark}}
:root[data-theme=dark] .t-row:hover{background:#1f2830}
:root[data-theme=dark] .ft-folder svg{fill:#3a4a5a;stroke:#6f8599}
:root[data-theme=dark] .row:hover{background:var(--hover)}
:root[data-theme=dark] .flash,:root[data-theme=dark] .row.flash{animation:flashD 1.6s ease}
@keyframes flashD{0%,40%{background:#4a3f12}100%{background:transparent}}
:root[data-theme=dark] .alert-err{background:#3a1c19;color:#f3b5ad}
:root[data-theme=dark] .alert-ok{background:#16301f;color:#a6dfb8}
:root[data-theme=dark] .live-badge{background:#16301f;color:#8fdba7}
:root[data-theme=dark] .ref{border-color:#2c4a63}
:root[data-theme=dark] .ref:hover{background:#21405a}
:root[data-theme=dark] .msg.mine .msg-body{color:var(--text)}
:root[data-theme=dark] .home-hero{background:linear-gradient(120deg,#123b57 0%,#1a5279 60%,#21648f 100%)}
:root[data-theme=dark] .qa{background:#202a34;color:var(--text)}
:root[data-theme=dark] .uploads-head{background:#0b1015}
:root[data-theme=dark] .ed-banner.info{background:#16283a;color:#b6d6ef}
:root[data-theme=dark] .ed-banner.warn{background:#33270f;color:#f0d29a}
:root[data-theme=dark] .ed-scroll{background:#0f1419}
:root[data-theme=dark] .auth-body{background:radial-gradient(1200px 500px at 50% -10%,#16283a 0%,var(--bg) 60%)}
:root[data-theme=dark] .card .ck{background:var(--card)}
:root[data-theme=dark] .unread-sep::after{background:#5a2a25}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .ft-folder svg{fill:#3a4a5a;stroke:#6f8599}
  :root:not([data-theme=light]) .home-hero{background:linear-gradient(120deg,#123b57 0%,#1a5279 60%,#21648f 100%)}
  :root:not([data-theme=light]) .qa{background:#202a34;color:var(--text)}
  :root:not([data-theme=light]) .live-badge{background:#16301f;color:#8fdba7}}
@media (max-width:900px){.files:not(.selecting) .ck{display:none}}
:root[data-theme=dark] .ref.gone{background:#222a33;border-color:#2a333d;color:#6b7886}

/* rezultate căutare în conținut */
.r-txt>span.r-snip{display:block;font-size:12.5px;color:var(--muted);font-weight:400;white-space:normal;line-height:1.45;margin-top:2px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.r-snip mark{background:#ffec99;color:#1d2733;border-radius:3px;padding:0 2px}
.snip-tag{font-size:10.5px;text-transform:uppercase;letter-spacing:.3px;color:var(--accent);background:var(--accent-2);border-radius:4px;padding:1px 5px;margin-right:6px}
.files .row:has(.r-snip){height:auto;padding-top:8px;padding-bottom:8px}
:root[data-theme=dark] .r-snip mark{background:#6b5a12;color:#fff}

/* ---------------- galerie foto ---------------- */
.icon-btn.on{background:var(--accent-2);color:var(--accent)}
.gal-day{display:flex;align-items:baseline;gap:10px;padding:18px 10px 8px}
.gal-day b{font-size:15px;text-transform:capitalize}
.gal-day span{font-size:12.5px;color:var(--muted)}
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px;padding:0 8px}
.gal-it{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--line-2);cursor:zoom-in}
.gal-it img{width:100%;height:100%;object-fit:cover;transition:transform .35s var(--ease)}
.gal-it:hover img{transform:scale(1.05)}
.gal-it .ck{position:absolute;top:6px;left:6px;z-index:2;background:rgba(255,255,255,.92);border-radius:8px}
.gal-it.sel{outline:3px solid var(--accent);outline-offset:-3px}
.gal-it.sel img{transform:scale(.92)}
.gal-cap{position:absolute;left:0;right:0;bottom:0;padding:18px 8px 6px;font-size:11.5px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.6));opacity:0;transition:opacity .2s}
.gal-it:hover .gal-cap{opacity:1}
.gal-more{padding:14px 10px}
@media (max-width:900px){.gal{grid-template-columns:repeat(3,1fr);gap:3px;padding:0 2px}.gal-it{border-radius:4px}.gal-cap{display:none}}

/* vizualizator poze */
.lb{position:fixed;inset:0;z-index:150;background:rgba(8,11,15,.96);display:flex;flex-direction:column;animation:fadeIn .18s}
@keyframes fadeIn{from{opacity:0}}
.lb-top{display:flex;align-items:center;gap:6px;padding:10px 12px;color:#fff;padding-top:max(10px,env(safe-area-inset-top))}
.lb-info{flex:1;min-width:0}
.lb-info b{display:block;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-info span{font-size:12px;color:#9aa8b6}
.lb-btn{width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;cursor:pointer;text-decoration:none}
.lb-btn:hover{background:rgba(255,255,255,.18)}
.lb-btn svg{width:20px;height:20px}
.lb-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:6px 60px 30px;touch-action:pan-y}
.lb-stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:3px;box-shadow:0 10px 40px rgba(0,0,0,.6);transition:opacity .2s;user-select:none;-webkit-user-drag:none}
.lb.loading .lb-stage img{opacity:.35}
.lb-spin{position:absolute;width:34px;height:34px;border:3px solid rgba(255,255,255,.2);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;display:none}
.lb.loading .lb-spin{display:block}
@keyframes spin{to{transform:rotate(360deg)}}
.lb-nav{position:absolute;top:50%;width:48px;height:48px;margin-top:-24px;border-radius:50%;border:0;background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center;cursor:pointer}
.lb-nav:hover{background:rgba(255,255,255,.2)}
.lb-nav svg{width:24px;height:24px}
.lb-prev{left:12px}.lb-prev svg{transform:rotate(180deg)}
.lb-next{right:12px}
.lb-count{position:absolute;bottom:10px;left:0;right:0;text-align:center;color:#9aa8b6;font-size:12.5px}
@media (max-width:900px){.lb-stage{padding:4px 4px 34px}.lb-nav{display:none}}
.crumbs button.cur{max-width:min(460px,70vw)}
