:root{--side-w:248px;--brand:#1f6f54;--bg:#f4f6f5;--ink:#1d2a25}
body{background:var(--bg);color:var(--ink)}
a{text-decoration:none}
.min-w-0{min-width:0}
/* ---- shell ---- */
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--side-w);background:#13261f;padding:14px 10px;z-index:1040;overflow-y:auto;transition:transform .25s}
.sidebar .brand{display:flex;gap:10px;align-items:center;color:#fff;font-weight:700;font-size:20px;padding:6px 12px 18px}
.sidebar .nav-link{color:#cfe3da;border-radius:10px;display:flex;align-items:center;gap:10px;padding:9px 12px}
.sidebar .nav-link:hover{background:#1c382e;color:#fff}
.sidebar .nav-link.active{background:var(--brand);color:#fff}
.sidebar .nav-admin{margin-top:12px;border:1px dashed #3d6b59}
.shell-main{margin-left:var(--side-w)}
.topbar{position:sticky;top:0;height:56px;background:#fff;border-bottom:1px solid #e3e8e5;display:flex;align-items:center;gap:12px;padding:0 18px;z-index:1030}
#page{padding:22px;max-width:1180px}
.topsearch{position:relative;width:min(420px,50vw)}
.topsearch>i{position:absolute;left:10px;top:8px;color:#8a9a93}
.topsearch input{padding-left:32px;border-radius:20px}
.q-results{position:absolute;top:38px;left:0;right:0;background:#fff;border:1px solid #dfe5e2;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.12);padding:6px;z-index:2000}
.q-results a{display:flex;gap:10px;align-items:center;padding:6px 8px;border-radius:8px;color:inherit}
.q-results a:hover{background:#f1f5f3}
.q-results .grp{font-size:11px;text-transform:uppercase;color:#8a9a93;padding:4px 8px}
@media(max-width:991px){.sidebar{transform:translateX(-100%)}.sidebar.open{transform:none;box-shadow:0 0 0 100vmax rgba(0,0,0,.4)}.shell-main{margin-left:0}#page{padding:14px}}
.nav-badge{font-size:11px}.bell-badge{position:absolute;top:-6px;right:-6px;font-size:10px}
.notif-menu{width:340px;max-width:92vw}.notif-list{max-height:380px;overflow:auto}
.notif-item{display:block;padding:10px 14px;border-bottom:1px solid #eef2f0;color:inherit;font-size:14px}
.notif-item.unread{background:#eefaf4}.notif-item small{color:#8a9a93}
/* ---- avatar ---- */
.avatar{border-radius:50%;object-fit:cover;background:#dfe5e2;flex:none}
.avatar-sm{width:34px;height:34px}.avatar-lg{width:52px;height:52px}.avatar-xl{width:76px;height:76px}.avatar-xxl{width:112px;height:112px}
.avatar-ph{display:grid;place-items:center;background:#e4ebe8;color:#7b8c85;font-size:26px;border-radius:50%}
/* ---- toast ---- */
#toast-stack{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:3000;width:min(560px,94vw);display:flex;flex-direction:column;gap:8px;pointer-events:none}
.app-toast{pointer-events:auto;display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:12px;color:#fff;box-shadow:0 10px 30px rgba(0,0,0,.25);animation:drop .35s cubic-bezier(.2,.9,.3,1.2)}
.app-toast.out{animation:lift .25s forwards}
.t-success{background:#1f8a5b}.t-danger,.t-error{background:#c53030}.t-warning{background:#b7791f}.t-info,.t-debug{background:#2b6cb0}
.toast-x{background:none;border:0;color:#fff;font-size:22px;line-height:1;opacity:.8}.toast-x:hover{opacity:1}
@keyframes drop{from{transform:translateY(-130%);opacity:0}to{transform:none;opacity:1}}
@keyframes lift{to{transform:translateY(-130%);opacity:0}}
#nav-progress{position:fixed;top:0;left:0;height:3px;width:0;background:#38c98d;z-index:4000;transition:width .3s}
/* ---- common ---- */
.empty{text-align:center;color:#8a9a93;padding:34px 10px;background:#fff;border-radius:14px;border:1px dashed #d5ded9}
.empty i{font-size:34px;display:block;margin-bottom:6px}
.file-list .list-group-item{border-radius:12px;margin-bottom:6px;border:1px solid #e6ece9}
.hero{background:#fff;border-radius:18px;padding:36px;text-align:center}
.choice{display:flex;gap:10px;align-items:flex-start;border:1.5px solid #d5ded9;border-radius:12px;padding:10px 12px;cursor:pointer;height:100%}
.choice:has(input:checked){border-color:var(--brand);background:#eefaf4}
.choice small{display:block;color:#7b8c85;font-size:12px}
.pw-wrap{position:relative}.pw-wrap input{padding-right:42px}
.pw-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);border:0;background:none;color:#6b7b74;padding:6px 10px}
.bare-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:20px;background:linear-gradient(135deg,#13261f,#1f6f54)}
.bare-brand{color:#fff;font-weight:700;font-size:24px}.bare-card{background:#fff;border-radius:18px;padding:28px;width:min(520px,100%);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.profile-head{display:flex;gap:22px;align-items:center;background:#fff;border-radius:18px;padding:22px;flex-wrap:wrap}
.stat{background:#fff;border-radius:14px;padding:16px}.stat .n{font-size:30px;font-weight:700;color:var(--brand)}
.access-list{max-height:420px;overflow:auto;border:1px solid #e1e8e4;border-radius:12px;background:#fff}
.access-row{display:flex;gap:10px;align-items:center;padding:8px 10px;border-bottom:1px solid #eef2f0}
/* ---- chat ---- */
.chat-shell{display:flex;height:calc(100vh - 56px - 44px);background:#fff;border-radius:16px;overflow:hidden;border:1px solid #e1e8e4}
.chat-list{width:300px;border-right:1px solid #e8eeea;overflow:auto;flex:none}
.chat-item{display:flex;gap:10px;align-items:center;padding:10px 12px;color:inherit}.chat-item:hover,.chat-item.active{background:#eefaf4}
.chat-main{flex:1;display:flex;flex-direction:column;min-width:0}.chat-head{display:flex;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid #e8eeea}
.chat-msgs{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:6px;background:#f7faf8}
.bubble{max-width:72%;padding:8px 12px;border-radius:14px;background:#fff;border:1px solid #e3eae6;word-wrap:break-word;white-space:pre-wrap}
.bubble.mine{align-self:flex-end;background:#d9f5e6;border-color:#bfe9d1}.bubble small{display:block;color:#8a9a93;font-size:10px;text-align:right}
.chat-input{display:flex;gap:8px;padding:10px;border-top:1px solid #e8eeea}
@media(max-width:767px){.chat-list{width:100%}.chat-shell:has(.chat-msgs) .chat-list{display:none}}
/* ---- editor ---- */
body[data-layout=editor]{overflow:hidden}
#ed-top{position:fixed;top:0;left:0;right:0;height:52px;display:flex;align-items:center;gap:8px;padding:0 12px;background:#fff;border-bottom:1px solid #dfe5e2;z-index:100}
#luckysheet{position:absolute;left:0;top:52px;bottom:0;right:340px;margin:0;padding:0}
#ed-side{position:fixed;top:52px;right:0;bottom:0;width:340px;background:#fff;border-left:1px solid #dfe5e2;display:flex;flex-direction:column;z-index:90}
body.panel-hidden #ed-side{display:none}body.panel-hidden #luckysheet{right:0}
.side-sec{padding:10px 12px;border-bottom:1px solid #eef2f0;max-height:42%;overflow:auto}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tile{text-align:center;padding:6px 2px;border-radius:12px}
.tile .avatar{border:3px solid var(--c,#ccc);padding:1px}
.tile-name{font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tile-meta{font-size:11px;color:#7b8c85}
.feed{flex:1;overflow:auto;padding:10px 12px;display:flex;flex-direction:column;gap:6px;background:#f7faf8}
.feed-input{display:flex;gap:6px;padding:8px;border-top:1px solid #eef2f0}
.fmsg{display:flex;gap:8px;align-items:flex-start}.fmsg .body{background:#fff;border:1px solid #e3eae6;border-radius:12px;padding:6px 10px;font-size:13px;word-break:break-word}
.fmsg.mine{flex-direction:row-reverse}.fmsg.mine .body{background:#d9f5e6;border-color:#bfe9d1}
.fmsg b{font-size:12px}.fmsg time{font-size:10px;color:#8a9a93;margin-left:6px}
.fevent{font-size:12px;color:#5d6e67;background:#eef3f0;border-radius:10px;padding:5px 9px}.fevent b{color:#1d2a25}
.fsystem{font-size:11px;color:#8a9a93;text-align:center}