* { margin:0; padding:0; box-sizing:border-box; }
  :root{
    --rose:#d98a9b; --rose-deep:#c25e77; --gold:#c9a86a;
    --ink:#3a3140; --muted:#8b8290; --line:#ece4e8; --soft:#f7f2f5;
    --green:#4caf87; --blue:#5b8fd6; --orange:#e6a05a; --red:#e0574a;
    --brand-grad:linear-gradient(150deg,#c25e77 0%,#b06f8c 45%,#7f7fa8 100%);
    --sidebar-w:236px;
  }
  html,body{ height:100%; }
  body{
    font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
    color:var(--ink); background:#f4eef2; overflow:hidden;
  }
  ::-webkit-scrollbar{ width:8px; height:8px; }
  ::-webkit-scrollbar-thumb{ background:#d9c9d1; border-radius:8px; }
  ::-webkit-scrollbar-track{ background:transparent; }

  .app{ display:flex; height:100vh; }

  /* ============ 侧边栏 ============ */
  .sidebar{
    width:var(--sidebar-w); flex:0 0 var(--sidebar-w);
    background:var(--brand-grad); color:#fff;
    display:flex; flex-direction:column; position:relative; z-index:20;
    transition:flex-basis .28s ease, width .28s ease;
  }
  .app.collapsed .sidebar{ width:66px; flex-basis:66px; }
  .side-brand{
    display:flex; align-items:center; gap:11px; padding:20px 18px; height:70px;
    border-bottom:1px solid rgba(255,255,255,.14);
  }
  .side-brand .mark{
    width:34px; height:34px; flex:0 0 34px; border-radius:10px;
    background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35);
    display:flex; align-items:center; justify-content:center;
  }
  .side-brand .txt{ overflow:hidden; white-space:nowrap; }
  .side-brand .txt .n{ font-size:16px; font-weight:700; letter-spacing:1px; }
  .side-brand .txt .e{ font-size:10px; letter-spacing:2px; opacity:.7; text-transform:uppercase; }
  .app.collapsed .side-brand .txt{ display:none; }

  .menu{ flex:1; overflow-y:auto; padding:12px 10px; }
  .menu::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.3); }
  .menu .group{ font-size:11px; letter-spacing:1px; opacity:.5; padding:14px 12px 6px; }
  .app.collapsed .menu .group{ text-align:center; font-size:0; padding:8px 0; }
  .app.collapsed .menu .group::after{ content:"···"; font-size:12px; }
  .menu a{
    display:flex; align-items:center; gap:12px; padding:11px 12px; margin-bottom:3px;
    border-radius:10px; color:rgba(255,255,255,.82); text-decoration:none; font-size:14px;
    transition:background .18s, color .18s; position:relative; white-space:nowrap;
  }
  /* 菜单图标：纯 CSS 绘制（不使用 SVG） */
  .menu a .nico{ position:relative; width:19px; height:19px; flex:0 0 19px; display:inline-block; }
  .menu a .nico::before,.menu a .nico::after{ content:""; position:absolute; background:currentColor; }
  /* 工作台：四宫格 */
  .nico-wb::before{ left:0; top:0; width:8px; height:8px; border-radius:2.5px; box-shadow:11px 0 0 currentColor; }
  .nico-wb::after{ left:0; top:11px; width:8px; height:8px; border-radius:2.5px; box-shadow:11px 0 0 currentColor; }
  /* 客户档案：单人 */
  .nico-cust::before{ left:5.5px; top:1px; width:8px; height:8px; border-radius:50%; }
  .nico-cust::after{ left:1px; top:11px; width:17px; height:8px; border-radius:8px 8px 3px 3px; }
  /* 预约排期：日历 */
  .nico-appt{ background:
      linear-gradient(currentColor,currentColor) 4px 0/2px 4px no-repeat,
      linear-gradient(currentColor,currentColor) 13px 0/2px 4px no-repeat; }
  .nico-appt::before{ left:0; top:3px; width:19px; height:5px; border-radius:3px 3px 0 0; }
  .nico-appt::after{ left:0; top:10px; width:19px; height:9px; border-radius:0 0 3px 3px; }
  /* 项目消耗：爱心 */
  .nico-cons::before{ left:0; top:3.5px; width:9.5px; height:9.5px; border-radius:50%; box-shadow:9.5px 0 0 currentColor; }
  .nico-cons::after{ left:4.7px; top:7.5px; width:9.6px; height:9.6px; border-radius:2px; transform:rotate(45deg); }
  /* 会员储值：卡片 */
  .nico-mem::before{ left:0; top:3px; width:19px; height:4.5px; border-radius:3px 3px 0 0; }
  .nico-mem::after{ left:0; top:9.5px; width:19px; height:6.5px; border-radius:0 0 3px 3px; }
  /* 经营看板：柱状图 */
  .nico-dash::before{ left:1px; top:10px; width:4px; height:9px; border-radius:2px; box-shadow:14px 0 0 currentColor; }
  .nico-dash::after{ left:7.5px; top:4px; width:4px; height:15px; border-radius:2px; }
  /* 库存管理：收纳箱 */
  .nico-inv::before{ left:0; top:3px; width:19px; height:4px; border-radius:2px; }
  .nico-inv::after{ left:2px; top:9px; width:15px; height:10px; border-radius:0 0 3px 3px; }
  /* 员工管理：双人 */
  .nico-staff::before{ left:2px; top:3px; width:6px; height:6px; border-radius:50%; box-shadow:9px 0 0 currentColor; }
  .nico-staff::after{ left:0; top:11px; width:9px; height:8px; border-radius:5px 5px 2px 2px; box-shadow:10px 0 0 currentColor; }
  /* 门店管理：房屋 */
  .nico-store::before{ left:1px; top:1px; width:0; height:0; background:transparent; border-left:8.5px solid transparent; border-right:8.5px solid transparent; border-bottom:7.5px solid currentColor; }
  .nico-store::after{ left:2.5px; top:8.5px; width:14px; height:10.5px; border-radius:0 0 3px 3px; }
  /* 系统设置：滑杆 */
  .nico-set{ background:
      linear-gradient(currentColor,currentColor) 0 2px/19px 2px no-repeat,
      linear-gradient(currentColor,currentColor) 0 8.5px/19px 2px no-repeat,
      linear-gradient(currentColor,currentColor) 0 15px/19px 2px no-repeat; }
  .nico-set::before{ left:3px; top:0; width:6px; height:6px; border-radius:50%; box-shadow:3px 13px 0 currentColor; }
  .nico-set::after{ left:11px; top:6.5px; width:6px; height:6px; border-radius:50%; }
  .menu a:hover{ background:rgba(255,255,255,.12); color:#fff; }
  .menu a.active{ background:#fff; color:var(--rose-deep); font-weight:600; box-shadow:0 6px 16px -8px rgba(0,0,0,.4); }
  .menu a .badge{
    margin-left:auto; background:var(--gold); color:#fff; font-size:11px; font-weight:600;
    padding:1px 7px; border-radius:99px;
  }
  .menu a.active .badge{ background:var(--rose-deep); }
  .app.collapsed .menu a{ justify-content:center; padding:11px 0; }
  .app.collapsed .menu a span.lbl,.app.collapsed .menu a .badge{ display:none; }

  .side-foot{ padding:14px 16px; border-top:1px solid rgba(255,255,255,.14); font-size:12px; opacity:.7; }
  .app.collapsed .side-foot{ display:none; }

  /* ============ 主区 ============ */
  .main{ flex:1; display:flex; flex-direction:column; min-width:0; }
  .topbar{
    height:70px; flex:0 0 70px; background:#fff; border-bottom:1px solid var(--line);
    display:flex; align-items:center; padding:0 24px; gap:18px; z-index:15;
  }
  .collapse-btn{
    width:38px; height:38px; border:1px solid var(--line); background:#fff; border-radius:10px;
    cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--muted);
    transition:background .2s,color .2s;
  }
  .collapse-btn:hover{ background:var(--soft); color:var(--rose-deep); }
  .collapse-btn svg{ width:20px; height:20px; }
  .crumb{ font-size:14px; color:var(--muted); }
  .crumb b{ color:var(--ink); font-weight:600; }

  /* 门店切换器 */
  .store-switch{ margin-left:auto; position:relative; }
  .store-btn{
    display:flex; align-items:center; gap:9px; height:40px; padding:0 13px;
    border:1.5px solid var(--line); background:var(--soft); border-radius:10px; cursor:pointer;
    font-size:13px; color:var(--ink); font-weight:600; transition:.2s; max-width:220px;
  }
  .store-btn:hover{ border-color:var(--rose); background:#fff; }
  .store-btn svg.bico{ width:18px; height:18px; stroke:var(--rose-deep); flex:0 0 18px; }
  .store-btn .sname{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .store-btn .caret{ width:14px; height:14px; stroke:var(--muted); flex:0 0 14px; margin-left:auto; }
  .store-dd{ width:250px; }
  .store-dd .si{
    display:flex; align-items:center; gap:10px; padding:11px 16px; font-size:13.5px; cursor:pointer;
    transition:background .18s; border-bottom:1px solid #f6f1f4;
  }
  .store-dd .si:last-child{ border-bottom:none; }
  .store-dd .si:hover{ background:var(--soft); }
  .store-dd .si .sico{ width:30px; height:30px; flex:0 0 30px; border-radius:8px; background:#f4e7ec; display:flex; align-items:center; justify-content:center; }
  .store-dd .si .sico svg{ width:16px; height:16px; stroke:var(--rose-deep); }
  .store-dd .si .snm{ flex:1; min-width:0; }
  .store-dd .si .snm .s1{ font-weight:600; }
  .store-dd .si .snm .s2{ font-size:11px; color:var(--muted); margin-top:2px; }
  .store-dd .si .tick{ width:18px; height:18px; stroke:var(--rose-deep); opacity:0; flex:0 0 18px; }
  .store-dd .si.active .tick{ opacity:1; }
  .store-dd .si.active{ background:#fbf3f6; }

  .search{ position:relative; width:220px; }
  .search input{
    width:100%; height:40px; border:1.5px solid var(--line); border-radius:10px;
    padding:0 14px 0 38px; font-size:13px; background:var(--soft); color:var(--ink);
    transition:border-color .2s, background .2s, box-shadow .2s;
  }
  .search input:focus{ outline:none; border-color:var(--rose); background:#fff; box-shadow:0 0 0 4px rgba(217,138,155,.12); }
  .search svg{ position:absolute; left:12px; top:50%; transform:translateY(-50%); width:17px; height:17px; stroke:var(--muted); }

  .tb-icon{
    position:relative; width:40px; height:40px; border-radius:10px; border:none; background:transparent;
    cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--muted);
    transition:background .2s,color .2s;
  }
  .tb-icon:hover{ background:var(--soft); color:var(--rose-deep); }
  .tb-icon svg{ width:21px; height:21px; }
  .tb-icon .dot{
    position:absolute; top:7px; right:8px; min-width:16px; height:16px; padding:0 4px;
    background:var(--red); color:#fff; font-size:10px; font-weight:700; border-radius:99px;
    display:flex; align-items:center; justify-content:center; border:2px solid #fff;
  }
  .vdivider{ width:1px; height:26px; background:var(--line); }
  .user{
    display:flex; align-items:center; gap:10px; cursor:pointer; padding:5px 8px; border-radius:10px;
    transition:background .2s; position:relative;
  }
  .user:hover{ background:var(--soft); }
  .avatar{
    width:36px; height:36px; border-radius:50%; background:var(--brand-grad); color:#fff;
    display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700;
  }
  .user .uinfo{ line-height:1.25; }
  .user .uinfo .un{ font-size:13.5px; font-weight:600; }
  .user .uinfo .ur{ font-size:11px; color:var(--muted); }
  .user .caret{ width:14px; height:14px; stroke:var(--muted); }

  /* 下拉面板 */
  .dropdown{
    position:absolute; top:52px; right:0; width:300px; background:#fff; border-radius:14px;
    box-shadow:0 20px 50px -18px rgba(90,50,70,.4); border:1px solid var(--line);
    opacity:0; visibility:hidden; transform:translateY(-8px); transition:.22s; z-index:50; overflow:hidden;
  }
  .dropdown.show{ opacity:1; visibility:visible; transform:translateY(0); }
  .dd-head{ padding:14px 16px; border-bottom:1px solid var(--line); font-size:13px; font-weight:600; display:flex; justify-content:space-between; align-items:center; }
  .dd-head .clr{ font-size:12px; color:var(--rose-deep); cursor:pointer; font-weight:400; }
  .dd-list{ max-height:290px; overflow-y:auto; }
  .dd-item{ display:flex; gap:11px; padding:12px 16px; border-bottom:1px solid #f6f1f4; cursor:pointer; transition:background .18s; }
  .dd-item:hover{ background:var(--soft); }
  .dd-item .di-ic{ width:34px; height:34px; flex:0 0 34px; border-radius:9px; display:flex; align-items:center; justify-content:center; }
  .dd-item .di-ic svg{ width:17px; height:17px; }
  .dd-item .di-tx .t{ font-size:13px; font-weight:600; }
  .dd-item .di-tx .d{ font-size:11.5px; color:var(--muted); margin-top:2px; }
  .dd-item .di-tx .time{ font-size:11px; color:#b7aeb4; margin-top:3px; }
  .dd-foot{ padding:11px; text-align:center; font-size:12.5px; color:var(--rose-deep); cursor:pointer; }
  .dd-foot:hover{ background:var(--soft); }

  .menu-dd{ width:170px; }
  .menu-dd .mi{ display:flex; align-items:center; gap:9px; padding:11px 16px; font-size:13.5px; cursor:pointer; transition:background .18s; }
  .menu-dd .mi:hover{ background:var(--soft); color:var(--rose-deep); }
  .menu-dd .mi svg{ width:16px; height:16px; stroke:currentColor; }
  .menu-dd .sep{ height:1px; background:var(--line); margin:4px 0; }
  .menu-dd .mi.danger{ color:var(--red); }

  /* ============ 内容滚动区 ============ */
  .content{ flex:1; overflow-y:auto; padding:22px 24px 30px; }

  /* 欢迎横幅 */
  .welcome{
    position:relative; border-radius:18px; padding:24px 28px; color:#fff; overflow:hidden;
    background:var(--brand-grad); box-shadow:0 18px 40px -22px rgba(150,90,120,.7);
    display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  }
  .welcome::after{
    content:""; position:absolute; inset:0;
    background:radial-gradient(circle at 88% 10%, rgba(255,255,255,.22), transparent 42%),
               radial-gradient(circle at 10% 110%, rgba(255,255,255,.12), transparent 45%);
  }
  .welcome .wl{ position:relative; z-index:2; }
  .welcome h1{ font-size:22px; font-weight:700; }
  .welcome .sub{ margin-top:9px; font-size:13.5px; opacity:.9; line-height:1.7; }
  .welcome .acts{ position:relative; z-index:2; display:flex; gap:11px; flex-wrap:wrap; }
  .wbtn{
    display:inline-flex; align-items:center; gap:7px; height:42px; padding:0 18px; border-radius:11px;
    border:1px solid rgba(255,255,255,.5); background:rgba(255,255,255,.16); color:#fff;
    font-size:13.5px; font-weight:600; cursor:pointer; transition:.2s; backdrop-filter:blur(4px);
  }
  .wbtn:hover{ background:#fff; color:var(--rose-deep); }
  .wbtn.solid{ background:#fff; color:var(--rose-deep); border-color:#fff; }
  .wbtn.solid:hover{ filter:brightness(.96); }
  .wbtn svg{ width:17px; height:17px; stroke:currentColor; }

  /* 区块通用 */
  .section-title{ display:flex; align-items:center; justify-content:space-between; margin:26px 0 14px; }
  .section-title h2{ font-size:16px; font-weight:700; display:flex; align-items:center; gap:9px; }
  .section-title h2::before{ content:""; width:4px; height:16px; border-radius:3px; background:var(--rose); }
  .section-title .more{ font-size:12.5px; color:var(--muted); cursor:pointer; text-decoration:none; }
  .section-title .more:hover{ color:var(--rose-deep); }

  /* KPI 卡片 */
  .kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
  .kpi{
    background:#fff; border-radius:16px; padding:20px; border:1px solid var(--line);
    box-shadow:0 8px 24px -18px rgba(120,70,95,.5); position:relative; overflow:hidden;
    transition:transform .18s, box-shadow .22s;
  }
  .kpi:hover{ transform:translateY(-4px); box-shadow:0 18px 34px -18px rgba(120,70,95,.55); }
  .kpi .k-top{ display:flex; align-items:center; justify-content:space-between; }
  .kpi .k-label{ font-size:13px; color:var(--muted); }
  .kpi .k-ic{ width:42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center; }
  .kpi .k-ic svg{ width:22px; height:22px; }
  .kpi .k-val{ font-size:28px; font-weight:800; margin-top:14px; letter-spacing:.5px; }
  .kpi .k-val small{ font-size:15px; font-weight:600; margin-left:2px; }
  .kpi .k-trend{ margin-top:9px; font-size:12px; display:flex; align-items:center; gap:5px; }
  .up{ color:var(--green); } .down{ color:var(--red); }
  .k-trend .cmp{ color:var(--muted); }
  .kpi .spark{ position:absolute; right:0; bottom:0; width:100px; height:38px; opacity:.5; }

  /* 两栏布局 */
  .grid-2{ display:grid; grid-template-columns:1.55fr 1fr; gap:16px; }
  .grid-2b{ display:grid; grid-template-columns:1.55fr 1fr; gap:16px; }
  .card{
    background:#fff; border-radius:16px; border:1px solid var(--line);
    box-shadow:0 8px 24px -20px rgba(120,70,95,.5); overflow:hidden;
  }
  .card-h{ display:flex; align-items:center; justify-content:space-between; padding:17px 20px; border-bottom:1px solid var(--line); }
  .card-h h3{ font-size:15px; font-weight:700; }
  .card-b{ padding:8px 20px 18px; }
  .empty-state{ min-height:120px; display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:13px; }

  /* Tabs */
  .tabs{ display:flex; gap:6px; background:var(--soft); padding:4px; border-radius:10px; }
  .tabs button{
    border:none; background:transparent; padding:6px 15px; border-radius:8px; cursor:pointer;
    font-size:12.5px; color:var(--muted); font-weight:600; transition:.2s;
  }
  .tabs button.active{ background:#fff; color:var(--rose-deep); box-shadow:0 3px 10px -4px rgba(0,0,0,.2); }

  /* 预约时间轴 */
  .apt{ display:flex; gap:14px; padding:14px 4px; border-bottom:1px dashed var(--line); align-items:flex-start; }
  .apt:last-child{ border-bottom:none; }
  .apt .time{ flex:0 0 52px; text-align:center; }
  .apt .time .hh{ font-size:15px; font-weight:700; }
  .apt .time .mm{ font-size:11px; color:var(--muted); }
  .apt .line{ flex:0 0 auto; width:10px; display:flex; flex-direction:column; align-items:center; padding-top:4px; }
  .apt .line .pt{ width:10px; height:10px; border-radius:50%; background:var(--rose); box-shadow:0 0 0 4px rgba(217,138,155,.18); }
  .apt .body{ flex:1; }
  .apt .body .r1{ display:flex; align-items:center; gap:9px; }
  .apt .body .nm{ font-size:14px; font-weight:600; }
  .apt .status{ font-size:11px; padding:2px 9px; border-radius:99px; font-weight:600; margin-left:auto; }
  .st-done{ background:#e8f6ef; color:var(--green); }
  .st-doing{ background:#e9f0fb; color:var(--blue); }
  .st-wait{ background:#f2eef0; color:var(--muted); }
  .st-book{ background:#fbf1e6; color:var(--orange); }
  .apt .body .r2{ font-size:12.5px; color:var(--muted); margin-top:6px; display:flex; gap:14px; flex-wrap:wrap; }
  .apt .body .r2 span{ display:flex; align-items:center; gap:5px; }
  .apt .body .r2 svg{ width:14px; height:14px; stroke:currentColor; }

  /* 待办提醒 */
  .todo{ display:flex; align-items:center; gap:12px; padding:13px 4px; border-bottom:1px dashed var(--line); cursor:pointer; transition:.18s; border-radius:8px; }
  .todo:hover{ background:var(--soft); }
  .todo:last-child{ border-bottom:none; }
  .todo .t-ic{ width:40px; height:40px; flex:0 0 40px; border-radius:11px; display:flex; align-items:center; justify-content:center; }
  .todo .t-ic svg{ width:20px; height:20px; }
  .todo .t-tx{ flex:1; min-width:0; }
  .todo .t-tx .t{ font-size:13.5px; font-weight:600; }
  .todo .t-tx .d{ font-size:12px; color:var(--muted); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .todo .cnt{ font-size:12px; font-weight:700; color:#fff; padding:2px 9px; border-radius:99px; }

  /* 柱状图（近7日营收） */
  .chart{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; height:210px; padding:20px 6px 0; }
  .chart .bar-col{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; gap:9px; }
  .chart .bar{
    width:60%; max-width:38px; border-radius:8px 8px 4px 4px; background:linear-gradient(180deg,#e6a6b5,#c25e77);
    position:relative; transition:height .8s cubic-bezier(.2,.8,.3,1), filter .2s; cursor:pointer;
  }
  .chart .bar:hover{ filter:brightness(1.08); }
  .chart .bar.today{ background:linear-gradient(180deg,#dcc089,#c9a86a); }
  .chart .bar .v{
    position:absolute; top:-20px; left:50%; transform:translateX(-50%); font-size:11px; color:var(--muted);
    white-space:nowrap; font-weight:600; opacity:0; transition:opacity .2s;
  }
  .chart .bar:hover .v{ opacity:1; }
  .chart .x{ font-size:11.5px; color:var(--muted); }
  .chart .x.today{ color:var(--gold); font-weight:700; }
  .chart-legend{ display:flex; gap:18px; justify-content:center; padding:14px 0 4px; font-size:12px; color:var(--muted); }
  .chart-legend i{ width:11px; height:11px; border-radius:3px; display:inline-block; margin-right:6px; vertical-align:-1px; }

  /* 项目排行 */
  .rank{ padding:6px 0; }
  .rank .ri{ margin-bottom:16px; }
  .rank .ri:last-child{ margin-bottom:4px; }
  .rank .rl{ display:flex; align-items:center; gap:9px; font-size:13px; margin-bottom:7px; }
  .rank .no{ width:20px; height:20px; border-radius:6px; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; color:#fff; background:#cbb9c3; flex:0 0 20px; }
  .rank .no.n1{ background:var(--gold); } .rank .no.n2{ background:#b9a6b0; } .rank .no.n3{ background:#d6a98f; }
  .rank .nm{ font-weight:600; }
  .rank .pc{ margin-left:auto; color:var(--muted); font-size:12px; }
  .rank .track{ height:9px; background:var(--soft); border-radius:99px; overflow:hidden; }
  .rank .fill{ height:100%; border-radius:99px; background:linear-gradient(90deg,#e6a6b5,#c25e77); width:0; transition:width 1s cubic-bezier(.2,.8,.3,1); }

  /* 本月目标环形 */
  .goal-wrap{ display:flex; align-items:center; gap:22px; padding:16px 4px 8px; }
  .ring{ position:relative; width:132px; height:132px; flex:0 0 132px; }
  .ring svg{ transform:rotate(-90deg); }
  .ring .rv{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
  .ring .rv .p{ font-size:28px; font-weight:800; color:var(--rose-deep); }
  .ring .rv .l{ font-size:11.5px; color:var(--muted); margin-top:2px; }
  .goal-info{ flex:1; }
  .goal-info .gi{ display:flex; justify-content:space-between; font-size:13px; padding:9px 0; border-bottom:1px dashed var(--line); }
  .goal-info .gi:last-child{ border-bottom:none; }
  .goal-info .gi .k{ color:var(--muted); }
  .goal-info .gi .v{ font-weight:700; }

  /* Toast */
  .toast{
    position:fixed; top:22px; left:50%; transform:translateX(-50%) translateY(-20px); z-index:1000;
    background:rgba(58,49,64,.95); color:#fff; padding:12px 22px; border-radius:11px; font-size:13.5px;
    box-shadow:0 14px 34px -12px rgba(0,0,0,.45); opacity:0; pointer-events:none; transition:.3s; max-width:80vw;
  }
  .toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

  .fade-in{ animation:fadeUp .5s ease both; }
  @keyframes fadeUp{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:translateY(0); } }

  .quick-modal{ position:fixed; inset:0; z-index:1400; visibility:hidden; pointer-events:none; }
  .quick-modal.show{ visibility:visible; pointer-events:auto; }
  .quick-backdrop{ position:absolute; inset:0; background:rgba(38,26,38,.55); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); opacity:0; transition:opacity .28s; }
  .quick-modal.show .quick-backdrop{ opacity:1; }
  .quick-panel{ position:absolute; top:0; right:0; width:680px; max-width:96vw; height:100%; background:#fff; box-shadow:-18px 0 45px -22px rgba(60,30,50,.55); transform:translateX(102%); transition:transform .3s cubic-bezier(.2,.8,.3,1); overflow:hidden; }
  .quick-modal.show .quick-panel{ transform:translateX(0); }
  .quick-panel[data-kind="appointment"]{ width:600px; }
  .quick-panel[data-kind="consumption"]{ width:1220px; }
  .quick-panel iframe{ display:block; width:100%; height:100%; border:0; background:#fff; opacity:0; transition:opacity .18s; }
  .quick-panel.loaded iframe{ opacity:1; }
  .quick-close{ position:absolute; top:14px; right:16px; z-index:3; width:34px; height:34px; border:none; border-radius:10px; background:rgba(255,255,255,.92); color:var(--muted); box-shadow:0 5px 16px -8px rgba(50,25,40,.45); font-size:22px; line-height:1; cursor:pointer; transition:background .18s,color .18s; }
  .quick-close:hover{ background:var(--soft); color:var(--rose-deep); }
  .quick-loading{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:13px; background:#fff; z-index:1; }
  .quick-panel.loaded .quick-loading{ display:none; }
  body.quick-open{ overflow:hidden; }

  @media (max-width:1180px){
    .kpis{ grid-template-columns:repeat(2,1fr); }
    .grid-2,.grid-2b{ grid-template-columns:1fr; }
    .search{ width:170px; }
  }
  @media (max-width:640px){
    .sidebar{ width:66px; flex-basis:66px; }
    .side-brand .txt,.side-foot,.menu a span.lbl,.menu a .badge{ display:none; }
    .menu .group{ text-align:center; font-size:0; padding:8px 0; }
    .menu .group::after{ content:"···"; font-size:12px; }
    .menu a{ justify-content:center; padding:11px 0; }
    .topbar{ padding:0 10px; gap:8px; }
    .store-btn{ max-width:120px; }
    .vdivider{ display:none; }
    .kpis{ grid-template-columns:1fr; }
    .search,.crumb,.user .uinfo{ display:none; }
    .content{ padding:16px; }
    .quick-panel,.quick-panel[data-kind]{ left:0; right:auto; width:100vw; max-width:none; }
  }

  /* ===================================================================
     通用分级弹框组件  (Notify 轻提示 + Dialog 模态框)
     层级：toast(1000) < notify(1200) < dialog(1300)
     =================================================================== */
  /* ---------- Notify：右上角堆叠、自动消失、进度条、悬停暂停 ---------- */
  .yy-notify{
    --yy-info:#5b8fd6; --yy-info-bg:#eaf1fb;
    --yy-warn:#e6a05a; --yy-warn-bg:#fbf1e6;
    --yy-ok:#4caf87;   --yy-ok-bg:#e8f6ef;
    --yy-err:#e0574a;  --yy-err-bg:#fdecec;
    position:fixed; top:20px; right:20px; z-index:1200;
    display:flex; flex-direction:column; gap:11px; width:346px; max-width:calc(100vw - 32px);
    pointer-events:none;
  }
  .yy-note{
    pointer-events:auto; position:relative; overflow:hidden;
    display:flex; align-items:flex-start; gap:11px;
    background:#fff; border:1px solid var(--line); border-left:4px solid var(--muted);
    border-radius:13px; padding:13px 14px 14px;
    box-shadow:0 16px 38px -14px rgba(50,25,40,.42), 0 4px 12px -6px rgba(50,25,40,.2);
    opacity:0; transform:translateX(26px) scale(.97);
    transition:opacity .3s ease, transform .34s cubic-bezier(.2,1,.3,1);
  }
  .yy-note.in{ opacity:1; transform:translateX(0) scale(1); }
  .yy-note.out{ opacity:0; transform:translateX(26px) scale(.97); }
  .yy-note .ni{ flex:0 0 24px; width:24px; height:24px; border-radius:8px; display:flex; align-items:center; justify-content:center; margin-top:1px; }
  .yy-note .ni svg{ width:15px; height:15px; }
  .yy-note .nb{ flex:1; min-width:0; }
  .yy-note .nt{ font-size:13.5px; font-weight:700; color:var(--ink); }
  .yy-note .nm{ font-size:12.5px; color:var(--muted); margin-top:3px; line-height:1.5; word-break:break-word; }
  .yy-note .nx{ flex:0 0 auto; border:none; background:none; color:#b9b0bd; font-size:19px; line-height:1; cursor:pointer; padding:0 2px; margin:-1px -2px 0 0; transition:color .18s; }
  .yy-note .nx:hover{ color:var(--ink); }
  .yy-note .nbar{ position:absolute; left:0; bottom:0; height:3px; width:100%; transform-origin:left center; background:currentColor; opacity:.55; }
  @keyframes yyBar{ from{ transform:scaleX(1); } to{ transform:scaleX(0); } }
  .yy-note.info{ border-left-color:var(--yy-info); }
  .yy-note.info .ni{ background:var(--yy-info-bg); color:var(--yy-info); }
  .yy-note.info .nbar{ color:var(--yy-info); }
  .yy-note.warn{ border-left-color:var(--yy-warn); background:#fffdf9; }
  .yy-note.warn .ni{ background:var(--yy-warn-bg); color:var(--yy-warn); }
  .yy-note.warn .nbar{ color:var(--yy-warn); }
  .yy-note.ok{ border-left-color:var(--yy-ok); }
  .yy-note.ok .ni{ background:var(--yy-ok-bg); color:var(--yy-ok); }
  .yy-note.ok .nbar{ color:var(--yy-ok); }
  .yy-note.err{ border-left-color:var(--yy-err); background:#fffafa; }
  .yy-note.err .ni{ background:var(--yy-err-bg); color:var(--yy-err); }
  .yy-note.err .nbar{ color:var(--yy-err); }

  /* ---------- Dialog：居中模态、遮罩、可确认/取消、ESC 关闭 ---------- */
  .yy-dlg-mask{
    --yy-info:#5b8fd6; --yy-info-bg:#eaf1fb;
    --yy-warn:#e6a05a; --yy-warn-bg:#fbf1e6;
    --yy-ok:#4caf87;   --yy-ok-bg:#e8f6ef;
    --yy-err:#e0574a;  --yy-err-bg:#fdecec;
    position:fixed; inset:0; z-index:1300; display:flex; align-items:center; justify-content:center; padding:22px;
    background:rgba(46,34,44,.5); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
    opacity:0; transition:opacity .26s ease;
  }
  .yy-dlg-mask.in{ opacity:1; }
  .yy-dlg{
    width:420px; max-width:100%; background:#fff; border-radius:18px; overflow:hidden;
    box-shadow:0 30px 70px -18px rgba(50,25,40,.55), 0 8px 24px -12px rgba(50,25,40,.4);
    transform:translateY(16px) scale(.97); opacity:0;
    transition:transform .3s cubic-bezier(.2,1.2,.4,1), opacity .26s ease;
  }
  .yy-dlg-mask.in .yy-dlg{ transform:translateY(0) scale(1); opacity:1; }
  .yy-dlg .dh{ display:flex; align-items:center; gap:11px; padding:19px 22px 15px; }
  .yy-dlg .di{ flex:0 0 30px; width:30px; height:30px; border-radius:9px; display:flex; align-items:center; justify-content:center; }
  .yy-dlg .di svg{ width:18px; height:18px; }
  .yy-dlg .dt{ font-size:16px; font-weight:700; color:var(--ink); }
  .yy-dlg .dbody{ padding:0 22px 18px; font-size:13.5px; color:var(--muted); line-height:1.65; word-break:break-word; }
  .yy-dlg .dbody.hasmsg{ padding-left:63px; }
  .yy-dlg .df{ padding:14px 22px 18px; display:flex; justify-content:flex-end; gap:10px; }
  .yy-dlg .dbtn{ min-width:78px; height:40px; padding:0 18px; border-radius:11px; font-size:13.5px; font-weight:700; cursor:pointer; border:1.5px solid var(--line); background:#fff; color:var(--ink); transition:filter .2s, transform .12s, background .2s, border-color .2s, color .2s; font-family:inherit; }
  .yy-dlg .dbtn:hover{ transform:translateY(-1px); }
  .yy-dlg .dbtn.cancel:hover{ border-color:var(--rose); color:var(--rose-deep); background:#fbf3f6; }
  .yy-dlg .dbtn.primary{ border:none; color:#fff; background:var(--brand-grad); box-shadow:0 10px 22px -10px rgba(194,94,119,.7); }
  .yy-dlg .dbtn.primary:hover{ filter:brightness(1.06); }
  .yy-dlg.info .di{ background:var(--yy-info-bg); color:var(--yy-info); }
  .yy-dlg.warn .di{ background:var(--yy-warn-bg); color:var(--yy-warn); }
  .yy-dlg.ok   .di{ background:var(--yy-ok-bg);   color:var(--yy-ok); }
  .yy-dlg.err  .di{ background:var(--yy-err-bg);  color:var(--yy-err); }
  .yy-dlg.ok  .dbtn.primary{ background:linear-gradient(135deg,#5cbf95,#4caf87); box-shadow:0 10px 22px -10px rgba(76,175,135,.6); }
  .yy-dlg.warn .dbtn.primary{ background:linear-gradient(135deg,#eab06a,#e0913f); box-shadow:0 10px 22px -10px rgba(224,145,63,.6); }
  .yy-dlg.err .dbtn.primary{ background:linear-gradient(135deg,#e9776b,#e0574a); box-shadow:0 10px 22px -10px rgba(224,87,74,.6); }

  /* ---------- 弹框组件演示区 ---------- */
  .popdemo{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px 20px; box-shadow:0 8px 22px -20px rgba(120,70,95,.5); }
  .popdemo .pd-row{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
  .popdemo .pd-lbl{ font-size:12.5px; color:var(--muted); font-weight:700; min-width:96px; }
  .popdemo .pd-sep{ height:1px; background:var(--line); margin:14px 0; }
  .pd-btn{ display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 15px; border-radius:10px; border:1.5px solid var(--line); background:#fff; font-size:13px; font-weight:600; cursor:pointer; transition:transform .16s, filter .2s, background .2s, border-color .2s, color .2s; font-family:inherit; color:var(--ink); }
  .pd-btn:hover{ transform:translateY(-1px); }
  .pd-btn svg{ width:15px; height:15px; stroke:currentColor; }
  .pd-btn.info:hover{ border-color:#5b8fd6; color:#4a7cc0; background:#f3f8fe; }
  .pd-btn.warn:hover{ border-color:#e6a05a; color:#cf8b41; background:#fdf7ef; }
  .pd-btn.ok:hover{ border-color:#4caf87; color:#3d9a75; background:#f1faf5; }
  .pd-btn.err:hover{ border-color:#e0574a; color:#c9493d; background:#fdf2f1; }

  /* ========================================================================
     全局加载组件 (Loader 全屏遮罩 z1400 + Progress 顶部进度 z1500 + 按钮内联)
     ======================================================================== */
  .yy-loader{ position:fixed; inset:0; z-index:1400; display:flex; align-items:center; justify-content:center;
    background:rgba(250,246,249,.82); -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px);
    opacity:1; visibility:visible; transition:opacity .38s ease, visibility .38s ease; }
  .yy-loader.hide{ opacity:0; visibility:hidden; pointer-events:none; }
  .yy-loader .yl-box{ display:flex; flex-direction:column; align-items:center; gap:20px; }
  .yy-loader .yl-ring{ width:74px; height:74px; position:relative; display:flex; align-items:center; justify-content:center; }
  .yy-loader .yl-ring i{ position:absolute; border-radius:50%; border:3px solid transparent; box-sizing:border-box; }
  .yy-loader .yl-ring i.o{ inset:0; border-top-color:#c25e77; border-right-color:#d98a9b; animation:ylSpin 1.05s linear infinite; }
  .yy-loader .yl-ring i.n{ inset:11px; border-bottom-color:#c9a86a; border-left-color:#e0c48f; animation:ylSpin 1.5s linear infinite reverse; }
  .yy-loader .yl-mark{ width:34px; height:34px; border-radius:50%; background:var(--brand-grad); color:#fff;
    font-size:16px; font-weight:800; display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 16px -6px rgba(194,94,119,.7); animation:ylPulse 1.6s ease-in-out infinite; }
  .yy-loader .yl-text{ display:flex; align-items:center; gap:4px; color:var(--rose-deep); font-size:14px; font-weight:600; letter-spacing:.5px; }
  .yy-loader .yl-msg{ }
  .yy-loader .dots{ display:inline-flex; gap:3px; align-items:flex-end; height:16px; }
  .yy-loader .dots i{ width:4px; height:4px; border-radius:50%; background:var(--rose-deep); animation:ylDot 1.2s ease-in-out infinite; }
  .yy-loader .dots i:nth-child(2){ animation-delay:.18s; }
  .yy-loader .dots i:nth-child(3){ animation-delay:.36s; }
  @keyframes ylSpin{ to{ transform:rotate(360deg); } }
  @keyframes ylPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.09); } }
  @keyframes ylDot{ 0%,60%,100%{ opacity:.3; transform:translateY(0); } 30%{ opacity:1; transform:translateY(-5px); } }

  /* 顶部流动进度条 */
  .yy-progress{ position:fixed; top:0; left:0; right:0; height:3px; z-index:1500; opacity:0; transition:opacity .3s ease; pointer-events:none; }
  .yy-progress.on{ opacity:1; }
  .yy-progress i{ display:block; height:100%; width:0; border-radius:0 2px 2px 0;
    background:linear-gradient(90deg,#d98a9b,#c25e77 45%,#c9a86a); box-shadow:0 0 10px rgba(194,94,119,.6);
    transition:width .35s cubic-bezier(.4,0,.2,1); }
  .yy-progress.err i{ background:linear-gradient(90deg,#e08a80,#e0574a); box-shadow:0 0 10px rgba(224,87,74,.6); }

  /* 按钮内联加载态 */
  .btn-loading{ position:relative; pointer-events:none; color:transparent !important; }
  .btn-loading > *{ visibility:hidden; }
  .btn-loading::after{ content:""; position:absolute; top:50%; left:50%; width:16px; height:16px; margin:-8px 0 0 -8px;
    border-radius:50%; border:2px solid rgba(255,255,255,.45); border-top-color:#fff; animation:ylSpin .7s linear infinite; }
  .btn-ghost.btn-loading::after, .pd-btn.btn-loading::after{ border:2px solid rgba(194,94,119,.28); border-top-color:var(--rose-deep); }