/* V9: decisions use daylight; completed decisions return to ink. */
.suggestion-proof { min-width: 0; margin-top: 14px; overflow: hidden; border-radius: 14px; background: var(--paper, #fff); box-shadow: var(--lift, 0 0 0 .5px rgba(13,21,48,.16), 0 12px 25px -20px rgba(13,21,48,.32)); }
.suggestion-proof > header { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; padding: 11px 12px 9px 14px; font-size: 12px; color: var(--ink-3, #626c85); }
.suggestion-proof > header strong { display: inline-flex; align-items: center; gap: 7px; color: var(--sun-ink, #985606); font-size: 12.5px; font-weight: 600; letter-spacing: .06em; }
.suggestion-proof > header i { width: 6px; height: 6px; border-radius: 50%; background: var(--sun, #f2a23a); }
.suggestion-proof > header > span { margin-left: auto; }
.suggestion-well { margin: 0 5px; border-radius: 10px; background: var(--sun-wash, #fff4e1); box-shadow: inset 0 0 0 .5px rgba(152,86,6,.18); }
.suggestion-proof .suggestion-row { margin: 0; padding: 5px 10px; border: 0; background: none; box-shadow: none; border-radius: 0; }
.suggestion-proof .suggestion-row + .suggestion-row { box-shadow: inset 0 .5px 0 rgba(152,86,6,.16); }
.suggestion-heading { display: flex; align-items: center; gap: 8px; min-height: 40px; }
.suggestion-check { display: flex; align-items: center; gap: 8px; min-height: 44px; min-width: 0; flex: 1; margin: 0; font-size: 14px; font-weight: 600; cursor: pointer; color: var(--ink, #0d1530); }
.suggestion-check input { appearance: none; -webkit-appearance: none; flex: none; width: 18px; height: 18px; padding: 0; margin: 0; border: .5px solid var(--ink-3, #626c85); border-radius: 6px; background: var(--paper, #fff); cursor: pointer; position: relative; box-shadow: none; }
.suggestion-check input:checked { background: var(--ink, #0d1530); border-color: var(--ink, #0d1530); }
.suggestion-check input:checked::after { content: ''; display: block; width: 8px; height: 4px; margin: 4px 3px; border: solid #fff; border-width: 0 0 1.5px 1.5px; transform: rotate(-45deg); }
.suggestion-check input:focus-visible { outline: 2px solid var(--ink, #0d1530); outline-offset: 4px; }
.suggestion-heading time { flex: none; white-space: nowrap; font-size: 12px; font-variant-numeric: tabular-nums; color: var(--sun-ink, #985606); }
.suggestion-heading sup, .suggestion-source-number { padding-left: 2px; font-size: 10px; font-weight: 500; color: var(--sun-ink, #985606); vertical-align: super; }
.suggestion-proof > footer { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; padding: 8px; }
.suggestion-proof > footer:empty { display: none; }
.suggestion-proof > footer button { min-height: 40px; padding: 8px 12px; font-size: 12.5px; border-radius: 10px; white-space: nowrap; }
.suggestion-proof > footer .primary { background: var(--ink, #0d1530); color: #fff; }
.suggestion-proof > footer .secondary { background: var(--mist, #f3f5f9); color: var(--ink-2, #38425c); border: 0; }
.suggestion-proof > footer button:disabled { opacity: .45; }
.suggestion-proof.is-decided > header strong, .suggestion-proof.is-decided .result-link { color: var(--ink-2, #38425c); }
.suggestion-proof.is-decided > header i { background: var(--ink, #0d1530); }
.suggestion-proof.is-decided .suggestion-well { background: var(--mist, #f3f5f9); box-shadow: inset 0 0 0 .5px var(--hair-2, rgba(13,21,48,.09)); }
.suggestion-accepted .result-link { display: flex; gap: 10px; align-items: center; justify-content: space-between; width: 100%; min-height: 44px; padding: 0; background: none; font-size: 13px; text-align: left; }
.suggestion-accepted .result-link span { flex: none; font-size: 12px; color: var(--ink-3, #626c85); }
.suggestion-proof .suggestion-empty { margin: 0; padding: 16px 10px; font-size: 13px; line-height: 1.7; color: var(--ink-3, #626c85); }
.suggestion-proof .error { padding: 8px 12px; }
.suggestion-proof .suggestion-well > .text-button { margin: 0 10px 10px; }
.suggestion-proof .suggestion-fields { margin: 6px 0 8px 27px; }
.suggestion-proof.is-reviewing .suggestion-check { flex: none; width: 20px; }
.suggestion-proof.is-reviewing .suggestion-check > span { display: none; }
.suggestion-expand { flex: 1; min-width: 0; min-height: 44px; padding: 4px 0; background: none; text-align: left; font-size: 14px; font-weight: 600; line-height: 1.5; color: var(--ink, #0d1530); }
.suggestion-proof.is-reviewing .is-expanded { margin: 4px; padding: 3px 6px; border-radius: 9px; background: var(--paper, #fff); box-shadow: 0 0 0 .5px rgba(152,86,6,.18); }
.suggestion-fields { display: grid; gap: 0; border-top: .5px solid var(--hair-2, rgba(13,21,48,.09)); }
.suggestion-fields label { display: grid; grid-template-columns: 42px minmax(0,1fr); align-items: center; gap: 8px; margin: 0; padding: 5px 0; border-bottom: .5px solid var(--hair-2, rgba(13,21,48,.09)); }
.suggestion-fields label:last-child { border: 0; }
.suggestion-fields label > span { font-size: 12px; color: var(--ink-3, #626c85); }
.suggestion-fields input, .suggestion-fields textarea { box-sizing: border-box; width: 100%; min-width: 0; min-height: 38px; margin: 0; padding: 7px 4px; color: var(--ink, #0d1530); background: transparent; border: 0; box-shadow: none; border-radius: 5px; font: inherit; font-size: 14px; }
.suggestion-fields textarea { resize: vertical; }
.suggestion-fields input:focus, .suggestion-fields textarea:focus { outline: 1px solid var(--ink, #0d1530); outline-offset: 1px; }
.suggestion-fields input:disabled, .suggestion-fields textarea:disabled { opacity: .5; }
.suggestion-row blockquote { margin: 0 0 5px 28px; padding: 0; border: 0; font-family: var(--serif, 'Songti SC', serif); font-size: 12.5px; line-height: 1.7; color: var(--ink-3, #626c85); white-space: pre-wrap; overflow-wrap: anywhere; }
.suggestion-row blockquote::before { content: '“'; }
.suggestion-row blockquote::after { content: '”'; }
.suggestion-source-mark { background: none; color: inherit; box-shadow: inset 0 -1.5px 0 var(--sun, #f2a23a); }
#suggestions-dialog { width: min(100% - 32px, 560px); max-height: min(90dvh, 850px); padding: 20px 20px 0; border: 0; border-radius: 22px; background: var(--paper, #fff); color: var(--ink, #0d1530); box-shadow: var(--lift); }
#suggestions-dialog::backdrop { background: rgba(13,21,48,.36); }
#suggestions-dialog .dialog-heading { align-items: flex-start; margin-bottom: 0; }
#suggestions-title { font-size: 19px; font-weight: 600; letter-spacing: .02em; }
#suggestions-close { width: 44px; height: 44px; flex: none; border-radius: 50%; background: var(--mist, #f3f5f9); }
#suggestions-note { margin: -4px 44px 16px 0; color: var(--ink-3, #626c85); font-size: 12.5px; line-height: 1.6; }
.suggestion-source { margin: 0 0 14px; padding: 14px 16px; border-radius: 14px; background: var(--mist, #f3f5f9); }
.suggestion-source > div { display: flex; justify-content: space-between; gap: 10px; font-size: 11px; color: var(--ink-3, #626c85); }
.suggestion-source > div strong { letter-spacing: .12em; }
.suggestion-source p { max-height: 220px; overflow: auto; margin: 8px 0 0; font-family: var(--serif, 'Songti SC', serif); font-size: 15.5px; line-height: 1.85; color: var(--ink-text, #1c2440); white-space: pre-wrap; overflow-wrap: anywhere; }
.suggestion-review-rows { display: grid; gap: 10px; }
#suggestions-dialog .suggestion-row { margin: 0; padding: 4px 12px 10px; border: 0; border-radius: 14px; box-shadow: 0 0 0 .5px var(--hair, rgba(13,21,48,.16)); }
#suggestions-dialog .suggestion-row.is-expanded { box-shadow: 0 0 0 1.5px var(--ink, #0d1530); }
#suggestions-dialog .suggestion-check { flex: none; width: 20px; }
#suggestions-dialog .suggestion-check > span { display: none; }
#suggestions-dialog .suggestion-fields { margin-left: 28px; }
.suggestion-kind { flex:none; padding:3px 7px; border-radius:7px; background:var(--sun-wash); color:var(--sun-ink); font-size:11px; line-height:1.4; }
#suggestions-dialog .suggestion-fields { margin-top:4px; border:0; border-radius:9px; padding:0 10px; background:var(--mist); }
#suggestions-dialog .suggestion-fields label { min-height:44px; padding:0; grid-template-columns:36px minmax(0,1fr); }
#suggestions-dialog .suggestion-fields input,#suggestions-dialog .suggestion-fields textarea { min-height:44px; padding:8px 0; line-height:28px; }
#suggestions-dialog .suggestion-row.is-expanded { padding-top:4px; padding-bottom:12px; }
.suggestion-proof.is-reviewing .suggestion-row.is-expanded > blockquote { display:none; }
.suggestion-proof.is-reviewing .suggestion-fields { margin-top:4px; padding:0 10px; border:0; border-radius:9px; background:var(--mist); }
.suggestion-proof.is-reviewing .suggestion-fields label { min-height:44px; padding:0; }
.suggestion-proof.is-reviewing .suggestion-fields input,.suggestion-proof.is-reviewing .suggestion-fields textarea { min-height:44px; padding:8px 0; line-height:28px; }
@media(min-width:981px){
 .journal-row:has(.suggestion-proof.is-reviewing) .entry-content:has(.entry-prose:not(.organized)){position:relative;isolation:isolate}
 .journal-row:has(.suggestion-proof.is-reviewing) .entry-content:has(.entry-prose:not(.organized))::before{content:'';position:absolute;z-index:-1;inset:-10px -14px -12px;border-radius:14px;background:var(--sun-wash);box-shadow:inset 0 0 0 .5px rgba(152,86,6,.2);pointer-events:none}
}
#suggestions-actions { position: sticky; bottom: 0; display: block; padding: 12px 0 max(20px, env(safe-area-inset-bottom)); margin: 16px 0 0; background: var(--paper, #fff); box-shadow: 0 -.5px 0 var(--hair, rgba(13,21,48,.16)); }
.suggestion-selection-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px;font-size:12px;color:var(--ink-3)}
.suggestion-selection-tools .text-button,.suggestion-proof>header .suggestion-toggle{min-height:44px;padding:0 8px;white-space:nowrap;font-size:13px;color:var(--ink-2)}
.suggestion-proof>header .suggestion-toggle{margin-left:auto}
#suggestions-accept { min-height: 50px; width: 100%; border-radius: 16px; font-size: 15.5px; background: var(--ink, #0d1530); color: #fff; }
/* The ordinary Mac proof card follows the compact V9 rows and grouped actions.
   Touch layouts retain the full label and button hit areas above. */
.suggestion-source-note { display: none; }
@media (min-width: 981px) {
  .suggestion-proof:not(.is-reviewing):not(.is-decided) .suggestion-row { padding: 8px 10px; }
  .suggestion-proof:not(.is-reviewing):not(.is-decided) .suggestion-heading,
  .suggestion-proof:not(.is-reviewing):not(.is-decided) .suggestion-check,
  .suggestion-proof:not(.is-reviewing):not(.is-decided) .suggestion-accepted .result-link { min-height: 20px; line-height: 20px; }
  .suggestion-proof:not(.is-reviewing):not(.is-decided) .suggestion-check input { min-height: 18px; }
  .suggestion-proof:not(.is-reviewing):not(.is-decided) > footer { justify-content: flex-end; gap: 10px; padding: 9px 8px 9px 14px; }
  .suggestion-proof:not(.is-reviewing):not(.is-decided) > footer button { min-height: 30px; padding: 0 12px; border-radius: 15px; }
  .journal-row:has(.entry-prose .suggestion-source-mark) .suggestion-source-note { display: block; margin-right: auto; color: var(--ink-3, #626c85); font-size: 11.5px; line-height: 1.5; }
}
@media (max-width: 980px) {
  .suggestion-proof > footer button { min-height: 44px; }
  #suggestions-dialog { width: 100%; max-width: none; max-height: calc(100dvh - 60px); margin: auto 0 0; padding: 20px 16px 0; border-radius: 22px 22px 0 0; }
  #suggestions-dialog::before { content: ''; display: block; width: 38px; height: 5px; margin: -12px auto 16px; border-radius: 3px; background: var(--line-2, #c2c9d6); }
  .suggestion-fields input, .suggestion-fields textarea { font-size: 16px; }
}
.suggestion-proof.is-decided{display:flex;align-items:center;justify-content:space-between;padding:5px 12px;background:transparent;box-shadow:none;border-radius:0;font-size:12px;color:var(--ink-3)}.suggestion-proof.is-decided .text-button{min-height:34px;font-size:12px}

/* Input and tick share the same grid cell; only the SVG stroke animates. */
.suggestion-check{display:grid;grid-template-columns:18px minmax(0,1fr);column-gap:8px}.suggestion-check input{grid-column:1;grid-row:1;display:grid;place-items:center}.suggestion-check input:checked::after{content:none}.suggestion-checkmark{grid-column:1;grid-row:1;justify-self:center;align-self:center;width:13px;height:13px;pointer-events:none;opacity:0;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.suggestion-checkmark path{stroke-dasharray:18;stroke-dashoffset:18}.suggestion-check input:checked+.suggestion-checkmark{opacity:1}.suggestion-check input:checked+.suggestion-checkmark path{stroke-dashoffset:0}.suggestion-check>span{grid-column:2;grid-row:1}
@media(prefers-reduced-motion:no-preference){.suggestion-checkmark path{transition:stroke-dashoffset .2s ease-out}}

.suggestion-checkmark{position:relative;z-index:1}

/* Time and reminder controls share the existing quiet form typography. */
.suggestion-time-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.suggestion-fields > label,.suggestion-time-fields > label{grid-template-columns:minmax(0,1fr);gap:2px;min-width:0}
.suggestion-fields select{box-sizing:border-box;width:100%;min-width:0;min-height:44px;margin:0;padding:8px 4px;background:transparent;border:0;border-radius:5px;color:var(--ink);font:inherit}
.suggestion-fields select:focus{outline:1px solid var(--ink);outline-offset:1px}
.suggestion-fields select:disabled{opacity:.5}
@media(max-width:980px){.suggestion-fields select{font-size:16px}}

:is(#suggestions-dialog,.suggestion-proof.is-reviewing) .suggestion-fields label{display:flex;flex-direction:column;align-items:stretch;gap:3px;padding:7px 0}
:is(#suggestions-dialog,.suggestion-proof.is-reviewing) .suggestion-fields label>span:first-child{line-height:20px}
.suggestion-time-fields{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}

/* Long reviews scroll above the action; the action never covers a field. */
#suggestions-dialog{overflow:hidden}
#suggestions-dialog[open]{display:flex;flex-direction:column}
#suggestions-dialog>.dialog-heading,#suggestions-note{flex-shrink:0}
#suggestions-form{display:flex;flex-direction:column;min-height:0;overflow:hidden}
#suggestions-content{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:2px}
#suggestions-actions{position:static;flex-shrink:0}

.suggestion-fields .date-display-field input:disabled{opacity:0}

/* The formatted value is an editable control, not the field caption. */
.suggestion-fields label > .date-display-field{color:var(--ink)}
.suggestion-fields .date-display-value{white-space:nowrap}
@media(max-width:360px){.suggestion-time-fields:has(input[type=date]){grid-template-columns:minmax(0,1fr)}}