/* Lemongroove app — record-sleeve primitives, mirrored from the static site */
:root{
  --rind:#EEF0C0; --zest:#F0DF00; --leaf:#708736; --leaf-ink:#46561E;
  --vinyl:#0C0C0A; --pith:#FBFBEF; --flesh:#F7EC86;
  --display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --body:"Outfit","Segoe UI",system-ui,sans-serif;
  --mono:"Azeret Mono",ui-monospace,Consolas,monospace;
  --gut:clamp(1.25rem,4vw,3.5rem);
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--rind);color:var(--leaf-ink);font-family:var(--body);
  font-size:clamp(1rem,.55vw + .9rem,1.125rem);line-height:1.62;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:3px solid var(--vinyl);outline-offset:3px}
.shell{max-width:74rem;margin:0 auto;padding:0 var(--gut)}
.liner{font-family:var(--mono);font-size:.625rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--leaf-ink);display:block;margin-bottom:.75rem}
.nav{position:sticky;top:0;z-index:80;background:var(--rind);
  border-bottom:1px solid rgba(70,86,30,.18)}
.nav__row{display:flex;align-items:center;gap:1rem;
  max-width:74rem;margin:0 auto;padding:.65rem var(--gut)}
.nav__mark{font-family:var(--display);font-weight:900;font-size:1rem;
  letter-spacing:-.02em;text-transform:uppercase;text-decoration:none;
  white-space:nowrap;color:var(--vinyl)}
.head{padding:clamp(2.5rem,8vw,5rem) 0 1.5rem}
.head__title{font-family:var(--display);font-weight:900;line-height:.94;
  letter-spacing:-.03em;font-size:clamp(2rem,6vw,3.6rem);margin:0 0 1.25rem;color:var(--vinyl)}
.card{background:var(--pith);border-radius:16px;padding:clamp(1.25rem,3vw,2rem);
  max-width:26rem}
.card label{display:block;font-family:var(--mono);font-size:.688rem;
  letter-spacing:.1em;text-transform:uppercase;margin:.9rem 0 .3rem}
.card input{width:100%;padding:.7rem .8rem;border:1.5px solid rgba(70,86,30,.35);
  border-radius:10px;font:inherit;background:#fff}
.btn{display:inline-block;background:var(--zest);color:var(--vinyl);font-weight:700;
  border:0;font:inherit;text-decoration:none;cursor:pointer;
  padding:.8rem 1.5rem;border-radius:999px;min-height:44px;margin-top:1rem}
.formerr{border-left:3px solid var(--zest);padding:.5rem 0 .5rem 1rem;margin:1rem 0;
  background:var(--pith);border-radius:0 10px 10px 0}
.hp-field{position:absolute !important;left:-9999px !important;height:1px;overflow:hidden}

/* ── portfolio (public + studio) ── */
.lede{max-width:46ch;font-size:clamp(1.05rem,.5vw + 1rem,1.3rem)}
.pf-group{margin:0 0 clamp(2rem,5vw,3rem)}
.pf-grid{display:grid;gap:1rem}
@media (min-width:760px){ .pf-grid{grid-template-columns:repeat(2,1fr)} }
.pf-card{background:var(--pith);border-radius:16px;padding:clamp(1.25rem,3vw,2rem)}
.pf-card h2{font-family:var(--display);font-weight:800;letter-spacing:-.02em;
  margin:.25rem 0 .5rem;color:var(--vinyl);font-size:1.35rem}
.pf-card p{margin:.35rem 0;max-width:62ch}
.pf-date{font-family:var(--mono);font-size:.688rem;letter-spacing:.1em;
  text-transform:uppercase;opacity:.7}
.pf-link{font-weight:700;box-shadow:inset 0 -.35em 0 var(--zest);text-decoration:none}
.pf-form{max-width:34rem}
.pf-form select,.pf-form textarea{width:100%;padding:.7rem .8rem;font:inherit;
  border:1.5px solid rgba(70,86,30,.35);border-radius:10px;background:#fff}
.pf-row{background:var(--pith);border-radius:12px;padding:.75rem 1rem;margin:.5rem 0}
.pf-row--draft{opacity:.75;border-left:3px solid var(--zest)}
.pf-row summary{cursor:pointer;display:flex;gap:.75rem;align-items:baseline;
  min-height:44px;align-items:center}
.pf-kind{font-family:var(--mono);font-size:.625rem;letter-spacing:.14em;
  text-transform:uppercase;background:var(--rind);border-radius:999px;padding:.25rem .6rem}
.pf-state{font-family:var(--mono);font-size:.625rem;letter-spacing:.14em;
  text-transform:uppercase;margin-left:auto}
.btn--ghost{background:transparent;border:1.5px solid var(--vinyl)}

/* ── client portal ── */
.pf-inline{display:inline-flex;gap:.5rem;align-items:center;margin:.35rem .5rem .35rem 0}
.pf-inline select,.pf-inline input{padding:.5rem .6rem;font:inherit;
  border:1.5px solid rgba(70,86,30,.35);border-radius:10px;background:#fff}
.pf-hint{font-size:.85rem;opacity:.8;margin:.15rem 0}

/* ── LG-4b design pass: state as color, money as type, trail as liner notes ── */
.badge{display:inline-block;font-family:var(--mono);font-size:.625rem;
  letter-spacing:.14em;text-transform:uppercase;border-radius:999px;
  padding:.3rem .65rem;border:1.5px solid transparent}
.badge--brief,.badge--draft{background:transparent;border-color:rgba(70,86,30,.4)}
.badge--quoted,.badge--confirmed,.badge--issued{background:var(--flesh)}
.badge--sent{background:var(--zest);font-weight:700}
.badge--delivered{background:var(--leaf);color:var(--pith)}
.badge--signed_off,.badge--approved{background:var(--vinyl);color:var(--zest)}
.badge--closed,.badge--declined,.badge--withdrawn{background:transparent;
  border-color:rgba(70,86,30,.4);opacity:.7}

.co-card{background:var(--pith);border-radius:16px;padding:clamp(1.25rem,3vw,1.75rem);
  margin:.75rem 0;max-width:none}
.co-card--decide{border:2px solid var(--zest)}
.co-total{font-family:var(--display);font-weight:900;letter-spacing:-.02em;
  font-size:clamp(1.6rem,4vw,2.2rem);color:var(--vinyl);margin:.5rem 0 .25rem}
.co-lines{list-style:none;margin:.5rem 0;padding:0;max-width:34rem}
.co-lines li{display:flex;justify-content:space-between;gap:1rem;
  padding:.35rem 0;border-bottom:1px solid rgba(70,86,30,.15);font-size:.95rem}

.trail{list-style:none;margin:.5rem 0 0;padding:0;max-width:46rem}
.trail li{display:flex;gap:.9rem;align-items:baseline;padding:.4rem 0;
  border-bottom:1px solid rgba(70,86,30,.12)}
.trail time{font-family:var(--mono);font-size:.625rem;letter-spacing:.08em;
  white-space:nowrap;opacity:.7}
.trail .t-act{font-weight:700}
.trail .t-note{opacity:.85}

.proj-row{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
  background:var(--pith);border-radius:12px;padding:.9rem 1.1rem;margin:.5rem 0}
.proj-row a{text-decoration:none;font-weight:700;min-height:44px;
  display:inline-flex;align-items:center}
.proj-row .badge{margin-left:auto}
.pf-inline .btn{margin-top:0}
.pf-inline input,.pf-inline select{min-height:44px}

/* ── LG-1: tickets + the gate ── */
.ticket-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.ticket{background:#fff;border-radius:16px;padding:1.25rem;text-align:center;
  border:2px dashed rgba(70,86,30,.35)}
.ticket img{margin:0 auto;max-width:180px;height:auto}
.ticket__code{font-family:var(--mono);font-size:.8rem;letter-spacing:.08em;margin:.6rem 0 0}
.ticket--used{opacity:.5}
.verdict{border-radius:16px;padding:clamp(1.5rem,4vw,2.5rem);margin:0 0 1.5rem;text-align:center}
.verdict--green{background:#1d7a34;color:#fff}
.verdict--amber{background:var(--zest);color:var(--vinyl)}
.verdict--red{background:#a11212;color:#fff}
.verdict__headline{font-family:var(--display);font-weight:900;letter-spacing:-.02em;
  font-size:clamp(1.8rem,6vw,3rem);margin:0}
.verdict__detail{margin:.5rem 0 0;font-size:1.05rem}

/* ── what's on hero ── */
.hero-event{background:var(--vinyl);color:var(--pith);border-radius:16px;
  padding:clamp(1.75rem,5vw,3rem);margin:0 0 1.5rem}
.hero-event .liner{color:rgba(240,223,0,.75)}
.hero-event h2{font-family:var(--display);font-weight:900;letter-spacing:-.03em;
  font-size:clamp(2rem,6vw,3.6rem);line-height:1.02;margin:.35rem 0 .5rem;color:var(--pith)}
.hero-event__meta{font-family:var(--mono);font-size:.8rem;letter-spacing:.1em;
  text-transform:uppercase;opacity:.85}
.hero-event p{max-width:56ch}
.hero-event__acts{margin-top:1.25rem}