/* Shared surfaces keep every view readable in both appearances. */
:root {
  color-scheme:light;
  --bg:#f4f3ed;
  --paper:#fffefa;
  --surface:#eeeee5;
  --ink:#26372d;
  --dim:#5d6c60;
  --line:#d6ddd1;
  --input-line:#879580;
  --placeholder:#687961;
  --hover:#e9eee3;
  --green:#2f644b;
  --green-light:#eaf1e5;
  --primary-bg:#356b50;
  --primary-ink:#fffefa;
  --primary-hover:#28543e;
  --orange:#ab5635;
  --amber:#805a20;
  --red:#9f4333;
  --warning-bg:#f5ecd8;
  --warning-line:#d7bf85;
  --error-bg:#f7eae3;
  --error-line:#d5b0a1;
  --success-line:#a3b89a;
  --strong-bg:#26372d;
  --strong-ink:#f5faf1;
  --strong-muted:#c9d5c8;
  --strong-input:#344638;
  --strong-line:#6a806b;
  --review-action:#e5eedc;
  --review-action-hover:#d2e1c6;
  --review-action-ink:#203328;
  --delete-bg:#f5e9df;
  --delete-ink:#754326;
  --meter-bg:#e3e8dd;
  --chip-bg:#f0f2e9;
  --chip-line:#d8e0d1;
  --chip-new-bg:#e5f0e2;
  --chip-new-line:#86a67f;
  --shadow-color:#172b1712;
  --mono:'JetBrains Mono',monospace;
  --display:'Archivo Black',sans-serif;
}

:root[data-theme="dark"] {
  color-scheme:dark;
  --bg:#171c19;
  --paper:#202822;
  --surface:#29352c;
  --ink:#e6eee7;
  --dim:#a9b9ac;
  --line:#3d4e42;
  --input-line:#6f8474;
  --placeholder:#a0b0a3;
  --hover:#2c3a30;
  --green:#abd8b7;
  --green-light:#2b4233;
  --primary-bg:#b0d9ba;
  --primary-ink:#17251d;
  --primary-hover:#c2e6cb;
  --orange:#e6af86;
  --amber:#ebc780;
  --red:#efaa97;
  --warning-bg:#3b3322;
  --warning-line:#74613c;
  --error-bg:#3e2a27;
  --error-line:#805047;
  --success-line:#5b7e60;
  --strong-bg:#2c3e32;
  --strong-ink:#e6eee7;
  --strong-muted:#c1d1c2;
  --strong-input:#25362b;
  --strong-line:#647f69;
  --review-action:#b0d9ba;
  --review-action-hover:#c2e6cb;
  --review-action-ink:#17251d;
  --delete-bg:#42312a;
  --delete-ink:#edbca0;
  --meter-bg:#35463a;
  --chip-bg:#29382e;
  --chip-line:#465d4b;
  --chip-new-bg:#314f39;
  --chip-new-line:#7da889;
  --shadow-color:#00000033;
}

* {
  box-sizing:border-box;
}

body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-size:15px;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  line-height:1.65;
}

button,input,textarea,select {
  font:inherit;
}

button,.button {
  cursor:pointer;
}

button:disabled {
  cursor:default;
  opacity:.48;
}

button,a,input,textarea,select,summary {
  outline-offset:4px;
}

a {
  color:var(--green);
  text-underline-offset:3px;
}

button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,select:focus-visible {
  outline:2px solid var(--orange);
}

button {
  border:0;
}

h1,h2,h3,p {
  margin:0;
}

h2 {
  font-size:22px;
  line-height:1.3;
  letter-spacing:-.03em;
}

h3 {
  font-size:18px;
  line-height:1.4;
  letter-spacing:-.02em;
}

p+p {
  margin-top:9px;
}

[hidden] {
  display:none!important;
}

.visually-hidden {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

.shell {
  max-width:1144px;
  margin:auto;
  padding:0 44px;
}

.masthead {
  height:74px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
}

.wordmark {
  font-family:var(--display);
  letter-spacing:-.03em;
  font-size:16px;
  color:var(--ink);
  text-decoration:none;
}

.wordmark span {
  font-family:var(--mono);
  font-size:10px;
  font-weight:400;
  letter-spacing:.09em;
  color:var(--dim);
  margin-left:12px;
}

.quiet {
  background:none;
  color:var(--dim);
  font-size:13px;
  padding:9px 10px;
  border-radius:5px;
}

.quiet:hover {
  color:var(--ink);
  background:var(--hover);
}

.intro {
  padding:30px 0 24px;
  display:flex;
  justify-content:space-between;
  gap:28px;
  align-items:flex-end;
}

.eyebrow {
  font:10px/1.5 var(--mono);
  letter-spacing:.13em;
  color:var(--dim);
  font-weight:500;
}

.intro h1 {
  font-family:inherit;
  font-size:38px;
  font-weight:650;
  line-height:1.14;
  letter-spacing:-.055em;
  margin:0 0 10px;
}

.period {
  color:var(--orange);
}

.lede {
  font-size:16px;
  line-height:1.55;
  letter-spacing:-.025em;
}

.intro-note {
  border-left:2px solid var(--line);
  padding-left:24px;
  margin-bottom:4px;
  font-size:13px;
  color:var(--dim);
}

.edition {
  font:9px var(--mono);
  letter-spacing:.12em;
  display:block;
  margin-bottom:15px;
}

.small {
  font-size:12px;
}

.panel {
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:10px;
  padding:26px 28px;
}

.source-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:22px;
}

.source>summary {
  color:var(--dim);
  font-size:13px;
  cursor:pointer;
  overflow-wrap:anywhere;
}

body:not(.has-filters) #source-summary {
  display:none;
}

body.has-filters .intro {
  display:none;
}

body.has-filters .source {
  margin-top:24px;
}

.source[open]>summary {
  margin-bottom:20px;
}

.source h2 {
  font-size:18px;
  margin:5px 0;
}

.muted {
  color:var(--dim);
  font-size:13px;
}

.source-buttons {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.primary,.secondary,.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid transparent;
  border-radius:5px;
  padding:11px 16px;
  font-size:13px;
  font-weight:600;
  line-height:1.3;
  text-decoration:none;
  gap:7px;
}

.primary {
  background:var(--primary-bg);
  color:var(--primary-ink);
}

.primary:hover:not(:disabled) {
  background:var(--primary-hover);
}

.secondary {
  border-color:var(--line);
  background:transparent;
  color:var(--ink);
}

.secondary:hover:not(:disabled) {
  background:var(--green-light);
  border-color:var(--input-line);
}

.file-input {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
}

.button:focus-within {
  outline:2px solid var(--orange);
  outline-offset:4px;
}

.source-tools {
  border-top:1px solid var(--line);
  margin-top:18px;
  padding-top:13px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.source-tools p {
  font-size:12px;
  color:var(--dim);
}

.inline-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

.subtle-details {
  margin-top:18px;
  padding-top:15px;
  border-top:1px solid var(--line);
}

summary {
  cursor:pointer;
  font-size:12px;
  color:var(--dim);
}

details[open]>summary {
  margin-bottom:13px;
}

details p {
  margin:9px 0;
}

.subtle-details button {
  margin-top:10px;
}

.workspace {
  margin-top:24px;
}

.section-label {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  margin-bottom:13px;
}

.privacy-note {
  font-size:11px;
  color:var(--dim);
}

.task-nav {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-bottom:24px;
}

.task {
  display:flex;
  gap:14px;
  align-items:flex-start;
  background:transparent;
  border:1px solid var(--line);
  border-radius:7px;
  text-align:left;
  padding:18px 17px;
  color:var(--dim);
  line-height:1.3;
}

.task.active {
  background:var(--green-light);
  border-color:var(--green);
  color:var(--ink);
  box-shadow:inset 0 -2px 0 var(--green);
}

.task:hover {
  border-color:var(--green);
}

/* A small working surface: choose a rule, extend it, copy it back. */
.masthead-actions {
  display:flex;
  align-items:center;
  gap:8px;
}
.theme-toggle {
  display:inline-flex;
  align-items:center;
  gap:7px;
  background:transparent;
  color:var(--dim);
  border:1px solid var(--line);
  padding:8px 10px;
  border-radius:7px;
  font-size:12px;
  min-height:36px;
}
.theme-toggle:hover {
  background:var(--hover);
  color:var(--ink);
}
.theme-toggle svg {
  width:16px;
  height:16px;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.source-caption {
  color:var(--dim);
  font-size:13px;
  line-height:1.65;
  max-width:520px;
}
.source-intro {
  display:flex;
  align-items:center;
  gap:16px;
  min-width:0;
}
.source-icon {
  color:var(--green);
  width:36px;
  height:36px;
  flex-shrink:0;
}
.source-icon svg {display:block;width:100%;height:100%;}
.tool-switcher {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:20px;
  flex-wrap:wrap;
}
.tool-switcher .task {
  padding:8px 11px;
  border-color:transparent;
  border-radius:6px;
  box-shadow:none;
}
.tool-switcher .task strong {
  font-size:13px;
  font-weight:550;
}
.other-tools {
  position:relative;
  align-self:center;
}
.other-tools>summary {
  font-size:12px;
  padding:8px;
  color:var(--dim);
}
.other-tool-buttons {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:10px 0;
}
.gmail-optional {
  font-size:12px;
}
.gmail-optional>summary {
  color:var(--dim);
}
.editor-workspace {
  display:grid;
  grid-template-columns:236px minmax(0,1fr);
  gap:26px;
  align-items:start;
}
.editor-picker {
  background:transparent;
  border:0;
  padding:5px 0;
  position:sticky;
  top:20px;
}
.editor-picker>label {
  margin:0 0 8px;
  font-size:13px;
}
.editor-picker .field-hint {
  font-size:11px;
  line-height:1.65;
  padding:0 9px;
}
.editor-list {
  max-height:560px;
  overflow:auto;
  margin:15px 0;
  padding-right:3px;
}
.editor-filter {
  display:flex;
  gap:11px;
  align-items:center;
  width:100%;
  background:transparent;
  border:1px solid transparent;
  border-radius:8px;
  text-align:left;
  padding:13px 11px;
  color:var(--ink);
  margin-bottom:5px;
}
.editor-filter-text {
  display:block;
  min-width:0;
  flex:1;
}
.editor-filter-mark {
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  width:30px;
  height:30px;
  border:1px solid var(--chip-line);
  border-radius:7px;
  background:var(--paper);
  color:var(--green);
  font-size:13px;
  font-weight:600;
}
.editor-filter:hover {
  background:var(--hover);
}
.editor-filter.active {
  border-color:var(--chip-new-line);
  background:var(--green-light);
}
.editor-filter-name {
  font-size:14px;
  font-weight:600;
  display:flex;
  gap:8px;
  align-items:baseline;
  justify-content:space-between;
  overflow-wrap:anywhere;
}
.editor-filter-name small {
  font-size:10px;
  color:var(--dim);
  white-space:nowrap;
  font-weight:400;
}
.editor-filter-rule {
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  font-size:11px;
  line-height:1.6;
  color:var(--dim);
  overflow-wrap:anywhere;
  margin-top:5px;
}
.editor-detail {
  padding:28px 30px;
  box-shadow:0 2px 8px var(--shadow-color);
  border-radius:12px;
  min-width:0;
}
.editor-heading {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:5px;
}
.editor-heading h2 {
  font-size:27px;
  font-weight:600;
  margin:0;
  letter-spacing:-.045em;
  overflow-wrap:anywhere;
}
.editor-heading .quiet {
  font-size:11px;
  white-space:nowrap;
}
.editor-context {
  color:var(--dim);
  font-size:14px;
  line-height:1.6;
  margin-bottom:26px;
}
.editor-sender-heading {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.editor-sender-heading h3 {
  font-size:14px;
  font-weight:600;
  letter-spacing:0;
}
.editor-sender-heading small,
.editor-sender-heading>span {
  color:var(--dim);
  font-size:12px;
}
.editor-senders {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 22px;
}
.sender-chip {
  display:inline-flex;
  align-items:baseline;
  gap:7px;
  border:1px solid var(--chip-line);
  background:var(--chip-bg);
  border-radius:6px;
  padding:6px 9px;
  font-size:12px;
  line-height:1.5;
  max-width:100%;
  overflow-wrap:anywhere;
  color:var(--ink);
}
.sender-chip>span {
  min-width:0;
  overflow-wrap:anywhere;
}
.sender-chip.is-new {
  background:var(--chip-new-bg);
  border-color:var(--chip-new-line);
}
.sender-chip small {
  color:var(--green);
  font-size:10px;
  font-weight:650;
  flex-shrink:0;
}
.sender-expression-note {
  color:var(--dim);
  font-size:12px;
  line-height:1.65;
  margin:0 0 20px;
}
.editor-add {
  padding:0;
  margin-bottom:24px;
  background:transparent;
}
.editor-add>label {
  font-size:13px;
  margin-bottom:8px;
}
.editor-add textarea {
  background:var(--paper);
}
.editor-add-row {
  display:flex;
  gap:12px;
  align-items:center;
  margin-top:10px;
}
.editor-add-row>.field-hint {
  margin:0;
  flex:1;
}
.editor-feedback {
  font-size:12px;
  color:var(--orange);
  margin-top:10px;
}
.editor-feedback:empty {
  display:none;
}
.editor-detail textarea {
  font-family:var(--mono);
  font-size:12px;
  min-height:66px;
}
.editor-add textarea {
  font-family:inherit;
  font-size:14px;
  min-height:58px;
}
.editor-advanced {
  border-top:1px solid var(--line);
  padding-top:15px;
  margin-top:16px;
}
.editor-advanced>summary,
.editor-fields>summary,
.editor-actions>summary,
.editor-other-copy>summary,
.editor-search>summary,
.editor-copy-help>summary,
.editor-field-value>summary {
  font-size:12px;
  line-height:1.6;
  padding:4px 0;
}
.editor-advanced>summary {
  color:var(--ink);
}
.editor-advanced .field:first-of-type {
  margin-top:15px;
}
.editor-actions {
  border-top:1px solid var(--line);
  padding-top:14px;
  margin-top:15px;
}
.editor-actions>summary {
  overflow-wrap:anywhere;
}
.editor-actions .actions-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.editor-size {
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.editor-size label {
  margin:0;
}
.editor-size input {
  width:140px;
}
.editor-size select {
  width:auto;
}
.editor-copy {
  margin-top:24px;
  border-top:1px solid var(--line);
  padding-top:20px;
}
.editor-copy h3 {
  margin:6px 0 10px;
}
.editor-copy>.muted {
  font-size:12px;
  line-height:1.7;
}
.editor-status {
  font-size:13px;
  color:var(--dim);
  line-height:1.65;
  margin:0 0 14px;
}
.editor-status.changed {
  color:var(--green);
}
.editor-copy-row {
  margin:0 0 15px;
}
.editor-copy-label {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
}
.editor-copy-label label {
  margin:0;
  font-size:12px;
}
.editor-copy-primary {
  width:100%;
  padding:14px 18px;
  min-height:48px;
  font-size:14px;
  border-radius:8px;
}
.editor-copy textarea {
  background:var(--surface);
  color:var(--ink);
}
.editor-field-value {
  margin-top:8px;
}
.editor-field-value textarea {
  margin-top:8px;
}
.editor-copy-help {
  margin-top:15px;
}
.editor-copy-help p {
  color:var(--dim);
  font-size:12px;
  line-height:1.75;
}
.editor-other-copy {
  margin-top:16px;
}
.editor-search {
  margin-top:18px;
  padding-top:15px;
  border-top:1px solid var(--line);
}
.editor-action-change {
  font-size:12px;
  margin-top:15px;
  color:var(--green);
}
.editor-empty-note {
  color:var(--dim);
  font-size:12px;
  line-height:1.65;
  margin:18px 0 0;
}
.editor-empty {
  max-width:none;
  text-align:left;
}
.editor-empty h2 {
  margin-bottom:12px;
}
@media(max-width:900px) {
  .editor-workspace {grid-template-columns:210px minmax(0,1fr);gap:18px;}
  .editor-detail {padding:24px;}
  .editor-filter-name {display:block;}
  .editor-filter-name small {display:block;margin-top:4px;}
}
@media(max-width:760px) {
  .editor-workspace {grid-template-columns:minmax(0,1fr);}
  .editor-picker {position:static;}
  .editor-list {max-height:224px;}
  .editor-picker .field-hint {padding:0;}
  .editor-filter-name {display:flex;}
  .editor-filter-name small {margin-top:0;}
  .editor-detail {padding:22px 20px;}
  .editor-heading h2 {font-size:25px;}
  .editor-add-row {align-items:flex-start;}
  .editor-add-row .field-hint {font-size:11px;}
  .editor-actions .actions-grid {grid-template-columns:1fr;}
  .editor-size input {width:110px;}
  .tool-switcher {gap:6px;}
  .tool-switcher .task {padding:8px 9px;}
  .other-tool-buttons {flex-direction:column;}
  .editor-copy-label {align-items:flex-start;}
}

.task-number {
  font:10px var(--mono);
  padding-top:3px;
  opacity:.7;
}

.task strong {
  display:block;
  font-weight:650;
  font-size:14px;
}

.task small {
  display:block;
  font-size:11px;
  margin-top:7px;
  color:var(--dim);
}

.content-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  margin-bottom:22px;
}

.content-head p {
  margin-top:7px;
  max-width:620px;
}

.stats {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin:21px 0 24px;
  border:1px solid var(--line);
  border-radius:7px;
  background:var(--paper);
}

.stat {
  padding:15px 19px;
  border-right:1px solid var(--line);
}

.stat:last-child {
  border:0;
}

.stat strong {
  display:block;
  font-size:24px;
  line-height:1.2;
  letter-spacing:-.04em;
}

.stat span {
  font-size:11px;
  color:var(--dim);
}

.finding {
  display:flex;
  gap:15px;
  padding:17px 0;
  border-bottom:1px solid var(--line);
  align-items:flex-start;
}

.finding:last-child {
  border:0;
}

.finding .badge {
  flex-shrink:0;
  margin-top:3px;
}

.finding h3 {
  font-size:14px;
}

.finding p {
  font-size:12px;
  color:var(--dim);
  margin-top:5px;
}

.finding button {
  margin-left:auto;
  flex-shrink:0;
}

.badge {
  display:inline-block;
  font:9px/1.5 var(--mono);
  letter-spacing:.04em;
  padding:3px 7px;
  border-radius:3px;
  background:var(--green-light);
  color:var(--green);
}

.badge.warning {
  color:var(--amber);
  background:var(--warning-bg);
}

.badge.error {
  color:var(--red);
  background:var(--error-bg);
}

.filter-list {
  margin-top:24px;
}

.filter-row {
  border-top:1px solid var(--line);
  padding:12px 0;
}

.filter-row summary {
  display:flex;
  justify-content:space-between;
  gap:15px;
  align-items:center;
  color:var(--ink);
  font-size:13px;
}

.filter-row summary::after {
  content:'+';
  font-family:var(--mono);
  color:var(--dim);
}

.filter-row[open] summary::after {
  content:'−';
}

.filter-row p {
  font-size:12px;
}

.filter-row pre {
  margin:10px 0;
}

.toolbar {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:13px;
}

.toolbar input {
  flex:1;
  min-width:150px;
}

.toolbar select {
  width:auto;
  min-width:140px;
}

.empty {
  padding:35px 20px;
  text-align:center;
  border:1px dashed var(--line);
  border-radius:7px;
  color:var(--dim);
}

.empty h3 {
  color:var(--ink);
  margin-bottom:6px;
}

.empty p {
  font-size:13px;
  max-width:420px;
  margin:0 auto 15px;
}

.notice {
  background:var(--warning-bg);
  border:1px solid var(--warning-line);
  color:var(--amber);
  border-radius:6px;
  padding:13px 17px;
  font-size:13px;
  margin:16px 0;
  white-space:pre-line;
}

.notice.success {
  background:var(--green-light);
  border-color:var(--success-line);
  color:var(--green);
}

.notice.error {
  color:var(--red);
  border-color:var(--error-line);
  background:var(--error-bg);
}

.settings {
  margin-top:15px;
}

.settings-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}

.settings textarea {
  min-height:130px;
}

.settings .full {
  grid-column:1/-1;
}

.settings h2 {
  font-size:18px;
}

.settings-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:18px;
}

.status-line {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  color:var(--dim);
  margin-top:12px;
  flex-wrap:wrap;
}

label {
  display:block;
  font-size:12px;
  font-weight:600;
  margin-bottom:6px;
}

input:not([type=checkbox]):not([type=file]),textarea,select {
  width:100%;
  border:1px solid var(--input-line);
  background:var(--paper);
  color:var(--ink);
  border-radius:5px;
  padding:11px 12px;
  font-size:14px;
  line-height:1.5;
}

input::placeholder,textarea::placeholder {
  color:var(--placeholder);
}

textarea {
  resize:vertical;
  min-height:80px;
}

input[type=checkbox] {
  accent-color:var(--green);
  width:16px;
  height:16px;
  flex-shrink:0;
}

.field {
  margin-bottom:17px;
}

.field-hint {
  font-size:11px;
  color:var(--dim);
  margin-top:5px;
}

.form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:22px;
}

.form-grid .full {
  grid-column:1/-1;
}

.actions-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:11px 16px;
  margin:17px 0;
}

.check-label {
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:400;
  font-size:12px;
  margin:0;
}

.form-section {
  padding-top:20px;
  border-top:1px solid var(--line);
  margin-top:20px;
}

.form-section h3 {
  font-size:15px;
  margin-bottom:15px;
}

.query {
  display:block;
  font:12px/1.7 var(--mono);
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  background:var(--green-light);
  color:var(--green);
  border-radius:5px;
  padding:13px 15px;
  margin:10px 0;
}

.action-summary {
  font-size:12px;
  color:var(--dim);
}

.form-buttons {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:20px;
  align-items:center;
}

.ai-note {
  font-size:11px;
  color:var(--dim);
  margin-top:10px;
  max-width:680px;
}

.ai-note a {
  font-size:inherit;
}

.mode-switch {
  display:inline-flex;
  background:var(--surface);
  border-radius:6px;
  padding:3px;
  margin-bottom:22px;
}

.mode-switch button {
  background:transparent;
  padding:8px 14px;
  border-radius:4px;
  font-size:12px;
  color:var(--dim);
}

.mode-switch button.active {
  color:var(--ink);
  background:var(--paper);
  box-shadow:0 1px 3px var(--shadow-color);
}

.sample-list {
  margin:18px 0;
  max-height:300px;
  overflow:auto;
}

.sample-email {
  padding:10px 0;
  border-top:1px solid var(--line);
  font-size:12px;
}

.sample-email p {
  margin:2px 0;
}

.progress-wrap {
  margin-top:15px;
}

.progress-wrap progress {
  width:100%;
  accent-color:var(--green);
}

.results-head {
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  margin:29px 0 14px;
}

.results-head h2 {
  font-size:21px;
}

.results-summary {
  font-size:13px;
  margin-bottom:17px;
  color:var(--dim);
}

.proposal {
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:8px;
  margin-bottom:12px;
  padding:20px 22px;
}

.proposal.selected {
  border-color:var(--green);
}

.proposal-top {
  display:flex;
  gap:12px;
  align-items:flex-start;
}

.proposal-top input {
  margin-top:4px;
}

.proposal-top h3 {
  font-size:15px;
}

.proposal-body {
  padding-left:29px;
  margin-top:12px;
}

.proposal-body p {
  font-size:13px;
}

.proposal .badge {
  margin-bottom:6px;
}

.comparison {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:15px 0;
}

.comparison p {
  font-size:10px;
  font-family:var(--mono);
  color:var(--dim);
  text-transform:uppercase;
}

.comparison .query {
  margin-top:5px;
  font-size:11px;
}

.comparison .before .query {
  color:var(--dim);
  background:var(--surface);
}

.proposal-warning {
  background:var(--warning-bg);
  border-radius:4px;
  color:var(--amber);
  padding:10px 12px;
  font-size:12px;
  margin-top:12px;
}

.proposal-warning .check-label {
  margin-top:8px;
}

.review-bar {
  background:var(--strong-bg);
  color:var(--strong-ink);
  padding:20px 24px;
  border-radius:8px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin-top:18px;
}

.review-bar label {
  color:var(--strong-ink);
  font-size:11px;
}

.review-bar select {
  background:var(--strong-input);
  color:var(--strong-ink);
  border-color:var(--strong-line);
  font-size:12px;
  padding:8px 10px;
}

.review-bar .primary {
  background:var(--review-action);
  color:var(--review-action-ink);
  white-space:nowrap;
}

.review-bar .primary:hover {
  background:var(--review-action-hover);
}

.review-bar p {
  font-size:12px;
  margin-top:4px;
  color:var(--strong-muted);
}

.download-panel {
  margin-top:25px;
  border-color:var(--green);
}

.download-panel h2 {
  font-size:20px;
  margin-bottom:12px;
}

.download-panel ol {
  font-size:13px;
  padding-left:23px;
  margin:17px 0;
}

.download-panel li {
  padding-bottom:8px;
}

.delete-list {
  border-left:2px solid var(--orange);
  padding-left:15px;
  margin:15px 0;
}

.delete-list .query {
  background:var(--delete-bg);
  color:var(--delete-ink);
}

.labels-list {
  font-size:12px;
  padding:12px 14px;
  background:var(--green-light);
  border-radius:5px;
}

.inline-link {
  border:0;
  background:none;
  padding:0;
  color:var(--green);
  text-decoration:underline;
  text-underline-offset:3px;
  font-size:inherit;
}

.spacer {
  margin-top:20px;
}

.result-findings {
  margin:17px 0;
}

.result-findings p {
  font-size:13px;
}

.label-bars {
  margin-top:17px;
}

.label-bar {
  display:grid;
  grid-template-columns:140px 1fr 27px;
  gap:13px;
  align-items:center;
  font-size:12px;
  margin-bottom:10px;
}

.label-bar>span {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.label-bar meter {
  width:100%;
  height:9px;
}

.label-bar meter::-webkit-meter-bar {
  border:0;
  background:var(--meter-bg);
  border-radius:2px;
}

.label-bar meter::-webkit-meter-optimum-value {
  background:var(--green);
  border-radius:2px;
}

footer {
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin:55px 0 26px;
  padding-top:18px;
  border-top:1px solid var(--line);
  font:11px/1.6 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--dim);
}

@media(max-width:850px) {
  .shell {
    padding:0 26px;
  }
  .source-top {
    align-items:flex-start;
    flex-direction:column;
  }
  .source-buttons {
    width:100%;
  }
  .intro h1 {
    font-size:36px;
  }
  .task {
    padding:16px 12px;
    gap:10px;
  }
  .task small {
    font-size:10px;
  }
  .finding {
    flex-wrap:wrap;
  }
  .finding button {
    margin-left:0;
  }
  .actions-grid {
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:560px) {
  .shell {
    padding:0 18px;
  }
  .masthead {
    height:68px;
  }
  .intro {
    padding:24px 0;
    display:block;
  }
  .intro h1 {
    font-size:32px;
    margin-bottom:14px;
  }
  .lede {
    font-size:15px;
  }
  .intro-note {
    margin-top:23px;
    display:none;
  }
  .panel {
    padding:20px 18px;
  }
  .source-buttons .primary,.source-buttons .button {
    flex:1;
    white-space:nowrap;
  }
  .section-label {
    display:block;
  }
  .privacy-note {
    display:block;
    margin-top:5px;
  }
  .task-nav {
    gap:6px;
  }
  .task {
    display:block;
    padding:13px 9px;
    min-width:0;
  }
  .task-number {
    display:block;
    margin-bottom:9px;
  }
  .task strong {
    font-size:12px;
  }
  .task small {
    display:none;
  }
  .content-head {
    display:block;
  }
  .content-head>button {
    margin-top:13px;
  }
  .stats {
    grid-template-columns:repeat(2,1fr);
  }
  .stat:nth-child(2) {
    border-right:0;
  }
  .stat:nth-child(-n+2) {
    border-bottom:1px solid var(--line);
  }
  .form-grid,.settings-grid,.comparison {
    grid-template-columns:1fr;
  }
  .settings-grid .full,.form-grid .full {
    grid-column:auto;
  }
  .actions-grid {
    gap:14px 10px;
  }
  .review-bar {
    align-items:stretch;
    flex-direction:column;
    padding:18px;
  }
  .proposal {
    padding:17px 15px;
  }
  .proposal-body {
    padding-left:0;
  }
  .results-head {
    align-items:flex-start;
  }
  .label-bar {
    grid-template-columns:100px 1fr 24px;
  }
  footer {
    flex-direction:column;
    gap:8px;
  }
  .form-buttons .primary {
    width:100%;
  }
  .source-tools {
    align-items:flex-start;
  }
  .filter-row summary {
    font-size:12px;
  }
  .finding {
    gap:10px;
  }
  .finding>div {
    flex:1;
    min-width:160px;
  }
}

@media(prefers-reduced-motion:no-preference) {
  button,.button {
    transition:background .15s,border-color .15s;
  }
  html {
    scroll-behavior:smooth;
  }
}