/* Smappy design layer — loads after styles.css. Brand: deep green + saffron. */
:root{--green:#063f35;--green2:#0b4f43;--yellow:#ffc400;--ink:#0a2420;--muted:#5b6a66;--line:#e3e8e3;--paper:#f7f9f6;--r-lg:28px;--r-md:18px;--shadow:0 1px 2px rgba(6,63,53,.06),0 12px 32px -12px rgba(6,63,53,.18)}
body{background:var(--paper);font-family:"DM Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,.brand{font-family:"Nunito","DM Sans",sans-serif;letter-spacing:-.02em}
.topbar{background:rgba(255,255,255,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.search{background:var(--paper);border:1px solid var(--line);border-radius:999px;transition:border-color .2s,box-shadow .2s}
.search:hover{border-color:var(--green2);box-shadow:0 0 0 4px rgba(11,79,67,.08)}
.signup,.btn-primary{background:var(--green);color:#fff;border-radius:999px;font-weight:700}
.btn-yellow{background:var(--yellow);color:var(--ink);border-radius:999px;font-weight:800}
.btn{border-radius:999px}
.btn:hover,.signup:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.categories{background:#fff;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.categories a{border-radius:0;border:0;box-shadow:none}
.categories a:hover{background:var(--paper)}
.hero{position:relative;overflow:hidden;border-radius:var(--r-lg);background:linear-gradient(120deg,var(--green) 0%,var(--green2) 55%,#127060 100%);color:#fff;margin:20px auto;max-width:1240px;min-height:440px}
.hero h1{font-size:clamp(2.4rem,5.4vw,4.4rem);font-weight:900;line-height:1.02;color:#fff;max-width:12ch}
.hero .eyebrow{color:var(--yellow);text-transform:none;letter-spacing:0;font-weight:700;font-size:1rem}
.hero .lead{color:rgba(255,255,255,.82);font-size:1.15rem;max-width:42ch;line-height:1.5}
.hero .chips a{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:#fff;border-radius:999px;backdrop-filter:blur(6px)}
.hero .chips a:hover{background:var(--yellow);color:var(--ink)}
.hero-art:before{background:linear-gradient(90deg,var(--green2) 0%,rgba(11,79,67,0) 45%)!important}
.hero .chips a,.hero .chips{font-family:inherit}
.app-shell,main,.marketplace{background:transparent}
.hero-copy{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.marketplace-track{gap:14px;overflow-x:auto;scroll-snap-type:x proximity;padding:6px 4px 14px;scrollbar-width:none}
.marketplace-item{scroll-snap-align:start;border-radius:var(--r-md);transition:transform .25s,box-shadow .25s}
.marketplace-item:hover{transform:translateY(-4px)}
.section{max-width:1240px;margin-inline:auto}
.section-head h2{font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:900}
.section-head a{color:var(--green);font-weight:700}
.card-grid{gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;box-shadow:none;transition:transform .25s,box-shadow .25s,border-color .25s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:transparent}
.thumb{border-radius:14px;overflow:hidden;aspect-ratio:4/3;background:var(--soft)}
.thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.card:hover .thumb img{transform:scale(1.05)}
.pill{background:#e7f3ee;color:var(--green);border-radius:999px;font-weight:700}
.price{color:var(--green);font-weight:800}
.empty{border:1px dashed var(--line);border-radius:var(--r-md);padding:28px;text-align:center;color:var(--muted);background:#fff}
.empty[data-smappy-live-home-venues],.empty[data-smappy-live-venues],.empty[data-smappy-live-all-venues]{background:linear-gradient(90deg,#eef1ec 25%,#f8faf7 50%,#eef1ec 75%);background-size:200% 100%;animation:shimmer 1.4s linear infinite;min-height:180px;grid-column:1/-1}
@keyframes shimmer{to{background-position:-200% 0}}
.page-hero{border-radius:var(--r-lg);background:linear-gradient(120deg,var(--green),var(--green2));color:#fff;max-width:1240px;margin:20px auto}
.page-hero h1{color:#fff;font-weight:900}
.tabs a,.tabs button{border-radius:999px}
.summary,.detail{border-radius:var(--r-md);box-shadow:var(--shadow);border:1px solid var(--line);background:#fff}
.footer{color:var(--muted)}
@media(max-width:760px){.hero{border-radius:0 0 var(--r-lg) var(--r-lg);margin:0 0 16px;min-height:0}.hero h1{max-width:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}