/* Workspace onboarding and project records share Shelf's compact site chrome. */
.workspace-page { font-size:var(--t-body) }
.workspace-layout { display:block; min-height:calc(100dvh - 4rem) }
.workspace-page .hm-main { min-width:0; padding:0; overflow:visible; background:var(--panel) }
.workspace-page .gs { width:100%; max-width:52rem; margin:0 auto; padding:0; border:0; border-radius:0 }
.workspace-page .gs:has(> .gs-cols) { max-width:68rem }
.workspace-page .gs-cols { grid-template-columns:minmax(0,1fr) var(--site-aside); gap:var(--site-gap) }
.workspace-page .gs-head { margin:0 0 2.5rem; padding:0; border:0 }
.workspace-page .gs-head h1 { margin:0 0 1rem; font:400 clamp(2.25rem,4vw,3.25rem)/1.15 Georgia,var(--sans); letter-spacing:-.05em }
.workspace-page .gs-lede { max-width:62ch; font-size:var(--t-prose); line-height:var(--leading-prose) }
.workspace-page .gs-sec { padding:0; margin:0 0 3rem; border:0 }
.workspace-page .gs-sec > h2 { margin:0 0 .75rem; font-size:var(--t-section) }
.workspace-page .gs-sec > p { color:var(--ink-2) }
.workspace-page .gs-steps h3 { margin:0 0 .25rem }
.workspace-page .gs-code { background:var(--panel-2); border:0; border-radius:.625rem; margin-top:1rem }
.workspace-page .gs-code figcaption { padding:.375rem 1rem; border:0; background:transparent }
.workspace-page .gs-code pre { padding:.75rem 1rem 1rem }
.workspace-page .gs-toc { padding-top:0; font-size:var(--t-body-2) }
.workspace-page .gs-toc ol { border:0 }
.workspace-page .gs-toc li a { min-height:2.75rem; margin:0; padding:.625rem .875rem; border:0; border-radius:.5rem }
.workspace-page .gs-toc li a:hover { background:var(--panel-2) }
.workspace-page .np-auth-note { margin:0 0 2.5rem; padding:1rem 1.25rem; border:0; border-radius:.625rem; background:var(--panel-2) }
.workspace-page .np-result { margin-top:0 }
.workspace-page .np-prompt pre { white-space:pre-wrap; overflow-wrap:anywhere }
.workspace-page .blog-sections { max-width:none; display:flex; flex-wrap:wrap; gap:.25rem; padding:0; border:0 }
.shelf-list-actions { display:flex; justify-content:flex-end; margin:0 0 1.5rem }
.records-page .hm-row { border:0; padding:1.125rem .75rem; border-radius:.625rem; gap:1rem }
.records-page .hm-row:hover { background:var(--panel-2) }
.records-page .hm-section { margin-top:2.5rem; border:0 }
.records-page .hm-section-head { border:0 }
.records-page .hm-row-main { min-width:0 }
.records-page .hm-row-main b { white-space:normal; overflow-wrap:anywhere }
@media (max-width:76rem) {
  .workspace-page .gs-cols { grid-template-columns:minmax(0,1fr) }
  .workspace-page .gs-toc { display:none }
}
@media (max-width:48rem) {
  .workspace-layout { padding-top:2rem }
  .workspace-page .gs-head { margin-bottom:2rem }
  .records-page .hm-row { flex-wrap:wrap; gap:.5rem }
  .records-page .hm-row-when { margin-left:auto }
}

.records-page .hm-list { border:0; border-radius:0; background:transparent }
.records-page .hm-list-page { max-width:none }
.workspace-page .version-page { max-width:none; margin:0 }
.version-page .chead { padding:0 0 2rem; border:0 }
.version-page .chead h1 { font:400 clamp(2.25rem,4vw,3.25rem)/1.15 Georgia,var(--sans); letter-spacing:-.05em }
.version-page .chead .row { flex-wrap:wrap; gap:1rem }
.version-page .btn { border:0; border-radius:.5rem; background:var(--panel-2) }
.version-page .workbench-open { background:var(--accent); color:var(--panel) }
.version-page .controls { border:0 }
.workspace-page .hm-hero h1 { font:400 clamp(2.25rem,4vw,3.25rem)/1.15 Georgia,var(--sans); letter-spacing:-.05em }
.workspace-page .rel { border:0 }

/* Setup uses the workspace width: two tasks side by side, readable text within each. */
.workspace-page .gs.np-connect { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); column-gap:clamp(2rem,5vw,5rem); row-gap:2.5rem; max-width:none; align-items:start }
.np-connect > * { min-width:0 }
.workspace-page .np-connect > .gs-head { grid-column:1 / -1; max-width:none; margin:0 }
.workspace-page .np-connect .gs-lede { max-width:70ch }
.workspace-page .np-connect > .np-auth-note { grid-column:1 / -1; margin:0; max-width:none }
.workspace-page .np-connect > .gs-sec { margin:0 }
.workspace-page .np-connect .np-result > p { max-width:none }
.workspace-page .np-connect .np-prompt pre { padding:1.25rem; line-height:1.8 }
.workspace-page .np-connect :is(.np-api,.np-example) { padding-top:.5rem }
.workspace-page .np-api > summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.5rem 0; list-style:none }
.np-api > summary::-webkit-details-marker { display:none }
.np-api > summary::after { content:"+"; flex:none; font:400 1.25rem/1 var(--sans) }
.np-api[open] > summary::after { content:"−" }
.workspace-page .np-api h2,.workspace-page .np-example > h2 { margin:0; font-size:var(--t-title) }
.workspace-page .np-api > p { margin:1rem 0 }
.workspace-page .np-example > h2 { padding:.5rem 0 }
.workspace-page .np-example > p { margin:.75rem 0 0; font-size:var(--t-body) }
/* Older onboarding still carries its own ruled navigation; keep that page in the same family. */
.workspace-page .gs-doors { grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; border:0; margin:2rem 0 }
.workspace-page .gs-doors a,.workspace-page .gs-doors a + a { min-width:0; padding:1.25rem; border:0; border-radius:.625rem; background:var(--panel-2) }
.workspace-page .gs-ref { border:0; background:var(--panel-2) }
.workspace-page .gs-demo { border:0; gap:1rem }
@media (max-width:60rem) {
  .workspace-page .gs.np-connect { grid-template-columns:minmax(0,1fr); row-gap:2.25rem }
  .workspace-page .np-connect > .gs-head,.workspace-page .np-connect > .np-auth-note { grid-column:1 }
  .workspace-page .gs-doors { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media (max-width:36rem) {
  .workspace-page .gs-doors { grid-template-columns:minmax(0,1fr) }
  .workspace-page .gs-demo { flex-direction:column }
}

/* Explanations need a visible pause after commands, including the copied prompt. */
.workspace-page .gs-code + :is(p,.gs-aside) { margin-top:1.5rem }
.workspace-page .np-result .np-prompt + .gs-aside { margin-top:1.5rem }
.workspace-page .np-connect > .np-api { grid-column:1 / -1; max-width:52rem; width:100% }
.workspace-page .np-connect > .np-example { grid-column:1 / -1; padding-top:1rem }
.np-example-heading { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1.5rem }
.workspace-page .np-example-heading h2 { margin:0 0 .375rem; font-size:var(--t-section) }
.np-example-heading p { margin:0; color:var(--ink-2); font-size:var(--t-body-2) }
.np-example-heading > a { display:inline-flex; align-items:center; min-height:2.75rem; font-size:var(--t-body-2) }
.np-example-screens { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; gap:1.75rem }
.np-example-screen { display:grid; min-width:0; gap:.875rem; font-size:var(--t-body-2) }
.np-example-screen img { display:block; width:100%; height:auto; border-radius:.375rem; box-shadow:var(--shadow) }
.workspace-page .gs .np-example-screen { color:var(--ink); text-decoration:none }
.workspace-page .gs .np-example-screen:hover span { text-decoration:underline; text-underline-offset:.2em }
.workspace-page .np-example > .np-example-links { margin:1.75rem 0 0 }
@media (max-width:48rem) {
  .np-example-screens { grid-template-columns:minmax(0,1fr); gap:2rem }
  .np-example-screen img { max-height:32rem; object-fit:cover; object-position:top }
}
/* Text links stay recognisable without relying on hover or an accent colour. */
.workspace-page .gs :is(p,dd,td) a,.workspace-page .np-example-heading > a { text-decoration:underline; text-decoration-thickness:.0625rem; text-underline-offset:.22em }
.workspace-page .gs :is(p,dd,td) a::after,.workspace-page .np-example-heading > a::after { content:"→"; display:inline-block; margin-left:.3em; text-decoration:none; font-family:var(--sans) }
.workspace-page .gs :is(p,dd,td) a[target="_blank"]::after { content:"↗" }