/* Developer tasks keep D's palette and type, with one quiet workspace hierarchy. */
.developer-work-page {max-width:1200px; margin-inline:auto}
.developer-work-page>.flow-back {margin-bottom:20px}
.developer-work-layout {display:grid; grid-template-columns:208px minmax(0,1fr); gap:40px; align-items:start}
.developer-work-nav {position:sticky; top:112px; display:grid; gap:24px; border-top:1px solid var(--line); padding-top:16px; max-height:calc(100dvh - 140px); overflow:auto; padding-right:4px}
.developer-work-nav section {min-width:0}
.developer-work-nav h2 {font:600 13px/1.75 var(--body); color:var(--muted); padding:0 12px 8px}
.developer-work-nav a {display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 12px; min-height:44px; border-radius:8px; font-size:14px; color:var(--muted)}
.developer-work-nav a:hover {background:var(--soft); color:var(--ink)}
.developer-work-nav a[aria-current] {color:var(--primary); background:var(--selected); font-weight:600}
.developer-work-nav svg {width:16px; height:16px}
.developer-record-navigation {margin-top:16px; border-top:1px solid var(--line); padding-top:12px}
.developer-record-navigation>span {display:block; font-size:12px; color:var(--muted); padding:0 12px 8px; overflow-wrap:anywhere}
.developer-work-nav .developer-work-home {border-top:1px solid var(--line); border-radius:0; margin-top:4px; padding-top:16px}
.developer-work-main {min-width:0}
.developer-work-main>.flow-heading {margin-bottom:24px}
.developer-work-main>.flow-heading h1 {font-size:32px; text-align:left; text-wrap:pretty}
.developer-work-main>.flow-heading p {font-size:14px; max-width:52em; margin-top:8px}
.developer-work-main>.demo-note {font-size:12px; margin-top:32px}
.developer-work-toolbar {display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:20px}
.developer-work-toolbar>p {font-size:14px; font-variant-numeric:tabular-nums}
.developer-work-toolbar>p span {display:block; font-size:12px; color:var(--muted); margin-top:2px}
.developer-work-toolbar .form-actions {margin:0; gap:16px}
.developer-work-toolbar .primary {min-height:44px; font-size:14px; padding:8px 16px}
.developer-work-toolbar .text-link {font-size:13px; min-height:44px}
.developer-work-filter {gap:8px; margin-bottom:0; padding-bottom:16px; border-bottom:1px solid var(--line)}
.developer-work-filter button {display:inline-flex; gap:8px; align-items:center; min-height:40px; font-size:13px; padding:8px 12px}
.developer-work-filter button>span {font-size:12px; font-variant-numeric:tabular-nums; opacity:.85}
.developer-work-records .developer-work-record {display:grid; grid-template-columns:minmax(0,1fr) 144px; gap:24px; padding:24px 0}
.developer-record-copy {min-width:0}
.developer-record-copy .work-meta {font-size:12px; gap:12px; margin-bottom:6px}
.developer-record-copy h2 {font-size:20px; line-height:1.55; margin:0 0 8px}
.developer-record-copy h2>button {min-height:0; padding:0; line-height:inherit; color:var(--ink)}
.developer-record-copy h2>button:hover {color:var(--primary)}
.developer-record-copy .developer-record-excerpt {font-size:14px; color:var(--muted); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; margin:0 0 10px}
.developer-related-problem {display:inline-flex; align-items:center; gap:8px; min-height:32px; font-size:13px; color:var(--primary); line-height:1.7; overflow-wrap:anywhere}
.developer-related-problem svg {width:16px; height:16px}
.developer-related-problem:hover {text-decoration:underline; text-underline-offset:4px}
.developer-record-copy .return-reason,.developer-record-pending {font-size:13px; margin-top:8px}
.developer-record-pending {color:var(--primary)}
.developer-record-actions {display:flex; flex-direction:column; align-items:end; gap:8px; justify-content:center}
.developer-record-actions .secondary {padding:8px 12px; min-height:40px; font-size:13px; white-space:nowrap}
.developer-record-actions .text-link {font-size:13px; min-height:32px; padding:0}
.developer-work-empty {padding:64px 24px; text-align:center; border-bottom:1px solid var(--line)}
.developer-empty-symbol {display:inline-flex; color:var(--primary); background:var(--selected); width:48px; height:48px; align-items:center; justify-content:center; border-radius:12px; margin-bottom:16px}
.developer-work-empty h2 {font:600 22px/1.5 var(--display); margin-bottom:12px}
.developer-work-empty p {color:var(--muted); font-size:14px; max-width:36em; margin:0 auto 24px}
.developer-work-empty .primary {min-height:44px; font-size:14px; margin-inline:8px; padding:8px 16px}
.developer-work-empty .text-link {font-size:13px; margin-inline:8px; min-height:44px}
.developer-compose-layout,.developer-content-grid {display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:40px; align-items:start}
.developer-work-main .developer-work-reading {max-width:none}
.developer-work-reading p {white-space:pre-wrap; overflow-wrap:anywhere}
.developer-work-reading .developer-status h2,.developer-work-form .developer-status h2 {font-size:18px; line-height:1.6; margin-bottom:8px}
.developer-work-reading .developer-status p,.developer-work-form .developer-status p {font-size:14px}
.developer-record-status {display:flex; align-items:start; justify-content:space-between; gap:24px; padding:20px; margin-bottom:20px}
.developer-record-status>span {font-size:12px; color:var(--muted); white-space:nowrap; padding-top:4px}
.developer-record-primary-actions {gap:12px; margin:0 0 32px}
.developer-record-primary-actions .primary,.developer-record-primary-actions .secondary {min-height:44px; font-size:14px; padding:8px 16px}
.developer-record-primary-actions .text-link {font-size:13px; min-height:44px}
.developer-content-section {margin-top:32px}
.developer-content-section:first-child {margin-top:0}
.developer-work-reading .developer-content-section h2 {font:600 20px/1.5 var(--display); margin:0 0 12px}
.developer-content-section>p {font-size:15px; line-height:1.9; max-width:70ch}
.developer-work-guide {position:sticky; top:112px; padding-top:16px; border-top:1px solid var(--line); min-width:0}
.developer-work-guide>h2 {font:600 18px/1.6 var(--display); margin:0 0 12px}
.developer-work-guide>h3 {font:600 14px/1.75 var(--body); margin:24px 0 8px}
.developer-work-guide>p {font-size:13px; line-height:1.8; color:var(--muted); white-space:normal}
.developer-work-guide>.text-link {margin-top:20px; min-height:40px; font-size:13px}
.developer-product-summary {display:grid; gap:20px; margin:16px 0 0}
.developer-product-summary dt {font-size:12px; color:var(--muted); margin:0 0 4px}
.developer-product-summary dd {font-size:14px; margin:0; white-space:pre-wrap; overflow-wrap:anywhere}
.developer-product-summary .safe-product-link {font-size:13px; min-height:32px; max-width:100%; display:inline-block; word-break:break-word}
.developer-work-guide .form-meta {margin-top:24px}
.developer-work-form .developer-context {margin-top:0; padding:0 0 16px; border-top:0; margin-bottom:24px}
.developer-work-form .developer-context h2 {font-size:16px; margin-bottom:4px}
.developer-work-form .developer-context p {font-size:13px}
.developer-form-section+.developer-form-section {margin-top:32px; padding-top:24px; border-top:1px solid var(--line)}
.developer-form-section>h2 {font:600 20px/1.5 var(--display); margin:0 0 20px}
.developer-work-field {margin-top:24px; min-width:0; position:relative}
.developer-work-field:first-child {margin-top:0}
.developer-work-field>.form-label {font-size:14px; font-weight:600; margin:0 0 10px}
.developer-work-field>.form-meta {font-size:13px; margin:0 0 10px}
.developer-work-field>.form-input {margin:0; width:100%; font-size:14px; padding:12px 14px}
.developer-work-field>textarea.form-input {min-height:136px; line-height:1.8; resize:vertical}
.developer-work-field>.field-error {font-size:13px; min-height:20px; margin:4px 72px 0 0}
.developer-work-field .developer-work-count {position:absolute; right:0; bottom:0; font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap}
.developer-work-form .form-meta {font-size:12px; line-height:1.8}
.developer-work-form>.form-meta {margin:16px 0 0}
.developer-work-form>.form-actions {margin-top:24px; gap:12px}
.developer-work-form>.form-actions .primary,.developer-work-form>.form-actions .secondary {font-size:14px; min-height:44px; padding:8px 16px}
.developer-work-disclosure {margin-top:24px; border-block:1px solid var(--line)}
.developer-work-disclosure>summary {display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:56px; padding:12px 0; cursor:pointer; list-style:none; font-size:14px; font-weight:600}
.developer-work-disclosure>summary::-webkit-details-marker {display:none}
.developer-work-disclosure>summary:hover {color:var(--primary)}
.developer-work-disclosure summary small {font:400 12px/1.75 var(--body); color:var(--muted); margin-left:8px}
.developer-work-disclosure summary svg {width:16px; height:16px; transition:transform 180ms var(--ease)}
.developer-work-disclosure[open] summary svg {transform:rotate(180deg)}
.developer-work-disclosure>div {padding-bottom:20px}
.developer-progress-rule {margin-top:20px; padding:12px 16px; font-size:13px; color:var(--primary); background:var(--selected); border-radius:8px}
.developer-work-submit {padding-top:24px; margin-top:32px; border-top:1px solid var(--line)}
.developer-work-submit .primary,.developer-work-submit .secondary {font-size:14px; min-height:44px; padding:8px 16px}
.developer-work-reading .solution-history {margin-top:40px; padding-top:24px; border-top:1px solid var(--line)}
.developer-section-heading {display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px}
.developer-section-heading>h2 {font-size:20px; margin:0}
.developer-section-heading>.text-link {font-size:13px; min-height:32px}
.developer-work-reading .solution-history-entry {padding:16px 0}
.developer-work-reading .solution-history-entry p {font-size:14px}
.developer-pending-note {font-size:14px; color:var(--muted)}
.developer-work-reading .developer-pending-update {margin-top:32px; padding:20px; background:var(--soft); border-radius:12px}
.developer-pending-update h2 {font-size:18px; margin-bottom:12px}
.developer-pending-update p {font-size:14px}
.developer-pending-update .text-link {font-size:13px; margin-top:12px}
.developer-work-feedback .work-row {padding:24px 0; border-bottom:1px solid var(--line)}
.developer-work-feedback .work-meta {font-size:12px; margin-bottom:12px}
.developer-work-feedback .work-row>p {font-size:15px; white-space:pre-wrap; line-height:1.85}
.developer-work-feedback .work-section {margin-top:24px; max-width:640px}
.developer-work-feedback .form-label {font-size:14px; margin:0 0 10px}
.developer-work-feedback textarea.form-input {min-height:96px; width:100%; font-size:14px}
.developer-work-feedback .secondary {font-size:14px; min-height:44px; padding:8px 16px}
.developer-work-feedback .work-error:empty {min-height:8px; margin:0}
.developer-work-policy {font-size:13px; color:var(--muted); padding:16px 0; border-top:1px solid var(--line); margin-top:24px}
.developer-work-policy strong {font-weight:600; color:var(--ink)}
.developer-work-policy p {margin-top:8px}
.developer-progress-comparison {margin-top:32px; padding-top:24px; border-top:1px solid var(--line)}
.developer-progress-comparison>h2 {font-size:20px; margin:0 0 16px}
.developer-progress-comparison .work-table {width:100%; table-layout:fixed}
.developer-progress-comparison th,.developer-progress-comparison td {padding:12px 16px; font-size:13px; overflow-wrap:anywhere; white-space:pre-wrap; vertical-align:top}
.developer-progress-comparison th:first-child {width:20%}
.developer-progress-comparison td:last-child {background:var(--selected)}
.developer-progress-comparison>.form-meta {font-size:13px; margin-top:12px}
@media(max-width:1150px) {
  .developer-work-layout {grid-template-columns:184px minmax(0,1fr); gap:28px}
  .developer-compose-layout,.developer-content-grid {grid-template-columns:minmax(0,1fr) 208px; gap:28px}
}
@media(max-width:950px) {
  .developer-compose-layout,.developer-content-grid {grid-template-columns:minmax(0,1fr)}
  .developer-work-guide {position:static; max-width:640px; margin-top:16px}
}
@media(max-width:700px) {
  .developer-work-layout {grid-template-columns:minmax(0,1fr); gap:24px}
  .developer-work-nav {position:static; max-height:none; display:flex; overflow:auto; gap:16px; border-block:1px solid var(--line); padding-block:8px}
  .developer-work-nav section:first-child {display:flex; gap:8px; flex:none}
  .developer-work-nav h2,.developer-work-nav section:not(:first-child),.developer-work-nav .developer-work-home,.developer-record-navigation {display:none}
  .developer-work-nav a {white-space:nowrap; min-height:40px; font-size:13px}
  .developer-work-main>.flow-heading h1 {font-size:26px}
  .developer-work-records .developer-work-record {grid-template-columns:minmax(0,1fr); gap:16px}
  .developer-record-actions {flex-direction:row; align-items:center; justify-content:start; flex-wrap:wrap; gap:16px}
  .developer-record-status {padding:16px; gap:16px}
  .developer-work-empty {padding:40px 8px}
}
@media(prefers-reduced-motion:reduce) {
  .developer-work-disclosure summary svg {transition:none}
}
