.project-plan { max-width: 920px; margin: 0 auto 4rem; }
.plan-intro { margin: var(--space-4) 0 var(--space-3); }
.plan-intro h1 { margin: .2rem 0; }
.plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-12); }
.plan-card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); padding: var(--space-3) var(--space-3); margin: var(--space-12) 0; }
.plan-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-12); }
.plan-card h2 { font-size: var(--text-lg); margin: 0 0 var(--space-2); }
.plan-state { color: var(--muted); font-size: var(--text); white-space: nowrap; }
.plan-excerpt { margin: var(--space-2) 0 var(--space-12); overflow-wrap: anywhere; }
.plan-excerpt, .plan-card p { max-width: 47ch; }
.plan-card details { border-top: 1px solid #D8DADF; padding-top: var(--space-2); }
/* A fold that opens its card draws no line with nothing above it (the card's own border is there). */
.plan-card>details:first-child { border-top: 0; padding-top: 0; }
.plan-card summary { cursor: pointer; font-weight: 600; }
.plan-label { display: block; font-weight: 600; font-size: var(--text); margin: var(--space-12) 0 var(--space-1); }
.plan-card textarea, .plan-card select { box-sizing: border-box; display: block; width: 100%; max-width: 100%; font: inherit; padding: var(--space-2) var(--space-3); border: 1px solid var(--border-strong); border-radius: var(--radius-btn); background: var(--paper); }
.plan-card textarea { min-height: 6rem; resize: vertical; }
.plan-actions { display: flex; flex-wrap: wrap; gap: var(--space-12); margin: var(--space-3) 0; }
.project-discussion { max-width: 850px; }
.discussion-comment { border-top: 1px solid var(--line); padding: var(--space-12) 0; overflow-wrap: anywhere; }
.discussion-comment.reply { margin-left: var(--space-3); padding-left: var(--space-3); border-left: 2px solid var(--line); }
/* RC2 S2c: a reply to a reply indents a step further, capped at three deep (the markup stays one flat list). */
.discussion-comment.depth-2 { margin-left: calc(var(--space-3) + var(--space-4)); }
.discussion-comment.depth-3 { margin-left: calc(var(--space-3) + 2 * var(--space-4)); }
.discussion-meta { color: var(--muted); font-size: var(--text); margin: 0; }
.discussion-about, .discussion-state { display: inline-block; margin-left: var(--space-1); padding: var(--space-1) var(--space-2); border-radius: var(--radius-sm); background: var(--pill-bg); color: var(--ink); font-size: var(--text-label); line-height: 1.2; white-space: nowrap; }
.discussion-body { white-space: pre-wrap; margin: var(--space-2) 0; }
.discussion-sort { font-size: var(--text); margin: var(--space-2) 0 var(--space-12); }
.discussion-filter { font-size: var(--text); margin: var(--space-2) 0 0; }
.discussion-sort a[aria-current], .discussion-filter a[aria-current] { font-weight: 700; color: inherit; text-decoration: none; }
.discussion-actions { color: var(--muted); font-size: var(--text); margin: .2rem 0; display: flex; align-items: center; flex-wrap: wrap; gap: 0; }
.discussion-sort a, .discussion-filter a, .discussion-actions a, .discussion-actions button, .discussion-comment > a, .project-plan > a { display: inline-flex; align-items: center; min-height: var(--tap); min-width: var(--tap); }
/* RC2 R2 (the prototype's `.thread-actions`, style.css): ↑, the score, ↓ as quiet 44 px marks, the pressed one in the
   accent and bold; Reply and Report as quiet text actions, underlined on hover; the drawn 14-15 px sizes at the floor. */
.discussion-vote, .discussion-remove { display: inline; margin: 0; }
/* RC2 B-1: Remove, the one destructive action, apart at the row's end. */
.discussion-remove { margin-left: auto; }
.discussion-actions .discussion-arrow { justify-content: center; width: var(--tap); padding: 0; border: 0; border-radius: var(--radius-btn); background: transparent; box-shadow: none; color: var(--muted); font-size: var(--text-lg); font-weight: 400; line-height: 1; text-decoration: none; }
.discussion-actions .discussion-arrow[aria-pressed="true"] { color: var(--accent); font-weight: 700; }
.discussion-score { min-width: var(--space-4); text-align: center; color: var(--muted); font-size: var(--text); }
.discussion-actions > a:not(.discussion-arrow), .discussion-actions .action-link { justify-content: center; padding: 0 var(--space-2); color: var(--muted); text-decoration: none; }
.discussion-actions > a:not(.discussion-arrow):hover, .discussion-actions .action-link:hover { text-decoration: underline; }
/* RC2 B-1: a row you can't vote on (your own comment; every comment for the creator) keeps the score between muted
   marks, not controls; the reason shows below them on hover and on focus (Explore's `.xp-own-vote`). */
.discussion-novote { position: relative; display: inline-flex; align-items: center; min-height: var(--tap); cursor: help; }
.discussion-novote > [aria-hidden] { display: inline-flex; align-items: center; justify-content: center; min-width: var(--tap); color: var(--muted); font-size: var(--text-lg); line-height: 1; opacity: .45; }
.discussion-novote::after { content: attr(data-tip); position: absolute; left: 0; top: calc(100% + var(--space-1)); z-index: 5; width: max-content; max-width: 260px; padding: var(--space-1) var(--space-2); border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 15%, transparent); color: var(--ink); font-size: var(--text); line-height: 1.3; white-space: normal; visibility: hidden; opacity: 0; pointer-events: none; }
.discussion-novote:hover::after, .discussion-novote:focus::after { visibility: visible; opacity: 1; }
/* RC2 R2: the reply box's Reply and Cancel in one row, its caption under them. */
.discussion-reply-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-2) 0; }
.discussion-reply .muted { margin: 0; font-size: var(--text); }
/* RC2 R2 (review round 1): the composer's caption sits under its button, as drawn (`revision3.js:11`), as close as the
   reply box's. */
.discussion-compose .muted { margin: var(--space-2) 0 0; font-size: var(--text); }
/* RC2 S2c3: a comment's replies fold under a quiet "Hide replies (n)"; the summary shows the word for the fold's state.
   RC2 R2: the folds nest, so each word is keyed on its own fold (`> summary`): a closed fold inside an open one still
   shows "Show replies". */
.discussion-replies > summary { min-height: var(--tap); width: fit-content; margin: 0; color: var(--accent); font-size: var(--text); font-weight: 600; }
.discussion-replies:not([open]) > summary .discussion-hide, .discussion-replies[open] > summary .discussion-show { display: none; }
/* RC2 S2c: the composer (above the threads) and an open reply box are tinted boxes, as in the prototype. */
.discussion-compose, .discussion-reply { margin: var(--space-3) 0; background: var(--rail-bg); border-radius: var(--radius); }
.discussion-compose { padding: var(--space-4); border: 0; margin: 0 0 var(--space-4); }
.discussion-compose h3 { font-size: var(--text-lg); margin: 0 0 var(--space-3); }
.discussion-reply { padding: var(--space-3); }
.discussion-triage { display: flex; align-items: end; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-12) 0; }
.discussion-triage label { display: grid; gap: var(--space-1); font-size: var(--text); }
.discussion-triage select, .discussion-compose select { font: inherit; padding: var(--space-2) var(--space-3); border: 1px solid var(--border-strong); border-radius: var(--radius-btn); background: var(--paper); max-width: 100%; }
.discussion-compose label, .discussion-reply label { display: block; font-weight: 600; }
.discussion-compose select { margin: var(--space-1) 0 var(--space-3); }
.discussion-compose textarea, .discussion-reply textarea { box-sizing: border-box; display: block; width: 100%; max-width: 100%; margin: var(--space-1) 0; font: inherit; padding: var(--space-2) var(--space-3); border: 1px solid var(--border-strong); border-radius: var(--radius-btn); }
@media (max-width: 640px) { .plan-grid { grid-template-columns: 1fr; } .plan-card { padding: var(--space-3); } .discussion-comment.reply { margin-left: var(--space-2); padding-left: var(--space-2); } .discussion-comment.depth-2 { margin-left: calc(var(--space-2) + var(--space-2)); } .discussion-comment.depth-3 { margin-left: calc(var(--space-2) + 2 * var(--space-2)); } .discussion-compose { padding: var(--space-3); } }

#now .pp-release-details > ul, #now .pp-now-foot > details > ul, #change > ul { overflow-wrap: anywhere; }
