/* The approved paper-and-orbit design on the working Notes and Coda screens.
   Shared palette values come from the platform design contract. */
.app-shell :is([data-view="notes"],[data-view="ai"]) {
  color: var(--mc-ink);
  font-size: 1.0625rem;
  line-height: 1.6;
}
.app-shell :is([data-view="notes"],[data-view="ai"]) :is(.mc-card,.mc-input input,.mc-input select) {
  background: var(--mc-surface);
  color: var(--mc-ink);
  border-color: var(--mc-line);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.app-shell :is([data-view="notes"],[data-view="ai"]) :is(.mc-button,.mc-input input,.mc-input select,summary) {
  min-height: 48px;
}
.app-shell :is([data-view="notes"],[data-view="ai"]) :is(.small-print,.page-kicker,.eyebrow,.mc-input>span) {
  font-size: .875rem;
  line-height: 1.55;
  color: var(--mc-ink-secondary);
  opacity: 1;
}
.app-shell [data-view="notes"] :is(.notes-studio-intro__copy>p:last-child,.notes-library-heading p,.notes-library-empty p,.note-library-item__excerpt) {
  font-size: 1.0625rem;
  line-height: 1.6;
}
.app-shell [data-view="notes"] .notes-document-provider strong { font-size: 1.0625rem; }
.app-shell [data-view="notes"] .notes-studio-start { border-radius: 24px; }
.app-shell [data-view="notes"] .notes-library-card { padding: clamp(20px,3vw,32px); }
.app-shell [data-view="notes"] .notes-studio-start .mc-coda-entry {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  margin: 0; padding: 20px 0 0; border-top: 1px solid var(--mc-line);
  background: transparent; border-radius: 0;
}
.app-shell [data-view="notes"] .mc-coda-entry p { flex: 1 1 320px; font-size: 1rem; line-height: 1.6; }
.app-shell [data-view="notes"] .mc-coda-entry .mc-button { font-size: 1rem; }

/* A single Coda welcome retains the current orb customization and real actions. */
.app-shell[data-active-view="ai"] .coda-studio-start {
  display: grid; grid-template-columns: minmax(0,1fr) 220px;
  grid-template-rows: auto auto; align-items: center; gap: 20px 28px;
  width: 100%; max-width: 1000px; box-sizing: border-box;
  margin: 0 auto 24px; padding: clamp(22px,3.5vw,36px);
  text-align: left; border: 1px solid var(--mc-line); border-radius: 24px;
  color: var(--mc-ink); background: var(--mc-surface);
  box-shadow: 0 12px 36px color-mix(in srgb,var(--mc-ink) 5%,transparent);
}
.app-shell[data-active-view="ai"] .coda-studio-start>.coda-brand { grid-column: 1; grid-row: 1; margin: 0; }
.app-shell[data-active-view="ai"] .coda-studio-start .coda-brand h1 { font-size: 1.5rem; line-height: 1.25; color: var(--mc-ink); }
.app-shell[data-active-view="ai"] .coda-studio-start .coda-brand p { font-size: .875rem; line-height: 1.5; color: var(--mc-ink-secondary); }
.app-shell[data-active-view="ai"] .coda-studio-start>.coda-studio-copy { grid-column: 1; grid-row: 2; min-width: 0; max-width: 620px; }
.app-shell[data-active-view="ai"] .coda-studio-start .coda-studio-plus {
  display: inline-flex; align-items: center; min-height: 32px; padding: 4px 10px;
  border: 1px solid var(--mc-line); border-radius: 100px;
  color: var(--mc-teal); background: var(--mc-surface);
  font-size: .875rem; font-weight: 750; letter-spacing: .035em;
}
.app-shell[data-active-view="ai"] .coda-studio-start .coda-studio-copy>h2 {
  display: block; margin: 16px 0; color: var(--mc-ink);
  font-size: clamp(1.8rem,3.2vw,2.6rem); font-weight: 650;
  letter-spacing: -.035em; line-height: 1.16;
}
.app-shell[data-active-view="ai"] .coda-studio-start .coda-greeting {
  display: block; margin: 0 0 22px; max-width: 44ch;
  color: var(--mc-ink-secondary); font-size: 1.0625rem; line-height: 1.65;
}
.app-shell[data-active-view="ai"] .coda-studio-start .coda-studio-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.app-shell[data-active-view="ai"] .coda-studio-start .coda-studio-actions .mc-button {
  min-height: 48px; white-space: normal; font-size: 1rem; line-height: 1.4;
}
.app-shell[data-active-view="ai"] .coda-studio-start .coda-studio-privacy {
  margin: 14px 0 0; color: var(--mc-ink-secondary); font-size: .875rem; line-height: 1.6;
}
.app-shell[data-active-view="ai"] .coda-studio-start>.coda-flow {
  display: block; grid-column: 2; grid-row: 1 / 3; align-self: center;
  width: 220px; height: 220px; max-width: 100%; margin: 0;
}
.app-shell[data-active-view="ai"] .coda-studio-start>.coda-state {
  grid-column: 2; grid-row: 3; text-align: center; margin: 0!important;
  font-size: .875rem!important; line-height: 1.5; color: var(--mc-ink-secondary);
}
.app-shell[data-active-view="ai"] [data-view="ai"] :is(.ai-tutor-layout,.coda-tools,.tutor-workspace-tools,[data-ai-access-note]) {
  max-width: 1000px;
}
.app-shell[data-active-view="ai"] [data-view="ai"] .ai-conversation-card {
  padding: 0!important; border: 0!important; background: transparent!important;
  box-shadow: none!important; gap: 18px!important;
}
.app-shell[data-active-view="ai"] [data-view="ai"] :is(.ai-context-card,.ai-history-card) {
  color: var(--mc-ink); background: var(--mc-surface)!important; font-size: 1rem;
}
.app-shell[data-active-view="ai"] [data-view="ai"] .ai-message {
  color: var(--mc-ink); font-size: 1.0625rem; line-height: 1.7;
  background: var(--mc-surface)!important; border-color: var(--mc-line);
}
.app-shell[data-active-view="ai"] [data-view="ai"] .ai-message :is(p,li) { line-height: 1.7; }
.app-shell[data-active-view="ai"] [data-view="ai"] :is(.ai-message-meta,.ai-verify-note,.ai-action-allowance,.mc-voice-status,.ai-history-meta,.ai-history-card small) {
  color: var(--mc-ink-secondary); font-size: .875rem; line-height: 1.6; opacity: 1;
}
.app-shell[data-active-view="ai"] [data-view="ai"] :is(.ai-context-card small,.ai-source-links small,.coda-voice-options summary,.tutor-context-options summary,.mc-spoken-toggle) {
  font-size: .875rem; line-height: 1.6;
}
.app-shell[data-active-view="ai"] [data-view="ai"] form.coda-inline-composer {
  background: var(--mc-surface)!important; border-color: var(--mc-line)!important;
  padding: clamp(18px,2.5vw,26px)!important; color: var(--mc-ink);
}
.app-shell[data-active-view="ai"] [data-view="ai"] form.coda-inline-composer textarea {
  font-size: 1.0625rem!important; line-height: 1.65; min-height: 112px!important;
  color: var(--mc-ink); caret-color: var(--mc-teal);
}
.app-shell[data-active-view="ai"] [data-view="ai"] form.coda-inline-composer textarea::placeholder {
  color: var(--mc-ink-secondary); opacity: 1;
}
.app-shell[data-active-view="ai"] [data-view="ai"] .tutor-quick-actions button {
  flex: 1 1 180px; min-height: 52px!important; padding: 12px 16px!important;
  background: var(--mc-surface)!important; color: var(--mc-ink);
  border: 1px solid var(--mc-line)!important; font-size: .9375rem; line-height: 1.5;
}
.app-shell[data-active-view="ai"] [data-view="ai"] [data-ai-send] {
  min-height: 48px; min-width: 150px; font-size: 1rem;
}
.app-shell[data-active-view="ai"] [data-view="ai"] :is(.coda-tools,.tutor-workspace-tools)>summary {
  min-height: 48px; color: var(--mc-ink); font-size: .9375rem;
}
/* Content remains readable when secondary tools open. */
.app-shell[data-active-view="ai"] [data-view="ai"] .ai-prompt-list button {
  font-size: .9375rem; line-height: 1.5; color: var(--mc-ink);
  background: var(--mc-surface)!important; border-color: var(--mc-line)!important;
}

/* Native modal nodes sit beside .app-shell, so use the shared root bridge. */
:is(.mc-coda-call,.coda-settings,#study-note-sheet) {
  color: var(--horizon-ink,var(--mc-ink));
  background: var(--horizon-panel,var(--mc-surface));
  border-color: var(--horizon-line,var(--mc-line));
}
.mc-coda-call { width: min(680px,calc(100vw - 32px)); padding: clamp(22px,4vw,34px); border-radius: 24px; }
.mc-coda-call h2 { font-size: clamp(1.4rem,3vw,1.75rem); line-height: 1.3; letter-spacing: -.025em; }
.mc-coda-call :is(.mc-coda-call__eyebrow,.mc-coda-call__voice,.mc-coda-call__preview-note,.mc-coda-call__preview-status,.mc-coda-call__mic-status) {
  font-size: .875rem; line-height: 1.6; color: var(--horizon-muted,var(--mc-ink-secondary));
}
.mc-coda-call .mc-coda-call__hint { max-width: 42ch; font-size: 1.0625rem; line-height: 1.65; color: var(--horizon-muted,var(--mc-ink-secondary)); }
.mc-coda-call .mc-coda-call__disclosure { font-size: .9375rem; line-height: 1.65; color: var(--horizon-muted,var(--mc-ink-secondary)); background: var(--horizon-panel,var(--mc-surface)); }
.mc-coda-call .mc-coda-call__captions { background: var(--horizon-panel,var(--mc-surface)); max-height: 240px; }
.mc-coda-call .mc-coda-call__captions p:not(.mc-coda-call__eyebrow) { font-size: 1.0625rem; line-height: 1.7; }
.mc-coda-call .mc-coda-call__close { width: 48px; height: 48px; }
.mc-coda-call :is(.mc-button,.mc-coda-call__control) { min-height: 48px; font-size: 1rem; }
.mc-coda-call .mc-coda-call__voice-panel :is(summary,legend,strong,small) { font-size: .875rem; line-height: 1.5; }
.mc-coda-call .mc-coda-call__voice-panel summary { min-height: 48px; color: var(--horizon-ink,var(--mc-ink)); }
.mc-coda-call .mc-coda-call__voice-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.mc-coda-call .mc-coda-call__voice-grid label { min-height: 68px; padding: 12px; }
.mc-coda-call .mc-coda-call__orb {
  width: 160px; height: 160px; border: 0; background: transparent; border-radius: 50%; box-shadow: none;
}
.mc-coda-call .mc-coda-call__orb::before { inset: 8px; border-radius: 50%; border-color: var(--horizon-line,var(--mc-line)); }
.mc-coda-call .mc-coda-call__orb-image { position: absolute; inset: 0; width: 100%; height: 100%; }
.mc-coda-call .mc-coda-call__wave { z-index: 1; transform: scale(.72); }
.mc-coda-call .mc-coda-call__mic-status { min-height: 40px; }
.coda-settings { font-size: 1rem; }
.coda-settings :is(.coda-settings-note,.coda-swatches label,.coda-settings header p) { font-size: .875rem; color: var(--horizon-muted,var(--mc-ink-secondary)); }
.coda-settings :is(select,button,label) { min-height: 48px; }
#study-note-sheet :is(.note-format label,.note-board-tools label,.note-studio-tip,.note-studio-meter,.note-studio-status,.note-time-metadata,.note-studio-identity .note-time-metadata) { font-size: .875rem; line-height: 1.55; }
#study-note-sheet .note-studio-save-state { font-size: .875rem!important; line-height: 1.55!important; }
#study-note-sheet .note-studio-bar .mc-button { min-height: 48px; font-size: .875rem!important; }
#study-note-sheet :is(.note-format button,.note-format select,.note-board-tools button,.note-board-tools select) { min-height: 48px; font-size: .9375rem; }
#study-note-sheet :is(.note-writing-help p,.note-writing-suggestion small,.note-studio-files p,.note-finger-toggle,.note-ink-actions>span) { font-size: .875rem; line-height: 1.6; }

@media(max-width:760px) {
  .app-shell[data-active-view="ai"] .coda-studio-start { grid-template-columns: minmax(0,1fr) 150px; gap: 18px; }
  .app-shell[data-active-view="ai"] .coda-studio-start>.coda-flow { width: 150px; height: 150px; }
  .app-shell[data-active-view="ai"] .coda-studio-start .coda-studio-copy>h2 { font-size: 1.8rem; }
  .app-shell[data-active-view="ai"] .coda-studio-start .coda-studio-actions .mc-button { flex: 1 1 190px; }
}
@media(max-width:600px) {
  .app-shell[data-active-view="ai"] .coda-studio-start { grid-template-columns: minmax(0,1fr) 74px; gap: 16px; padding: 22px; }
  .app-shell[data-active-view="ai"] .coda-studio-start>.coda-brand { grid-column: 1; }
  .app-shell[data-active-view="ai"] .coda-studio-start>.coda-flow { grid-column: 2; grid-row: 1; width: 74px; height: 74px; }
  .app-shell[data-active-view="ai"] .coda-studio-start>.coda-studio-copy { grid-column: 1 / -1; }
  .app-shell[data-active-view="ai"] .coda-studio-start>.coda-state { grid-column: 1 / -1; grid-row: 3; }
  .app-shell[data-active-view="ai"] .coda-studio-start .coda-studio-copy>h2 { font-size: clamp(1.75rem,8vw,2rem); }
  .app-shell[data-active-view="ai"] [data-view="ai"] .tutor-quick-actions button { flex-basis: 100%; }
}
@media(prefers-reduced-motion:reduce) {
  :is(.coda-studio-start,.mc-coda-call) *, .coda-studio-start .coda-flow::after { animation: none!important; transition: none!important; }
}
@media(prefers-contrast:more) {
  .app-shell :is(.coda-studio-start,.notes-studio-start,.notes-library-card,.note-library-item__preview,.coda-studio-plus) { border-color: currentColor; box-shadow: none; }
  .mc-coda-call { box-shadow: none; border-color: currentColor; }
}
/* Preserve route, account, loading and privacy visibility guards. */
.app-shell [data-view="ai"] :is(.coda-studio-start,.coda-studio-actions,button,form)[hidden] { display: none!important; }

/* Current workspace refinements: retain compact conversation states and optional Notes tools. */
.app-shell[data-active-view="ai"] [data-view="ai"] { max-width: 1000px; }
.app-shell [data-view="notes"] .notes-studio-start {
  padding: clamp(20px,3vw,32px); border: 1px solid var(--mc-line);
  background: var(--mc-surface); box-shadow: 0 8px 28px color-mix(in srgb,var(--mc-ink) 5%,transparent);
}
.app-shell [data-view="notes"] .notes-studio-start .eyebrow { display: block; }
.app-shell [data-view="notes"] .notes-studio-intro__copy h2 { font-size: clamp(26px,3vw,36px); }
.app-shell [data-view="notes"] .notes-studio-start details.mc-coda-entry { display: block; }
.app-shell [data-view="notes"] .mc-coda-entry>summary { min-height: 48px; font-size: .875rem; color: var(--mc-ink-secondary); }
.app-shell[data-active-view="ai"] [data-view="ai"] .tutor-course-bar>label>span { font-size: .875rem; line-height: 1.55; }
.app-shell[data-active-view="ai"] [data-view="ai"] .tutor-course-bar select { min-height: 48px; font-size: 1.0625rem; }
.app-shell[data-active-view="ai"] [data-view="ai"] [data-tutor-material-shortcut] button { font-size: .9375rem; min-height: 48px; }
.app-shell[data-active-view="ai"] [data-view="ai"] [data-ai-send] {
  color: var(--mc-on-accent)!important; background: var(--mc-action)!important;
}
.app-shell[data-active-view="ai"] .coda-studio-start .mc-button--primary {
  color: var(--mc-on-accent)!important; background: var(--mc-action)!important;
}
.app-shell[data-active-view="ai"] .coda-studio-start:is(.in-conversation,.is-composing) {
  grid-template-columns: minmax(0,1fr) 74px; gap: 16px; padding: 20px 24px;
}
.app-shell[data-active-view="ai"] .coda-studio-start:is(.in-conversation,.is-composing)>.coda-brand { grid-column: 1; grid-row: 1; }
.app-shell[data-active-view="ai"] .coda-studio-start:is(.in-conversation,.is-composing)>.coda-flow {
  grid-column: 2; grid-row: 1; width: 74px; height: 74px;
}
.app-shell[data-active-view="ai"] .coda-studio-start:is(.in-conversation,.is-composing)>.coda-studio-copy { grid-column: 1 / -1; grid-row: 2; }
.app-shell[data-active-view="ai"] .coda-studio-start:is(.in-conversation,.is-composing)>.coda-state { grid-column: 1 / -1; grid-row: 3; }
.app-shell[data-active-view="ai"] .coda-studio-start:is(.in-conversation,.is-composing) .coda-studio-copy>:is(h2,.coda-greeting,.coda-studio-plus,.coda-studio-privacy) { display: none; }
.coda-settings select { color: var(--horizon-ink,var(--mc-ink)); background: var(--horizon-panel,var(--mc-surface)); border-color: var(--horizon-line,var(--mc-line)); }
.coda-settings .coda-settings-done { color: var(--mc-on-accent); background: var(--mc-action); }
.mc-coda-call .mc-coda-call__start { color: var(--mc-on-accent); background: var(--mc-action); }
@media (forced-colors:active) {
  .app-shell[data-active-view="ai"] [data-view="ai"] [data-ai-send],
  .app-shell[data-active-view="ai"] .coda-studio-start .mc-button--primary,
  .mc-coda-call .mc-coda-call__start { color: ButtonText!important; background: ButtonFace!important; border: 1px solid ButtonText!important; }
}
