:root {
  --paper: #f2efe7;
  --surface: #fffdf8;
  --ink: #19211d;
  --muted: #66716a;
  --line: #dcd9cf;
  --green: #1f6b50;
  --green-dark: #164b3a;
  --green-soft: #dcece4;
  --sun: #e2a83b;
  --sun-soft: #f6e9c7;
  --blue: #3f6e8d;
  --blue-soft: #e2edf3;
  --coral: #b95f4c;
  --coral-soft: #f3e0da;
  --purple: #6a5b88;
  --purple-soft: #e9e4f0;
  --shadow: 0 18px 50px rgba(37, 45, 40, .08);
  --radius: 18px;
}

* { box-sizing: border-box; }
html {
  color-scheme: light;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body {
  margin: 0;
  min-width: 0;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 15% 5%, rgba(226,168,59,.1), transparent 26rem),
    var(--paper);
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 16px;
  line-height: 1.5;
}
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .48; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 252px minmax(0, 1fr); }
.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  padding: 22px 16px;
  display: flex;
  flex-direction: column;
  background: #173e31;
  color: white;
}
.brand { padding: 5px 7px 27px; display: flex; align-items: center; gap: 11px; }
.brand-seal { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 13px; color: #173e31; background: var(--sun); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); }
.brand strong, .brand span { display: block; }
.brand strong { font-size: 17px; letter-spacing: .04em; }
.brand span { margin-top: 3px; color: rgba(255,255,255,.58); font-size: 10px; }
.sidebar nav { display: grid; gap: 6px; }
.nav-item { min-height: 46px; padding: 0 12px; display: flex; align-items: center; gap: 11px; border: 0; border-radius: 12px; color: rgba(255,255,255,.68); background: transparent; text-align: left; font-size: 13px; }
.nav-item:hover { color: white; background: rgba(255,255,255,.07); }
.nav-item.active { color: #17211c; background: #f3e8c9; font-weight: 700; }
.nav-item b { margin-left: auto; min-width: 21px; padding: 2px 6px; border-radius: 10px; color: white; background: var(--coral); text-align: center; font-size: 10px; }
.identity-card { margin-top: auto; padding: 15px; border: 1px solid rgba(255,255,255,.13); border-radius: 15px; background: rgba(255,255,255,.06); }
.identity-card span, .identity-card strong, .identity-card small { display: block; }
.identity-card span { color: rgba(255,255,255,.5); font-size: 10px; }
.identity-card strong { margin-top: 8px; line-height: 1.55; font-size: 13px; }
.identity-card small { margin-top: 9px; color: #f0cf7a; font-size: 10px; }

.main { min-width: 0; }
.topbar { position: sticky; top: 0; z-index: 20; height: 78px; padding: 0 30px; display: flex; align-items: center; gap: 20px; border-bottom: 1px solid rgba(210,207,196,.8); background: rgba(242,239,231,.88); backdrop-filter: blur(18px); }
.topbar h1 { margin: 0; font-size: 20px; }
.topbar p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.top-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.level-pill { height: 45px; padding: 0 13px 0 7px; display: flex; align-items: center; gap: 9px; border: 1px solid #ddcfaa; border-radius: 14px; background: var(--sun-soft); }
.level-pill > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; color: white; background: var(--green); font-size: 12px; font-weight: 800; }
.level-pill small, .level-pill strong { display: block; }
.level-pill small { color: #8a6e30; font-size: 9px; }
.level-pill strong { margin-top: 1px; font-size: 12px; }
.icon-button { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 13px; color: var(--muted); background: var(--surface); }
.content { max-width: 1500px; margin: 0 auto; padding: 28px 32px 100px; }

.eyebrow { color: var(--green); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow.light { color: #f4ce75; }
.nudge-banner { margin-bottom: 14px; padding: 13px 15px; display: flex; align-items: center; gap: 12px; border: 1px solid #ddc98f; border-radius: 14px; background: var(--sun-soft); }
.nudge-banner > div { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: 11px; color: #805c13; background: #efd48e; }
.nudge-banner p { flex: 1; margin: 0; }
.nudge-banner strong, .nudge-banner span { display: block; }
.nudge-banner strong { font-size: 11px; }
.nudge-banner span { margin-top: 3px; color: #776640; line-height: 1.55; font-size: 10px; }
.nudge-banner .button { min-height: 34px; }
.hero-card { min-height: 250px; padding: clamp(28px, 4vw, 54px); display: flex; align-items: end; justify-content: space-between; gap: 30px; border-radius: 24px; color: white; background:
  linear-gradient(120deg, rgba(14,56,42,.96), rgba(32,103,78,.88)),
  repeating-linear-gradient(90deg, transparent 0 74px, rgba(255,255,255,.06) 74px 75px);
  box-shadow: var(--shadow);
}
.hero-card h2 { max-width: 820px; margin: 13px 0 12px; font-size: clamp(28px, 3vw, 45px); line-height: 1.24; letter-spacing: -.03em; }
.hero-card p { max-width: 720px; margin: 0; color: rgba(255,255,255,.7); font-size: 13px; line-height: 1.8; }
.hero-card .eyebrow { color: #f1ca70; }
.hero-meter { min-width: 180px; text-align: right; }
.hero-meter strong, .hero-meter span { display: block; }
.hero-meter strong { font-size: 40px; }
.hero-meter span { color: rgba(255,255,255,.65); font-size: 11px; }
.meter { height: 7px; margin-top: 12px; overflow: hidden; border-radius: 8px; background: rgba(255,255,255,.17); }
.meter i { display: block; height: 100%; border-radius: inherit; background: var(--sun); }

.simple-today-head { padding: 10px 14px; display: grid; grid-template-columns: minmax(0,1fr) 130px; gap: 5px 14px; align-items: center; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: 0 6px 16px rgba(36,44,39,.035); }
.simple-today-head h2 { margin: 2px 0 1px; font-size: 21px; }
.simple-today-head p { display: none; }
.today-score { text-align: right; }
.today-score strong, .today-score span { display: block; }
.today-score strong { color: var(--green); font-size: 26px; }
.today-score span { margin-top: 3px; color: var(--muted); font-size: 12px; }
.today-score .meter { background: #e7e3d8; }
.game-rule { grid-column: 1 / -1; padding: 5px 9px; display: flex; gap: 8px; align-items: center; border-radius: 9px; color: #6f5518; background: var(--sun-soft); }
.game-rule.unlocked { color: #245d47; background: var(--green-soft); }
.game-rule b { flex: none; font-size: 12px; }
.game-rule span { font-size: 10px; line-height: 1.35; }
.simple-section-title { margin: 26px 0 13px; display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.simple-section-title h2 { margin: 6px 0 0; font-size: 24px; }
.future-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.future-grid article { padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.future-grid article > div { display: flex; align-items: baseline; gap: 9px; }
.future-grid strong { font-size: 18px; }
.future-grid span { color: var(--muted); font-size: 12px; }
.future-grid ul { margin: 13px 0 0; padding-left: 20px; display: grid; gap: 7px; color: #43564d; font-size: 13px; line-height: 1.55; }
.goal-table { overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.goal-table article { min-height: 74px; padding: 12px 16px; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: 12px; align-items: center; border-top: 1px solid var(--line); }
.goal-table article:first-child { border-top: 0; }
.goal-table article > b { font-size: 24px; }
.goal-table strong, .goal-table span { display: block; }
.goal-table strong { font-size: 15px; }
.goal-table span { margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.goal-table em { color: var(--green); font-size: 14px; font-style: normal; font-weight: 900; white-space: nowrap; }

.panel { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: 0 10px 30px rgba(36,44,39,.045); }
.panel h2 { margin: 10px 0 9px; font-size: 25px; line-height: 1.35; }
.panel h3 { margin: 9px 0; font-size: 17px; }
.panel > p { color: var(--muted); line-height: 1.75; font-size: 12px; }
.two-column { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr); gap: 18px; }
.stack { display: grid; gap: 18px; align-content: start; }
.stage-grid, .closing-grid { margin-top: 18px; }
.focus-panel { position: relative; overflow: hidden; padding: 30px; }
.step-number { position: absolute; top: 13px; right: 20px; color: rgba(31,107,80,.08); font-size: 76px; font-weight: 800; }
.principle-panel { color: white; background: #263a4a; border-color: #263a4a; }
.principle-panel .eyebrow { color: #9fc4d8; }
.principle-panel h3 { margin: 12px 0 20px; font-size: 24px; line-height: 1.4; }
.principle-panel ul, .coach-side ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.principle-panel li, .coach-side li { position: relative; padding-left: 22px; color: rgba(255,255,255,.72); line-height: 1.65; font-size: 12px; }
.principle-panel li::before, .coach-side li::before { content: "✓"; position: absolute; left: 0; color: #f1cb71; font-weight: 800; }

.form-stack { display: grid; gap: 16px; margin-top: 22px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; margin-top: 20px; }
.field { display: grid; gap: 7px; }
.field > span, fieldset legend { color: var(--muted); font-size: 11px; font-weight: 600; }
.field input, .field textarea, .field select, .custom-proposal input, .custom-proposal select, .coach-compose textarea, #dayReflectForm textarea {
  width: 100%; padding: 12px 13px; border: 1px solid var(--line); border-radius: 11px; outline: none; color: var(--ink); background: #fff;
}
.field textarea, .coach-compose textarea, #dayReflectForm textarea { resize: vertical; line-height: 1.7; }
.field input:focus, .field textarea:focus, .field select:focus, .custom-proposal input:focus, .coach-compose textarea:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(31,107,80,.08); }
.field.full, .button.full { grid-column: 1 / -1; }
.form-divider { height: 1px; background: var(--line); }
fieldset { padding: 0; border: 0; }
fieldset legend { margin-bottom: 8px; }
.segmented { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.segmented input { position: absolute; opacity: 0; }
.segmented span { min-height: 68px; padding: 12px 8px; display: grid; place-content: center; border: 1px solid var(--line); border-radius: 12px; text-align: center; font-size: 12px; font-weight: 700; background: white; }
.segmented small { margin-top: 3px; color: var(--muted); font-size: 9px; font-weight: 400; }
.segmented input:checked + span { border-color: var(--green); color: var(--green); background: var(--green-soft); box-shadow: inset 0 0 0 1px var(--green); }

.button { min-height: 42px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border-radius: 11px; font-size: 12px; font-weight: 800; }
.button.primary { border: 1px solid var(--green); color: white; background: var(--green); }
.button.primary:hover { background: var(--green-dark); }
.button.dark { border: 1px solid var(--ink); color: white; background: var(--ink); }
.button.ghost { border: 1px solid var(--line); color: var(--ink); background: white; }
.button.accent { border: 1px solid #d3a64d; color: #6f4b09; background: var(--sun-soft); }
.button.danger { border: 1px solid #dab4aa; color: var(--coral); background: var(--coral-soft); }
.button.wide { width: 100%; }
.text-button { padding: 4px; border: 0; color: var(--muted); background: transparent; font-size: 10px; text-decoration: underline; text-underline-offset: 3px; }
.button-stack { display: grid; gap: 9px; margin-top: 17px; }

.section-head { margin: 24px 0 16px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.section-head h2, .section-head h3 { margin: 6px 0 0; }
.section-head h2 { font-size: 25px; }
.section-head h3 { font-size: 21px; }
.quiet-chip { padding: 7px 10px; border: 1px solid var(--line); border-radius: 20px; color: var(--muted); background: var(--surface); font-size: 10px; }
.route-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 15px; }
.route-card { min-height: 450px; padding: 22px; display: flex; flex-direction: column; border: 1px solid var(--line); border-top: 5px solid var(--green); border-radius: var(--radius); background: var(--surface); box-shadow: 0 12px 32px rgba(35,43,38,.05); }
.route-2 { border-top-color: var(--coral); }
.route-3 { border-top-color: var(--blue); }
.route-top { display: flex; align-items: center; gap: 12px; }
.route-top > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--green); font-weight: 800; }
.route-2 .route-top > span { background: var(--coral); }
.route-3 .route-top > span { background: var(--blue); }
.route-top small { color: var(--muted); line-height: 1.5; font-size: 9px; }
.route-card h3 { margin: 20px 0 8px; font-size: 22px; }
.route-card > p { min-height: 42px; margin: 0; color: var(--muted); line-height: 1.65; font-size: 11px; }
.route-missions { margin: 20px 0; display: grid; gap: 8px; }
.route-missions div { padding: 10px; display: grid; grid-template-columns: 24px 1fr auto; gap: 7px; align-items: center; border-radius: 10px; background: #f5f3ed; }
.route-missions b { font-size: 15px; }
.route-missions span { font-size: 11px; font-weight: 700; }
.route-missions small { color: var(--muted); font-size: 9px; }
.route-card > .button { margin-top: auto; }
.custom-proposal { margin-top: 16px; padding: 24px; display: grid; grid-template-columns: 1fr 1.2fr; gap: 28px; align-items: center; border: 1px solid #dec993; border-radius: var(--radius); background: var(--sun-soft); }
.custom-proposal h3 { margin: 8px 0; font-size: 20px; }
.custom-proposal p { margin: 0; color: #7b6943; line-height: 1.65; font-size: 11px; }
.custom-proposal form { display: grid; grid-template-columns: 1fr 1fr 110px; gap: 8px; }
.custom-proposal form .button { grid-column: 1 / -1; }

.decision-strip { margin: 18px 0; padding: 16px 18px; display: flex; align-items: center; gap: 20px; border: 1px solid #dfca96; border-radius: 14px; background: var(--sun-soft); }
.decision-strip div { flex: 1; }
.decision-strip span, .decision-strip strong { display: block; }
.decision-strip span { color: #876b2b; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.decision-strip strong { margin-top: 4px; font-size: 13px; }
.mission-grid { display: grid; gap: 12px; }
.mission-card { position: relative; display: grid; grid-template-columns: 72px 1fr; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
.mission-card.active { border-color: #9fc7b5; box-shadow: 0 0 0 3px rgba(31,107,80,.07); }
.mission-card.done { border-color: #bed9ca; background: #fbfefc; }
.mission-index { display: grid; place-items: center; color: rgba(25,33,29,.25); background: #ece9e0; font-size: 24px; font-weight: 800; }
.mission-card.done .mission-index { color: white; background: var(--green); }
.mission-copy { padding: 19px 20px; }
.mission-meta { display: flex; justify-content: space-between; gap: 10px; }
.mission-meta span { color: var(--muted); font-size: 10px; }
.mission-meta b { color: var(--green); font-size: 9px; }
.mission-copy h3 { margin: 8px 0 5px; font-size: 18px; }
.mission-copy > p { margin: 0; color: var(--muted); line-height: 1.65; font-size: 11px; }
.minimum { margin-top: 13px; padding: 9px 11px; border-radius: 9px; color: #43564d; background: var(--green-soft); font-size: 10px; }
.minimum span { margin-right: 8px; color: var(--green); font-weight: 800; }
.mission-reward { margin-top: 12px; padding: 10px 12px; display: flex; flex-wrap: wrap; gap: 8px 14px; border: 1px solid #dfc77f; border-radius: 10px; background: var(--sun-soft); }
.mission-reward strong { color: var(--green); font-size: 12px; }
.mission-reward span { color: #7c5f1b; font-size: 11px; font-weight: 800; }
.mission-actions { margin-top: 14px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.proof { margin-top: 13px; padding: 11px; border-left: 3px solid var(--green); background: var(--green-soft); }
.proof strong, .proof p, .proof small { display: block; }
.proof strong { color: var(--green); font-size: 9px; }
.proof p { margin: 5px 0; font-size: 11px; }
.proof small { color: var(--muted); font-size: 10px; }
.evidence-panel { display: flex; flex-direction: column; justify-content: center; color: white; background: #213c4b; border-color: #213c4b; }
.evidence-panel .eyebrow { color: #a7c9da; }
.evidence-number { margin: 15px 0; font-size: 56px; font-weight: 800; }
.evidence-number small { margin-left: 10px; font-size: 10px; }
.evidence-panel > p { color: rgba(255,255,255,.65); }
#dayReflectForm { display: grid; gap: 10px; margin-top: 15px; }

.compass-layout, .cycle-layout, .settings-layout, .guardian-grid { align-items: start; }
.compass-form blockquote { margin: 18px 0; padding: 16px 18px; border-left: 4px solid var(--sun); color: #564a32; background: var(--sun-soft); line-height: 1.8; font-size: 14px; }
.metric-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 18px; }
.metric-grid > div { min-height: 104px; padding: 12px; display: flex; flex-direction: column; border-radius: 12px; background: #f4f2ec; }
.metric-grid i { color: var(--green); font-style: normal; }
.metric-grid strong { margin-top: auto; font-size: 24px; }
.metric-grid span { color: var(--muted); font-size: 9px; }
.memory-card h3 { margin-top: 18px; color: var(--green); font-size: 11px; }
.memory-card p { margin: 5px 0; color: var(--muted); font-size: 11px; }

.project-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.project-card { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.project-code { color: var(--muted); font-size: 10px; }
.status-dot { float: right; margin-top: -15px; color: var(--green); font-size: 9px; font-weight: 800; }
.project-card h3 { margin: 30px 0 8px; font-size: 23px; }
.project-card > p { min-height: 40px; color: var(--muted); line-height: 1.65; font-size: 11px; }
.project-progress { margin: 20px 0; display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; }
.project-progress > div { height: 9px; overflow: hidden; border-radius: 8px; background: #ebe8df; }
.project-progress i { display: block; height: 100%; border-radius: inherit; background: var(--green); }
.project-progress strong { font-size: 11px; }
.project-card ul { margin: 0; padding-left: 18px; color: var(--muted); line-height: 1.8; font-size: 10px; }
.project-pipeline-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.project-run-card { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.project-run-card.today { border-color: #9fc7b5; box-shadow: 0 0 0 3px rgba(31,107,80,.07); }
.project-run-head { display: flex; align-items: start; justify-content: space-between; gap: 14px; }
.project-run-head h3 { margin: 6px 0 0; font-size: 22px; }
.project-run-head > strong { flex: none; padding: 6px 9px; border-radius: 999px; color: var(--green); background: var(--green-soft); font-size: 10px; }
.project-source { margin: 12px 0 0; color: var(--muted); line-height: 1.65; font-size: 11px; }
.project-step-list { display: grid; gap: 8px; margin-top: 18px; }
.project-step { padding: 11px; display: grid; grid-template-columns: 32px minmax(0,1fr) auto; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 11px; background: #f7f5ef; }
.project-step > b { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; color: var(--muted); background: #e9e6dc; font-size: 11px; }
.project-step strong, .project-step span { display: block; }
.project-step strong { font-size: 12px; }
.project-step span { margin-top: 3px; color: var(--muted); line-height: 1.5; font-size: 9px; }
.project-step em { color: #7c5f1b; font-size: 10px; font-style: normal; font-weight: 900; white-space: nowrap; }
.project-step.done { border-color: #c7dfd2; background: #f5fbf7; }
.project-step.done > b { color: white; background: var(--green); }
.project-step.current { border-color: #dfc77f; background: var(--sun-soft); }
.project-boundary { margin-top: 16px; padding: 12px; border-left: 3px solid var(--green); color: #43564d; background: var(--green-soft); line-height: 1.65; font-size: 10px; }
.project-boundary strong { margin-right: 8px; color: var(--green); }
.project-queue { display: block; margin-top: 15px; color: var(--muted); font-size: 10px; }
.project-queue.guardian { padding: 11px 12px; border-radius: 10px; color: #745a1e; background: var(--sun-soft); line-height: 1.65; }
.evidence-stream { margin-top: 18px; }
.history-list { display: grid; }
.history-list > div { padding: 13px 0; display: grid; grid-template-columns: 100px 120px 1fr; gap: 12px; border-top: 1px solid var(--line); align-items: center; }
.history-list time, .history-list span { color: var(--muted); font-size: 10px; }
.history-list strong { font-size: 11px; }
.empty-state { padding: 42px 16px; border: 1px dashed var(--line); border-radius: 12px; color: var(--muted); text-align: center; font-size: 11px; }
.empty-state.small { padding: 24px 12px; }

.cadence-list { display: grid; gap: 10px; margin-top: 18px; }
.cadence-list > div { padding: 11px; display: grid; grid-template-columns: 38px 1fr; gap: 10px; align-items: center; border-radius: 11px; background: #f3f1ea; }
.cadence-list b { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: white; background: var(--green); }
.cadence-list span { color: var(--muted); font-size: 10px; }
.cycle-report { padding: 13px 0; border-top: 1px solid var(--line); }
.cycle-report b { color: var(--green); font-size: 9px; }
.cycle-report strong { display: block; margin-top: 4px; font-size: 12px; }
.cycle-report p { margin: 5px 0 0; color: var(--muted); font-size: 10px; }

.coach-layout { min-height: calc(100vh - 138px); display: grid; grid-template-columns: minmax(0,1.4fr) minmax(280px,.6fr); gap: 18px; }
.coach-chat { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.coach-head { padding: 15px 18px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); }
.coach-avatar { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; color: white; background: var(--green); }
.coach-head strong, .coach-head span { display: block; }
.coach-head strong { font-size: 13px; }
.coach-head span { margin-top: 3px; color: var(--muted); font-size: 9px; }
.coach-head > b { margin-left: auto; padding: 5px 7px; border-radius: 8px; color: var(--green); background: var(--green-soft); font-size: 9px; }
.coach-feed { flex: 1; min-height: 440px; max-height: 66vh; padding: 20px; display: grid; align-content: start; gap: 16px; overflow-y: auto; background: #f6f4ee; }
.coach-message { max-width: 82%; }
.coach-message.mine { justify-self: end; }
.coach-message small { display: block; margin-bottom: 5px; color: var(--muted); font-size: 9px; }
.coach-message.mine small { text-align: right; }
.coach-message > div { padding: 13px 15px; border: 1px solid var(--line); border-radius: 16px 16px 16px 5px; background: white; line-height: 1.75; font-size: 12px; }
.coach-message.mine > div { border-color: #b7d5c7; border-radius: 16px 16px 5px 16px; background: var(--green-soft); }
.coach-message.pending { opacity: .72; }
.coach-message.pending > div { border-style: dashed; }
.coach-engine-notice { padding: 10px 18px; color: #745a1e; background: var(--sun-soft); border-bottom: 1px solid #ead7a5; font-size: 10px; line-height: 1.6; }
.coach-compose { padding: 13px; display: grid; grid-template-columns: 1fr auto; gap: 9px; border-top: 1px solid var(--line); }
.coach-enter-hint { grid-column: 1 / -1; color: var(--muted); text-align: right; font-size: 10px; }
.coach-side .panel { color: white; background: #263a4a; border-color: #263a4a; }
.coach-side .eyebrow { color: #9fc4d8; }
.coach-side h3 { font-size: 22px; line-height: 1.4; }

.guardian-banner { padding: 28px; display: grid; grid-template-columns: 58px 1fr; gap: 18px; border-radius: var(--radius); color: white; background: #263a4a; }
.guardian-banner > div:first-child { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 15px; color: #263a4a; background: #b8d4e2; }
.guardian-banner .eyebrow { color: #a7c9da; }
.guardian-banner h2 { max-width: 900px; margin: 10px 0; font-size: 25px; }
.guardian-banner p { max-width: 900px; margin: 0; color: rgba(255,255,255,.65); line-height: 1.7; font-size: 11px; }
.guardian-grid { margin-top: 18px; }
.alert-list { display: grid; gap: 10px; }
.alert-item { padding: 13px; display: grid; grid-template-columns: 48px 1fr auto; gap: 12px; align-items: start; border: 1px solid #dfca96; border-radius: 12px; background: var(--sun-soft); }
.alert-item.urgent { border-color: #d8a89d; background: var(--coral-soft); }
.alert-item > span { color: var(--coral); font-size: 10px; font-weight: 800; }
.alert-item strong { font-size: 12px; }
.alert-item p { margin: 4px 0; color: var(--muted); font-size: 10px; }
.alert-item small { color: var(--muted); font-size: 9px; }
.guardian-stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; margin-top: 16px; }
.guardian-stats div { padding: 14px; border-radius: 12px; background: #f3f1ea; }
.guardian-stats strong, .guardian-stats span { display: block; }
.guardian-stats strong { font-size: 24px; }
.guardian-stats span { color: var(--muted); font-size: 9px; }
.boundary-copy { margin-top: 16px !important; padding: 12px; border-left: 3px solid var(--green); background: var(--green-soft); }

.quest-board { margin: 18px 0 26px; }
.quest-head { align-items: center; }
.quest-head p { margin: 7px 0 0; color: var(--muted); font-size: 11px; }
.game-wallet { min-width: 175px; padding: 13px 15px; border: 1px solid #dec993; border-radius: 14px; background: var(--sun-soft); text-align: right; }
.game-wallet span, .game-wallet strong, .game-wallet small { display: block; }
.game-wallet span { color: #8a6e30; font-size: 9px; font-weight: 800; }
.game-wallet strong { margin: 4px 0; font-size: 21px; }
.game-wallet small { color: var(--muted); font-size: 9px; }
.quest-list { display: grid; gap: 10px; }
.daily-quest { display: grid; grid-template-columns: 62px minmax(0,1fr) 150px; align-items: stretch; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); box-shadow: 0 8px 22px rgba(35,43,38,.035); }
.daily-quest.done { border-color: #add0bf; background: #fbfefc; }
.daily-quest.partial { border-color: #e2c36b; background: #fffdf5; }
.quest-order { display: grid; place-items: center; color: rgba(25,33,29,.35); background: #ece9e0; font-size: 19px; font-weight: 900; }
.daily-quest.done .quest-order { color: white; background: var(--green); }
.daily-quest.partial .quest-order { color: #654b12; background: #f3d77f; }
.quest-main { padding: 16px 18px; }
.quest-tags { display: flex; align-items: center; gap: 8px; }
.quest-tags span { color: var(--muted); font-size: 9px; }
.quest-tags b { padding: 3px 6px; border-radius: 7px; color: #73591c; background: var(--sun-soft); font-size: 8px; }
.quest-main h3 { margin: 7px 0 4px; font-size: 16px; }
.quest-main > p { margin: 0; color: var(--muted); line-height: 1.65; font-size: 12px; }
.quest-how { margin-top: 9px; }
.quest-how summary { min-height: 34px; display: inline-flex; align-items: center; color: var(--green); cursor: pointer; font-size: 11px; font-weight: 800; }
.quest-how[open] summary { margin-bottom: 6px; }
.quest-steps, .starter-steps { margin: 10px 0 0; padding: 10px 12px 10px 30px; display: grid; gap: 5px; border-radius: 10px; color: #40584c; background: var(--green-soft); font-size: 9px; line-height: 1.55; }
.quest-how .quest-steps { margin-top: 0; }
.starter-steps { margin: 16px auto; max-width: 520px; text-align: left; font-size: 11px; }
.modal-steps { margin-bottom: 14px; font-size: 10px; }
.quest-proof { margin-top: 9px; padding: 8px 10px; border-left: 3px solid var(--green); color: #40584c; background: var(--green-soft); font-size: 9px; }
.quest-reward { padding: 14px; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid var(--line); text-align: center; }
.quest-reward strong { color: var(--green); font-size: 14px; }
.quest-reward span { margin-top: 3px; color: #94721f; font-size: 11px; font-weight: 800; }
.quest-reward small { margin: 5px 0 9px; color: var(--muted); font-size: 8px; }
.quest-reward .button { min-height: 35px; padding: 0 9px; font-size: 9px; }
.proof-tier { margin: 16px 0; display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
.proof-tier > div { padding: 13px; display: grid; gap: 4px; border: 1px solid var(--line); border-radius: 12px; background: #f4f2ec; }
.proof-tier > div.best { border-color: #9ac8b3; background: var(--green-soft); }
.proof-tier b { color: var(--muted); font-size: 9px; }
.proof-tier strong { color: var(--green); font-size: 16px; }
.proof-tier span { color: var(--muted); font-size: 8px; }

.reward-overlay { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 20px; background: rgba(14,26,19,.72); backdrop-filter: blur(10px); }
.reward-burst { width: min(480px,100%); padding: 36px 30px; border: 1px solid #e7ca79; border-radius: 24px; background: linear-gradient(145deg,#fffdf8,#f8ebc8); box-shadow: 0 35px 120px rgba(0,0,0,.32); text-align: center; animation: reward-pop .28s ease-out; }
.reward-stars { color: var(--sun); font-size: 28px; letter-spacing: .45em; }
.reward-burst > span { display: block; margin-top: 12px; color: var(--green); font-size: 10px; font-weight: 900; letter-spacing: .15em; }
.reward-burst h2 { margin: 8px 0 18px; font-size: 29px; }
.reward-numbers { display: flex; justify-content: center; gap: 10px; }
.reward-numbers strong { padding: 10px 14px; border-radius: 12px; color: white; background: var(--green); }
.reward-burst p { margin: 14px 0 0; color: #73591c; font-size: 11px; font-weight: 700; }
.reward-burst .button { margin-top: 22px; }
@keyframes reward-pop { from { opacity: 0; transform: scale(.85) translateY(18px); } }

.learning-shell { display: grid; gap: 18px; }
.learning-inference { padding: 25px; display: grid; grid-template-columns: 1fr 240px; gap: 24px; align-items: center; border-radius: var(--radius); color: white; background: linear-gradient(125deg,#1d6048,#244c65); }
.learning-inference h2 { margin: 7px 0; font-size: 27px; }
.learning-inference p { max-width: 820px; margin: 0; color: rgba(255,255,255,.75); line-height: 1.75; font-size: 11px; }
.learning-inference small { display: block; margin-top: 10px; color: #f0cf7a; font-size: 9px; }
.confidence-card { padding: 16px; border: 1px solid rgba(255,255,255,.18); border-radius: 14px; background: rgba(255,255,255,.08); }
.confidence-card span, .confidence-card strong { display: block; }
.confidence-card span { color: #f0cf7a; font-size: 9px; }
.confidence-card strong { margin: 6px 0 12px; font-size: 13px; }
.learning-grid { align-items: start; }
.assessment-panel > h2, .homework-upload h2, .knowledge-map h2 { margin: 7px 0; }
.round-track { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin: 20px 0; }
.round-track > div { padding: 12px; display: grid; gap: 3px; border: 1px solid var(--line); border-radius: 11px; background: #f3f1ea; }
.round-track > div.current, .round-track > div.active { border-color: #d5af5b; background: var(--sun-soft); }
.round-track > div.completed { border-color: #aacdbb; background: var(--green-soft); }
.round-track b { font-size: 20px; }
.round-track span { font-size: 9px; font-weight: 800; }
.round-track small { color: var(--muted); font-size: 8px; }
.assessment-start { padding: 18px; border: 1px dashed var(--line); border-radius: 12px; text-align: center; }
.assessment-start p { color: var(--muted); line-height: 1.7; font-size: 10px; }
.assessment-form { display: grid; gap: 13px; }
.assessment-title { padding: 13px; border-radius: 11px; background: var(--sun-soft); }
.assessment-title strong, .assessment-title span { display: block; }
.assessment-title span { margin-top: 4px; color: #79643a; font-size: 9px; }
.assessment-question { padding: 14px; display: block; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.assessment-question > span { color: var(--muted); font-size: 9px; }
.assessment-question p { margin: 7px 0; line-height: 1.65; font-size: 12px; font-weight: 700; }
.assessment-question textarea { width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 9px; resize: vertical; }
.assessment-question small { display: block; margin-top: 5px; color: var(--muted); font-size: 8px; }
.assessment-result { margin-top: 17px; padding: 15px; display: grid; grid-template-columns: 105px 1fr; gap: 16px; border-radius: 13px; background: var(--blue-soft); }
.assessment-result > div { text-align: center; }
.assessment-result span, .assessment-result strong, .assessment-result small { display: block; }
.assessment-result strong { margin: 3px 0; color: var(--blue); font-size: 31px; }
.assessment-result section h3 { margin: 2px 0; color: var(--blue); font-size: 10px; }
.assessment-result section p { margin: 3px 0 9px; color: var(--muted); line-height: 1.6; font-size: 9px; }
.privacy-check { padding: 10px; display: flex; gap: 9px; align-items: start; border-radius: 10px; color: #40584c; background: var(--green-soft); font-size: 9px; line-height: 1.55; }
.validation-note { padding: 11px 12px; border-left: 3px solid var(--sun); border-radius: 8px; color: #6f591f; background: var(--sun-soft); font-size: 10px; line-height: 1.65; }
.quest-quiz { display: grid; gap: 10px; }
.quest-quiz label { padding: 12px; display: grid; gap: 8px; border: 1px solid var(--line); border-radius: 11px; background: #f7f5ef; }
.quest-quiz span { font-size: 12px; font-weight: 800; line-height: 1.55; }
.quest-quiz input { width: 100%; padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: white; }
.analysis-card h4 { margin: 15px 0 7px; color: var(--green); font-size: 10px; }
.analysis-card > p, .analysis-card li { color: var(--muted); line-height: 1.65; font-size: 9px; }
.analysis-summary { padding: 10px; border-left: 3px solid var(--blue); background: var(--blue-soft); line-height: 1.65; font-size: 10px; }
.analysis-card ul { padding-left: 18px; }
.analysis-card > small { display: block; padding: 9px; color: #7a5d1c; background: var(--sun-soft); font-size: 8px; }
.subject-map { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; }
.subject-map > section { padding: 14px; border: 1px solid var(--line); border-radius: 13px; }
.subject-map h3 { margin: 0 0 12px; }
.skill-row { padding: 9px 0; display: grid; grid-template-columns: 1fr 75px 35px; gap: 7px; border-top: 1px solid var(--line); align-items: center; }
.skill-row span { font-size: 9px; font-weight: 700; }
.skill-row > div { height: 6px; overflow: hidden; border-radius: 6px; background: #e8e5dd; }
.skill-row i { display: block; height: 100%; background: var(--green); }
.skill-row b { font-size: 9px; }
.skill-row small { grid-column: 1 / -1; color: var(--muted); font-size: 8px; }

.summer-shell { display: grid; gap: 18px; }
.summer-hero { min-height: 260px; padding: clamp(28px,4vw,50px); display: flex; align-items: end; justify-content: space-between; gap: 28px; border-radius: 24px; color: white; background: linear-gradient(125deg,#173e31,#286f55 65%,#497f6b); box-shadow: var(--shadow); }
.summer-hero.proposed { background: linear-gradient(125deg,#5b4215,#9a6e1d 65%,#bb8f37); }
.summer-hero h2 { max-width: 900px; margin: 13px 0 11px; font-size: clamp(27px,3vw,43px); line-height: 1.32; }
.summer-hero p { max-width: 760px; margin: 0; color: rgba(255,255,255,.72); line-height: 1.75; font-size: 12px; }
.summer-hero .eyebrow { color: #f4ce75; }
.summer-homework { min-width: 200px; text-align: right; }
.summer-homework span, .summer-homework strong, .summer-homework small { display: block; }
.summer-homework span, .summer-homework small { color: rgba(255,255,255,.7); font-size: 10px; }
.summer-homework strong { margin: 8px 0; font-size: 38px; }
.summer-guidance { padding: 24px 26px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 24px; align-items: center; border: 1px solid #e0bf64; border-radius: 18px; background: linear-gradient(135deg,#fff9e8,#fffdf8); box-shadow: 0 12px 30px rgba(79,59,16,.08); }
.summer-guidance.ready { border-color: #a9d2bf; background: linear-gradient(135deg,#eff9f4,#fffdf8); }
.summer-guidance h2 { margin: 7px 0 6px; font-size: 25px; line-height: 1.35; }
.summer-guidance p { max-width: 850px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.planning-checks { margin-top: 15px; display: flex; flex-wrap: wrap; gap: 8px; }
.planning-checks span { min-height: 36px; padding: 7px 11px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid #ead9a8; border-radius: 99px; color: #765d21; background: white; font-size: 12px; font-weight: 800; }
.planning-checks b { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: #efe3bf; font-size: 10px; }
.planning-checks span.done { border-color: #b9d9c9; color: var(--green); }
.planning-checks span.done b { color: white; background: var(--green); }
.planning-path { display: grid; grid-template-columns: repeat(5,1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.planning-path > div { min-height: 92px; padding: 15px; display: flex; flex-direction: column; border-right: 1px solid var(--line); }
.planning-path > div:last-child { border-right: 0; }
.planning-path b { color: var(--green); font-size: 10px; }
.planning-path strong { margin-top: auto; font-size: 12px; }
.planning-path span { margin-top: 4px; color: var(--muted); font-size: 9px; }
.summer-lanes { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 11px; }
.summer-lanes article { min-height: 142px; padding: 17px; display: grid; grid-template-columns: 36px 1fr; gap: 9px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }
.summer-lanes article > b { font-size: 24px; }
.summer-lanes span, .summer-lanes strong, .summer-lanes p { display: block; }
.summer-lanes span { color: var(--muted); font-size: 9px; font-weight: 800; }
.summer-lanes strong { margin-top: 6px; font-size: 15px; }
.summer-lanes p { margin: 7px 0 0; color: var(--muted); line-height: 1.55; font-size: 9px; }
.summer-schedule, .summer-workspace, .screen-workspace { align-items: start; }
.summer-calendar { margin-top: 18px; display: grid; }
.summer-calendar > div { padding: 11px 0; display: grid; grid-template-columns: 72px 1fr; gap: 12px; border-top: 1px solid var(--line); }
.summer-calendar time { color: var(--green); font-size: 13px; font-weight: 800; }
.summer-calendar time small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }
.summer-calendar section b { font-size: 11px; }
.summer-calendar section p { margin: 4px 0; color: #745a1e; font-size: 10px; }
.summer-calendar section small { color: var(--muted); line-height: 1.55; font-size: 9px; }
.home-operations { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.home-operations > h3 { margin: 0 0 4px; font-size: 17px; }
.home-operations > p { margin: 0; color: var(--muted); line-height: 1.65; font-size: 10px; }
.home-step-list { display: grid; gap: 8px; margin-top: 14px; }
.home-step { padding: 11px; display: grid; grid-template-columns: 32px minmax(0,1fr) auto; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 11px; background: #f7f5ef; }
.home-step > b { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; color: var(--muted); background: #e9e6dc; font-size: 11px; }
.home-step strong, .home-step span { display: block; }
.home-step strong { font-size: 12px; }
.home-step span { margin-top: 3px; color: var(--muted); line-height: 1.5; font-size: 9px; }
.home-step em { color: #7c5f1b; font-size: 10px; font-style: normal; font-weight: 900; white-space: nowrap; }
.home-step.done { border-color: #c7dfd2; background: #f5fbf7; }
.home-step.done > b { color: white; background: var(--green); }
.home-step.current { border-color: #dfc77f; background: var(--sun-soft); }
.maintenance-standard { margin-top: 16px; padding: 14px; border-radius: 12px; background: var(--green-soft); }
.maintenance-standard strong { color: var(--green); font-size: 11px; }
.maintenance-standard ol { margin: 8px 0 0; padding-left: 20px; color: #43564d; line-height: 1.7; font-size: 10px; }
.phase-list, .zone-list { margin-top: 15px; display: grid; }
.phase-list > div { padding: 11px 0; border-top: 1px solid var(--line); }
.phase-list b, .phase-list strong, .phase-list p { display: block; }
.phase-list b { color: var(--green); font-size: 9px; }
.phase-list strong { margin-top: 4px; font-size: 12px; }
.phase-list p { margin: 5px 0 0; color: var(--muted); line-height: 1.55; font-size: 9px; }
.zone-list > div { padding: 9px 0; display: flex; gap: 12px; border-top: 1px solid var(--line); }
.zone-list span { width: 92px; flex: none; color: var(--muted); font-size: 9px; }
.zone-list strong { font-size: 10px; }
.summer-planner { padding: 0; overflow: hidden; }
.summer-planner > summary { padding: 21px 24px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; list-style: none; }
.summer-planner > summary::-webkit-details-marker { display: none; }
.summer-planner summary b, .summer-planner summary small { display: block; }
.summer-planner summary b { font-size: 17px; }
.summer-planner summary small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.summer-planner > form { margin: 0; padding: 0 24px 24px; }
.planner-section { padding: 19px 0; border-top: 1px solid var(--line); }
.planner-section > span { display: block; margin-bottom: 13px; color: var(--green); font-size: 10px; font-weight: 900; }
.planner-help { margin: -4px 0 14px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.summer-budget-preview { margin-top: 16px; padding: 14px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; border-radius: 14px; background: #173e31; }
.summer-budget-preview > div { min-height: 73px; padding: 11px 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 11px; background: rgba(255,255,255,.07); }
.summer-budget-preview span, .summer-budget-preview strong { display: block; }
.summer-budget-preview span { color: rgba(255,255,255,.65); font-size: 11px; }
.summer-budget-preview strong { margin-top: 7px; color: white; font-size: 18px; }
.budget-verdict { grid-column: 1 / -1; margin: 0; padding: 11px 13px; border-radius: 10px; color: #fff3c6; background: rgba(220,173,58,.18); font-size: 13px; font-weight: 800; line-height: 1.55; }
.budget-verdict.easy, .budget-verdict.balanced { color: #d9f5e7; background: rgba(72,177,126,.2); }
.budget-verdict.over { color: #ffe0da; background: rgba(206,83,57,.25); }
.check-field { min-height: 44px; padding: 10px 12px; display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 11px; background: white; }
.check-field input { width: 17px; height: 17px; accent-color: var(--green); }
.check-field span { color: var(--ink); font-size: 11px; font-weight: 700; }
.child-decision { border-color: #dec06b; background: linear-gradient(160deg,#fffdf8,#fff5d8); }
.child-decision.active { border-color: #9bcab4; background: linear-gradient(160deg,#fffdf8,#e9f6ef); }
.progress-form { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 17px; }
.progress-form label { display: grid; gap: 6px; }
.progress-form span { color: var(--muted); font-size: 9px; }
.progress-form input { width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 9px; }
.progress-form .button { grid-column: 1 / -1; }
.screen-input-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
.screen-input-grid label { padding: 13px; display: grid; gap: 7px; border: 1px solid var(--line); border-radius: 12px; background: #f7f5ef; }
.screen-input-grid strong { font-size: 13px; }
.screen-input-grid span { color: var(--muted); font-size: 9px; }
.screen-input-grid input[type="number"], .screen-input-grid input[list] { padding: 9px 10px; border: 1px solid var(--line); border-radius: 9px; background: white; }
.screen-input-grid input[type="file"] { width: 100%; color: var(--muted); font-size: 9px; }
.screen-early-note { margin: 0 0 13px; padding: 11px 12px; border-radius: 10px; color: #745a1e; background: var(--sun-soft); line-height: 1.65; font-size: 10px; }
.screen-log-list { margin-top: 17px; display: grid; }
.screen-log-list > div { padding: 12px 0; display: grid; grid-template-columns: 70px 1fr auto; gap: 10px; border-top: 1px solid var(--line); align-items: center; }
.screen-log-list time, .screen-log-list span { color: var(--muted); font-size: 9px; }
.screen-log-list strong { font-size: 12px; }

.toast { position: fixed; right: 24px; bottom: 24px; z-index: 200; max-width: 360px; padding: 13px 15px; border-radius: 12px; color: white; background: #15241c; box-shadow: var(--shadow); font-size: 11px; animation: toast-in .18s ease-out; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }
.is-busy button { pointer-events: none; }
.modal-backdrop { position: fixed; inset: 0; z-index: 100; padding: 20px; display: grid; place-items: center; background: rgba(14,26,19,.58); backdrop-filter: blur(6px); }
.modal { width: min(480px,100%); max-height: 92vh; overflow-y: auto; padding: 24px; border-radius: 18px; background: var(--surface); box-shadow: 0 30px 100px rgba(0,0,0,.25); }
.modal h3 { margin: 9px 0; font-size: 21px; }
.modal > p { color: var(--muted); line-height: 1.7; font-size: 11px; }
.modal-actions { margin-top: 17px; display: flex; justify-content: end; gap: 8px; }
.mission-modal { width: min(620px,100%); }
.screen-quest-modal { width: min(720px,100%); }
.modal-instant-reward { margin: 14px 0; padding: 12px 14px; display: flex; flex-wrap: wrap; gap: 9px 16px; border: 1px solid #dfc77f; border-radius: 11px; background: var(--sun-soft); }
.modal-instant-reward strong { color: var(--green); font-size: 13px; }
.modal-instant-reward span { color: #7c5f1b; font-size: 12px; font-weight: 900; }
.loading { min-height: 100vh; display: grid; place-content: center; justify-items: center; gap: 12px; color: var(--muted); }
.mobile-nav { display: none; }

.onboarding-shell { min-height: 100vh; padding: 24px clamp(18px,5vw,70px) 34px; display: grid; grid-template-rows: auto auto 1fr auto; color: #183328; background:
  radial-gradient(circle at 10% 15%, rgba(250,196,67,.28), transparent 28%),
  radial-gradient(circle at 88% 18%, rgba(92,181,143,.24), transparent 30%),
  linear-gradient(145deg,#fefbf0,#edf8f2 56%,#f7f4ff);
}
.onboarding-brand { display: flex; align-items: center; gap: 10px; }
.onboarding-brand strong { font-size: 15px; }
.onboarding-brand span { padding-left: 10px; border-left: 1px solid rgba(24,51,40,.18); color: var(--muted); font-size: 10px; }
.test-mode-entry, .test-mode-banner { width: min(660px,100%); margin: 16px auto 0; padding: 10px 13px; display: flex; align-items: center; justify-content: center; gap: 10px; border-radius: 13px; font-size: 10px; }
.test-mode-entry { color: #53675e; border: 1px dashed rgba(35,88,65,.22); background: rgba(255,255,255,.56); }
.test-mode-entry button, .test-mode-banner button { padding: 6px 10px; border: 0; border-radius: 9px; cursor: pointer; font: inherit; font-weight: 800; }
.test-mode-entry button { color: #246f54; background: #dff2e8; }
.test-mode-banner { color: #6e5519; border: 1px solid #e5c76f; background: #fff2c9; }
.test-mode-banner strong { font-size: 10px; }
.test-mode-banner button { margin-left: auto; color: #704e12; background: rgba(255,255,255,.7); }
.onboarding-progress { width: min(520px,78vw); height: 7px; margin: 20px auto 0; overflow: hidden; border-radius: 9px; background: rgba(24,51,40,.1); }
.onboarding-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#f0b93e,#2f916b); transition: width .35s ease; }
.onboarding-stage { display: grid; place-items: center; padding: 28px 0; }
.onboarding-hero, .onboarding-card { width: min(660px,100%); text-align: center; animation: onboarding-in .28s ease-out; }
.onboarding-card { padding: clamp(28px,5vw,52px); border: 1px solid rgba(35,88,65,.13); border-radius: 30px; background: rgba(255,255,255,.86); box-shadow: 0 25px 80px rgba(31,75,56,.12); backdrop-filter: blur(12px); }
.buddy-orbit { position: relative; width: 106px; height: 106px; margin: 0 auto 22px; display: grid; place-items: center; border-radius: 34px; background: linear-gradient(145deg,#fff5ce,#d9f4e7); box-shadow: 0 18px 50px rgba(35,103,78,.16); transform: rotate(-4deg); }
.buddy-orbit span { font-size: 50px; transform: rotate(4deg); }
.buddy-orbit i { position: absolute; right: -10px; top: -10px; font-size: 23px; font-style: normal; }
.onboarding-hero h1 { margin: 12px 0 18px; font-size: clamp(42px,7vw,72px); line-height: 1.07; letter-spacing: -.05em; }
.onboarding-hero h1 em { color: #247457; font-style: normal; }
.onboarding-hero > p, .onboarding-card > p { max-width: 540px; margin: 0 auto 24px; color: #5f7168; line-height: 1.85; font-size: 14px; }
.onboarding-hero > small, .starter-live > small { display: block; margin-top: 15px; color: var(--muted); font-size: 10px; }
.onboarding-step { display: inline-block; color: #247457; font-size: 11px; font-weight: 900; letter-spacing: .09em; }
.onboarding-card h2 { margin: 12px 0 10px; font-size: clamp(29px,5vw,45px); letter-spacing: -.035em; }
.onboarding-form { width: min(480px,100%); margin: 0 auto; display: grid; gap: 13px; }
.onboarding-form input, .onboarding-form select, .onboarding-form textarea { width: 100%; min-height: 62px; padding: 15px 18px; border: 2px solid #d9e6df; border-radius: 17px; outline: none; color: #183328; background: white; font: inherit; font-size: 17px; text-align: center; resize: vertical; }
.onboarding-form textarea { text-align: left; }
.onboarding-form input:focus, .onboarding-form select:focus, .onboarding-form textarea:focus { border-color: #43a47b; box-shadow: 0 0 0 5px rgba(67,164,123,.12); }
.button.onboarding-primary { min-height: 58px; padding: 0 25px; border-radius: 17px; color: white; background: linear-gradient(135deg,#26795a,#3da77c); box-shadow: 0 13px 30px rgba(38,121,90,.22); font-size: 14px; font-weight: 900; }
.starter-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 13px; }
.starter-grid button { min-height: 145px; padding: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 2px solid transparent; border-radius: 20px; color: #183328; background: #f3f8f5; cursor: pointer; transition: .18s ease; }
.starter-grid button:hover { border-color: #55a986; background: #eaf7f0; transform: translateY(-3px); }
.starter-grid b { font-size: 35px; }
.starter-grid strong { margin: 9px 0 4px; font-size: 15px; }
.starter-grid span { color: var(--muted); font-size: 10px; }
.starter-icon { width: 100px; height: 100px; margin: 0 auto 22px; display: grid; place-items: center; border-radius: 30px; background: #eef8f2; font-size: 48px; }
.starter-reward { margin: 22px 0; padding: 14px; border-radius: 15px; color: #6e5519; background: #fff3cd; font-size: 12px; }
.starter-reward strong { color: #226c51; }
.onboarding-trust { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }
.onboarding-trust span { padding: 8px 11px; border: 1px solid rgba(35,88,65,.12); border-radius: 999px; color: #60756b; background: rgba(255,255,255,.58); font-size: 9px; }
@keyframes onboarding-in { from { opacity: 0; transform: translateY(14px) scale(.98); } }

.auth-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(430px,1.1fr) minmax(420px,.9fr); }
.auth-story { padding: clamp(45px,8vw,110px); display: flex; flex-direction: column; justify-content: center; color: white; background:
  linear-gradient(135deg, rgba(18,64,48,.97), rgba(35,104,80,.92)),
  repeating-linear-gradient(0deg, transparent 0 86px, rgba(255,255,255,.06) 86px 87px);
}
.auth-story > .eyebrow { margin-top: 22px; }
.auth-story h1 { max-width: 750px; margin: 17px 0 22px; font-size: clamp(38px,5vw,68px); line-height: 1.16; letter-spacing: -.04em; }
.auth-story > p { max-width: 720px; margin: 0; color: rgba(255,255,255,.68); line-height: 1.9; font-size: 13px; }
.auth-proof { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 12px; }
.auth-proof span { padding: 9px 11px; display: flex; align-items: center; gap: 7px; border: 1px solid rgba(255,255,255,.16); border-radius: 10px; color: rgba(255,255,255,.8); font-size: 10px; }
.auth-panel { padding: 35px; display: grid; place-items: center; }
.auth-card { width: min(460px,100%); padding: 32px; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow); }
.auth-card h2 { margin: 10px 0 6px; font-size: 25px; }
.auth-card > p { margin: 0 0 22px; color: var(--muted); line-height: 1.7; font-size: 11px; }
.auth-card form { display: grid; gap: 15px; }
.auth-card small { display: block; margin-top: 15px; color: var(--muted); line-height: 1.6; font-size: 9px; }
.code-row { display: grid; grid-template-columns: 1fr 125px; gap: 8px; }
.auth-notice { padding: 9px 10px; border-radius: 9px; color: var(--muted); background: #f1efe9; font-size: 10px; }
.auth-notice.test { color: #7b5a17; background: var(--sun-soft); }
.auth-notice.error { color: var(--coral); background: var(--coral-soft); }
.password-create-card { width: min(500px,100%); }
.password-settings-card { display: grid; gap: 16px; }
.password-change-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)) auto; gap: 12px; align-items: end; }
.password-change-grid .button { min-height: 49px; white-space: nowrap; }

/* 家庭首次配置与家长档案 */
.family-setup-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(320px,.72fr) minmax(620px,1.28fr); background: #f4f1e9; }
.setup-intro { position: sticky; top: 0; height: 100vh; padding: clamp(42px,6vw,88px); display: flex; flex-direction: column; justify-content: center; color: white; background: linear-gradient(145deg,#173e30,#28785a); }
.setup-intro .eyebrow { margin-top: 24px; color: #f2cf77; }
.setup-intro h1 { margin: 16px 0 22px; font-size: clamp(38px,5vw,66px); line-height: 1.12; letter-spacing: -.045em; }
.setup-intro > p { max-width: 560px; margin: 0; color: rgba(255,255,255,.72); font-size: 16px; line-height: 1.9; }
.setup-principles { margin-top: 28px; display: grid; gap: 10px; }
.setup-principles span { padding: 10px 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 12px; color: rgba(255,255,255,.82); background: rgba(255,255,255,.05); font-size: 13px; }
.setup-form-panel { padding: clamp(22px,4vw,58px); }
.family-config-form { width: min(100%,980px); margin: 0 auto; }
.setup-head { margin-bottom: 24px; }
.setup-head h2 { margin: 10px 0 8px; font-size: clamp(28px,3.5vw,42px); }
.setup-head p { margin: 0; color: var(--muted); font-size: 15px; }
.config-sections { display: grid; gap: 16px; }
.config-section { padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: 0 10px 28px rgba(36,44,39,.04); }
.family-config-form.panel > .config-section { padding: 22px 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; }
.config-title { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.config-title b, .config-title span { display: block; }
.config-title b { font-size: 19px; }
.config-title span { margin-top: 6px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.config-list { margin-top: 16px; display: grid; gap: 11px; }
.config-row { position: relative; padding: 15px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; border: 1px solid var(--line); border-radius: 14px; background: #f7f5ef; }
.config-row.homework-row { grid-template-columns: minmax(180px,1.4fr) minmax(90px,.5fr) minmax(90px,.5fr) minmax(150px,.8fr); }
.config-row.reward-config-row { grid-template-columns: minmax(180px,1fr) minmax(110px,.45fr) minmax(220px,1.2fr) minmax(120px,.55fr); }
.config-row label { display: grid; align-content: start; gap: 7px; }
.config-row label.wide { grid-column: 1 / -1; }
.config-row label > span, .config-row label > small { color: var(--muted); font-size: 13px; font-weight: 700; }
.config-row label > small { font-size: 12px; font-weight: 500; }
.config-row input, .config-row textarea { width: 100%; min-height: 48px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 10px; outline: none; color: var(--ink); background: white; font: inherit; font-size: 15px; }
.config-row input:focus, .config-row textarea:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(31,107,80,.08); }
.row-remove { position: absolute; right: 10px; top: 10px; padding: 6px 9px; border: 0; border-radius: 8px; color: #9a4c3d; background: var(--coral-soft); cursor: pointer; font: inherit; font-size: 12px; }
.config-row > label:first-child { padding-right: 56px; }
.setup-submit { margin-top: 20px; min-height: 58px; font-size: 16px; }
.guardian-setting-banner { margin-bottom: 18px; padding: 22px; display: grid; grid-template-columns: 48px 1fr; gap: 15px; border: 1px solid #c8dfd3; border-radius: 18px; background: var(--green-soft); }
.guardian-setting-banner > div:first-child { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: white; background: var(--green); }
.guardian-setting-banner h2 { margin: 7px 0; font-size: 23px; }
.guardian-setting-banner p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.settings-bottom { margin-top: 18px; }
.configured-class-summary { display: grid; gap: 8px; }
.configured-class-summary > div { padding: 11px 12px; display: flex; justify-content: space-between; gap: 14px; border-radius: 10px; background: #f4f1e9; }
.configured-class-summary strong { font-size: 14px; }
.configured-class-summary span, .configured-class-summary p { color: var(--muted); font-size: 13px; line-height: 1.6; }
.configured-class-summary p { margin: 0; }
.configured-class-summary .button { justify-self: start; }

/* 成长商店 */
.shop-shell, .guardian-dashboard, .settings-unified { display: grid; gap: 18px; }
.shop-hero { padding: clamp(26px,4vw,48px); display: flex; align-items: end; justify-content: space-between; gap: 28px; border-radius: 24px; color: white; background: linear-gradient(135deg,#173f31,#2c8b66); box-shadow: var(--shadow); }
.shop-hero h2 { margin: 10px 0; font-size: clamp(31px,4vw,48px); }
.shop-hero p { max-width: 620px; margin: 0; color: rgba(255,255,255,.72); font-size: 15px; line-height: 1.7; }
.shop-wallet { min-width: 220px; padding: 18px; border: 1px solid rgba(255,255,255,.17); border-radius: 18px; background: rgba(255,255,255,.09); }
.shop-wallet span, .shop-wallet strong, .shop-wallet small { display: block; }
.shop-wallet span, .shop-wallet small { color: rgba(255,255,255,.7); font-size: 13px; }
.shop-wallet strong { margin: 7px 0; font-size: 31px; }
.shop-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.shop-item { padding: 20px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 17px; background: var(--surface); }
.shop-item.locked { opacity: .68; }
.shop-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: var(--green); background: var(--green-soft); }
.shop-item > span { margin-top: 15px; color: var(--muted); font-size: 12px; }
.shop-item h3 { margin: 7px 0; font-size: 20px; }
.shop-item p { flex: 1; margin: 0 0 18px; color: var(--muted); font-size: 14px; line-height: 1.65; }
.shop-item > div:last-child { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.shop-item > div:last-child > strong { color: #896313; font-size: 18px; }
.purchase-history > div:not(.empty-state) { padding: 12px 0; display: grid; grid-template-columns: 100px 1fr auto auto; gap: 12px; border-top: 1px solid var(--line); align-items: center; }
.purchase-history time, .purchase-history span, .purchase-history b { color: var(--muted); font-size: 13px; }

/* 守护视图与成长搭档模式 */
.guardian-banner { grid-template-columns: 58px 1fr auto; align-items: center; }
.guardian-overview { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.state-insight ul { margin: 15px 0; padding-left: 20px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.state-insight > small { display: block; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; line-height: 1.65; }
.device-usage-list { margin-top: 14px; display: grid; gap: 8px; }
.device-usage-list > div { padding: 11px 12px; display: grid; grid-template-columns: minmax(90px,1fr) auto minmax(100px,1.4fr); gap: 10px; border-radius: 10px; background: #f4f1e9; }
.device-usage-list span, .device-usage-list strong, .device-usage-list small { font-size: 13px; }
.device-usage-list small { color: var(--muted); text-align: right; }
.overtime-warning, .within-limit { margin-top: 12px; padding: 11px 12px; border-radius: 10px; font-size: 13px; font-weight: 800; }
.overtime-warning { color: #984837; background: var(--coral-soft); }
.within-limit { color: var(--green); background: var(--green-soft); }
.guardian-task-list, .guardian-purchase-list { display: grid; }
.guardian-task-list > div { padding: 11px 0; display: grid; grid-template-columns: 26px minmax(100px,.8fr) minmax(160px,1.2fr); gap: 10px; border-top: 1px solid var(--line); }
.guardian-task-list b { color: var(--muted); }
.guardian-task-list .done b { color: var(--green); }
.guardian-task-list span { font-size: 14px; font-weight: 700; }
.guardian-task-list small { color: var(--muted); font-size: 13px; line-height: 1.55; }
.guardian-purchase-list > div { padding: 11px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); }
.guardian-purchase-list strong, .guardian-purchase-list span { display: block; }
.guardian-purchase-list strong { font-size: 14px; }
.guardian-purchase-list span { margin-top: 3px; color: var(--muted); font-size: 12px; }
.coach-head-actions { margin-left: auto; display: grid; justify-items: end; gap: 7px; }
.coach-head-actions > b { color: var(--green); font-size: 11px; }
.coach-mode-switch { display: flex; padding: 3px; border-radius: 10px; background: #ece9df; }
.coach-mode-switch button { min-height: 32px; padding: 0 10px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; cursor: pointer; font: inherit; font-size: 12px; }
.coach-mode-switch button.active { color: white; background: var(--green); }
.coach-mode-note { padding: 10px 18px; border-bottom: 1px solid var(--line); color: var(--muted); background: #fbfaf6; font-size: 13px; line-height: 1.6; }

@media (max-width: 1120px) {
  .route-grid { grid-template-columns: 1fr; }
  .route-card { min-height: auto; }
  .two-column, .coach-layout { grid-template-columns: 1fr; }
  .coach-side { display: none; }
  .custom-proposal { grid-template-columns: 1fr; }
  .subject-map { grid-template-columns: 1fr; }
  .summer-lanes { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .project-pipeline-grid { grid-template-columns: 1fr; }
  .panel > p, .route-card > p, .mission-copy > p, .project-card > p,
  .guardian-banner p, .learning-inference p, .summer-hero p { font-size: 14px; }
  .principle-panel li, .coach-side li, .coach-message > div { font-size: 14px; }
  .field > span, fieldset legend, .check-field span { font-size: 13px; }
  .button { min-height: 46px; font-size: 14px; }
  .family-setup-shell { grid-template-columns: minmax(300px,.7fr) minmax(520px,1.3fr); }
  .shop-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .password-change-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .password-change-grid .button { width: 100%; }
}

@media (max-width: 820px) {
  .app-shell { display: block; }
  .sidebar { display: none; }
  .topbar { height: 58px; padding: 0 12px; }
  .topbar h1 { font-size: 21px; line-height: 1.2; }
  .topbar p { display: none; }
  .level-pill { height: 49px; }
  .level-pill > span { width: 35px; height: 35px; font-size: 14px; }
  .level-pill small { font-size: 11px; }
  .level-pill strong { font-size: 14px; }
  .content { padding: 10px 12px 96px; }
  .simple-today-head { padding: 9px 12px; grid-template-columns: minmax(0,1fr) auto; gap: 4px 9px; }
  .simple-today-head h2 { font-size: 20px; }
  .simple-today-head p { max-width: 29em; font-size: 13px; line-height: 1.45; }
  .today-score { text-align: right; }
  .today-score strong { font-size: 24px; }
  .today-score span { font-size: 12px; }
  .game-rule { display: flex; gap: 6px; }
  .game-rule b { font-size: 13px; }
  .game-rule span { font-size: 13px; line-height: 1.45; }
  .simple-section-title { align-items: start; }
  .simple-section-title h2 { font-size: 24px; line-height: 1.35; }
  .future-grid { grid-template-columns: 1fr; }
  .future-grid article { padding: 18px; }
  .future-grid strong { font-size: 20px; }
  .future-grid span { font-size: 14px; }
  .future-grid ul { font-size: 15px; line-height: 1.65; }
  .goal-table article { min-height: 86px; grid-template-columns: 42px minmax(0,1fr); }
  .goal-table article > b { font-size: 27px; }
  .goal-table strong { font-size: 18px; }
  .goal-table span { font-size: 14px; line-height: 1.6; }
  .goal-table em { grid-column: 2; font-size: 15px; white-space: normal; }
  .eyebrow { font-size: 12px; letter-spacing: .09em; }
  .hero-card { min-height: 260px; padding: 30px 24px; align-items: start; flex-direction: column; }
  .hero-card h2 { font-size: clamp(30px,8vw,38px); line-height: 1.3; }
  .hero-card p { font-size: 16px; line-height: 1.75; }
  .hero-meter { min-width: 100%; text-align: left; }
  .hero-meter span { font-size: 14px; }
  .panel { padding: 22px; }
  .panel h2 { font-size: 27px; }
  .panel h3 { font-size: 21px; }
  .panel > p { font-size: 16px; line-height: 1.75; }
  .section-head h2 { font-size: 27px; }
  .section-head h3 { font-size: 23px; }
  .quiet-chip { font-size: 13px; }
  .field > span, fieldset legend { font-size: 14px; }
  input:not([type="checkbox"]):not([type="radio"]), textarea, select { min-height: 50px; font-size: 16px; }
  .button { min-height: 50px; padding: 0 17px; font-size: 15px; }
  .text-button { min-height: 44px; font-size: 14px; }
  .segmented span { min-height: 72px; font-size: 15px; }
  .segmented small { font-size: 13px; }
  .nudge-banner strong { font-size: 15px; }
  .nudge-banner span { font-size: 14px; line-height: 1.65; }
  .mobile-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; height: calc(82px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); display: flex; justify-content: flex-start; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; border-top: 1px solid var(--line); background: rgba(255,253,248,.97); backdrop-filter: blur(14px); }
  .mobile-nav::-webkit-scrollbar { display: none; }
  .mobile-nav button { flex: 1 1 25%; min-width: 0; min-height: 58px; padding: 7px 2px 5px; border: 0; color: var(--muted); background: transparent; font-size: 12px; line-height: 1.15; }
  .mobile-nav button svg { display: block; margin: 0 auto 4px; }
  .mobile-nav button.active { color: var(--green); font-weight: 800; }
  .project-grid { grid-template-columns: 1fr; }
  .custom-proposal form { grid-template-columns: 1fr; }
  .custom-proposal form .button { grid-column: auto; }
  .auth-shell { display: block; }
  .auth-story { min-height: 430px; padding: 45px 26px; }
  .auth-panel { padding: 18px 14px 34px; }
  .family-setup-shell { display: block; }
  .setup-intro { position: static; height: auto; min-height: 360px; padding: 42px 24px; }
  .setup-intro h1 { font-size: 40px; }
  .setup-form-panel { padding: 22px 15px 36px; }
  .config-title { flex-direction: column; }
  .config-title .button { width: 100%; }
  .config-row, .config-row.homework-row, .config-row.reward-config-row { grid-template-columns: 1fr 1fr; }
  .shop-hero { align-items: stretch; flex-direction: column; }
  .shop-wallet { min-width: 0; }
  .guardian-overview { grid-template-columns: 1fr; }
  .guardian-banner { grid-template-columns: 48px 1fr; }
  .guardian-banner > .button { grid-column: 1 / -1; width: 100%; }
  .coach-head { align-items: start; flex-wrap: wrap; }
  .coach-head-actions { width: 100%; margin-left: 50px; align-items: start; justify-items: start; }
  .learning-inference { grid-template-columns: 1fr; }
  .learning-inference h2 { font-size: 28px; }
  .learning-inference p { font-size: 16px; }
  .learning-inference small { font-size: 13px; }
  .confidence-card { width: 100%; }
  .quest-head { margin: 4px 0; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; align-items: center; }
  .quest-head p { display: none; }
  .game-wallet { min-width: 122px; padding: 6px 8px; }
  .game-wallet span, .game-wallet small { font-size: 11px; }
  .game-wallet strong { font-size: 18px; }
  .achievement-strip { margin: 4px 0 7px; padding: 6px 8px; gap: 6px; font-size: 11px; line-height: 1.35; }
  .daily-quest { grid-template-columns: 52px 1fr; border-radius: 18px; }
  .quest-order { font-size: 22px; }
  .quest-main { padding: 14px 15px; }
  .quest-tags span { font-size: 13px; }
  .quest-tags b { padding: 4px 8px; font-size: 12px; }
  .quest-main h3 { margin: 7px 0 4px; font-size: 18px; line-height: 1.3; }
  .quest-main > p { font-size: 14px; line-height: 1.55; }
  .quest-how summary { min-height: 42px; font-size: 15px; }
  .quest-steps, .starter-steps { margin-top: 14px; padding: 14px 14px 14px 34px; gap: 8px; font-size: 15px; line-height: 1.7; }
  .quest-proof { margin-top: 13px; padding: 12px 13px; font-size: 14px; line-height: 1.6; }
  .quest-reward { grid-column: 2; padding: 11px 13px 13px; border-top: 1px solid var(--line); border-left: 0; text-align: left; }
  .quest-reward strong { font-size: 18px; }
  .quest-reward span { font-size: 14px; }
  .quest-reward small { margin: 5px 0 8px; font-size: 12px; }
  .quest-reward .button { width: 100%; min-height: 46px; font-size: 15px; }
  .proof-tier b { font-size: 13px; }
  .proof-tier strong { font-size: 20px; }
  .proof-tier span { font-size: 12px; }
  .modal { padding: 22px; }
  .modal h3 { font-size: 24px; }
  .modal > p, .modal-steps { font-size: 15px; }
  .toast { right: 14px; bottom: 96px; left: 14px; max-width: none; font-size: 14px; }
  .summer-hero { align-items: start; flex-direction: column; }
  .summer-guidance { grid-template-columns: 1fr; }
  .summer-guidance .button { width: 100%; }
  .summer-hero h2 { font-size: clamp(29px,7.5vw,38px); }
  .summer-hero p { font-size: 16px; }
  .summer-homework { min-width: 100%; text-align: left; }
  .summer-homework span, .summer-homework small { font-size: 14px; }
  .planning-path { grid-template-columns: 1fr; }
  .planning-path > div { min-height: 72px; display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 7px; border-right: 0; border-bottom: 1px solid var(--line); }
  .planning-path > div:last-child { border-bottom: 0; }
  .planning-path b { font-size: 14px; }
  .planning-path strong { margin-top: 0; }
  .planning-path strong { font-size: 16px; }
  .planning-path span { font-size: 13px; }
  .summer-lanes span { font-size: 13px; }
  .summer-lanes strong { font-size: 18px; }
  .summer-lanes p { font-size: 14px; line-height: 1.65; }
  .summer-calendar time { font-size: 15px; }
  .summer-calendar time small, .summer-calendar section small { font-size: 13px; }
  .summer-calendar section b { font-size: 15px; }
  .summer-calendar section p { font-size: 14px; }
  .phase-list b, .zone-list span { font-size: 13px; }
  .phase-list strong, .zone-list strong { font-size: 15px; }
  .phase-list p { font-size: 14px; }
  .summer-planner summary b { font-size: 20px; }
  .summer-planner summary small, .planner-section > span, .progress-form span { font-size: 13px; }
  .check-field { min-height: 52px; }
  .check-field span { font-size: 15px; }
  .screen-input-grid strong, .screen-log-list strong { font-size: 16px; }
  .screen-input-grid span, .screen-input-grid input[type="file"], .screen-log-list time, .screen-log-list span { font-size: 13px; }
  .screen-early-note, .project-source, .project-step span, .project-boundary, .project-queue,
  .home-operations > p, .home-step span, .maintenance-standard ol { font-size: 14px; }
  .mission-reward strong, .mission-reward span, .modal-instant-reward strong, .modal-instant-reward span { font-size: 15px; }
  .project-run-head h3 { font-size: 24px; }
  .project-run-head > strong { font-size: 13px; }
  .project-step strong, .home-step strong { font-size: 16px; }
  .project-step em, .home-step em, .maintenance-standard strong { font-size: 14px; }

  .route-card > p, .custom-proposal p, .mission-copy > p, .project-card > p,
  .project-card ul, .memory-card p, .cadence-list span, .cycle-report p,
  .guardian-banner p, .alert-item p, .assessment-start p,
  .assessment-question p, .analysis-card > p, .analysis-card li,
  .analysis-summary { font-size: 14px; line-height: 1.7; }
  .route-top small, .route-missions span, .route-missions small,
  .decision-strip span, .mission-meta span, .mission-meta b, .minimum,
  .proof strong, .proof small, .metric-grid span, .project-code,
  .status-dot, .project-progress strong, .history-list time,
  .history-list span, .history-list strong, .empty-state,
  .cycle-report b, .coach-head span, .coach-head > b,
  .coach-message small, .alert-item > span, .alert-item small,
  .guardian-stats span, .confidence-card span, .round-track span,
  .round-track small, .assessment-title span, .assessment-question > span,
  .assessment-question small, .privacy-check, .analysis-card h4,
  .analysis-card > small, .skill-row span, .skill-row b, .skill-row small { font-size: 13px; }
  .coach-message > div { font-size: 15px; }
  .coach-engine-notice, .validation-note { font-size: 14px; }
  .quest-quiz span { font-size: 15px; }
  .alert-item strong, .cycle-report strong, .memory-card h3 { font-size: 15px; }

  .test-mode-entry, .test-mode-banner, .test-mode-banner strong { font-size: 13px; }
  .onboarding-hero > p, .onboarding-card > p { font-size: 16px; }
  .onboarding-hero > small, .starter-live > small, .onboarding-step { font-size: 13px; }
  .starter-grid strong { font-size: 17px; }
  .starter-grid span { font-size: 13px; }
  .starter-reward { font-size: 15px; }
  .onboarding-trust span { font-size: 12px; }
  .auth-story > p { font-size: 16px; }
  .auth-proof span { font-size: 13px; }
  .auth-card > p { font-size: 15px; }
  .auth-card small, .auth-notice { font-size: 13px; }
  .password-change-grid { grid-template-columns: 1fr; }
  .config-title span, .config-row label > span, .config-row label > small,
  .configured-class-summary span, .configured-class-summary p,
  .purchase-history time, .purchase-history span, .purchase-history b,
  .state-insight > small, .device-usage-list span, .device-usage-list strong,
  .device-usage-list small, .overtime-warning, .within-limit,
  .guardian-task-list small, .guardian-purchase-list span,
  .coach-mode-note { font-size: 14px; }
  .config-title b { font-size: 20px; }
  .shop-item > span { font-size: 14px; }
  .shop-item p { font-size: 15px; }
}

@media (max-width: 560px) {
  .onboarding-shell { padding: 18px 14px 25px; }
  .onboarding-brand span { display: none; }
  .test-mode-entry, .test-mode-banner { align-items: stretch; flex-direction: column; text-align: center; }
  .test-mode-banner button { margin-left: 0; }
  .onboarding-stage { padding: 20px 0; }
  .onboarding-card { padding: 27px 18px; border-radius: 23px; }
  .onboarding-hero h1 { font-size: 44px; }
  .starter-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .starter-grid button { min-height: 125px; padding: 12px 7px; }
  .proof-tier { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
  .proof-tier > div { padding: 8px 7px; }
  .proof-tier b, .proof-tier span { font-size: 11px; line-height: 1.3; }
  .proof-tier strong { font-size: 15px; }
  .top-actions .icon-button { display: none; }
  .level-pill { height: 41px; }
  .hero-card h2 { font-size: 29px; }
  .panel { padding: 18px; }
  .segmented { grid-template-columns: 1fr; }
  .segmented span { min-height: 58px; }
  .section-head { align-items: start; }
  .section-head .button { min-height: 46px; padding: 0 12px; font-size: 14px; }
  .decision-strip { align-items: start; flex-direction: column; }
  .decision-strip .button { width: 100%; }
  .mission-card { grid-template-columns: 48px 1fr; }
  .mission-copy { padding: 16px 14px; }
  .mission-actions { display: grid; }
  .mission-actions .button, .mission-actions .text-button { width: 100%; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full, .button.full { grid-column: auto; }
  .metric-grid { grid-template-columns: repeat(2,1fr); }
  .history-list > div { grid-template-columns: 1fr; gap: 4px; }
  .coach-feed { max-height: none; min-height: 55vh; }
  .coach-compose { grid-template-columns: 1fr; }
  .coach-enter-hint { display: none; }
  .nudge-banner { align-items: start; }
  .nudge-banner .button { padding: 0 11px; font-size: 14px; }
  .guardian-banner { grid-template-columns: 1fr; }
  .alert-item { grid-template-columns: 1fr; }
  .auth-story { min-height: 390px; }
  .auth-story h1 { font-size: 35px; }
  .auth-proof { display: grid; }
  .auth-card { padding: 23px 18px; }
  .setup-intro { min-height: 320px; }
  .setup-intro h1 { font-size: 35px; }
  .config-section { padding: 18px 15px; }
  .config-row, .config-row.homework-row, .config-row.reward-config-row { grid-template-columns: 1fr; }
  .config-row label.wide { grid-column: auto; }
  .config-row > label:first-child { padding-right: 0; padding-top: 35px; }
  .shop-grid { grid-template-columns: 1fr; }
  .purchase-history > div:not(.empty-state) { grid-template-columns: 1fr auto; }
  .purchase-history time, .purchase-history b { grid-column: 1 / -1; }
  .device-usage-list > div { grid-template-columns: 1fr auto; }
  .device-usage-list small { grid-column: 1 / -1; text-align: left; }
  .guardian-task-list > div { grid-template-columns: 24px 1fr; }
  .guardian-task-list small { grid-column: 2; }
  .guardian-purchase-list > div { align-items: stretch; flex-direction: column; }
  .guardian-purchase-list .button { width: 100%; }
  .configured-class-summary > div { flex-direction: column; }
  .code-row { grid-template-columns: 1fr; }
  .quest-head { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; }
  .game-wallet { width: auto; min-width: 112px; text-align: right; }
  .daily-quest { grid-template-columns: 46px 1fr; }
  .quest-main { padding: 18px 15px; }
  .round-track { grid-template-columns: 1fr; }
  .assessment-result { grid-template-columns: 1fr; }
  .reward-burst { padding: 28px 18px; }
  .reward-numbers { flex-direction: column; }
  .summer-lanes { grid-template-columns: 1fr; }
  .summer-guidance { padding: 20px 16px; }
  .summer-guidance h2 { font-size: 24px; }
  .summer-guidance p { font-size: 15px; }
  .planning-checks { display: grid; grid-template-columns: 1fr 1fr; }
  .planning-checks span { min-height: 42px; border-radius: 12px; }
  .summer-budget-preview { grid-template-columns: 1fr; }
  .budget-verdict { grid-column: auto; }
  .summer-lanes article { min-height: auto; }
  .summer-calendar > div { grid-template-columns: 58px 1fr; }
  .summer-planner > summary, .summer-planner > form { padding-left: 16px; padding-right: 16px; }
  .progress-form, .screen-input-grid { grid-template-columns: 1fr; }
  .screen-log-list > div { grid-template-columns: 55px 1fr; }
  .screen-log-list span { grid-column: 2; }
  .project-step, .home-step { grid-template-columns: 32px minmax(0,1fr); }
  .project-step em, .home-step em { grid-column: 2; }
  .project-run-head { align-items: start; flex-direction: column; }
}

@media (min-width: 700px) and (max-width: 820px) {
  .daily-quest { grid-template-columns: 56px minmax(0,1fr) 174px; }
  .quest-reward {
    grid-column: auto;
    padding: 18px 14px;
    border-top: 0;
    border-left: 1px solid var(--line);
    text-align: center;
  }
}

@media (min-width: 821px) {
  .topbar h1 { font-size: 22px; }
  .topbar p, .hero-meter span { font-size: 13px; }
  .eyebrow { font-size: 12px; }
  .panel > p, .route-card > p, .mission-copy > p, .project-card > p,
  .guardian-banner p, .learning-inference p, .summer-hero p,
  .principle-panel li, .coach-side li, .coach-message > div { font-size: 14px; }
  .field > span, fieldset legend, .check-field span { font-size: 13px; }
  .button { min-height: 46px; font-size: 14px; }
  .quiet-chip, .minimum, .proof p, .memory-card p, .cycle-report p,
  .alert-item p, .alert-item strong { font-size: 12px; }

  .quest-head p { font-size: 14px; }
  .game-wallet span, .game-wallet small { font-size: 12px; }
  .quest-tags span { font-size: 12px; }
  .quest-tags b { font-size: 11px; }
  .quest-main h3 { font-size: 20px; }
  .quest-main > p { font-size: 14px; line-height: 1.7; }
  .quest-steps { padding: 12px 13px 12px 32px; gap: 7px; font-size: 13px; line-height: 1.65; }
  .quest-proof { padding: 10px 12px; font-size: 13px; }
  .quest-reward strong { font-size: 18px; }
  .quest-reward span { font-size: 14px; }
  .quest-reward small { font-size: 11px; }
  .quest-reward .button { min-height: 44px; font-size: 13px; }
  .proof-tier b { font-size: 12px; }
  .proof-tier span { font-size: 11px; }

  .learning-inference small, .round-track span, .assessment-title span,
  .assessment-question > span, .privacy-check, .analysis-card > p,
  .analysis-card li, .skill-row span, .skill-row b { font-size: 12px; }
  .assessment-start p, .assessment-question small, .analysis-summary,
  .analysis-card h4, .skill-row small { font-size: 11px; }
  .assessment-question p { font-size: 14px; }

  .planning-path b, .summer-lanes span, .phase-list b, .zone-list span,
  .summer-planner summary small, .progress-form span, .screen-input-grid span,
  .screen-input-grid input[type="file"], .screen-log-list time,
  .screen-log-list span { font-size: 12px; }
  .planning-path strong, .summer-calendar section b, .phase-list strong,
  .zone-list strong { font-size: 14px; }
  .planning-path span, .summer-lanes p, .summer-calendar section p,
  .summer-calendar section small, .phase-list p { font-size: 13px; }
  .summer-lanes strong { font-size: 17px; }
  .summer-calendar time { font-size: 15px; }
  .summer-calendar time small { font-size: 12px; }
  .planner-section > span { font-size: 13px; }
  .screen-input-grid strong, .screen-log-list strong { font-size: 15px; }
}

@media (max-width: 380px) {
  .topbar { height: 68px; padding: 0 10px; gap: 8px; }
  .topbar h1 { font-size: 19px; }
  .level-pill { padding: 0 8px 0 5px; }
  .level-pill small { display: none; }
  .content { padding: 14px 10px 101px; }
  .simple-today-head { padding: 17px 15px; border-radius: 16px; }
  .simple-today-head h2 { font-size: 25px; }
  .simple-section-title { display: grid; }
  .simple-section-title .button { width: 100%; }
  .future-grid article { padding: 15px; }
  .goal-table article { padding: 12px; gap: 9px; }
  .panel { padding: 16px 14px; }
  .hero-card, .summer-hero { padding: 25px 19px; border-radius: 20px; }
  .section-head { gap: 10px; }
  .section-head h2 { font-size: 25px; }
  .daily-quest { grid-template-columns: 43px 1fr; }
  .quest-main { padding: 17px 13px; }
  .quest-main h3 { font-size: 19px; }
  .quest-main > p, .quest-steps { font-size: 15px; }
  .quest-reward { padding: 16px 13px 18px; }
  .planning-path > div { grid-template-columns: 32px 1fr; }
  .planning-path span { grid-column: 2; }
  .mobile-nav button { font-size: 11px; }
}

/* 2026-07-21：今日页和提交页只保留完成任务真正需要的信息。 */
.simple-today-head {
  padding: 13px 17px;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 7px 15px;
}
.simple-today-head h2 { margin: 3px 0 0; font-size: 23px; }
.simple-today-head p { display: none; }
.today-score { min-width: 104px; }
.today-score strong { font-size: 27px; line-height: 1; }
.today-score span { font-size: 11px; }
.today-score .meter { height: 5px; margin-top: 6px; }
.game-rule { padding: 7px 10px; gap: 8px; }
.game-rule b, .game-rule span { font-size: 12px; }
.quest-head { margin: 8px 0; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; }
.game-wallet { min-width: 142px; padding: 8px 10px; }
.game-wallet strong { margin: 2px 0 0; font-size: 17px; }
.game-wallet small { display: none; }

.diagnostic-entry {
  margin-top: 12px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid #b9d8c8;
  border-radius: 15px;
  background: var(--green-soft);
}
.diagnostic-entry strong, .diagnostic-entry span { display: block; }
.diagnostic-entry strong { font-size: 15px; }
.diagnostic-entry span { margin-top: 4px; color: var(--muted); font-size: 12px; }
.achievement-strip { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:8px 0 12px; padding:9px 11px; border-radius:12px; background:#fff8dc; color:#755818; font-size:12px; }
.achievement-strip strong { color:var(--green); }
.achievement-strip small { color:var(--muted); }
.achievement-road { width:100%; display:flex; gap:6px; flex-wrap:wrap; }
.achievement-road span { padding:4px 7px; border:1px solid #e4cf91; border-radius:999px; color:#755818; background:#fffdf4; font-size:11px; font-weight:700; }
.achievement-details { cursor: pointer; }
.achievement-details summary { list-style: none; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.achievement-details summary::-webkit-details-marker { display: none; }
.achievement-details summary::after { content: "查看"; margin-left: auto; color: var(--green); font-size: 11px; font-weight: 800; }
.achievement-details[open] summary::after { content: "收起"; }
.achievement-detail-body { margin-top: 8px; display: grid; gap: 8px; color: var(--muted); font-size: 11px; }

.achievement-wall { display: grid; gap: 14px; }
.nav-secondary { display:grid; gap:3px; margin:-4px 0 7px 13px; padding-left:12px; border-left:1px solid rgba(255,255,255,.18); }
.nav-subitem { min-height:35px; padding:8px 12px; font-size:12px; opacity:.82; }
.nav-subitem.active { opacity:1; }
.growth-hub { display:grid; gap:14px; }
.growth-hub-hero { display:flex; justify-content:space-between; gap:18px; padding:22px; border:1px solid #cbdccf; border-radius:18px; background:linear-gradient(135deg,#eaf7ef,#fff8dc 78%); }
.growth-hub-hero h2 { margin:6px 0; max-width:680px; font-size:clamp(22px,3vw,32px); line-height:1.25; }
.growth-hub-hero p { margin:0; color:var(--muted); line-height:1.6; }
.growth-hub-stat { min-width:180px; align-self:start; padding:14px; border:1px solid var(--line); border-radius:14px; background:#fffdf8; }
.growth-hub-stat span, .growth-hub-stat strong, .growth-hub-stat small { display:block; }
.growth-hub-stat span, .growth-hub-stat small { color:var(--muted); font-size:11px; }
.growth-hub-stat strong { margin:4px 0; color:var(--green); font-size:26px; }
.growth-subgrid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.growth-subcard { min-height:148px; display:grid; align-content:start; gap:7px; padding:15px; border:1px solid var(--line); border-radius:15px; background:var(--surface); color:var(--ink); text-align:left; cursor:pointer; }
.growth-subcard:hover, .growth-subcard.active { border-color:#b8d1c0; background:var(--green-soft); transform:translateY(-1px); }
.growth-subcard b { font-size:25px; }
.growth-subcard span { font-weight:900; }
.growth-subcard small { min-height:36px; color:var(--muted); font-size:11px; line-height:1.45; }
.growth-subcard em { margin-top:auto; color:var(--green); font-size:11px; font-style:normal; font-weight:800; }
.achievement-editor-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.achievement-editor-grid textarea { min-height:92px; }
.achievement-wall-hero { display:flex; justify-content:space-between; gap:18px; padding:22px; border:1px solid #d9c47e; border-radius:18px; background:linear-gradient(135deg,#fff8d9,#f5fbf5 68%); }
.achievement-wall-hero h2 { margin:6px 0; max-width:650px; font-size:clamp(22px,3vw,32px); line-height:1.25; }
.achievement-wall-hero p { margin:0; color:var(--muted); line-height:1.6; }
.achievement-wallets { display:grid; grid-template-columns:repeat(2,minmax(110px,1fr)); gap:8px; align-self:start; min-width:250px; }
.achievement-wallets div { padding:12px; border:1px solid var(--line); border-radius:13px; background:#fffdf8; }
.achievement-wallets span, .achievement-wallets strong { display:block; }
.achievement-wallets span { color:var(--muted); font-size:12px; font-weight:800; }
.achievement-wallets strong { margin-top:4px; color:var(--green); font-size:25px; }
.achievement-main-road { padding:18px; }
.achievement-next-main { align-self:end; color:var(--green); font-size:12px; }
.main-road-track { display:grid; grid-template-columns:repeat(7,1fr); gap:7px; margin-top:15px; }
.main-road-node { position:relative; display:grid; gap:5px; min-height:75px; padding:10px 8px; border:1px solid var(--line); border-radius:12px; background:#f7f5ef; }
.main-road-node b { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; color:var(--muted); background:#e5e4db; }
.main-road-node span { font-size:12px; font-weight:800; }
.main-road-node small { color:var(--muted); font-size:10px; }
.main-road-node.done, .main-road-node.current { border-color:#c3dcca; background:var(--green-soft); }
.main-road-node.done b, .main-road-node.current b { color:#fff; background:var(--green); }
.main-road-node.current { box-shadow:0 0 0 2px #e5c965; }
.achievement-wall-heading { display:flex; justify-content:space-between; align-items:end; gap:12px; }
.achievement-wall-heading h2 { margin:4px 0 0; font-size:20px; }
.achievement-wall-heading > span { max-width:420px; color:var(--muted); font-size:12px; line-height:1.5; text-align:right; }
.achievement-lane-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.achievement-lane-card { display:flex; gap:10px; padding:13px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.achievement-lane-icon { width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; border-radius:12px; background:var(--sun-soft); font-size:21px; }
.achievement-lane-main { min-width:0; flex:1; }
.achievement-lane-head { display:flex; justify-content:space-between; gap:8px; align-items:start; }
.achievement-lane-head span, .achievement-lane-head strong { display:block; }
.achievement-lane-head span { color:var(--muted); font-size:11px; }
.achievement-lane-head strong { margin-top:3px; color:var(--green); font-size:15px; }
.achievement-lane-head > b { color:var(--green); font-size:13px; white-space:nowrap; }
.achievement-progress { height:7px; margin:9px 0 5px; overflow:hidden; border-radius:99px; background:#e7ebe6; }
.achievement-progress i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#e4bf55,var(--green)); }
.achievement-lane-main small { color:var(--muted); font-size:10px; }
.achievement-mini-road { display:flex; gap:4px; flex-wrap:wrap; margin-top:8px; }
.achievement-mini-road span { padding:3px 5px; border-radius:999px; color:#92988f; background:#f1f2ed; font-size:9px; }
.achievement-mini-road span.on { color:var(--green); background:var(--green-soft); font-weight:800; }
.achievement-badge-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.achievement-badge-grid div { display:grid; gap:4px; padding:10px; border:1px solid #ead99c; border-radius:11px; background:#fffdf4; }
.achievement-badge-grid b { font-size:18px; }
.achievement-badge-grid strong { color:var(--green); font-size:12px; }
.achievement-badge-grid span { color:var(--muted); font-size:10px; line-height:1.4; }

@media (max-width: 820px) {
  .growth-hub-hero { display:grid; padding:15px; gap:12px; }
  .growth-hub-stat { min-width:0; }
  .growth-subgrid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .achievement-editor-grid { grid-template-columns:1fr; }
  .achievement-wall-hero { display:grid; padding:15px; gap:12px; }
  .achievement-wallets { min-width:0; }
  .main-road-track { grid-template-columns:repeat(4,1fr); }
  .achievement-wall-heading { display:grid; align-items:start; }
  .achievement-wall-heading > span { text-align:left; }
  .achievement-lane-grid { grid-template-columns:1fr; }
  .achievement-badge-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

.compact-modal {
  max-height: calc(100dvh - 16px);
  overflow-y: auto;
  padding: 16px 18px;
}
.one-page-modal { overflow: hidden; }
.one-page-modal .modal-task-summary,
.one-page-modal .validation-note,
.one-page-modal .privacy-check { display: none; }
.one-page-modal .form-stack { gap: 7px; }
.one-page-modal .field > span { font-size: 11px; }
.one-page-modal textarea { min-height: 54px; }
.one-page-modal .proof-tier { margin: 5px 0; }
.one-page-modal .proof-tier span { display: none; }
.one-page-modal .compact-file-field input[type="file"] { min-height: 38px; padding: 5px; }
.one-page-modal .modal-actions { margin-top: 5px; }
.report-preview-modal { max-width: 620px; }
.report-preview-modal pre { max-height: 55vh; overflow: auto; white-space: pre-wrap; padding: 12px; border-radius: 10px; background: #f7f5ef; color: var(--ink); font: inherit; font-size: 13px; line-height: 1.65; }
.compact-modal .modal-actions {
  position: sticky;
  bottom: -1px;
  z-index: 2;
  padding-top: 8px;
  background: var(--surface);
}
.compact-modal .modal-task-summary { max-height: 2.8em; overflow: hidden; }
.compact-modal h3 { margin: 5px 0; font-size: 20px; }
.compact-modal .modal-task-summary { margin: 0; font-size: 12px; line-height: 1.45; }
.compact-modal .form-stack { gap: 8px; }
.compact-modal .proof-tier { margin: 8px 0; gap: 7px; }
.compact-modal .proof-tier > div { padding: 8px 10px; }
.compact-modal .proof-tier b { font-size: 12px; }
.compact-modal .proof-tier strong { font-size: 15px; }
.compact-modal .proof-tier span { font-size: 11px; }
.compact-modal .field { gap: 4px; }
.compact-modal .field > span { font-size: 12px; }
.compact-modal textarea { min-height: 64px; resize: none; }
.compact-modal .compact-file-field input[type="file"] { min-height: 42px; padding: 7px; }
.compact-modal .validation-note,
.compact-modal .privacy-check,
.screen-checkin-tip { padding: 7px 9px; font-size: 11px; line-height: 1.4; }
.compact-modal .modal-actions { margin-top: 7px; }
.compact-modal .modal-actions .button { min-height: 48px; flex: 1; }

.screen-quest-modal { width: min(620px,100%); }
.screen-reward-tip {
  margin: 6px 0;
  padding: 6px 9px;
  border: 1px solid #b9d8c8;
  border-radius: 9px;
  background: var(--green-soft);
  color: var(--green);
  font-size: 11px;
  line-height: 1.35;
}
.screen-reward-tip b { font-weight: 800; }
.screen-total-box {
  margin: 7px 0;
  padding: 9px 12px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 2px 12px;
  border: 1px solid #ddc477;
  border-radius: 12px;
  background: var(--sun-soft);
}
.screen-total-box strong { grid-row: 1 / 3; color: var(--green); font-size: 25px; }
.screen-total-box span { color: #70571a; font-size: 12px; font-weight: 800; }
.screen-total-box small { color: var(--muted); font-size: 11px; }
.screen-total-box small.over { color: var(--coral); font-weight: 800; }
.screen-overall-box { margin-bottom: 1px; }
.screen-overall-box small.over { color: var(--coral); font-weight: 800; }
.screen-compact-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }
.screen-compact-grid label { padding: 7px; display: grid; gap: 3px; border: 1px solid var(--line); border-radius: 10px; background: #f7f5ef; }
.screen-compact-grid strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.screen-compact-grid span { color: var(--muted); font-size: 10px; }
.screen-compact-grid input { width: 100%; min-height: 38px; padding: 6px; border: 1px solid var(--line); border-radius: 8px; font-size: 16px; }
.screen-category-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.screen-category-grid label { display:grid; gap:3px; padding:7px; border:1px solid #b9d8c8; border-radius:10px; background:var(--green-soft); }
.screen-category-grid span { font-size:11px; font-weight:800; color:var(--green); }
.screen-category-grid input { min-height:36px; padding:6px; border:1px solid var(--line); border-radius:8px; font-size:16px; }
.screen-category-summary { display:flex; gap:7px; flex-wrap:wrap; margin:7px 0; }
.screen-category-summary span { padding:4px 7px; border-radius:999px; background:var(--green-soft); color:var(--green); font-size:11px; font-weight:800; }
.screen-feedback { margin:7px 0; padding-left:18px; color:var(--green); font-size:12px; }
.bonus-task-suggestions { display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin:8px 0; color:var(--muted); font-size:12px; }
.bonus-task-suggestions .button { padding:6px 9px; font-size:12px; }
.link-button { border:0; background:transparent; color:var(--green); padding:6px 0; font-weight:800; }
.phone-code-row { display:grid; grid-template-columns:1fr auto; gap:10px; align-items:end; }
.screen-checkin-tip { border-radius: 9px; color: #53645b; background: var(--green-soft); }

@media (max-width: 820px) {
  .simple-today-head { padding: 8px 11px; grid-template-columns: minmax(0,1fr) auto; gap: 5px 9px; }
  .simple-today-head .eyebrow { font-size: 10px; }
  .simple-today-head h2 { font-size: 18px; }
  .today-score { min-width: 88px; text-align: right; }
  .today-score strong { font-size: 23px; }
  .today-score span { font-size: 10px; }
  .game-rule { grid-column: 1 / -1; }
  .game-rule b { font-size: 12px; }
  .game-rule span { display: none; }
  .quest-board { margin-top: 10px; }
  .quest-head { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; }
  .quest-head { margin: 0 0 8px; }
  .quest-head h2 { margin-top: 2px; font-size: 21px; }
  .quest-head p { display: none; }
  .game-wallet { width: auto; min-width: 110px; text-align: right; }
  .game-wallet span { font-size: 11px; }
  .game-wallet strong { font-size: 17px; }
  .diagnostic-entry { align-items: stretch; flex-direction: column; }
  .diagnostic-entry .button { width: 100%; }
  .compact-modal { padding: 14px; }
  .compact-modal .proof-tier { grid-template-columns: repeat(2,1fr); }
  .screen-compact-grid { grid-template-columns: repeat(2,1fr); }
  .screen-category-grid { grid-template-columns: repeat(3,1fr); }
}

@media (max-width: 380px) {
  .simple-today-head { padding: 8px 9px; }
  .simple-today-head h2 { font-size: 17px; }
  .quest-head { grid-template-columns: 1fr auto; }
  .quest-head h2 { font-size: 20px; }
  .game-wallet { min-width: 100px; padding: 7px 8px; }
  .game-wallet span { font-size: 10px; }
  .game-wallet strong { font-size: 15px; }
  .compact-modal { padding: 12px; border-radius: 14px; }
  .compact-modal .proof-tier strong { font-size: 13px; }
}

@media (max-height: 650px) {
  .modal-backdrop { padding: 5px; }
  .compact-modal { padding: 10px 12px; }
  .compact-modal .modal-task-summary,
  .compact-modal .proof-tier span,
  .compact-modal .validation-note,
  .screen-checkin-tip { display: none; }
  .compact-modal .proof-tier { margin: 5px 0; }
  .compact-modal textarea { min-height: 52px; }
  .compact-modal .privacy-check { font-size: 10px; }
  .screen-quest-modal .screen-total-box { margin: 3px 0; padding: 6px 8px; }
  .screen-quest-modal .screen-total-box strong { font-size: 20px; }
  .screen-quest-modal .screen-total-box span,
  .screen-quest-modal .screen-total-box small { font-size: 10px; }
  .screen-quest-modal .screen-compact-grid { grid-template-columns: repeat(4,1fr); gap: 4px; }
  .screen-quest-modal .screen-compact-grid label { padding: 4px; }
  .screen-quest-modal .screen-compact-grid strong { font-size: 10px; }
  .screen-quest-modal .screen-compact-grid span { display: none; }
  .screen-quest-modal .screen-compact-grid input { min-height: 34px; padding: 4px; font-size: 14px; }
  .screen-quest-modal .compact-file-field input[type="file"] { min-height: 36px; padding: 4px; }
}

/* 2026-07-24：今日页把高度还给任务；未来安排和凭据提交都保持一页可见。 */
.simple-today-head {
  padding: 7px 12px;
  box-shadow: none;
}
.simple-today-head h2 { font-size: 19px; }
.simple-today-head .game-rule { margin-top: 1px; }
.game-rule span { max-height: 1.45em; overflow: hidden; }
.future-plan {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface);
}
.future-plan > summary {
  padding: 11px 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
  list-style: none;
}
.future-plan > summary::-webkit-details-marker { display: none; }
.future-plan > summary b, .future-plan > summary small { display: block; }
.future-plan > summary b { color: var(--green); font-size: 13px; }
.future-plan > summary small { margin-top: 2px; color: var(--muted); font-size: 11px; }
.future-summary-action { color: var(--green); font-size: 11px; font-weight: 800; }
.future-plan[open] .future-summary-action { font-size: 0; }
.future-plan[open] .future-summary-action::after { content: "收起"; font-size: 11px; }
.future-plan .future-grid { padding: 0 11px 11px; }
.future-plan .future-grid article { padding: 13px; }
.one-page-modal {
  max-height: min(680px, calc(100dvh - 18px));
  overflow: hidden;
}
.one-page-modal .modal-actions { position: static; }
.one-page-modal .field input,
.one-page-modal .field textarea { min-height: 42px; }
.screen-quest-modal .field input { min-height: 40px; }

@media (max-width: 820px) {
  .simple-today-head { padding: 6px 10px; }
  .simple-today-head h2 { font-size: 18px; }
  .game-rule span { display: none; }
  .future-plan .future-grid { grid-template-columns: 1fr; }
  .one-page-modal { max-height: calc(100dvh - 12px); padding: 12px; }
  .one-page-modal .proof-tier { gap: 5px; }
  .one-page-modal .proof-tier > div { padding: 7px 8px; }
  .one-page-modal .proof-tier b { font-size: 11px; }
  .one-page-modal .proof-tier strong { font-size: 13px; }
  .screen-quest-modal .screen-checkin-tip { display: none; }
}