:root {
  color-scheme: light;
  --navy: #22243c;
  --ink: #272b3e;
  --subtle: #60677e;
  --blue: #365ecc;
  --blue-soft: #eef1fc;
  --line: #e2e4ed;
  --canvas: #f4f5f9;
  --surface: #fff;
  --radius: 8px;
  font: 14px/1.6 "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", sans-serif;
  color: var(--ink);
  background: var(--canvas);
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, summary { cursor: pointer; }
button:disabled { cursor: default; opacity: .65; }
:focus-visible { outline: 3px solid #5299ea; outline-offset: 3px; }
h1, h2, h3, h4, p { margin: 0; }
h1, h2, h3, h4 { line-height: 1.36; }
svg { display: block; flex-shrink: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.inline-heading { display: inline-flex; align-items: center; gap: 4px; }
.info-button { display: inline-grid; place-items: center; flex-shrink: 0; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 5px; background: transparent; color: var(--subtle); }
.info-button:hover, .info-button:focus-visible { background: var(--blue-soft); color: var(--blue); }
.info-tip { position: fixed; z-index: 100; max-width: min(250px,calc(100vw - 16px)); padding: 8px 11px; border-radius: 6px; background: var(--navy); color: #fff; font-size: 12px; font-weight: 400; box-shadow: 0 4px 14px #22243c40; }
.startup { margin: 18vh auto; text-align: center; color: var(--subtle); }
.startup a, .error a { color: var(--blue); text-decoration: underline; }
.shell { display: grid; grid-template-columns: 196px minmax(0,1fr); min-height: 100vh; }
.sidebar {
  z-index: 10;
  position: sticky;
  top: 0;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  color: var(--navy);
  background: var(--surface);
  border-right: 1px solid var(--line);
  overflow: auto;
}
.brand { display: inline-flex; align-items: center; gap: 8px; }
.sidebar .brand { padding: 23px 8px 23px 22px; }
.brand-emblem { display: block; width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%; background: transparent; }
.brand-name { display: inline-flex; align-items: center; padding-right: 0; font-family: "KaiTi", "STKaiti", "Kaiti SC", serif; font-size: 24px; font-weight: 700; letter-spacing: .03em; line-height: 1.2; white-space: nowrap; }
.sidebar nav { display: grid; gap: 5px; padding: 14px 12px 14px 0; }
.sidebar nav a { position: relative; display: flex; align-items: center; gap: 12px; padding: 13px 12px 13px 24px; border-radius: 0 6px 6px 0; font-size: 14px; color: var(--subtle); }
.sidebar nav a:hover { background: var(--canvas); color: var(--navy); }
.sidebar nav a[aria-current] { background: var(--blue-soft); color: var(--blue); font-weight: 700; }
.sidebar nav a[aria-current]::before { content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; border-radius: 0 2px 2px 0; background: var(--blue); }
.workspace { min-width: 0; display: flex; flex-direction: column; }
.footer-beian { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 9px; padding: 12px 16px 16px; border-top: 1px solid var(--line); background: var(--canvas); color: var(--subtle); font-size: 12px; line-height: 1.5; }
.footer-beian a { color: inherit; }
.footer-beian a:hover { color: var(--blue); }
.topbar { min-height: 64px; background: var(--surface); border-bottom: 1px solid var(--line); padding: 0 32px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.location { display: flex; gap: 10px; align-items: center; color: var(--subtle); font-size: 13px; }
.desktop-location:hover { color: var(--blue); }
.mobile-menu, .mobile-brand { display: none !important; }
.user-button { display: inline-flex; gap: 8px; align-items: center; border: 0; padding: 4px; background: transparent; color: var(--navy); white-space: nowrap; }
.user-icon { display: grid; place-items: center; border-radius: 50%; width: 30px; height: 30px; background: var(--blue-soft); color: var(--blue); }
.main { width: 100%; max-width: 1380px; padding: 32px 36px; margin: 0 auto; flex: 1; }
.main.dashboard { display: flex; flex-direction: column; padding: 0; max-width: none; }
.dashboard > .error { margin: 16px 24px 0; }
.dashboard-layout { display: grid; grid-template-columns: minmax(0,1fr) 284px; flex: 1; }
.dashboard-content { width: 100%; max-width: 1280px; margin: 0 auto; padding: 36px; min-width: 0; }
.project-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 14px 24px; min-height: 108px; padding: 17px 19px; margin-bottom: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(90deg, #f4f5f9 22%, #f4f5f9d9 46%, #f4f5f980 100%), url("/campus.webp") right 36% / 68% auto no-repeat, var(--canvas); }
.project-heading h1 { font-size: clamp(24px,2.5vw,36px); color: var(--navy); }
.project-heading p { margin-top: 6px; color: var(--subtle); }
.project-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.framework { margin-top: 25px; }
.framework h2, .dashboard-rail h2 { font-size: 17px; color: var(--navy); }
.framework header { margin-bottom: 12px; }
.dashboard-rail { padding: 33px 24px; background: var(--surface); border-left: 1px solid var(--line); min-width: 0; }
.dashboard-rail > header { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.collection-overview { display: grid; gap: 27px; margin-top: 26px; }
.collection-total { display: grid; justify-items: start; gap: 8px; padding: 12px 0 21px; border-bottom: 1px solid var(--line); }
.collection-total span, .collection-stats dt { color: var(--subtle); font-size: 13px; }
.collection-total strong { color: var(--navy); font-size: 48px; line-height: 1; font-variant-numeric: tabular-nums; }
.collection-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin: 0; }
.collection-stats div { background: var(--canvas); border-radius: 6px; padding: 13px 11px; min-width: 0; }
.collection-stats dd { margin: 4px 0 0; padding-left: 7px; color: var(--navy); font-size: 23px; font-weight: 700; line-height: 1.1; border-left: 2px solid #7a93e0; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 39px; padding: 8px 13px; border-radius: 6px; border: 1px solid transparent; white-space: nowrap; }
.primary { color: #fff; background: var(--blue); border-color: var(--blue); font-weight: 700; box-shadow: 0 2px 4px #345bc526; }
.primary:hover { background: #2b51b7; }
.secondary { color: var(--navy); background: #fff; border-color: #dadde9; }
.secondary:hover { color: var(--blue); background: var(--blue-soft); }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); min-width: 0; }
.empty-icon { display: grid; place-items: center; color: var(--blue); background: var(--blue-soft); }
.empty-icon.green { color: #137c69; background: #e5f6ef; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 19px; min-height: 55px; border-bottom: 1px solid var(--line); }
.panel-head h2, .padded h2 { font-size: 17px; color: var(--navy); }
.trend-chart { padding: 14px 18px 15px; }
.trend-chart ol { display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 6px; padding: 0; margin: 0; list-style: none; }
.trend-chart li { display: grid; justify-items: center; grid-template-rows: 17px 86px 16px; gap: 5px; }
.trend-count { font-size: 11px; color: var(--blue); font-weight: 700; }
.trend-track { display: flex; align-items: end; justify-content: center; width: 100%; border-bottom: 1px solid var(--line); background: repeating-linear-gradient(to top, transparent 0, transparent 27px, #eef0f6 27px, #eef0f6 28px); }
.trend-track > span { width: min(68%, 25px); height: var(--bar); background: var(--blue); border-radius: 3px 3px 0 0; }
.trend-chart time { font-size: 10px; white-space: nowrap; color: var(--subtle); }
.trend-combo { padding: 15px 18px 16px; }
.trend-combo header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 2px; }
.trend-combo h3 { color: var(--navy); font-size: 14px; }
.trend-combo svg { display: block; width: 100%; height: auto; overflow: visible; }
.combo-grid { fill: none; stroke: #eef0f6; stroke-width: 1; }
.combo-bars rect { fill: var(--blue); opacity: .24; }
.combo-line { fill: none; stroke: var(--blue); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.combo-points { fill: var(--surface); stroke: var(--blue); stroke-width: 2; }
.combo-labels { fill: var(--subtle); font-size: 10px; }
.share-card { width: min(100%, 680px); margin: 24px auto 0; padding: 32px; }
.share-card header { text-align: center; }
.share-card h2 { font-size: 21px; color: var(--navy); }
.share-card header p { margin-top: 8px; color: var(--subtle); }
.share-figure { display: grid; justify-items: center; gap: 10px; margin: 26px auto 24px; }
.share-figure canvas { display: block; width: min(232px, 100%); height: auto; border: 1px solid var(--line); border-radius: 9px; image-rendering: pixelated; background: #fff; }
.share-figure figcaption { color: var(--subtle); font-size: 13px; }
.share-placeholder { display: grid; justify-items: center; gap: 14px; padding: 28px 0 8px; color: var(--blue); }
.share-label { display: block; margin-bottom: 6px; color: var(--ink); }
.share-url-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.share-url-row #shared-url { background: var(--canvas); }
.share-secondary { display: flex; justify-content: flex-end; margin-top: 11px; }
.analysis-toolbar, .analysis-results { display: grid; gap: 15px; }
.analysis-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
.analysis-kpis, .analysis-charts { display: grid; gap: 12px; }
.analysis-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
.analysis-kpis div { padding: 13px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.analysis-kpis dt { color: var(--subtle); }
.analysis-kpis dd { margin: 4px 0 0; font-size: 25px; color: var(--navy); font-weight: 700; font-variant-numeric: tabular-nums; }
.analysis-charts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.score-bars, .comparison-bars { padding: 15px 19px 18px; display: grid; gap: 9px; }
.score-bars > div { display: grid; grid-template-columns: 34px minmax(0, 1fr) 32px 50px; align-items: center; gap: 8px; font-size: 12px; }
.score-bars > div > :nth-last-child(-n+2) { text-align: right; }
.score-bars > div > span:last-child { color: var(--subtle); }
.score-track { display: block; width: 100%; height: 8px; border-radius: 4px; background: #eaedf7; overflow: hidden; }
.score-track > span { display: block; width: var(--bar); height: 100%; border-radius: inherit; background: var(--blue); }
.comparison-bars { gap: 16px; }
.comparison-bars > div > div { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 5px; }
.feedback-table { min-width: 600px; }
.feedback-table td { vertical-align: top; }
.feedback-table td:first-child { white-space: nowrap; }
.feedback-table td:nth-child(2) { width: 27%; }
.feedback-table td:nth-child(3) { width: 48%; }
.feedback-text { white-space: pre-wrap; }
.feedback-tools { flex-wrap: wrap; }
.status { color: #0a6755; background: #e7f5ee; border: 1px solid #cee9de; border-radius: 100px; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; white-space: nowrap; }
.status::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.status.muted { background: #edf2f8; border-color: #dce6f0; color: #4b6177; }
.status.pending { background: #fff4df; border-color: #f0dfb7; color: #82551b; }
.framework-links { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.framework-links a { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 13px; padding: 14px 17px; }
.framework-links a + a { border-top: 1px solid var(--line); }
.framework-links a:hover { color: var(--blue); background: var(--blue-soft); }
.framework-links a:focus-visible { outline-offset: -3px; }
.framework-links a > svg { color: #6a7395; }
.framework-links small { display: block; margin-top: 2px; color: var(--subtle); font-size: 12px; }
.text-link { padding: 0; display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; color: var(--blue); font-size: 13px; }
.text-link:hover { text-decoration: underline; }
.text-link.gray { color: var(--subtle); }
.text-link.danger { color: #b23836; }
.text-link.danger:hover { color: #8e2627; }
.row-actions { display: inline-flex; align-items: center; gap: 13px; white-space: nowrap; }
.page-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 0 0 20px; }
.page-heading h1 { font-size: 26px; }
.padded { padding: 20px; }
.long-text { color: var(--subtle); margin: 10px 0; line-height: 1.85; }
.spaced { margin-top: 16px; }
.spaced[id] { scroll-margin-top: 76px; }
.research-details { padding: 12px 20px; }
.research-details summary { color: var(--blue); }
.dimensions { padding: 4px 20px 10px; }
.dimensions details { border-bottom: 1px solid var(--line); padding: 12px 0; }
.dimensions details:last-child { border-bottom: 0; }
.dimensions summary { font-weight: 700; color: var(--navy); }
.dimensions p { margin: 6px 0 0; color: var(--subtle); }
.dimensions ul { padding-left: 23px; }
.dimensions li { margin-top: 10px; }
.round-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.round-controls h2 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.subtle { color: var(--subtle); font-size: 12px; }
.empty, .survey-state { padding: 48px 18px; text-align: center; display: grid; justify-items: center; gap: 10px; }
.empty-icon { width: 52px; height: 52px; border-radius: 13px; }
.empty strong { font-size: 17px; }
.survey-state p { color: var(--subtle); margin-bottom: 4px; }
.table-tools { display: flex; align-items: center; gap: 6px; padding: 12px 15px; border-bottom: 1px solid var(--line); }
.table-wrap { overflow: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; }
td, th { border-bottom: 1px solid var(--line); padding: 12px 15px; font-size: 13px; overflow-wrap: anywhere; }
th { background: var(--canvas); font-size: 12px; color: var(--subtle); white-space: nowrap; }
tr:last-child td { border-bottom: 0; }
.no-match { text-align: center; color: var(--subtle); }
input:not([type=radio]):not([type=checkbox]), select, textarea { border: 1px solid #ccd0de; padding: 9px 10px; border-radius: 6px; background: #fff; color: var(--ink); min-width: 0; }
textarea { resize: vertical; }
.icon-btn { padding: 5px; display: grid; place-items: center; background: transparent; border: 0; border-radius: 5px; color: var(--navy); }
.icon-btn:hover { background: var(--blue-soft); }
dialog { color: var(--ink); width: min(94vw,465px); max-height: 87vh; padding: 0; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 16px 52px #25294336; }
dialog.wide { width: min(94vw,900px); }
dialog::backdrop { background: #23274180; }
dialog > header { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding: 14px 18px; background: var(--surface); position: sticky; top: 0; border-bottom: 1px solid var(--line); z-index: 1; }
dialog h2 { font-size: 18px; }
dialog h3 { font-size: 15px; margin: 18px 0 6px; }
.modal-body { padding: 15px 18px 18px; }
.modal-actions { margin-top: 17px; display: flex; justify-content: flex-end; gap: 8px; }
.profile-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.profile-list div { padding: 8px; background: var(--canvas); border-radius: 5px; overflow-wrap: anywhere; }
.profile-list dt { font-size: 12px; color: var(--subtle); }
.profile-list dd { margin: 3px 0 0; white-space: pre-wrap; }
.toast { display: none; position: fixed; z-index: 99; right: 20px; bottom: 20px; max-width: calc(100% - 40px); color: white; background: var(--navy); border-radius: 6px; padding: 10px 14px; box-shadow: 0 6px 18px #25294336; }
.toast.show { display: block; }
.error, .form-error:not(:empty) { padding: 9px 11px; border-radius: 6px; background: #fff0f0; color: #993132; margin: 0 0 12px; }
.field { display: block; color: var(--ink); font-size: 14px; margin: 8px 0; }
.field input, .field select, .field textarea { width: 100%; display: block; margin-top: 5px; font-weight: 400; }
.req { color: #b23836; }
.survey-shell { min-height: 100vh; }
.survey-top { display: flex; align-items: center; justify-content: space-between; padding: 12px max(20px,calc((100% - 1090px)/2)); background: #fff; color: var(--navy); border-bottom: 1px solid var(--line); }
.survey-main { width: min(100% - 40px,1090px); margin: 30px auto; }
.survey-hero { color: var(--navy); border-bottom: 1px solid var(--line); padding: 0 0 19px; margin-bottom: 20px; }
.survey-hero p { color: var(--subtle); margin-top: 5px; }
.survey-hero h1 { font-size: clamp(20px,3vw,32px); }
.survey-layout { display: grid; grid-template-columns: 166px minmax(0,1fr); align-items: start; gap: 20px; }
.step-panel { position: sticky; top: 18px; }
.step-panel ol { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.step-panel button { width: 100%; text-align: left; display: flex; align-items: center; gap: 9px; border: 0; background: transparent; color: var(--subtle); padding: 8px; border-radius: 6px; white-space: nowrap; font-size: 13px; }
.step-panel button:hover:not(:disabled) { color: var(--blue); background: var(--blue-soft); }
.step-panel button span { width: 23px; height: 23px; display: grid; place-items: center; color: var(--subtle); background: var(--surface); border: 1px solid var(--line); border-radius: 50%; font-size: 11px; }
.step-panel button[aria-current] { color: var(--blue); background: var(--blue-soft); font-weight: 700; }
.step-panel button[aria-current] span { color: #fff; background: var(--blue); border-color: var(--blue); }
.survey-body { padding: 20px 24px; }
.survey-heading { display: flex; align-items: center; gap: 6px; border-bottom: 1px solid var(--line); padding-bottom: 12px; margin-bottom: 13px; }
.survey-heading h2 { font-size: 21px; color: var(--navy); }
.score-progress { margin-left: auto; white-space: nowrap; color: var(--subtle); font-size: 12px; font-variant-numeric: tabular-nums; }
.prose { color: var(--ink); line-height: 1.9; }
.prose p { margin: 8px 0; }
.letter-sign { text-align: right; }
.framework-details { background: var(--canvas); padding: 8px 12px; border-radius: 6px; color: var(--blue); }
.framework-details p { margin-top: 6px; line-height: 1.8; }
.consent { display: flex; gap: 8px; align-items: center; margin: 16px 0; color: var(--ink); }
input[type=radio], input[type=checkbox] { accent-color: var(--blue); }
.fields-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2px 12px; }
fieldset { min-width: 0; }
.fields-set { border: 1px solid var(--line); border-radius: 8px; padding: 10px; margin: 15px 0; }
.fields-set legend { font-weight: 700; }
.option-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.option { display: flex; align-items: center; gap: 5px; background: var(--surface); border: 1px solid var(--line); border-radius: 5px; padding: 5px 7px; cursor: pointer; font-size: 13px; }
.option:has(:checked) { border-color: #879ce3; background: var(--blue-soft); }
.score-key { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 11px; padding: 10px; border-radius: 6px; color: var(--navy); background: var(--canvas); font-size: 12px; }
.score-key span { display: flex; gap: 4px; align-items: center; }
.score-key b { display: grid; place-items: center; width: 18px; height: 18px; background: #e6eafa; color: var(--blue); border-radius: 4px; }
.section-title { font-size: 16px; color: var(--navy); margin: 22px 0 8px; }
.rating-item { padding: 18px 0; border-bottom: 1px solid var(--line); display: block; }
.rating-content { display: block; }
.rating-item h4 { color: #171a2b; font-size: 18px; line-height: 1.5; }
.rating-item p { margin-top: 8px; color: #2a3042; font-size: 16px; line-height: 1.5; }
.rating-set { padding: 0; border: 0; margin: 16px 0 0; }
.rating-options { display: flex; flex-wrap: wrap; gap: 8px; }
.rating-options label { cursor: pointer; position: relative; display: grid; }
.rating-options input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.rating-options span {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid #cdd3e0;
  border-radius: 50%;
  background: linear-gradient(155deg, #fff, #ebeff6);
  box-shadow: inset 0 1px 2px #fff, inset 0 -2px 3px #34496b13, 0 2px 4px #34496b24;
  color: var(--navy);
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.rating-options input:hover:not(:checked) + span { border-color: #859bd8; color: var(--blue); }
.rating-options input:checked + span {
  border-color: #2b4cab;
  background: linear-gradient(155deg, #3c65d3, #2748a8);
  box-shadow: inset 0 1px 2px #ffffff4d, inset 0 -2px 3px #172d7833, 0 2px 5px #254aaa40;
  color: #fff;
}
.rating-options input:focus-visible + span { outline: 2px solid var(--blue); outline-offset: 2px; }
@media (forced-colors: active) {
  .rating-options input:checked + span { forced-color-adjust: none; background: Highlight; border-color: Highlight; color: HighlightText; box-shadow: none; }
}
.comment { margin-top: 14px; font-size: 13px; color: var(--blue); }
.comment textarea { display: block; width: 100%; margin-top: 6px; font-size: 15px; }
.rating-group { margin: 14px 0 20px; }
.rating-group > h3 { padding: 8px 10px; background: var(--canvas); font-size: 14px; color: var(--navy); }
.suggestion { padding: 3px 0; }
.bases { display: grid; gap: 6px; }
.bases fieldset { border: 1px solid var(--line); border-radius: 7px; padding: 6px 10px 8px; }
.bases legend { font-size: 14px; }
.choice-row { display: flex; gap: 6px; }
.survey-actions { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 12px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.survey-actions button:first-child { justify-self: start; }
.survey-actions button:last-child { justify-self: end; }
.survey-tip { justify-self: center; }
.review-list > div { padding: 8px 0; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.review-list p { color: var(--subtle); margin-top: 2px; overflow-wrap: anywhere; }
.receipt { overflow-wrap: anywhere; }
@media (max-width: 1110px) {
  .dashboard-layout { grid-template-columns: minmax(0,1fr); }
  .dashboard-content { padding: 28px; }
  .dashboard-rail { padding: 24px 28px; border-left: 0; border-top: 1px solid var(--line); }
  .collection-overview { grid-template-columns: 160px minmax(0,1fr); gap: 24px; align-items: center; }
}
@media (max-width: 940px) {
  .shell { grid-template-columns: 182px minmax(0,1fr); }
  .main, .topbar { padding-inline: 20px; }
  .sidebar .brand { padding-inline: 15px; }
}
@media (max-width: 760px) {
  .shell { display: block; }
  .sidebar { display: none; position: fixed; inset: 57px auto 0 0; height: calc(100dvh - 57px); width: 200px; box-shadow: 8px 0 25px #25294325; }
  .sidebar.expanded { display: flex; }
  .sidebar .brand, .desktop-location { display: none; }
  .mobile-menu { display: grid !important; margin-left: -6px; }
  .mobile-brand { display: inline-flex !important; gap: 7px; color: var(--navy); }
  .mobile-brand .brand-emblem { width: 31px; height: 31px; }
  .mobile-brand .brand-name { font-size: 19px; }
  .topbar { min-height: 57px; position: sticky; top: 0; z-index: 11; padding-inline: 14px; }
  .user-button { font-size: 12px; gap: 4px; }
  .user-icon { width: 26px; height: 26px; }
  .main { padding: 20px 14px; }
  .footer-beian { padding: 10px 12px 14px; font-size: 11px; }
  .dashboard-content, .dashboard-rail { padding: 22px 16px; }
  .project-heading { margin-bottom: 16px; padding: 15px; background-size: auto, cover, auto; }
  .framework { margin-top: 20px; }
  .survey-layout { display: flex; flex-direction: column; gap: 12px; }
  .step-panel { position: static; width: 100%; padding: 1px 3px; }
  .step-panel ol { display: flex; margin: 0; gap: 2px; overflow: auto; }
  .step-panel li { flex: 1 0 43px; }
  .step-panel button { flex-direction: column; padding: 4px 1px; gap: 3px; font-size: 10px; text-align: center; }
  .survey-body { width: 100%; padding: 14px; }
  .survey-main { width: calc(100% - 28px); margin: 20px auto; }
  .survey-hero { margin-bottom: 12px; padding-bottom: 13px; }
  .analysis-charts { grid-template-columns: minmax(0, 1fr); }
  .share-card { padding: 22px 18px; }
}
@media (max-width: 460px) {
  .collection-overview { grid-template-columns: minmax(0,1fr); gap: 12px; margin-top: 16px; }
  .collection-total { padding: 5px 0 12px; }
  .collection-total strong { font-size: 36px; }
  .trend-label-optional { visibility: hidden; }
  .trend-chart { padding-inline: 9px; }
  .trend-chart ol { gap: 2px; }
  .analysis-kpis div { padding: 8px; }
  .analysis-kpis dt { font-size: 12px; }
  .analysis-kpis dd { font-size: 20px; }
}
@media (max-width: 415px) {
  .fields-grid { grid-template-columns: 1fr; }
  .page-heading h1 { font-size: 23px; }
  .btn { font-size: 12px; padding-inline: 10px; }
  .round-controls { align-items: start; }
  .survey-top { padding-inline: 12px; }
}