/* Studio visual layer, 2026-10-25.
 * Load after style.css. Private workspace pages and login only.
 * Public CV/papers, DOM order, feature visibility and behavior are unchanged.
 */
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) {
  --bg: #f4f5f2;
  --paper: #ffffff;
  --ink: #172d29;
  --muted: #64726b;
  --line: #dfe5df;
  --green: #236356;
  --green-soft: #eaf2ed;
  --blue: #426b7e;
  --blue-soft: #eaf1f5;
  --warm: #886434;
  --warm-soft: #f6f0e5;
  --danger: #a2473b;
  --surface: #ffffff;
  --surface-solid: #ffffff;
  --surface-muted: #f0f3ef;
  --field: #ffffff;
  --topbar-bg: rgba(250,251,248,.95);
  --focus: #397f68;
  --shadow: 0 12px 40px rgba(23,45,41,.08);
  --studio-rule: #edf0eb;
  --studio-on-accent: #ffffff;
  min-height: 100vh;
  color: var(--ink);
  background: var(--bg);
  font-family: Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  font-size: 14px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

html[data-theme="dark"] body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) {
  --bg: #111917;
  --paper: #17221e;
  --ink: #e8f0e9;
  --muted: #a1b1a7;
  --line: #2c3d33;
  --green: #91d7b7;
  --green-soft: #203b2d;
  --blue: #a0c8d9;
  --blue-soft: #203740;
  --warm: #d9b47c;
  --warm-soft: #382f22;
  --danger: #f0a395;
  --surface: #17221e;
  --surface-solid: #17221e;
  --surface-muted: #1d2b24;
  --field: #15201b;
  --topbar-bg: rgba(17,25,23,.96);
  --focus: #99dfb9;
  --shadow: 0 12px 40px rgba(0,0,0,.22);
  --studio-rule: #24342b;
  --studio-on-accent: #10271d;
}

body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .shell {
  width: min(1180px,calc(100% - 64px));
  padding: 36px 0 64px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .topbar {
  min-height: 68px;
  gap: 24px;
  padding: 12px max(32px,calc((100vw - 1180px)/2));
  border-bottom: 1px solid var(--line);
  background: var(--topbar-bg);
  box-shadow: 0 1px 0 rgba(23,45,41,.015);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .wordmark {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: inherit;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.06em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .wordmark span {
  margin: 0;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .12em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .topbar nav a {
  padding: 7px 11px;
  font-size: 12px;
  font-weight: 550;
  border-radius: 7px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .topbar nav a.active {
  color: var(--green);
  background: var(--green-soft);
  box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--green) 12%,transparent);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .page-head {
  align-items: center;
  gap: 24px;
  margin-bottom: 28px;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--line);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) h1,
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .page-head h1 {
  font-family: inherit;
  font-size: clamp(30px,3.4vw,42px);
  font-weight: 720;
  letter-spacing: -.035em;
  line-height: 1.26;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) h2 {
  color: var(--ink);
  font-size: 18px;
  font-weight: 680;
  letter-spacing: -.02em;
  line-height: 1.45;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) h3 {
  color: var(--ink);
  font-weight: 650;
  line-height: 1.55;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .lead,
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .page-head .lead {
  max-width: 660px;
  margin-top: 12px;
  font-size: 14px;
  line-height: 1.85;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .eyebrow {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .13em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .card {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 2px 5px rgba(23,45,41,.025);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .card>header {
  position: static;
  top: auto;
  background: transparent;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .section-title {
  align-items: center;
  margin-bottom: 16px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .section-title>.muted {
  font-size: 12px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .metric b {
  margin-bottom: 5px;
  font-family: inherit;
  font-size: 28px;
  font-weight: 720;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.05em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .top-task {
  min-height: 250px;
  gap: 16px;
  border-top: 3px solid color-mix(in srgb,var(--green) 35%,var(--line));
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .top-rank {
  align-self: flex-start;
  padding: 4px 8px;
  color: var(--green);
  background: var(--green-soft);
  border-radius: 6px;
  font: 650 13px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;
  letter-spacing: .04em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .top-task-copy h3 {
  margin: 12px 0 7px;
  font-size: 17px;
  line-height: 1.6;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .top-task-copy p {
  font-size: 13px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(.top-task.done,.task.done) {
  opacity: 1;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(.top-task.done h3,.task.done strong) {
  color: var(--muted);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .top-task.done {
  background: var(--surface-muted);
  border-color: var(--line);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(.long-term-plan-first,.next-learning,.focus-now) {
  background: var(--green-soft);
  border-color: color-mix(in srgb,var(--green) 20%,var(--line));
  box-shadow: none;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .long-term-overview {
  padding: 14px 16px;
  background: var(--surface);
  border-left-width: 2px;
  border-radius: 0 8px 8px 0;
  font-size: 13px;
  line-height: 1.9;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .long-term-plan-groups>section {
  background: var(--surface);
  border-color: color-mix(in srgb,var(--green) 12%,var(--line));
  border-radius: 10px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .long-term-plan-groups li {
  border-color: var(--studio-rule);
  font-size: 13px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .next-learning h2 {
  font-size: 20px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .focus-clock {
  font-size: 32px;
  font-weight: 550;
  letter-spacing: -.04em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .pill {
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.65;
  letter-spacing: .015em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(input,textarea,select) {
  border-color: var(--line);
  border-radius: 8px;
  background: var(--field);
  box-shadow: inset 0 1px 2px rgba(23,45,41,.02);
  line-height: 1.6;
  transition: border-color .12s ease,box-shadow .12s ease;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(input,textarea,select):focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--green) 10%,transparent);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) textarea {
  line-height: 1.85;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(button,.button) {
  border-radius: 8px;
  font-weight: 600;
  transition: background-color .12s ease,border-color .12s ease,color .12s ease;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) button:disabled {
  cursor: not-allowed;
  opacity: .5;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .top-task-actions button {
  min-height: 30px;
  padding: 5px 9px;
  font-size: 11px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(.task button,.long-term-plan-groups li button) {
  width: 22px;
  height: 22px;
  min-height: 22px;
  padding: 0;
  border-radius: 50%;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .utility-button {
  min-height: 34px;
  padding: 7px 9px;
  border-radius: 8px;
  font-weight: 500;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .list>li {
  padding: 13px 0;
  border-color: var(--studio-rule);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(.inbox-item,.bookmark) {
  padding: 22px 0;
  border-color: var(--studio-rule);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(.item-copy h3,.reader-card h2) a {
  color: var(--ink);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .item-copy .source {
  overflow-wrap: anywhere;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(.briefing-event,.more-briefings,.compare-output div,.cert) {
  background: var(--surface-muted);
  border-color: var(--line);
  border-radius: 10px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .briefing-event h3 {
  font-size: 16px;
  line-height: 1.65;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .workspace-disclosure>summary {
  font-size: 14px;
  line-height: 1.7;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .workspace-disclosure[open]>summary {
  margin-bottom: 20px;
  padding-bottom: 16px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-card {
  min-height: 260px;
  box-shadow: 0 2px 5px rgba(23,45,41,.025);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-card h2 {
  margin: 17px 0 10px;
  font-family: inherit;
  font-size: 21px;
  font-weight: 650;
  line-height: 1.5;
  letter-spacing: -.025em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-toolbar {
  top: 78px;
  margin-bottom: 36px;
  padding: 9px 12px;
  border-radius: 10px;
  background: var(--topbar-bg);
  font-size: 12px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-head {
  position: static;
  padding-bottom: 28px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-head h1 {
  font-size: clamp(30px,4vw,44px);
  line-height: 1.35;
  letter-spacing: -.035em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-content {
  max-width: 740px;
  margin: 0 auto;
  padding: 36px 0;
  font-size: var(--reader-font-size,18px);
  line-height: 1.95;
  letter-spacing: .005em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-content p {
  margin-bottom: 1.5em;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-content h2 {
  margin-top: 2em;
  font-size: 1.35em;
  line-height: 1.6;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-content h3 {
  font-size: 1.16em;
  line-height: 1.65;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(.reader-note,.reader-content blockquote) {
  border-left-width: 2px;
  background: var(--green-soft);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .command-palette {
  border-radius: 14px;
  border-color: var(--line);
  box-shadow: 0 28px 90px rgba(13,32,25,.22);
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .command-results>a {
  padding: 12px;
  border-radius: 8px;
  font-size: 13px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .empty {
  padding: 28px;
  background: var(--surface-muted);
  border-color: var(--line);
  border-radius: 10px;
  font-size: 13px;
}
body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .footer {
  width: min(1180px,calc(100% - 64px));
  padding-top: 20px;
  font-size: 11px;
}
body.login-page .login-shell {
  width: min(1040px,calc(100% - 64px));
  gap: clamp(42px,7vw,100px);
}
body.login-page .login-copy h1 {
  max-width: 560px;
  font-size: clamp(36px,4.5vw,52px);
  line-height: 1.24;
}
body.login-page .login-card {
  padding: 34px;
  border-color: var(--line);
  border-radius: 18px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
body.login-page .login-mark {
  font-family: inherit;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -.06em;
}
body.login-page .login-mark span {
  font-size: 10px;
  font-weight: 550;
  letter-spacing: .12em;
}

@media (max-width: 1000px) {
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .topbar {
    gap: 16px;
    padding-right: 24px;
    padding-left: 24px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .page-head {
    align-items: flex-start;
  }
}

@media (max-width: 760px) {
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(.shell,.footer) {
    width: calc(100% - 32px);
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .shell {
    padding-top: 24px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .topbar {
    min-height: 64px;
    padding: 12px 16px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .wordmark {
    font-size: 19px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .page-head {
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 24px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) h1 {
    font-size: 30px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .card {
    padding: 18px;
    border-radius: 12px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .top-task {
    min-height: 0;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .top-task-actions button {
    min-height: 36px;
    padding: 7px 10px;
    font-size: 12px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(input,textarea,select) {
    font-size: 16px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .lead {
    font-size: 14px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-toolbar {
    top: 74px;
    margin-bottom: 28px;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-head h1 {
    font-size: 30px;
    line-height: 1.45;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-card {
    min-height: 0;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .reader-content {
    padding: 28px 0;
    line-height: 1.9;
  }
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) .mobile-dock {
    background: var(--topbar-bg);
    border-color: var(--line);
    border-radius: 14px;
    box-shadow: 0 6px 24px rgba(23,45,41,.12);
  }
  body.login-page .login-shell {
    width: calc(100% - 36px);
    gap: 28px;
    padding: 36px 0;
  }
  body.login-page .login-card {
    padding: 25px;
    border-radius: 14px;
  }
  body.login-page .login-copy h1 {
    font-size: 36px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body:is(.page-www,.page-today,.page-inbox,.page-read,.page-lab,.page-status,.login-page) :is(input,textarea,select,button,.button) {
    transition: none;
  }
}
