/* 每日作业 · 共享样式（Mom端 / Kid端） */
:root{ --radius:18px; --radius-sm:12px; }
body.mom{
  --bg:#f2f4f8; --card:#ffffff; --text:#263042; --sub:#7a8499;
  --accent:#4f5ee8; --accent-soft:#eceefe; --accent-text:#3b49c9;
  --ok:#1faa6b; --ok-soft:#e5f7ef; --warn:#e8612c; --warn-soft:#fdeee6;
  --chip:#f1f3f8; --chip-active:#4f5ee8; --chip-active-text:#fff;
  --line:#e8ebf2; --shadow:0 4px 16px rgba(40,50,90,.08);
  background:var(--bg);
}
body.kid{
  --bg:#fff8e9; --card:#ffffff; --text:#3a2e1e; --sub:#9b8a6b;
  --accent:#ff9f1c; --accent-soft:#fff1d6; --accent-text:#c76c00;
  --ok:#1faa6b; --ok-soft:#e5f7ef; --warn:#ff5a5f; --warn-soft:#ffe8e8;
  --chip:#fdf3dd; --chip-active:#ff9f1c; --chip-active-text:#fff;
  --line:#f3e8d2; --shadow:0 6px 18px rgba(200,140,30,.15);
  background:linear-gradient(180deg,#fff8e9 0%,#fdf1da 100%);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
body{
  font-family:"PingFang SC","Microsoft YaHei",-apple-system,sans-serif;
  color:var(--text); min-height:100vh; padding-bottom:40px;
}
body.kid{font-size:17px;}
.wrap{max-width:520px;margin:0 auto;padding:0 14px;}

header{
  position:sticky;top:0;z-index:50;
  background:var(--card);box-shadow:var(--shadow);
  border-radius:0 0 22px 22px;padding:12px 16px 14px;
}
.header-row{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.logo{font-size:20px;font-weight:800;display:flex;align-items:center;gap:8px;}
.logo .date{font-size:12px;font-weight:500;color:var(--sub);display:block;margin-top:2px;}
.online-dot{font-size:12px;font-weight:700;color:var(--sub);display:flex;align-items:center;gap:5px;white-space:nowrap;}
.online-dot i{width:9px;height:9px;border-radius:99px;background:#bbb;display:inline-block;}
.online-dot.on i{background:#1faa6b;}
.online-dot.on{color:#14875a;}

.tabs{display:flex;gap:10px;margin:16px 0 4px;}
.tabs button{
  flex:1;border:none;border-radius:var(--radius-sm);padding:12px 8px;
  font-size:15px;font-weight:800;font-family:inherit;cursor:pointer;transition:.2s;
  background:var(--card);color:var(--sub);box-shadow:var(--shadow);
}
.tabs button.active{background:var(--accent);color:#fff;}
body.kid .tabs button{font-size:17px;padding:15px 8px;border-radius:16px;}

.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;margin-top:14px;}
.card h3{font-size:16px;margin-bottom:12px;display:flex;align-items:center;gap:6px;}
.card h3 .spacer{flex:1;}
.link-btn{border:none;background:none;color:var(--accent-text);font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;padding:4px 6px;}

.seg{display:flex;background:var(--chip);border-radius:999px;padding:4px;margin-bottom:12px;}
.seg button{
  flex:1;border:none;background:transparent;padding:9px 6px;border-radius:999px;
  font-size:14px;font-weight:700;color:var(--sub);cursor:pointer;font-family:inherit;transition:.2s;
}
.seg button.active{background:var(--card);color:var(--accent-text);box-shadow:0 2px 6px rgba(0,0,0,.12);}

.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.chip{
  border:none;border-radius:999px;padding:9px 16px;font-size:14px;font-weight:700;
  background:var(--chip);color:var(--text);cursor:pointer;font-family:inherit;transition:.15s;
}
.chip.active{background:var(--chip-active);color:var(--chip-active-text);transform:scale(1.05);}
body.kid .chip{font-size:16px;padding:11px 18px;}

.field{margin-bottom:12px;}
.field label{display:block;font-size:13px;font-weight:700;color:var(--sub);margin-bottom:6px;}
.field input[type=text],.field textarea{
  width:100%;border:2px solid var(--line);border-radius:var(--radius-sm);
  padding:11px 12px;font-size:15px;font-family:inherit;background:var(--card);color:var(--text);
  outline:none;transition:border .2s;
}
.field input:focus,.field textarea:focus{border-color:var(--accent);}
.field textarea{resize:vertical;min-height:64px;}
.radio-row{display:flex;gap:10px;}
.radio-row label{
  flex:1;display:flex;align-items:center;justify-content:center;gap:6px;
  border:2px solid var(--line);border-radius:var(--radius-sm);padding:11px;
  font-size:14px;font-weight:700;cursor:pointer;transition:.2s;
}
.radio-row input{display:none;}
.radio-row label.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text);}
.btn-main{
  width:100%;border:none;border-radius:var(--radius-sm);padding:14px;
  background:var(--accent);color:#fff;font-size:16px;font-weight:800;
  cursor:pointer;font-family:inherit;box-shadow:0 4px 12px rgba(0,0,0,.15);transition:.15s;
}
.btn-main:active{transform:scale(.97);}
body.kid .btn-main{font-size:19px;padding:16px;border-radius:16px;}

.hw-item{
  border:2px solid var(--line);border-radius:var(--radius-sm);padding:13px 14px;
  margin-bottom:10px;transition:.25s;background:var(--card);
}
.hw-item.done{border-color:var(--ok);background:var(--ok-soft);}
.hw-item.reminded{border-color:var(--warn);}
.hw-item.shake{animation:shake .5s;}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
.hw-top{display:flex;align-items:flex-start;gap:8px;}
.hw-title{font-size:16px;font-weight:800;flex:1;line-height:1.4;}
body.kid .hw-title{font-size:18px;}
.hw-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px;}
.tag{font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--chip);color:var(--sub);}
.tag.sec{background:var(--accent-soft);color:var(--accent-text);}
.tag.mode{border:1.5px dashed var(--accent-text);background:transparent;color:var(--accent-text);}
.remind-badge{
  display:inline-flex;align-items:center;gap:4px;margin-top:7px;
  font-size:12px;font-weight:800;color:var(--warn);background:var(--warn-soft);
  padding:4px 10px;border-radius:999px;
}
.hw-actions{display:flex;gap:8px;margin-top:11px;flex-wrap:wrap;align-items:center;}
.btn-sm{
  border:none;border-radius:999px;padding:9px 16px;font-size:14px;font-weight:800;
  cursor:pointer;font-family:inherit;transition:.15s;
}
.btn-sm:active{transform:scale(.95);}
.btn-urge{background:var(--warn);color:#fff;box-shadow:0 3px 8px rgba(232,97,44,.35);}
.btn-detail{background:var(--accent-soft);color:var(--accent-text);}
.btn-done{
  background:var(--ok);color:#fff;box-shadow:0 3px 10px rgba(31,170,107,.35);
  font-size:16px;padding:12px 22px;
}
.btn-done:disabled{background:var(--chip);color:var(--sub);box-shadow:none;cursor:not-allowed;}
.btn-photo{background:var(--accent);color:#fff;}
.btn-ghost{background:transparent;color:var(--sub);text-decoration:underline;font-size:13px;font-weight:600;padding:9px 8px;}
.btn-del{background:transparent;color:var(--warn);font-size:13px;}
.status-pill{font-size:12px;font-weight:800;padding:4px 12px;border-radius:999px;white-space:nowrap;}
.status-pill.ok{background:var(--ok-soft);color:var(--ok);}
.status-pill.no{background:var(--warn-soft);color:var(--warn);}
.hw-meta{font-size:12px;color:var(--sub);margin-top:6px;}
.thumb{width:52px;height:52px;border-radius:10px;object-fit:cover;border:2px solid var(--line);cursor:pointer;}
.thumb-wrap{position:relative;display:inline-flex;flex:none;line-height:0;}
.thumb-x{
  position:absolute;top:-5px;right:-5px;width:19px;height:19px;border-radius:50%;
  border:none;background:var(--warn);color:#fff;font-size:11px;font-weight:800;line-height:1;
  cursor:pointer;padding:0;font-family:inherit;box-shadow:0 1px 4px rgba(0,0,0,.25);
}
.photo-scroll{display:flex;gap:8px;overflow-x:auto;padding:2px 0 6px;-webkit-overflow-scrolling:touch;}
.photo-row{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap;}
.photo-row .btn-sm{flex:1;min-width:0;white-space:nowrap;text-align:center;padding:11px 6px;font-size:14px;}
.photo-row .btn-done{font-size:14px;padding:11px 6px;box-shadow:0 3px 8px rgba(31,170,107,.3);}
.photo-row .thumb{flex:none;}

.group-title{
  display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;
  margin:18px 0 10px;color:var(--accent-text);
}
.group-title:first-child{margin-top:4px;}
.group-title .bar{width:5px;height:20px;border-radius:3px;background:var(--accent);}

.stat-cards{display:flex;gap:10px;}
.stat-card{flex:1;background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;text-align:center;}
.stat-card .num{font-size:26px;font-weight:900;color:var(--accent-text);}
.stat-card .lbl{font-size:12px;color:var(--sub);margin-top:3px;font-weight:600;}
.week-row{margin-bottom:14px;}
.week-row .w-head{display:flex;justify-content:space-between;font-size:14px;font-weight:700;margin-bottom:5px;}
.week-row .w-head .r{color:var(--sub);font-weight:600;font-size:13px;}
.bar-track{height:12px;border-radius:999px;background:var(--chip);overflow:hidden;}
.bar-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#ff9f1c,#1faa6b);transition:width .5s;}
.empty{text-align:center;padding:34px 10px;color:var(--sub);font-size:14px;font-weight:600;}
.empty .big{font-size:44px;margin-bottom:10px;}

.modal-mask{
  position:fixed;inset:0;background:rgba(20,25,45,.45);z-index:100;
  display:flex;align-items:center;justify-content:center;padding:18px;
  animation:fadeIn .2s;
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{
  background:var(--card);border-radius:22px;padding:20px;max-width:420px;width:100%;
  max-height:82vh;overflow-y:auto;animation:pop .25s;
}
@keyframes pop{from{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}
.modal h4{font-size:17px;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.modal h4 .x{margin-left:auto;border:none;background:var(--chip);width:30px;height:30px;border-radius:999px;cursor:pointer;font-size:14px;font-family:inherit;color:var(--sub);}
.modal .detail-box{background:var(--chip);border-radius:var(--radius-sm);padding:13px;font-size:15px;line-height:1.7;white-space:pre-wrap;word-break:break-word;}
.modal img.photo-big{width:100%;border-radius:var(--radius-sm);margin-top:12px;}
/* 多图横向浏览：每张按比例显示，可左右滑动 */
.modal .photo-scroll img.photo-big{width:auto;max-width:78%;max-height:46vh;flex:none;margin-top:0;object-fit:contain;background:var(--chip);}

.cat-group{margin-bottom:16px;}
.cat-group .cg-title{font-size:14px;font-weight:800;color:var(--accent-text);margin-bottom:8px;}
.cat-row{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px dashed var(--line);font-size:14px;}
.cat-row label{flex:1;display:flex;align-items:center;gap:8px;font-weight:600;cursor:pointer;}
.cat-row .del{border:none;background:var(--warn-soft);color:var(--warn);border-radius:8px;padding:4px 10px;font-size:12px;cursor:pointer;font-family:inherit;}
.cat-add{display:flex;gap:8px;margin-top:10px;}
.cat-add input{flex:1;border:2px solid var(--line);border-radius:10px;padding:9px 10px;font-size:14px;font-family:inherit;outline:none;}
.cat-add button{border:none;background:var(--accent);color:#fff;border-radius:10px;padding:9px 14px;font-weight:700;cursor:pointer;font-family:inherit;}

#toast{
  position:fixed;left:50%;top:76px;transform:translateX(-50%) translateY(-20px);
  background:#2c3245;color:#fff;padding:13px 20px;border-radius:14px;
  font-size:14px;font-weight:700;z-index:200;opacity:0;pointer-events:none;
  transition:.3s;max-width:88%;text-align:center;box-shadow:0 8px 24px rgba(0,0,0,.3);
}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
#toast.kid-toast{background:linear-gradient(135deg,#ff9f1c,#ff5a5f);font-size:16px;padding:16px 24px;}

.foot-tip{text-align:center;font-size:12px;color:var(--sub);margin-top:22px;font-weight:600;}

/* ===== 账号 / 多孩子 新组件 ===== */
.logout-btn{
  border:1.5px solid var(--line);background:var(--card);color:var(--sub);
  border-radius:999px;padding:5px 12px;font-size:12px;font-weight:700;
  cursor:pointer;font-family:inherit;transition:.15s;
}
.logout-btn:active{transform:scale(.94);}
body.kid .logout-btn{color:#9b8a6b;}
.auth-hero{
  margin-top:22px;text-align:center;font-size:22px;font-weight:900;
  color:var(--accent-text);letter-spacing:.5px;
}
.auth-hero.kid-hero{font-size:24px;}
.auth-tip{
  margin-top:14px;text-align:center;font-size:12px;color:var(--sub);
  background:var(--chip);border-radius:10px;padding:8px;
}
.auth-tip b{color:var(--accent-text);}
.auth-card{background:var(--accent-soft);border:1.5px dashed var(--accent);}
.auth-card h3{color:var(--accent-text);}

.kid-bar{
  display:flex;gap:8px;margin:16px 0 4px;overflow-x:auto;
  scrollbar-width:none;padding-bottom:4px;
}
.kid-bar::-webkit-scrollbar{display:none;}
.kid-chip{
  display:inline-flex;align-items:center;gap:7px;flex-shrink:0;
  border:2px solid var(--line);border-radius:999px;padding:7px 16px 7px 7px;
  background:var(--card);font-size:14px;font-weight:800;color:var(--text);
  cursor:pointer;font-family:inherit;transition:.15s;
}
.kid-chip.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text);box-shadow:0 2px 8px rgba(0,0,0,.08);}
.kid-chip.manage{border-style:dashed;color:var(--accent-text);padding:7px 14px;}
.kid-chip .cur{
  font-size:10px;background:var(--accent);color:#fff;border-radius:99px;padding:1px 7px;margin-left:2px;
}
body.kid .kid-chip{font-size:16px;}
.avatar{
  width:26px;height:26px;border-radius:99px;color:#fff;font-size:13px;font-weight:800;
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
}
.avatar.big{width:46px;height:46px;font-size:22px;}

.assign-target{
  display:flex;align-items:center;gap:12px;margin-top:16px;
  background:var(--accent-soft);border:1.5px solid var(--accent);
  border-radius:var(--radius);padding:13px 16px;
}
.assign-target .avatar{width:38px;height:38px;font-size:17px;}
.assign-target .at-label{font-size:12px;font-weight:700;color:var(--sub);}
.assign-target .at-name{font-size:17px;font-weight:900;color:var(--accent-text);margin-top:2px;}

.welcome-card{
  display:flex;align-items:center;gap:14px;margin-top:16px;
  background:var(--accent-soft);border-radius:var(--radius);padding:16px;
}
.welcome-card .wc-hello{font-size:19px;font-weight:900;color:var(--accent-text);}
.welcome-card .wc-sub{font-size:13px;color:var(--sub);font-weight:600;margin-top:3px;}

.kid-manage-row{
  display:flex;align-items:center;gap:10px;
  border:1.5px solid var(--line);border-radius:var(--radius-sm);
  padding:10px 12px;margin-bottom:10px;
}
.kid-manage-row .avatar{width:36px;height:36px;font-size:16px;}
#toast{z-index:300;}

/* ===== Kid端 · Mom的消息中心 ===== */
.msg-btn{
  position:relative;border:none;background:var(--accent-soft);cursor:pointer;
  font-size:19px;padding:5px 9px;border-radius:999px;font-family:inherit;line-height:1;
}
.msg-btn:active{transform:scale(.92);}
.msg-badge{
  position:absolute;top:-4px;right:-4px;
  background:#ff5a5f;color:#fff;font-size:11px;font-weight:800;
  border-radius:999px;min-width:18px;height:18px;line-height:18px;
  text-align:center;padding:0 4px;box-shadow:0 2px 6px rgba(255,90,95,.45);
}
.msg-notice{
  margin-top:14px;cursor:pointer;
  background:linear-gradient(135deg,#fff1d6,#ffe3ec);
  border:2px solid #ffb56b;border-radius:var(--radius);
  padding:13px 16px;font-size:15px;font-weight:700;color:#c76c00;
  animation:msgPulse 2s infinite;
}
@keyframes msgPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,159,28,.4);}
  50%{box-shadow:0 0 0 8px rgba(255,159,28,0);}
}
.msg-row{
  display:flex;align-items:flex-start;gap:10px;
  border-bottom:1px dashed var(--line);padding:10px 0;
}
.msg-row:last-of-type{border-bottom:none;}
.msg-row .mi{
  width:34px;height:34px;border-radius:999px;flex-shrink:0;
  background:var(--accent-soft);display:inline-flex;align-items:center;justify-content:center;
  font-size:17px;
}
.msg-row .mt{font-size:15px;font-weight:800;line-height:1.5;word-break:break-word;}

/* ===== v1.1 新增样式 ===== */
.gear-btn{
  border:none;background:var(--accent-soft);color:var(--accent-text);cursor:pointer;
  font-size:17px;padding:5px 9px;border-radius:999px;font-family:inherit;line-height:1;
}
.gear-btn:active{transform:scale(.92);}

/* 课内/课外、独立完成/共同完成 颜色区分 */
.tag.grp-in{background:#e6efff;color:#2b6fe8;}      /* 课内 蓝 */
.tag.grp-out{background:#e7f8ee;color:#1faa6b;}     /* 课外 绿 */
.tag.mode-alone{background:#fff0e6;color:#e8612c;border:1.5px solid #ffd2b3;}   /* 独立完成 橙 */
.tag.mode-together{background:#efeafd;color:#7a3fd6;border:1.5px solid #d9c9f7;} /* 共同完成 紫 */

/* 提问按钮 / 语音 */
.btn-ask{background:#e9ecff;color:#3b49c9;}
.ask-actions{display:flex;gap:10px;align-items:center;margin-top:10px;}
.ask-actions .btn-ask{flex:0 0 auto;}
#voiceTip{color:var(--accent-text);font-weight:700;}

/* 作业行上的提问状态标记（Mom/Kid 双端） */
.ask-flag{
  display:inline-flex;align-items:center;gap:4px;margin-top:7px;
  font-size:12px;font-weight:800;padding:4px 10px;border-radius:999px;
  cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;
  transition:transform .12s ease, box-shadow .12s ease, filter .12s ease;
}
.ask-flag.pending{color:var(--warn);background:var(--warn-soft);}
.ask-flag.replied{color:var(--ok);background:var(--ok-soft);}
.ask-flag:hover{filter:brightness(.96);box-shadow:0 2px 8px rgba(0,0,0,.10);}
.ask-flag:active{transform:scale(.96);}
.ask-flag::after{content:'›';font-size:15px;font-weight:900;line-height:1;margin-left:1px;opacity:.7;}

/* 提问详情：问题 / 回复 气泡 */
.mq-text{font-size:14px;color:var(--text);margin:4px 0 2px;line-height:1.5;word-break:break-word;}
.ask-q{background:var(--chip);border-radius:var(--radius-sm);padding:12px 14px;font-size:15px;line-height:1.6;color:var(--text);border-left:4px solid var(--accent);white-space:pre-wrap;word-break:break-word;}
.ask-a{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px;font-size:15px;line-height:1.6;margin-bottom:8px;border-left:4px solid var(--ok);white-space:pre-wrap;word-break:break-word;}

/* 消息按天分组 + 历史消息折叠（v 修复：恢复按天折叠） */
.msg-day{margin:10px 0;border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px 12px;background:var(--card);}
.msg-day:first-of-type{margin-top:4px;}
.msg-day-h{font-size:12px;font-weight:800;color:var(--sub);margin:6px 2px 2px;}
.hist-toggle{
  width:100%;text-align:left;background:var(--accent-soft);color:var(--accent-text);
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px 14px;
  font-weight:800;font-family:inherit;cursor:pointer;margin-top:12px;
}
.hist-toggle:active{transform:scale(.98);}

/* 内联分类面板 */
.cat-panel{margin-top:6px;border-top:1.5px dashed var(--line);padding-top:12px;}
