:root {
  --cream: #f5ebdd;
  --surface: #fffaf5;
  --gold: #b89a5a;
  --gold-soft: #eddfc3;
  --action: #795b24;
  --action-hover: #60471b;
  --ink: #1A1A1A;
  --muted: #6c6052;
  --line: #d8c6a9;
  --error: #912f28;
  --success: #31583a;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--cream);
  line-height: 1.65;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
.site-header {
  padding: 1.6rem 1.2rem;
  text-align: center;
  border-bottom: 1px solid var(--line);
  background: var(--cream);
}
.brand { display: inline-flex; flex-direction: column; align-items: center; color: var(--ink); text-decoration: none; }
.brand-name { font-family: Didot, "Bodoni MT", "Times New Roman", serif; font-size: clamp(1.6rem, 4vw, 2.7rem); text-transform: uppercase; letter-spacing: .15em; line-height: 1.2; }
.brand-descriptor { text-transform: uppercase; font-size: .75rem; letter-spacing: .55em; margin: .55rem 0 0 .55em; color: var(--action); }
.brand-logo { display: block; width: clamp(160px, 25vw, 260px); max-height: 190px; object-fit: contain; }
main { max-width: 1240px; margin: 2.5rem auto; padding: 0 1.5rem; }
.site-footer { margin: 3rem auto 0; padding: 1.5rem; border-top: 1px solid var(--line); text-align: center; color: var(--muted); font-size: .8rem; letter-spacing: .05em; }
.site-footer span { color: var(--action); padding: 0 .7rem; }
h1, h2, h3 { line-height: 1.25; }
h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3rem); font-weight: 400; letter-spacing: -.025em; margin: .5rem 0 1.5rem; }
h2 { font-size: 1.2rem; font-weight: 600; }
h3 { font-size: 1rem; }
a { color: var(--action); text-underline-offset: .2em; }
a:hover { color: var(--action-hover); }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 1.8rem; margin-bottom: 1.25rem; box-shadow: 0 6px 24px #5c421007; overflow-wrap: anywhere; }
.hero { max-width: 850px; margin: 3rem auto 1.5rem; text-align: center; padding: clamp(2rem, 5vw, 4.5rem); border-top: 3px solid var(--gold); }
.hero h1 { font-size: clamp(2.5rem, 6vw, 4rem); }
.hero-signature { font-family: Georgia, serif; font-size: 1.3rem; letter-spacing: .08em; margin: 2rem 0; }
.hero-signature span { display: block; text-transform: uppercase; letter-spacing: .35em; font-family: system-ui, sans-serif; font-size: .65rem; color: var(--action); margin-top: .4rem; }
.eyebrow { color: var(--action); letter-spacing: .12em; text-transform: uppercase; font-size: .73rem; font-weight: 650; }
address { font-style: normal; margin-top: 2rem; color: var(--muted); }
.footer-link { font-size: .85rem; text-align: center; }
.login { max-width: 480px; margin: 3rem auto; border-top: 3px solid var(--gold); }
label { display: block; margin-top: 1rem; font-weight: 600; font-size: .92rem; }
input, textarea, select { width: 100%; max-width: 100%; font: inherit; color: var(--ink); padding: .75rem .85rem; border: 1px solid #a69374; border-radius: 6px; background: #fffdf9; margin-top: .3rem; }
textarea { resize: vertical; }
input[type=checkbox], input[type=radio] { width: auto; min-width: 1.15rem; min-height: 1.15rem; accent-color: var(--action); margin-right: .5rem; }
input[type=file] { padding: .6rem; }
input::file-selector-button { border: 1px solid var(--line); padding: .5rem .7rem; border-radius: 4px; background: var(--gold-soft); color: var(--ink); margin-right: .7rem; cursor: pointer; }
button, .button { display: inline-block; font: inherit; font-weight: 600; background: var(--action); color: #fff; border: 1px solid var(--action); border-radius: 6px; padding: .75rem 1.15rem; text-decoration: none; cursor: pointer; text-align: center; min-height: 44px; }
button:hover, .button:hover { background: var(--action-hover); color: #fff; border-color: var(--action-hover); }
form button { margin-top: 1.3rem; }
.login button { width: 100%; }
.secondary { background: var(--gold-soft); color: var(--ink); border-color: var(--line); }
.secondary:hover { background: #e3d1ae; color: var(--ink); border-color: var(--action); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid var(--action); outline-offset: 3px; }
.helptext { display: block; font-size: .85rem; color: var(--muted); margin-top: .4rem; }
.error, .errorlist { color: var(--error); }
.error { background: #fff0ed; border-left: 3px solid var(--error); padding: 1rem; border-radius: 5px; }
.errorlist { padding-left: 1.3rem; }
.notice { background: #edf3e9; color: var(--success); padding: 1rem; border-left: 3px solid var(--success); border-radius: 5px; }
.heading { display: flex; justify-content: space-between; gap: 1rem; align-items: center; margin-bottom: 1.25rem; }
.heading h1 { margin-bottom: .5rem; }
.grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.badge { font-size: .8rem; color: var(--muted); background: var(--gold-soft); padding: .3rem .6rem; border-radius: 4px; }
.workspace-nav { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem; margin-bottom: 2rem; padding: .6rem; background: var(--surface); border: 1px solid var(--line); border-radius: 9px; }
.workspace-nav > a { padding: .6rem .8rem; text-decoration: none; font-size: .87rem; font-weight: 600; border-radius: 5px; }
.workspace-nav > a:hover { background: var(--gold-soft); }
.workspace-nav form { margin-left: auto; }
.workspace-nav button { margin: 0; padding: .5rem .8rem; font-size: .85rem; }
.edit-form { max-width: 760px; }
.actions, .pagination { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; margin-top: 1rem; }
.actions button { margin: 0; }
.actions a:not(.button), .pagination a { padding: .45rem 0; }
.pagination { padding: .75rem 0; }
.list-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; overflow-wrap: anywhere; }
.list-row h2 { margin: .2rem 0; }
.list-row p { margin: .3rem 0; color: var(--muted); }
.search { padding: 1.2rem 1.5rem; border: 1px solid var(--line); background: var(--surface); border-radius: 9px; margin: 1.5rem 0; }
.search label { margin: 0 0 .5rem; }
.search input { max-width: 600px; }
.search button { margin-top: .5rem; }
dt { font-weight: 600; color: var(--muted); font-size: .85rem; }
dd { margin: 0 0 .8rem; }
.calendar-filter { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; padding: 1rem; background: var(--surface); border: 1px solid var(--line); border-radius: 9px; }
.calendar-filter label { margin: 0; }
.calendar-filter input, .calendar-filter select { width: auto; max-width: 100%; margin: 0; }
.calendar-filter button { margin: 0; }
.calendar-grid { display: grid; gap: .6rem; margin-top: 1.5rem; }
.calendar-grid.week, .calendar-grid.month { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.calendar-day { min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: .65rem; overflow-wrap: anywhere; }
.calendar-day h2 { font-size: .9rem; }
.calendar-day.today { border: 2px solid var(--action); background: #fff7e7; }
.calendar-day.outside { background: #eee5da; }
.hours { font-size: .78rem; color: var(--muted); }
.calendar-event { margin: .6rem 0; padding: .65rem; background: #efdfbe; border-left: 4px solid var(--action); border-radius: 4px; font-size: .8rem; }
.calendar-event p { margin: .25rem 0; }
.calendar-event a { color: var(--ink); text-decoration: none; }
.calendar-event a:hover { text-decoration: underline; }
.calendar-event.blocked { background: #e5e1d9; border-color: #655b4b; }
.calendar-event.category-2 { background: #eee0dc; border-color: #855e50; }
.calendar-event.category-3 { background: #e5e9d8; border-color: #5b6941; }
.calendar-event.category-4 { background: #e2e8e9; border-color: #4e666a; }
.calendar-event.cancelled { background: #f0ebe4; border-style: dashed; color: var(--muted); }
.calendar-event.cancelled strong { text-decoration: line-through; }
.calendar-grid.day .calendar-event { font-size: 1rem; }
.calendar-grid.month .calendar-event { font-size: .75rem; }
.logo-preview { display: block; width: min(100%, 360px); max-height: 360px; object-fit: contain; border: 1px solid var(--line); margin: 1.5rem 0; }
.swatches { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.swatches code { display: block; color: var(--muted); font-size: .85rem; }
.swatch { display: block; height: 65px; border: 1px solid var(--line); border-radius: 6px; margin-bottom: .6rem; }
.swatch.cream { background: var(--cream); }.swatch.gold { background: var(--gold); }.swatch.ink { background: var(--ink); }.swatch.dark-gold { background: var(--action); }
@media (max-width: 1000px) {
  .workspace-nav form { margin-left: 0; }
  .calendar-grid.week { grid-template-columns: 1fr; }
  .calendar-grid.month { grid-template-columns: repeat(7, minmax(115px, 1fr)); overflow-x: auto; }
  .calendar-grid.month .calendar-day { min-width: 115px; }
}
@media (max-width: 650px) {
  main { margin-top: 1.3rem; padding: 0 1rem; }
  .site-header { padding: 1.3rem 1rem; }
  .grid { grid-template-columns: 1fr; }
  .card { padding: 1.3rem; }
  .hero, .login { margin-top: 1.5rem; }
  .heading { align-items: flex-start; flex-direction: column; }
  .heading form button { margin-top: 0; margin-bottom: 1rem; }
  .workspace-nav { gap: .15rem; }
  .workspace-nav > a { padding: .5rem; }
  .calendar-filter { align-items: stretch; }
  .calendar-filter label { width: 100%; }
  .calendar-filter input, .calendar-filter select { width: 100%; }
  .swatches { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .list-row { align-items: flex-start; flex-direction: column; }
}
.customer-nav,.customer-footer{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap;font-size:.9rem;margin:0 0 2.5rem}.customer-footer{margin:3rem 0 0;padding-top:1.5rem;border-top:1px solid var(--line)}.customer-nav a{text-decoration:none;padding:.5rem}.customer-hero{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:4rem;padding:3rem 0 5rem}.customer-hero h1{font-size:clamp(3rem,6vw,5.6rem);line-height:1.08}.customer-intro{max-width:420px;font-size:1.1rem;color:var(--muted);margin-bottom:2rem}.quiet{font-size:.88rem;color:var(--muted)}.brand-panel{border:1px solid var(--line);border-radius:160px 160px 12px 12px;min-height:370px;background:var(--surface);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2rem}.brand-panel .brand-name{font-size:1.7rem}.brand-panel p{color:var(--muted);font-size:.9rem}.brand-line{height:1px;width:65px;background:var(--gold);margin:1rem}.section-title{font-family:Georgia,serif;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:400}.category-links{display:flex;gap:.75rem;flex-wrap:wrap;margin:1.5rem 0}.category-links a,.slot{display:inline-block;border:1px solid var(--line);border-radius:6px;padding:.6rem 1rem;text-decoration:none;background:var(--surface)}.category-links a:hover,.slot:hover{background:var(--gold-soft)}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.service-card{display:flex;flex-direction:column}.service-card h3{font-family:Georgia,serif;font-size:1.5rem;font-weight:400;margin:.5rem 0}.service-card .button{margin-top:auto}.service-price{font-size:1.4rem}.service-price span{font-family:system-ui,sans-serif;font-size:.85rem;color:var(--muted)}.customer-contact{display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-top:3rem}.slot-grid{display:flex;gap:.7rem;flex-wrap:wrap;margin:1rem 0}@media(max-width:750px){.customer-hero{grid-template-columns:1fr;gap:1.5rem;padding:1.5rem 0 3rem}.brand-panel{min-height:240px}.service-grid,.customer-contact{grid-template-columns:1fr}.customer-nav{gap:.4rem;margin-bottom:1rem}}