/* 小狐学伴 · 家长端 Web 样式
   桌面：固定左侧栏 236px + 主内容区；≤980px：侧栏折叠为顶部横向导航
   设计语言与学生端同源：奶油马卡龙 · 珊瑚橘主色 */

/* ---------- tokens ---------- */
:root{
  --cream:#FFF9F2;--card:#fff;--ink:#3B3440;--ink2:#7D7480;--ink3:#A79C93;--line:#F0E4D8;
  --coral:#F0805A;--coral-d:#D95F3D;--coral-bg:#FFF0E9;--mint:#6FBF9A;--mint-bg:#E8F6EF;
  --sky:#77AEE3;--sky-bg:#E9F3FC;--sun:#EFBE4E;--sun-bg:#FFF6E0;--lilac:#9C90D8;--lilac-bg:#F0EDFB;
  --danger:#D9534F;--danger-bg:#FDEEED;
  --side-w:236px;
  --shadow:0 10px 30px rgba(122,92,70,.12),0 2px 8px rgba(122,92,70,.06);
  --shadow-sm:0 4px 14px rgba(122,92,70,.09);
  --r:20px;--r-sm:14px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);background:
    radial-gradient(1000px 640px at 0% -10%,#FFE9DA 0%,rgba(255,233,218,0) 58%),
    radial-gradient(900px 620px at 100% 0%,#FFEDF3 0%,rgba(255,237,243,0) 60%),
    linear-gradient(165deg,#FFF9F2,#FFF4EA 62%,#FFF8F1);
  background-attachment:fixed;font-size:14px;-webkit-font-smoothing:antialiased;
}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.35;background-image:radial-gradient(#E8D6C6 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(180deg,#000,transparent 68%)}
a{color:inherit}
button{font-family:inherit}
svg{display:block}

/* ---------- 视图切换 ---------- */
body[data-view="login"] .side,body[data-view="login"] #main{display:none}
body[data-view="app"] .login-wrap{display:none}
.pane{display:none}
.pane.act{display:block}

/* ---------- 登录 ---------- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px;position:relative}
.login-card{width:100%;max-width:940px;background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:0 24px 70px rgba(122,92,70,.16);overflow:hidden;display:grid;grid-template-columns:1.05fr .95fr}
.login-left{padding:44px 46px;background:linear-gradient(160deg,#FFF6EE,#FFEFE4 70%,#FFE9E0);position:relative;overflow:hidden}
.login-left::after{content:"";position:absolute;right:-70px;bottom:-70px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(240,128,90,.28),rgba(240,128,90,0) 70%)}
.login-brand{display:flex;align-items:center;gap:12px;margin-bottom:34px}
.login-logo{width:46px;height:46px;border-radius:15px;background:linear-gradient(135deg,#FFB48F,#EE7850);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 22px rgba(224,104,68,.26)}
.login-brand b{font-size:18px;font-weight:800;letter-spacing:-.4px;display:block}
.login-brand span{font-size:11.5px;font-weight:700;color:var(--ink3);display:block;margin-top:2px}
.login-left h2{font-size:27px;line-height:1.35;letter-spacing:-.8px;margin:0 0 12px;font-weight:800}
.login-left p{font-size:13px;line-height:1.9;color:var(--ink2);font-weight:600;margin:0 0 26px;max-width:330px}
.login-points{display:flex;flex-direction:column;gap:12px;position:relative;z-index:1}
.login-points .pt{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;font-weight:700;color:#7A6656;line-height:1.7}
.login-points .pt i{width:22px;height:22px;border-radius:8px;background:#fff;border:1px solid #F2DBC9;display:flex;align-items:center;justify-content:center;flex:none;color:var(--coral-d);margin-top:1px}
.login-right{padding:44px 42px;display:flex;flex-direction:column;justify-content:center}
.login-right h3{font-size:21px;font-weight:800;letter-spacing:-.4px;margin:0 0 6px}
.login-right .hint{font-size:12px;font-weight:700;color:var(--ink3);margin:0 0 22px;line-height:1.7}
.role-seg{display:flex;gap:6px;background:#FBF3EB;border:1px solid var(--line);border-radius:14px;padding:5px;margin-bottom:18px}
.role-seg button{flex:1;height:38px;border:0;border-radius:10px;background:transparent;font-size:12.5px;font-weight:800;color:var(--ink2);cursor:pointer;transition:all .16s}
.role-seg button.on{background:#fff;color:var(--coral-d);box-shadow:0 3px 10px rgba(122,92,70,.12)}
.field{margin-bottom:14px}
.field label{display:block;font-size:11.5px;font-weight:800;color:var(--ink3);margin-bottom:7px;letter-spacing:.2px}
.input,.select{width:100%;height:46px;border:1px solid var(--line);border-radius:13px;background:#FFFDFB;padding:0 14px;font-family:inherit;font-size:13.5px;font-weight:700;color:var(--ink);outline:none;transition:border-color .16s,box-shadow .16s}
.input::placeholder{color:#C3B7AC;font-weight:600}
.input:focus,.select:focus{border-color:#F4B79E;box-shadow:0 0 0 3px rgba(240,128,90,.13);background:#fff}
.select{appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23A79C93' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px;cursor:pointer}
.code-row{display:flex;gap:9px}
.code-row .input{flex:1}
.code-row .btn{flex:none;height:46px;padding:0 15px;font-size:12.5px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:13px;border:0;font-size:13.5px;font-weight:800;cursor:pointer;background:linear-gradient(135deg,#F59572,#E5663F);color:#fff;box-shadow:0 8px 20px rgba(224,104,68,.24);transition:transform .16s,box-shadow .16s,opacity .16s;text-decoration:none;white-space:nowrap}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(224,104,68,.28)}
.btn:active{transform:translateY(0)}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.btn.ghost:hover{border-color:#E5D2C2;box-shadow:0 6px 16px rgba(122,92,70,.13)}
.btn.soft{background:var(--coral-bg);color:var(--coral-d);box-shadow:none}
.btn.danger{background:var(--danger-bg);color:var(--danger);box-shadow:none}
.btn.sm{height:36px;padding:0 13px;font-size:12px;border-radius:10px}
.btn.block{width:100%}
.agree{display:flex;gap:8px;align-items:flex-start;font-size:11.5px;font-weight:600;color:var(--ink2);line-height:1.7;margin:6px 0 16px;cursor:pointer}
.agree input{margin:3px 0 0;width:15px;height:15px;accent-color:var(--coral);cursor:pointer}
.agree a{color:var(--coral-d);font-weight:700;text-decoration:none}
.login-tip{margin-top:14px;font-size:11.5px;font-weight:700;color:var(--ink3);line-height:1.8;text-align:center}
.login-tip b{color:var(--coral-d)}
.err{font-size:11.5px;font-weight:800;color:var(--danger);margin:0 0 12px;min-height:16px}

/* ---------- 侧栏 ---------- */
.side{position:fixed;left:0;top:0;bottom:0;width:var(--side-w);background:rgba(255,253,250,.94);backdrop-filter:blur(14px);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:18px 14px;z-index:40}
.side-brand{display:flex;align-items:center;gap:10px;padding:4px 8px 18px}
.side-logo{width:40px;height:40px;border-radius:13px;background:linear-gradient(135deg,#FFB48F,#EE7850);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(224,104,68,.22);flex:none}
.side-brand b{display:block;font-size:14.5px;font-weight:800;letter-spacing:-.3px}
.side-brand span{display:block;font-size:10px;font-weight:700;color:var(--ink3);margin-top:2px}
.side-label{font-size:10px;font-weight:800;color:#BDAFA3;letter-spacing:1px;padding:8px 10px 6px}
.nav{display:flex;flex-direction:column;gap:3px}
.nav-item{display:flex;align-items:center;gap:11px;height:42px;padding:0 11px;border-radius:11px;font-size:13px;font-weight:800;color:var(--ink2);text-decoration:none;cursor:pointer;transition:background .15s,color .15s;border:0;background:transparent;width:100%;text-align:left}
.nav-item svg{flex:none;color:#B4A79A;transition:color .15s}
.nav-item:hover{background:#FDF5ED;color:var(--ink)}
.nav-item.active{background:linear-gradient(135deg,#FFF0E7,#FFE6D9);color:var(--coral-d);box-shadow:inset 0 0 0 1px #FBDCCB}
.nav-item.active svg{color:var(--coral-d)}
.nav-item .badge-dot{margin-left:auto;min-width:19px;height:19px;border-radius:10px;background:var(--coral);color:#fff;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 5px}
.nav-item .lk{margin-left:auto;font-size:9.5px;font-weight:800;color:#B9AEA3;background:#F8F1E9;padding:3px 6px;border-radius:6px}
.side-foot{margin-top:auto;border-top:1px solid var(--line);padding-top:12px}
.side-user{display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px;cursor:pointer;transition:background .15s}
.side-user:hover{background:#FDF5ED}
.avatar{width:34px;height:34px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:800;color:#fff;background:linear-gradient(135deg,#F5A184,#E5663F);flex:none}
.side-user .nm{font-size:12.5px;font-weight:800;line-height:1.3}
.side-user .rl{font-size:10px;font-weight:700;color:var(--ink3);margin-top:2px}
.side-user .out{margin-left:auto;color:#BFB2A7}
.role-toggle{margin-top:8px;width:100%;height:34px;border:1px dashed #E8D8CA;border-radius:10px;background:#FFFCF8;font-size:11px;font-weight:800;color:var(--ink3);cursor:pointer;transition:all .15s}
.role-toggle:hover{border-color:#F2BFA8;color:var(--coral-d);background:#FFF6EF}

/* ---------- 主区 ---------- */
#main{margin-left:var(--side-w);min-height:100vh}
.main-in{max-width:1240px;padding:24px 30px 60px;margin:0 auto}
.topbar{display:flex;align-items:center;gap:14px;margin-bottom:22px;flex-wrap:wrap}
.topbar h1{font-size:23px;font-weight:800;letter-spacing:-.6px;margin:0}
.topbar .crumb{font-size:11.5px;font-weight:700;color:var(--ink3);margin-top:4px}
.topbar .r{margin-left:auto;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.child-switch{display:flex;gap:5px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:4px;box-shadow:var(--shadow-sm)}
.child-switch button{height:30px;padding:0 12px;border:0;border-radius:9px;background:transparent;font-size:11.5px;font-weight:800;color:var(--ink2);cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .15s}
.child-switch button.on{background:var(--coral-bg);color:var(--coral-d)}
.child-switch i{width:7px;height:7px;border-radius:50%;background:#CBD5C9;display:block}
.child-switch i.on{background:var(--mint);box-shadow:0 0 0 3px rgba(111,191,154,.18)}
.role-pill{font-size:11px;font-weight:800;padding:7px 11px;border-radius:10px;background:#fff;border:1px solid var(--line);color:var(--ink2);box-shadow:var(--shadow-sm)}
.icon-btn{width:36px;height:36px;border-radius:11px;border:1px solid var(--line);background:#fff;color:var(--ink2);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-sm);transition:all .15s;position:relative}
.icon-btn:hover{color:var(--coral-d);border-color:#F4CDBC}
.icon-btn .dot{position:absolute;top:7px;right:8px;width:6px;height:6px;border-radius:50%;background:var(--coral);border:1.5px solid #fff}

/* ---------- 卡片与栅格 ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:20px;position:relative}
.card.pad0{padding:0;overflow:hidden}
.card .ch{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.card .ch h3{font-size:14.5px;font-weight:800;letter-spacing:-.2px;margin:0}
.card .ch .sub{font-size:11px;font-weight:700;color:var(--ink3);margin-top:2px;line-height:1.6}
.card .ch .r{margin-left:auto;display:flex;align-items:center;gap:8px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.g23{display:grid;grid-template-columns:1.45fr 1fr;gap:16px}
.g32{display:grid;grid-template-columns:1fr 1.45fr;gap:16px}
.row{display:flex;gap:16px}
.mt{margin-top:16px}
.mt8{margin-top:8px}
.hid{display:none!important}

/* ---------- KPI ---------- */
.kpi{background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:15px 16px;box-shadow:var(--shadow-sm)}
.kpi .lb{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;color:var(--ink3)}
.kpi .lb i{width:24px;height:24px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:none}
.kpi .vl{display:flex;align-items:baseline;gap:4px;margin-top:9px}
.kpi .vl b{font-size:26px;font-weight:800;letter-spacing:-1px;line-height:1}
.kpi .vl span{font-size:11.5px;font-weight:800;color:var(--ink3)}
.kpi .df{font-size:10.5px;font-weight:800;margin-top:7px;color:var(--ink3)}
.kpi .df.up{color:#4B9E79}
.kpi .df.down{color:#C4743F}

/* ---------- 图表 ---------- */
.bars{display:flex;align-items:flex-end;gap:10px;height:132px;padding-top:6px}
.bars .col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;height:100%}
.bars .col .b{width:100%;max-width:34px;border-radius:7px 7px 4px 4px;background:linear-gradient(180deg,#F7B7A0,#EE8A64);transition:height .5s ease;position:relative}
.bars .col .b.zero{background:#F3E9DF}
.bars .col .b.hi{background:linear-gradient(180deg,#8FD3B2,#5FB98F)}
.bars .col .v{font-size:9.5px;font-weight:800;color:var(--ink3);height:12px}
.bars .col .d{font-size:10px;font-weight:800;color:var(--ink3)}
.bars.dense{gap:4px}
.bars.dense .col .v{display:none}
.bars.dense .col .d{font-size:8px;white-space:nowrap}
.bars.dense .col .b{max-width:14px;border-radius:4px 4px 2px 2px}
.donut-wrap{display:flex;align-items:center;gap:20px}
.donut{width:132px;height:132px;border-radius:50%;position:relative;flex:none}
.donut::after{content:"";position:absolute;inset:19px;border-radius:50%;background:#fff;box-shadow:inset 0 2px 8px rgba(122,92,70,.06)}
.donut .ctr{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1}
.donut .ctr b{font-size:21px;font-weight:800;letter-spacing:-.7px}
.donut .ctr span{font-size:10px;font-weight:800;color:var(--ink3);margin-top:2px}
.legend{display:flex;flex-direction:column;gap:10px;flex:1}
.legend .lg{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--ink2)}
.legend .lg i{width:9px;height:9px;border-radius:3px;flex:none}
.legend .lg b{margin-left:auto;color:var(--ink);font-weight:800}
.legend .lg span{font-size:10.5px;color:var(--ink3);font-weight:800;width:34px;text-align:right}
.bar-row{display:flex;align-items:center;gap:10px;padding:8px 0}
.bar-row .nm{font-size:12px;font-weight:700;color:var(--ink2);width:74px;flex:none}
.bar-row .tr{flex:1;height:8px;border-radius:5px;background:#F4EAE1;overflow:hidden}
.bar-row .tr i{display:block;height:100%;border-radius:5px;transition:width .5s}
.bar-row .pc{font-size:11px;font-weight:800;width:38px;text-align:right;flex:none}
.bar-row .tg{font-size:9.5px;font-weight:800;color:#4B9E79;width:28px;text-align:right;flex:none}

/* ---------- 列表 / 任务 / 动态 ---------- */
.task{padding:11px 0;border-bottom:1px dashed #F2E6DA;display:flex;align-items:center;gap:11px}
.task:last-child{border-bottom:0;padding-bottom:0}
.task .ti{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex:none}
.task .tx{flex:1;min-width:0}
.task .tx b{display:block;font-size:12.5px;font-weight:800}
.task .tx span{display:block;font-size:10.5px;font-weight:700;color:var(--ink3);margin-top:2px}
.task .pg{width:78px;flex:none}
.task .pg .bar{height:6px;border-radius:4px;background:#F4EAE1;overflow:hidden}
.task .pg .bar i{display:block;height:100%;border-radius:4px}
.task .pg span{display:block;font-size:9.5px;font-weight:800;color:var(--ink3);margin-top:4px;text-align:right}
.act{display:flex;gap:10px;padding:10px 0;border-bottom:1px dashed #F2E6DA}
.act:last-child{border-bottom:0;padding-bottom:0}
.act .dt{width:6px;height:6px;border-radius:50%;background:var(--coral);margin-top:7px;flex:none}
.act .tx{flex:1;font-size:12px;font-weight:600;color:var(--ink2);line-height:1.7}
.act .tx b{color:var(--ink);font-weight:800;display:block;font-size:12.5px;margin-bottom:1px}
.act .tm{font-size:10px;font-weight:800;color:var(--ink3);flex:none}
.tipbar{display:flex;gap:10px;padding:11px 13px;border-radius:13px;background:#FFF6EC;border:1px solid #F6DFC8;font-size:11.5px;font-weight:700;color:#9A6A47;line-height:1.7;margin-top:10px}
.tipbar svg{flex:none;margin-top:1px}

/* ---------- 表格 ---------- */
.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.tbl th{text-align:left;font-size:10.5px;font-weight:800;color:var(--ink3);letter-spacing:.3px;padding:11px 14px;background:#FFFAF5;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:12px 14px;border-bottom:1px solid #F7EFE8;font-weight:600;color:var(--ink2);vertical-align:middle;line-height:1.6}
.tbl td b{color:var(--ink);font-weight:800}
.tbl tr:last-child td{border-bottom:0}
.tbl tbody tr:hover{background:#FFFCF9}
.tbl .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px;font-weight:700}
.tag{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:800;padding:3px 9px;border-radius:999px;background:var(--mint-bg);color:#4B9E79;white-space:nowrap}
.tag.beta{background:var(--sun-bg);color:#A87A15}
.tag.draft{background:#F4EFE9;color:#8A7F75}
.tag.review{background:var(--sky-bg);color:#3D77A8}
.tag.plan{background:#F3EFEA;color:#8A7F75}
.tag.dev{background:var(--lilac-bg);color:#6A5FA8}
.tag.p0{background:var(--coral-bg);color:var(--coral-d)}
.tag.red{background:var(--danger-bg);color:var(--danger)}

/* ---------- 表单 / 计划 ---------- */
.field-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px dashed #F2E6DA}
.field-row:last-child{border-bottom:0;padding-bottom:0}
.field-row .fl{flex:1;min-width:0}
.field-row .fl b{display:block;font-size:12.5px;font-weight:800}
.field-row .fl span{display:block;font-size:10.5px;font-weight:700;color:var(--ink3);margin-top:3px;line-height:1.6}
.field-row .fr{flex:none;display:flex;align-items:center;gap:8px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{height:32px;padding:0 13px;border-radius:10px;border:1px solid var(--line);background:#fff;font-size:11.5px;font-weight:800;color:var(--ink2);cursor:pointer;transition:all .15s}
.chip:hover{border-color:#F2C3AF}
.chip.on{background:var(--coral-bg);border-color:#F8CDBA;color:var(--coral-d)}
.stepper{display:flex;align-items:center;gap:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.stepper button{width:30px;height:32px;border:0;background:#FFFAF5;color:var(--ink2);font-size:15px;font-weight:800;cursor:pointer;line-height:1}
.stepper button:hover{background:var(--coral-bg);color:var(--coral-d)}
.stepper span{width:40px;text-align:center;font-size:12.5px;font-weight:800;color:var(--ink)}
.sw{width:40px;height:23px;border-radius:12px;background:#E8DCD1;position:relative;cursor:pointer;transition:background .18s;flex:none;border:0;padding:0}
.sw::after{content:"";position:absolute;top:2.5px;left:2.5px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.14);transition:transform .18s}
.sw.on{background:var(--mint)}
.sw.on::after{transform:translateX(17px)}
.seg{display:inline-flex;gap:4px;background:#FBF3EB;border:1px solid var(--line);border-radius:10px;padding:3px}
.seg button{height:28px;padding:0 12px;border:0;border-radius:8px;background:transparent;font-size:11.5px;font-weight:800;color:var(--ink2);cursor:pointer;transition:all .15s}
.seg button.on{background:#fff;color:var(--coral-d);box-shadow:0 2px 7px rgba(122,92,70,.12)}
.search{position:relative;flex:1;max-width:250px}
.search input{width:100%;height:34px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0 12px 0 32px;font-family:inherit;font-size:12px;font-weight:700;color:var(--ink);outline:none}
.search input::placeholder{color:#C3B7AC}
.search input:focus{border-color:#F4B79E;box-shadow:0 0 0 3px rgba(240,128,90,.11)}
.search svg{position:absolute;left:10px;top:9px;color:#C0B3A7}

/* ---------- 分页 / 空态 ---------- */
.pager{display:flex;align-items:center;gap:6px;padding:12px 14px;border-top:1px solid #F7EFE8}
.pager .info{font-size:11px;font-weight:700;color:var(--ink3);margin-right:auto}
.pager button{min-width:30px;height:30px;padding:0 8px;border:1px solid var(--line);border-radius:9px;background:#fff;font-size:11.5px;font-weight:800;color:var(--ink2);cursor:pointer}
.pager button.on{background:var(--coral-bg);border-color:#F8CDBA;color:var(--coral-d)}
.pager button:disabled{opacity:.45;cursor:not-allowed}
.empty{padding:44px 20px;text-align:center;color:var(--ink3);font-size:12.5px;font-weight:700;line-height:1.8}
.empty svg{margin:0 auto 10px;color:#DCCEC1}

/* ---------- 成员 / 设备 ---------- */
.mem{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px dashed #F2E6DA}
.mem:last-child{border-bottom:0;padding-bottom:0}
.mem .av{width:36px;height:36px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#fff;flex:none}
.mem .tx{flex:1;min-width:0}
.mem .tx b{display:block;font-size:12.5px;font-weight:800}
.mem .tx span{display:block;font-size:10.5px;font-weight:700;color:var(--ink3);margin-top:2px}
.child-card{border:1px solid var(--line);border-radius:var(--r-sm);padding:14px;background:#FFFDFB}
.child-card.on{border-color:#F6D1C0;background:linear-gradient(160deg,#FFF7F1,#FFF1E8)}
.child-card .hd2{display:flex;align-items:center;gap:10px}
.child-card .hd2 b{font-size:13px;font-weight:800}
.child-card .hd2 span{display:block;font-size:10.5px;font-weight:700;color:var(--ink3);margin-top:2px}
.child-card .st{display:flex;gap:10px;margin-top:11px;font-size:10.5px;font-weight:800;color:var(--ink3)}
.child-card .st b{color:var(--ink);font-size:12px}

/* ---------- 消息 ---------- */
.msg{display:flex;gap:11px;padding:13px;border-radius:13px;border:1px solid var(--line);background:#fff;margin-bottom:9px;transition:all .15s}
.msg.unread{background:#FFF8F1;border-color:#F8DCCB}
.msg .mi{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex:none}
.msg .tx{flex:1;min-width:0}
.msg .tx b{display:block;font-size:12.5px;font-weight:800}
.msg .tx p{font-size:11.5px;font-weight:600;color:var(--ink2);line-height:1.7;margin:3px 0 0}
.msg .tm{font-size:10px;font-weight:800;color:var(--ink3);flex:none}
.msg .rd{font-size:10.5px;font-weight:800;color:var(--coral-d);background:none;border:0;cursor:pointer;padding:0;margin-top:6px}

/* ---------- 弹窗 / toast ---------- */
.modal-back{position:fixed;inset:0;background:rgba(59,52,64,.36);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:24px;z-index:80}
.modal-back.act{display:flex}
.modal{width:100%;max-width:520px;max-height:86vh;overflow:auto;background:#fff;border-radius:22px;box-shadow:0 30px 80px rgba(59,52,64,.26);padding:22px}
.modal h3{font-size:17px;font-weight:800;margin:0 0 4px;letter-spacing:-.3px}
.modal .mh{display:flex;align-items:flex-start;gap:10px;margin-bottom:16px}
.modal .mh .x{margin-left:auto;width:30px;height:30px;border-radius:9px;border:1px solid var(--line);background:#fff;color:var(--ink2);cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none}
.modal .sub{font-size:11.5px;font-weight:700;color:var(--ink3);line-height:1.7;margin:4px 0 0}
.modal .mf{display:flex;gap:9px;margin-top:20px;justify-content:flex-end}
.modal .g2f{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.codebox{text-align:center;padding:18px;border-radius:16px;background:linear-gradient(160deg,#FFF6EC,#FFEDE1);border:1px dashed #F1CDB9;margin:6px 0 4px}
.codebox b{display:block;font-size:32px;font-weight:800;letter-spacing:8px;color:var(--coral-d);font-family:ui-monospace,Menlo,Consolas,monospace}
.codebox span{display:block;font-size:11px;font-weight:800;color:#9A6A47;margin-top:7px}
.toast{position:fixed;left:50%;bottom:34px;transform:translate(-50%,18px);background:#3B3440;color:#fff;font-size:12.5px;font-weight:800;padding:11px 18px;border-radius:12px;box-shadow:0 14px 34px rgba(59,52,64,.3);opacity:0;pointer-events:none;transition:all .24s;z-index:120;max-width:80vw;text-align:center;line-height:1.6}
.toast.on{opacity:1;transform:translate(-50%,0)}
.skel{height:13px;border-radius:7px;background:linear-gradient(90deg,#F3E9DF,#FBF5EF,#F3E9DF);background-size:200% 100%;animation:sk 1.1s linear infinite}
@keyframes sk{to{background-position:-200% 0}}

/* ---------- 响应式 ---------- */
@media (max-width:1180px){
  .g4{grid-template-columns:1fr 1fr}
}
@media (max-width:980px){
  .side{position:sticky;top:0;left:0;right:0;width:auto;bottom:auto;flex-direction:row;align-items:center;padding:10px 14px;border-right:0;border-bottom:1px solid var(--line);overflow-x:auto;gap:8px;backdrop-filter:blur(16px)}
  .side-brand{padding:0 6px 0 0;flex:none}
  .side-brand .tx{display:none}
  .side-label{display:none}
  .nav{flex-direction:row;gap:4px;flex:1;overflow-x:auto}
  .nav-item{width:auto;height:36px;padding:0 11px;font-size:12px;flex:none}
  .nav-item .badge-dot{margin-left:4px}
  .nav-item .lk{display:none}
  .side-foot{margin:0;border:0;padding:0;flex:none}
  .side-user{padding:4px}
  .side-user .tx,.side-user .out{display:none}
  .role-toggle{display:none}
  #main{margin-left:0}
  .main-in{padding:18px 16px 50px}
  .g2,.g3,.g23,.g32{grid-template-columns:1fr}
  .login-card{grid-template-columns:1fr}
  .login-left{padding:30px 30px 26px}
  .login-left h2{font-size:23px}
  .login-right{padding:30px}
}
@media (max-width:620px){
  .g4{grid-template-columns:1fr 1fr}
  .donut{width:110px;height:110px}
  .login-points{display:none}
  .topbar h1{font-size:19px}
  .modal .g2f{grid-template-columns:1fr}
}
@media print{
  body{background:#fff}
  body::before,.side,.topbar .r{display:none}
  #main{margin-left:0}
}
