/*
 * CET reference theme, adapted to the Gaokao app.
 * Source: cet-app-main/src/app/globals.css (EduPlatform v3),
 * src/app/login/page.tsx and src/app/page.tsx.
 * The button, input, glass and warm-background declarations below are copied
 * from that source; selectors add aliases for this app's existing markup.
 * --ref-surface and --ref-accent avoid changing existing component semantics.
 * No remote font request: the local system sans stack supplies the fallback.
 */
.reference-theme {
  --background: #FFF8F0;
  --foreground: #1A1F36;
  --primary: #059669;
  --primary-hover: #047857;
  --primary-shadow: #065F46;
  --primary-light: #34D399;
  --primary-lighter: #D1FAE5;
  --ref-accent: #8B5CF6;
  --ref-accent-shadow: #7C3AED;
  --card: #FFFFFF;
  --card-border: #E8E0D4;
  --ref-surface: #F5F0E8;
  --surface-warm: #FFF2E5;
  --navy: #1A1F36;
  --navy-light: #2D3348;
  --clay-radius: 1.125rem;
  --clay-radius-lg: 1.375rem;
  --clay-radius-xl: 1.75rem;
  --clay-border-width: 2px;
  --clay-border-bottom: 5px;
  --clay-shadow: 0 2px 4px rgba(26,31,54,.04), 0 4px 12px rgba(26,31,54,.06);
  --clay-shadow-hover: 0 8px 20px rgba(26,31,54,.08), 0 12px 32px rgba(26,31,54,.04);
  --clay-bounce: cubic-bezier(.34,1.56,.64,1);
  --font-sans: system-ui, -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-heading: var(--font-sans);
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
}

/* Original button declarations and the current .button alias. */.reference-theme .btn-solid, .reference-theme .button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-weight: 700;
  font-family: var(--font-heading), var(--font-sans), sans-serif;
  border-radius: var(--clay-radius);
  padding: 0.75rem 1.5rem;
  transition: all 0.2s ease;
  border: var(--clay-border-width) solid transparent;
  border-bottom-width: var(--clay-border-bottom);
  box-shadow: var(--clay-shadow);
  cursor: pointer;
  letter-spacing: 0.01em;
}

.reference-theme .btn-solid:hover:not(:disabled), .reference-theme .button:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: var(--clay-shadow-hover);
}

.reference-theme .btn-solid:active:not(:disabled), .reference-theme .button:active:not(:disabled) {
  transform: translateY(2px);
  border-bottom-width: var(--clay-border-width);
  box-shadow: none;
}

.reference-theme .btn-solid:disabled, .reference-theme .button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.reference-theme .btn-solid-outline, .reference-theme .button:not(.primary):not(.danger) {
  background: var(--card);
  color: var(--foreground);
  border-color: var(--card-border);
}

.reference-theme .btn-solid-outline:hover:not(:disabled), .reference-theme .button:not(.primary):not(.danger):hover:not(:disabled) {
  background: var(--ref-surface);
  border-color: var(--primary-light);
}

.reference-theme .btn-solid-primary, .reference-theme .button.primary {
  background: var(--primary);
  color: white;
  border-color: var(--primary-shadow);
}

.reference-theme .btn-solid-primary:hover:not(:disabled), .reference-theme .button.primary:hover:not(:disabled) {
  background: var(--primary-hover);
}

.reference-theme .input-clay, .reference-theme .auth-field input {
  width: 100%;
  padding: 0.75rem 1rem;
  border: var(--clay-border-width) solid var(--card-border);
  border-radius: var(--clay-radius);
  background: var(--card);
  color: var(--foreground);
  font-size: 0.9375rem;
  font-family: inherit;
  transition: all 0.2s ease;
  outline: none;
}

.reference-theme .input-clay::placeholder, .reference-theme .auth-field input::placeholder {
  color: #94A3B8;
}

.reference-theme .input-clay:focus, .reference-theme .auth-field input:focus {
  border-color: var(--primary-light);
  box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.12);
}

.reference-theme .card-glass, .reference-theme .auth-card {
  background: rgba(255, 255, 255, 0.65);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 1.25rem;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.08),
    0 2px 8px rgba(0, 0, 0, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

.reference-theme .hero-section-sky, .reference-theme.auth-page {
  position: relative;
  overflow: hidden;
  background-image: url('/login-bg.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.reference-theme .bg-warm-gradient, .reference-theme .reference-home, .reference-theme .hero {
  background: linear-gradient(135deg, #FFF2E5 0%, #FFF8F0 50%, #F0FDFA 100%);
}

.reference-theme .card-interactive, .reference-theme .quick-card {
  background: var(--card);
  border: var(--clay-border-width) solid var(--card-border);
  border-bottom-width: var(--clay-border-bottom);
  border-radius: var(--clay-radius-lg);
  box-shadow: var(--clay-shadow);
  transition: all 0.25s var(--clay-bounce);
  cursor: pointer;
}

.reference-theme .card-interactive:hover, .reference-theme .quick-card:hover {
  transform: translateY(-3px) scale(1.005);
  box-shadow: var(--clay-shadow-hover);
  border-color: var(--primary-light);
}

.reference-theme .card-interactive:active, .reference-theme .quick-card:active {
  transform: translateY(1px) scale(0.99);
  border-bottom-width: var(--clay-border-width);
}

/* Current-app sizing and reference page composition. */
.reference-theme .button { min-height: 44px; font-size: 16px; line-height: 1.5; }
.reference-theme .ui-icon { display: block; width: 22px; height: 22px; flex-shrink: 0; }
.reference-theme .empty-symbol .ui-icon { width: 44px; height: 44px; color: #94A3B8; }
.reference-theme .resource-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--primary-lighter); color: var(--primary); }
.reference-theme .catalog-icon { display: grid; place-items: center; width: 72px; height: 72px; flex-shrink: 0; border: 2px solid #BBF7D0; border-radius: 22px; background: var(--primary-lighter); color: var(--primary); }
.reference-theme .catalog-icon .ui-icon { width: 36px; height: 36px; }
.reference-theme .password-toggle { display: grid; place-items: center; }
.reference-theme .button.small { min-height: 44px; padding: .5rem .875rem; font-size: 14px; }
.reference-theme .button.danger { background: #fff; color: #B42332; border-color: #FECDD3; }
.reference-theme .button.danger:hover:not(:disabled) { background: #FFF1F2; }
.reference-theme .button:focus-visible { outline: 3px solid var(--primary-light); outline-offset: 4px; }
.reference-theme .study-tabs .button { flex: 1; min-width: 0; min-height: 44px; padding: 9px 10px; font-size: 14px; background: transparent; color: #64748B; border-color: transparent; border-bottom-width: 2px; box-shadow: none; }
.reference-theme .study-tabs .button:hover:not(:disabled) { background: #ECFDF5; color: var(--primary); border-color: transparent; transform: none; }
.reference-theme .study-tabs .button.active,
.reference-theme .study-tabs .button.active:hover:not(:disabled) { background: var(--primary); color: #fff; border-color: var(--primary-shadow); }
.reference-theme input, .reference-theme select, .reference-theme textarea { border-radius: var(--clay-radius); font-family: var(--font-sans); font-size: 16px; }
.reference-theme .eyebrow:empty { display: none; }
.reference-theme .page-heading h1 { font-weight: 800; letter-spacing: -.025em; }
.reference-theme .page-heading p { color: #667085; }
.reference-theme .topbar { background: var(--navy); }
.reference-theme .panel, .reference-theme .paper-card, .reference-theme .stat-card, .reference-theme .mistake-card, .reference-theme .start-dialog {
  border-color: var(--card-border);
  border-width: var(--clay-border-width);
  border-bottom-width: var(--clay-border-bottom);
  border-radius: var(--clay-radius-lg);
  box-shadow: var(--clay-shadow);
}

/* Login structure follows src/app/login/page.tsx: brand, tabs, form, footer. */
.reference-theme.auth-page { overflow-x: hidden; overflow-y: auto; background-attachment: fixed; }
.reference-theme.auth-page main { padding: max(20px,env(safe-area-inset-top)) 16px max(24px,env(safe-area-inset-bottom)); }
.reference-theme .auth-shell { width: 100%; max-width: 448px; }
.reference-theme .auth-tabs a[aria-disabled="true"], .reference-theme .auth-switch a[aria-disabled="true"] { pointer-events: none; opacity: .55; }
.reference-theme .auth-brand { margin-bottom: 16px; text-align: center; }
.reference-theme .auth-logo { display: block; width: 112px; height: 112px; object-fit: contain; margin: 0 auto 4px; }
.reference-theme .auth-brand h1 { color: #1E293B; font-size: 30px; font-weight: 800; line-height: 1.2; letter-spacing: -.025em; margin: 0; }
.reference-theme .auth-brand p { color: #64748B; font-size: 18px; line-height: 1.5; margin: 4px 0 0; }
.reference-theme .auth-tabs { display: flex; gap: 0; padding: 4px; margin: 0 0 16px; border: 1px solid rgba(255,255,255,.5); border-radius: 12px; background: rgba(255,255,255,.4); backdrop-filter: blur(4px); }
.reference-theme .auth-tabs>a { min-height: 47px; padding: 10px 12px; color: #64748B; border-radius: 8px; font-size: 18px; font-weight: 700; line-height: 1.5; box-shadow: none; transition: all .3s ease; }
.reference-theme .auth-tabs>a.active, .reference-theme .auth-tabs>a[aria-current='page'] { color: white; background: linear-gradient(to right,var(--primary),var(--primary-light)); box-shadow: 0 4px 6px rgba(0,0,0,.1); }
.reference-theme .auth-card { padding: 24px; }
.reference-theme .auth-form { display: grid; gap: 16px; }
.reference-theme .auth-field { gap: 8px; }
.reference-theme .auth-field>span:first-child { font-size: 18px; font-weight: 700; line-height: 1.5; }
.reference-theme .auth-field input { height: auto; min-height: 53px; font-size: 18px; line-height: 1.5; }
.reference-theme .auth-field .password-wrap input { padding-right: 66px; }
.reference-theme .password-toggle { top: 5px; right: 8px; min-width: 44px; min-height: 44px; height: calc(100% - 10px); color: #667085; }
.reference-theme .auth-form .button.primary { min-height: 54px; font-size: 18px; font-weight: 700; }
.reference-theme .auth-error { margin: 0; padding: 14px; border: 2px solid #FECACA; border-radius: 12px; font-size: 16px; line-height: 1.5; font-weight: 500; color: #B42332; background: #FFF1F2; }
.reference-theme .auth-success { margin: 0 0 16px; padding: 14px; border: 2px solid #BBF7D0; border-radius: 12px; font-size: 16px; color: #166534; background: #F0FDF4; }
.reference-theme .auth-switch { margin: 16px 0 0; color: #64748B; font-size: 16px; line-height: 1.5; }
.reference-theme .auth-switch a { font-weight: 700; color: var(--primary); }
.reference-theme .auth-bottom { margin-top: 8px; font-size: 12px; }

/* Home follows reference's centered mascot + compact heading on a warm gradient. */
.reference-theme:has(.reference-home) .workspace { background: linear-gradient(135deg,#FFF2E5 0%,#FFF8F0 50%,#F0FDFA 100%); }
.reference-theme main:has(.reference-home) { max-width: 768px; }
.reference-theme .reference-home { display: flex; flex-direction: column; align-items: center; gap: 0; padding: 8px 20px 24px; margin: 0 auto 22px; text-align: center; border: 0; border-radius: 0; box-shadow: none; background: none; }
.reference-theme .reference-home>.hero-mascot { display: block; width: 100%; max-width: 560px; max-height: 196px; object-fit: contain; border-radius: 16px; margin: 0 auto 12px; }
.reference-theme .reference-home>.home-greeting { color: var(--primary); font-size: 14px; font-weight: 700; margin: 0 0 4px; }
.reference-theme .reference-home>h1 { color: var(--foreground); font-size: 32px; font-weight: 800; line-height: 1.25; letter-spacing: -.025em; margin: 0 0 6px; }
.reference-theme .reference-home>h1>span { display: block; color: rgba(26,31,54,.75); font-size: 20px; font-weight: 700; margin-top: 4px; }
.reference-theme .reference-home>h1>.text-gradient-hero { margin: 0; font-size: inherit; font-weight: inherit; background: linear-gradient(135deg, var(--primary) 0%, #3B82F6 50%, var(--ref-accent) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.reference-theme .reference-home>p { color: var(--navy); font-size: 15px; font-weight: 600; line-height: 1.5; margin: 4px 0 0; }
.reference-theme .reference-home>.button { margin-top: 16px; }
.reference-theme .reference-home>.hero-ornament { display: none; }
.reference-theme .quick-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.reference-theme .quick-card { --card-color: #059669; --card-light: #D1FAE5; position: relative; overflow: hidden; align-items: center; text-align: center; gap: 0; padding: 20px 18px 16px; border-radius: 16px; background: white; border-color: var(--card-border); }
.reference-theme .quick-card:nth-child(4n+2) { --card-color: #FB7185; --card-light: #FECDD3; }
.reference-theme .quick-card:nth-child(4n+3) { --card-color: #8B5CF6; --card-light: #EDE9FE; }
.reference-theme .quick-card:nth-child(4n+4) { --card-color: #F59E0B; --card-light: #FEF3C7; }
.reference-theme .quick-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 6px; background: linear-gradient(to right,var(--card-color),var(--card-light)); }
.reference-theme .quick-card .quick-icon { display: grid; place-items: center; width: 44px; height: 44px; margin: 0 auto 10px; border: 2px solid var(--card-light); border-radius: var(--clay-radius); color: var(--card-color); background: var(--card-light); box-shadow: var(--clay-shadow); font-size: 23px; font-weight: 700; }
.reference-theme .quick-card .quick-icon svg { display: block; width: 23px; height: 23px; margin: 0; color: inherit; }
.reference-theme .quick-card h2 { font-size: 18px; font-weight: 800; margin: 0 0 5px; }
.reference-theme .quick-card p { font-size: 13px; color: #667085; line-height: 1.5; }
.reference-theme .quick-card .text-link { min-height: 44px; margin-top: 8px; color: var(--card-color); font-size: 14px; font-weight: 700; }
.reference-theme .question-nav { width: auto; min-width: 44px; padding: 0 8px; white-space: nowrap; }

@media(max-width:640px) {
  .reference-theme .button { min-height: 44px; }
  .reference-theme .catalog-icon { display: none; }
  .reference-theme main:has(.reference-home) { padding-top: 18px; }
  .reference-theme .reference-home { padding: 0 8px 20px; margin-bottom: 18px; }
  .reference-theme .reference-home>.hero-mascot { max-height: 150px; margin-bottom: 10px; }
  .reference-theme .reference-home>h1 { font-size: 28px; }
  .reference-theme .reference-home>h1>span { font-size: 18px; }
  .reference-theme .quick-card { padding: 19px 12px 12px; }
  .reference-theme .quick-card h2 { font-size: 16px; }
  .reference-theme .quick-card p { font-size: 12px; }
  .reference-theme .quick-card .text-link { font-size: 13px; }
  .reference-theme .auth-card { padding: 24px; }
  .reference-theme .auth-brand p { font-size: 17px; }
}
@media(max-width:360px) {
  .reference-theme .auth-card { padding: 20px; }
  .reference-theme .auth-brand h1 { font-size: 28px; }
  .reference-theme .auth-brand p { font-size: 16px; }
  .reference-theme .quick-grid { gap: 10px; }
}
@media(prefers-reduced-motion:reduce) {
  .reference-theme .button, .reference-theme .quick-card, .reference-theme .auth-tabs>a { transition: none; }
}

/* The library is a peer of exam practice, with its own mobile reading flow. */
.reference-theme .paper-sections { max-width: 900px; margin-inline: auto; }
.reference-theme .library-tools { display: grid; gap: 16px; }
.reference-theme .library-tools .search-field { width: 100%; max-width: 600px; }
.reference-theme .library-categories { display: flex; flex-wrap: wrap; gap: 8px; }
.reference-theme .library-categories .button { min-height: 44px; }
.reference-theme .library-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.reference-theme .library-grid>.empty-state { grid-column: 1/-1; }
.reference-theme .library-card { display: flex; flex-direction: column; min-width: 0; padding: 24px; border: 2px solid var(--card-border); border-bottom-width: 5px; border-radius: 20px; background: #fff; box-shadow: var(--clay-shadow); transition: transform .2s,border-color .2s; }
.reference-theme .library-card:hover { border-color: var(--primary-light); transform: translateY(-2px); }
.reference-theme .library-card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.reference-theme .library-tag { font-size: 12px; font-weight: 700; color: #047857; background: #ECFDF5; padding: 4px 10px; border-radius: 8px; }
.reference-theme .library-card h3 { font-size: 20px; line-height: 1.5; margin: 0 0 8px; }
.reference-theme .library-card p { color: #667085; font-size: 14px; line-height: 1.8; margin: 0 0 20px; }
.reference-theme .library-card-footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; border-top: 1px solid var(--card-border); margin-top: auto; padding-top: 16px; font-size: 14px; font-weight: 700; color: var(--primary); }
.reference-theme main:has(.resource-reader-page) { max-width: 960px; }
.reference-theme .resource-reader-page { --reader-font-size: 17px; min-width: 0; }
.reference-theme .resource-reader-page.reader-large { --reader-font-size: 21px; }
.reference-theme .library-reader-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.reference-theme .library-reader-toolbar .back-link { margin-bottom: 0; }
.reference-theme .library-reader-toolbar [aria-pressed=true] { color: var(--primary); border-color: var(--primary-light); }
@media(max-width:960px) {
  .reference-theme .library-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width:800px) and (min-width:641px) {
  .reference-theme #navigation a { padding-inline: 6px; gap: 4px; }
  .reference-theme .topbar { gap: 12px; }
}
@media(max-width:640px) {
  .reference-theme #navigation { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 2px; }
  .reference-theme #navigation a { min-width: 0; padding-inline: 1px; }
  .reference-theme .library-grid { grid-template-columns: minmax(0,1fr); gap: 14px; }
  .reference-theme .library-card { padding: 20px; }
  .reference-theme .library-card-top { margin-bottom: 14px; }
  .reference-theme .library-card h3 { font-size: 19px; }
  .reference-theme .library-hero { padding: 24px 20px; }
  .reference-theme .library-hero h1 { font-size: 25px; }
  .reference-theme .library-categories { gap: 7px; }
  .reference-theme .library-reader-toolbar .button { flex-shrink: 0; }
}
@media(hover:none) {
  .reference-theme #navigation a:not(.active):hover { color: #727a8c; background: transparent; }
}
.provenance-badge { display: inline-flex; align-items: center; max-width: 100%; padding: 4px 9px; border-radius: 999px; background: #edf5ef; color: #285848; font-size: .75rem; line-height: 1.5; white-space: normal; }
.paper-top { gap: 8px; flex-wrap: wrap; }
.source-identity { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; color: #526574; font-size: .875rem; line-height: 1.6; margin: 12px 0 20px; }
.ai-reference-note { color: #526574; font-size: .8rem; margin-top: 10px; }
.notice details { overflow-wrap: anywhere; white-space: pre-wrap; }