:root {
  --ink: #1a2926;
  --muted: #6e7772;
  --paper: #f7f7f3;
  --card: #ffffff;
  --line: #e5e7e2;
  --mint: #c9f0dc;
  --mint-deep: #78c89d;
  --yellow: #f9e9a4;
  --coral: #ff9c82;
  --blue: #a9c8ec;
  --lavender: #d7cef8;
  --radius: 20px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
/* Keep a section's label visible after sidebar navigation. The content blocks
   already have generous top padding, so only a small anchor offset is needed
   below the sticky app header. */
main[id], section[id], aside[id] { scroll-margin-top: 44px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "Noto Sans KR", "DM Sans", sans-serif; font-size: 14px; }
button, input { font: inherit; }
button { color: inherit; cursor: pointer; }
svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }

.app-shell { min-height: 100vh; display: flex; }
.sidebar { width: 244px; flex: 0 0 244px; min-height: 100vh; padding: 30px 16px 18px; border-right: 1px solid var(--line); display: flex; flex-direction: column; position: sticky; top: 0; align-self: flex-start; }
.brand { color: var(--ink); text-decoration: none; display: flex; align-items: center; gap: 9px; margin: 0 10px 47px; font: 700 20px/1 "DM Sans", sans-serif; letter-spacing: -.9px; }
.brand-mark { display: inline-flex; gap: 2px; height: 19px; align-items: end; }
.brand-mark i { display: block; width: 5px; border-radius: 99px; background: var(--ink); }
.brand-mark i:nth-child(1) { height: 10px; }.brand-mark i:nth-child(2) { height: 17px; }.brand-mark i:nth-child(3) { height: 13px; }
.main-nav { display: grid; gap: 7px; }
.nav-item { display: flex; align-items: center; gap: 12px; height: 46px; padding: 0 12px; color: #68716c; border-radius: 12px; text-decoration: none; font-weight: 500; transition: .2s ease; }
.nav-item:hover, .nav-item.active { color: var(--ink); background: #eaefeb; }.nav-item.active { font-weight: 700; }.nav-item svg { width: 18px; }
.nav-badge { margin-left: auto; min-width: 19px; padding: 2px 5px; color: #875146; background: #ffe2d9; border-radius: 99px; font: 500 9px "DM Mono", monospace; text-align: center; }
.sidebar-spacer { flex: 1; }
.study-streak { display: flex; gap: 9px; align-items: center; margin: 20px 7px 18px; color: var(--muted); font-size: 11px; line-height: 1.5; }.study-streak b { color: var(--ink); display: block; font-size: 12px; }.study-streak span { display: block; }.streak-icon { width: 31px; height: 31px; display: grid; place-items: center; flex: 0 0 auto; color: #759780; background: #e1f0e5; border-radius: 9px; font-size: 15px; }
.profile { border: 0; border-top: 1px solid var(--line); padding: 17px 7px 0; background: none; display: flex; align-items: center; gap: 9px; font-size: 12px; text-align: left; }.profile .avatar { display: grid; place-items: center; background: #f6cdb7; width: 28px; height: 28px; border-radius: 9px; font-size: 11px; font-weight: 700; }.profile svg { margin-left: auto; width: 15px; color: #87908a; }

.content { min-width: 0; width: min(1120px, calc(100vw - 244px)); margin: 0 auto; padding: 0 56px; }
.topbar { height: 85px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }.breadcrumb { display: flex; gap: 9px; align-items: center; color: #a0a7a2; font-size: 12px; }.breadcrumb b { color: #c7cbc8; font-weight: 400; }.breadcrumb strong { color: #69716d; font-weight: 600; }.top-actions { display: flex; align-items: center; gap: 14px; }.icon-button { position: relative; border: 0; background: none; padding: 7px; }.icon-button svg { width: 19px; }.icon-button i { position: absolute; top: 6px; right: 6px; width: 5px; height: 5px; border: 1.5px solid var(--paper); background: #ed7859; border-radius: 50%; }.help-button { color: #77807b; font-size: 12px; background: none; border: 0; }.mobile-menu { display: none; }

.intro-grid { display: grid; grid-template-columns: 1fr 300px; gap: 35px; padding: 58px 0 43px; align-items: center; }.eyebrow { color: #77837d; margin: 0 0 10px; font: 500 10px/1 "DM Mono", monospace; letter-spacing: .8px; }.welcome h1 { margin: 0; max-width: 540px; letter-spacing: -2.7px; font: 600 clamp(32px, 3.45vw, 45px)/1.18 "Noto Sans KR", sans-serif; }.welcome h1 em { font-family: Georgia, serif; color: #618b6f; font-weight: 400; }.intro-copy { margin: 19px 0 0; color: var(--muted); line-height: 1.8; font-size: 13px; }
.exam-card { padding: 23px 24px 19px; background: var(--yellow); min-height: 185px; border-radius: var(--radius); transform: rotate(1.2deg); box-shadow: 5px 7px 0 #eadc9a; }.exam-top { display: flex; justify-content: space-between; align-items: center; font: 500 11px "DM Mono", monospace; }.exam-top button { border: 0; background: none; letter-spacing: 2px; padding: 0; }.days { margin-top: 8px; display: flex; align-items: center; gap: 11px; }.days strong { font: 500 57px/.95 "DM Sans", sans-serif; letter-spacing: -3px; }.days span { font: 500 11px/1.3 "DM Mono", monospace; }.exam-line { border-top: 1px dashed #ccb96b; margin: 10px 0; }.exam-meta { display: flex; justify-content: space-between; align-items: end; gap: 10px; font-size: 11px; }.exam-meta span { font-weight: 700; }.exam-meta time { color: #695e39; font-size: 9px; white-space: nowrap; }

.focus-card { background: var(--card); border: 1px solid #e8eae6; border-radius: var(--radius); padding: 24px 27px 8px; box-shadow: 0 8px 18px rgba(31, 44, 37, .025); }.focus-header, .section-heading { display: flex; align-items: end; justify-content: space-between; gap: 15px; }.focus-header h2, .section-heading h2 { margin: 0; letter-spacing: -1.2px; font-size: 20px; }.progress-label { color: #77807b; margin-bottom: 2px; font-size: 12px; }.progress-label b { color: #397255; }.tasks { margin-top: 15px; }.task { min-height: 47px; display: flex; align-items: center; gap: 11px; position: relative; border-top: 1px solid #eef0ed; cursor: pointer; }.task input { position: absolute; opacity: 0; pointer-events: none; }.task .check { width: 18px; height: 18px; flex: 0 0 18px; display: grid; place-items: center; border: 1.5px solid #cbd1cc; border-radius: 6px; transition: .2s; }.task .check svg { width: 12px; stroke-width: 2.5; opacity: 0; }.task span:last-of-type { font-size: 13px; }.task small { margin-left: auto; color: #a0a8a3; font: 10px "DM Mono", monospace; }.task.complete .check, .task input:checked + .check { background: #9ad2af; border-color: #9ad2af; }.task.complete .check svg, .task input:checked + .check svg { opacity: 1; }.task.complete span:last-of-type, .task input:checked ~ span:last-of-type { color: #98a29c; text-decoration: line-through; }

.plan-section { padding: 55px 0 0; }.plan-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(235px, .65fr); gap: 18px; margin-top: 19px; }.review-flow { padding: 23px 25px; background: #eff7f0; border: 1px solid #d9eadc; border-radius: var(--radius); }.review-head, .coach-top { display: flex; align-items: center; justify-content: space-between; }.review-head > div, .coach-top { display: flex; gap: 7px; align-items: center; }.review-head b { font-size: 13px; }.review-head > span { color: #63816a; font: 9px "DM Mono", monospace; }.smart-dot { display: grid; place-items: center; width: 20px; height: 20px; color: #3e8756; background: #d7edda; border-radius: 6px; font-size: 12px; }.review-flow > p { margin: 10px 0 19px; color: #718078; font-size: 11px; line-height: 1.7; }.review-flow > p strong { color: #3f6f4d; }.review-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }.review-step { position: relative; padding: 10px; min-height: 78px; background: rgba(255,255,255,.68); border: 1px solid #dceade; border-radius: 11px; }.review-step:not(:last-child)::after { position: absolute; z-index: 1; top: 26px; right: -8px; width: 9px; border-top: 1px dashed #91ad98; content: ""; }.review-step i { display: block; margin-bottom: 6px; color: #709678; font: 9px "DM Mono", monospace; font-style: normal; }.review-step b { display: block; margin-bottom: 3px; color: #425249; font-size: 10px; }.review-step span { display: block; color: #7d8c83; font-size: 9px; line-height: 1.35; }.review-step.now { background: #caefd4; border-color: #b4e5c1; }.review-step.now i { color: #347748; }.coach-card { padding: 22px 20px; color: #fff; background: #425d7a; border-radius: var(--radius); }.coach-top { justify-content: flex-start; }.coach-top > span { display: grid; place-items: center; width: 20px; height: 20px; color: #d5e6ff; background: #587596; border-radius: 6px; font-size: 12px; }.coach-top b { font-size: 12px; }.coach-card > p { margin: 14px 0 16px; color: #dce8f5; font-size: 11px; line-height: 1.7; }.coach-card > p strong { color: #fff0b3; }.coach-signal { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; padding: 10px; background: rgba(255,255,255,.1); border-radius: 9px; }.coach-signal span { color: #c8d9ec; font-size: 9px; }.coach-signal b { font-size: 11px; }.coach-signal small { grid-column: 1 / -1; color: #bbd2ef; font-size: 9px; }.plan-schedule-head { display: flex; align-items: end; justify-content: space-between; margin-top: 22px; }.plan-schedule-head div { display: grid; gap: 4px; }.plan-schedule-head b { font-size: 13px; }.plan-schedule-head div span { color: #77837d; font-size: 10px; }.plan-schedule-head > span { padding: 5px 7px; color: #4f805c; background: #e7f4e9; border-radius: 6px; font: 9px "DM Mono", monospace; }.plan-calendar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 10px; }.cal-date { display: flex; min-height: 98px; padding: 10px; background: #fff; border: 1px solid #e2e6e1; border-radius: 10px; flex-direction: column; }.cal-date span, .cal-date i { display: block; color: #909b94; font: 9px "DM Mono", monospace; font-style: normal; line-height: 1.35; }.cal-date b { display: block; margin: 6px 0 3px; color: #435049; font-size: 10px; line-height: 1.35; }.cal-date em { width: fit-content; margin-top: auto; padding: 3px 5px; color: #4c865b; background: #e7f4e9; border-radius: 4px; font-size: 8px; font-style: normal; }.cal-date em.review { color: #7160a0; background: #f0ebfd; }.cal-date.today { background: #eff8f1; border-color: #cbe8d2; }.cal-date.final { background: #f5f0ff; border-color: #e2d8fa; }.cal-date.final b { color: #7862ac; }.cal-date.exam { background: #fff2d7; border-color: #f6deb0; }.cal-date.exam b { color: #a67430; }.cal-date.exam em { color: #9b6d2d; background: #fee7b9; }

.section-block { padding: 55px 0 0; }.section-heading h2 { font-size: 22px; }.outline-button { display: inline-flex; gap: 6px; align-items: center; height: 34px; border: 1px solid #cbd2cd; border-radius: 9px; padding: 0 10px; background: white; font-size: 11px; font-weight: 600; transition: .2s; }.outline-button:hover { border-color: var(--ink); background: #f6faf7; }.outline-button svg { width: 14px; }
.materials-layout { display: grid; grid-template-columns: minmax(278px, .82fr) 1.18fr; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: white; margin-top: 19px; }.material-list { padding: 10px; border-right: 1px solid var(--line); }.material-card { width: 100%; border: 1px solid transparent; min-height: 70px; display: flex; gap: 10px; text-align: left; align-items: center; padding: 9px 10px; background: white; border-radius: 12px; transition: .15s; }.material-card:hover { background: #f7faf7; }.material-card.selected { background: #edf7ef; border-color: #d4ead9; }.file-icon { width: 33px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 8px; font: 500 9px "DM Mono", monospace; }.file-icon.pdf { color: #b64b43; background: #fae5e1; }.file-icon.ppt { color: #b06936; background: #f9e7d3; }.file-icon.doc { color: #476eae; background: #e3edfa; }.file-icon.link { color: #5c7489; background: #e6eff3; font-size: 16px; }.material-copy { min-width: 0; display: grid; gap: 3px; }.material-copy b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }.material-copy small { color: #929a95; font-size: 10px; }.file-more { margin-left: auto; align-self: flex-start; letter-spacing: 1px; color: #97a09a; font-weight: 700; font-size: 10px; }
.material-detail { padding: 30px 33px; min-height: 337px; background: #fbfcfa; }.detail-kicker { display: flex; gap: 7px; align-items: center; color: #84908a; font: 10px "DM Mono", monospace; }.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #8ed09f; }.material-detail h3 { margin: 13px 0 5px; font-size: 21px; letter-spacing: -1px; }.material-detail > p { margin: 0; color: #6f7c75; font-size: 12px; }.key-points { display: grid; gap: 6px; margin-top: 19px; }.key-points div { display: grid; grid-template-columns: 24px 1fr; gap: 8px; align-items: start; }.key-points span { color: #779f81; padding-top: 2px; font: 10px "DM Mono", monospace; }.key-points p { margin: 0; color: #66716b; font-size: 11px; line-height: 1.7; }.key-points b { color: #33423b; }.text-button { margin: 17px 0 0 32px; border: 0; background: none; padding: 0; color: #4c875e; font-size: 11px; font-weight: 700; }.text-button span { padding-left: 4px; font-size: 14px; }

.ai-summary-section { padding: 58px 0 0; }.ai-summary-layout { display: grid; grid-template-columns: 245px minmax(0, 1fr); margin-top: 19px; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); }.summary-source { padding: 23px 16px 16px; background: #f1f6f1; border-right: 1px solid #dfe9e0; }.source-heading { display: flex; justify-content: space-between; align-items: center; margin: 0 5px 14px; }.source-heading b { font-size: 12px; }.source-heading span { color: #61806a; font: 9px "DM Mono", monospace; }.source-file { display: flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 6px; color: #536159; font-size: 10px; cursor: pointer; }.source-file input { accent-color: #5e9c72; }.source-file span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.source-file i { margin-left: auto; color: #87958c; font: 8px "DM Mono", monospace; font-style: normal; }.summary-source .primary-button { height: 35px; margin-top: 16px; background: #326947; font-size: 10px; }.summary-source .primary-button span, .generate-button span { color: #c9f0d4; padding-left: 3px; }.summary-workspace { padding: 0 29px 26px; }.summary-tabs { display: flex; gap: 19px; height: 51px; border-bottom: 1px solid #e9ece8; }.summary-tab { position: relative; border: 0; padding: 0; color: #8a948e; background: none; font-size: 11px; font-weight: 600; }.summary-tab.active { color: #2b513b; }.summary-tab.active::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: #4d9865; content: ""; }.summary-output { padding-top: 22px; }.summary-output-head { display: flex; justify-content: space-between; align-items: center; color: #728178; font: 10px "DM Mono", monospace; }.copy-button { border: 0; border-radius: 6px; padding: 5px 8px; color: #54715d; background: #edf4ee; font-size: 9px; }.summary-output h3 { margin: 14px 0 14px; letter-spacing: -1.25px; font-size: 21px; line-height: 1.43; }.summary-content { display: grid; gap: 8px; max-width: 650px; }.summary-content p { margin: 0; color: #647069; font-size: 12px; line-height: 1.8; }.summary-content mark { padding: 1px 2px; color: #284532; background: #d9f0db; }.summary-sources { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; padding-top: 16px; color: #8d9891; font-size: 9px; }.summary-sources button { border: 0; border-radius: 99px; padding: 5px 8px; color: #718078; background: #f3f5f2; font-size: 9px; }

.memory-section { padding: 58px 0 0; }.memory-layout { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); gap: 18px; margin-top: 19px; }.flashcard-panel, .mindmap-panel { min-height: 322px; padding: 22px; overflow: hidden; border: 1px solid #e4e7e4; border-radius: var(--radius); background: #fff; }.flash-head, .mindmap-head { display: flex; align-items: center; justify-content: space-between; }.flash-head > div, .mindmap-head > div { display: grid; gap: 3px; }.flash-head span, .mindmap-head span { color: #84908a; font: 9px "DM Mono", monospace; }.flash-head b, .mindmap-head b { font-size: 11px; }.flash-head button, .mindmap-head button { border: 0; color: #657b6c; background: #eef5f0; border-radius: 6px; padding: 5px 7px; font-size: 9px; }.flashcard { position: relative; width: 100%; min-height: 191px; margin-top: 16px; padding: 22px; color: #284031; text-align: left; background: #e9f6e9; border: 1px solid #d2ead3; border-radius: 15px; transition: .28s; transform-style: preserve-3d; }.flashcard:hover { border-color: #aed8b5; }.flashcard .flash-label { display: block; color: #5c8c65; font: 9px "DM Mono", monospace; }.flashcard strong { display: block; margin-top: 23px; letter-spacing: -1px; font-size: 19px; line-height: 1.4; }.flashcard p { display: none; margin: 17px 0 0; color: #466452; font-size: 12px; line-height: 1.7; }.flashcard i { position: absolute; right: 19px; bottom: 15px; color: #79a280; font: 9px "DM Mono", monospace; font-style: normal; }.flashcard.revealed { background: #fff5d9; border-color: #efddaa; }.flashcard.revealed .flash-label { color: #a68233; }.flashcard.revealed strong { margin-top: 15px; font-size: 15px; }.flashcard.revealed p { display: block; }.flashcard.revealed i { color: #a68233; }.flash-controls { display: flex; justify-content: space-between; align-items: center; margin-top: 11px; }.flash-controls button { border: 0; color: #466653; background: none; font-size: 10px; font-weight: 700; }.flash-controls span { color: #94a099; font-size: 9px; }.mindmap-panel { background: #f8fbff; }.mindmap { position: relative; height: 238px; margin-top: 13px; }.mind-root, .mind-branch, .mind-leaf { position: absolute; z-index: 1; display: grid; place-items: center; text-align: center; border-radius: 99px; }.mind-root { top: 82px; left: 50%; width: 112px; height: 112px; color: #fff; background: #607ea4; box-shadow: 0 0 0 8px #e3eefb; font-size: 13px; font-weight: 700; transform: translateX(-50%); }.mind-branch { width: 125px; min-height: 63px; padding: 9px; color: #3f5e85; background: #dfeafa; border: 1px solid #cadcf2; }.mind-branch span { font-size: 11px; font-weight: 700; }.mind-branch i { margin-top: 3px; color: #72849a; font-size: 8px; font-style: normal; }.branch-left { top: 20px; left: 0; }.branch-right { top: 20px; right: 0; }.mind-leaf { width: 83px; min-height: 35px; padding: 6px; color: #6d7f96; background: #fff; border: 1px solid #dbe4ef; font-size: 8px; }.leaf-a { bottom: 2px; left: 28px; }.leaf-b { bottom: 2px; left: 126px; }.leaf-c { bottom: 2px; right: 126px; }.leaf-d { bottom: 2px; right: 28px; }.mindmap::before, .mindmap::after { position: absolute; top: 87px; width: 34%; border-top: 1px solid #aec4df; content: ""; }.mindmap::before { left: 20%; transform: rotate(-20deg); transform-origin: right; }.mindmap::after { right: 20%; transform: rotate(20deg); transform-origin: left; }.mindmap.expanded .mind-leaf { color: #445c78; background: #e8f2ff; border-color: #b8cfea; }.professor-mode { display: grid; grid-template-columns: .8fr 1.2fr; gap: 25px; align-items: center; margin-top: 18px; padding: 25px 28px; background: #f5f0ff; border: 1px solid #e7dff8; border-radius: var(--radius); }.professor-intro { display: flex; gap: 13px; align-items: start; }.professor-intro > span { display: grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; background: #e5dcfa; border-radius: 10px; font-size: 17px; }.professor-intro .eyebrow { color: #7b6ba8; }.professor-intro h3 { margin: 0; font-size: 16px; letter-spacing: -.7px; }.professor-intro p:last-child { margin: 6px 0 0; color: #756d90; font-size: 10px; line-height: 1.65; }.oral-question { display: grid; gap: 7px; }.oral-question > span { color: #7660a8; font: 9px "DM Mono", monospace; }.oral-question b { font-size: 12px; }.oral-question textarea { min-height: 58px; padding: 9px; color: #5e5870; background: rgba(255,255,255,.68); border: 1px solid #d8cdec; border-radius: 8px; outline: none; resize: vertical; font-size: 10px; }.oral-question textarea:focus { border-color: #9581c7; }.oral-question button { justify-self: start; border: 0; padding: 8px 10px; color: #fff; background: #725da7; border-radius: 7px; font-size: 10px; font-weight: 700; }.oral-question > p { min-height: 0; margin: 0; color: #63577d; font-size: 10px; line-height: 1.6; }.oral-question > p.show { min-height: 31px; }

.practice-section { padding: 58px 0; }.auto-tag { background: #e9e4fb; color: #685b98; padding: 6px 10px; border-radius: 7px; font-size: 10px; font-weight: 600; }.practice-layout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(220px, .65fr); gap: 18px; margin-top: 19px; }.quiz-card { background: #24403a; color: #f9fbf8; border-radius: var(--radius); padding: 28px 29px 20px; }.quiz-meta { display: flex; gap: 8px; align-items: center; color: #c2d2c9; font: 10px "DM Mono", monospace; }.difficulty { color: #e7d37e; padding-left: 8px; border-left: 1px solid #567067; }.quiz-card h3 { margin: 15px 0 20px; max-width: 580px; letter-spacing: -.8px; font-size: 18px; line-height: 1.55; }.answers { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.answers button { padding: 12px; color: #e9f0eb; text-align: left; background: #31524a; border: 1px solid #45645c; border-radius: 9px; font-size: 11px; transition: .15s; }.answers button:hover:not(:disabled) { background: #3d645a; border-color: #83aa97; }.answers button span { padding-right: 4px; color: #bad4c4; font-family: "DM Mono", monospace; }.answers button.correct { color: #1f3a30; background: #bce3c9; border-color: #c8f0d6; }.answers button.wrong { background: #784e49; border-color: #bd7770; }.answers button:disabled { cursor: default; }.text-answer { grid-template-columns: 1fr; }.text-answer textarea { resize: vertical; min-height: 92px; padding: 12px; color: #e8f0eb; background: #31524a; border: 1px solid #56746a; border-radius: 9px; outline: none; font-size: 11px; line-height: 1.55; }.text-answer textarea::placeholder { color: #a6bbb0; }.text-answer textarea:focus { border-color: #9fc5ae; }.text-answer button { justify-self: end; padding: 9px 12px; background: #567b6c; }.quiz-feedback { min-height: 0; color: #d2e9d8; font-size: 11px; line-height: 1.6; }.quiz-feedback.show { min-height: 32px; padding: 13px 0 0; }.quiz-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid #426158; margin-top: 14px; padding-top: 14px; color: #a5bbb0; font-size: 10px; }.quiz-footer b { color: #dce9df; }.quiz-footer button { color: #17312a; border: 0; border-radius: 7px; padding: 8px 12px; background: #b9e2c4; font-size: 10px; font-weight: 700; }.quiz-footer button:disabled { color: #87a198; background: #3a5b51; cursor: not-allowed; }
.question-generator { display: flex; align-items: center; gap: 16px; margin-top: 19px; padding: 15px 17px; background: #f4f0fe; border: 1px solid #e4dcf7; border-radius: 15px; }.question-generator > div:first-child { display: grid; gap: 3px; min-width: 155px; }.question-generator b { font-size: 12px; }.question-generator span { color: #786f97; font-size: 9px; }.question-types { display: flex; flex: 1; gap: 6px; }.type-button { display: flex; align-items: center; gap: 4px; min-height: 31px; padding: 0 8px; color: #746d8d; background: #fff; border: 1px solid #ded8ef; border-radius: 7px; font-size: 10px; }.type-button span { color: #8d80c3; font-size: 11px; }.type-button.selected { color: #4b3d78; border-color: #9382d2; box-shadow: 0 0 0 2px #e5def8; }.generate-button { white-space: nowrap; border: 0; border-radius: 8px; padding: 9px 11px; color: #fff; background: #6d5ba8; font-size: 10px; font-weight: 700; }
.learning-score { padding: 27px 24px 22px; background: var(--lavender); border-radius: var(--radius); }.learning-score .eyebrow { color: #746c9b; }.score-main { display: flex; align-items: center; gap: 4px; }.score-main strong { font: 500 54px/.9 "DM Sans", sans-serif; letter-spacing: -3px; }.score-main span { font: 11px/1.2 "DM Mono", monospace; }.bar-chart { height: 94px; display: flex; align-items: end; gap: 7px; padding: 0 0 7px; border-bottom: 1px solid #bcb2e2; margin-top: 18px; }.bar-chart i { display: block; width: 100%; min-width: 7px; border-radius: 3px 3px 0 0; background: #a196cb; }.bar-chart .today { background: #4f9b70; }.chart-labels { display: grid; grid-template-columns: repeat(7, 1fr); padding-top: 5px; color: #7a72a2; font: 8px "DM Mono", monospace; text-align: center; }.score-note { margin: 18px 0 0; color: #665f87; font-size: 11px; line-height: 1.65; }.score-note b { color: #3e784f; }

.mistakes-section { padding: 0 0 58px; }.mistake-count { padding: 6px 9px; color: #a15345; background: #ffe8e1; border-radius: 7px; font-size: 10px; font-weight: 600; }.mistakes-layout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(265px, .7fr); gap: 18px; margin-top: 19px; }.mistake-list { display: grid; gap: 8px; }.mistake-card { width: 100%; padding: 16px 18px 14px; color: var(--ink); text-align: left; background: #fff; border: 1px solid #e4e7e2; border-radius: 13px; transition: .15s; }.mistake-card:hover, .selected-mistake { border-color: #e5b8aa; background: #fffaf8; }.mistake-top, .mistake-bottom { display: flex; align-items: center; gap: 8px; }.mistake-top { color: #7c8580; font: 9px "DM Mono", monospace; }.mistake-top time { margin-left: auto; color: #a6ada8; }.mistake-card h3 { margin: 8px 0 12px; letter-spacing: -.6px; font-size: 13px; font-weight: 600; }.mistake-bottom { color: #8b938e; font-size: 9px; }.wrong-chip { padding: 3px 6px; color: #ae5e50; background: #ffebe5; border-radius: 4px; font-weight: 700; }.mistake-bottom button { margin-left: auto; border: 0; padding: 0; color: #9b604f; background: none; font-size: 10px; font-weight: 700; }.mistake-analysis { padding: 24px; background: #fff0e8; border-radius: var(--radius); }.mistake-analysis .eyebrow { color: #a06b5d; }.mistake-analysis h3 { margin: 0 0 14px; letter-spacing: -.8px; font-size: 18px; }.reason-box { padding: 12px; background: rgba(255,255,255,.55); border-radius: 10px; }.reason-box span { color: #a56f60; font: 9px "DM Mono", monospace; }.reason-box p { margin: 5px 0 0; color: #725e57; font-size: 11px; line-height: 1.7; }.reason-box b { color: #8d493b; }.weak-topic { display: flex; justify-content: space-between; align-items: end; margin: 16px 0; padding: 12px 0; border-bottom: 1px solid #edccbd; border-top: 1px solid #edccbd; }.weak-topic div { display: grid; gap: 3px; }.weak-topic span { color: #a57e72; font-size: 9px; }.weak-topic b { font-size: 12px; }.weak-topic strong { color: #a65847; font: 11px "DM Mono", monospace; }.similar-button { width: 100%; border: 0; border-radius: 8px; padding: 10px; color: #fff; background: #a96454; font-size: 10px; font-weight: 700; }.similar-button span { padding-left: 3px; }.weakness-report { display: grid; grid-template-columns: 1fr 1fr; gap: 33px; margin-top: 18px; padding: 24px 28px; background: #eef5f1; border-radius: var(--radius); }.weakness-report h3 { margin: 0 0 8px; letter-spacing: -.8px; font-size: 17px; }.weakness-report > div > p:last-child { max-width: 350px; margin: 0; color: #728078; font-size: 11px; line-height: 1.7; }.weakness-report > div > p b { color: #3d7653; }.topic-bars { display: grid; gap: 12px; align-content: center; }.topic-bars div { display: grid; grid-template-columns: 108px 1fr 27px; gap: 8px; align-items: center; color: #6d7972; font-size: 10px; }.topic-bars i { height: 7px; overflow: hidden; background: #d5e5db; border-radius: 99px; }.topic-bars b { display: block; height: 100%; background: #75ad88; border-radius: inherit; }.topic-bars div:first-child b { background: #d4826f; }.topic-bars em { color: #65786d; font: 9px "DM Mono", monospace; font-style: normal; }.topic-bars div:first-child em { color: #b06050; }

.analysis-section { padding: 0 0 58px; }.prediction-note { max-width: 218px; color: #87918b; font-size: 10px; line-height: 1.5; text-align: right; }.importance-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 19px; }.importance-card, .audio-card { padding: 24px; background: #fff; border: 1px solid #e4e7e3; border-radius: var(--radius); }.importance-top, .audio-head { display: flex; align-items: center; justify-content: space-between; color: #718178; font: 10px "DM Mono", monospace; }.importance-top span { color: #5f8e69; }.importance-top button { border: 0; color: #6d806f; background: #f0f5f0; border-radius: 5px; padding: 5px 7px; font-size: 9px; }.importance-card h3, .audio-card h3 { margin: 13px 0 14px; letter-spacing: -.8px; font-size: 18px; }.priority-list { display: grid; gap: 7px; }.priority-list > div { display: grid; grid-template-columns: 28px 1fr auto; gap: 8px; align-items: center; padding: 8px; background: #f8faf7; border-radius: 9px; }.priority-rank { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 6px; font: 9px "DM Mono", monospace; }.priority-rank.high { color: #a35748; background: #ffe5de; }.priority-rank.medium { color: #9c7330; background: #fff1cf; }.priority-rank.low { color: #4b7c59; background: #def0e2; }.priority-list div > div { display: grid; gap: 2px; }.priority-list b { font-size: 11px; }.priority-list small { color: #84908a; font-size: 8px; }.priority-list strong { color: #4b875d; font: 11px "DM Mono", monospace; }.priority-list > div:first-child strong { color: #c06351; }.importance-card > p { margin: 14px 0 0; color: #85918a; font-size: 9px; line-height: 1.6; }.audio-card { background: #243b43; border: 0; color: #f0f6f4; }.audio-head { color: #b9ccd0; }.audio-head > div { display: flex; gap: 6px; align-items: center; }.recording-dot { width: 7px; height: 7px; border-radius: 50%; background: #fc846d; box-shadow: 0 0 0 3px rgba(252,132,109,.15); }.audio-card h3 { margin-bottom: 5px; }.audio-card > p { margin: 0; color: #bdcdd0; font-size: 10px; }.audio-wave { height: 46px; display: flex; align-items: center; gap: 3px; margin: 14px 0 10px; }.audio-wave i { flex: 1; min-width: 2px; max-width: 8px; height: 35%; background: #638c93; border-radius: 99px; }.audio-wave i:nth-child(3n) { height: 75%; }.audio-wave i:nth-child(4n) { height: 95%; background: #d9af63; }.audio-wave i:nth-child(5n) { height: 50%; }.audio-moments { display: grid; gap: 6px; }.audio-moments button { display: flex; gap: 7px; align-items: center; width: 100%; padding: 7px; color: #d8e4e1; text-align: left; background: rgba(255,255,255,.07); border: 0; border-radius: 6px; font-size: 9px; }.audio-moments span { color: #99b6b1; font: 9px "DM Mono", monospace; }.audio-moments b { margin-left: auto; color: #f2ce76; font-size: 8px; }.audio-summary { margin-top: 11px; padding: 0; border: 0; color: #bce4d0; background: none; font-size: 10px; font-weight: 700; }.past-paper-card { display: grid; grid-template-columns: 1.15fr .9fr .9fr; gap: 22px; align-items: center; margin-top: 18px; padding: 23px 26px; background: #fff7e9; border: 1px solid #f1e4c7; border-radius: var(--radius); }.past-paper-intro { display: flex; gap: 12px; align-items: start; }.paper-icon { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 38px; color: #af7f37; background: #feecc7; border-radius: 7px; font-size: 18px; }.past-paper-intro .eyebrow { color: #987342; }.past-paper-intro h3 { margin: 0; letter-spacing: -.7px; font-size: 15px; }.past-paper-intro p:last-child { margin: 5px 0 0; color: #8d7c5e; font-size: 10px; line-height: 1.6; }.exam-style { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }.exam-style div { display: grid; gap: 3px; padding: 9px 4px; text-align: center; background: rgba(255,255,255,.58); border-radius: 8px; }.exam-style b { color: #967033; font: 500 20px "DM Sans", sans-serif; }.exam-style span { color: #8d7c60; font-size: 8px; }.past-paper-action { display: grid; gap: 5px; }.past-paper-action > b { width: fit-content; padding: 3px 5px; color: #8a6427; background: #f7e6bc; border-radius: 4px; font-size: 8px; }.past-paper-action > span { color: #75634a; font-size: 10px; line-height: 1.5; }.past-paper-action strong { color: #956b2e; }.past-paper-action button { justify-self: start; margin-top: 2px; border: 0; border-bottom: 1px solid #9c7436; padding: 0; color: #8e682d; background: none; font-size: 9px; font-weight: 700; }

.final-review-section { padding: 0 0 58px; }.final-status { padding: 6px 9px; color: #725aa4; background: #eee7ff; border-radius: 7px; font-size: 10px; font-weight: 600; }.final-review-card { display: grid; grid-template-columns: .85fr 1.15fr; gap: 35px; margin-top: 19px; padding: 31px 34px; color: #f9f8ff; background: #332a52; border-radius: 22px; overflow: hidden; }.final-copy { align-self: center; }.final-stamp { display: inline-block; padding: 5px 7px; color: #e7ddff; background: #51446f; border-radius: 6px; font: 9px "DM Mono", monospace; }.final-copy h3 { margin: 14px 0 10px; letter-spacing: -1.3px; font-size: 25px; line-height: 1.35; }.final-copy p { margin: 0; color: #c7c1da; font-size: 11px; line-height: 1.75; }.final-copy button { margin-top: 17px; border: 0; border-radius: 8px; padding: 10px 12px; color: #312649; background: #e4dafa; font-size: 10px; font-weight: 700; }.final-copy button span { padding-left: 3px; }.final-preview { padding: 17px 19px 12px; color: #352957; background: #faf9ff; border-radius: 13px; transform: rotate(1deg); box-shadow: 8px 8px 0 rgba(26,20,48,.25); }.preview-top { display: flex; justify-content: space-between; margin-bottom: 12px; color: #7c6ca4; font: 9px "DM Mono", monospace; }.preview-top b { color: #4e4372; font-family: "Noto Sans KR", sans-serif; }.preview-item { display: grid; grid-template-columns: 24px 1fr auto; gap: 7px; align-items: center; padding: 10px 0; border-top: 1px solid #e7e3f1; }.preview-item i { display: grid; place-items: center; width: 21px; height: 21px; color: #856ec0; background: #eeeaff; border-radius: 5px; font: 9px "DM Mono", monospace; font-style: normal; }.preview-item div { display: grid; gap: 2px; }.preview-item b { font-size: 10px; }.preview-item span { color: #817b93; font-size: 9px; }.preview-item em { color: #a05a51; font-size: 8px; font-style: normal; }.preview-footer { margin-top: 5px; padding: 9px 0 0; color: #837795; border-top: 1px dashed #d9d1e5; font-size: 9px; text-align: center; }
footer { color: #9da49f; padding: 0 0 35px; font: 10px "DM Mono", monospace; text-align: center; }

.summary-content.ai-text { display: block; color: #50615a; font-size: 12px; line-height: 1.85; white-space: pre-wrap; }

.toast { position: fixed; z-index: 5; bottom: 22px; left: 50%; max-width: calc(100vw - 32px); padding: 11px 15px; color: #fff; background: #284b3c; border-radius: 9px; box-shadow: 0 8px 24px rgba(25, 49, 38, .2); font-size: 11px; opacity: 0; pointer-events: none; transform: translate(-50%, 15px); transition: .2s; }.toast.show { opacity: 1; transform: translate(-50%, 0); }
.chat-fab { position: fixed; z-index: 4; right: 27px; bottom: 25px; display: flex; gap: 7px; align-items: center; border: 0; border-radius: 99px; padding: 12px 16px; color: #fff; background: #426b83; box-shadow: 0 8px 25px rgba(45, 75, 94, .25); font-size: 11px; font-weight: 700; }.chat-fab span { display: grid; place-items: center; width: 16px; height: 16px; color: #d9edfb; background: #5d8ca8; border-radius: 5px; font-size: 10px; }.chat-panel { position: fixed; z-index: 6; right: 25px; bottom: 25px; display: none; width: min(360px, calc(100vw - 32px)); overflow: hidden; background: #fff; border: 1px solid #dce5e8; border-radius: 17px; box-shadow: 0 18px 50px rgba(34, 55, 69, .23); }.chat-panel.open { display: block; animation: chat-in .2s ease-out; }.chat-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 16px; color: #f8fbff; background: #426b83; }.chat-head > div { display: flex; gap: 8px; align-items: center; }.chat-head > div > span { display: grid; place-items: center; width: 24px; height: 24px; color: #d9edfb; background: #5b88a3; border-radius: 7px; font-size: 12px; }.chat-head div div { display: grid; gap: 1px; }.chat-head b { font-size: 11px; }.chat-head small { color: #c7dce7; font-size: 8px; }.chat-head button { border: 0; color: #d9e9f1; background: none; font-size: 20px; line-height: 1; }.chat-messages { display: grid; gap: 8px; min-height: 260px; max-height: 380px; padding: 15px; overflow-y: auto; background: #f7fafb; align-content: start; }.chat-message { max-width: 86%; padding: 10px 11px; border-radius: 11px; font-size: 10px; line-height: 1.65; }.chat-message.ai { color: #4d5e65; background: #e6f0f3; border-top-left-radius: 3px; }.chat-message.user { justify-self: end; color: #fff; background: #5c8499; border-top-right-radius: 3px; }.quick-question { justify-self: start; border: 1px solid #d7e4e8; border-radius: 99px; padding: 6px 9px; color: #607984; background: #fff; font-size: 9px; }.chat-form { display: flex; gap: 7px; padding: 10px; border-top: 1px solid #e4ebed; }.chat-form input { min-width: 0; flex: 1; border: 1px solid #d7e2e5; border-radius: 8px; padding: 9px; color: #465961; outline: none; font-size: 10px; }.chat-form input:focus { border-color: #7ca5b7; }.chat-form button { width: 32px; border: 0; border-radius: 8px; color: #fff; background: #557e93; font-size: 16px; }@keyframes chat-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

dialog { border: 0; max-width: 570px; width: calc(100% - 32px); padding: 35px; color: var(--ink); border-radius: 22px; box-shadow: 0 20px 70px rgba(20, 35, 29, .22); }.modal-close { border: 0; background: none; }.modal-close:first-child { float: right; color: #6d7872; font-size: 26px; line-height: 20px; }dialog::backdrop { background: rgba(20, 31, 26, .38); backdrop-filter: blur(2px); }dialog h2 { margin: 0 0 23px; font-size: 28px; line-height: 1.3; letter-spacing: -1.4px; }.summary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.summary-grid p { min-height: 105px; margin: 0; padding: 15px; color: #69746e; background: #f4f8f4; border-radius: 11px; font-size: 12px; line-height: 1.65; }.summary-grid b { color: #264536; }.primary-button { margin-top: 21px; width: 100%; height: 42px; color: #fff; background: #305f45; border: 0; border-radius: 10px; font-weight: 700; }

@media (max-width: 850px) { .sidebar { display: none; }.content { width: 100%; padding: 0 25px; }.mobile-menu { display: block; border: 0; background: none; padding: 5px 8px 5px 0; font-size: 19px; }.topbar { height: 66px; }.breadcrumb { margin-right: auto; }.top-actions { gap: 5px; }.help-button { display: none; }.intro-grid { grid-template-columns: 1fr 260px; padding: 45px 0 35px; gap: 24px; }.question-generator { flex-wrap: wrap; }.question-types { min-width: 100%; }.ai-summary-layout { grid-template-columns: 215px 1fr; } }
@media (max-width: 640px) { .content { padding: 0 17px; }.intro-grid { display: block; padding: 38px 0 30px; }.welcome h1 { font-size: 34px; }.intro-copy { font-size: 12px; }.exam-card { margin: 34px 7px 0; }.focus-card { padding: 20px 18px 5px; }.focus-header h2, .section-heading h2 { font-size: 18px; }.materials-layout, .practice-layout, .ai-summary-layout, .mistakes-layout, .weakness-report { grid-template-columns: 1fr; }.material-list { border-right: 0; border-bottom: 1px solid var(--line); }.material-detail { padding: 25px 21px; }.summary-source { border-right: 0; border-bottom: 1px solid #dfe9e0; }.summary-workspace { padding: 0 20px 22px; }.practice-section, .section-block, .ai-summary-section { padding-top: 42px; }.quiz-card { padding: 23px 18px 16px; }.quiz-card h3 { font-size: 16px; }.answers { grid-template-columns: 1fr; }.learning-score { min-height: 255px; }.bar-chart { max-width: 280px; }.desktop-only { display: none; }.quiz-footer { align-items: flex-start; }.quiz-footer span { max-width: 55%; line-height: 1.5; }.question-generator { display: grid; }.question-types { display: grid; grid-template-columns: 1fr 1fr; }.generate-button { width: 100%; }.mistakes-section { padding-bottom: 42px; }.weakness-report { gap: 22px; padding: 22px; } }

@media (max-width: 850px) { .plan-layout, .memory-layout { grid-template-columns: 1fr; }.importance-layout { grid-template-columns: 1fr; }.past-paper-card { grid-template-columns: 1fr 1fr; }.past-paper-intro { grid-column: 1 / -1; }.final-review-card { grid-template-columns: 1fr .9fr; gap: 22px; } }
@media (max-width: 640px) { .plan-section, .memory-section { padding-top: 42px; }.review-flow { padding: 20px 17px; }.review-steps { grid-template-columns: 1fr 1fr; }.review-step:not(:last-child)::after { display: none; }.plan-calendar { grid-template-columns: repeat(3, 1fr); }.memory-layout { gap: 12px; }.flashcard-panel, .mindmap-panel { padding: 18px; }.mindmap { transform: scale(.87); transform-origin: top center; margin-bottom: -30px; }.professor-mode { grid-template-columns: 1fr; gap: 18px; padding: 21px; }.analysis-section { padding-bottom: 42px; }.prediction-note { font-size: 9px; }.importance-card, .audio-card { padding: 20px; }.past-paper-card, .final-review-card { grid-template-columns: 1fr; }.past-paper-card { padding: 21px; gap: 18px; }.final-review-card { padding: 25px 21px; }.final-preview { transform: none; }.final-copy h3 { font-size: 22px; }.chat-fab { right: 16px; bottom: 17px; }.chat-panel { right: 16px; bottom: 16px; }.final-review-section { padding-bottom: 45px; } }

/* 2026 refresh — soft utility, with a focused study-app feel */
:root {
  --ink: #25233a;
  --muted: #78768d;
  --paper: #f7f7fc;
  --card: rgba(255, 255, 255, .88);
  --line: #e8e8f1;
  --mint: #c9f6df;
  --mint-deep: #41b887;
  --yellow: #fff0ab;
  --coral: #ff8f7c;
  --blue: #cad8ff;
  --lavender: #e5ddff;
  --radius: 24px;
}

body {
  background:
    radial-gradient(circle at 76% 4%, rgba(213, 204, 255, .38), transparent 23rem),
    radial-gradient(circle at 35% 39%, rgba(208, 250, 230, .38), transparent 25rem),
    var(--paper);
  letter-spacing: -.015em;
}

button, a, input, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid rgba(103, 88, 230, .35); outline-offset: 3px; }

.sidebar {
  width: 258px;
  flex-basis: 258px;
  padding: 25px 15px 18px;
  color: #d8d9ed;
  background: #222334;
  border: 0;
  box-shadow: 14px 0 35px rgba(54, 50, 88, .08);
}
.brand { margin: 3px 12px 42px; color: #fff; font-size: 21px; letter-spacing: -1.2px; }
.brand-mark { width: 26px; height: 26px; justify-content: center; align-items: center; gap: 3px; border-radius: 9px; background: linear-gradient(135deg, #b3a5ff, #74e4b1); }
.brand-mark i { width: 4px; background: #242438; }.brand-mark i:nth-child(1) { height: 9px; }.brand-mark i:nth-child(2) { height: 15px; }.brand-mark i:nth-child(3) { height: 11px; }
.main-nav { gap: 4px; }
.nav-item { height: 43px; padding: 0 12px; color: #aeb0c7; border-radius: 11px; font-size: 13px; }
.nav-item svg { width: 17px; }
.nav-item:hover { color: #fff; background: rgba(255,255,255,.07); }
.nav-item.active { color: #fff; background: linear-gradient(100deg, rgba(143, 122, 244, .58), rgba(93, 197, 155, .34)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.09); }
.nav-badge { color: #fff; background: #ff7f73; box-shadow: 0 2px 8px rgba(255,127,115,.3); }
.study-streak { padding: 11px; margin: 20px 4px 15px; color: #aeb1c8; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.075); border-radius: 15px; }
.study-streak b { color: #fff; }.streak-icon { color: #ffdd79; background: rgba(255,218,117,.14); border-radius: 10px; }
.profile { padding: 15px 6px 0; color: #eef0ff; border-top-color: rgba(255,255,255,.1); }.profile .avatar { color: #2f2c43; background: linear-gradient(135deg, #ffd4b5, #eeb7eb); }.profile svg { color: #8f93b2; }

.content { width: min(1220px, calc(100vw - 258px)); padding: 0 62px 0 58px; }
.topbar { position: sticky; z-index: 3; top: 0; height: 78px; border-color: rgba(231,231,241,.82); background: rgba(247,247,252,.76); backdrop-filter: blur(18px); }
.breadcrumb { color: #a09eb0; }.breadcrumb strong { color: #37354b; }.help-button { padding: 8px 12px; color: #5a5870; background: rgba(255,255,255,.78); border: 1px solid #e6e5ee; border-radius: 10px; font-size: 11px; box-shadow: 0 3px 10px rgba(41,38,74,.04); }
.icon-button { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; color: #514f65; background: rgba(255,255,255,.7); border: 1px solid #e6e5ee; border-radius: 11px; }.icon-button i { top: 7px; right: 7px; border-color: #fff; background: #ff7a76; }

.intro-grid { gap: 52px; padding: 62px 0 40px; }
.eyebrow { color: #78758f; letter-spacing: 1.1px; }
.welcome h1 { max-width: 560px; font-size: clamp(35px, 3.65vw, 51px); line-height: 1.14; letter-spacing: -3.4px; }.welcome h1 em { color: #6e59d7; font-style: normal; text-decoration: underline; text-decoration-color: #bdeecf; text-decoration-thickness: 9px; text-underline-offset: -5px; }
.intro-copy { color: #737186; font-size: 13px; }
.exam-card { position: relative; min-height: 194px; overflow: hidden; padding: 23px 24px 20px; color: #2d2940; background: linear-gradient(135deg, #fff1a3, #ffd9b1); border: 1px solid rgba(255,255,255,.62); border-radius: 25px; transform: none; box-shadow: 0 16px 35px rgba(189,150,91,.17); }
.exam-card::after { position: absolute; right: -33px; bottom: -47px; width: 135px; height: 135px; border: 17px solid rgba(255,255,255,.36); border-radius: 50%; content: ""; }.exam-card > * { position: relative; z-index: 1; }.days strong { font-size: 61px; }.exam-line { border-color: rgba(105,94,57,.36); }

.focus-card { padding: 25px 28px 8px; border: 1px solid rgba(229,229,240,.95); border-radius: 25px; background: rgba(255,255,255,.82); box-shadow: 0 16px 35px rgba(53,50,88,.055); backdrop-filter: blur(12px); }.focus-header h2, .section-heading h2 { letter-spacing: -1.5px; }.progress-label { padding: 6px 9px; color: #767489; background: #f2f1fb; border-radius: 8px; font-size: 10px; }.progress-label b { color: #6957d3; }
.task { min-height: 51px; border-color: #f0eff5; }.task:hover { margin: 0 -8px; padding: 0 8px; background: #fafaff; border-radius: 10px; }.task .check { border-color: #d4d2e2; border-radius: 7px; }.task.complete .check, .task input:checked + .check { background: #7562dc; border-color: #7562dc; }.task small { padding: 4px 7px; color: #8e8ba0; background: #f3f2f7; border-radius: 6px; }

.plan-section, .section-block, .ai-summary-section, .memory-section { padding-top: 68px; }
.outline-button { height: 37px; padding: 0 12px; color: #514e67; border-color: #dedde9; border-radius: 11px; background: rgba(255,255,255,.85); box-shadow: 0 3px 10px rgba(41,38,74,.035); }.outline-button:hover { color: #5d48d3; border-color: #aa9df0; background: #fff; }
.review-flow { padding: 25px; border-color: #d9ece1; background: linear-gradient(135deg, #f4fff7, #e7f8ef); box-shadow: 0 12px 28px rgba(74,151,105,.07); }.smart-dot { color: #fff; background: linear-gradient(135deg, #6d58de, #57c890); }.review-head > span { padding: 5px 7px; color: #4b8a69; background: rgba(255,255,255,.75); border-radius: 6px; }.review-step { border-color: rgba(203,231,213,.92); box-shadow: 0 5px 14px rgba(54,126,77,.04); }.review-step.now { color: #fff; background: linear-gradient(135deg, #6b58db, #7867e5); border-color: transparent; }.review-step.now i, .review-step.now b, .review-step.now span { color: #fff; }.review-step:not(:last-child)::after { border-color: #9bc5aa; }
.coach-card { position: relative; overflow: hidden; background: linear-gradient(140deg, #373151, #5d4d99); box-shadow: 0 16px 30px rgba(65,54,119,.17); }.coach-card::after { position: absolute; top: -46px; right: -38px; width: 130px; height: 130px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; content: ""; }.coach-card > * { position: relative; z-index: 1; }.coach-top > span { color: #f3e8ff; background: rgba(255,255,255,.16); }.coach-signal { background: rgba(255,255,255,.12); }
.plan-schedule-head > span { color: #6857d4; background: #eeecff; }.cal-date { min-height: 104px; border-color: #e8e7f0; border-radius: 13px; box-shadow: 0 4px 12px rgba(51,48,81,.035); transition: transform .2s, box-shadow .2s; }.cal-date:hover { z-index: 1; transform: translateY(-3px); box-shadow: 0 12px 20px rgba(51,48,81,.09); }.cal-date.today { color: #fff; background: linear-gradient(145deg, #6f5ee0, #8a79f0); border-color: transparent; }.cal-date.today span, .cal-date.today i, .cal-date.today b { color: #fff; }.cal-date.today em { color: #5545bb; background: #fff; }.cal-date.final { background: #f3efff; }.cal-date.exam { background: #fff6e0; }

.materials-layout, .ai-summary-layout { border-color: #e7e6ef; border-radius: 23px; box-shadow: 0 14px 30px rgba(44,41,74,.045); }.material-list { padding: 11px; background: rgba(253,253,255,.7); border-color: #ecebf2; }.material-card { border-radius: 13px; }.material-card:hover { background: #f5f3ff; }.material-card.selected { background: linear-gradient(100deg, #f0edff, #ecfbf3); border-color: #dbd4ff; box-shadow: 0 5px 12px rgba(87,74,164,.06); }.file-icon { border-radius: 10px; }.material-detail { background: linear-gradient(125deg, #fdfdff, #f7f5ff); }.status-dot { box-shadow: 0 0 0 4px rgba(81,203,133,.12); }.material-detail h3 { font-size: 23px; }.key-points span { color: #6959d2; }.text-button { color: #6452d6; }

.ai-summary-layout { background: rgba(255,255,255,.86); }.summary-source { background: linear-gradient(180deg, #f4f2ff, #f4fbf7); border-color: #e5e1f5; }.source-file { border-radius: 7px; }.source-file:hover { background: rgba(255,255,255,.66); }.summary-source .primary-button, .primary-button { background: linear-gradient(100deg, #6654d6, #7563e2); box-shadow: 0 10px 20px rgba(96,78,203,.18); }.summary-source .primary-button:hover, .primary-button:hover { filter: brightness(1.05); transform: translateY(-1px); }.summary-tab.active { color: #5a48cb; }.summary-tab.active::after { height: 3px; border-radius: 99px; background: linear-gradient(90deg, #6b57dd, #5fcf9e); }.copy-button { color: #6152c5; background: #efedff; }.summary-content mark { color: #3d3774; background: #e5e0ff; }

.flashcard-panel, .mindmap-panel { border-color: #e7e6ef; border-radius: 23px; box-shadow: 0 12px 25px rgba(44,41,74,.04); }.flashcard-panel { background: linear-gradient(145deg, #fff, #fbfcff); }.mindmap-panel { background: linear-gradient(145deg, #f5f3ff, #eef8ff); }.flash-head button, .mindmap-head button { color: #5d4ec5; background: #eeebff; }.flashcard { border: 0; background: linear-gradient(135deg, #7770ee, #8d81f1); box-shadow: 0 14px 22px rgba(91,78,197,.18); }.flashcard .flash-label, .flashcard strong, .flashcard i { color: #fff; }.flashcard:hover { border: 0; transform: translateY(-2px); }.flashcard.revealed { color: #503e73; background: linear-gradient(135deg, #fff1ba, #ffd7b6); box-shadow: 0 14px 22px rgba(183,133,70,.16); }.flashcard.revealed .flash-label, .flashcard.revealed i { color: #967441; }.flashcard.revealed strong { color: #583f72; }.mind-root { background: linear-gradient(145deg, #6654d7, #7a63de); box-shadow: 0 0 0 9px rgba(158,145,244,.17), 0 12px 24px rgba(91,76,194,.18); }.mind-branch { color: #4e4692; border-color: #d8d2ff; background: rgba(255,255,255,.72); }.mind-branch i { color: #7771a3; }.mind-leaf { color: #696387; border-color: #e1def5; }.mindmap::before, .mindmap::after { border-color: #b9b2e7; }
.professor-mode { border-color: #e4dcff; background: linear-gradient(100deg, #f5f1ff, #edf8f2); }.professor-intro > span { background: linear-gradient(135deg, #e5ddff, #c6f5da); }.professor-intro .eyebrow, .oral-question > span { color: #6b58d1; }.oral-question textarea { border-color: #ded8f7; background: rgba(255,255,255,.82); }.oral-question button { background: #6654d7; }

.question-generator { border-color: #e2dcff; border-radius: 18px; background: linear-gradient(100deg, #f4f1ff, #f1fbf5); }.question-generator span { color: #777091; }.type-button { border-color: #dfdbea; border-radius: 9px; }.type-button.selected { color: #5543bf; border-color: #a89cf0; background: #fff; box-shadow: 0 0 0 3px rgba(163,150,243,.18); }.generate-button { background: linear-gradient(100deg, #6955d8, #7b67e4); box-shadow: 0 8px 16px rgba(102,84,214,.2); }
.quiz-card { border-radius: 23px; box-shadow: 0 15px 32px rgba(27,71,54,.12); }.learning-score { border-radius: 23px; background: linear-gradient(155deg, #e8e1ff, #d9efff); box-shadow: 0 15px 30px rgba(83,73,142,.09); }.bar-chart .today { background: #705cde; }

.mistake-card, .importance-card { border-color: #e7e6ef; border-radius: 16px; box-shadow: 0 5px 13px rgba(44,41,74,.025); }.mistake-card:hover, .selected-mistake { border-color: #ffc6bb; box-shadow: 0 10px 18px rgba(189,93,77,.06); }.mistake-analysis { border-radius: 23px; background: linear-gradient(145deg, #fff0eb, #fff6e7); }.weakness-report { border-radius: 23px; background: linear-gradient(100deg, #eef8f2, #f3f0ff); }.importance-card { padding: 25px; }.audio-card { border-radius: 23px; background: linear-gradient(145deg, #29273c, #3a355c); box-shadow: 0 16px 30px rgba(42,38,70,.15); }.past-paper-card { border-radius: 23px; background: linear-gradient(100deg, #fff9e9, #fff1df); box-shadow: 0 13px 28px rgba(159,117,50,.06); }
.final-review-card { position: relative; border-radius: 27px; background: linear-gradient(125deg, #2c2945, #514278); box-shadow: 0 18px 38px rgba(56,45,93,.17); }.final-review-card::before { position: absolute; width: 250px; height: 250px; top: -140px; right: -70px; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; content: ""; }.final-review-card > * { position: relative; z-index: 1; }.final-copy button { color: #4d3d80; background: linear-gradient(100deg, #e5dcff, #c9f5dc); }.final-preview { box-shadow: 11px 12px 0 rgba(20,17,41,.24); }

.chat-fab { right: 30px; bottom: 28px; padding: 13px 17px; background: linear-gradient(105deg, #6554d5, #4ebf8c); box-shadow: 0 13px 28px rgba(77,67,171,.26); }.chat-fab span { color: #fff; background: rgba(255,255,255,.18); }.chat-panel { border-color: #e1dff0; border-radius: 21px; box-shadow: 0 24px 58px rgba(50,43,88,.24); }.chat-head { background: linear-gradient(105deg, #6554d5, #5cba91); }.chat-message.user { background: #6a58d9; }.chat-message.ai { color: #4d4962; background: #f0eeff; }.chat-form button { background: #6755d7; }

@media (max-width: 850px) {
  .content { width: 100%; padding: 0 25px; }
  .topbar { background: rgba(247,247,252,.87); }
}
@media (max-width: 640px) {
  .content { padding: 0 17px; }
  .intro-grid { padding-top: 40px; }
  .welcome h1 { font-size: 37px; }
  .exam-card { margin-right: 0; margin-left: 0; }
  .focus-card { padding-right: 18px; padding-left: 18px; }
  .task:hover { margin: 0 -3px; padding: 0 3px; }
  .cal-date { min-height: 102px; }
}

/* Focus tools — intentionally separated from the long dashboard. */
.nav-item.tool-nav { width: 100%; border: 0; background: transparent; text-align: left; }
.nav-label { margin: 15px 12px 3px; color: #777b99; font: 600 9px "DM Mono", monospace; letter-spacing: 1.2px; text-transform: uppercase; }

.quick-tools { padding-top: 25px; }
.review-tools { padding-top: 52px; }
.quick-tools-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.quick-tools-heading h2 { margin: 0; color: #302e45; font-size: 18px; letter-spacing: -1px; }
.quick-tools-heading > span { padding-bottom: 2px; color: #88859a; font-size: 10px; }
.quick-tools-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.quick-tool-card { display: grid; grid-template-columns: auto 1fr auto; min-width: 0; gap: 13px; align-items: center; padding: 17px 18px; color: #39364d; text-align: left; border: 1px solid #e6e2f4; border-radius: 18px; background: rgba(255,255,255,.77); box-shadow: 0 9px 20px rgba(49,43,92,.045); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.quick-tool-card:hover { transform: translateY(-3px); box-shadow: 0 17px 25px rgba(49,43,92,.09); }
.quick-tool-card.memory-tool:hover { border-color: #aca0fb; }.quick-tool-card.professor-tool:hover { border-color: #9fddb9; }
.quick-tool-icon { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 12px; font-size: 17px; }.memory-tool .quick-tool-icon { color: #fff; background: linear-gradient(135deg, #7564df, #9a88f1); }.professor-tool .quick-tool-icon { background: linear-gradient(135deg, #d9f7e5, #d5e4ff); }
.quick-tool-copy { display: grid; min-width: 0; gap: 3px; }.quick-tool-copy b { font-size: 13px; }.quick-tool-copy small { color: #7b788f; font-size: 10px; line-height: 1.45; }
.quick-tool-action { align-self: end; color: #6552d0; font-size: 10px; font-weight: 700; white-space: nowrap; }.professor-tool .quick-tool-action { color: #398a65; }.quick-tool-action i { font-size: 14px; font-style: normal; }

.tool-hub-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 19px; }
.tool-hub-card { position: relative; min-height: 248px; overflow: hidden; padding: 26px; border: 1px solid #e4e2f0; border-radius: 23px; background: rgba(255,255,255,.78); box-shadow: 0 12px 25px rgba(44,41,74,.045); }
.tool-hub-card::after { position: absolute; right: -43px; bottom: -66px; width: 170px; height: 170px; border: 1px solid rgba(101,84,214,.13); border-radius: 50%; content: ""; }.tool-hub-card > * { position: relative; z-index: 1; }
.tool-hub-card > span { display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 17px; border-radius: 11px; font-size: 16px; }.memory-hub { background: linear-gradient(145deg, #f7f5ff, #fbfcff); }.memory-hub > span { color: #fff; background: linear-gradient(135deg, #735fdd, #9c8bf0); }.professor-hub { background: linear-gradient(145deg, #f2fff7, #f5f3ff); }.professor-hub > span { background: #e0f5e8; }
.tool-hub-card .eyebrow { margin-bottom: 8px; }.memory-hub .eyebrow { color: #7060cc; }.professor-hub .eyebrow { color: #4a9570; }.tool-hub-card h3 { margin: 0; color: #343046; font-size: 20px; line-height: 1.35; letter-spacing: -1.1px; }.tool-hub-card > p:not(.eyebrow) { max-width: 300px; margin: 10px 0 18px; color: #77748a; font-size: 11px; line-height: 1.7; }.tool-hub-card button { display: inline-flex; gap: 5px; align-items: center; border: 0; border-radius: 9px; padding: 9px 11px; color: #fff; background: #6957d7; font-size: 10px; font-weight: 700; }.tool-hub-card button i { font-size: 14px; font-style: normal; }.professor-hub button { background: #49a978; }

body.study-tool-open { overflow: hidden; }
body.study-tool-open .chat-fab, body.study-tool-open .chat-panel { display: none !important; }
.study-tool-view { position: fixed; z-index: 50; inset: 0; display: none; overflow-y: auto; padding: 24px; color: #302d45; background: radial-gradient(circle at 88% 10%, rgba(211,200,255,.48), transparent 25rem), radial-gradient(circle at 14% 100%, rgba(187,245,214,.48), transparent 28rem), #f8f8fd; }
.study-tool-view.is-open { display: block; animation: focus-view-in .28s ease-out; }.study-tool-shell { width: min(1080px, 100%); min-height: calc(100vh - 48px); margin: 0 auto; }.study-tool-header { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 55px; }.back-to-dashboard { justify-self: start; display: inline-flex; gap: 7px; align-items: center; border: 0; padding: 9px 11px; color: #68657b; background: rgba(255,255,255,.76); border: 1px solid #e3e1ec; border-radius: 10px; font-size: 10px; font-weight: 700; }.back-to-dashboard span { font-size: 16px; }.tool-subject { display: grid; gap: 2px; text-align: center; }.tool-subject span { color: #89869c; font: 9px "DM Mono", monospace; }.tool-subject b { color: #423f55; font-size: 12px; }.tool-timer { justify-self: end; padding: 7px 10px; color: #5b51ae; background: rgba(236,233,255,.82); border-radius: 8px; font: 9px "DM Mono", monospace; }
.study-tool-intro { display: flex; align-items: end; justify-content: space-between; gap: 40px; padding: 45px 3px 26px; }.study-tool-intro h2, .professor-focus-intro h2 { margin: 0; color: #312e46; font-size: clamp(30px, 4vw, 48px); line-height: 1.13; letter-spacing: -2.8px; }.study-tool-intro h2 em, .professor-focus-intro h2 em { color: #6c58d8; font-style: normal; }.study-tool-intro > div > p:last-child { margin: 15px 0 0; color: #77748a; font-size: 12px; }.tool-goal { display: grid; gap: 5px; min-width: 215px; padding: 17px 18px; background: rgba(255,255,255,.7); border: 1px solid #e6e4ef; border-radius: 15px; box-shadow: 0 12px 25px rgba(47,42,88,.05); }.tool-goal span { color: #756b9b; font: 9px "DM Mono", monospace; }.tool-goal b { font-size: 13px; }.tool-goal small { color: #8c899d; font-size: 9px; line-height: 1.45; }
.memory-focus-grid { display: grid; grid-template-columns: minmax(330px,.95fr) minmax(360px,1.05fr); gap: 20px; }.focus-flash-panel, .focus-mindmap-panel { min-height: 430px; padding: 25px; }.focus-flash-panel .flashcard { min-height: 247px; margin-top: 22px; padding: 26px; }.focus-flash-panel .flashcard strong { margin-top: 36px; font-size: 25px; }.focus-flash-panel .flashcard.revealed strong { margin-top: 15px; font-size: 18px; }.focus-flash-panel .flashcard.revealed p { margin-top: 18px; font-size: 13px; }.recall-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 18px; }.recall-actions button { min-height: 38px; border-radius: 10px; font-size: 10px; font-weight: 700; }.needs-review { color: #b36056; background: #fff0ec; border: 1px solid #ffd9d1; }.remembered { color: #fff; background: linear-gradient(100deg, #6957d7, #5abf90); border: 0; }.focus-mindmap-panel .mindmap { height: 273px; margin-top: 25px; }.focus-mindmap-panel .mind-root { top: 95px; }.focus-mindmap-panel .mindmap::before, .focus-mindmap-panel .mindmap::after { top: 100px; }.mindmap-note { display: flex; gap: 8px; align-items: start; margin-top: 4px; padding: 11px; color: #6d6982; background: rgba(255,255,255,.66); border: 1px solid #e6e3f3; border-radius: 10px; }.mindmap-note span { color: #6b57d6; }.mindmap-note p { margin: 0; font-size: 10px; line-height: 1.6; }.mindmap-note b { color: #494565; }

.professor-focus-layout { display: grid; grid-template-columns: minmax(270px,.8fr) minmax(390px,1.2fr); gap: 46px; align-items: center; min-height: calc(100vh - 150px); }.professor-focus-intro { padding: 15px 0 15px 20px; }.professor-orb { display: grid; place-items: center; width: 57px; height: 57px; margin-bottom: 26px; background: linear-gradient(145deg, #e7ddff, #c6f5d9); border-radius: 18px; box-shadow: 0 12px 25px rgba(96,78,187,.13); font-size: 25px; }.professor-focus-intro .eyebrow { color: #7562cf; }.professor-focus-intro > p:last-of-type { max-width: 300px; margin: 18px 0 25px; color: #77748b; font-size: 12px; line-height: 1.75; }.oral-progress { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; max-width: 292px; padding: 14px 15px; background: rgba(255,255,255,.68); border: 1px solid #e5e2ef; border-radius: 14px; }.oral-progress span { color: #8b879b; font-size: 10px; }.oral-progress b { font-size: 13px; }.oral-progress b i { color: #9995a8; font-style: normal; font-weight: 400; }.oral-progress > div { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }.oral-progress > div i { height: 4px; background: #e2dff0; border-radius: 99px; }.oral-progress > div i:first-child { background: linear-gradient(90deg, #6d59d7, #5fcb96); }
.professor-question-card { padding: 30px; background: rgba(255,255,255,.89); border: 1px solid #e5e2f1; border-radius: 25px; box-shadow: 0 22px 50px rgba(47,42,88,.1); }.professor-question-top { display: flex; justify-content: space-between; align-items: center; color: #79748e; font: 9px "DM Mono", monospace; }.professor-question-top span:first-child { padding: 6px 8px; color: #6151c5; background: #efedff; border-radius: 7px; }.professor-question-card > b { display: block; max-width: 590px; margin: 26px 0 19px; color: #39354e; font-size: clamp(20px,2.7vw,29px); line-height: 1.45; letter-spacing: -1.25px; }.professor-question-card textarea { width: 100%; min-height: 138px; resize: vertical; padding: 15px; color: #49455d; border: 1px solid #ded9f1; border-radius: 14px; outline: none; background: #fafaff; font-family: inherit; font-size: 12px; line-height: 1.6; }.professor-question-card textarea:focus { border-color: #9b8ee9; box-shadow: 0 0 0 3px rgba(112,94,222,.11); }.professor-question-card > button { width: 100%; min-height: 46px; margin-top: 11px; border: 0; border-radius: 12px; color: #fff; background: linear-gradient(100deg, #6957d7, #7965e3); font-size: 12px; font-weight: 700; }.professor-question-card > button span { padding-left: 4px; font-size: 16px; }.professor-question-card #oral-feedback { display: none; margin: 14px 0 0; padding: 13px 14px; color: #5b5770; background: #f1f8f3; border: 1px solid #d7eddf; border-radius: 12px; font-size: 11px; line-height: 1.7; }.professor-question-card #oral-feedback.show { display: block; }.answer-tip { display: flex; gap: 8px; align-items: start; margin-top: 16px; }.answer-tip span { padding: 3px 5px; color: #6554cc; background: #efecff; border-radius: 4px; font: 8px "DM Mono", monospace; }.answer-tip p { margin: 0; color: #8a8799; font-size: 9px; line-height: 1.5; }
@keyframes focus-view-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 850px) { .quick-tools-grid, .tool-hub-grid, .memory-focus-grid, .professor-focus-layout { grid-template-columns: 1fr; }.study-tool-intro { padding-top: 30px; }.professor-focus-layout { gap: 25px; align-items: start; padding: 24px 0; }.professor-focus-intro { padding-left: 3px; }.professor-question-card { max-width: 720px; }.focus-flash-panel, .focus-mindmap-panel { min-height: 0; }.quick-tool-card { min-height: 82px; } }
@media (max-width: 640px) { .quick-tools { padding-top: 19px; }.review-tools { padding-top: 42px; }.quick-tools-heading > span { display: none; }.quick-tool-card { grid-template-columns: auto 1fr; }.quick-tool-action { grid-column: 2; justify-self: start; align-self: center; }.tool-hub-card { min-height: 225px; padding: 22px; }.study-tool-view { padding: 12px; }.study-tool-shell { min-height: calc(100vh - 24px); }.study-tool-header { grid-template-columns: 1fr auto; }.tool-subject { display: none; }.tool-timer { padding: 6px 8px; }.study-tool-intro { display: grid; gap: 17px; padding: 34px 4px 20px; }.study-tool-intro h2, .professor-focus-intro h2 { font-size: 35px; letter-spacing: -2.2px; }.tool-goal { min-width: 0; }.memory-focus-grid { gap: 13px; }.focus-flash-panel, .focus-mindmap-panel { padding: 18px; border-radius: 18px; }.focus-flash-panel .flashcard { min-height: 226px; margin-top: 17px; padding: 20px; }.focus-flash-panel .flashcard strong { margin-top: 31px; font-size: 21px; }.focus-mindmap-panel .mindmap { transform: scale(.88); transform-origin: top center; margin-bottom: -25px; }.professor-focus-layout { min-height: auto; padding-top: 20px; }.professor-orb { margin-bottom: 17px; }.professor-focus-intro > p:last-of-type { margin: 14px 0 20px; }.professor-question-card { padding: 21px 18px; border-radius: 19px; }.professor-question-card > b { margin: 20px 0 16px; font-size: 22px; }.professor-question-card textarea { min-height: 125px; }.mindmap-note { margin-top: 0; } }

/* The start action stays large; the explanation is deliberately secondary. */
.quick-tool-card { display: grid; grid-template-columns: 1fr; gap: 0; padding: 0; overflow: hidden; }
.quick-tool-start { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; width: 100%; gap: 13px; align-items: center; padding: 17px 18px 13px; color: inherit; text-align: left; text-decoration: none; border: 0; background: transparent; }
.quick-tool-start:hover { background: rgba(255,255,255,.46); }.quick-tool-start .quick-tool-icon { flex: 0 0 auto; }.quick-tool-start .quick-tool-action { align-self: center; }
.tool-preview-link { justify-self: start; display: inline-flex; gap: 5px; align-items: center; margin: 0 18px 13px 68px; padding: 3px 0; color: #817d95; border: 0; border-bottom: 1px solid #d9d5e9; background: transparent; font-size: 9px; }.tool-preview-link:hover { color: #5f4dcc; border-color: #9f92e9; }.professor-tool .tool-preview-link:hover { color: #398a65; border-color: #8ccfa8; }.tool-preview-link span { font-size: 11px; }

.tool-hub-card[id] { scroll-margin-top: 96px; }.tool-hub-actions { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }.tool-hub-card .hub-preview-link { color: #6e6982; border: 0; padding: 7px 2px; background: transparent; box-shadow: none; font-size: 9px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }.tool-hub-card .hub-preview-link:hover { color: #5d49ca; }.professor-hub .hub-preview-link:hover { color: #37825f; }

.tool-preview-modal { max-width: 510px; padding: 30px; background: linear-gradient(145deg, #ffffff, #f9f8ff); }.tool-preview-close { position: absolute; top: 17px; right: 17px; border: 0; color: #77738c; background: transparent; font-size: 24px; line-height: 1; }.tool-preview-icon { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 17px; color: #fff; background: linear-gradient(135deg, #7663de, #9a88f1); border-radius: 13px; font-size: 18px; }.tool-preview-modal .eyebrow { margin-bottom: 8px; color: #7060c6; }.tool-preview-modal h2 { margin-bottom: 11px; color: #37334e; font-size: 26px; letter-spacing: -1.5px; }.tool-preview-description { margin: 0; color: #77738a; font-size: 12px; line-height: 1.7; }.tool-preview-steps { display: grid; gap: 8px; margin-top: 19px; }.tool-preview-step { display: grid; grid-template-columns: 27px 1fr; gap: 10px; align-items: start; padding: 11px 12px; color: #66627a; background: rgba(244,242,255,.78); border: 1px solid #e5e1f4; border-radius: 11px; font-size: 10px; line-height: 1.55; }.tool-preview-step > span { display: grid; place-items: center; width: 24px; height: 24px; color: #fff; background: #7662d8; border-radius: 7px; font: 9px "DM Mono", monospace; }.tool-preview-step b { display: block; margin-bottom: 1px; color: #423e58; font-size: 10px; }.tool-preview-modal .primary-button { margin-top: 19px; }.tool-preview-modal .primary-button span { padding-left: 3px; font-size: 15px; }
@media (max-width: 640px) { .quick-tool-start { grid-template-columns: auto minmax(0,1fr); }.quick-tool-start .quick-tool-action { grid-column: 2; justify-self: start; }.tool-preview-link { margin-left: 68px; }.tool-preview-modal { padding: 27px 22px; }.tool-preview-modal h2 { font-size: 24px; } }

/* Course setup and per-unit material organization. */
.materials-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.unit-picker { display: flex; align-items: center; gap: 7px; min-height: 37px; padding: 0 9px; color: #77748b; border: 1px solid #e1dff0; border-radius: 11px; background: rgba(255,255,255,.72); font-size: 9px; }
.unit-picker span { white-space: nowrap; }.unit-picker select { max-width: 124px; color: #4e4a62; border: 0; outline: 0; background: transparent; font: 600 10px inherit; }
.quiet-button { height: 37px; padding: 0 8px; color: #706b84; border: 0; border-bottom: 1px solid #d8d3e7; background: transparent; font-size: 10px; }
.quiet-button:hover { color: #5f4dcc; border-color: #9f92e9; }
.course-settings-modal { max-width: 610px; padding: 31px; color: #38344d; background: linear-gradient(145deg, #fff, #f8f7ff); }
.course-settings-close { position: absolute; top: 16px; right: 18px; border: 0; color: #77738b; background: transparent; font-size: 25px; line-height: 1; }
.course-settings-modal .eyebrow { margin-bottom: 8px; color: #7060c6; }.course-settings-modal h2 { margin-bottom: 10px; color: #37334e; font-size: 29px; letter-spacing: -1.7px; }
.course-settings-copy { max-width: 440px; margin: 0; color: #787489; font-size: 12px; line-height: 1.7; }
.course-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 22px; }
.course-form-grid label { display: grid; gap: 7px; }.course-form-grid label:first-child { grid-column: 1 / -1; }.course-form-grid label > span, .unit-manager b { color: #555168; font-size: 11px; font-weight: 700; }
.course-form-grid input, .course-form-grid select, .unit-add-row input { width: 100%; height: 42px; padding: 0 11px; color: #464257; border: 1px solid #dedbef; border-radius: 10px; outline: 0; background: rgba(255,255,255,.9); font-size: 12px; }
.course-form-grid input:focus, .course-form-grid select:focus, .unit-add-row input:focus { border-color: #9b8ee9; box-shadow: 0 0 0 3px rgba(112,94,222,.11); }
.unit-manager { margin-top: 21px; padding: 16px; border: 1px solid #e4e0f2; border-radius: 15px; background: rgba(244,242,255,.68); }.unit-manager > div:first-child { display: grid; gap: 3px; }.unit-manager > div:first-child span { color: #7c788e; font-size: 10px; }
.unit-add-row { display: grid; grid-template-columns: 1fr auto; gap: 7px; margin-top: 13px; }.unit-add-row button { min-width: 51px; color: #fff; border: 0; border-radius: 10px; background: #6a58d8; font-size: 10px; font-weight: 700; }
.unit-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }.unit-chip { display: inline-flex; gap: 5px; align-items: center; padding: 5px 7px; color: #5b5285; border: 1px solid #d7d0fa; border-radius: 99px; background: #fff; font-size: 9px; }.unit-chip button { display: grid; place-items: center; width: 13px; height: 13px; padding: 0; color: #746b9a; border: 0; border-radius: 50%; background: #eeebff; font-size: 12px; line-height: 1; }.unit-chip button:hover { color: #fff; background: #806ee4; }
.course-settings-error { min-height: 18px; margin: 11px 0 -4px; color: #c65d58; font-size: 10px; }.course-settings-submit { margin-top: 15px; }
.exam-card .days { margin-top: 12px; }.exam-card .days strong { font-size: clamp(54px, 5.2vw, 64px); letter-spacing: -3.7px; line-height: .95; }

/* Study plan and review reminders. */
.focus-plan-note { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 14px; padding-top: 12px; color: #7b788b; border-top: 1px solid #eceaf2; font-size: 9px; line-height: 1.45; }.focus-plan-note button { flex: 0 0 auto; padding: 5px 0; color: #6653d0; border: 0; border-bottom: 1px solid #b7afe7; background: transparent; font: 700 9px inherit; }.focus-plan-note button span { padding-left: 3px; font-size: 12px; }.focus-plan-note button:hover { color: #4f3dbe; border-color: #735de0; }
.review-actions { display: inline-flex; gap: 8px; align-items: center; }.reminder-label { color: #9290a2; font-size: 9px; font-weight: 600; letter-spacing: -.1px; }.reminder-status { display: inline-flex; align-items: center; justify-content: center; min-width: 35px; min-height: 25px; padding: 0 9px; color: #6351cf; border: 1px solid #ded9f6; border-radius: 8px; background: rgba(255,255,255,.62); font: 700 9px inherit; transition: border-color .18s, background .18s, box-shadow .18s, transform .18s; }.reminder-status:hover { border-color: #b6aceb; background: #fff; box-shadow: 0 4px 10px rgba(82,66,166,.1); transform: translateY(-1px); }.reminder-status.is-enabled { min-width: 69px; color: #39785c; border-color: #c5e4d1; background: #f1fbf5; }.reminder-status.is-enabled::before { width: 5px; height: 5px; margin-right: 5px; border-radius: 50%; background: #5aa57b; content: ""; }
.icon-button i { display: none; }.icon-button.has-reminder i { display: block; }
.cal-date.adjusted { border-color: #d6cfff; background: linear-gradient(135deg, #faf9ff, #f2efff); }.plan-adjustment { display: block; margin-top: 6px; color: #7463c6; font-size: 8px; font-style: normal; font-weight: 700; }.task.saving { opacity: .62; pointer-events: none; }
.reminder-manager { margin-top: 13px; padding: 16px; border: 1px solid #dfe8ed; border-radius: 15px; background: linear-gradient(135deg, rgba(237,248,255,.82), rgba(244,242,255,.74)); }.reminder-manager > div:first-child { display: grid; gap: 3px; }.reminder-manager > div:first-child b { color: #555168; font-size: 11px; }.reminder-manager > div:first-child span, .reminder-manager > p { color: #777c90; font-size: 10px; line-height: 1.55; }.reminder-controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-top: 13px; }.reminder-switch { display: inline-flex; gap: 8px; align-items: center; color: #514e67; font-size: 10px; cursor: pointer; }.reminder-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }.reminder-switch > span { position: relative; width: 31px; height: 18px; border-radius: 99px; background: #cfcddd; transition: background .18s; }.reminder-switch > span::after { position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(44,41,74,.2); content: ""; transition: transform .18s; }.reminder-switch input:checked + span { background: #6756d7; }.reminder-switch input:checked + span::after { transform: translateX(13px); }.reminder-switch input:focus-visible + span { outline: 3px solid rgba(103,86,215,.22); outline-offset: 2px; }.reminder-time { display: flex; gap: 7px; align-items: center; color: #6d6980; font-size: 9px; }.reminder-time input { height: 30px; padding: 0 7px; color: #4c485e; border: 1px solid #d9d8e9; border-radius: 8px; background: rgba(255,255,255,.85); font: 600 10px inherit; }.reminder-time input:disabled { color: #a8a5b3; background: rgba(244,243,248,.7); }.reminder-manager > p { margin: 10px 0 0; }

@media (max-width: 700px) { .section-heading:has(.materials-actions) { align-items: flex-start; flex-direction: column; }.materials-actions { width: 100%; justify-content: flex-start; }.unit-picker { flex: 1; justify-content: space-between; }.unit-picker select { max-width: none; flex: 1; }.course-settings-modal { padding: 28px 21px; }.course-form-grid { grid-template-columns: 1fr; }.course-form-grid label:first-child { grid-column: auto; }.review-head { align-items: flex-start; gap: 10px; }.review-actions { align-items: flex-end; flex-direction: column; gap: 4px; }.focus-plan-note { align-items: flex-start; flex-direction: column; gap: 7px; } }