/* GotoAI X 企业工作台 · 共享设计系统（深/浅双主题） */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --accent:#06B6D4;--accent2:#0891B2;--ok:#10B981;--warn:#F59E0B;--danger:#EF4444;--purple:#8B5CF6;
  --bg:#0B0B12;--panel:#12121C;--panel2:#171724;--line:rgba(255,255,255,.08);--ink:#E7E9EE;--muted:#8A8F9E;--chipBg:rgba(255,255,255,.06);
  --hover:rgba(255,255,255,.04);--shadow:0 8px 24px rgba(0,0,0,.45);
}
[data-theme="light"]{
  --bg:#F4F5F9;--panel:#FFFFFF;--panel2:#F8F9FC;--line:#E6E8F0;--ink:#1A1D26;--muted:#6B7280;--chipBg:#F0F2F7;
  --hover:#F3F5FA;--shadow:0 8px 24px rgba(20,30,60,.08);
}
body{font-family:"Instrument Sans","PingFang SC","Microsoft YaHei",system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.6;transition:background .3s,color .3s}
a{color:inherit;text-decoration:none}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--chipBg);border-radius:4px}
svg.ic{width:18px;height:18px;flex-shrink:0}

/* ===== 布局骨架 ===== */
.app{display:flex;min-height:100vh}
.side{width:228px;background:var(--panel);border-right:1px solid var(--line);position:fixed;top:0;bottom:0;left:0;display:flex;flex-direction:column;z-index:50;transition:background .3s}
.main{flex:1;margin-left:228px;display:flex;flex-direction:column;min-width:0}
.content{padding:22px 26px;flex:1}
.brand{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line)}
.brand .logo{width:38px;height:38px;border-radius:11px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.brand .logo img{width:100%;height:100%;object-fit:contain}
.brand b{font-size:15px;display:block;line-height:1.2}
.brand span{font-size:11px;color:var(--muted)}
.nav{flex:1;padding:12px 12px;overflow-y:auto}
.nav .grp{font-size:11px;color:var(--muted);padding:14px 12px 6px;letter-spacing:.05em}
.nav a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;font-size:13.5px;color:var(--muted);margin-bottom:2px;transition:all .18s;position:relative}
.nav a:hover{background:var(--hover);color:var(--ink)}
.nav a.on{background:var(--accent);color:#fff;font-weight:600}
.nav a .cnt{margin-left:auto;background:var(--danger);color:#fff;font-size:10px;padding:1px 6px;border-radius:8px;font-weight:600}
.nav a.on .cnt{background:rgba(255,255,255,.25)}
.user{padding:14px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px}
.user .u-ava{width:36px;height:36px;border-radius:10px;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0}
.user b{font-size:13px;display:block;line-height:1.3}
.user span{font-size:11px;color:var(--muted)}

/* ===== 顶栏 ===== */
.topbar{height:60px;background:var(--panel);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 26px;position:sticky;top:0;z-index:40;transition:background .3s}
.topbar h1{font-size:16px;font-weight:700}
.topbar .crumb{font-size:12px;color:var(--muted)}
.search{flex:1;max-width:360px;display:flex;align-items:center;gap:8px;background:var(--chipBg);border:1px solid var(--line);border-radius:10px;padding:7px 12px;margin-left:auto}
.search input{background:none;border:none;outline:none;color:var(--ink);font-size:13px;flex:1;font-family:inherit}
.search input::placeholder{color:var(--muted)}
.icon-btn{width:38px;height:38px;border-radius:10px;background:var(--chipBg);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--muted);cursor:pointer;position:relative;transition:all .18s}
.icon-btn:hover{color:var(--ink);border-color:var(--accent)}
.icon-btn .dot{position:absolute;top:8px;right:9px;width:7px;height:7px;border-radius:50%;background:var(--danger);border:2px solid var(--panel)}
.icon-btn.sun{color:var(--warn)}
.ava{width:36px;height:36px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;flex-shrink:0;position:relative}
.ava .st{position:absolute;right:-2px;bottom:-2px;width:10px;height:10px;border-radius:50%;background:var(--ok);border:2px solid var(--panel)}
.ava.sm{width:28px;height:28px;font-size:11px;border-radius:8px}
.ava.lg{width:52px;height:52px;font-size:19px;border-radius:14px}

/* ===== 卡片与网格 ===== */
.grid{display:grid;gap:16px}
.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}
.g21{grid-template-columns:2fr 1fr}.g12{grid-template-columns:1fr 2fr}
@media(max-width:1200px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}.g21,.g12{grid-template-columns:1fr}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 20px;transition:border-color .18s}
.card:hover{border-color:rgba(6,182,212,.35)}
.sec-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.sec-head h2{font-size:14.5px;font-weight:700;display:flex;align-items:center;gap:8px}
.sec-head h2 svg{width:17px;height:17px;color:var(--accent)}
.sec-head .sub{font-size:12px;color:var(--muted);margin-left:auto}
.kpi .lab{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:7px;margin-bottom:8px}
.kpi .val{font-size:26px;font-weight:700;letter-spacing:-.02em}
.kpi .del{font-size:11.5px;margin-top:6px;font-weight:600}
.up{color:var(--ok)}.down{color:var(--danger)}
.kpi .kic{width:34px;height:34px;border-radius:10px;background:rgba(6,182,212,.13);color:var(--accent);display:flex;align-items:center;justify-content:center;float:right}
.kpi .kic svg{width:17px;height:17px}

/* ===== 表格 ===== */
.tbl-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-size:11.5px;color:var(--muted);font-weight:600;padding:9px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:11px 12px;border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:middle}
tr:last-child td{border-bottom:none}
tbody tr{transition:background .15s;cursor:default}
tbody tr:hover{background:var(--hover)}
td .cell-main{font-weight:600}
td .cell-sub{font-size:11.5px;color:var(--muted);margin-top:1px}

/* ===== 徽章 / 标签 / chips ===== */
.tag{display:inline-flex;align-items:center;gap:5px;font-size:11px;padding:2.5px 9px;border-radius:6px;font-weight:600;white-space:nowrap}
.tag::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.tag.ok{background:rgba(16,185,129,.12);color:var(--ok)}
.tag.warn{background:rgba(245,158,11,.12);color:var(--warn)}
.tag.danger{background:rgba(239,68,68,.12);color:var(--danger)}
.tag.info{background:rgba(6,182,212,.12);color:var(--accent)}
.tag.purple{background:rgba(139,92,246,.12);color:var(--purple)}
.tag.gray{background:var(--chipBg);color:var(--muted)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{font-size:12px;padding:5.5px 14px;border-radius:8px;background:var(--chipBg);border:1px solid var(--line);color:var(--muted);cursor:pointer;transition:all .18s;font-family:inherit}
.chip:hover{color:var(--ink);border-color:var(--accent)}
.chip.on{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}

/* ===== 按钮 ===== */
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:#fff;border:none;border-radius:9px;padding:8.5px 16px;font-size:13px;font-weight:600;cursor:pointer;transition:filter .18s;font-family:inherit}
.btn:hover{filter:brightness(1.12)}
.btn.ghost{background:var(--chipBg);color:var(--ink);border:1px solid var(--line)}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent);filter:none}
.btn.sm{padding:5px 11px;font-size:12px;border-radius:7px}
.btn svg{width:15px;height:15px}

/* ===== 看板 ===== */
.kanban{display:flex;gap:14px;overflow-x:auto;padding-bottom:6px}
.kcol{min-width:252px;flex:1;background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:12px}
.kcol-h{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;padding:2px 6px 12px}
.kcol-h .n{font-size:11px;color:var(--muted);background:var(--chipBg);padding:1px 8px;border-radius:8px}
.kcol-h .amt{margin-left:auto;font-size:11.5px;color:var(--muted);font-weight:500}
.kcard{background:var(--panel2);border:1px solid var(--line);border-radius:11px;padding:12px;margin-bottom:10px;transition:border-color .18s}
.kcard:hover{border-color:var(--accent)}
.kcard b{font-size:13px;display:block;margin-bottom:7px}
.kcard .meta{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--muted)}
.kcard .amt{font-size:14px;font-weight:700;color:var(--accent);margin:6px 0 2px}
.kcard .ops{display:flex;gap:6px;margin-top:9px;opacity:0;transition:opacity .15s}
.kcard:hover .ops{opacity:1}

/* ===== 进度条 / 漏斗 ===== */
.prog{height:7px;background:var(--chipBg);border-radius:4px;overflow:hidden}
.prog i{display:block;height:100%;border-radius:4px;background:var(--accent);transition:width 1s cubic-bezier(.4,0,.2,1)}
.funnel-row{display:flex;align-items:center;gap:12px;margin-bottom:11px}
.funnel-row .fl{width:76px;font-size:12.5px;color:var(--muted);flex-shrink:0;text-align:right}
.funnel-row .fb{flex:1}
.funnel-row .fv{width:88px;font-size:12px;font-weight:600;flex-shrink:0}

/* ===== 时间轴 / 列表 ===== */
.tl{position:relative;padding-left:20px}
.tl::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--line)}
.tl-item{position:relative;padding-bottom:16px}
.tl-item::before{content:"";position:absolute;left:-19px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--accent);border:2px solid var(--panel)}
.tl-item.warn::before{background:var(--warn)}
.tl-item.ok::before{background:var(--ok)}
.tl-item .t{font-size:11.5px;color:var(--muted);margin-bottom:2px}
.tl-item b{font-size:13px}
.tl-item p{font-size:12px;color:var(--muted);margin-top:3px}
.li{display:flex;align-items:center;gap:11px;padding:11px 6px;border-bottom:1px solid var(--line)}
.li:last-child{border-bottom:none}
.li .li-b{flex:1;min-width:0}
.li b{font-size:13px;display:block}
.li .sub{font-size:11.5px;color:var(--muted);margin-top:2px}
.ck{width:17px;height:17px;border-radius:5px;border:1.5px solid var(--line);cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;transition:all .15s}
.ck.done{background:var(--ok);border-color:var(--ok)}
.ck.done::after{content:"✓";font-size:11px}
.li.done b{text-decoration:line-through;color:var(--muted)}

/* ===== 排行榜 ===== */
.rank{display:flex;align-items:center;gap:11px;padding:9px 4px}
.rank .no{width:24px;height:24px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;background:var(--chipBg);color:var(--muted);flex-shrink:0}
.rank .no.g{background:rgba(245,158,11,.15);color:#F59E0B}
.rank .no.s{background:rgba(148,163,184,.18);color:#94A3B8}
.rank .no.b{background:rgba(205,127,50,.16);color:#CD7F32}
.rank .r-b{flex:1}
.rank b{font-size:13px}
.rank .v{font-size:12px;color:var(--muted)}

/* ===== 日历（简版） ===== */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal .wd{text-align:center;font-size:11px;color:var(--muted);padding:5px 0}
.cal .d{min-height:66px;background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:6px 7px;font-size:11.5px;position:relative}
.cal .d .n{color:var(--muted);font-weight:600}
.cal .d.today{border-color:var(--accent)}
.cal .d.today .n{color:var(--accent)}
.cal .d .ev{font-size:10px;padding:1.5px 5px;border-radius:4px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev.b{background:rgba(6,182,212,.15);color:var(--accent)}
.ev.g{background:rgba(16,185,129,.15);color:var(--ok)}
.ev.o{background:rgba(245,158,11,.15);color:var(--warn)}
.cal .d.pad{background:none;border:none}

/* ===== 抽屉 / 弹窗 ===== */
.mask{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:90;opacity:0;pointer-events:none;transition:opacity .25s}
.mask.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:-440px;bottom:0;width:430px;background:var(--panel);border-left:1px solid var(--line);z-index:95;transition:right .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;padding:22px 24px}
.drawer.on{right:0}
.drawer-h{display:flex;align-items:center;gap:10px;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:16px}
.drawer-h h3{font-size:15px}
.drawer-h .x{margin-left:auto;cursor:pointer;color:var(--muted);font-size:18px;line-height:1}
.drawer-h .x:hover{color:var(--ink)}
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-46%) scale(.97);width:min(520px,92vw);background:var(--panel);border:1px solid var(--line);border-radius:16px;z-index:96;opacity:0;pointer-events:none;transition:all .25s;padding:22px 24px;max-height:86vh;overflow-y:auto}
.modal.on{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.f-row{margin-bottom:13px}
.f-row label{font-size:12px;color:var(--muted);display:block;margin-bottom:6px;font-weight:600}
.f-row input,.f-row select,.f-row textarea{width:100%;background:var(--chipBg);border:1px solid var(--line);border-radius:9px;padding:9px 12px;color:var(--ink);font-size:13px;outline:none;font-family:inherit;transition:border-color .18s}
.f-row input:focus,.f-row select:focus,.f-row textarea:focus{border-color:var(--accent)}
.f-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* ===== 通知下拉 ===== */
.dd{position:fixed;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);width:330px;z-index:80;opacity:0;pointer-events:none;transform:translateY(-6px);transition:all .2s;overflow:hidden}
.dd.on{opacity:1;pointer-events:auto;transform:translateY(0)}
.dd-h{padding:13px 16px;font-size:13px;font-weight:700;border-bottom:1px solid var(--line);display:flex}
.dd-h .cnt{margin-left:auto;color:var(--danger);font-size:11px}
.dd-b{max-height:330px;overflow-y:auto}
.dd-f{padding:10px;border-top:1px solid var(--line);text-align:center;font-size:12px;color:var(--accent);cursor:pointer;font-weight:600}

/* ===== 空态 / toast / 动效 ===== */
.empty{text-align:center;padding:36px 10px;color:var(--muted);font-size:12.5px}
.empty svg{width:40px;height:40px;opacity:.4;margin-bottom:8px}
.toast{position:fixed;left:50%;bottom:34px;transform:translate(-50%,60px);background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:11px 20px;font-size:13px;box-shadow:var(--shadow);z-index:99;opacity:0;transition:all .3s;display:flex;align-items:center;gap:8px}
.toast.on{transform:translate(-50%,0);opacity:1}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.rise{animation:rise .5s cubic-bezier(.4,0,.2,1) both}
.typing::after{content:"▌";color:var(--accent);animation:blink 1s step-end infinite}
@keyframes blink{50%{opacity:0}}
.foot{margin-top:22px;padding-top:16px;border-top:1px solid var(--line);display:flex;font-size:11.5px;color:var(--muted)}
.foot span:last-child{margin-left:auto;display:flex;align-items:center;gap:6px}
.foot i{width:7px;height:7px;border-radius:50%;background:var(--ok);display:inline-block}
.page-tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:16px}
.page-tabs button{background:none;border:none;color:var(--muted);font-size:13px;padding:9px 16px;cursor:pointer;font-family:inherit;position:relative;font-weight:600}
.page-tabs button.on{color:var(--accent)}
.page-tabs button.on::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--accent);border-radius:2px}

/* ===== 图例 legend (.filt / .cal-lg 共用) ===== */
.filt,.cal-lg{display:flex;gap:16px;margin-top:8px;font-size:11.5px;color:var(--muted);flex-wrap:wrap}
.filt span,.cal-lg span{display:inline-flex;align-items:center;gap:5px}
.filt i,.cal-lg i{width:10px;height:10px;border-radius:3px;display:inline-block}
.filt i.g,.cal-lg i.g{background:var(--ok)}
.filt i.b,.cal-lg i.b{background:var(--accent)}
.filt i.o,.cal-lg i.o{background:var(--warn)}
.filt i.s,.cal-lg i.s{background:var(--danger)}
