/* v98: presentation-only components over the existing business pages. */
/* Personal workbench: actionable records, not a second content catalog. */
[data-ui="v98"] #home .learning-workbench-title { padding: 0 0 6px; }
[data-ui="v98"] #home .learning-workbench-title h1 { margin: 0 0 8px; }
[data-ui="v98"] #home>.section { margin-top: 26px; }
[data-ui="v98"] #home .section-head { margin-bottom: 12px; }
[data-ui="v98"] .learning-workbench-list { display: grid; gap: 12px; }
[data-ui="v98"] .learning-workbench-row { display: flex; align-items: center; gap: 18px; padding: 22px; min-width: 0; }
[data-ui="v98"] .learning-workbench-icon { display: grid; place-items: center; flex-shrink: 0; width: 48px; height: 48px; border-radius: 15px; color: #155a89; background: #def3fc; font-size: 22px; }
[data-ui="v98"] .learning-workbench-copy { min-width: 0; flex: 1; overflow-wrap: anywhere; }
[data-ui="v98"] .learning-workbench-copy h3 { margin: 0 0 5px; font-size: 18px; }
[data-ui="v98"] .learning-workbench-copy p { margin: 0; color: #586978; }
[data-ui="v98"] .learning-workbench-copy time { display: block; margin-top: 6px; color: #72809a; font-size: 12px; }
[data-ui="v98"] #my-learning-status .link { margin-left: 14px; }
@media(max-width: 650px) {
  [data-ui="v98"] .learning-workbench-row { flex-wrap: wrap; gap: 12px; padding: 18px; }
  [data-ui="v98"] .learning-workbench-copy { flex-basis: calc(100% - 60px); }
  [data-ui="v98"] .learning-workbench-row .button { width: 100%; }
}
:root {
  --joy-surface: #ffffffd9;
  --joy-surface-solid: #fff;
  --joy-border: #cbd9e380;
  --joy-shadow: 0 12px 34px #2846600a;
  --joy-radius: 22px;
  --joy-coral: #c7473b;
  --joy-cyan-soft: #def3fc;
  --joy-violet-soft: #e8e4ff;
  --joy-yellow-soft: #fff0b0;
  --joy-green-soft: #e3f5ee;
}
[data-ui="v98"] {
  --ink: var(--joy-ink); --muted: var(--joy-muted); --line: var(--joy-border);
  --blue: var(--joy-blue); --purple: #6757a8; --green: #18745a; --mint: #18745a;
  --bg: #edf6ff; --soft: #f4f7fa;
  color: var(--joy-ink); font: 14px/1.6 "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  background: var(--joy-page); background-attachment: fixed;
}
[data-ui="v98"] *, [data-ui="v98"] *::before, [data-ui="v98"] *::after { box-sizing: border-box; }
[data-ui="v98"] :is(.app-shell,.shell,.main,.admin-shell,.team-shell,.bot-shell,.review-shell,.exam-taker-shell,.total-admin-shell) { background: transparent; min-width: 0; }
html:root body[data-ui="v98"] :is(.main,.admin-shell,.team-shell,.bot-shell,.review-shell,.exam-taker-shell) { width: 100%; max-width: 1248px; margin: 0 auto; padding: 24px 34px 64px !important; }
[data-ui="v98"] :is(.screen,.card,.panel,.admin-card,.paths,.courses,.grid4,.stat-grid,.admin-grid,.field-pair,.filters,.toolbar,.question-edit-panel,.top-left,.top-actions) { min-width: 0; }
[data-ui="v98"] :is(.top,.admin-head,.exam-taker-head) { gap: 16px; margin-bottom: 28px; align-items: center; flex-wrap: wrap; }
[data-ui="v98"] :is(.page-title,.admin-head) h1 { color: var(--joy-ink); font-size: clamp(28px,3vw,40px); line-height: 1.2; letter-spacing: -.055em; }
[data-ui="v98"] .page-title { padding: 10px 0 24px; }
[data-ui="v98"] :is(.page-title p,.sub,.admin-note,.section-head p,.path p,.course-body p,.resource small,.step span,.metric em,.stat em) { color: var(--joy-muted); }
[data-ui="v98"] :is(.kicker,.eyebrow) { color: var(--joy-blue); font-size: 11px; letter-spacing: .13em; font-weight: 850; }
[data-ui="v98"] :is(.card,.panel,.path,.role-card,.stat,.metric,.admin-card,.leaderboard-card,.deploy-card,.table-wrap,.filters,.days,.scorecard) { border: 1px solid var(--joy-border); border-radius: var(--joy-radius); background: var(--joy-surface); box-shadow: var(--joy-shadow); }
[data-ui="v98"] :is(.admin-card,.panel,.leaderboard-card) { padding: 24px; }
[data-ui="v98"] :is(.section-head,.section-heading,.leaderboard-title,.leaderboard-head) { gap: 14px; align-items: flex-start; flex-wrap: wrap; }
[data-ui="v98"] :is(.section-head h2,.section-heading h2,.leaderboard-title h2,.leaderboard-head h2) { color: var(--joy-ink); letter-spacing: -.035em; font-size: 21px; }
[data-ui="v98"] :is(.hero,.team-hero) { border: 1px solid #ffffffb8; border-radius: 26px; background: linear-gradient(112deg,#faf2ee,#f2eaf1 43%,#d5edff); color: var(--joy-ink); padding: 30px; box-shadow: var(--joy-shadow); }
[data-ui="v98"] :is(.hero,.team-hero) :is(h1,h2) { color: var(--joy-ink); letter-spacing: -.04em; }
[data-ui="v98"] :is(.hero,.team-hero) :is(p,.eyebrow) { color: #3f566d; }
[data-ui="v98"] .hero::after { background: #7fd3f342; opacity: .45; }
[data-ui="v98"] :is(.grid4,.stat-grid) { gap: 16px; margin: 20px 0; }
[data-ui="v98"] :is(.metric,.stat) { padding: 22px; }
[data-ui="v98"] :is(.metric,.stat) :is(small,em) { color: #485663; }
[data-ui="v98"] :is(.metric,.stat) b { margin: 6px 0; font-size: 30px; font-weight: 850; color: var(--joy-ink); letter-spacing: -.035em; }
[data-ui="v98"] :is(.grid4,.stat-grid) > :nth-child(4n+1) { background: var(--joy-yellow-soft); }
[data-ui="v98"] :is(.grid4,.stat-grid) > :nth-child(4n+2) { background: var(--joy-cyan-soft); }
[data-ui="v98"] :is(.grid4,.stat-grid) > :nth-child(4n+3) { background: var(--joy-violet-soft); }
[data-ui="v98"] :is(.grid4,.stat-grid) > :nth-child(4n+4) { background: var(--joy-green-soft); }
[data-ui="v98"] :is(.paths,.courses,.path-grid,.role-grid,.hubs) { gap: 16px; }
[data-ui="v98"] :is(.path,.hub,.role-card) { padding: 22px; transition: transform .18s,box-shadow .18s,border-color .18s; }
[data-ui="v98"] :is(.path,.hub,.role-card,.course):hover { transform: translateY(-3px); border-color: #166ca366; box-shadow: 0 16px 30px #24455f12; }
[data-ui="v98"] .public-bank-paths .path:nth-child(3n+1) { background: #fff8dc; }
[data-ui="v98"] .public-bank-paths .path:nth-child(3n+2) { background: #ecf8fc; }
[data-ui="v98"] .public-bank-paths .path:nth-child(3n) { background: #f1efff; }
[data-ui="v98"] .path::before { background: #0d548d09; }
[data-ui="v98"] :is(.path strong,.hub b,.path h3,.role-card h3) { color: var(--joy-ink); }
[data-ui="v98"] :is(.pill,.tag) { border-radius: 999px; padding: 5px 10px; font-size: 11px; line-height: 1.4; background: #e5eff8; color: #245675; }
[data-ui="v98"] :is(.pill,.tag).blue { background: var(--joy-cyan-soft); color: #155a89; }
[data-ui="v98"] :is(.pill,.tag).purple { background: var(--joy-violet-soft); color: #62528d; }
[data-ui="v98"] :is(.pill,.tag).green { background: var(--joy-green-soft); color: #18745a; }
[data-ui="v98"] :is(.button,.primary,.start):not(.global-management-toggle) { background: var(--joy-coral); color: #fff; border: 1px solid transparent; border-radius: 12px; padding: 11px 17px; font: inherit; font-weight: 800; box-shadow: 0 5px 0 #bb403633; }
[data-ui="v98"] :is(.button,.primary):hover:not(:disabled) { background: #d8473a; }
[data-ui="v98"] :is(.secondary,.back,.back-button,.switch,.admin-nav a,.team-detail-button,.team-detail-close) { color: var(--joy-blue); border: 1px solid #9eb8cb80; border-radius: 12px; background: #ffffffb0; box-shadow: none; }
[data-ui="v98"] :is(.link,.text-button,.admin-head a) { color: var(--joy-blue); }
[data-ui="v98"] :is(button,input,select,textarea) { font-family: inherit; }
[data-ui="v98"] button:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
[data-ui="v98"] :is(button,a,input,select,textarea,summary):focus-visible { outline: 3px solid #166ca3; outline-offset: 3px; }
[data-ui="v98"] :is(.filters,.toolbar,.public-search-bar) { gap: 10px; flex-wrap: wrap; }
[data-ui="v98"] .filters { padding: 14px; }
[data-ui="v98"] .filters .filter { padding: 9px 15px; border-radius: 999px; color: #496478; background: #eaf1f7; }
[data-ui="v98"] .filters .filter.active { background: var(--joy-blue); color: #fff; }
[data-ui="v98"] :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { max-width: 100%; min-width: 0; color: var(--joy-ink); border: 1px solid #b9ccd980; border-radius: 12px; background: #fff; padding: 11px 13px; font: inherit; }
[data-ui="v98"] :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { font-size: 14px; line-height: 1.5; min-height: 44px; }
[data-ui="v98"] :is(input[type=checkbox],input[type=radio]) { accent-color: var(--joy-blue); width: 18px; height: 18px; margin: 0 8px 0 0; padding: 0; vertical-align: middle; flex-shrink: 0; }
[data-ui="v98"] .cover { background: linear-gradient(125deg,#fae4db,#e4ebff); color: #17384d; border-bottom: 1px solid var(--joy-border); height: 155px; }
[data-ui="v98"] .cover.c2 { background: linear-gradient(125deg,#d7f0e7,#e5f3fc); }
[data-ui="v98"] .cover.c3 { background: linear-gradient(125deg,#e8e3ff,#f8e6ec); }
[data-ui="v98"] .cover :is(.cover-title,.cover-meta) { color: #17384d; text-shadow: none; }
[data-ui="v98"] .cover .round { background: #ffffffb3; color: var(--joy-blue); }
[data-ui="v98"] .cover .pill { background: #ffffffad !important; color: var(--joy-blue) !important; }
[data-ui="v98"] .course-body { padding: 20px; }
[data-ui="v98"] .course-body h3 { color: var(--joy-ink); line-height: 1.45; }
[data-ui="v98"] :is(.bar,.upload-progress) { background: #dce8f0; border-radius: 999px; }
[data-ui="v98"] :is(.bar,.upload-progress) > span { background: var(--joy-blue); }
[data-ui="v98"] :is(.avatar,.user-chip i,.role-icon,.hub i,.resource i) { color: var(--joy-blue); background: var(--joy-cyan-soft); }
[data-ui="v98"] :is(.user,.user-chip) { border-color: var(--joy-border); background: var(--joy-surface); color: #416278; }
[data-ui="v98"] :is(.continue,.resource) { gap: 14px; flex-wrap: wrap; }
[data-ui="v98"] .thumb { background: linear-gradient(120deg,#b9dff4,#e1d4f2); color: var(--joy-blue); }
[data-ui="v98"] :is(.notice,.empty,.scope-note) { border: 1px solid var(--joy-border); border-radius: 16px; background: #ffffffb0; color: #586978; line-height: 1.7; overflow-wrap: anywhere; }
[data-ui="v98"] .empty { padding: 26px; box-shadow: none; }
[data-ui="v98"] :is(.notice,.scope-note) { background: #fff8de; color: #70572c; }
[data-ui="v98"] :is(.roster-disclosure,.advanced-import,.custom-question-picker,.course-resource-editor,.course-section-manager,.team-exam-detail,.doc-template,.progress) { border-color: var(--joy-border); border-radius: 16px; background: #f8fbfcd9; }
[data-ui="v98"] :is(.table,.table-wrap table) { color: #425865; }
[data-ui="v98"] :is(.table th,.table-wrap th) { color: #466276; background: #e8f1f6; border-color: var(--joy-border); }
[data-ui="v98"] :is(.table td,.table-wrap td) { color: #425865; border-color: var(--joy-border); }
[data-ui="v98"] :is(.leaderboard-row,.team-exam-stats article,.answer-review,.course-resource-row,.course-resource-division,.course-section-division) { border-color: var(--joy-border); border-radius: 14px; background: #ffffffb3; }
[data-ui="v98"] .leaderboard-row.current { border-color: #76a9cb; background: #e8f4fc; }
[data-ui="v98"] :is(.leaderboard-row strong,.leaderboard-person b,.team-exam-stats b) { color: #17384d; }
[data-ui="v98"] :is(.team-exam-stats small,.team-exam-stats span) { color: #586978; }
[data-ui="v98"] :is(.review-question,.question-stem) { background: #eef5f9; color: var(--joy-ink); }
[data-ui="v98"] :is(.quiz-option,.review-option,.answer,.exam-options label) { border-color: #b9ccd980; border-radius: 14px; background: #fff; color: var(--joy-ink); padding: 14px 16px; line-height: 1.6; }
[data-ui="v98"] :is(.quiz-option:hover,.review-option.selected,.answer.on) { border-color: #166ca3; background: #edf7fd; }
[data-ui="v98"] :is(.quiz-option.correct,.quiz-option.right,.answer-review.correct) { border-color: #35936a; background: #e5f6ec; }
[data-ui="v98"] :is(.quiz-option.wrong,.answer-review.incorrect) { border-color: #d87971; background: #fff0ee; }
[data-ui="v98"] :is(.quiz-heading,.bank-practice-head,.review-actions,.question-editor-actions,.doc-import-actions,.admin-head-actions,.exam-taker-head) { gap: 12px; flex-wrap: wrap; }
[data-ui="v98"] :is(.public-search-bar input,.recipient-search-row input) { flex: 1 1 150px; }
[data-ui="v98"] :is(.public-bank-toolbar,.bank-practice-head) { min-width: 0; }
[data-ui="v98"] :is(.question-list-item,.directory-person,.recipient-chip) { border-color: var(--joy-border) !important; background: #ffffffc9 !important; color: #17384d !important; }
[data-ui="v98"] .question-list-item.active { background: #eaf5fc !important; border-color: #76a9cb !important; }
[data-ui="v98"] .question-side-panel { border-radius: 18px; padding: 18px; background: #edf5fa; }
[data-ui="v98"] :is(.admin-nav,.days,.question-list) { overscroll-behavior-x: contain; }
[data-ui="v98"] .admin-nav a { padding: 10px 14px; white-space: nowrap; }
[data-ui="v98"] .admin-nav a:hover { background: #eaf5fc; border-color: #76a9cb; }
[data-ui="v98"] .management-embedded-frame { background: transparent; }
[data-ui="v98"] .global-ui-label { color: #4c6477; font-size: 11px; font-weight: 750; white-space: nowrap; }
[data-ui="v98"] .global-progress-slot { display: flex; gap: 10px; align-items: center; }
@media (max-width: 760px) {
  html:root body[data-ui="v98"] :is(.main,.admin-shell,.team-shell,.bot-shell,.review-shell,.exam-taker-shell) { padding: 18px 14px 44px !important; }
  [data-ui="v98"] :is(.admin-card,.panel,.leaderboard-card) { padding: 18px; }
  [data-ui="v98"] :is(.page-title,.admin-head) h1 { font-size: 28px; }
  [data-ui="v98"] :is(.grid4,.stat-grid) { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  [data-ui="v98"] :is(.metric,.stat) { padding: 16px; }
  [data-ui="v98"] :is(.metric,.stat) b { font-size: 25px; }
  [data-ui="v98"] :is(.filters input,.filters select) { width: 100%; margin-left: 0; }
  [data-ui="v98"] :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { font-size: 16px; }
  [data-ui="v98"] :is(.hero,.team-hero) { padding: 24px; }
  [data-ui="v98"] :is(.courses,.paths,.path-grid,.role-grid,.exam-rule-grid,.field-pair,.field-pair.three,.admin-grid) { grid-template-columns: minmax(0,1fr); }
  [data-ui="v98"] :is(.admin-head,.top,.question-admin-head) { align-items: flex-start; }
  [data-ui="v98"] :is(.recipient-search-row,.public-search-bar) { flex-wrap: wrap; }
  [data-ui="v98"] .global-ui-label { font-size: 10px; }
  [data-ui="v98"] .directory-person { grid-template-columns: minmax(0,1fr) auto; }
  [data-ui="v98"] .directory-person span { grid-column: 1/-1; overflow-wrap: anywhere; }
  [data-ui="v98"] .leaderboard-row { grid-template-columns: 26px 32px minmax(0,1fr) auto; gap: 7px; padding: 9px; }
}
@media (prefers-reduced-motion: reduce) { [data-ui="v98"] *, [data-ui="v98"] *::before, [data-ui="v98"] *::after { transition: none !important; scroll-behavior: auto !important; } }