/* Two open folders. Project names stay readable on the exposed edge of every sheet. */
.workbench{
  --paper:#f7f6f2;
  --blue:#607c6d;
  background:var(--paper);
  padding-top:112px;
  padding-bottom:116px;
  min-height:940px;
}
.chapter.workbench .chapter-heading{margin-left:calc(34% + 34px)}
.workbench .chapter-heading .eyebrow{color:#7b867b;margin:0 0 21px}
.workbench .chapter-heading h2{font-size:clamp(45px,4.5vw,62px);letter-spacing:-2.3px}
.chapter.workbench .chapter-grid{grid-template-columns:34% 66%;margin-top:42px}
.workbench .chapter-content{padding-left:34px}
.workbench .companion-space{position:relative;min-height:600px}
.workbench .companion-space .handwritten{display:block;left:17%;bottom:43px;font-size:25px;color:#8b9387}
.workbench__intro{font-size:18px;line-height:1.6;color:#657363;margin:0 0 43px;letter-spacing:-.2px}
.work-folders{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:34px;align-items:start}
.work-folder{
  --folder-back:#e6e3d9;
  --folder-front:#ebe8df;
  --folder-edge:#b9b5a52e;
  --folder-ink:#727366;
  --sheet-overlap:120px;
  position:relative;
  min-width:0;
}
.work-folder[data-category="hardware"]{
  --folder-back:#d2ddcf;
  --folder-front:#dce5d8;
  --folder-edge:#8fa28c37;
  --folder-ink:#60745f;
  margin-top:64px;
}
.work-folder__heading{display:none}
.work-folder__title{font-size:11px;line-height:1.4;font-weight:550;letter-spacing:1.65px;text-transform:uppercase;color:#657565;margin:0}
.work-folder__title{min-width:0;overflow-wrap:anywhere}
.workbench__empty{grid-column:1/-1;color:#82877e;font-size:16px;line-height:1.65}
.work-folder__count{font-size:10px;line-height:1.4;color:#93998e;letter-spacing:.2px;white-space:nowrap;font-variant-numeric:tabular-nums}
.work-folder__sheets{display:grid;gap:38px;min-width:0}
.work-folder__stack{
  position:relative;
  isolation:isolate;
  min-width:0;
  display:flex;
  flex-direction:column;
  padding-top:19px;
}
/* The back and front belong to each stack, so more projects create a new folder pocket. */
.work-folder__stack::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:7px 0 0;
  border:1px solid var(--folder-edge);
  border-radius:12px 12px 11px 11px;
  background:linear-gradient(145deg,#ffffff35,transparent 50%),var(--folder-back);
  box-shadow:0 18px 28px -25px #343f3740;
}
.workbench-card{
  position:relative;
  z-index:calc(var(--sheet-index,0) + 2);
  flex:none;
  min-width:0;
  width:calc(100% - 24px);
  height:auto;
  margin:0 12px;
  display:grid;
  grid-template-columns:20px minmax(0,1fr) 15px;
  grid-template-rows:minmax(28px,auto);
  align-content:start;
  align-items:center;
  gap:9px;
  padding:18px 17px 136px;
  text-align:left;
  border:1px solid #d3d4ca8a;
  border-radius:7px 7px 5px 5px;
  background:linear-gradient(112deg,#fffefa 0%,#fafaf5 67%,#f4f4ee 100%);
  box-shadow:0 -2px 7px #54604d06,0 3px 8px #54604d08;
  color:#475347;
  transform:translateY(0);
  transition:transform .24s cubic-bezier(.2,.7,.3,1),box-shadow .24s,border-color .24s;
}
/* Only the blank lower part overlaps; longer titles grow their exposed edge. */
.workbench-card + .workbench-card{margin-top:calc(-1 * var(--sheet-overlap))}
.work-folder[data-category="hardware"] .workbench-card{background:linear-gradient(112deg,#fbfdf8,#f1f5ed);border-color:#c1ccbc94;color:#455541}
.workbench-card__number{font-size:9px;line-height:1.4;letter-spacing:.7px;font-variant-numeric:tabular-nums;color:#a3aa9d;align-self:center}
.workbench-card__title{display:block;font-size:clamp(20px,1.7vw,24px);font-weight:490;letter-spacing:-.6px;line-height:1.22;min-width:0;white-space:normal;overflow-wrap:anywhere}
.workbench-card__idea[hidden]{display:none!important}
.workbench-card__open{display:inline-flex;align-items:center;justify-content:flex-end;gap:0;font-size:0;color:#6b816b;opacity:.35;transition:opacity .2s,transform .2s;white-space:nowrap}
.workbench-card__open img{display:block;width:13px;height:13px;opacity:.85}
.workbench-card:hover,.workbench-card:focus-visible{transform:translateY(-10px);box-shadow:0 -5px 15px #54604d0b,0 5px 13px #54604d0b;border-color:#9caa926e}
.workbench-card:hover .workbench-card__open,.workbench-card:focus-visible .workbench-card__open{opacity:.9;transform:translate(1px,-1px)}
.workbench-card:focus-visible{outline:none}
.workbench-card:focus-visible .workbench-card__title{outline:2px solid #607c6d;outline-offset:4px;border-radius:2px}
.work-folder__cover{
  position:relative;
  z-index:12;
  flex:none;
  width:100%;
  height:132px;
  margin-top:-102px;
  border:1px solid var(--folder-edge);
  border-radius:7px 7px 11px 11px;
  background:linear-gradient(160deg,#ffffff35,transparent 52%),var(--folder-front);
  box-shadow:0 -3px 10px #4b59440a,0 16px 24px -22px #3a4d354d;
  pointer-events:auto;
  cursor:default;
}
.work-folder__cover::before{
  content:"";
  position:absolute;
  left:-1px;
  top:-20px;
  width:43%;
  height:24px;
  border:1px solid var(--folder-edge);
  border-bottom:0;
  border-radius:8px 10px 0 0;
  background:linear-gradient(160deg,#ffffff35,transparent),var(--folder-front);
  clip-path:polygon(0 0,88% 0,100% 85%,100% 100%,0 100%);
}
.work-folder__cover::after{content:"";position:absolute;inset:16px 19px auto;height:1px;background:#ffffff45}
.work-folder__tab{position:absolute;left:22px;bottom:28px;color:var(--folder-ink);font-size:10px;font-weight:500;letter-spacing:1.4px;text-transform:uppercase}
.work-folder__tab{right:22px;max-height:70px;overflow:auto;overflow-wrap:anywhere}
.workbench__aside{font-size:23px;line-height:1.2;text-align:right;color:#8e9988;margin:40px 12px 0;transform:rotate(-3deg)}
/* Details retain the native dialog and the site's established reading style. */
.project-story{max-width:570px;background:#f7f6f2;max-height:calc(100dvh - 40px);overflow-y:auto}
.project-story .eyebrow{color:#737c68;margin-bottom:18px}
.project-story h2{margin-bottom:30px}
.project-story__part{border-top:1px solid #62705d1d;padding-top:20px;margin-top:22px}
.project-story__part h3{font-size:10px;font-weight:500;letter-spacing:1.2px;text-transform:uppercase;color:#737e67;margin:0 0 11px}
.project-story .project-story__part p{font-size:16px;line-height:1.7;margin:0;color:#6b7565}
.project-story .dialog-done{color:#6b806a;margin-top:30px;min-height:44px}
.project-story .dialog-done img{width:13px;height:13px;opacity:.6}
.project-story .dialog-close{min-width:44px;min-height:44px}
.project-story button:focus-visible{outline-color:#73856b;outline-offset:3px;border-radius:5px}
@media(min-width:761px) and (max-width:1100px){
  .chapter.workbench .chapter-heading{margin-left:calc(35% + 25px)}
  .chapter.workbench .chapter-grid{grid-template-columns:35% 65%}
  .workbench .chapter-content{padding-left:25px}
  .workbench .chapter-heading h2{font-size:46px;letter-spacing:-1.8px}
  .workbench .companion-space{min-height:900px}
  .work-folders{grid-template-columns:minmax(0,1fr);max-width:430px;gap:47px}
  .work-folder[data-category="hardware"]{margin-top:0;margin-left:43px}
  .workbench-card__title{font-size:23px}
  .workbench__aside{max-width:430px;margin-top:34px;font-size:22px}
}
@media(max-width:760px){
  .chapter.workbench .chapter-heading{margin-left:0}
  .chapter.workbench .chapter-grid{display:block;grid-template-columns:minmax(0,1fr)}
  .workbench .chapter-content{padding:0}
  .work-folders{grid-template-columns:minmax(0,1fr);gap:44px}
  .work-folder[data-category="hardware"]{margin:0}
  .workbench-card__title{overflow-wrap:normal;word-break:normal}
}
@media(prefers-reduced-motion:reduce){
  .workbench-card,.workbench-card__open{transition:none}
  .workbench-card:hover,.workbench-card:focus-visible{transform:none}
  .workbench-card:hover .workbench-card__open,.workbench-card:focus-visible .workbench-card__open{transform:none}
}