/* StudyArea.ai Platform UI ----------------------------------------------------
   Desktop productivity workspace + Study Sets learning tools.
   Loaded after app.css so legacy StudyArea.ai pages keep their behavior while
   receiving a wider, professional desktop shell. */

:root {
  --platform-sidebar: 248px;
  --platform-content: 1240px;
  --platform-soft: #f7f9fd;
  --platform-blue-soft: #eef4ff;
  --platform-line: rgba(148,163,184,.24);
  --platform-shadow: 0 10px 30px rgba(15,23,42,.06);
  --platform-shadow-lg: 0 22px 60px rgba(15,23,42,.10);
}
[data-theme="dark"] {
  --platform-soft: #172033;
  --platform-blue-soft: #162744;
  --platform-line: rgba(148,163,184,.18);
  --platform-shadow: 0 10px 30px rgba(0,0,0,.18);
  --platform-shadow-lg: 0 22px 60px rgba(0,0,0,.28);
}

/* Auth/onboarding */
.auth-card-expanded { max-width: 470px; }
.auth-card-expanded .auth-form { gap: 13px; }
.auth-card-expanded .api-status { margin-top: 16px; }
.select-field { position: relative; display: flex; align-items: center; }
.select-field > i:first-child { position:absolute; left:15px; color:var(--primary); z-index:2; width:18px; text-align:center; }
.select-field select,
.platform-select {
  appearance:none; -webkit-appearance:none; width:100%; min-height:48px;
  padding:11px 42px 11px 16px; border:2px solid var(--border); border-radius:var(--radius-sm);
  background:var(--surface-2); color:var(--text); font:inherit; font-size:14px; outline:none;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.select-field select { padding-left:45px; }
.select-field select:focus,.platform-select:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-glow); }
.select-chevron { position:absolute; right:15px; color:var(--text-tertiary); pointer-events:none; font-size:12px; }
.auth-card-expanded .btn-primary,.auth-card-expanded .btn-secondary { min-height:48px; }

/* Desktop app shell */
.platform-frame { flex:1; min-width:0; }
.desktop-sidebar { display:none; }
.header-search-btn {
  width:38px; height:38px; border:0; border-radius:10px; background:transparent; color:var(--text-secondary);
  display:inline-grid; place-items:center; cursor:pointer; transition:var(--transition); font-size:15px;
}
.header-search-btn:hover { background:var(--surface-2); color:var(--primary); }
.main-content { width:100%; }
.platform-page h1 { margin:0; color:var(--text); font-size:clamp(25px,2.4vw,34px); line-height:1.15; letter-spacing:-.025em; }
.platform-page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:24px; }
.platform-page-head p,.tool-hero p { margin:7px 0 0; color:var(--text-secondary); line-height:1.6; max-width:720px; }
.platform-eyebrow { color:var(--primary); text-transform:uppercase; letter-spacing:.09em; font-weight:800; font-size:11px; margin-bottom:6px; }
.platform-primary-action { display:inline-flex; align-items:center; gap:9px; white-space:nowrap; }
.section-subtitle { color:var(--text-tertiary); font-size:12px; margin-top:3px; }
.platform-section { margin-top:30px; }

/* Sidebar */
@media (min-width: 1024px) {
  .app-shell { min-height:100vh; }
  .app-header { padding-left:22px; padding-right:22px; }
  .platform-frame { display:flex; align-items:stretch; min-height:calc(100vh - var(--header-height)); }
  .desktop-sidebar {
    display:block; width:var(--platform-sidebar); flex:0 0 var(--platform-sidebar); background:var(--surface);
    border-right:1px solid var(--border); position:sticky; top:var(--header-height); height:calc(100vh - var(--header-height)); overflow:auto;
  }
  .desktop-sidebar-inner { min-height:100%; display:flex; flex-direction:column; padding:18px 14px; }
  .desktop-nav { display:flex; flex-direction:column; gap:5px; }
  .desktop-nav-item {
    width:100%; border:0; background:transparent; color:var(--text-secondary); min-height:44px; border-radius:11px;
    display:flex; align-items:center; gap:12px; padding:0 13px; cursor:pointer; font:inherit; font-size:14px; font-weight:600;
    transition:background .16s ease,color .16s ease,transform .16s ease;
  }
  .desktop-nav-item i { width:19px; font-size:15px; color:var(--text-tertiary); transition:color .16s ease; }
  .desktop-nav-item:hover { background:var(--surface-2); color:var(--text); }
  .desktop-nav-item.active { background:var(--primary-lighter); color:var(--primary); }
  .desktop-nav-item.active i { color:var(--primary); }
  .desktop-sidebar-section { border-top:1px solid var(--border-light); margin-top:18px; padding-top:17px; }
  .desktop-sidebar-title { display:flex; align-items:center; justify-content:space-between; padding:0 8px 9px; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--text-tertiary); }
  .desktop-sidebar-title button { border:0; background:transparent; color:var(--text-tertiary); width:28px; height:28px; border-radius:8px; cursor:pointer; }
  .desktop-sidebar-title button:hover { background:var(--surface-2); color:var(--primary); }
  .desktop-folder-list { display:flex; flex-direction:column; gap:2px; }
  .desktop-folder-item { width:100%; border:0; background:transparent; display:flex; align-items:center; gap:9px; padding:9px 10px; border-radius:9px; color:var(--text-secondary); cursor:pointer; font:inherit; font-size:13px; text-align:left; }
  .desktop-folder-item:hover { background:var(--surface-2); color:var(--text); }
  .desktop-folder-item > span { width:8px; height:8px; border-radius:50%; flex:none; }
  .desktop-folder-item small { margin-left:auto; color:var(--text-tertiary); }
  .sidebar-muted { color:var(--text-tertiary); padding:9px 10px; font-size:12px; }
  .desktop-sidebar-spacer { flex:1; min-height:24px; }
  .main-content { max-width:none !important; margin:0 !important; padding:30px clamp(28px,3.5vw,58px) 54px !important; min-width:0; }
  .main-content > .page { max-width:var(--platform-content); margin:0 auto; }
  .bottom-nav { display:none; }
}

/* Study-set landing */
.source-launch-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:0 0 26px; }
.source-launch {
  text-align:left; border:1px solid var(--border); background:var(--surface); border-radius:18px; min-height:132px; padding:20px;
  display:grid; grid-template-columns:48px 1fr; grid-template-rows:auto auto; column-gap:14px; align-items:center; cursor:pointer; color:var(--text);
  box-shadow:var(--shadow); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.source-launch:hover { transform:translateY(-2px); border-color:rgba(37,99,235,.35); box-shadow:var(--platform-shadow); background:linear-gradient(180deg,var(--surface),var(--surface-2)); }
.source-launch-icon { grid-row:1 / 3; width:48px; height:48px; border-radius:14px; background:var(--primary-lighter); color:var(--primary); display:grid; place-items:center; font-size:17px; }
.source-launch strong { font-size:15px; align-self:end; }
.source-launch small { color:var(--text-secondary); line-height:1.45; align-self:start; margin-top:3px; }
.library-toolbar { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:17px; }
.folder-filter { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding:2px; }
.folder-filter::-webkit-scrollbar { display:none; }
.folder-filter-pill,.subject-chip {
  flex:none; border:1px solid var(--border); background:var(--surface); color:var(--text-secondary); border-radius:999px; min-height:38px; padding:0 15px; font:inherit; font-size:12px; font-weight:650; cursor:pointer; display:inline-flex; align-items:center; gap:7px;
}
.folder-filter-pill > span { width:7px; height:7px; border-radius:50%; }
.folder-filter-pill:hover,.subject-chip:hover { border-color:var(--primary-light); color:var(--primary); }
.folder-filter-pill.active,.subject-chip.active { background:var(--text); color:var(--surface); border-color:var(--text); }
.icon-text-btn {
  border:1px solid var(--border); background:var(--surface); color:var(--text-secondary); min-height:38px; padding:0 13px; border-radius:10px; display:inline-flex; align-items:center; gap:7px; font:inherit; font-size:12px; font-weight:650; cursor:pointer;
}
.icon-text-btn:hover { border-color:var(--primary-light); color:var(--primary); background:var(--primary-lighter); }
.study-set-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:17px; }
.study-set-card {
  background:var(--surface); border:1px solid var(--border); border-radius:18px; overflow:hidden; box-shadow:var(--shadow); cursor:pointer; min-width:0;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.study-set-card:hover { transform:translateY(-3px); box-shadow:var(--platform-shadow); border-color:rgba(37,99,235,.28); }
.study-set-cover { height:112px; position:relative; display:grid; place-items:center; overflow:hidden; background:linear-gradient(135deg,color-mix(in srgb,var(--set-color) 88%, white),color-mix(in srgb,var(--set-color) 60%, #111827)); color:#fff; }
@supports not (background: color-mix(in srgb, red, white)) { .study-set-cover { background:linear-gradient(135deg,var(--set-color),#1e40af); } }
.study-set-cover::after { content:""; position:absolute; inset:-80px -30px auto auto; width:170px; height:170px; border-radius:50%; background:rgba(255,255,255,.14); }
.study-set-cover > i { font-size:31px; z-index:1; }
.set-visibility { position:absolute; right:11px; top:11px; width:29px; height:29px; border-radius:9px; background:rgba(15,23,42,.24); backdrop-filter:blur(7px); display:grid; place-items:center; font-size:11px; z-index:2; }
.study-set-body { padding:17px 17px 14px; }
.study-set-subject { font-size:10px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:var(--primary); margin-bottom:6px; }
.study-set-body h3 { margin:0; font-size:16px; line-height:1.35; color:var(--text); }
.study-set-body p { min-height:40px; margin:6px 0 13px; color:var(--text-secondary); font-size:12px; line-height:1.55; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.study-set-stats { display:flex; gap:12px; color:var(--text-tertiary); font-size:11px; }
.study-set-stats span { display:inline-flex; align-items:center; gap:5px; }
.set-mastery { margin-top:14px; }
.set-mastery > div:first-child { display:flex; justify-content:space-between; font-size:10px; color:var(--text-tertiary); margin-bottom:5px; }
.set-mastery strong { color:var(--text-secondary); }
.set-mastery-track,.workspace-mastery-track { height:6px; border-radius:99px; background:var(--border-light); overflow:hidden; }
.set-mastery-track > span,.workspace-mastery-track > div { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--primary),#60a5fa); transition:width .4s ease; }
.study-set-card-footer { min-height:48px; border-top:1px solid var(--border-light); padding:10px 15px 10px 17px; display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--text-tertiary); font-size:10px; }
.study-set-card-footer > span { display:flex; align-items:center; gap:5px; overflow:hidden; }
.set-open-btn { border:0; background:transparent; color:var(--primary); display:inline-flex; align-items:center; gap:6px; font:inherit; font-size:11px; font-weight:750; cursor:pointer; }
.platform-empty { grid-column:1/-1; text-align:center; min-height:250px; border:1px dashed var(--border); border-radius:18px; background:var(--surface-2); padding:38px 20px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--text-secondary); }
.platform-empty > i { font-size:29px; color:var(--primary); margin-bottom:13px; }
.platform-empty h3 { margin:0 0 6px; color:var(--text); }
.platform-empty p { margin:0 0 16px; max-width:480px; line-height:1.55; }
.platform-empty.compact { min-height:130px; padding:22px; }
.platform-loading { min-height:220px; display:flex; align-items:center; justify-content:center; gap:10px; color:var(--text-secondary); }
.platform-loading.compact { min-height:90px; }

/* Recent sets on classic Home */
.home-study-sets-section { margin:0 0 22px; }
.home-study-sets { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.home-set-card { border:1px solid var(--border); background:var(--surface); border-radius:14px; min-width:0; padding:12px; display:flex; align-items:center; gap:10px; text-align:left; font:inherit; color:var(--text); cursor:pointer; transition:var(--transition); }
.home-set-card:hover { border-color:var(--primary-light); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.home-set-icon { width:38px; height:38px; border-radius:11px; display:grid; place-items:center; flex:none; background:color-mix(in srgb,var(--set-color) 13%, var(--surface)); color:var(--set-color); }
.home-set-copy { min-width:0; display:flex; flex-direction:column; gap:2px; flex:1; }
.home-set-copy strong { font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-set-copy small { color:var(--text-tertiary); font-size:9px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-set-score { font-size:11px; font-weight:800; color:var(--primary); }

/* Study workspace */
.study-workspace-header { display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.workspace-back { width:40px; height:40px; flex:none; border:1px solid var(--border); background:var(--surface); color:var(--text-secondary); border-radius:11px; display:grid; place-items:center; cursor:pointer; }
.workspace-back:hover { color:var(--primary); border-color:var(--primary-light); }
.workspace-title-wrap { min-width:0; flex:1; }
.workspace-title-wrap h1 { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:clamp(22px,2vw,29px); }
.workspace-subject { color:var(--primary); text-transform:uppercase; font-size:10px; letter-spacing:.08em; font-weight:800; margin-bottom:3px; }
.workspace-meta { color:var(--text-tertiary); font-size:11px; margin-top:3px; }
.workspace-header-actions { display:flex; align-items:center; gap:8px; }
.btn-primary.compact { padding:10px 14px; font-size:12px; }
.workspace-mastery-card { display:grid; grid-template-columns:110px minmax(180px,1fr) minmax(220px,1.3fr); gap:16px; align-items:center; border:1px solid var(--border); background:linear-gradient(135deg,var(--surface),var(--surface-2)); border-radius:15px; padding:13px 16px; margin-bottom:15px; }
.workspace-mastery-card > div:first-child { display:flex; align-items:baseline; gap:8px; }
.workspace-mastery-card span { color:var(--text-tertiary); font-size:10px; font-weight:650; }
.workspace-mastery-card strong { font-size:19px; color:var(--text); }
.workspace-recommendation { color:var(--text-secondary); font-size:11px; line-height:1.45; }
.workspace-shell { display:grid; grid-template-columns:190px minmax(0,1fr); min-height:610px; border:1px solid var(--border); border-radius:18px; overflow:hidden; background:var(--surface); box-shadow:var(--shadow); }
.workspace-tools { background:var(--surface-2); border-right:1px solid var(--border); padding:12px 9px; display:flex; flex-direction:column; gap:3px; }
.workspace-tool { min-height:41px; border:0; border-radius:10px; background:transparent; color:var(--text-secondary); padding:0 10px; display:flex; align-items:center; gap:10px; font:inherit; font-size:11px; font-weight:650; cursor:pointer; text-align:left; }
.workspace-tool i { width:16px; color:var(--text-tertiary); }
.workspace-tool:hover { background:var(--surface); color:var(--text); }
.workspace-tool.active { background:var(--surface); color:var(--primary); box-shadow:var(--shadow); }
.workspace-tool.active i { color:var(--primary); }
.workspace-content { min-width:0; padding:24px clamp(18px,2.5vw,32px) 32px; }
.workspace-content-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:18px; }
.workspace-content-head h2 { margin:0; font-size:21px; color:var(--text); }
.workspace-content-head p { margin:5px 0 0; color:var(--text-secondary); font-size:12px; line-height:1.5; }
.lesson-document,.solution-document { max-width:820px; margin:0 auto; color:var(--text-secondary); font-size:14px; line-height:1.8; }
.lesson-document h2,.lesson-document h3,.lesson-document h4,.solution-document h2,.solution-document h3 { color:var(--text); margin:24px 0 10px; line-height:1.35; }
.lesson-document p,.solution-document p { margin:0 0 13px; }
.lesson-document ul,.solution-document ul { padding-left:22px; }
.tool-kicker { color:var(--primary); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.tool-empty-panel { min-height:400px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:var(--text-secondary); padding:30px; }
.tool-empty-icon { width:64px; height:64px; border-radius:19px; background:var(--primary-lighter); color:var(--primary); display:grid; place-items:center; font-size:22px; margin-bottom:16px; }
.tool-empty-panel h3 { margin:0 0 6px; color:var(--text); }
.tool-empty-panel p { max-width:480px; margin:0 0 18px; line-height:1.6; }
.tool-list { display:flex; flex-direction:column; gap:9px; }
.tool-list-row { display:flex; align-items:center; gap:12px; border:1px solid var(--border); border-radius:13px; padding:12px 13px; background:var(--surface); }
.tool-list-icon { width:38px; height:38px; flex:none; border-radius:11px; display:grid; place-items:center; background:var(--primary-lighter); color:var(--primary); }
.tool-list-row > div:nth-child(2) { min-width:0; flex:1; }
.tool-list-row strong { display:block; font-size:12px; color:var(--text); }
.tool-list-row small { color:var(--text-tertiary); font-size:10px; }
.tool-list-actions { display:flex; gap:6px; }

/* Study set chat */
.set-chat-messages { min-height:390px; max-height:530px; overflow-y:auto; display:flex; flex-direction:column; gap:10px; padding:5px 2px 16px; }
.set-chat-message { max-width:82%; padding:12px 14px; border-radius:14px; font-size:12px; line-height:1.65; white-space:pre-wrap; }
.set-chat-message.user { margin-left:auto; color:#fff; background:var(--primary); border-bottom-right-radius:4px; }
.set-chat-message.assistant { margin-right:auto; background:var(--surface-2); color:var(--text-secondary); border:1px solid var(--border); border-bottom-left-radius:4px; }
.set-chat-suggestions { display:flex; gap:7px; overflow-x:auto; margin:0 0 10px; }
.set-chat-compose { display:flex; gap:8px; position:sticky; bottom:0; background:var(--surface); padding-top:8px; }
.set-chat-compose input { flex:1; border:2px solid var(--border); border-radius:12px; padding:12px 14px; background:var(--surface-2); color:var(--text); outline:none; font:inherit; }
.set-chat-compose input:focus { border-color:var(--primary); }
.set-chat-compose button { width:46px; border:0; border-radius:12px; background:var(--primary); color:#fff; cursor:pointer; }

/* Inline generators/questions */
.quiz-generator-inline,.podcast-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; border:1px solid var(--border); background:var(--surface-2); border-radius:14px; padding:13px; margin-bottom:16px; }
.form-grid-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.form-grid-three { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.platform-textarea { width:100%; min-height:130px; resize:vertical; border:2px solid var(--border); border-radius:12px; background:var(--surface-2); color:var(--text); font:inherit; font-size:13px; line-height:1.6; padding:13px 14px; outline:none; }
.platform-textarea:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-glow); }
.set-quiz-form,.written-test-form,.fill-test-form { display:flex; flex-direction:column; gap:16px; }
.set-quiz-question,.written-question,.fill-question,.quiz-editor-card { border:1px solid var(--border); border-radius:15px; padding:16px; background:var(--surface); }
.set-quiz-question h3,.written-question h3,.fill-question h3 { margin:4px 0 13px; color:var(--text); font-size:14px; line-height:1.5; }
.set-quiz-options { display:grid; gap:8px; }
.set-quiz-options label { display:flex; align-items:flex-start; gap:9px; border:1px solid var(--border); border-radius:10px; padding:10px 11px; color:var(--text-secondary); font-size:12px; cursor:pointer; }
.set-quiz-options label:hover { border-color:var(--primary-light); background:var(--primary-lighter); }
.set-quiz-options input { accent-color:var(--primary); margin-top:2px; }
.result-surface { border:1px solid var(--border); border-radius:18px; padding:22px; background:var(--surface); box-shadow:var(--shadow); margin-top:18px; }
.result-surface-head { display:flex; align-items:center; gap:18px; margin-bottom:18px; }
.result-score-ring,.grade-score-ring { width:90px; height:90px; flex:none; border-radius:50%; border:7px solid var(--primary); display:grid; place-items:center; color:var(--primary); font-size:20px; font-weight:800; }
.result-review-list { display:flex; flex-direction:column; gap:10px; }
.result-review { border:1px solid var(--border); border-radius:12px; padding:13px; font-size:12px; line-height:1.55; }
.result-review.correct { border-left:4px solid var(--success); }
.result-review.wrong { border-left:4px solid var(--danger); }
.quiz-editor-list { display:flex; flex-direction:column; gap:10px; }
.quiz-editor-card textarea,.quiz-editor-card input { width:100%; }
.card-edit-actions { display:flex; justify-content:flex-end; gap:7px; margin-top:8px; }
.written-feedback { margin-top:10px; padding:11px; border-radius:10px; background:var(--surface-2); color:var(--text-secondary); font-size:11px; line-height:1.55; }
.written-feedback-score { color:var(--primary); font-weight:800; }

/* Workspace flashcards */
.mastery-pills { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:15px; }
.mastery-state { border:1px solid var(--border); background:var(--surface-2); color:var(--text-secondary); border-radius:999px; padding:6px 10px; font-size:10px; font-weight:700; }
.mastery-state.unfamiliar { color:#dc2626; background:#fef2f2; border-color:#fecaca; }
.mastery-state.learning { color:#d97706; background:#fffbeb; border-color:#fde68a; }
.mastery-state.familiar { color:#2563eb; background:#eff6ff; border-color:#bfdbfe; }
.mastery-state.mastered { color:#059669; background:#ecfdf5; border-color:#a7f3d0; }
[data-theme="dark"] .mastery-state.unfamiliar,[data-theme="dark"] .mastery-state.learning,[data-theme="dark"] .mastery-state.familiar,[data-theme="dark"] .mastery-state.mastered { background:var(--surface-2); }
.workspace-flashcard { perspective:1100px; width:min(100%,650px); height:360px; margin:10px auto 16px; cursor:pointer; }
.workspace-flashcard-inner { width:100%; height:100%; position:relative; transform-style:preserve-3d; transition:transform .55s cubic-bezier(.2,.7,.2,1); }
.workspace-flashcard.flipped .workspace-flashcard-inner { transform:rotateY(180deg); }
.workspace-flashcard-face { position:absolute; inset:0; backface-visibility:hidden; border:1px solid var(--border); border-radius:18px; padding:28px; background:var(--surface); box-shadow:var(--platform-shadow); display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; }
.workspace-flashcard-face.back { transform:rotateY(180deg); background:var(--primary-lighter); border-color:rgba(37,99,235,.25); }
.workspace-flashcard-face h3 { max-width:560px; font-size:20px; line-height:1.5; margin:0; color:var(--text); }
.workspace-flashcard-face p { color:var(--text-tertiary); font-size:11px; margin:12px 0 0; }
.workspace-card-actions,.set-card-nav { display:flex; justify-content:center; align-items:center; gap:8px; }
.set-card-nav { justify-content:space-between; width:min(100%,650px); margin:0 auto 12px; color:var(--text-tertiary); font-size:11px; }

/* Rich notes */
.rich-toolbar { position:sticky; top:0; z-index:2; display:flex; flex-wrap:wrap; gap:5px; padding:8px; border:1px solid var(--border); border-bottom:0; border-radius:12px 12px 0 0; background:var(--surface-2); }
.rich-toolbar button,.rich-toolbar select { border:1px solid transparent; min-height:31px; border-radius:7px; background:transparent; color:var(--text-secondary); cursor:pointer; font:inherit; font-size:11px; padding:0 9px; }
.rich-toolbar button:hover { background:var(--surface); color:var(--primary); border-color:var(--border); }
.rich-editor { min-height:460px; border:1px solid var(--border); border-radius:0 0 12px 12px; padding:22px; outline:none; background:var(--surface); color:var(--text-secondary); line-height:1.75; font-size:13px; }
.rich-editor:focus { border-color:var(--primary-light); box-shadow:inset 0 0 0 1px var(--primary-light); }
.autosave-status { color:var(--text-tertiary); font-size:10px; margin-top:7px; text-align:right; }

/* Podcast */
.podcast-player-card { border:1px solid var(--border); border-radius:18px; background:linear-gradient(135deg,var(--surface),var(--surface-2)); padding:20px; display:flex; gap:18px; align-items:center; }
.podcast-art { width:90px; height:90px; flex:none; border-radius:20px; display:grid; place-items:center; color:#fff; font-size:30px; background:linear-gradient(135deg,#7c3aed,#2563eb); box-shadow:0 14px 30px rgba(79,70,229,.22); }
.podcast-player-copy { flex:1; min-width:0; }
.podcast-player-copy h3 { margin:0 0 5px; font-size:17px; }
.podcast-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.podcast-transcript { white-space:pre-wrap; margin-top:16px; border:1px solid var(--border); border-radius:14px; padding:17px; background:var(--surface-2); color:var(--text-secondary); line-height:1.7; font-size:12px; max-height:420px; overflow:auto; }

/* Source management/recording */
.source-list { display:flex; flex-direction:column; gap:9px; }
.source-row { display:flex; align-items:center; gap:12px; padding:12px 13px; border:1px solid var(--border); border-radius:13px; background:var(--surface); }
.source-row-icon { width:40px; height:40px; border-radius:11px; display:grid; place-items:center; background:var(--primary-lighter); color:var(--primary); flex:none; }
.source-row > div:nth-child(2) { min-width:0; flex:1; }
.source-row strong { display:block; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.source-row small { color:var(--text-tertiary); font-size:10px; }
.source-status { border-radius:99px; padding:4px 8px; font-size:9px; font-weight:800; text-transform:uppercase; }
.source-status.ready { color:#047857; background:#ecfdf5; }
.source-status.failed { color:#b91c1c; background:#fef2f2; }
.source-status.processing,.source-status.pending { color:#b45309; background:#fffbeb; }
.source-type-tabs { display:flex; gap:6px; overflow-x:auto; margin-bottom:17px; }
.source-type-tabs button { flex:none; border:1px solid var(--border); background:var(--surface); color:var(--text-secondary); border-radius:10px; min-height:38px; padding:0 12px; font:inherit; font-size:11px; font-weight:650; cursor:pointer; }
.source-type-tabs button.active { background:var(--primary-lighter); color:var(--primary); border-color:var(--primary-light); }
.source-panel { display:none; }
.source-panel.active { display:block; }
.source-upload-zone,.solve-dropzone { border:2px dashed var(--border); border-radius:15px; background:var(--surface-2); min-height:165px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:24px; cursor:pointer; color:var(--text-secondary); transition:var(--transition); }
.source-upload-zone:hover,.source-upload-zone.dragover,.solve-dropzone:hover,.solve-dropzone.dragover { border-color:var(--primary); background:var(--primary-lighter); }
.source-upload-zone > i,.solve-dropzone > i { font-size:25px; color:var(--primary); margin-bottom:10px; }
.source-upload-zone strong,.solve-dropzone strong { color:var(--text); font-size:13px; }
.source-upload-zone span,.solve-dropzone span { color:var(--text-tertiary); font-size:10px; margin-top:5px; }
.source-help { color:var(--text-tertiary); font-size:10px; line-height:1.5; margin-top:8px; }
.recording-panel { border:1px solid var(--border); border-radius:15px; padding:22px; background:var(--surface-2); text-align:center; }
.recording-visual { width:76px; height:76px; margin:0 auto 12px; border-radius:50%; display:grid; place-items:center; background:#fee2e2; color:#dc2626; font-size:21px; }
.record-dot { width:12px; height:12px; border-radius:50%; background:#ef4444; display:inline-block; box-shadow:0 0 0 7px rgba(239,68,68,.12); animation:pulse 1.4s infinite; }
.record-timer { font-size:25px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; }
.record-actions { display:flex; justify-content:center; gap:8px; margin-top:13px; }
.selected-file { min-height:20px; margin-top:7px; color:var(--text-secondary); font-size:11px; }

/* Explore */
.explore-subjects { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding-bottom:4px; }
.explore-subjects::-webkit-scrollbar { display:none; }
.explore-grid,.video-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.explore-card,.learning-video-card { overflow:hidden; border:1px solid var(--border); background:var(--surface); border-radius:17px; box-shadow:var(--shadow); }
.explore-card-cover,.video-thumb { position:relative; height:145px; overflow:hidden; background:linear-gradient(135deg,#2563eb,#7c3aed); display:grid; place-items:center; color:#fff; }
.explore-card-cover > i { font-size:28px; }
.explore-card-body { padding:15px; }
.explore-card-body h3 { margin:0 0 5px; font-size:14px; color:var(--text); }
.explore-card-body p { margin:0 0 12px; color:var(--text-secondary); font-size:11px; line-height:1.5; min-height:33px; }
.explore-card-meta { display:flex; justify-content:space-between; gap:8px; font-size:9px; color:var(--text-tertiary); }
.learning-video-card img { width:100%; height:100%; object-fit:cover; }
.video-play { position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); width:48px; height:48px; border-radius:50%; background:rgba(15,23,42,.78); color:#fff; display:grid; place-items:center; }
.learning-video-card .explore-card-body a { color:var(--primary); text-decoration:none; font-weight:700; }

/* Solve + grader */
.tool-hero { display:flex; gap:14px; align-items:flex-start; margin-bottom:22px; }
.tool-hero-icon { width:50px; height:50px; border-radius:15px; flex:none; display:grid; place-items:center; color:var(--primary); background:var(--primary-lighter); font-size:19px; }
.tool-hero h1 { margin:0; font-size:clamp(25px,2.4vw,34px); }
.tool-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:18px; align-items:start; }
.tool-card { border:1px solid var(--border); border-radius:18px; background:var(--surface); padding:20px; box-shadow:var(--shadow); }
.tool-history { border:1px solid var(--border); border-radius:18px; background:var(--surface); padding:17px; max-height:610px; overflow:auto; }
.tool-history .section-title { font-size:14px; }
.history-grid { display:flex; flex-direction:column; gap:8px; }
.history-item,.grade-history-card { border:1px solid var(--border); background:var(--surface-2); border-radius:11px; padding:11px; cursor:pointer; }
.history-item:hover,.grade-history-card:hover { border-color:var(--primary-light); }
.history-item strong,.grade-history-card strong { display:block; font-size:11px; color:var(--text); }
.history-item small,.grade-history-card small { font-size:9px; color:var(--text-tertiary); }
.tool-submit { width:100%; margin-top:14px; display:flex; justify-content:center; gap:8px; }
.solve-followup { margin-top:28px; border-top:1px solid var(--border-light); padding-top:22px; }
.solve-followup-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:12px; }
.solve-followup-heading h3 { margin:2px 0 0; color:var(--text); font-size:16px; line-height:1.25; }
.solve-followup-hint { color:var(--text-tertiary); font-size:10px; line-height:1.4; white-space:nowrap; }
.solve-followup-composer { display:flex; align-items:flex-end; gap:10px; padding:8px; border:1px solid var(--border); border-radius:16px; background:var(--surface); box-shadow:0 8px 28px rgba(15,23,42,.06); transition:border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.solve-followup-composer:focus-within { border-color:var(--primary); box-shadow:0 0 0 4px var(--primary-glow),0 12px 30px rgba(37,99,235,.10); }
.solve-followup-input-wrap { min-width:0; flex:1; display:flex; align-items:flex-end; gap:10px; padding:4px 6px 4px 10px; }
.solve-followup-input-wrap > i { flex:none; width:18px; margin-bottom:11px; color:var(--primary); font-size:14px; text-align:center; }
.solve-followup-input-wrap textarea { width:100%; min-height:48px; max-height:140px; resize:none; overflow-y:auto; border:0; outline:0; padding:12px 2px 10px; background:transparent; color:var(--text); font:inherit; font-size:13px; line-height:1.5; }
.solve-followup-input-wrap textarea::placeholder { color:var(--text-tertiary); }
.solve-followup-input-wrap textarea:disabled { opacity:.68; cursor:wait; }
.solve-followup-send { flex:none; min-width:104px; min-height:48px; border-radius:12px; padding:0 17px; display:inline-flex; align-items:center; justify-content:center; gap:8px; box-shadow:0 8px 18px rgba(37,99,235,.20); }
.solve-followup-send > i { font-size:12px; }
.solve-followup-messages { display:flex; flex-direction:column; gap:10px; margin-top:16px; }
.followup-bubble { border:1px solid var(--border); border-radius:14px; padding:12px 14px; font-size:12px; line-height:1.65; box-shadow:0 3px 12px rgba(15,23,42,.035); }
.followup-bubble.user { background:var(--primary-lighter); border-color:var(--primary-glow); margin-left:12%; }
.followup-bubble.ai,.followup-bubble.assistant { background:var(--surface-2); margin-right:12%; }
@media (max-width:640px) {
  .solve-followup-heading { align-items:flex-start; flex-direction:column; gap:5px; }
  .solve-followup-hint { white-space:normal; }
  .solve-followup-composer { align-items:stretch; }
  .solve-followup-send { min-width:50px; width:50px; padding:0; }
  .solve-followup-send span { display:none; }
  .solve-followup-input-wrap { padding-left:5px; }
  .followup-bubble.user { margin-left:5%; }
  .followup-bubble.ai,.followup-bubble.assistant { margin-right:5%; }
}
.grader-choice { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; max-width:640px; margin:0 auto 15px; }
.grader-choice-card { border:1px solid var(--border); background:var(--surface); border-radius:16px; min-height:112px; padding:18px; display:flex; flex-direction:column; align-items:flex-start; gap:5px; color:var(--text); cursor:pointer; font:inherit; }
.grader-choice-card > i { color:var(--primary); font-size:19px; margin-bottom:6px; }
.grader-choice-card strong { font-size:13px; }
.grader-choice-card span { color:var(--text-secondary); font-size:10px; }
.grader-choice-card.active { border-color:var(--primary); background:var(--primary-lighter); box-shadow:0 0 0 2px var(--primary-glow); }
.grader-form { max-width:880px; margin:0 auto; }
.grader-textarea { min-height:310px; }
.rubric-card { margin-top:16px; border:1px solid var(--border); border-radius:14px; padding:14px; background:var(--surface-2); }
.rubric-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.rubric-head strong { font-size:12px; }
.rubric-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; }
.rubric-grid label { color:var(--text-tertiary); font-size:9px; }
.rubric-grid input { width:100%; margin-top:5px; border:1px solid var(--border); border-radius:8px; padding:8px; background:var(--surface); color:var(--text); }
.grade-result-head { display:flex; gap:18px; align-items:center; }
.grade-criteria-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:18px; }
.grade-score-mini { border:1px solid var(--border); border-radius:12px; padding:12px; }
.grade-score-mini > div:first-child { display:flex; justify-content:space-between; gap:10px; font-size:11px; font-weight:700; }
.grade-score-mini p { color:var(--text-secondary); font-size:10px; line-height:1.5; margin:6px 0 0; }
.grade-feedback-section { margin-top:18px; }
.grade-feedback-section h3 { font-size:13px; }
.grade-feedback-section li { color:var(--text-secondary); font-size:11px; line-height:1.55; margin-bottom:5px; }

/* Modals, onboarding, global search */
.modal-wide { max-width:680px; }
.onboarding-modal {
  max-width:680px; max-height:min(88vh,760px); padding:30px 34px 32px;
  border:1px solid var(--border); overflow-x:hidden;
}
.onboarding-brand { display:flex; align-items:center; justify-content:center; margin:0 auto 8px; min-height:72px; }
.onboarding-brand img { display:block; width:min(245px,76%); max-height:82px; object-fit:contain; }
.onboarding-copy { text-align:center; margin-bottom:18px; }
.onboarding-copy h2 { margin:0 0 6px; font-size:22px; }
.onboarding-copy p { color:var(--text-secondary); margin:0; line-height:1.55; font-size:12px; }
.onboarding-modal .onboarding-copy { margin-bottom:24px; }
.onboarding-modal .onboarding-copy h2 { margin-bottom:7px; font-size:26px; line-height:1.2; letter-spacing:-.02em; }
.onboarding-modal .onboarding-copy p { margin:0 auto; max-width:520px; font-size:13px; }
.onboarding-modal form { max-width:590px; margin:0 auto; }
.onboarding-modal .input-group > label { display:block; font-size:13px; font-weight:750; color:var(--text-secondary); }
.onboarding-modal .select-field select { min-height:52px; border-radius:13px; background:var(--surface-2); }
.onboarding-language-group { margin-bottom:19px!important; }
.onboarding-persona-group { margin-bottom:22px!important; }
.persona-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }
.persona-option { position:relative; min-width:0; cursor:pointer; }
.persona-option > input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.persona-card {
  min-height:92px; width:100%; padding:14px; border:1.5px solid var(--border); border-radius:15px;
  background:var(--surface); color:var(--text); display:grid; grid-template-columns:44px minmax(0,1fr) 24px;
  align-items:center; gap:12px; transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;
}
.persona-icon {
  width:44px; height:44px; border-radius:13px; display:grid; place-items:center;
  background:var(--surface-2); color:var(--text-secondary); font-size:16px;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.persona-content { min-width:0; display:flex; flex-direction:column; gap:4px; }
.persona-content strong { color:var(--text); font-size:13px; line-height:1.25; font-weight:750; }
.persona-content small { color:var(--text-tertiary); font-size:10px; line-height:1.35; }
.persona-check {
  width:22px; height:22px; border-radius:50%; display:grid; place-items:center; justify-self:end;
  border:1.5px solid var(--border); color:transparent; background:var(--surface); font-size:9px;
  transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease;
}
.persona-option:hover .persona-card { border-color:var(--primary-light); background:var(--primary-lighter); transform:translateY(-1px); }
.persona-option:hover .persona-icon { color:var(--primary); }
.persona-option > input:focus-visible + .persona-card { outline:3px solid var(--primary-glow); outline-offset:2px; border-color:var(--primary); }
.persona-option > input:checked + .persona-card { border-color:var(--primary); background:var(--primary-lighter); box-shadow:0 0 0 1px var(--primary-glow); }
.persona-option > input:checked + .persona-card .persona-icon { background:var(--primary); color:#fff; transform:scale(1.03); }
.persona-option > input:checked + .persona-card .persona-check { border-color:var(--primary); background:var(--primary); color:#fff; transform:scale(1.04); }
.onboarding-continue { width:100%; min-height:54px; border-radius:13px; justify-content:center; gap:10px; font-size:14px; box-shadow:0 10px 24px var(--primary-glow); }
.onboarding-continue i { transition:transform .18s ease; }
.onboarding-continue:hover i { transform:translateX(3px); }
.modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:18px; }
.global-search-box { position:relative; }
.global-search-box > i { position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--text-tertiary); }
.global-search-box input { width:100%; min-height:50px; border:2px solid var(--border); border-radius:12px; padding:0 15px 0 42px; background:var(--surface-2); color:var(--text); outline:none; font:inherit; }
.global-search-box input:focus { border-color:var(--primary); }
.global-search-results { max-height:430px; overflow:auto; margin-top:10px; display:flex; flex-direction:column; gap:5px; }
.global-search-result { border:0; width:100%; border-radius:10px; padding:10px 11px; background:transparent; color:var(--text); display:flex; align-items:center; gap:10px; text-align:left; cursor:pointer; font:inherit; }
.global-search-result:hover { background:var(--surface-2); }
.global-search-result > i { width:30px; height:30px; border-radius:9px; display:grid; place-items:center; background:var(--primary-lighter); color:var(--primary); }
.global-search-result small { color:var(--text-tertiary); display:block; margin-top:2px; font-size:9px; }

/* Profile additions */
.profile-preferences-card { margin:0 0 18px; }
.profile-pref-help { font-size:10px; color:var(--text-tertiary); margin-top:3px; }
.profile-preferences-form { display:grid; grid-template-columns:1fr 1fr auto; gap:12px; align-items:end; }
.profile-save-pref { min-height:48px; white-space:nowrap; }

/* Small screens */
@media (max-width: 1100px) {
  .study-set-grid,.explore-grid,.video-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tool-layout { grid-template-columns:minmax(0,1fr); }
  .tool-history { max-height:none; }
  .rubric-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1023px) {
  .main-content { max-width:760px; }
  .workspace-shell { grid-template-columns:1fr; }
  .workspace-tools { border-right:0; border-bottom:1px solid var(--border); flex-direction:row; overflow-x:auto; padding:8px; scrollbar-width:none; }
  .workspace-tools::-webkit-scrollbar { display:none; }
  .workspace-tool { flex:none; }
  .workspace-mastery-card { grid-template-columns:90px 1fr; }
  .workspace-recommendation { grid-column:1/-1; }
}
@media (max-width: 700px) {
  .onboarding-modal { padding:24px 20px 26px; max-height:92vh; }
  .onboarding-brand { min-height:60px; margin-bottom:6px; }
  .onboarding-brand img { width:min(220px,74%); max-height:72px; }
  .onboarding-modal .onboarding-copy { margin-bottom:20px; }
  .onboarding-modal .onboarding-copy h2 { font-size:23px; }
  .persona-options { grid-template-columns:1fr; gap:9px; }
  .persona-card { min-height:78px; padding:12px 13px; grid-template-columns:40px minmax(0,1fr) 22px; gap:10px; }
  .persona-icon { width:40px; height:40px; border-radius:12px; }
  .auth-card-expanded { max-width:430px; padding:28px 20px; }
  .platform-page-head,.study-workspace-header { align-items:stretch; flex-direction:column; gap:13px; }
  .platform-page-head .platform-primary-action { width:100%; justify-content:center; }
  .study-workspace-header { position:relative; padding-left:48px; }
  .workspace-back { position:absolute; left:0; top:0; }
  .workspace-header-actions { flex-wrap:wrap; }
  .workspace-header-actions > * { flex:1; justify-content:center; }
  .source-launch-grid,.study-set-grid,.explore-grid,.video-grid,.home-study-sets { grid-template-columns:1fr; }
  .source-launch { min-height:105px; }
  .library-toolbar { align-items:flex-start; flex-direction:column; }
  .workspace-mastery-card { grid-template-columns:1fr; }
  .workspace-recommendation { grid-column:auto; }
  .workspace-content { padding:18px 13px 24px; }
  .workspace-shell { min-height:520px; }
  .workspace-tool { font-size:10px; min-height:38px; padding:0 9px; }
  .workspace-flashcard { height:320px; }
  .workspace-flashcard-face h3 { font-size:17px; }
  .quiz-generator-inline,.podcast-options,.form-grid-two,.form-grid-three,.profile-preferences-form,.grade-criteria-grid { grid-template-columns:1fr; }
  .tool-hero { align-items:center; }
  .tool-hero p { font-size:12px; }
  .grader-choice { grid-template-columns:1fr 1fr; }
  .rubric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .persona-options { grid-template-columns:1fr; }
  .podcast-player-card { align-items:flex-start; }
  .podcast-art { width:68px; height:68px; border-radius:17px; }
  .result-surface { padding:16px; }
}
@media (max-width: 430px) {
  .grader-choice { grid-template-columns:1fr; }
  .rubric-grid { grid-template-columns:1fr 1fr; }
  .workspace-flashcard { height:285px; }
  .source-type-tabs button { padding:0 10px; }
}

/* Forced temporary-password rotation */
.modal-password-security{max-width:460px;text-align:left;padding:30px}.security-modal-icon{width:58px;height:58px;margin:0 auto 16px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:var(--primary-lighter);color:var(--primary);font-size:24px}.modal-password-security .onboarding-copy{text-align:center;margin-bottom:22px}.modal-password-security .onboarding-copy h2{margin-bottom:7px}.modal-password-security .auth-error{min-height:20px;margin:2px 0 8px;color:var(--danger);font-size:13px;font-weight:600}

/* Study Set settings, sharing and invite surfaces */
.modal-intro{margin:-2px 0 18px;color:var(--text-secondary);font-size:13px;line-height:1.6}.modal-actions.split{display:flex;align-items:center;justify-content:space-between;gap:14px}.modal-actions.split>div{display:flex;gap:10px}.share-link-result{margin-top:17px;padding:15px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)}.share-link-result>label{display:block;margin-bottom:7px;font-size:12px;font-weight:700;color:var(--text-secondary)}.share-link-row{display:flex;gap:8px;align-items:center}.share-link-row input{min-width:0;flex:1;height:44px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);padding:0 12px;font:inherit;font-size:12px;outline:none}.share-link-row input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow)}.share-link-result small{display:block;margin-top:8px;color:var(--text-tertiary);font-size:10px}.shared-invite-modal{max-width:480px;text-align:center;padding:30px}.shared-invite-meta{margin:18px 0;padding:14px 15px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);text-align:left}.shared-invite-meta>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--border-light);font-size:12px}.shared-invite-meta>div:last-child{border-bottom:0}.shared-invite-meta span{color:var(--text-tertiary)}.shared-invite-meta strong{color:var(--text);text-align:right}.quiz-editor-card .tool-list-actions{flex-wrap:wrap}.quiz-editor-card .btn-small i{margin-right:4px}
@media(max-width:700px){.modal-actions.split{align-items:stretch;flex-direction:column-reverse}.modal-actions.split>div{display:grid;grid-template-columns:1fr 1fr}.modal-actions.split>.btn-secondary{width:100%}.share-link-row{align-items:stretch;flex-direction:column}.share-link-row .btn-secondary{width:100%}.shared-invite-modal{padding:24px 18px}}
.desktop-folder-row{display:flex;align-items:center;gap:3px}.desktop-folder-row .desktop-folder-item{min-width:0;flex:1}.desktop-folder-item em{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:normal;text-align:left}.desktop-folder-manage{width:30px;height:30px;flex:none;display:grid;place-items:center;border:0;border-radius:8px;background:transparent;color:var(--text-tertiary);cursor:pointer;transition:var(--transition)}.desktop-folder-manage:hover,.desktop-folder-manage:focus-visible{background:var(--surface-2);color:var(--text);outline:none}

/* ================================================================
   Professional AI content + Study Workspace polish (2026-08-27)
   ================================================================ */
.ai-rich-content { color:inherit; font-size:inherit; line-height:1.72; overflow-wrap:anywhere; }
.ai-rich-content > :first-child { margin-top:0 !important; }
.ai-rich-content > :last-child { margin-bottom:0 !important; }
.ai-rich-content p { margin:0 0 12px; }
.ai-rich-content h2,.ai-rich-content h3,.ai-rich-content h4 { color:var(--text); line-height:1.35; letter-spacing:-.01em; }
.ai-rich-content h2 { font-size:1.22em; margin:22px 0 10px; }
.ai-rich-content h3 { font-size:1.1em; margin:18px 0 8px; }
.ai-rich-content h4 { font-size:1.02em; margin:16px 0 7px; }
.ai-rich-content strong { color:var(--text); font-weight:750; }
.ai-rich-content em { color:inherit; }
.ai-rich-content ul,.ai-rich-content ol { margin:8px 0 14px; padding-left:24px; }
.ai-rich-content li { margin:5px 0; padding-left:2px; }
.ai-rich-content li::marker { color:var(--primary); font-weight:700; }
.ai-rich-content blockquote { margin:12px 0; padding:10px 14px; border-left:3px solid var(--primary); border-radius:0 10px 10px 0; background:var(--primary-lighter); color:var(--text-secondary); }
.ai-rich-content code { padding:2px 6px; border:1px solid var(--border); border-radius:6px; background:var(--surface); color:var(--primary-dark); font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.9em; }
.ai-rich-content pre { margin:14px 0; padding:14px 16px; overflow:auto; border:1px solid var(--border); border-radius:12px; background:#0f172a; color:#e2e8f0; }
.ai-rich-content pre code { padding:0; border:0; background:transparent; color:inherit; white-space:pre; }
.ai-rich-content hr { height:1px; border:0; background:var(--border); margin:20px 0; }
.ai-table-wrap { width:100%; overflow-x:auto; margin:14px 0 18px; border:1px solid var(--border); border-radius:12px; background:var(--surface); }
.ai-table { width:100%; min-width:560px; border-collapse:collapse; font-size:.94em; }
.ai-table th { padding:10px 12px; text-align:left; color:var(--text); font-weight:750; background:var(--surface-2); border-bottom:1px solid var(--border); }
.ai-table td { padding:10px 12px; vertical-align:top; color:var(--text-secondary); border-bottom:1px solid var(--border-light); }
.ai-table tr:last-child td { border-bottom:0; }
.ai-table tbody tr:hover { background:color-mix(in srgb,var(--primary) 4%, transparent); }

.chat-msg.ai { max-width:min(92%,900px); padding:18px 20px; line-height:1.72; }
.chat-msg.ai .ai-rich-content { font-size:14px; }
.set-chat-message.assistant { max-width:min(88%,880px); padding:16px 18px; font-size:13px; line-height:1.72; box-shadow:0 1px 2px rgba(15,23,42,.03); }
.set-chat-message.assistant .ai-rich-content { color:var(--text-secondary); }
.set-chat-message.thinking { display:inline-flex; align-items:center; gap:8px; width:auto; }

/* Source type tabs: icon and copy should never visually collide. */
.source-type-tabs { gap:8px; }
.source-type-tabs button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:0 14px; border-radius:11px; }
.source-type-tabs button i { width:15px; flex:0 0 15px; text-align:center; font-size:12px; }
.source-type-tabs button.active { box-shadow:0 0 0 3px var(--primary-glow); }

/* Study Set metadata: readable separation instead of icon/text collisions. */
.workspace-meta { display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; margin-top:7px; line-height:1.4; }
.workspace-meta span { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.workspace-meta i { width:14px; text-align:center; color:var(--text-tertiary); }

/* AI tutor quick actions. */
.set-chat-suggestions { display:flex; flex-wrap:wrap; gap:8px; overflow:visible; margin:0 0 16px; padding:1px 0; }
.set-chat-suggestions button { min-height:38px; padding:0 13px; border:1px solid var(--border); border-radius:999px; background:var(--surface); color:var(--text-secondary); display:inline-flex; align-items:center; justify-content:center; gap:7px; font:inherit; font-size:11px; font-weight:700; cursor:pointer; transition:var(--transition); box-shadow:0 1px 2px rgba(15,23,42,.03); }
.set-chat-suggestions button i { color:var(--primary); font-size:11px; }
.set-chat-suggestions button:hover { color:var(--primary); border-color:var(--primary-light); background:var(--primary-lighter); transform:translateY(-1px); box-shadow:var(--shadow); }
.set-chat-suggestions button:active { transform:translateY(0); }
.set-chat-suggestions button:focus-visible { outline:none; box-shadow:0 0 0 3px var(--primary-glow); border-color:var(--primary); }

/* Tutor composer: large, readable, keyboard-friendly and sticky. */
.set-chat-compose { display:flex; align-items:flex-end; gap:10px; position:sticky; bottom:0; z-index:4; margin-top:4px; padding:12px; border:1px solid var(--border); border-radius:16px; background:color-mix(in srgb,var(--surface) 94%, transparent); backdrop-filter:blur(12px); box-shadow:0 -8px 22px rgba(15,23,42,.04); }
.set-chat-compose textarea { flex:1; width:100%; min-height:48px; max-height:160px; resize:vertical; border:1.5px solid transparent; border-radius:12px; padding:13px 14px; background:var(--surface-2); color:var(--text); outline:none; font:inherit; font-size:13px; line-height:1.55; transition:var(--transition); }
.set-chat-compose textarea::placeholder { color:var(--text-tertiary); }
.set-chat-compose textarea:focus { border-color:var(--primary); background:var(--surface); box-shadow:0 0 0 3px var(--primary-glow); }
.set-chat-compose button { width:48px; height:48px; flex:none; border:0; border-radius:13px; display:grid; place-items:center; background:linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff; font-size:15px; cursor:pointer; box-shadow:0 7px 18px rgba(37,99,235,.22); transition:var(--transition); }
.set-chat-compose button:hover { transform:translateY(-1px); box-shadow:0 10px 22px rgba(37,99,235,.28); }
.set-chat-compose button:disabled { opacity:.55; cursor:not-allowed; transform:none; box-shadow:none; }
.set-chat-compose button:focus-visible { outline:none; box-shadow:0 0 0 4px var(--primary-glow),0 7px 18px rgba(37,99,235,.22); }

/* Fill-in-the-blanks answer controls. */
.fill-test-form { gap:18px; }
.fill-question { display:grid; grid-template-columns:38px minmax(0,1fr); align-items:start; gap:14px; padding:18px 20px; }
.fill-question-number { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:var(--primary-lighter); color:var(--primary); font-size:12px; font-weight:800; }
.fill-question-body { min-width:0; }
.fill-question-body h3 { margin:1px 0 14px; font-size:14px; line-height:1.55; }
.fill-answer-field { position:relative; max-width:650px; }
.fill-answer-field > i { position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--text-tertiary); font-size:11px; pointer-events:none; }
.fill-answer-field input { width:100%; min-height:46px; border:1.5px solid var(--border); border-radius:11px; padding:0 14px 0 38px; background:var(--surface-2); color:var(--text); outline:none; font:inherit; font-size:12px; transition:var(--transition); }
.fill-answer-field input::placeholder { color:var(--text-tertiary); }
.fill-answer-field input:hover { border-color:var(--primary-light); }
.fill-answer-field input:focus { border-color:var(--primary); background:var(--surface); box-shadow:0 0 0 3px var(--primary-glow); }

/* Written response/result readability. */
.written-question { padding:19px 20px; }
.written-question h3 { margin-bottom:14px; }
.written-question .platform-textarea { min-height:150px; }
.written-feedback { padding:16px 17px; font-size:12px; }
.written-feedback-copy,.written-ideal-answer { margin-top:9px; }
.written-feedback details { margin-top:12px; border-top:1px solid var(--border-light); padding-top:10px; }
.written-feedback summary { cursor:pointer; color:var(--primary); font-weight:700; }
.result-explanation { margin-top:8px; }

/* Simple generator prompts. */
.simple-prompt-field { margin-bottom:14px; }
.simple-prompt-field > label { margin-bottom:7px; }
.select-shell { position:relative; }
.select-shell .platform-select { appearance:none; padding-right:42px; }
.select-shell > i { position:absolute; right:15px; top:50%; transform:translateY(-50%); color:var(--text-tertiary); pointer-events:none; font-size:11px; }
#simplePromptModal .modal { max-width:520px; }
#simplePromptModal .modal-actions { padding-top:3px; }

@media (max-width:700px) {
  .set-chat-message.assistant,.chat-msg.ai { max-width:96%; }
  .set-chat-suggestions { flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; }
  .fill-question { grid-template-columns:1fr; gap:9px; padding:16px; }
  .fill-question-number { width:30px; height:30px; }
  .workspace-meta { gap:7px 12px; }
}

.ai-note-summary .ai-rich-content { font-size:11px; line-height:1.55; }
.ai-note-summary .ai-rich-content p { margin-bottom:6px; }
.quiz-result-explanation { margin-top:8px; color:var(--text-secondary); }
.quiz-result-explanation .ai-rich-content { font-size:12px; line-height:1.6; }
.grade-summary-rich { margin-top:6px; color:var(--text-secondary); }
.grade-summary-rich .ai-rich-content { font-size:12px; }
.grade-criterion-comment { margin-top:7px; color:var(--text-secondary); }
.grade-criterion-comment .ai-rich-content { font-size:10px; line-height:1.5; }
.grade-feedback-section .ai-rich-content { font-size:11px; line-height:1.6; }
.grade-feedback-section li > .ai-rich-content { display:inline; }
.grade-feedback-section li > .ai-rich-content p { display:inline; margin:0; }


/* ================================================================
   Professional navigation, forms, modals and spacing polish (2026-08-29)
   ================================================================ */
/* Header search: one clean icon-only affordance; keyboard shortcut stays in the title. */
.header-search-btn{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid transparent;border-radius:12px;font-size:16px;position:relative}
.header-search-btn:hover{border-color:var(--border);background:var(--surface-2);box-shadow:var(--shadow)}
.header-search-btn:focus-visible{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow)}

/* Consistent breathing room for platform forms without disturbing auth forms. */
.platform-page form>.input-group,.modal-overlay form>.input-group,.source-panel form>.input-group{margin-bottom:16px}
.platform-page form>.form-grid-two,.platform-page form>.form-grid-three,.modal-overlay form>.form-grid-two,.modal-overlay form>.form-grid-three,.source-panel form>.form-grid-two,.source-panel form>.form-grid-three{margin-bottom:16px}
.form-grid-two .input-group,.form-grid-three .input-group{margin-bottom:0}
.platform-page .input-group input,.modal-overlay .input-group input{min-height:48px}
.platform-page .input-group label,.modal-overlay .input-group label{margin-bottom:8px}
.tool-card form>.solve-dropzone,.tool-card form>.source-upload-zone{margin-bottom:16px}
.selected-file:not(:empty){margin:0 0 14px;padding:9px 11px;border-radius:9px;background:var(--surface-2);color:var(--text-secondary);font-size:11px}
.field-optional{color:var(--text-tertiary);font-weight:500;font-size:.9em}

/* Flashcard navigation: responsive, balanced, and buttons disappear at boundaries. */
.set-card-nav{display:grid;grid-template-columns:minmax(112px,1fr) auto minmax(112px,1fr);align-items:center;width:min(100%,650px);gap:14px;margin:0 auto 14px;color:var(--text-tertiary)}
.set-card-nav-spacer{display:block;min-width:112px;height:44px}
.set-card-counter{justify-self:center;padding:6px 11px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border-light);font-size:11px;font-weight:750;color:var(--text-tertiary);font-variant-numeric:tabular-nums}
.set-card-nav-btn{min-width:112px;height:44px;padding:0 15px;border-radius:11px;border:1px solid var(--border);display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:12px;font-weight:750;cursor:pointer;transition:var(--transition)}
.set-card-nav-btn.previous{justify-self:start;background:var(--surface);color:var(--text-secondary);box-shadow:var(--shadow)}
.set-card-nav-btn.next{justify-self:end;background:linear-gradient(135deg,var(--primary),var(--primary-dark));border-color:transparent;color:#fff;box-shadow:0 7px 18px rgba(37,99,235,.22)}
.set-card-nav-btn:hover{transform:translateY(-1px)}
.set-card-nav-btn.previous:hover{color:var(--primary);border-color:var(--primary-light);background:var(--primary-lighter)}
.set-card-nav-btn.next:hover{box-shadow:0 10px 24px rgba(37,99,235,.3)}
.set-card-nav-btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--primary-glow),var(--shadow-md)}

/* Tutor Lesson generation expectation: honest without blocking the workflow. */
.generation-advisory{max-width:650px;margin:18px auto;display:flex;align-items:flex-start;gap:11px;padding:13px 15px;border:1px solid #bfdbfe;border-radius:13px;background:#eff6ff;color:#475569;text-align:left;font-size:11px;line-height:1.55}
.generation-advisory>i{margin-top:2px;color:var(--primary);font-size:13px}
.generation-advisory strong{color:var(--text);font-weight:750}
.generation-advisory.compact{margin:4px 0 2px;max-width:none;padding:11px 13px}
[data-theme="dark"] .generation-advisory{background:var(--primary-lighter);border-color:rgba(96,165,250,.25);color:var(--text-secondary)}

/* Quiz generator now lives in a real modal. */
.quiz-generator-modal{max-width:520px}
.quiz-generator-modal .modal-intro{margin-bottom:20px}
.quiz-generator-modal .modal-actions{margin-top:20px}
.quiz-generator-modal .modal-actions .btn-primary,.quiz-generator-modal .modal-actions .btn-secondary{min-width:135px}

/* Quiz choices: the option letter and copy are deliberately separated. */
.set-quiz-options label{align-items:center;padding:12px 14px;gap:11px;transition:var(--transition)}
.set-quiz-options label>input{flex:0 0 auto;margin:0}
.quiz-option-copy{display:flex;align-items:flex-start;gap:11px;min-width:0;line-height:1.5}
.quiz-option-letter{width:27px;height:27px;flex:0 0 27px;display:grid;place-items:center;border:1px solid var(--border);border-radius:8px;background:var(--surface-2);color:var(--primary);font-size:11px;font-weight:800}
.quiz-option-text{min-width:0;padding-top:3px;color:var(--text-secondary)}
.set-quiz-options label:has(input:checked){border-color:var(--primary);background:var(--primary-lighter);box-shadow:0 0 0 2px var(--primary-glow)}
.set-quiz-options label:has(input:checked) .quiz-option-letter{background:var(--primary);border-color:var(--primary);color:#fff}

/* Podcast metadata: title-case style and visually separate metadata tokens. */
.podcast-player-copy{display:flex;flex-direction:column;gap:7px}
.podcast-player-copy>strong{font-size:15px;color:var(--text);text-transform:none}
.podcast-meta{display:flex;align-items:center;flex-wrap:wrap;gap:7px;color:var(--text-secondary);font-size:11px}
.podcast-meta-separator{color:var(--text-tertiary);font-weight:800}

/* Explore subjects: touch scrolling plus accessible desktop arrows. */
.explore-subject-nav{display:grid;grid-template-columns:40px minmax(0,1fr) 40px;gap:8px;align-items:center}
.explore-subjects{scroll-behavior:smooth;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:3px 1px 5px}
.explore-subjects .subject-chip{scroll-snap-align:start}
.explore-subject-arrow{width:40px;height:40px;border:1px solid var(--border);border-radius:11px;background:var(--surface);color:var(--text-secondary);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow);transition:var(--transition)}
.explore-subject-arrow:hover{color:var(--primary);border-color:var(--primary-light);background:var(--primary-lighter);transform:translateY(-1px)}
.explore-subject-arrow:focus-visible{outline:none;box-shadow:0 0 0 3px var(--primary-glow)}

/* Invite/share metadata was previously visually concatenated. */
.shared-invite-meta{display:flex;flex-direction:column;gap:0;padding:10px 16px}
.shared-invite-meta>div{min-height:46px;padding:10px 0;gap:18px}
.shared-invite-meta span{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.shared-invite-meta span i{width:18px;text-align:center;color:var(--primary)}
.shared-invite-meta strong{line-height:1.4}

/* Keep stacked result/cards visibly separated throughout the platform. */
.platform-page>.tool-card+.tool-card,.platform-page>.result-surface+.platform-section,.platform-page>.tool-layout+.result-surface{margin-top:22px}
.history-grid,.tool-list,.quiz-editor-list,.result-review-list{row-gap:12px}

@media(max-width:700px){
  .set-card-nav{grid-template-columns:minmax(94px,1fr) auto minmax(94px,1fr);gap:8px}
  .set-card-nav-btn{min-width:94px;height:42px;padding:0 12px;font-size:11px}
  .set-card-nav-spacer{min-width:94px;height:42px}
  .set-card-counter{font-size:10px;padding:5px 8px}
  .explore-subject-nav{grid-template-columns:minmax(0,1fr)}
  .explore-subject-arrow{display:none}
  .explore-subjects{touch-action:pan-x;-webkit-overflow-scrolling:touch}
  .quiz-generator-modal .modal-actions{display:grid;grid-template-columns:1fr 1fr}
  .quiz-generator-modal .modal-actions .btn-primary,.quiz-generator-modal .modal-actions .btn-secondary{min-width:0;width:100%}
}


.platform-generation-loading{min-height:300px;flex-direction:column;text-align:center;gap:16px}
.generation-spinner{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--primary-lighter);color:var(--primary);font-size:19px}
.platform-generation-loading>div{display:flex;flex-direction:column;gap:7px;max-width:560px}
.platform-generation-loading strong{color:var(--text);font-size:17px}
.platform-generation-loading span{color:var(--text-secondary);font-size:12px;line-height:1.6}
.explore-subject-arrow:disabled,.explore-subject-arrow.inactive{opacity:.35;cursor:default;transform:none;box-shadow:none;background:var(--surface-2);color:var(--text-tertiary);border-color:var(--border-light)}
.shared-invite-modal .onboarding-copy{margin-bottom:8px}
.shared-invite-modal .onboarding-copy p{margin-top:8px;line-height:1.6}
.shared-invite-modal .modal-actions{margin-top:20px;gap:12px}
.profile-menu a.profile-menu-item{text-decoration:none}

/* =========================================================
   Explore public Study Sets + paginated Tutor history
   ========================================================= */
.explore-grid {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  align-items: stretch;
}
.explore-card {
  display: flex;
  flex-direction: column;
  min-height: 410px;
  border-radius: 22px;
  border-color: color-mix(in srgb, var(--border) 84%, var(--primary) 16%);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .07);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.explore-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--primary) 28%, var(--border));
  box-shadow: 0 18px 42px rgba(15, 23, 42, .12);
}
.explore-card-cover {
  height: 164px;
  isolation: isolate;
  background:
    radial-gradient(circle at 16% 18%, rgba(255,255,255,.28), transparent 34%),
    linear-gradient(135deg, var(--set-color, #2563eb), #6d28d9 88%);
}
.explore-card-cover-glow {
  position: absolute;
  inset: auto -28px -58px auto;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: rgba(255,255,255,.13);
  filter: blur(2px);
  z-index: -1;
}
.explore-card-subject-icon {
  width: 64px;
  height: 64px;
  border-radius: 20px;
  display: grid;
  place-items: center;
  font-size: 25px;
  color: #fff;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: 0 12px 28px rgba(15,23,42,.16);
  backdrop-filter: blur(8px);
}
.explore-card-public-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
  color: #fff;
  background: rgba(15,23,42,.28);
  border: 1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(8px);
}
.explore-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 19px;
}
.explore-card-subject {
  display: inline-block;
  margin-bottom: 5px;
  color: var(--primary);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.explore-card-body h3 {
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: -.015em;
}
.explore-card-body p {
  min-height: 0;
  margin: 0 0 16px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.65;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.explore-card-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-bottom: 17px;
}
.explore-card-stats > span {
  min-width: 0;
  padding: 9px 7px;
  border: 1px solid var(--border-light);
  border-radius: 11px;
  background: var(--surface-2);
  color: var(--text-tertiary);
  font-size: 9px;
  line-height: 1.35;
  text-align: center;
}
.explore-card-stats i {
  display: block;
  margin-bottom: 5px;
  color: var(--primary);
  font-size: 12px;
}
.explore-card-stats strong {
  color: var(--text);
  font-size: 11px;
}
.explore-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 15px;
  border-top: 1px solid var(--border-light);
}
.explore-card-author {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}
.explore-author-avatar {
  width: 34px;
  height: 34px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--primary);
  background: var(--primary-lighter);
  font-size: 12px;
}
.explore-card-author > span:last-child {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.explore-card-author small {
  color: var(--text-tertiary);
  font-size: 8px;
}
.explore-card-author strong {
  max-width: 125px;
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.explore-add-set {
  flex: none;
  min-height: 38px;
  padding-inline: 13px;
  white-space: nowrap;
}

.set-chat-messages,
.chat-messages {
  overflow-anchor: none;
}
.set-chat-messages.loading-older,
.chat-messages.loading-older {
  scroll-behavior: auto;
}
.set-chat-history-status {
  min-height: 0;
  color: var(--text-tertiary);
  font-size: 10px;
  text-align: center;
}

@media (max-width: 640px) {
  .explore-grid { grid-template-columns: 1fr; }
  .explore-card { min-height: 0; }
  .explore-card-cover { height: 145px; }
  .explore-card-footer { align-items: stretch; flex-direction: column; }
  .explore-card-author strong { max-width: 220px; }
  .explore-add-set { width: 100%; justify-content: center; }
}

/* Podcast browser speech playback state */
.podcast-browser-playback {
  min-width: 172px;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease, transform .15s ease;
}
.podcast-browser-playback.is-playing {
  background: linear-gradient(135deg, #ef4444, #dc2626);
  border-color: #dc2626;
  color: #fff;
  box-shadow: 0 8px 22px rgba(220, 38, 38, .24);
}
.podcast-browser-playback.is-playing:hover {
  background: linear-gradient(135deg, #dc2626, #b91c1c);
  border-color: #b91c1c;
  color: #fff;
  box-shadow: 0 10px 26px rgba(185, 28, 28, .3);
}
.podcast-browser-playback.is-playing:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px rgba(239, 68, 68, .18), 0 8px 22px rgba(220, 38, 38, .24);
}
@media (max-width: 640px) {
  .podcast-actions .podcast-browser-playback { width: 100%; }
}

/* Professional lecture recorder + browser/Vosk speech-to-text */
.modal-source { max-width:720px; }
.recording-panel-pro {
  padding:24px;
  border:1px solid var(--border);
  border-radius:20px;
  background:linear-gradient(180deg,var(--surface),var(--surface-2));
  text-align:left;
  box-shadow:0 16px 45px rgba(15,23,42,.06);
}
.recording-hero { display:flex; align-items:center; gap:16px; margin-bottom:20px; }
.recording-hero-copy { min-width:0; flex:1; }
.recording-hero-copy h3 { margin:3px 0 5px; color:var(--text); font-size:20px; line-height:1.2; }
.recording-hero-copy p { margin:0; color:var(--text-secondary); font-size:12px; line-height:1.55; }
.recording-visual {
  position:relative;
  width:72px;
  height:72px;
  margin:0;
  flex:none;
  border-radius:22px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#fee2e2,#fff1f2);
  color:#dc2626;
  font-size:25px;
  box-shadow:inset 0 0 0 1px rgba(239,68,68,.08);
}
.recording-visual .record-dot { position:absolute; top:11px; right:11px; width:10px; height:10px; animation:none; }
.recording-visual.is-recording .record-dot { animation:recordPulse 1.35s infinite; }
.recording-visual.is-recording { box-shadow:0 0 0 7px rgba(239,68,68,.08), inset 0 0 0 1px rgba(239,68,68,.12); }
@keyframes recordPulse { 0%,100%{box-shadow:0 0 0 6px rgba(239,68,68,.10);transform:scale(1)} 50%{box-shadow:0 0 0 12px rgba(239,68,68,0);transform:scale(1.08)} }
.recording-config-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(210px,.8fr); gap:14px; margin-bottom:15px; }
.recording-field { margin-bottom:0!important; }
.recording-engine-card {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:15px;
  padding:13px 14px;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--surface);
}
.recording-engine-icon { width:38px; height:38px; flex:none; display:grid; place-items:center; border-radius:11px; background:var(--primary-lighter); color:var(--primary); }
.recording-engine-card > div { min-width:0; flex:1; }
.recording-engine-card strong { display:block; color:var(--text); font-size:12px; margin-bottom:2px; }
.recording-engine-card div > span { display:block; color:var(--text-tertiary); font-size:10px; line-height:1.45; }
.recording-engine-badge { flex:none; padding:5px 9px; border-radius:999px; background:#eff6ff; color:#2563eb; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.recording-engine-badge[data-engine="vosk"] { background:#ecfdf5; color:#047857; }
.recording-engine-badge[data-engine="browser"] { background:#eef2ff; color:#4338ca; }
.recording-engine-badge[data-engine="openai"] { background:#f0fdf4; color:#15803d; }
.recording-engine-badge[data-engine="unavailable"] { background:#fef2f2; color:#b91c1c; }
.recording-stage { padding:16px; border:1px solid var(--border); border-radius:16px; background:var(--surface); transition:border-color .2s ease,box-shadow .2s ease; }
.recording-stage.is-recording { border-color:rgba(239,68,68,.28); box-shadow:0 0 0 4px rgba(239,68,68,.06); }
.recording-stage-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.recording-state-pill { display:inline-flex; align-items:center; gap:7px; padding:6px 9px; border-radius:999px; background:var(--surface-2); color:var(--text-secondary); font-size:10px; font-weight:700; }
.recording-state-pill > i { font-size:7px; color:var(--text-tertiary); }
.recording-state-pill.success { background:#ecfdf5; color:#047857; }
.recording-state-pill.success > i { color:#10b981; }
.recording-state-pill.warning { background:#fffbeb; color:#b45309; }
.recording-state-pill.warning > i { color:#f59e0b; }
.recording-state-pill.error { background:#fef2f2; color:#b91c1c; }
.recording-state-pill.error > i { color:#ef4444; }
.recording-panel-pro .record-timer { font-size:26px; letter-spacing:.02em; }
.recording-wave { height:34px; margin:15px 0 5px; display:flex; align-items:center; justify-content:center; gap:4px; opacity:.35; }
.recording-wave span { width:4px; height:8px; border-radius:999px; background:linear-gradient(180deg,#2563eb,#7c3aed); transform-origin:center; }
.recording-stage.is-recording .recording-wave { opacity:1; }
.recording-stage.is-recording .recording-wave span { animation:waveBar 1s ease-in-out infinite; }
.recording-wave span:nth-child(2),.recording-wave span:nth-child(8){animation-delay:.08s!important}.recording-wave span:nth-child(3),.recording-wave span:nth-child(7){animation-delay:.16s!important}.recording-wave span:nth-child(4),.recording-wave span:nth-child(6){animation-delay:.24s!important}.recording-wave span:nth-child(5){animation-delay:.32s!important}
@keyframes waveBar { 0%,100%{height:8px} 50%{height:28px} }
.recording-transcript { margin-top:12px; overflow:hidden; border:1px solid var(--border-light); border-radius:13px; background:var(--surface-2); }
.recording-transcript-head { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 11px; border-bottom:1px solid var(--border-light); color:var(--text-secondary); font-size:10px; font-weight:700; }
.recording-transcript-head span { display:inline-flex; align-items:center; gap:7px; }
.recording-transcript-head i { color:var(--primary); }
.recording-transcript-head small { color:var(--text-tertiary); font-size:9px; font-weight:600; }
.recording-transcript-body { min-height:74px; max-height:155px; overflow-y:auto; padding:12px 13px 5px; color:var(--text-secondary); font-size:11px; line-height:1.65; white-space:pre-wrap; }
.recording-transcript-placeholder { color:var(--text-tertiary); }
.recording-transcript-interim { min-height:28px; padding:4px 13px 11px; color:var(--primary); font-size:10px; font-style:italic; line-height:1.5; opacity:0; }
.recording-transcript-interim.active { opacity:1; }
.recording-panel-pro .record-actions { margin-top:16px; }
.recording-start-btn,.recording-stop-btn { min-width:190px; min-height:48px; display:inline-flex; align-items:center; justify-content:center; gap:9px; border-radius:12px; font:inherit; font-size:12px; font-weight:800; cursor:pointer; transition:transform .15s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease; }
.recording-stop-btn { border:1px solid #dc2626; background:linear-gradient(135deg,#ef4444,#dc2626); color:#fff; box-shadow:0 8px 20px rgba(220,38,38,.20); }
.recording-stop-btn:hover { background:linear-gradient(135deg,#dc2626,#b91c1c); border-color:#b91c1c; box-shadow:0 10px 24px rgba(185,28,28,.26); transform:translateY(-1px); }
.recording-stop-btn:disabled,.recording-start-btn:disabled { opacity:.55; cursor:not-allowed; transform:none; }
.recording-status { display:flex; align-items:flex-start; gap:8px; margin-top:13px; padding:10px 11px; border-radius:11px; background:var(--surface-2); color:var(--text-tertiary); font-size:10px; line-height:1.5; }
.recording-status > i { margin-top:2px; color:var(--primary); }
.recording-status.success { background:#ecfdf5; color:#047857; }.recording-status.success>i{color:#10b981}
.recording-status.warning { background:#fffbeb; color:#92400e; }.recording-status.warning>i{color:#f59e0b}
.recording-status.error { background:#fef2f2; color:#991b1b; }.recording-status.error>i{color:#ef4444}
.source-type-tabs button[aria-disabled="true"] { opacity:.45; cursor:not-allowed; }

@media (max-width:640px){
  .recording-panel-pro{padding:18px}
  .recording-hero{align-items:flex-start}
  .recording-visual{width:60px;height:60px;border-radius:18px;font-size:21px}
  .recording-config-grid{grid-template-columns:1fr}
  .recording-engine-card{align-items:flex-start;flex-wrap:wrap}
  .recording-engine-badge{margin-left:50px}
  .recording-stage-top{align-items:center}
  .recording-panel-pro .record-actions{flex-direction:column}
  .recording-start-btn,.recording-stop-btn{width:100%}
}


/* ================================================================
   Mobile workspace ergonomics (2026-08-29)
   Safari/iOS fixes for Study Set actions and horizontal tool tabs.
   ================================================================ */
@media (max-width: 980px) {
  .workspace-shell {
    grid-template-rows: auto minmax(0, 1fr);
    align-content: start;
  }
  .workspace-tools {
    align-self: start;
    align-items: center;
    min-height: 0;
    max-height: 58px;
  }
  .workspace-tool {
    align-self: center;
    height: 42px;
    min-height: 42px;
    max-height: 42px;
    white-space: nowrap;
  }
}

@media (max-width: 700px) {
  /* Three compact actions + one full-width primary action. */
  .workspace-header-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    width: 100%;
  }
  .workspace-header-actions > * {
    width: 100%;
    min-width: 0;
    flex: none;
  }
  .workspace-header-actions .icon-text-btn {
    min-height: 52px;
    padding: 0 8px;
    border-radius: 13px;
    gap: 7px;
    justify-content: center;
    white-space: nowrap;
    font-size: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .03);
  }
  .workspace-header-actions .icon-text-btn i {
    flex: 0 0 auto;
    font-size: 13px;
  }
  #workspaceGenerateKit {
    grid-column: 1 / -1;
    min-height: 54px;
    border-radius: 13px;
    font-size: 14px;
    justify-content: center;
    box-shadow: 0 9px 22px rgba(37, 99, 235, .22);
  }

  /* Safari must not stretch this first grid row to fill workspace min-height. */
  .workspace-shell {
    min-height: 0;
    grid-template-rows: 55px auto;
  }
  .workspace-tools {
    width: 100%;
    height: 55px;
    max-height: 55px;
    padding: 7px 8px;
    gap: 5px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }
  .workspace-tool {
    flex: 0 0 auto;
    width: auto;
    height: 40px;
    min-height: 40px;
    max-height: 40px;
    padding: 0 11px;
    border-radius: 10px;
    scroll-snap-align: start;
    line-height: 1;
  }
  .workspace-tool i {
    flex: 0 0 15px;
  }
}

@media (max-width: 370px) {
  .workspace-header-actions .icon-text-btn {
    font-size: 11px;
    padding-inline: 6px;
    gap: 5px;
  }
}

/* ==========================================================================
   Podcast player — mobile layout hardening
   Keep artwork/metadata readable and move controls to their own row so action
   buttons can never overlap Conversation / Target / status text on iOS Safari.
   ========================================================================== */
@media (max-width: 640px) {
  .podcast-player-card {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    grid-template-areas:
      "art copy"
      "actions actions";
    align-items: center;
    column-gap: 16px;
    row-gap: 18px;
    padding: 18px;
    overflow: hidden;
  }

  .podcast-player-card .podcast-art {
    grid-area: art;
    width: 68px;
    height: 68px;
    margin: 0;
    align-self: center;
  }

  .podcast-player-card .podcast-player-copy {
    grid-area: copy;
    min-width: 0;
    width: 100%;
    padding: 0;
    overflow: visible;
  }

  .podcast-player-card .podcast-player-copy > strong {
    display: block;
    margin: 0;
    font-size: 16px;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }

  .podcast-player-card .podcast-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 8px;
    margin-top: 3px;
    font-size: 11px;
    line-height: 1.45;
    overflow-wrap: anywhere;
  }

  .podcast-player-card .podcast-actions {
    grid-area: actions;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    margin: 0;
    min-width: 0;
  }

  .podcast-player-card .podcast-actions > button {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    margin: 0;
    justify-content: center;
    white-space: normal;
    line-height: 1.25;
    padding: 11px 12px;
  }

  .podcast-player-card > audio {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 100%;
    margin-top: 2px;
  }
}

@media (max-width: 430px) {
  .podcast-player-card {
    grid-template-columns: 60px minmax(0, 1fr);
    column-gap: 13px;
    row-gap: 14px;
    padding: 16px;
  }

  .podcast-player-card .podcast-art {
    width: 60px;
    height: 60px;
    border-radius: 16px;
    font-size: 24px;
  }

  .podcast-player-card .podcast-actions {
    grid-template-columns: 1fr;
  }

  .podcast-player-card .podcast-actions > button {
    min-height: 46px;
  }
}

/* 2026-08-30 dark-mode navigation/readability polish */
@media (min-width:1024px){
  .desktop-nav-item{border:1px solid transparent;position:relative;}
  [data-theme="dark"] .desktop-nav-item:hover{background:rgba(148,163,184,.08);color:#f8fafc;}
  [data-theme="dark"] .desktop-nav-item.active{background:rgba(255,255,255,.065);color:#f8fafc;border-color:rgba(148,163,184,.16);box-shadow:inset 3px 0 0 #3b82f6,0 1px 0 rgba(255,255,255,.025);}
  [data-theme="dark"] .desktop-nav-item.active i{color:#60a5fa;}
}
.history-item{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;align-items:center;text-align:left;width:100%;}
.history-item>i{width:34px;height:34px;border-radius:10px;background:var(--primary-lighter);color:var(--primary);display:grid;place-items:center;font-size:13px;}
[data-theme="dark"] .history-item>i{background:rgba(59,130,246,.14);color:#60a5fa;}

/* Learning Video library + detail experience (2026-09-01) */
.explore-video-section{margin-top:18px}
.explore-video-header{align-items:flex-end;margin-bottom:12px}
.section-subtitle{margin:5px 0 0;color:var(--text-secondary);font-size:13px;line-height:1.5}
.explore-video-searchbar{display:grid;grid-template-columns:1fr;align-items:start;gap:8px;margin:0 0 14px;width:100%}
.explore-video-search-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.explore-video-search-control{position:relative;display:flex;align-items:center;width:100%;min-width:0}
.explore-video-search-control>i{position:absolute;left:16px;z-index:1;color:var(--text-tertiary);font-size:14px;pointer-events:none;transition:var(--transition)}
.explore-video-search-control input{width:100%;min-width:0;height:50px;padding:0 48px 0 43px;border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--text);font:inherit;font-size:14px;outline:none;box-shadow:0 1px 2px rgba(15,23,42,.03);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.explore-video-search-control input::placeholder{color:var(--text-tertiary)}
.explore-video-search-control input::-webkit-search-cancel-button{display:none}
.explore-video-search-control:focus-within>i{color:var(--primary)}
.explore-video-search-control input:focus{border-color:var(--primary-light);box-shadow:0 0 0 3px var(--primary-glow),0 4px 16px rgba(15,23,42,.04)}
.explore-video-search-clear{position:absolute;right:8px;display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:9px;background:transparent;color:var(--text-tertiary);cursor:pointer;transition:var(--transition)}
.explore-video-search-clear:hover{background:var(--surface-2);color:var(--text)}
.explore-video-search-clear:focus-visible{outline:none;box-shadow:0 0 0 3px var(--primary-glow)}
.explore-video-search-status{min-width:0;color:var(--text-tertiary);font-size:12px;line-height:1.45}
.explore-video-section[aria-busy="true"] .explore-video-grid{opacity:.58;transition:opacity .15s ease}
.explore-video-section .explore-subject-nav{margin:0 0 20px}
.explore-video-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px}
.explore-video-grid .learning-video-card{border:0;background:transparent;border-radius:14px;box-shadow:none;overflow:visible;min-width:0}
.learning-video-card-link{display:block;width:100%;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;border-radius:14px}
.learning-video-card-link:focus-visible{outline:none;box-shadow:0 0 0 3px var(--primary-glow)}
.explore-video-grid .video-thumb{display:block;position:relative;width:100%;height:auto;aspect-ratio:16/9;border-radius:13px;overflow:hidden;background:var(--surface-2);box-shadow:0 1px 2px rgba(15,23,42,.06)}
.explore-video-grid .video-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .22s ease}
.video-thumb-placeholder{display:grid;width:100%;height:100%;place-items:center;font-size:28px;color:var(--text-tertiary)}
.explore-video-grid .video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;width:46px;height:46px;place-items:center;border-radius:50%;background:rgba(15,23,42,.76);color:#fff;font-size:15px;box-shadow:0 7px 24px rgba(15,23,42,.22);transition:transform .2s ease,background .2s ease}
.explore-video-grid .video-duration{position:absolute;right:9px;bottom:8px;padding:4px 7px;border-radius:6px;background:rgba(15,23,42,.84);color:#fff;font-size:11px;font-weight:700;letter-spacing:.01em}
.learning-video-card-copy{display:block;padding:10px 1px 0}
.learning-video-card-copy strong{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;color:var(--text);font-size:14px;line-height:1.35;font-weight:750}
.learning-video-card-copy small{display:block;margin-top:5px;color:var(--text-secondary);font-size:12px}
@media(hover:hover) and (pointer:fine){.learning-video-card-link:hover .video-thumb img{transform:scale(1.025)}.learning-video-card-link:hover .video-play{transform:translate(-50%,-50%) scale(1.06);background:var(--primary)}.learning-video-card-link:hover .learning-video-card-copy strong{color:var(--primary)}}
.video-empty-state{grid-column:1/-1}
.explore-video-pagination{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:28px;min-height:42px}
.explore-video-pagination.hidden{display:none}
.video-page-numbers{display:flex;align-items:center;gap:6px}
.video-page-number,.video-page-nav{border:1px solid var(--border);background:var(--surface);color:var(--text-secondary);min-height:40px;border-radius:10px;cursor:pointer;font:inherit;font-size:12px;font-weight:700;transition:var(--transition)}
.video-page-number{width:40px;padding:0}
.video-page-nav{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 13px}
.video-page-number.active{background:var(--text);border-color:var(--text);color:var(--surface)}
.video-page-number:hover,.video-page-nav:hover:not(:disabled){border-color:var(--primary-light);color:var(--primary);background:var(--primary-lighter)}
.video-page-nav:disabled{opacity:.38;cursor:default}
.video-page-ellipsis{display:grid;place-items:center;width:28px;color:var(--text-tertiary)}
.explore-public-section{margin-top:42px;padding-top:8px;border-top:1px solid var(--border-light)}

.learning-video-page{padding-top:18px}
.learning-video-topbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;margin-bottom:22px}
.learning-video-back{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text-secondary);font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.learning-video-back:hover{color:var(--primary);border-color:var(--primary-light)}
.learning-video-breadcrumb{display:flex;align-items:center;gap:8px;min-width:0;color:var(--text-tertiary);font-size:11px}
.learning-video-breadcrumb i{font-size:8px}
.learning-video-breadcrumb strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-secondary);font-weight:650}
.learning-video-studyset-btn{min-height:42px;white-space:nowrap}
.learning-video-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(360px,.9fr);gap:28px;align-items:start}
.learning-video-lesson-panel{min-width:0;padding:4px 6px 40px 0}
.learning-video-lesson-head{padding-bottom:22px;border-bottom:1px solid var(--border-light);margin-bottom:24px}
.learning-video-subject{display:inline-flex;align-items:center;margin-bottom:9px;color:var(--primary);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.learning-video-lesson-head h1{margin:0;color:var(--text);font-size:clamp(28px,3vw,42px);line-height:1.12;letter-spacing:-.035em}
.learning-video-lesson-head p{margin:13px 0 0;max-width:780px;color:var(--text-secondary);font-size:14px;line-height:1.7}
.learning-video-document{color:var(--text);font-size:15px;line-height:1.78}
.learning-video-document>.ai-rich-content{max-width:850px}
.learning-video-document .ai-rich-content h2{font-size:25px;line-height:1.25;margin:30px 0 12px}
.learning-video-document .ai-rich-content h3{font-size:19px;line-height:1.35;margin:25px 0 10px}
.learning-video-document .ai-rich-content p{font-size:15px;line-height:1.78;margin:0 0 15px}
.learning-video-document .ai-rich-content blockquote{margin:20px 0;padding:12px 18px;border-left:4px solid var(--primary-light);background:var(--surface-2);border-radius:0 10px 10px 0}
.learning-video-document .ai-table-wrap{max-width:100%;overflow-x:auto}
.learning-video-side-panel{position:sticky;top:82px;min-width:0;border-left:1px solid var(--border-light);padding-left:24px}
.learning-video-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:var(--surface-2);border:1px solid var(--border-light);border-radius:13px;margin-bottom:18px}
.learning-video-tab{display:flex;align-items:center;justify-content:center;gap:8px;min-height:43px;border:0;border-radius:10px;background:transparent;color:var(--text-secondary);font:inherit;font-size:12px;font-weight:650;cursor:pointer}
.learning-video-tab.active{background:var(--surface);color:var(--text);box-shadow:0 1px 4px rgba(15,23,42,.08)}
.learning-video-resource-panel{min-width:0}
.learning-video-resource-panel[hidden]{display:none!important}
.learning-video-player{position:relative;width:100%;aspect-ratio:16/9;border-radius:13px;overflow:hidden;background:#0f172a}
.learning-video-player iframe,.learning-video-player img{display:block;width:100%;height:100%;border:0;object-fit:cover}
.learning-video-player-fallback{display:grid;place-items:center;color:#fff;font-size:34px}
.learning-video-player-fallback .btn-primary{position:absolute;left:50%;bottom:18px;transform:translateX(-50%)}
.learning-video-player-loading{display:grid;width:100%;aspect-ratio:16/9;place-items:center;border-radius:13px;background:var(--surface-2);color:var(--primary)}
.learning-video-transcript-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 10px;padding-bottom:9px;border-bottom:1px solid var(--border-light);color:var(--text-tertiary);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.learning-video-transcript-meta{letter-spacing:0;text-transform:none;font-weight:600}
.learning-video-transcript{display:flex;flex-direction:column;gap:9px;max-height:540px;overflow-y:auto;padding:1px 5px 8px 0;scrollbar-gutter:stable}
.learning-transcript-segment{display:grid;grid-template-columns:58px minmax(0,1fr);gap:10px;width:100%;padding:12px;border:1px solid var(--border-light);border-radius:12px;background:var(--surface);color:inherit;text-align:left;cursor:pointer;font:inherit;transition:var(--transition)}
.learning-transcript-segment:hover{border-color:var(--primary-light);background:var(--primary-lighter)}
.learning-transcript-time{display:flex;align-items:center;gap:5px;color:var(--primary);font-size:10px;font-weight:700;white-space:nowrap}
.learning-transcript-time i{font-size:11px}
.learning-transcript-text{color:var(--text-secondary);font-size:12px;line-height:1.62;white-space:pre-wrap}
.learning-video-notes{min-height:280px}
.learning-video-notes-document{color:var(--text);font-size:14px;line-height:1.7}
.learning-video-notes-document h1{font-size:27px;line-height:1.18;margin:0 0 20px;letter-spacing:-.025em}
.learning-video-notes-document h2{font-size:20px;line-height:1.3;margin:26px 0 11px}
.learning-video-notes-document h3{font-size:16px;line-height:1.35;margin:20px 0 8px}
.learning-video-notes-document p{margin:0 0 12px}
.learning-video-notes-document ul,.learning-video-notes-document ol{padding-left:22px;margin:10px 0 16px}
.learning-video-notes-document li{margin:5px 0}
.learning-video-notes-document blockquote{margin:16px 0;padding:11px 14px;border-left:3px solid var(--primary-light);background:var(--surface-2);border-radius:0 9px 9px 0}
.learning-video-notes-document table{width:100%;border-collapse:collapse;margin:16px 0;font-size:12px}
.learning-video-notes-document th,.learning-video-notes-document td{padding:9px 10px;border:1px solid var(--border);vertical-align:top;text-align:left}
.learning-video-notes-document th{background:var(--surface-2);font-weight:750}
.learning-video-notes-document .math-block{overflow-x:auto;margin:14px 0;padding:10px 12px;border-radius:9px;background:var(--surface-2);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:12px;white-space:pre-wrap}
.learning-video-notes-document .inline-math{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.92em}
.learning-video-notes-document .learning-note-accent{color:var(--primary)}

@media(max-width:1399px){.explore-video-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.learning-video-layout{grid-template-columns:minmax(0,1.3fr) minmax(330px,.9fr);gap:22px}}
@media(max-width:1099px){.learning-video-layout{grid-template-columns:1fr}.learning-video-side-panel{position:static;border-left:0;border-top:1px solid var(--border-light);padding:24px 0 0}.learning-video-transcript{max-height:460px}.learning-video-lesson-panel{padding-right:0}.learning-video-topbar{grid-template-columns:auto minmax(0,1fr)}.learning-video-library-action{grid-column:1/-1}.learning-video-studyset-btn{width:100%;justify-content:center}}
@media(min-width:769px){.explore-video-searchbar{max-width:400px;margin-left:auto;margin-right:0}}
@media(max-width:899px){.explore-video-searchbar{grid-template-columns:1fr}.explore-video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}}
@media(max-width:640px){.explore-video-searchbar{margin-bottom:12px}.explore-video-search-control input{height:48px;font-size:16px}.explore-video-grid{grid-template-columns:1fr}.explore-video-section .explore-subject-nav{margin-bottom:16px}.explore-video-pagination{gap:7px}.video-page-nav{padding:0 10px}.video-page-nav span{display:none}.video-page-number{width:38px}.video-page-numbers{gap:4px}.learning-video-page{padding-top:8px}.learning-video-topbar{grid-template-columns:1fr;gap:10px}.learning-video-breadcrumb{order:2}.learning-video-back{justify-self:start}.learning-video-library-action{grid-column:auto}.learning-video-lesson-head h1{font-size:28px}.learning-video-document,.learning-video-document .ai-rich-content p{font-size:14px}.learning-video-layout{gap:18px}.learning-video-side-panel{padding-top:18px}.learning-video-transcript{max-height:520px}.learning-transcript-segment{grid-template-columns:1fr;gap:6px;padding:11px}.learning-video-notes-document table{display:block;overflow-x:auto;white-space:nowrap}}


.explore-head-copy-mobile{display:none}

/* Mobile Explore is focused on Learning Videos; desktop keeps Public Study Sets. */
@media (max-width: 767px) {
  #page-explore .explore-public-section {
    display: none !important;
  }

  #page-explore .explore-head-copy-desktop {
    display: none;
  }

  #page-explore .explore-head-copy-mobile {
    display: inline;
  }
}

/* ========================================================================== 
   Study workspace — mobile polish
   Keeps horizontal tools intentional, gives AI Tutor shortcuts breathing room,
   and makes flashcards resilient to long generated answers on small screens.
   ========================================================================== */
.workspace-flashcard-face {
  overflow: hidden;
  justify-content: flex-start;
  gap: 14px;
}
.workspace-flashcard-face > .mastery-state { flex: 0 0 auto; }
.workspace-flashcard-scroll {
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent;
  display: flex;
}
.workspace-flashcard-copy {
  width: 100%;
  max-width: 560px;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.workspace-flashcard-copy h3 { max-width: 100%; }
.workspace-flashcard-copy small {
  display: block;
  margin-top: 12px;
  color: var(--text-tertiary);
  font-size: 11px;
  font-weight: 650;
}
.workspace-flashcard-copy p { max-width: 100%; }

.mastery-pills > span {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-2);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
}
.mastery-pills > span > strong {
  color: currentColor;
  font-size: 11px;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}
.mastery-pills > .unfamiliar { color:#dc2626; background:#fef2f2; border-color:#fecaca; }
.mastery-pills > .learning { color:#b45309; background:#fffbeb; border-color:#fde68a; }
.mastery-pills > .familiar { color:#2563eb; background:#eff6ff; border-color:#bfdbfe; }
.mastery-pills > .mastered { color:#047857; background:#ecfdf5; border-color:#a7f3d0; }
[data-theme="dark"] .mastery-pills > .unfamiliar,
[data-theme="dark"] .mastery-pills > .learning,
[data-theme="dark"] .mastery-pills > .familiar,
[data-theme="dark"] .mastery-pills > .mastered { background:var(--surface-2); }

@media (max-width: 700px) {
  .workspace-tools {
    scroll-padding-inline: 14px;
    scroll-snap-type: x mandatory;
  }
  .workspace-tool {
    scroll-snap-align: center;
    scroll-snap-stop: normal;
    font-size: 11px;
    font-weight: 700;
  }
  .workspace-tool.active {
    box-shadow: 0 4px 14px rgba(15,23,42,.08);
  }

  .workspace-content {
    padding: 18px 16px calc(28px + env(safe-area-inset-bottom));
  }
  .workspace-content-head {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-bottom: 16px;
  }
  .workspace-content-head > div:first-child { min-width: 0; }
  .workspace-content-head h2 {
    font-size: 22px;
    line-height: 1.2;
  }
  .workspace-content-head > .workspace-header-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    width: 100%;
  }
  .workspace-content-head > .workspace-header-actions > * {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    justify-content: center;
    border-radius: 12px;
    white-space: nowrap;
  }
  .workspace-content-head > .workspace-header-actions .icon-text-btn {
    padding-inline: 12px;
    font-size: 12px;
  }
  .workspace-content-head > .workspace-header-actions .btn-primary.compact {
    padding-inline: 12px;
    font-size: 12px;
  }

  .set-chat-suggestions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    overflow: visible;
    padding-bottom: 0;
    margin-bottom: 16px;
  }
  .set-chat-suggestions button {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    padding: 0 12px;
    border-radius: 13px;
    justify-content: flex-start;
    text-align: left;
    font-size: 11px;
    line-height: 1.25;
  }
  .set-chat-suggestions button i {
    width: 18px;
    flex: 0 0 18px;
    text-align: center;
    font-size: 13px;
  }
  .set-chat-suggestions button span { min-width: 0; }

  .mastery-pills {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 16px;
  }
  .mastery-pills > span {
    min-width: 0;
    min-height: 42px;
    padding: 8px 11px;
    border-radius: 12px;
    justify-content: flex-start;
    gap: 7px;
  }
  .mastery-pills > span > strong { font-size: 13px; }

  .set-card-nav {
    margin-bottom: 10px;
  }
  .workspace-flashcard {
    width: 100%;
    height: clamp(340px, 52dvh, 460px);
    min-height: 340px;
    margin: 8px auto 14px;
  }
  .workspace-flashcard-face {
    padding: 18px 16px;
    border-radius: 16px;
    gap: 12px;
  }
  .workspace-flashcard-face h3 {
    font-size: clamp(15px, 4.35vw, 18px);
    line-height: 1.48;
    overflow-wrap: anywhere;
  }
  .workspace-flashcard-copy p {
    margin-top: 10px;
    font-size: 11px;
    line-height: 1.5;
  }
  .workspace-card-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
  }
  .workspace-card-actions .flashcard-btn {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    padding: 0 8px;
    border-radius: 12px;
    font-size: 12px;
  }
  .card-edit-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
  }
  .card-edit-actions .icon-text-btn {
    min-width: 0;
    width: 100%;
    min-height: 44px;
    justify-content: center;
  }
}

@media (max-width: 380px) {
  .workspace-content { padding-inline: 12px; }
  .set-chat-suggestions { grid-template-columns: 1fr; }
  .workspace-content-head > .workspace-header-actions { gap: 7px; }
  .mastery-pills { gap: 7px; }
  .workspace-flashcard { height: clamp(330px, 50dvh, 420px); min-height: 330px; }
  .workspace-flashcard-face { padding-inline: 14px; }
  .workspace-card-actions .flashcard-btn { font-size: 11px; gap: 6px; }
}

/* ========================================================================== 
   Fill-in-the-blanks results — responsive review experience
   Compact score summary, scan-friendly answer cards and deliberate spacing.
   ========================================================================== */
.fill-results {
  width: min(100%, 980px);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.fill-results-summary {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  align-items: center;
  gap: 22px;
  padding: 22px 24px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: linear-gradient(135deg, var(--primary-lighter), var(--surface) 58%);
  box-shadow: 0 12px 30px rgba(15, 23, 42, .05);
}
[data-theme="dark"] .fill-results-summary {
  background: linear-gradient(135deg, rgba(59, 130, 246, .12), var(--surface) 60%);
  box-shadow: 0 14px 34px rgba(0, 0, 0, .16);
}
.fill-results-score {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 8px solid var(--primary);
  background: var(--surface);
  color: var(--primary);
  box-shadow: 0 0 0 1px var(--border-light), 0 8px 20px rgba(37, 99, 235, .10);
}
.fill-results-score span {
  font-size: 25px;
  line-height: 1;
  font-weight: 850;
  letter-spacing: -.035em;
}
.fill-results-summary-copy { min-width: 0; }
.fill-results-summary-copy .tool-kicker { display: block; margin-bottom: 5px; }
.fill-results-summary-copy h2 {
  margin: 0;
  color: var(--text);
  font-size: clamp(25px, 3vw, 34px);
  line-height: 1.08;
  letter-spacing: -.03em;
}
.fill-results-summary-copy p {
  max-width: 680px;
  margin: 9px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.6;
}
.fill-results-summary-copy p strong { color: var(--text); }
.fill-results-review-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding: 0 2px;
}
.fill-results-review-head h3 {
  margin: 0;
  color: var(--text);
  font-size: 17px;
  line-height: 1.25;
}
.fill-results-review-head p {
  margin: 4px 0 0;
  color: var(--text-tertiary);
  font-size: 11px;
  line-height: 1.5;
}
.fill-results-count {
  flex: none;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}
.fill-results-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.fill-result-card {
  min-width: 0;
  margin: 0;
  padding: 17px 18px 16px;
  border: 1px solid var(--border);
  border-left-width: 4px;
  border-radius: 15px;
  background: var(--surface);
  box-shadow: 0 5px 16px rgba(15, 23, 42, .035);
  font-size: 13px;
  line-height: 1.55;
}
.fill-result-card.correct { border-left-color: var(--success); }
.fill-result-card.wrong { border-left-color: var(--danger); }
.fill-result-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.fill-result-status {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  font-size: 14px;
}
.fill-result-card.correct .fill-result-status {
  color: var(--success);
  background: rgba(16, 185, 129, .10);
}
.fill-result-card.wrong .fill-result-status {
  color: var(--danger);
  background: rgba(239, 68, 68, .09);
}
.fill-result-card-head > div { min-width: 0; }
.fill-result-eyebrow {
  display: block;
  margin-bottom: 1px;
  color: var(--text-tertiary);
  font-size: 9px;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: .065em;
  text-transform: uppercase;
}
.fill-result-card-head strong {
  display: block;
  color: var(--text);
  font-size: 13px;
  line-height: 1.3;
}
.fill-result-answer {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: baseline;
  gap: 8px;
  margin-top: 13px;
  padding-top: 12px;
  border-top: 1px solid var(--border-light);
}
.fill-result-answer span {
  color: var(--text-tertiary);
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}
.fill-result-answer strong {
  min-width: 0;
  color: var(--text);
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.fill-result-explanation {
  margin-top: 10px;
  color: var(--text-secondary);
}
.fill-result-explanation .ai-rich-content {
  font-size: 11px;
  line-height: 1.55;
}
.fill-result-explanation .ai-rich-content > :first-child { margin-top: 0; }
.fill-result-explanation .ai-rich-content > :last-child { margin-bottom: 0; }
.fill-results-actions {
  display: flex;
  justify-content: flex-start;
  padding-top: 2px;
}
.fill-results-actions .btn-primary {
  min-width: 180px;
  min-height: 46px;
  justify-content: center;
  gap: 9px;
  border-radius: 12px;
  box-shadow: 0 9px 22px rgba(37, 99, 235, .18);
}

/* When server-side OpenAI speech generation is unavailable, browser playback
   remains the sole podcast action and should occupy the available action row. */
.podcast-actions.single-action { grid-template-columns: minmax(0, 1fr); }
.podcast-actions.single-action .podcast-browser-playback {
  width: auto;
  min-width: 190px;
}

@media (max-width: 860px) {
  .fill-results-list { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .fill-results { gap: 18px; }
  .fill-results-summary {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 16px;
    padding: 18px;
    border-radius: 16px;
  }
  .fill-results-score {
    width: 78px;
    height: 78px;
    border-width: 6px;
  }
  .fill-results-score span { font-size: 21px; }
  .fill-results-summary-copy h2 { font-size: 25px; }
  .fill-results-summary-copy p { margin-top: 7px; font-size: 11px; line-height: 1.5; }
  .fill-results-review-head { align-items: center; }
  .fill-results-review-head p { display: none; }
  .fill-result-card { padding: 15px 15px 14px; border-radius: 14px; }
  .fill-result-answer { grid-template-columns: 1fr; gap: 3px; }
  .fill-result-answer span { white-space: normal; }
  .fill-results-actions .btn-primary {
    width: 100%;
    min-height: 50px;
  }
  .podcast-actions.single-action .podcast-browser-playback { width: 100%; min-width: 0; }
}

@media (max-width: 390px) {
  .fill-results-summary {
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 13px;
    padding: 16px 14px;
  }
  .fill-results-score { width: 64px; height: 64px; border-width: 5px; }
  .fill-results-score span { font-size: 18px; }
  .fill-results-summary-copy h2 { font-size: 22px; }
  .fill-results-summary-copy p strong { display: block; }
  .fill-results-count { padding-inline: 8px; }
}

/* ================================================================
   Paper Grader — professional results dashboard (2026-09-02)
   ================================================================ */
/* Keep the grader focused and readable on wide desktop canvases. */
.grader-form {
  max-width: 920px;
}
.grader-choice {
  max-width: 720px;
  gap: 14px;
  margin-bottom: 20px;
}
.grader-choice-card {
  min-height: 126px;
  padding: 20px 21px;
  border-radius: 18px;
  box-shadow: 0 7px 22px rgba(15,23,42,.035);
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.grader-choice-card:hover {
  transform: translateY(-1px);
  border-color: var(--primary-light);
  box-shadow: 0 11px 28px rgba(15,23,42,.07);
}
.grader-choice-card > i {
  width: 38px;
  height: 38px;
  margin: 0 0 8px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: var(--primary-lighter);
  font-size: 17px;
}
.grader-choice-card strong {
  font-size: 14px;
  line-height: 1.3;
}
.grader-choice-card span {
  font-size: 11px;
  line-height: 1.5;
}
.grader-choice-card.active {
  box-shadow: 0 0 0 3px var(--primary-glow), 0 12px 30px rgba(37,99,235,.08);
}
.grader-textarea {
  min-height: 260px;
}
.rubric-card {
  margin-top: 20px;
  padding: 18px;
  border-radius: 16px;
  background: var(--surface-2);
}
.rubric-head {
  margin-bottom: 14px;
}
.rubric-head strong {
  font-size: 13px;
  color: var(--text);
}
.rubric-grid {
  gap: 10px;
}
.rubric-grid label {
  font-size: 10px;
  font-weight: 700;
  color: var(--text-secondary);
}
.rubric-grid input {
  min-height: 42px;
  padding: 9px 10px;
  border-radius: 10px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* Result surface */
#graderResult.result-surface {
  max-width: 1180px;
  margin: 24px auto 0;
  padding: 0;
  overflow: hidden;
  border-radius: 22px;
  box-shadow: 0 14px 42px rgba(15,23,42,.075);
}
.grade-result-head {
  position: relative;
  display: grid;
  grid-template-columns: 118px minmax(0,1fr);
  gap: 26px;
  align-items: center;
  padding: 28px 30px;
  border-bottom: 1px solid var(--border-light);
  background: linear-gradient(135deg, var(--surface) 0%, var(--platform-blue-soft) 100%);
}
.grade-result-head::after {
  content: "";
  position: absolute;
  right: -64px;
  top: -92px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: rgba(37,99,235,.055);
  pointer-events: none;
}
.grade-score-ring {
  position: relative;
  z-index: 1;
  width: 108px;
  height: 108px;
  border-width: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  background: var(--surface);
  box-shadow: 0 10px 28px rgba(37,99,235,.10);
  font-variant-numeric: tabular-nums;
}
.grade-score-ring span {
  display: block;
  font-size: 30px;
  line-height: 1;
  font-weight: 850;
  letter-spacing: -.04em;
}
.grade-score-ring small {
  margin-top: 5px;
  font-size: 11px;
  line-height: 1;
  font-weight: 800;
  color: var(--text-tertiary);
}
.grade-score-ring.grade-score-high {
  border-color: #10b981;
  color: #059669;
}
.grade-score-ring.grade-score-mid {
  border-color: #f59e0b;
  color: #d97706;
}
.grade-score-ring.grade-score-low {
  border-color: #ef4444;
  color: #dc2626;
}
[data-theme="dark"] .grade-score-ring.grade-score-high { color: #34d399; }
[data-theme="dark"] .grade-score-ring.grade-score-mid { color: #fbbf24; }
[data-theme="dark"] .grade-score-ring.grade-score-low { color: #fb7185; }
.grade-result-copy {
  min-width: 0;
  position: relative;
  z-index: 1;
}
.grade-result-copy .tool-kicker {
  display: block;
  margin-bottom: 6px;
}
.grade-result-copy h2 {
  margin: 0;
  color: var(--text);
  font-size: clamp(22px,2.2vw,30px);
  line-height: 1.2;
  letter-spacing: -.025em;
}
.grade-summary-rich {
  max-width: 900px;
  margin-top: 9px;
  color: var(--text-secondary);
}
.grade-summary-rich .ai-rich-content {
  font-size: 13px;
  line-height: 1.7;
}

.grade-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding: 25px 30px 12px;
}
.grade-section-heading .tool-kicker {
  display: block;
  margin-bottom: 3px;
}
.grade-section-heading h3 {
  margin: 0;
  color: var(--text);
  font-size: 17px;
  line-height: 1.3;
  letter-spacing: -.015em;
}
.grade-section-count {
  flex: none;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--text-tertiary);
  font-size: 10px;
  font-weight: 750;
}

.grade-criteria-grid {
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin: 0;
  padding: 0 30px 10px;
}
.grade-criterion-card {
  min-width: 0;
  padding: 17px 18px 18px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface-2);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.grade-criterion-card:hover {
  transform: translateY(-1px);
  border-color: var(--primary-light);
  box-shadow: 0 9px 22px rgba(15,23,42,.055);
}
.grade-criterion-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 10px;
}
.grade-criterion-head > span {
  min-width: 0;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}
.grade-criterion-head > strong {
  flex: none;
  min-width: 58px;
  min-height: 34px;
  padding: 0 10px;
  border-radius: 10px;
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: 3px;
  background: var(--primary-lighter);
  color: var(--primary);
  font-size: 16px;
  line-height: 34px;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}
.grade-criterion-head > strong small {
  font-size: 9px;
  font-weight: 750;
  opacity: .72;
}
.grade-criterion-comment {
  margin: 0;
  color: var(--text-secondary);
}
.grade-criterion-comment .ai-rich-content {
  font-size: 11px;
  line-height: 1.62;
}

.grade-feedback-heading {
  padding-top: 20px;
}
.grade-feedback-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  padding: 0 30px 30px;
}
.grade-feedback-section {
  margin: 0;
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface);
}
.grade-feedback-section.grade-feedback-revision {
  grid-column: 1 / -1;
}
.grade-feedback-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.grade-feedback-title > span {
  width: 34px;
  height: 34px;
  flex: none;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--surface-2);
  color: var(--primary);
}
.grade-feedback-title h3 {
  margin: 0;
  color: var(--text);
  font-size: 13px;
  line-height: 1.35;
}
.grade-feedback-strengths {
  border-color: rgba(16,185,129,.25);
  background: linear-gradient(180deg,rgba(16,185,129,.045),transparent 70%);
}
.grade-feedback-strengths .grade-feedback-title > span { color:#059669; background:rgba(16,185,129,.10); }
.grade-feedback-improvements {
  border-color: rgba(245,158,11,.28);
  background: linear-gradient(180deg,rgba(245,158,11,.05),transparent 70%);
}
.grade-feedback-improvements .grade-feedback-title > span { color:#d97706; background:rgba(245,158,11,.11); }
.grade-feedback-revision {
  border-color: rgba(37,99,235,.22);
  background: linear-gradient(180deg,rgba(37,99,235,.045),transparent 70%);
}
.grade-feedback-section ul {
  margin: 0;
  padding-left: 19px;
}
.grade-feedback-section li {
  margin-bottom: 7px;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.6;
}
.grade-feedback-section li:last-child { margin-bottom: 0; }
.grade-feedback-section .ai-rich-content {
  font-size: 11px;
  line-height: 1.65;
}

/* Grading history: compact, scannable records instead of a stretched row. */
#graderHistory.history-grid {
  gap: 9px;
}
.grade-history-card {
  width: 100%;
  display: grid;
  grid-template-columns: 52px minmax(0,1fr) 30px;
  align-items: center;
  gap: 11px;
  min-height: 72px;
  padding: 10px 10px 10px 11px;
  text-align: left;
  color: var(--text);
  font: inherit;
  border-radius: 14px;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.grade-history-card:hover {
  transform: translateY(-1px);
  border-color: var(--primary-light);
  background: var(--surface);
  box-shadow: 0 7px 18px rgba(15,23,42,.055);
}
.grade-history-score {
  width: 52px;
  height: 52px;
  border-radius: 13px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--primary-lighter);
  color: var(--primary);
  font-size: 17px;
  line-height: 1;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}
.grade-history-score small {
  margin-top: 3px;
  color: currentColor;
  font-size: 8px;
  line-height: 1;
  opacity: .72;
}
.grade-history-copy {
  min-width: 0;
  display: block;
}
.grade-history-copy strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  line-height: 1.35;
}
.grade-history-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 5px;
}
.grade-history-meta time {
  color: var(--text-tertiary);
  font-size: 9px;
}
.grade-history-meta em {
  padding: 3px 6px;
  border-radius: 999px;
  background: rgba(16,185,129,.10);
  color: #059669;
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
  text-transform: capitalize;
}
[data-theme="dark"] .grade-history-meta em { color:#34d399; }
.grade-history-arrow {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  color: var(--text-tertiary);
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.grade-history-card:hover .grade-history-arrow {
  background: var(--primary-lighter);
  color: var(--primary);
  transform: translateX(2px);
}
.grade-history-empty {
  min-height: 150px;
}

[data-theme="dark"] #graderResult.result-surface {
  box-shadow: 0 16px 44px rgba(0,0,0,.24);
}
[data-theme="dark"] .grade-result-head::after {
  background: rgba(59,130,246,.07);
}
[data-theme="dark"] .grader-choice-card,
[data-theme="dark"] .grade-criterion-card,
[data-theme="dark"] .grade-history-card {
  box-shadow: none;
}

@media (max-width: 900px) {
  #graderResult.result-surface {
    border-radius: 18px;
  }
  .grade-result-head {
    grid-template-columns: 96px minmax(0,1fr);
    gap: 20px;
    padding: 24px;
  }
  .grade-score-ring {
    width: 90px;
    height: 90px;
    border-width: 7px;
  }
  .grade-score-ring span { font-size: 25px; }
  .grade-section-heading { padding-left: 24px; padding-right: 24px; }
  .grade-criteria-grid { padding-left: 24px; padding-right: 24px; }
  .grade-feedback-grid { padding-left: 24px; padding-right: 24px; padding-bottom: 24px; }
}

@media (max-width: 700px) {
  .grader-choice {
    gap: 10px;
    margin-bottom: 16px;
  }
  .grader-choice-card {
    min-height: 108px;
    padding: 15px;
    border-radius: 15px;
  }
  .grader-choice-card > i {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 15px;
  }
  .grader-textarea { min-height: 220px; }
  .rubric-card { padding: 15px; }

  #graderResult.result-surface {
    margin-top: 18px;
    border-radius: 16px;
  }
  .grade-result-head {
    grid-template-columns: 1fr;
    gap: 15px;
    padding: 20px 18px;
    text-align: center;
  }
  .grade-score-ring {
    width: 88px;
    height: 88px;
    margin: 0 auto;
  }
  .grade-result-copy h2 {
    font-size: 22px;
  }
  .grade-summary-rich {
    margin-top: 8px;
    text-align: left;
  }
  .grade-summary-rich .ai-rich-content {
    font-size: 12px;
    line-height: 1.65;
  }
  .grade-section-heading {
    align-items: center;
    padding: 21px 18px 11px;
  }
  .grade-section-heading h3 { font-size: 15px; }
  .grade-section-count { font-size: 9px; }
  .grade-criteria-grid {
    grid-template-columns: 1fr;
    gap: 9px;
    padding: 0 18px 5px;
  }
  .grade-criterion-card {
    padding: 15px;
    border-radius: 13px;
  }
  .grade-criterion-head {
    margin-bottom: 8px;
  }
  .grade-criterion-head > span { font-size: 12px; }
  .grade-criterion-head > strong {
    min-width: 54px;
    min-height: 32px;
    line-height: 32px;
    font-size: 15px;
  }
  .grade-feedback-grid {
    grid-template-columns: 1fr;
    gap: 9px;
    padding: 0 18px 20px;
  }
  .grade-feedback-section.grade-feedback-revision { grid-column: auto; }
  .grade-feedback-section {
    padding: 15px;
    border-radius: 13px;
  }
  .grade-feedback-title { margin-bottom: 10px; }
  .grade-feedback-title > span { width:32px; height:32px; }

  .tool-history {
    border-radius: 16px;
    padding: 15px;
  }
  .grade-history-card {
    grid-template-columns: 48px minmax(0,1fr) 28px;
    min-height: 68px;
    padding: 9px;
  }
  .grade-history-score {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    font-size: 16px;
  }
}

@media (max-width: 430px) {
  .grader-choice { grid-template-columns: 1fr; }
  .grade-section-heading {
    align-items: flex-start;
  }
  .grade-section-count { margin-top: 3px; }
  .grade-history-meta em { display: none; }
}


/* ================================================================
   Paper Grader — final responsive polish (2026-09-02)
   ================================================================ */
#graderResult.result-surface {
  background: var(--surface);
  border: 1px solid var(--border);
}
.grade-result-head {
  grid-template-columns: 150px minmax(0,1fr);
  gap: 28px;
  padding: 30px 32px;
}
.grade-score-panel {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 14px 12px 13px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 94%, var(--primary) 6%);
  text-align: center;
  box-shadow: 0 8px 24px rgba(15,23,42,.045);
}
.grade-score-panel .grade-score-ring {
  width: 96px;
  height: 96px;
  margin: 0 auto;
  border-width: 7px;
  box-shadow: none;
}
.grade-score-panel .grade-score-ring span { font-size: 28px; }
.grade-score-caption { margin-top: 10px; }
.grade-score-caption strong,
.grade-score-caption span { display:block; }
.grade-score-caption strong {
  color:var(--text);
  font-size:11px;
  line-height:1.25;
  font-weight:800;
}
.grade-score-caption span {
  margin-top:3px;
  color:var(--text-tertiary);
  font-size:9px;
  line-height:1.2;
  font-weight:750;
  text-transform:uppercase;
  letter-spacing:.055em;
}
.grade-result-copy h2 { max-width: 760px; }
.grade-summary-rich { max-width: 820px; }

.grade-criterion-card { overflow:hidden; }
.grade-criterion-progress {
  height: 5px;
  margin: -1px 0 12px;
  overflow: hidden;
  border-radius:999px;
  background: color-mix(in srgb, var(--border) 68%, transparent);
}
.grade-criterion-progress > span {
  display:block;
  height:100%;
  border-radius:inherit;
  background:var(--primary);
}
.grade-criterion-high .grade-criterion-progress > span { background:#10b981; }
.grade-criterion-mid .grade-criterion-progress > span { background:#f59e0b; }
.grade-criterion-low .grade-criterion-progress > span { background:#ef4444; }
.grade-criterion-neutral .grade-criterion-progress > span { background:var(--primary); }
.grade-criterion-comment .ai-rich-content > :first-child,
.grade-feedback-body .ai-rich-content > :first-child { margin-top:0; }
.grade-criterion-comment .ai-rich-content > :last-child,
.grade-feedback-body .ai-rich-content > :last-child { margin-bottom:0; }
.grade-feedback-body { min-width:0; }

.grade-history-score-high { background:rgba(16,185,129,.11); color:#059669; }
.grade-history-score-mid { background:rgba(245,158,11,.12); color:#d97706; }
.grade-history-score-low { background:rgba(239,68,68,.10); color:#dc2626; }
.grade-history-score-neutral { background:var(--primary-lighter); color:var(--primary); }
[data-theme="dark"] .grade-history-score-high { color:#34d399; }
[data-theme="dark"] .grade-history-score-mid { color:#fbbf24; }
[data-theme="dark"] .grade-history-score-low { color:#fb7185; }
[data-theme="dark"] .grade-score-panel {
  background: color-mix(in srgb, var(--surface-2) 92%, var(--primary) 8%);
  box-shadow:none;
}

@media (min-width: 1180px) {
  #graderResult.result-surface { max-width: 1120px; }
  .grade-criteria-grid { gap:14px; }
  .grade-criterion-card { min-height:132px; }
}

@media (max-width: 900px) {
  .grade-result-head {
    grid-template-columns: 132px minmax(0,1fr);
    gap:22px;
    padding:24px;
  }
  .grade-score-panel { padding:12px 10px; }
  .grade-score-panel .grade-score-ring { width:84px; height:84px; border-width:6px; }
  .grade-score-panel .grade-score-ring span { font-size:24px; }
}

@media (max-width: 700px) {
  .grader-form { width:100%; }
  .grader-choice-card { box-shadow:none; }
  #graderResult.result-surface {
    width:100%;
    margin-top:16px;
    border-radius:18px;
    box-shadow:0 10px 30px rgba(15,23,42,.06);
  }
  .grade-result-head {
    grid-template-columns: 1fr;
    gap:16px;
    padding:18px 16px 20px;
    text-align:left;
  }
  .grade-score-panel {
    width:100%;
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    align-items:center;
    gap:14px;
    padding:11px 13px;
    text-align:left;
  }
  .grade-score-panel .grade-score-ring {
    width:68px;
    height:68px;
    margin:0;
    border-width:5px;
  }
  .grade-score-panel .grade-score-ring span { font-size:20px; }
  .grade-score-panel .grade-score-ring small { margin-top:3px; font-size:9px; }
  .grade-score-caption { margin:0; }
  .grade-score-caption strong { font-size:12px; }
  .grade-score-caption span { margin-top:4px; font-size:9px; }
  .grade-result-copy h2 { font-size:21px; }
  .grade-summary-rich { text-align:left; }
  .grade-section-heading { padding:20px 16px 10px; }
  .grade-criteria-grid { padding:0 16px 4px; }
  .grade-feedback-grid { padding:0 16px 18px; }
  .grade-criterion-card { padding:14px; }
  .grade-criterion-comment .ai-rich-content,
  .grade-feedback-section .ai-rich-content,
  .grade-feedback-section li { font-size:11.5px; line-height:1.62; }
  .grade-history-card { min-height:72px; border-radius:13px; }
}

@media (max-width: 430px) {
  .grader-choice { gap:8px; }
  .grader-choice-card { min-height:102px; padding:14px; }
  .rubric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rubric-grid label:last-child:nth-child(odd) { grid-column:1 / -1; }
  .grade-section-heading { gap:10px; }
  .grade-section-count { white-space:nowrap; }
  .grade-criterion-head { align-items:flex-start; }
  .grade-criterion-head > strong { min-width:52px; }
  .grade-history-card { grid-template-columns:46px minmax(0,1fr) 26px; gap:9px; }
  .grade-history-score { width:46px; height:46px; border-radius:11px; }
}

/* ================================================================
   Solve — professional result experience (2026-09-02)
   ================================================================ */
#solveResult.result-surface {
  width: min(100%, 1120px);
  margin: 24px auto 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 22px;
  background: var(--surface);
  box-shadow: 0 18px 50px rgba(15,23,42,.075);
}
.solve-result-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 28px;
  border-bottom: 1px solid var(--border-light);
  background: linear-gradient(135deg, color-mix(in srgb,var(--primary) 7%,var(--surface)) 0%, var(--surface) 58%);
}
.solve-result-heading {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 15px;
}
.solve-result-icon {
  width: 48px;
  height: 48px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: var(--primary-lighter);
  color: var(--primary);
  font-size: 18px;
  box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--primary) 12%,transparent);
}
.solve-result-title { min-width: 0; }
.solve-result-title h2 {
  margin: 3px 0 7px;
  color: var(--text);
  font-size: clamp(20px,2vw,26px);
  line-height: 1.18;
  letter-spacing: -.025em;
}
.solve-subject-chip,
.solve-result-meta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text-tertiary);
  font-size: 10px;
  font-weight: 700;
}
.solve-subject-chip {
  min-height: 25px;
  padding: 4px 9px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text-secondary);
}
.solve-subject-chip i { color: var(--primary); font-size: 9px; }
.solve-result-meta {
  flex: none;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: color-mix(in srgb,var(--surface-2) 72%,var(--surface));
  white-space: nowrap;
}
.solve-result-meta i { color: var(--primary); }
.solve-result-body { padding: 26px clamp(22px,4vw,48px) 32px; }
.solve-problem-context {
  max-width: 880px;
  margin: 0 auto 20px;
  padding: 15px 17px;
  border: 1px solid color-mix(in srgb,var(--primary) 18%,var(--border));
  border-radius: 14px;
  background: color-mix(in srgb,var(--primary-lighter) 48%,var(--surface));
}
.solve-problem-label,
.solve-answer-label {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--primary);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .075em;
  text-transform: uppercase;
}
.solve-problem-context p {
  margin: 8px 0 0;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.solve-answer-shell {
  max-width: 930px;
  margin: 0 auto;
  padding: 22px 24px 24px;
  border: 1px solid var(--border-light);
  border-radius: 17px;
  background: color-mix(in srgb,var(--surface-2) 42%,var(--surface));
}
.solve-answer-label { margin-bottom: 15px; }
#solveResult .solution-document {
  max-width: 820px;
  margin: 0 auto;
  color: var(--text-secondary);
  font-size: 14.5px;
  line-height: 1.78;
}
#solveResult .solution-document > :first-child { margin-top: 0; }
#solveResult .solution-document > :last-child { margin-bottom: 0; }
#solveResult .solution-document p { margin: 0 0 14px; }
#solveResult .solution-document h2,
#solveResult .solution-document h3,
#solveResult .solution-document h4 {
  color: var(--text);
  letter-spacing: -.015em;
}
#solveResult .solution-document h2 { margin: 24px 0 10px; font-size: 19px; }
#solveResult .solution-document h3 { margin: 22px 0 9px; font-size: 16px; }
#solveResult .solution-document h4 { margin: 20px 0 8px; font-size: 14px; }
#solveResult .solution-document ul,
#solveResult .solution-document ol {
  margin: 10px 0 17px;
  padding-left: 24px;
}
#solveResult .solution-document li { padding-left: 4px; margin: 7px 0; }
#solveResult .solution-document li::marker { color: var(--primary); font-weight: 800; }
#solveResult .solution-document strong { color: var(--text); font-weight: 760; }
#solveResult .solution-document blockquote {
  margin: 18px 0;
  padding: 12px 15px;
  border-left: 3px solid var(--primary);
  border-radius: 0 10px 10px 0;
  background: var(--primary-lighter);
}
#solveResult .solution-document pre,
#solveResult .solution-document code {
  max-width: 100%;
  overflow-x: auto;
}
#solveResult .solve-followup {
  max-width: 930px;
  margin: 22px auto 0;
  padding: 19px;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: var(--surface-2);
}
#solveResult .solve-followup-heading { margin-bottom: 13px; }
#solveResult .solve-followup-heading h3 { font-size: 15px; }
#solveResult .solve-followup-composer {
  background: var(--surface);
  box-shadow: 0 5px 18px rgba(15,23,42,.045);
}
#solveResult .solve-followup-messages {
  max-width: 930px;
  margin: 14px auto 0;
}
#solveHistory.history-grid { gap: 9px; }
#solveHistory .history-item {
  width: 100%;
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  align-items: center;
  gap: 11px;
  padding: 11px 12px;
  border-radius: 13px;
  text-align: left;
  transition: border-color .18s ease,background .18s ease,transform .18s ease;
}
#solveHistory .history-item > i {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: var(--primary-lighter);
  color: var(--primary);
  font-size: 13px;
}
#solveHistory .history-item > span { min-width: 0; }
#solveHistory .history-item strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11.5px;
  line-height: 1.35;
}
#solveHistory .history-item small { display:block; margin-top:4px; font-size:9.5px; }
#solveHistory .history-item:hover {
  transform: translateY(-1px);
  background: color-mix(in srgb,var(--primary-lighter) 32%,var(--surface-2));
}
.solve-dropzone {
  border-radius: 18px;
  min-height: 150px;
  transition: border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease;
}
.solve-dropzone:hover,
.solve-dropzone.dragover {
  box-shadow: 0 0 0 4px var(--primary-glow);
}
[data-theme="dark"] #solveResult.result-surface { box-shadow: 0 20px 52px rgba(0,0,0,.2); }
[data-theme="dark"] .solve-result-head {
  background: linear-gradient(135deg,color-mix(in srgb,var(--primary) 10%,var(--surface)) 0%,var(--surface) 62%);
}
[data-theme="dark"] .solve-answer-shell,
[data-theme="dark"] .solve-result-meta { background: color-mix(in srgb,var(--surface-2) 84%,var(--surface)); }

@media (max-width: 700px) {
  #solveResult.result-surface {
    width: 100%;
    margin-top: 16px;
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(15,23,42,.06);
  }
  .solve-result-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 14px;
    padding: 18px 16px;
  }
  .solve-result-heading { gap: 12px; }
  .solve-result-icon { width: 42px; height: 42px; border-radius: 12px; font-size: 16px; }
  .solve-result-title h2 { margin-top:2px; font-size: 20px; }
  .solve-result-meta { min-height: 30px; padding: 5px 9px; }
  .solve-result-body { padding: 18px 14px 22px; }
  .solve-problem-context { margin-bottom:14px; padding:13px 14px; border-radius:13px; }
  .solve-problem-context p { font-size:12px; }
  .solve-answer-shell { padding: 17px 15px 18px; border-radius:14px; }
  .solve-answer-label { margin-bottom:12px; }
  #solveResult .solution-document { font-size:13.5px; line-height:1.72; }
  #solveResult .solution-document p { margin-bottom:12px; }
  #solveResult .solution-document h2 { font-size:17px; }
  #solveResult .solution-document h3 { font-size:15px; }
  #solveResult .solution-document ul,
  #solveResult .solution-document ol { padding-left:20px; }
  #solveResult .solve-followup { margin-top:16px; padding:15px; border-radius:14px; }
  #solveResult .solve-followup-heading { gap:5px; }
  #solveResult .solve-followup-composer { padding:6px; border-radius:13px; }
  #solveResult .solve-followup-input-wrap textarea { font-size:12px; }
  #solveResult .solve-followup-messages { margin-top:12px; }
}

@media (max-width: 430px) {
  .solve-result-head { padding:16px 14px; }
  .solve-result-body { padding:15px 11px 20px; }
  .solve-result-heading { align-items:flex-start; }
  .solve-subject-chip { max-width:100%; }
  .solve-answer-shell { padding:15px 13px 16px; }
  #solveResult .solution-document { font-size:13px; }
  #solveResult .solve-followup { padding:13px; }
  #solveHistory .history-item { grid-template-columns:34px minmax(0,1fr); padding:10px; }
  #solveHistory .history-item > i { width:34px; height:34px; border-radius:10px; }
}
