.garage-hub-page .garage-list-section{padding-top:28px}
.garage-hub-layout{display:grid;gap:30px}
.garage-hub-card-grid,.garage-hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.garage-hub-card{border:1px solid var(--border,#d8d2df);border-radius:18px;padding:22px;background:var(--surface,#fff);box-shadow:0 10px 28px rgba(32,18,44,.08)}
.garage-hub-card h2,.garage-hub-card h3{margin:.25rem 0 .5rem;line-height:1.2}
.garage-hub-card h3{font-size:1.35rem}
.garage-hub-card p{line-height:1.5}
.garage-hub-card .hero-actions{margin-top:18px}
.garage-hub-date{font-weight:900}
.garage-hub-host-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:28px;border-color:#f2c14e;padding:26px 28px}
.garage-hub-host-card .eyebrow{color:#6b3b8f}
.garage-hub-host-card .hero-actions{margin:0;justify-self:end}
.garage-hub-host-card .hero-actions .button{white-space:nowrap}
.garage-hub-feature{align-content:start}
.garage-hub-feature .eyebrow{color:#f2c14e;opacity:1;text-shadow:0 1px 10px rgba(40,15,64,.38)}
.garage-hub-feature h2{margin:.2rem 0 .5rem}
.garage-hub-feature p{margin:.5rem 0;line-height:1.5}
.garage-hub-feature .hero-actions{margin-top:18px}
.garage-hub-section{display:grid;gap:16px}
.garage-hub-section-heading{display:grid;gap:3px}
.garage-hub-section-heading .eyebrow{margin:0;color:#6b3b8f}
.garage-hub-section-heading h2{margin:0}
.garage-hub-section--past{padding-top:4px}
.garage-hub-card--past{box-shadow:none;background:color-mix(in srgb,var(--surface,#fff) 96%,#6b3b8f 4%)}
.garage-hub-empty{margin:0;padding:20px 22px;border:1px dashed var(--border,#d8d2df);border-radius:16px;background:var(--surface,#fff);line-height:1.5}
.garage-host-dialog{position:relative}
.garage-host-dialog textarea{min-height:120px}
.garage-host-dialog .garage-join-header{padding-right:72px}
.garage-dialog-close{position:absolute;top:14px;right:14px;z-index:5;display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--border,#d8d2df);border-radius:999px;background:var(--surface,#fff);color:inherit;font:inherit;font-size:1.7rem;font-weight:500;line-height:1;cursor:pointer;box-shadow:0 4px 14px rgba(32,18,44,.1)}
.garage-dialog-close:hover,.garage-dialog-close:focus-visible{border-color:#6b3b8f;background:#f5eff9;color:#421d66;outline:none}
.garage-dialog-close:focus-visible{box-shadow:0 0 0 3px rgba(107,59,143,.2)}
.garage-public-contact{margin:0;padding:16px;border:1px solid var(--border,#d8d2df);border-radius:12px;min-width:0}
.garage-public-contact legend{padding:0 6px;font-weight:900}
.garage-public-contact>p{margin:.15rem 0 .8rem;line-height:1.45}
.garage-public-contact-options{display:flex;gap:10px 18px;flex-wrap:wrap}
.garage-public-contact-options label{display:inline-flex;align-items:center;gap:8px;font-weight:800;cursor:pointer}
.garage-public-contact-options input{width:18px!important;height:18px!important;min-width:18px;padding:0!important;accent-color:#6b3b8f}
html[data-theme="dark"] .garage-hub-host-card,body.theme-dark .garage-hub-host-card{border-color:#f2c14e}
html[data-theme="dark"] .garage-hub-host-card .eyebrow,html[data-theme="dark"] .garage-hub-feature .eyebrow,html[data-theme="dark"] .garage-hub-section-heading .eyebrow,body.theme-dark .garage-hub-host-card .eyebrow,body.theme-dark .garage-hub-feature .eyebrow,body.theme-dark .garage-hub-section-heading .eyebrow{color:#f2c14e}
html[data-theme="dark"] .garage-dialog-close,body.theme-dark .garage-dialog-close{background:#231b2a;border-color:#4a3d53;color:#f8fafc}
html[data-theme="dark"] .garage-dialog-close:hover,html[data-theme="dark"] .garage-dialog-close:focus-visible,body.theme-dark .garage-dialog-close:hover,body.theme-dark .garage-dialog-close:focus-visible{background:#33233f;border-color:#f2c14e;color:#f2c14e}
@media(max-width:760px){
  .garage-hub-layout{gap:24px}
  .garage-hub-card-grid,.garage-hub-grid{grid-template-columns:1fr}
  .garage-hub-host-card{grid-template-columns:1fr;gap:18px;padding:20px}
  .garage-hub-host-card .hero-actions{justify-self:stretch}
  .garage-hub-host-card .hero-actions .button{width:100%;white-space:normal}
  .garage-hub-card{padding:18px}
  .garage-host-dialog .garage-join-header{padding-right:64px}
  .garage-public-contact-options{display:grid;grid-template-columns:1fr}
}
