/* Campus pass design system. Loaded after legacy layouts. */
:root {
  --ink:#183c32;
  --muted:#617269;
  --paper:#f5f5ee;
  --surface:#fff;
  --line:#dce2d8;
  --accent:#d4ec7b;
  --danger:#a4352a;
  --s-text:var(--ink);
  --s-muted:var(--muted);
  --s-border:var(--line);
  --s-card:#fff;
  --s-card-strong:#fff;
  --s-shadow:none;
  --ui-text:var(--ink);
  --ui-muted:var(--muted);
  --ui-border:var(--line);
  --ui-card:#fff;
  --ui-card-strong:#fff;
  --ui-shadow:none}

body.student-ui,body.admin-ui {
  color:var(--ink);
  background:var(--paper);
  font-family:"PingFang SC","Microsoft YaHei",sans-serif;
  font-size:15px;
  background-image:none}
a {
  color:var(--ink)}
button,input,select,textarea {
  font:inherit}
button,a,input,select,summary {
  touch-action:manipulation}
*:focus-visible {
  outline:3px solid #487c3d!important;
  outline-offset:3px}
button:disabled {
  cursor:not-allowed}
.btn {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 18px;
  border-radius:8px;
  box-shadow:none!important;
  transition:background .15s;
  color:var(--ink);
  border:1px solid var(--line);
  background:#fff;
  white-space:normal}
.btn:hover {
  transform:none;
  box-shadow:none;
  background:#edf1e7;
  opacity:1}
.btn-primary,.btn-success {
  background:var(--ink);
  color:white;
  border-color:var(--ink)}
.btn-primary:hover,.btn-success:hover {
  background:#285446}
.btn-info {
  background:#e7efe8;
  color:var(--ink)}
.btn-secondary {
  background:white;
  color:var(--ink)}
.btn-warning {
  background:#fbefc7;
  color:#6a4d10}
.btn-danger {
  background:#a4352a;
  color:white}
.btn-block {
  width:100%}
.btn:disabled {
  opacity:.45}
.form-control {
  background:#fff;
  color:var(--ink);
  border:1px solid #bcc9bf;
  min-height:48px;
  border-radius:8px;
  font-size:16px;
  box-shadow:none}
.form-control:focus {
  border-color:var(--ink);
  box-shadow:0 0 0 3px #d4ec7b66}
.form-group label {
  color:var(--ink);
  font-weight:600}
.alert {
  border-radius:8px;
  box-shadow:none;
  line-height:1.8}
.alert-info {
  background:#eaf1e7;
  color:#254d35;
  border-color:#cddfcb}
.alert-warning {
  background:#fff4db;
  color:#785616;
  border-color:#e9d9ad}
.alert-danger,.alert-error {
  background:#fff0ec;
  color:var(--danger)}
.footer {
  background:transparent;
  color:var(--muted);
  border-top:1px solid var(--line);
  font-size:12px;
  padding:24px 16px;
  box-shadow:none}
.eyebrow {
  display:block;
  font-family:ui-monospace,monospace;
  font-size:11px;
  font-weight:600;
  letter-spacing:2px;
  color:var(--muted);
  margin-bottom:12px}
.brand-mark {
  display:inline-grid;
  place-items:center;
  background:var(--ink);
  color:var(--accent);
  width:40px;
  height:40px;
  border-radius:10px;
  font-family:Georgia,serif;
  font-weight:bold;
  font-size:28px;
  flex-shrink:0}
/* 品牌位换成校徽图片后的样式（2026-09-18）：圆形，4px 白色边框。
   学生端顶栏是浅色纸底，白圈本身不显形，靠一层柔和投影衬出轮廓；
   管理侧栏是深绿底，白圈直接可见。 */
img.brand-mark {
  display:block;
  width:40px;
  height:40px;
  border-radius:50%;
  border:4px solid #fff;
  object-fit:cover;
  background:#fff;
  flex-shrink:0;
  box-shadow:0 1px 6px rgba(23,61,50,.18),0 6px 16px rgba(23,61,50,.08)}
.student-header {
  padding:20px max(24px,calc((100vw - 1160px)/2));
  box-shadow:none;
  background:var(--paper);
  backdrop-filter:none;
  border-bottom:1px solid var(--line);
  gap:20px}
.student-brand {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:18px;
  font-weight:700}
.student-brand:hover {
  text-decoration:none}
.student-brand small {
  display:block;
  font-size:11px;
  font-weight:400;
  color:var(--muted);
  letter-spacing:1px}
.user-info {
  gap:18px;
  font-size:13px}
.user-info span {
  font-size:13px}
.btn-logout {
  border-radius:6px;
  background:transparent;
  color:var(--muted);
  padding:6px 10px}
.student-container {
  min-height:calc(100vh - 110px)}
.content-wrapper {
  max-width:1160px;
  margin:40px auto;
  padding:0 24px}
.page-intro {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:24px;
  margin-bottom:32px}
.page-intro h1 {
  font-size:clamp(28px,4vw,42px);
  letter-spacing:-1px;
  line-height:1.3;
  margin-bottom:12px}
.page-intro p {
  color:var(--muted)}
.campus-tag {
  background:#e8ecdF;
  padding:10px 16px;
  border-radius:6px;
  white-space:nowrap;
  font-size:13px}
.booking-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 310px;
  gap:28px;
  align-items:start}
.booking-form-container,.exam-notices,.confirm-container,.modify-container {
  padding:28px;
  background:white;
  border:1px solid var(--line);
  border-radius:12px;
  box-shadow:none;
  backdrop-filter:none}
.booking-form-container {
  margin:0}
.booking-section {
  border:0;
  border-bottom:1px solid var(--line);
  padding:24px 0}
.booking-section:first-of-type {
  padding-top:8px}
.booking-section legend {
  font-weight:700;
  font-size:17px;
  padding-top:20px}
.step-number {
  font-family:ui-monospace,monospace;
  color:var(--muted);
  font-size:12px;
  margin-right:12px}
.choice-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:16px}
.choice-card {
  position:relative;
  text-align:left;
  min-height:82px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  color:var(--ink);
  display:flex;
  flex-direction:column;
  gap:5px;
  cursor:pointer}
.choice-card strong {
  font-size:16px;
  font-weight:600;
  font-variant-numeric:tabular-nums}
.choice-card small {
  font-size:12px;
  color:var(--muted)}
.choice-card[aria-pressed=true] {
  border:2px solid var(--ink);
  padding:15px;
  background:#f2f6e7}
.choice-card[aria-pressed=true]:after {
  content:'✓';
  position:absolute;
  right:10px;
  top:8px;
  font-size:12px}
.choice-card[aria-disabled=true] {
  background:#f6f6f3;
  color:#7b817b}
.choice-card[aria-disabled=true] small {
  color:#7b817b}
.date-tabs {
  display:flex;
  gap:10px;
  overflow-x:auto;
  padding:4px 2px 12px;
  scrollbar-width:thin;
  margin-top:12px}
.date-tab {
  flex:0 0 88px;
  min-height:84px;
  text-align:center;
  align-items:center;
  padding:12px}
.date-tab strong {
  font-size:22px}
.date-tab[aria-pressed=true] {
  background:var(--accent);
  padding:11px}
.date-tab[aria-pressed=true]:after {
  display:none}
.sync-bar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:12px;
  color:var(--muted);
  border-bottom:1px solid var(--line);
  padding-bottom:16px}
.sync-bar button {
  background:none;
  border:0;
  color:var(--ink);
  min-height:44px;
  cursor:pointer;
  padding:8px}
.sync-bar[data-state=error] {
  color:var(--danger)}
.empty-state {
  padding:24px 8px;
  color:var(--muted);
  line-height:1.8}
.booking-message {
  margin-top:16px;
  font-size:13px;
  color:var(--danger)}
.booking-message:empty {
  display:none}
.booking-summary {
  background:var(--ink);
  color:#fff;
  border-radius:12px;
  padding:24px;
  position:sticky;
  top:24px}
.booking-summary .eyebrow {
  color:#bed2bd}
.booking-summary h2 {
  font-size:24px;
  margin:8px 0 24px}
.summary-row {
  border-top:1px solid #ffffff25;
  padding:16px 0}
.summary-row small {
  display:block;
  color:#bfcec4;
  font-size:12px;
  margin-bottom:6px}
.summary-row strong {
  font-size:16px;
  font-weight:500}
.summary-footer {
  border-top:1px dashed #ffffff55;
  margin-top:8px;
  padding-top:20px;
  color:#cddccf;
  font-size:12px}
.submit-bar {
  padding-top:20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px}
.submit-bar small {
  font-size:12px;
  color:var(--muted)}
.submit-bar .btn {
  min-width:160px}
.exam-notices {
  margin-top:24px;
  padding:24px}
.exam-notices h3 {
  font-size:16px;
  margin-bottom:16px}
.notice-item {
  background:#f7f8f3;
  border:0;
  border-left:3px solid #aec484;
  border-radius:0;
  padding:14px 16px}
.notice-item p {
  color:var(--muted);
  overflow-wrap:anywhere}
.notice-important {
  background:#fbf5e7;
  border-color:#c6a54f}
.notice-warning {
  background:#fff0ec;
  border-color:#ba7764}
.login-container {
  min-height:calc(100vh - 110px);
  max-width:1160px;
  margin:auto;
  padding:48px 24px;
  display:grid;
  grid-template-columns:1fr 420px;
  gap:80px;
  align-items:center;
  background:none}
.login-story h2 {
  font-size:clamp(28px,3.2vw,44px);
  font-weight:650;
  line-height:1.5;
  letter-spacing:-1px;
  margin:20px 0}
.login-story p {
  font-size:16px;
  color:var(--muted);
  line-height:1.9}
.story-ticket {
  position:relative;
  max-width:400px;
  margin:32px 0;
  background:var(--accent);
  border-radius:12px;
  padding:28px;
  transform:rotate(-3deg)}
.story-ticket span {
  font:11px ui-monospace,monospace;
  letter-spacing:2px}
.story-ticket strong {
  display:block;
  font-size:28px;
  margin:14px 0}
.story-ticket small {
  display:block;
  border-top:1px dashed #7f984a;
  padding-top:16px}
.sound-bars {
  font-size:36px;
  letter-spacing:4px;
  line-height:1.5;
  overflow:hidden;
  white-space:nowrap}
.story-bottom {
  font-size:12px;
  color:var(--muted)}
.login-box {
  width:100%;
  max-width:none;
  padding:36px;
  background:white;
  border:1px solid var(--line);
  border-radius:12px;
  box-shadow:none;
  backdrop-filter:none}
.login-header {
  text-align:left;
  margin-bottom:24px}
.login-header h1 {
  font-size:13px;
  line-height:1.6;
  color:var(--muted);
  margin-bottom:24px}
.login-header h2 {
  font-size:28px;
  color:var(--ink);
  margin:8px 0}
.login-header p {
  color:var(--muted);
  font-size:13px}
.system-logo {
  display:none}
/* 统一登录页恢复展示校徽 LOGO（2026-09-18）：圆形，4px 白色边框。
   只对学生端页面（student-ui）放开；管理端登录页维持隐藏，避免影响已定稿的后台版式。
   登录卡片是白底，白色描边需要一层柔和投影来衬出轮廓。 */
.student-ui .system-logo {
  display:block;
  margin:0 0 18px}
.student-ui .system-logo img {
  width:72px;
  height:72px;
  border-radius:50%;
  border:4px solid #fff;
  object-fit:cover;
  background:#fff;
  display:block;
  box-shadow:0 2px 10px rgba(23,61,50,.16),0 12px 28px rgba(23,61,50,.10)}
.login-notice {
  margin-top:24px;
  border-top:1px solid var(--line);
  padding:20px 0 0;
  background:none}
.login-notice h3 {
  font-size:13px}
.login-notice li {
  color:var(--muted);
  font-size:12px;
  line-height:1.9}
.confirm-container {
  max-width:850px;
  margin:auto}
.confirm-container h2 {
  font-size:25px;
  line-height:1.5;
  margin-bottom:16px}
.success-icon {
  width:48px;
  height:48px;
  background:#edf4d8;
  border:0;
  box-shadow:none}
.success-icon:before {
  border-color:var(--ink);
  width:20px;
  height:12px}
.exam-pass {
  background:var(--ink);
  color:white;
  border-radius:12px;
  text-align:left;
  padding:28px;
  margin-bottom:24px}
.exam-pass .eyebrow {
  color:var(--accent)}
.exam-pass h3 {
  font-size:32px;
  letter-spacing:1px}
.exam-pass .pass-time {
  font-size:24px;
  margin-bottom:20px;
  font-variant-numeric:tabular-nums}
.pass-details {
  border-top:1px dashed #ffffff55;
  padding-top:20px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px}
.pass-details small {
  display:block;
  color:#c5d3c8;
  margin-bottom:4px}
.pass-note {
  font-size:12px;
  color:#d3dfd4;
  margin-top:20px}
.info-table {
  table-layout:fixed}
.info-table .label {
  width:90px}
.info-table td {
  overflow-wrap:anywhere}
.admit-left,.admit-right,.admit-card-box {
  box-shadow:none!important;
  background:white!important;
  border-color:var(--line)!important}
.current-booking {
  background:#edf3e8;
  border-color:var(--ink)}
.button-group,.action-buttons {
  flex-wrap:wrap}
dialog.booking-dialog {
  margin:auto;
  max-width:440px;
  width:calc(100% - 32px);
  padding:28px;
  border:1px solid var(--line);
  border-radius:12px;
  color:var(--ink)}
dialog::backdrop {
  background:#10291f99}
dialog h2 {
  font-size:22px;
  margin-bottom:16px}
dialog p {
  white-space:pre-line;
  line-height:1.9;
  margin-bottom:24px}
dialog .button-group {
  justify-content:flex-end}
.visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0}

/* Administration: compact, task-based navigation and quiet data surfaces. */
.admin-sidebar {
  width:244px;
  background:#173a30;
  border:0;
  box-shadow:none;
  color:#eaf1e7;
  display:flex;
  flex-direction:column;
  overflow-y:auto}
.sidebar-header {
  padding:28px 20px;
  display:flex;
  gap:12px;
  align-items:center;
  border-bottom:1px solid #ffffff20}
.sidebar-header .brand-mark {
  background:var(--accent);
  color:var(--ink)}
.sidebar-header h2 {
  font-size:19px;
  color:white}
.sidebar-header small {
  font-size:10px;
  color:#becfc1}
.sidebar-nav {
  padding:18px 12px}
.nav-group {
  margin-bottom:12px}
.nav-group summary {
  list-style:none;
  display:flex;
  gap:10px;
  align-items:center;
  cursor:pointer;
  padding:10px 8px;
  font-size:12px;
  color:#b9cebd}
.nav-group summary::-webkit-details-marker {
  display:none}
.nav-number {
  font:10px ui-monospace,monospace;
  opacity:.75}
.nav-chevron {
  margin-left:auto}
.nav-group[open] .nav-chevron {
  transform:rotate(180deg)}
.sidebar-nav .nav-item {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:4px 0;
  padding:11px 12px 11px 32px;
  border-radius:6px;
  border:0;
  background:transparent;
  color:#e6eee5;
  font-size:13px}
.sidebar-nav .nav-item:hover {
  background:#ffffff12}
.sidebar-nav .nav-item.active {
  background:var(--accent);
  color:var(--ink);
  box-shadow:none;
  border:0;
  font-weight:600}
.sidebar-nav .nav-item>span:last-child:not(.text) {
  font-size:12px;
  opacity:.6}
.sidebar-note {
  margin-top:auto;
  padding:24px;
  font-size:12px;
  color:#b9cebd}
.sidebar-note small {
  display:block;
  font:9px ui-monospace,monospace;
  margin-top:6px;
  letter-spacing:1px}
.admin-main {
  margin-left:244px;
  background:var(--paper);
  min-width:0}
.admin-header {
  background:var(--paper);
  border-bottom:1px solid var(--line);
  box-shadow:none;
  backdrop-filter:none;
  padding:22px 32px}
.admin-header h1 {
  font-size:23px}
.admin-content {
  padding:28px 32px}
.card,.stat-card,.chart-container,.table-container {
  background:white;
  box-shadow:none!important;
  border:1px solid var(--line);
  border-radius:10px;
  backdrop-filter:none}
.card-header {
  background:white;
  border-bottom:1px solid var(--line);
  padding:18px 22px}
.card-header h2 {
  font-size:17px}
.card-body {
  padding:22px}
.stat-card {
  padding:22px;
  border-top:3px solid #a9bf85}
.stat-icon {
  background:#f0f4e5!important;
  box-shadow:none!important;
  border-radius:8px;
  color:var(--ink);
  font-size:22px}
.stat-info h3 {
  font-family:ui-monospace,monospace;
  color:var(--ink);
  font-size:32px}
.stat-info p {
  color:var(--muted);
  font-size:12px}
.stats-cards {
  gap:16px}
.data-table th {
  background:#f0f3eb;
  color:var(--muted);
  font-size:12px;
  font-weight:600;
  white-space:nowrap}
.data-table td {
  font-size:13px;
  border-color:#e6eae2}
.data-table tbody tr:hover {
  background:#f6f8ef}
.table-responsive {
  overflow-x:auto}
.data-table .btn {
  min-height:32px;
  padding:5px 10px;
  font-size:12px}
.admin-ui .login-container {
  display:flex;
  max-width:520px}
.admin-ui .login-box {
  max-width:440px}
.admin-ui .footer {
  margin-left:244px}
.badge {
  border-radius:4px}
.modal-content {
  border-radius:12px;
  box-shadow:0 16px 50px #10291f25;
  border:1px solid var(--line)}

@media(max-width:1000px) {
  .login-container {
  gap:36px;
  grid-template-columns:1fr 380px}
.booking-layout {
  grid-template-columns:minmax(0,1fr) 270px}
.admin-content {
  padding:20px}
.stats-cards {
  grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:768px) {
  .student-header {
  padding:16px 20px;
  flex-direction:row;
  text-align:left;
  flex-wrap:wrap;
  gap:12px}
.student-brand {
  font-size:16px}
.student-brand small {
  font-size:10px}
.user-info {
  width:100%;
  justify-content:flex-end;
  gap:20px;
  flex-wrap:wrap}
.user-info>span {
  margin-right:auto}
.content-wrapper {
  margin:28px auto;
  padding:0 16px}
.page-intro {
  align-items:start;
  margin-bottom:24px;
  gap:12px}
.page-intro h1 {
  font-size:28px}
.page-intro p {
  font-size:13px}
.campus-tag {
  padding:7px 10px;
  font-size:11px}
.booking-layout {
  grid-template-columns:1fr;
  gap:20px}
.booking-summary {
  position:static;
  order:-1;
  padding:18px 20px}
.booking-summary h2 {
  font-size:18px;
  margin:0}
.booking-summary .eyebrow {
  margin-bottom:8px}
.booking-summary .summary-row {
  display:inline-block;
  width:49%;
  vertical-align:top;
  padding:12px 0 0;
  margin-top:12px}
.booking-summary .summary-row strong {
  font-size:13px}
.summary-footer {
  display:none}
.booking-form-container {
  padding:20px}
.booking-section {
  padding:20px 0}
.submit-bar {
  position:sticky;
  bottom:0;
  background:white;
  padding:16px 0 max(16px,env(safe-area-inset-bottom));
  z-index:3;
  border-top:1px solid var(--line);
  margin-top:16px}
.submit-bar .btn {
  min-width:140px}
.submit-bar small {
  max-width:120px}
.choice-card {
  padding:14px;
  min-height:82px}
.choice-card[aria-pressed=true] {
  padding:13px}
.choice-card strong {
  font-size:15px}
.exam-notices {
  padding:20px}
.login-container {
  display:block;
  padding:24px 20px}
.login-story {
  margin-bottom:24px}
.login-story .eyebrow {
  font-size:9px;
  letter-spacing:1px}
.login-story h2 {
  font-size:28px;
  margin:12px 0}
.login-story p,.story-bottom {
  display:none}
.story-ticket {
  margin:20px 0 28px;
  padding:20px;
  transform:rotate(-2deg);
  max-width:100%;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center}
.story-ticket strong {
  font-size:22px;
  margin:8px 0}
.story-ticket .sound-bars {
  grid-column:2;
  grid-row:1/3;
  font-size:20px;
  letter-spacing:0}
.story-ticket small {
  grid-column:1/3;
  padding-top:12px;
  font-size:10px}
.login-box {
  padding:24px}
.login-header h1 {
  display:none}
.login-header h2 {
  font-size:25px}
.confirm-container,.modify-container {
  padding:20px}
.exam-pass {
  padding:22px}
.exam-pass h3 {
  font-size:28px}
.exam-pass .pass-time {
  font-size:20px}
.admit-card,.admit-grid {
  grid-template-columns:1fr!important}
.admin-sidebar {
  position:relative!important;
  width:100%;
  height:auto;
  max-height:none}
.sidebar-header {
  padding:16px 20px}
.sidebar-nav {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:4px;
  padding:12px}
.nav-group {
  margin:0}
.sidebar-note {
  display:none}
.admin-container {
  display:block}
.admin-main {
  margin-left:0}
.admin-header {
  padding:20px;
  gap:12px;
  flex-wrap:wrap}
.admin-content {
  padding:16px}
.admin-ui .footer {
  margin-left:0}
.card-body {
  padding:16px}
.admin-ui .form-inline {
  flex-wrap:wrap}
.admin-ui .filter-form {
  flex-wrap:wrap}
.admin-ui .card {
  overflow-x:auto}
.action-buttons .btn {
  flex:1 1 140px}
.button-group {
  gap:8px}
}

@media(max-width:360px) {
  .choice-grid {
  grid-template-columns:1fr}
.student-header {
  padding:14px 16px}
.login-container {
  padding:20px 16px}
.story-ticket .sound-bars {
  display:none}
.page-intro {
  flex-direction:column}
.pass-details {
  grid-template-columns:1fr}
.booking-summary .summary-row {
  width:100%}
}

@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important}
}

@media print {
  .student-header,.footer,.action-buttons,.page-intro,.submit-bar {
  display:none!important}
.student-ui {
  background:white}
.content-wrapper {
  margin:0;
  padding:0}
.exam-pass {
  color:black;
  background:white;
  border:1px solid #999}
.exam-pass .eyebrow,.pass-details small,.pass-note {
  color:#333}
.confirm-container {
  border:0;
  box-shadow:none}
.exam-pass,.admit-card-box {
  break-inside:avoid}
}

[hidden] {
  display:none!important}
.login-header {
  background:none;
  padding:0}
.login-form {
  padding:0}
.login-header h2 {
  font-weight:650}
.login-story,.login-box,.story-ticket>* {
  min-width:0}
.story-ticket span {
  white-space:nowrap}
.form-links a {
  color:var(--ink)}

@media(max-width:768px) {
  .story-ticket {
  grid-template-columns:minmax(0,1fr) 110px}
.story-ticket .sound-bars {
  font-size:17px;
  letter-spacing:-1px}
.story-ticket strong {
  white-space:nowrap;
  font-size:20px}
.story-ticket span {
  font-size:9px;
  letter-spacing:1px}
.login-notice li {
  margin-bottom:2px}
}

@media(max-width:768px) {
  .booking-summary {
  order:0}
.page-intro {
  flex-wrap:wrap}
.page-intro>div {
  flex:1 1 100%}
.page-intro h1 {
  font-size:27px}
.page-intro .campus-tag {
  margin-top:-4px}
.booking-section:first-of-type legend {
  padding-top:8px}
.booking-summary .summary-row {
  min-width:0;
  overflow-wrap:anywhere}
}

.query-container {
  display:block;
  max-width:800px}
.mobile-reset-container {
  max-width:560px;
  margin:32px auto;
  padding:0 20px}
.mobile-reset-container .brand {
  text-align:left;
  margin-bottom:24px}
.mobile-reset-container .logo {
  display:none}
.mobile-reset-container .title {
  font-size:18px;
  font-weight:600}
.mobile-reset-container .subtitle,.mobile-reset-container .helper {
  color:var(--muted);
  font-size:13px}
.mobile-reset-container .card {
  padding:24px}
.mobile-reset-container .form {
  display:flex;
  flex-direction:column;
  gap:14px}
.footer-actions {
  margin-top:20px}
.content-box {
  background:white;
  border:1px solid var(--line);
  border-radius:10px;
  margin:24px;
  padding:24px}
.admin-ui:has(.login-container) .footer {
  margin-left:0}

.admin-sidebar:before,.stat-icon:before,.action-btn .icon:before {
  display:none}
.stat-icon {
  display:none}
.action-btn {
  background:white!important;
  color:var(--ink)!important;
  border:1px solid var(--line)!important;
  box-shadow:none!important;
  border-radius:8px!important}
.action-btn .icon {
  display:none}
.admin-main {
  padding:0}
.admin-header {
  border-radius:0}
.charts-container {
  grid-template-columns:repeat(2,minmax(0,1fr))}
.chart-box {
  box-shadow:none;
  backdrop-filter:none;
  border-radius:10px}
.admin-login-container {
  background:none;
  max-width:500px;
  margin:auto;
  min-height:calc(100vh - 110px);
  padding:32px 20px}
.admin-ui:has(.admin-login-container) .footer {
  margin-left:0}
.admin-ui .stat-info h3 {
  letter-spacing:-1px}
.admin-ui .table-container,.admin-ui .content-box {
  min-width:0;
  overflow-x:auto}

@media(max-width:768px) {
  .charts-container {
  grid-template-columns:1fr}
.admin-main {
  padding:0}
.admin-ui .content-box {
  margin:16px;
  padding:16px}
.stat-card {
  padding:16px}
.stat-info h3 {
  font-size:26px}
}

.dashboard-content {
  padding:28px 32px;
  min-width:0}
.dashboard-content>.content-box {
  margin:0}
.chart-box {
  min-width:0;
  overflow:hidden}
.chart-box canvas {
  max-width:100%!important}
.charts-container {
  min-width:0}
.quick-actions {
  min-width:0}
.admin-ui .filter-box {
  box-shadow:none;
  backdrop-filter:none}
.admin-ui .filter-group {
  min-width:0}
.admin-ui .data-table {
  width:100%}

@media(max-width:768px) {
  .dashboard-content {
  padding:16px}
.dashboard-content>.content-box {
  margin:0}
.chart-box {
  padding:16px}
.quick-actions {
  grid-template-columns:repeat(2,minmax(0,1fr))}
}

.booking-section,.booking-form,.booking-form-container,.booking-layout>* {
  min-width:0}
.booking-section {
  min-inline-size:0}
.date-tabs {
  max-width:100%}

.login-system-name {
  font-size:13px;
  margin-bottom:24px;
  color:var(--muted)}
.login-header .login-title {
  display:block;
  font-size:28px;
  color:var(--ink);
  font-weight:650;
  margin:8px 0}
.section-page-title {
  font-size:25px;
  line-height:1.5;
  margin-bottom:20px}
.student-ui:has(#passwordForm) .modify-container {
  max-width:640px;
  margin:auto}

@media(max-width:768px) {
  .login-system-name {
  display:none}
.login-header .login-title {
  font-size:25px}
}


/* Statistics follow the shared forest / sage palette. */
.admin-ui .summary-card{background:#e8efe6;color:var(--ink);border:1px solid var(--line);text-align:left;padding:24px;border-radius:10px}
.admin-ui .summary-card h4{color:var(--ink);font-size:36px;margin:0 0 8px}
.admin-ui .summary-card p{color:var(--muted);margin:0}
.admin-ui .summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:600px){.admin-ui .summary-cards{grid-template-columns:1fr}}

/* 数据表精修：斑马纹、垂直居中、数字列 */
.admin-ui .data-table td{vertical-align:middle;padding-top:13px;padding-bottom:13px}
.admin-ui .data-table tbody tr:nth-child(even){background:#fafbf7}
.admin-ui .data-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.admin-ui .cell-id{color:var(--muted);font:12px ui-monospace,monospace;font-variant-numeric:tabular-nums}
.admin-ui .cell-date{display:inline-flex;flex-direction:column;line-height:1.4}
.admin-ui .cell-date .d{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.admin-ui .cell-date .w{font-size:12px;color:var(--muted)}
.admin-ui .cell-time{font-variant-numeric:tabular-nums;white-space:nowrap}
.admin-ui .cell-time .t-sep{color:var(--muted);margin:0 4px}
.admin-ui .cell-session{font-weight:600}
.admin-ui .tag-outline{display:inline-block;padding:2px 10px;border:1px solid var(--line);border-radius:999px;font-size:12px;color:var(--muted);white-space:nowrap;background:#fff}

/* 状态徽章：胶囊 + 圆点 */
.admin-ui .status-badge{display:inline-flex;align-items:center;gap:6px;padding:3px 11px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.admin-ui .status-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 6px}
.admin-ui .status-active{color:#2f7d4f;background:#e5f3e7}
.admin-ui .status-inactive{color:#a4352a;background:#fae9e5}

/* 预约进度条 */
.rate-cell{display:flex;flex-direction:column;gap:5px;min-width:118px}
.rate-line{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.rate-line strong{color:var(--ink);font-size:13px;font-weight:600}
.rate-track{display:block;height:5px;border-radius:999px;background:#edf0e6;overflow:hidden}
.rate-fill{display:block;height:100%;border-radius:999px;background:#7ba05b}
.rate-fill.warn{background:#d9a441}
.rate-fill.full{background:var(--danger)}

/* 行操作下拉菜单 */
.action-menu-btn{display:inline-flex;align-items:center;gap:5px;padding:4px 11px;font-size:12px;font-weight:600;font-family:inherit;line-height:1.4;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:7px;cursor:pointer;min-height:28px;transition:background .12s,border-color .12s}
.action-menu-btn:hover{background:#f2f5ec;border-color:#c3cec2}
.action-menu-btn .chev{width:11px;height:11px;opacity:.55;transition:transform .12s}
.action-menu-btn[aria-expanded="true"]{background:#eef1e8;border-color:#b9c6ba}
.action-menu-btn[aria-expanded="true"] .chev{transform:rotate(180deg)}
.action-menu{position:fixed;z-index:1300;min-width:150px;padding:5px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 32px rgba(16,41,31,.16);animation:actionMenuIn .12s ease}
.action-menu[hidden]{display:none}
.action-menu button{display:flex;width:100%;align-items:center;gap:8px;padding:7px 10px;font:13px/1.4 inherit;border:0;border-radius:6px;background:transparent;color:var(--ink);cursor:pointer;text-align:left;white-space:nowrap}
.action-menu button:hover{background:#f2f5ec}
.action-menu button.danger{color:var(--danger)}
.action-menu button.danger:hover{background:#fae9e5}
.action-menu .menu-sep{height:1px;margin:4px 6px;background:var(--line)}
@keyframes actionMenuIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* 分页：跟随森系配色 */
.admin-ui .pagination{gap:6px}
.admin-ui .page-link{border-color:var(--line);color:var(--ink);border-radius:7px;font-variant-numeric:tabular-nums}
.admin-ui .page-link:hover{background:#eef1e8;text-decoration:none}
.admin-ui .page-link.active{background:var(--ink);border-color:var(--ink);color:#fff}


/* ===== 2026-09-14c：弹窗森系化 + 全局控件对齐归一 ===== */
/* 模态框：紫蓝渐变头改为纸白底 + 墨色标题 + 分隔线，与整体森系一致 */
.modal-content{background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 24px 64px rgba(16,41,31,.18)}
.modal-header{background:var(--surface);color:var(--ink);border-bottom:1px solid var(--line);padding:18px 24px;border-radius:12px 12px 0 0}
.modal-header h2{font-size:17px;font-weight:650;color:var(--ink)}
.modal-header .close{color:var(--muted);font-size:22px;font-weight:600}
.modal-header .close:hover{color:var(--ink);opacity:1}
.modal-content form{padding:24px}
.modal .required{color:var(--danger)}
/* 主题化确认对话框（替代原生 confirm） */
dialog.yyks-confirm{border:1px solid var(--line);border-radius:12px;padding:28px;max-width:420px;width:calc(100% - 32px);color:var(--ink);box-shadow:0 24px 64px rgba(16,41,31,.22)}
dialog.yyks-confirm::backdrop{background:rgba(16,41,31,.5)}
dialog.yyks-confirm h2{font-size:18px;margin:0 0 12px;color:var(--ink)}
dialog.yyks-confirm p{white-space:pre-line;line-height:1.8;margin:0 0 24px;color:var(--muted)}
.yyks-confirm-actions{display:flex;justify-content:flex-end;gap:10px}
/* 对齐归一：同一行控件底边对齐，清除行内组的下外边距 */
.form-row{align-items:flex-end;flex-wrap:wrap}
.form-row>.form-group,.form-row>div{margin-bottom:0;display:flex;flex-direction:column}
.form-row>.form-group>.checkbox,.form-row>div>.checkbox{flex-direction:row}
.header-actions{align-items:flex-end;flex-wrap:wrap}
.header-actions>form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin:0}
.header-actions .form-group{margin-bottom:0}
.filter-box{display:flex;align-items:flex-end;gap:15px;flex-wrap:wrap}
.filter-box>form{display:flex;align-items:flex-end;gap:15px;flex-wrap:wrap;width:100%;margin:0}
.filter-box .filter-group,.filter-box form .filter-group{margin-bottom:0}
.filter-box form>.form-row{flex:1 1 420px;margin-bottom:0}
.filter-box>.filter-group{margin-bottom:0}
/* 弹窗内纵向堆叠的组保留间距，行内组清零后由行提供间距 */
.modal-content .form-row{margin-bottom:16px}
.modal-content .form-row:last-of-type{margin-bottom:0}
.modal-content form>.form-group{margin-bottom:16px}
.modal-content form>.form-group:last-child{margin-bottom:0}
@media(max-width:768px){
.form-row{align-items:stretch}
.filter-box{align-items:stretch}
}
/* 对齐归一补丁：筛选组可收缩以容纳单行；无控件的组（复选框）底边对齐；按钮包裹 div 保持横排 */
.filter-box .filter-group,.filter-box>.filter-group{margin-bottom:0;justify-content:flex-end}
.filter-box form .filter-group{flex:1 1 180px;min-width:160px}
.filter-box form .filter-group:has(> .form-row),.filter-box form .filter-group:has(> label > input[type=checkbox]){flex:0 0 auto}
.filter-box form .filter-group .form-row .form-control{flex:1 1 120px;min-width:110px}
.form-row>div:has(> .btn):not(:has(> .form-control)):not(:has(> label)){flex-direction:row;gap:10px}
/* 复选框标签在行内底边对齐时清除下外边距 */
.form-row label.checkbox,.filter-box label:has(> input[type=checkbox]),.form-row>div>label:has(> input[type=checkbox]){margin-bottom:0}
/* 全局 reset 会清掉 dialog 的 UA margin:auto，需显式恢复居中 */
dialog.yyks-confirm{margin:auto}
/* form-row 内直连控件改为弹性宽度，避免 width:100% 把按钮挤到第二行 */
.form-row>.form-control{flex:1 1 160px;width:auto;min-width:120px}
