/*
 * The atelier's shared material: warm paper, graphite, sage and a trace of brass.
 * Page-specific drawings keep their own geometry; this sheet joins the rooms.
 */
:root {
  --paper: #f5f3ed;
  --ink: #30392c;
  --sage: #63755a;
  --accent: #a58c59;
  --line: #d1d2c5;
  --soft: #e9ece2;
  --muted: #626a5b;
  --serif: Georgia, 'Times New Roman', serif;
  --sketch-line: #b8c0aa;
  --sketch-wash: #879b7020;
  --sketch-surface: #fffdf8bd;
  --sketch-radius: 22px;
}

html { scroll-padding-top: 24px; }
body.business-page {
  --paper: #f5f3ed;
  --ink: #30392c;
  --sage: #63755a;
  --accent: #a58c59;
  --line: #d1d2c5;
  --muted: #626a5b;
  background-color: var(--paper);
  background-image: radial-gradient(ellipse at 92% 4%, #afbb9820 0, transparent 37%), radial-gradient(ellipse at 0 70%, #bca47e0b 0, transparent 40%);
  font-size: 16px;
  line-height: 1.65;
}
button, a, input, textarea, select { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 2px solid #796232;
  outline-offset: 4px;
}
::selection { color: var(--ink); background: #cbd5bb; }
.business-page h1, .business-page h2, .business-page h3 { text-wrap: balance; }
.business-page h1 { letter-spacing: -.052em; }
.business-page .lead { color: var(--muted); font-size: 17px; line-height: 1.75; }
.business-page .small { color: var(--muted); font-size: 13px; line-height: 1.65; }
.business-page .eyebrow { color: var(--sage); font-size: 10px; line-height: 1.5; letter-spacing: .16em; }
.business-page .hint { color: var(--muted); font-size: 12px; line-height: 1.6; }
.business-page .field span.optional { color: var(--muted); font-size: 12px; }
.skip-link { border-radius: 999px; }

/* One calm threshold, with the original Liberty mark kept intact. */
.business-header, .header {
  position: relative;
  max-width: 1500px;
  min-height: 96px;
  height: auto;
  margin-inline: auto;
  padding-inline: 6%;
  border-bottom: 1px solid var(--line);
  gap: 30px;
}
.business-header::after, .header::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 6%;
  width: 44px;
  height: 1px;
  background: var(--accent);
  transform: rotate(-1.4deg);
  opacity: .65;
  pointer-events: none;
}
.business-brand, .header .brand {
  gap: 12px;
  color: var(--ink);
  font: 16px/1.2 var(--serif);
  letter-spacing: .14em;
}
.business-header { padding-block: 3px; }
.business-brand > span:last-child { display: none; }
.business-mark { width: 112px; height: 94px; flex-shrink: 0; }
.business-mark img { width: 144px; height: 144px; left: -16px; top: -24px; }
.business-header nav, .header nav {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.5vw, 32px);
  font-size: 13px;
  line-height: 1.4;
}
.business-header nav a, .header nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-block: 11px;
  border-bottom: 0;
  transition: color .25s ease;
}
.business-header nav a::after, .header nav a::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 5px;
  width: 100%;
  height: 1px;
  background: var(--accent);
  transform: scaleX(0) rotate(-1.5deg);
  transform-origin: left;
  transition: transform .3s ease;
}
.business-header nav a:hover, .header nav a:hover, .business-header nav a[aria-current=page], .header nav a[aria-current=page] { color: #4f6344; }
.business-header nav a:hover::after, .header nav a:hover::after, .business-header nav a[aria-current=page]::after, .header nav a[aria-current=page]::after { transform: scaleX(1) rotate(-1.5deg); }
.business-footer { font-size: 12px; line-height: 1.65; padding-top: 25px; }
.business-footer a { min-height: 32px; display: inline-flex; align-items: center; }
.business-footer a:hover { color: var(--ink); }

/* A drawing vocabulary shared by the illustrative plates. */
.sketch-art { display: block; fill: none; stroke: var(--sage); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.sketch-art .wash { fill: var(--sketch-wash); stroke: none; }
.sketch-art .paper { fill: var(--paper); }
.sketch-art .gold { stroke: var(--accent); }
.sketch-art .graphite { stroke: #495641; }
.sketch-art .faint, .sketch-art .construction { opacity: .3; }
.sketch-art .construction { stroke-width: .8; }
.sketch-art .hatch { stroke-width: .7; opacity: .5; }
.sketch-caption { color: var(--sage); font: italic 14px/1.6 var(--serif); }
.sketch-rule { position: relative; border: 0; border-top: 1px solid var(--line); }
.sketch-rule::after { content: ''; display: block; position: absolute; left: 8px; top: 3px; width: 70px; border-top: 1px solid var(--accent); opacity: .55; transform: rotate(-1.2deg); }

/* Familiar, touchable controls sit within the drawing rather than imitating it. */
.business-page input:not([type=radio]):not([type=checkbox]), .business-page textarea, .business-page select {
  min-height: 48px;
  border: 1px solid #b5bda9;
  border-radius: 16px;
  padding: 13px 16px;
  color: var(--ink);
  background: #fffefaad;
  font-size: 16px;
  line-height: 1.5;
  box-shadow: inset 0 1px 2px #30392c03;
  transition: border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.business-page input:not([type=radio]):not([type=checkbox]):focus, .business-page textarea:focus, .business-page select:focus {
  border-color: var(--sage);
  background: #fffefbd9;
  box-shadow: 0 0 0 4px #63755a12;
}
.business-page input::placeholder, .business-page textarea::placeholder { color: #757d6d; opacity: 1; }
.business-page input[type=file] { padding: 10px 12px !important; font-size: 13px !important; }
.business-page input[type=file]::file-selector-button { margin-right: 12px; padding: 8px 13px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); background: #e9ece3; font: inherit; cursor: pointer; }
.business-page input[type=radio], .business-page input[type=checkbox] { accent-color: #566c48; }
.business-page .button, .business-page .quiet-button {
  min-height: 46px;
  border-radius: 999px;
  padding: 12px 21px;
  font-size: 14px;
  transition: background .25s ease, border-color .25s ease, transform .25s ease;
}
.business-page .button { color: #fffef7; background: #576b4d; border-color: #576b4d; }
.business-page .button:hover { background: #465b3d; border-color: #465b3d; transform: translateY(-1px); }
.business-page .quiet-button { color: #4f6245; border-color: #bcc3af; background: #f8f7f04d; }
.business-page .quiet-button:hover { border-color: var(--sage); background: #e6eadc; transform: translateY(-1px); }
.business-page button:disabled { cursor: default; }
.business-page button:disabled:hover { transform: none; }
.business-page .panel, .business-page .profile-block-editor, .business-page .resource-dialog { border-radius: var(--sketch-radius); background: var(--sketch-surface); border-color: var(--line); }
.business-page .status { border-radius: 14px; background: #e8ecdf; border-left-color: #657954; font-size: 14px; }
.business-page .status.error { background: #f3e6db; border-left-color: #975538; color: #643c29; }
.business-page .empty-state { border-radius: var(--sketch-radius); background: #fffdf747; }
.business-page .badge { border-radius: 999px; padding: 4px 10px; color: #465d3b; }

/* Commission: keep the six abstract illustrations and their generous orbit. */
.commission-world .opening-note > p:first-child { color: #5d7052; }
.commission-world .brief-index { position: relative; top: auto; border-color: #c8cdbb; }
.commission-world .brief-index::after { content: ''; position: absolute; left: 12px; top: -4px; width: 52px; height: 1px; background: #a58c5966; transform: rotate(-2deg); pointer-events: none; }
.commission-world .brief-index button { min-height: 40px; font-size: 13px; }
.commission-world .brief-index button[aria-current=step] { color: #405138; }
.commission-world .brief-index button[aria-current=step]::after { height: 1px; bottom: -6px; transform: rotate(-1.5deg); }
.commission-world .brief-index .step-no { color: #8d7649; }
.commission-world .brief-sheet legend { color: #526847; }
.commission-world .loom-instruction { font-size: 12px; }
.commission-world .service-choice { border-bottom-color: #bcc5ae; }
.commission-world .service-choice::after { content: ''; position: absolute; width: 26px; height: 1px; bottom: -4px; left: 8px; background: var(--accent); opacity: 0; transform: rotate(-3deg); transition: opacity .3s ease; }
.commission-world .service-choice:hover::after, .commission-world .service-choice:has(input:checked)::after { opacity: .6; }
.commission-world .service-choice:has(input:checked) { color: #405a35; border-color: #667c55; }
.commission-world .service-choice strong { letter-spacing: -.025em; }
.commission-world .service-choice small { color: #646d5b; font-size: 12px; line-height: 1.5; }
.commission-world .service-choice:has(input:checked) small { color: #4d5945; }
.commission-world .service-choice:has(input:focus-visible) { border-radius: 8px; outline-color: #796232; }
.commission-world .loom-orbits { stroke: #a58c59; opacity: .3; }
.commission-world .service-sketch-stage > svg { stroke: #5f7352; }
.commission-world .service-sketch .wash { fill: #8c9c7620; }
.commission-world .service-sketch .paper { fill: #f8f6ef; }
.commission-world .loom-focus p { color: #526847; }
.commission-world .loom-focus .eyebrow { font-size: 10px; }
.commission-world #brief-start-note { color: #646d5b; font-size: 12px; }
.commission-world .brief-folio-mark { display: none; }
.commission-world .brief-sheet:not([data-chapter='0']) {
  z-index: 0;
  overflow: visible;
  margin-top: 34px;
  padding: 44px 48px 38px;
  border: 1px solid #cbd0bd;
  border-radius: 24px;
  background: linear-gradient(130deg, #fffdf8e6, #f7f5eed9);
  box-shadow: 0 18px 60px -40px #45553d50;
}
.commission-world .brief-sheet:not([data-chapter='0'])::before {
  display: block;
  width: auto;
  height: auto;
  inset: 7px -5px -6px 7px;
  border: 1px solid #c8cfbb80;
  border-radius: 24px;
  background: none;
  pointer-events: none;
  z-index: -1;
  transform: rotate(-.35deg);
}
.commission-world .brief-sheet:not([data-chapter='0']) .brief-folio-mark { display: block; position: absolute; top: 26px; right: 28px; width: 74px; height: 74px; opacity: .68; pointer-events: none; }
.commission-world .brief-sheet:not([data-chapter='0']) legend { max-width: 18ch; padding-right: 12px; color: var(--ink); font-size: 35px; }
.commission-world .brief-sheet:not([data-chapter='0']) fieldset > .small { max-width: 51ch; margin-bottom: 28px; }
.commission-world .form-actions { gap: 20px; }
.commission-world .form-actions #brief-next { flex-shrink: 0; }
.commission-world .contact-choices { gap: 10px; padding-block: 3px 24px; }
.commission-world .contact-choices label { min-height: 44px; border: 1px solid var(--line); border-radius: 999px; padding: 9px 15px; font-size: 14px; background: #fffefa8c; cursor: pointer; }
.commission-world .contact-choices label:has(input:checked) { border-color: #8fa17d; background: #e9eedf; }
.commission-world .receipt { padding-inline: 0; }
.commission-world .receipt .seal { color: #9d8653; }
.commission-world .resource-banner { border-radius: 16px; background: #ebe6d8a6; }

/* Owner studio: the drawing belongs at the edge of a useful workbench. */
.studio-world .business-main { max-width: 1400px; padding-top: 43px; }
.studio-world .workspace-head { display: grid; grid-template-columns: minmax(0, 1fr) 210px; align-items: center; gap: 42px; margin-bottom: 34px; }
.studio-world .workspace-head h1 { font-size: clamp(48px, 5.3vw, 70px); margin-bottom: 16px; }
.studio-world .workspace-head .eyebrow { margin-bottom: 16px; }
.studio-world .workspace-head .lead { max-width: 45ch; margin-bottom: 21px; }
.studio-world .workspace-head .button-row { gap: 10px; }
.workbench-plate { margin: 0; position: relative; max-width: 230px; justify-self: end; }
.workbench-plate::before { content: ''; position: absolute; inset: 16% 10% 10% 5%; border-radius: 44% 56% 46% 54%; background: #a6b58a13; transform: rotate(-9deg); }
.workbench-art { width: 100%; aspect-ratio: 1.1; position: relative; }
.workbench-plate figcaption { position: relative; margin: -5px 0 0; text-align: center; color: #707b63; font: italic 12px/1.6 var(--serif); }
.workbench-art .workbench-thread { stroke-dasharray: 3 7; animation: workbench-thread 18s linear infinite; }
.workbench-art .workbench-paper { transform-box: fill-box; transform-origin: center; animation: workbench-breathe 12s ease-in-out infinite; }
.studio-world .workspace-tabs { display: flex; gap: 5px; align-items: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding-block: 11px; margin-bottom: 30px; }
.studio-world .workspace-tabs a { display: inline-flex; align-items: center; gap: 11px; min-height: 44px; padding: 11px 20px; border-radius: 999px; color: #5a6850; font-size: 14px; transition: background .25s ease, color .25s ease; }
.studio-world .workspace-tabs a > span { color: #8c7952; font: italic 15px/1 var(--serif); }
.studio-world .workspace-tabs a:hover { background: #e9ecdf; }
.studio-world .workspace-tabs a[aria-current=page] { background: #576b4d; color: #fffef7; }
.studio-world .workspace-tabs a[aria-current=page] > span { color: #e5dfc5; }
.studio-world .workspace-grid { grid-template-columns: minmax(290px, .77fr) minmax(0, 1.3fr); gap: 24px; }
.studio-world .panel { padding: 28px; position: relative; }
.studio-world .panel > h2 { font-size: 30px; margin-bottom: 25px; }
.studio-world .panel > .eyebrow, .studio-world .profile-fields > .eyebrow { color: #8d794d; font-size: 9px; margin-bottom: 13px; }
.studio-world .panel > h2::after { content: ''; display: block; width: 34px; height: 1px; margin-top: 15px; background: #a58c5980; transform: rotate(-2deg); }
.studio-world #inbox-detail { min-height: 380px; }
.studio-world .workbench-empty { max-width: 160px; height: 116px; margin: 32px auto 24px; opacity: .72; }
.studio-world .inbox-item, .studio-world .resource-edit-item { border-radius: 15px; background: #fffef8b3; border-color: #d1d6c5; padding: 17px 18px; transition: background .25s ease, border-color .25s ease; }
.studio-world .inbox-item:hover, .studio-world .resource-edit-item:hover { background: #edf0e4; border-color: #aebc9f; }
.studio-world .inbox-item[aria-pressed=true] { background: #eaf0de; border-color: #8eaa79; box-shadow: inset 3px 0 #71865d; }
.studio-world .inbox-item small { font-size: 12px; }
.studio-world .resource-edit-item { align-items: center; }
.studio-world .resource-edit-item strong { font-size: 15px; }
.studio-world .resource-edit-item span { font-size: 12px; }
.studio-world .access-links { border-top: 1px solid var(--line); padding-top: 28px; }
.studio-world .access-links h3 { font-size: 25px; margin-bottom: 13px; }
.studio-world .access-link-row { flex-wrap: wrap; }
.studio-world .profile-fields { max-width: 920px; border: 1px solid var(--line); border-radius: 24px; background: #fffdf86b; padding: 36px; }
.studio-world .profile-fields > h2 { font-size: 38px; }
.studio-world .profile-fields > .lead { max-width: 66ch; font-size: 15px; }
.studio-world .profile-block-editor { background: #f4f4eacc; }
.studio-world .block-toolbar { gap: 12px; }
.studio-world .block-toolbar button { min-height: 36px; border-radius: 999px; background: #fffdf87d; padding: 7px 12px; }
.studio-world .block-toolbar button:hover:enabled { border-color: var(--sage); background: #e7eddd; }
.studio-world .upload-preview { border-radius: 13px; border: 1px solid var(--line); margin-right: 12px; }
.studio-world .workspace-save { border-radius: 0 0 15px 15px; background: #f9f8f1f5; margin: 30px -15px -15px; padding: 19px 15px 15px; }
.studio-world .workspace-save .status { margin: 0; }
@keyframes workbench-thread { to { stroke-dashoffset: -60; } }
@keyframes workbench-breathe { 50% { transform: translateY(-3px) rotate(.7deg); } }

@media (max-width: 950px) {
  .studio-world .workspace-grid { grid-template-columns: 1fr; }
  .studio-world .workspace-head { grid-template-columns: minmax(0, 1fr) 175px; gap: 22px; }
  .studio-world .workbench-plate { max-width: 175px; }
  .studio-world .inbox-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  .business-header, .header { min-height: 80px; padding-inline: 5%; gap: 14px; }
  .business-header nav, .header nav { gap: 17px; font-size: 12px; }
  .business-brand, .header .brand { gap: 8px; }
  .business-mark { width: 82px; height: 68px; }
  .business-mark img { width: 104px; height: 104px; left: -11.5px; top: -17.5px; }
  .business-page .lead { font-size: 16px; }
  .business-page .button, .business-page .quiet-button { padding-inline: 18px; font-size: 13px; }
  .business-page .field span.optional { font-size: 11px; }
  .business-page .small { font-size: 12px; }
  .business-footer { padding-bottom: 26px; gap: 14px 20px; }
  .business-footer p { flex-basis: 100%; }
  .commission-world .brief-index { padding-block: 6px; }
  .commission-world .brief-index button { min-height: 44px; font-size: 11px; padding-inline: 2px; }
  .commission-world .brief-index button[aria-current=step]::after { bottom: -7px; }
  .commission-world .service-choice small { font-size: 12px; }
  .commission-world .service-choice:nth-of-type(n) { min-height: 119px; }
  .commission-world .loom-focus .eyebrow { font-size: 9px; }
  .commission-world .brief-sheet:not([data-chapter='0']) { border-radius: 21px; padding: 30px 22px 25px; margin-top: 26px; }
  .commission-world .brief-sheet:not([data-chapter='0']) legend { font-size: 31px; max-width: 16ch; padding-right: 45px; }
  .commission-world .brief-sheet:not([data-chapter='0']) .brief-folio-mark { width: 50px; height: 50px; top: 18px; right: 12px; }
  .commission-world .brief-sheet:not([data-chapter='0']) fieldset > .small { margin-bottom: 24px; }
  .commission-world #brief-start-note { max-width: 25ch; font-size: 11px; }
  .commission-world .form-actions { flex-wrap: wrap; gap: 15px; }
  .commission-world .form-actions #brief-next { margin-left: auto; }
  .studio-world .business-main { padding-top: 30px; }
  .studio-world .workspace-head { grid-template-columns: minmax(0, 1fr) 80px; gap: 8px; margin-bottom: 25px; align-items: start; }
  .studio-world .workspace-head h1 { font-size: 47px; }
  .studio-world .workspace-head .lead { font-size: 15px; }
  .studio-world .workspace-head .button-row { margin-top: 0; margin-right: -85px; }
  .studio-world .workbench-plate { width: 95px; max-width: none; margin-top: 13px; margin-right: -5px; }
  .studio-world .workbench-plate figcaption { display: none; }
  .studio-world .workspace-head .button-row .quiet-button { padding-inline: 14px; font-size: 12px; }
  .studio-world .workspace-tabs { gap: 0; margin-bottom: 24px; }
  .studio-world .workspace-tabs a { padding-inline: 13px; gap: 7px; font-size: 12px; }
  .studio-world .workspace-tabs a > span { font-size: 13px; }
  .studio-world .panel { padding: 25px 20px; }
  .studio-world .panel > h2 { font-size: 29px; }
  .studio-world #inbox-detail { min-height: 320px; }
  .studio-world .profile-fields { padding: 27px 19px; }
  .studio-world .profile-fields > h2 { font-size: 33px; }
  .studio-world .profile-fields > .lead { font-size: 14px; }
  .studio-world .workspace-save { margin-inline: 0; padding-inline: 0; background: none; }
  .studio-world .workspace-save .status { margin-top: 12px; }
}
@media (max-width: 360px) {
  .business-header nav, .header nav { gap: 11px; }
  .commission-world .brief-index button { font-size: 10px; }
  .commission-world .brief-index .step-no { margin-right: 3px; }
  .studio-world .workspace-head { grid-template-columns: 1fr; }
  .studio-world .workbench-plate { display: none; }
  .studio-world .workspace-head .button-row { margin-right: 0; }
  .studio-world .workspace-tabs a { padding-inline: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .workbench-art .workbench-paper { transform: none; }
}
.paused .workbench-art *, .paused .workbench-art *::before, .paused .workbench-art *::after { animation-play-state: paused !important; }