.app-card { padding: 26px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.app-card__title { margin-bottom: 18px; font-size: 1rem; }
.app-card__lead { max-width: 620px; color: var(--color-text-muted); line-height: 1.65; }
.app-progress { margin: 28px 0 24px; }
.app-progress__meta { display: flex; justify-content: space-between; margin-bottom: 9px; color: var(--color-text-muted); font-size: .8rem; }
.app-progress__track { height: 8px; overflow: hidden; border-radius: 999px; background: #edf0f3; }
.app-progress__track span { display: block; height: 100%; border-radius: inherit; background: var(--color-primary); }
.app-checklist { display: grid; gap: 14px; color: var(--color-text-muted); font-size: .86rem; }
.app-checklist li { position: relative; padding-left: 25px; }
.app-checklist li::before { position: absolute; left: 0; content: "○"; }
.app-checklist li.is-complete { color: var(--color-text); }
.app-checklist li.is-complete::before { color: var(--color-success); content: "✓"; font-weight: 700; }
.metric-card { display: grid; min-height: 148px; align-content: space-between; padding: 22px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.metric-card__label { color: var(--color-text-muted); font-size: .76rem; font-weight: 600; }
.metric-card__value { margin: 10px 0 6px; font-size: 2rem; letter-spacing: -.05em; }
.metric-card__value--success { color: var(--color-success); }
.metric-card__caption { color: var(--color-text-muted); font-size: .72rem; }
.progress-hero { display: flex; align-items: flex-start; justify-content: space-between; gap: 28px; }
.progress-hero > div { display: grid; }
.progress-hero strong { color: var(--color-primary); font-size: 2.6rem; letter-spacing: -.06em; }
.progress-hero span, .progress-hero p { color: var(--color-text-muted); font-size: .78rem; }
.progress-hero p { max-width: 380px; line-height: 1.6; }
.next-step { display: flex; align-items: flex-start; gap: 14px; }
.next-step__icon { display: grid; flex: 0 0 38px; height: 38px; place-items: center; border-radius: 10px; color: var(--color-primary); background: #edf5f3; font-weight: 700; }
.next-step strong { display: block; font-size: .88rem; }
.next-step p { margin-top: 7px; color: var(--color-text-muted); font-size: .78rem; line-height: 1.5; }
.dashboard-update { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--color-border); color: var(--color-text-muted); font-size: .72rem; }
.dashboard-error { margin-top: 18px; padding: 12px 14px; border-radius: var(--radius-sm); color: var(--color-danger); background: #fef3f2; font-size: .8rem; }
.agent-story { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 18px; align-items: center; margin-bottom: 22px; padding: 20px 24px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.agent-story > div { display: grid; grid-template-columns: 30px 1fr; column-gap: 10px; align-items: center; }
.agent-story > div > span { display: grid; grid-row: 1 / span 2; width: 30px; height: 30px; place-items: center; border-radius: 50%; color: var(--color-primary); background: #e8f2ef; font-size: .72rem; font-weight: 700; }
.agent-story strong { font-size: .78rem; }
.agent-story p { margin-top: 3px; color: var(--color-text-muted); font-size: .67rem; line-height: 1.4; }
.agent-story > i { color: var(--color-border); font-style: normal; }
.agent-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.agent-card { display: flex; min-height: 430px; flex-direction: column; padding: 28px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.agent-card--active { border-color: #bcd4cd; box-shadow: 0 12px 30px rgb(31 79 70 / 8%); }
.agent-card--locked { background: #fafafa; }
.agent-card__header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.agent-card__avatar { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 14px; color: #fff; background: linear-gradient(135deg, var(--color-primary), #3f786d); font-weight: 700; }
.agent-card__avatar--locked { color: var(--color-text-muted); background: #e8eaed; }
.agent-status { display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px; border-radius: 999px; font-size: .65rem; font-weight: 700; }
.agent-status--active { color: var(--color-success); background: #ecfdf3; }
.agent-status--active i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgb(18 183 106 / 10%); }
.agent-status--locked { color: var(--color-text-muted); background: #f0f1f2; }
.agent-card__body { margin-top: 28px; }
.agent-card__eyebrow { color: var(--color-accent); font-size: .65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.agent-card__body h3 { margin-top: 7px; font-size: 1.55rem; letter-spacing: -.04em; }
.agent-card__body > p:last-child { margin-top: 12px; color: var(--color-text-muted); font-size: .8rem; line-height: 1.65; }
.agent-card__features { display: grid; gap: 10px; margin: 24px 0; color: var(--color-text-muted); font-size: .74rem; }
.agent-card__features li { position: relative; padding-left: 20px; }
.agent-card__features li::before { position: absolute; left: 0; color: var(--color-success); content: "✓"; font-weight: 700; }
.agent-card--locked .agent-card__features li::before { color: var(--color-text-muted); content: "○"; }
.agent-card > .app-button { margin-top: auto; }
.agent-card__actions { display: grid; gap: 9px; margin-top: auto; }
.apprentice-chat { overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.apprentice-chat__status { display: flex; gap: 14px; align-items: center; padding: 18px 22px; border-bottom: 1px solid var(--color-border); background: #f8fbfa; }
.apprentice-chat__status > div { display: grid; flex: 1; gap: 3px; }
.apprentice-chat__status > div > strong { font-size: .84rem; }
.apprentice-chat__status > div > span { color: var(--color-text-muted); font-size: .68rem; }
.apprentice-chat__status > div i { display: inline-block; width: 7px; height: 7px; margin-right: 4px; border-radius: 50%; background: var(--color-success); }
.apprentice-chat__scope { padding: 7px 10px; border-radius: 999px; color: var(--color-primary); background: #e8f2ef; font-size: .64rem; font-weight: 600; }
.apprentice-chat__messages { display: grid; gap: 16px; min-height: 420px; max-height: calc(100vh - 350px); overflow-y: auto; padding: 26px; background: #fbfcfc; }
.chat-message { width: fit-content; max-width: min(76%, 720px); padding: 14px 16px; border: 1px solid var(--color-border); border-radius: 5px 16px 16px; background: var(--color-surface); }
.chat-message--user { justify-self: end; border-color: var(--color-primary); border-radius: 16px 5px 16px 16px; color: #fff; background: var(--color-primary); }
.chat-message--pending { color: var(--color-text-muted); font-size: .74rem; }
.chat-message__state { display: block; margin-bottom: 7px; color: var(--color-accent); font-size: .64rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.chat-message p { font-size: .8rem; line-height: 1.65; white-space: pre-wrap; }
.chat-message__sources { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--color-border); }
.chat-message__sources a { padding: 5px 7px; border-radius: 6px; color: var(--color-primary); background: #edf5f3; font-size: .62rem; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; clip-path: inset(50%) !important; }
.apprentice-chat__composer { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 12px; align-items: stretch; padding: 18px; border-top: 1px solid var(--color-border); }
.apprentice-chat__composer textarea { width: 100%; min-height: 58px; max-height: 160px; padding: 15px 16px; resize: vertical; border: 1px solid var(--color-border); border-radius: var(--radius-sm); outline: none; font: inherit; line-height: 1.45; }
.apprentice-chat__composer textarea:focus { border-color: var(--color-primary); box-shadow: 0 0 0 3px rgb(31 79 70 / 10%); }
.apprentice-chat__actions { display: flex; gap: 8px; align-items: stretch; }
.apprentice-chat__actions .app-button { min-width: 96px; min-height: 58px; }
.apprentice-audio-button span { color: #d92d20; font-size: .75rem; }
.apprentice-audio-button.is-recording { color: #b42318; border-color: #fda29b; background: #fef3f2; }
.apprentice-audio-button.is-recording span { animation: recording-pulse 1.2s infinite; }
.apprentice-chat__audio-status { grid-column: 1 / -1; min-height: 15px; color: var(--color-text-muted); font-size: .67rem; }
.apprentice-chat__error { padding: 0 18px 14px; color: var(--color-danger); font-size: .7rem; }
.apprentice-hero { display: grid; gap: 20px; margin-bottom: 22px; padding: 30px; border: 1px solid #bcd4cd; border-radius: var(--radius-lg); background: linear-gradient(135deg, #f6fbf9, #fff); box-shadow: 0 12px 30px rgb(31 79 70 / 8%); }
.apprentice-hero__identity { display: flex; align-items: center; gap: 16px; }
.apprentice-hero__identity .page-heading__eyebrow { margin-bottom: 4px; }
.apprentice-hero__identity h2 { font-size: clamp(1.65rem, 3vw, 2.25rem); letter-spacing: -.04em; }
.apprentice-hero__lead { max-width: 760px; color: var(--color-text); font-size: 1rem; line-height: 1.7; }
.apprentice-hero__note { display: grid; gap: 4px; padding: 16px 18px; border-left: 3px solid var(--color-primary); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: rgb(255 255 255 / 72%); }
.apprentice-hero__note strong { font-size: .8rem; }
.apprentice-hero__note span { color: var(--color-text-muted); font-size: .74rem; line-height: 1.55; }
.apprentice-progress { display: grid; grid-template-columns: minmax(180px, .7fr) minmax(240px, 1.3fr) auto; gap: 24px; align-items: center; margin-bottom: 34px; padding: 20px 24px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
.apprentice-progress > div:first-child { display: grid; gap: 3px; }
.apprentice-progress > div:first-child span { color: var(--color-text-muted); font-size: .7rem; }
.apprentice-progress > div:first-child strong { color: var(--color-primary); font-size: 1.8rem; }
.apprentice-progress p { color: var(--color-text-muted); font-size: .72rem; }
.apprentice-modules-heading { align-items: center; }
.consultant-readiness { display: flex; gap: 16px; align-items: center; margin-top: 26px; padding: 20px 22px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: #fafafa; }
.consultant-readiness > div { flex: 1; }
.consultant-readiness strong { font-size: .82rem; }
.consultant-readiness p { margin-top: 4px; color: var(--color-text-muted); font-size: .72rem; line-height: 1.5; }
.workspace-summary { display: grid; min-width: 120px; text-align: right; }
.workspace-summary strong { color: var(--color-primary); font-size: 2rem; letter-spacing: -.05em; }
.workspace-summary span { color: var(--color-text-muted); font-size: .72rem; }
.workspace-toolbar { display: flex; gap: 1px; overflow: hidden; margin-bottom: 20px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-border); }
.workspace-toolbar > div { display: grid; flex: 1; gap: 3px; padding: 17px 20px; background: var(--color-surface); }
.workspace-toolbar strong { font-size: 1.15rem; }
.workspace-toolbar span { color: var(--color-text-muted); font-size: .7rem; }
.module-card { display: flex; min-height: 310px; flex-direction: column; gap: 20px; padding: 22px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-sm); transition: transform var(--transition), box-shadow var(--transition); }
.module-card:not(.module-card--loading):hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.module-card__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.module-card__code { display: inline-flex; padding: 5px 8px; border-radius: 6px; color: var(--color-primary); background: #edf5f3; font-size: .67rem; font-weight: 700; letter-spacing: .06em; }
.module-card__type { color: var(--color-text-muted); font-size: .63rem; }
.module-card__body h3 { font-size: 1rem; line-height: 1.4; }
.module-card__body p { margin-top: 9px; color: var(--color-text-muted); font-size: .76rem; line-height: 1.55; }
.module-card__progress { margin-top: auto; }
.module-card--loading { min-height: 310px; border-color: transparent; background: linear-gradient(100deg, #edf0f2 25%, #f8f9fa 40%, #edf0f2 55%); background-size: 220% 100%; animation: module-loading 1.3s infinite linear; }
@keyframes module-loading { to { background-position-x: -220%; } }
.breadcrumb { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; color: var(--color-text-muted); font-size: .75rem; }
.breadcrumb a:hover { color: var(--color-primary); }
.question-index { position: sticky; top: calc(var(--header-height) + 20px); overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); }
.question-index__header { padding: 22px 22px 16px; }
.question-index__header > span { color: var(--color-accent); font-size: .65rem; font-weight: 700; letter-spacing: .08em; }
.question-index__header h2 { margin-top: 7px; font-size: 1rem; line-height: 1.4; }
.question-index__header p { margin-top: 7px; color: var(--color-text-muted); font-size: .7rem; }
.question-index__progress { height: 4px; background: #edf0f3; }
.question-index__progress span { display: block; height: 100%; background: var(--color-primary); transition: width var(--transition); }
.question-index__list { display: grid; max-height: calc(100vh - 270px); overflow-y: auto; padding: 10px; }
.question-index__item { display: grid; grid-template-columns: 26px 1fr 8px; gap: 8px; align-items: center; min-height: 52px; padding: 8px 10px; border: 0; border-radius: 9px; text-align: left; color: var(--color-text-muted); background: transparent; cursor: pointer; }
.question-index__item:hover, .question-index__item.is-active { color: var(--color-text); background: var(--color-surface-muted); }
.question-index__item > span:first-child { font-size: .65rem; font-weight: 700; }
.question-index__item > span:nth-child(2) { overflow: hidden; font-size: .72rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.question-index__item i { width: 7px; height: 7px; border-radius: 50%; background: #d0d5dd; }
.question-index__item i.is-answered { background: var(--color-success); }
.question-stage { min-height: 560px; padding: clamp(26px, 5vw, 58px); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.question-stage__meta { display: flex; align-items: center; justify-content: space-between; color: var(--color-text-muted); font-size: .72rem; }
.question-status { padding: 5px 8px; border-radius: 999px; background: #f2f4f7; font-weight: 600; }
.question-status.is-answered { color: var(--color-success); background: #ecfdf3; }
.question-stage__context { margin-top: 52px; color: var(--color-accent); font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.question-stage h2 { max-width: 800px; margin-top: 12px; font-size: clamp(1.65rem, 3vw, 2.5rem); line-height: 1.22; letter-spacing: -.045em; }
.question-stage__description { max-width: 680px; margin-top: 16px; color: var(--color-text-muted); line-height: 1.65; }
.response-editor, .attachments { margin-top: 38px; padding: 20px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: #fbfcfc; }
.response-editor__heading, .attachments__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.response-editor__heading > div > span, .attachments__heading > div > span { font-size: .78rem; font-weight: 700; }
.response-editor__heading p, .attachments__heading p { margin-top: 5px; color: var(--color-text-muted); font-size: .72rem; }
.response-editor__textarea { width: 100%; min-height: 220px; margin-top: 18px; padding: 16px; resize: vertical; border: 1px solid var(--color-border); border-radius: var(--radius-sm); outline: none; color: var(--color-text); background: var(--color-surface); line-height: 1.65; }
.response-editor__textarea:focus { border-color: var(--color-primary); box-shadow: 0 0 0 3px rgb(31 79 70 / 10%); }
.response-editor__actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
.response-editor__actions > span, .save-status { color: var(--color-text-muted); font-size: .68rem; }
.save-status.is-success { color: var(--color-success); }
.save-status.is-error { color: var(--color-danger); }
.attachment-picker { cursor: pointer; }
.attachment-list { display: grid; gap: 8px; margin-top: 18px; }
.attachment-list__empty { padding: 18px; border: 1px dashed var(--color-border); border-radius: var(--radius-sm); text-align: center; color: var(--color-text-muted); font-size: .74rem; }
.attachment-item { display: grid; grid-template-columns: 44px 1fr auto 30px; gap: 12px; align-items: center; padding: 10px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-surface); }
.attachment-item__icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 8px; color: var(--color-primary); background: #edf5f3; font-size: .58rem; font-weight: 700; }
.attachment-item > div { display: grid; min-width: 0; gap: 4px; }
.attachment-item strong { overflow: hidden; font-size: .74rem; text-overflow: ellipsis; white-space: nowrap; }
.attachment-item > div span { color: var(--color-text-muted); font-size: .64rem; }
.attachment-item__delete { border: 0; color: var(--color-text-muted); background: transparent; font-size: 1.2rem; cursor: pointer; }
.attachment-item__delete:hover { color: var(--color-danger); }
.attachment-item.is-audio > div { gap: 7px; }
.attachment-item audio { width: min(100%, 420px); height: 34px; margin-top: 2px; }
.audio-transcription { margin-top: 7px; padding: 10px 12px; border-left: 3px solid var(--color-accent); border-radius: 0 7px 7px 0; background: #faf8f4; }
.audio-transcription span { color: var(--color-accent); font-size: .6rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.audio-transcription p { margin-top: 5px; color: var(--color-text); font-size: .72rem; line-height: 1.55; white-space: pre-wrap; }
.audio-recorder { margin-top: 38px; padding: 20px; border: 1px solid #cddbd7; border-radius: var(--radius-md); background: #f4f9f7; }
.audio-recorder__intro { display: flex; align-items: center; gap: 13px; }
.audio-recorder__icon { display: grid; flex: 0 0 42px; height: 42px; place-items: center; border-radius: 50%; background: #e3efeb; font-size: 1.15rem; }
.audio-recorder__intro strong { font-size: .8rem; }
.audio-recorder__intro p { margin-top: 4px; color: var(--color-text-muted); font-size: .7rem; line-height: 1.45; }
.audio-recorder__idle { display: flex; align-items: center; gap: 14px; margin-top: 18px; }
.audio-recorder__idle small { color: var(--color-text-muted); font-size: .65rem; }
.record-button { display: inline-flex; min-height: 44px; align-items: center; gap: 9px; padding: 0 17px; border: 0; border-radius: 999px; color: #fff; background: var(--color-primary); font-weight: 700; cursor: pointer; }
.record-button span { color: #ff776f; font-size: .8rem; }
.audio-recorder__recording { align-items: center; gap: 10px; margin-top: 18px; padding: 10px 12px; border-radius: 10px; background: #fff; }
.audio-recorder__recording:not([hidden]) { display: flex; }
.audio-recorder__recording > span:not(.recording-dot) { color: var(--color-text-muted); font-size: .7rem; }
.audio-recorder__recording .app-button { margin-left: auto; }
.recording-dot { width: 9px; height: 9px; border-radius: 50%; background: #e5484d; animation: recording-pulse 1.2s infinite; }
@keyframes recording-pulse { 50% { opacity: .35; transform: scale(.8); } }
.audio-recorder__review { align-items: center; gap: 14px; margin-top: 18px; }
.audio-recorder__review:not([hidden]) { display: flex; }
.audio-recorder__review audio { flex: 1; min-width: 180px; height: 40px; }
.audio-recorder__review > div { display: flex; gap: 8px; }
.audio-recorder__message { min-height: 16px; margin-top: 8px; color: var(--color-danger); font-size: .68rem; }
.free-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 32px; border-radius: var(--radius-lg); color: #fff; background: linear-gradient(135deg, #173b35, #245f54); }
.free-hero h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); }
.free-hero p:last-child { max-width: 670px; margin-top: 10px; color: #c7d9d5; line-height: 1.6; }
.free-hero .page-heading__eyebrow { color: #d9c49d; }
.free-hero .app-button { color: #173b35; background: #e6d5b5; }
.free-create { display: grid; gap: 17px; margin-top: 18px; padding: 24px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-md); }
.free-create__heading, .free-create__actions, .free-content-list__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.free-create__heading p, .free-content-list__heading p { margin-top: 5px; color: var(--color-text-muted); font-size: .72rem; }
.free-create__heading > button { border: 0; color: var(--color-text-muted); background: transparent; font-size: 1.4rem; cursor: pointer; }
.free-create__actions { align-items: center; }
.free-create__actions > span { color: var(--color-danger); font-size: .72rem; }
.free-content-list { margin-top: 30px; }
.free-content-list__heading { align-items: end; margin-bottom: 16px; }
.free-content-list__heading h3 { font-size: 1rem; }
.free-content-list__heading > strong { color: var(--color-primary); font-size: 1.8rem; }
.free-card { display: flex; min-height: 220px; flex-direction: column; padding: 20px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); box-shadow: var(--shadow-sm); transition: transform var(--transition), box-shadow var(--transition); }
.free-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.free-card__top, .free-card footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.free-card__top span { color: var(--color-accent); font-size: .65rem; font-weight: 700; }
.free-card__top i { width: 8px; height: 8px; border-radius: 50%; background: #d0d5dd; }
.free-card__top i.is-active { background: var(--color-success); }
.free-card h3 { margin-top: 24px; font-size: .95rem; line-height: 1.4; }
.free-card > p { margin-top: 9px; color: var(--color-text-muted); font-size: .72rem; line-height: 1.5; }
.free-card footer { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--color-border); font-size: .67rem; }
.free-card footer span { color: var(--color-text-muted); }
.free-card footer strong { color: var(--color-primary); }
.free-empty { grid-column: 1 / -1; padding: 56px 24px; border: 1px dashed #cbd5d2; border-radius: var(--radius-lg); text-align: center; background: #fafcfc; }
.free-empty > span { display: inline-grid; width: 46px; height: 46px; place-items: center; border-radius: 50%; color: var(--color-primary); background: #e8f2ef; font-size: 1.4rem; }
.free-empty h3 { margin-top: 14px; }
.free-empty p { margin: 7px 0 20px; color: var(--color-text-muted); font-size: .78rem; }
.question-navigation { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 34px; padding-top: 22px; border-top: 1px solid var(--color-border); }
.empty-state { grid-column: 1 / -1; padding: 60px 30px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); text-align: center; background: var(--color-surface); }
.empty-state p { margin: 10px 0 22px; color: var(--color-text-muted); }
.login-page { display: grid; min-height: 100vh; place-items: center; padding: 24px; background: radial-gradient(circle at top left, #eef4f1, transparent 42%), var(--color-bg); }
.login-panel { width: min(100%, 430px); padding: 36px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-md); }
.login-brand { display: flex; justify-content: center; margin-bottom: 28px; }
.login-brand img { display: block; width: min(100%, 280px); height: 150px; object-fit: contain; }
.login-panel__eyebrow { color: var(--color-accent); font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.login-panel h1 { margin-top: 8px; font-size: 1.7rem; letter-spacing: -.035em; }
.login-panel__description { margin-top: 10px; color: var(--color-text-muted); line-height: 1.55; }