/* A continuous reading surface with real photography only when supplied. */
.crab-h5 .event-card-host { display:flex; align-items:center; gap:8px; min-width:44px; min-height:44px; max-width:100%; color:var(--ink-2); text-decoration:none; font:500 13px/1.5 var(--sans); }
.crab-h5 .event-card-host > span { min-width:0; overflow-wrap:anywhere; }
.crab-h5 .event-card-avatar { flex:none; width:28px; height:28px; border-radius:50%; object-fit:cover; }
.crab-h5 a.event-card-host:focus-visible { outline:3px solid #236CAF; outline-offset:2px; border-radius:5px; }
.crab-h5 .event-detail-view { background:#FFFCF5; }
.crab-h5 .event-detail-view > .event-detail-scroll { padding:0 22px 28px; background:#FFFCF5; }
.crab-h5 .event-invitation { margin:0; }
.crab-h5 .event-detail-hero { background:transparent; }
.crab-h5 .event-detail-topbar.mobile-header { min-height:calc(68px + var(--h5-safe-top)); margin:0 -6px; padding:calc(10px + var(--h5-safe-top)) 0 12px; border:0; }
.crab-h5 .event-detail-topbar.mobile-header h3 { color:var(--ink-2); font:600 14px/1.5 var(--sans); }
.crab-h5 .event-detail-topbar .back-button,
.crab-h5 .event-detail-topbar .event-share-button { width:44px; height:44px; min-width:44px; border:1px solid #D5CDBF; background:#FFFEFB; box-shadow:none; }
.crab-h5 .event-detail-view .event-detail-topbar.mobile-header .back-button { box-shadow:none; }
.crab-h5 .event-share-button svg { width:21px; height:21px; }
.crab-h5 .event-detail-topbar .event-share-button { position:absolute; right:0; }
.crab-h5 .event-ticket-photo { display:block; width:100%; min-height:44px; overflow:hidden; margin:2px 0 22px; padding:0; border:0; border-radius:16px; background:#F0EDE6; cursor:zoom-in; }
.crab-h5 .event-detail-view .event-ticket-photo .event-detail-thumb { display:block; width:100%; height:auto; max-height:min(60dvh,560px); margin:0; border:0; outline:0; border-radius:0; box-shadow:none; object-fit:contain; }
.crab-h5 .event-photo-viewer { position:fixed; inset:0; width:100%; height:100%; height:100dvh; max-width:none; max-height:none; box-sizing:border-box; margin:0; padding:calc(64px + env(safe-area-inset-top)) 16px calc(20px + env(safe-area-inset-bottom)); border:0; background:#201C22F5; color:#FFFEFB; }
.crab-h5 .event-photo-viewer[open] { display:flex; align-items:center; justify-content:center; }
.crab-h5 .event-photo-viewer::backdrop { background:#201C22; }
.crab-h5 .event-photo-full { display:block; width:100%; height:100%; min-width:0; min-height:0; object-fit:contain; }
.crab-h5 .event-photo-full[hidden], .crab-h5 .event-photo-error[hidden] { display:none; }
.crab-h5 .event-photo-close { position:absolute; top:calc(12px + env(safe-area-inset-top)); right:max(16px,env(safe-area-inset-right)); display:grid; place-items:center; width:44px; height:44px; padding:10px; border:1px solid #FFFEFB80; border-radius:50%; background:#201C22; color:#FFFEFB; cursor:pointer; }
.crab-h5 .event-photo-close svg { width:24px; height:24px; }
.crab-h5 .event-photo-error { max-width:100%; text-align:center; overflow-wrap:anywhere; font:400 16px/1.7 var(--sans); }
.crab-h5 .event-photo-retry { min-width:44px; min-height:44px; max-width:100%; padding:8px 18px; border:1px solid #FFFEFB80; border-radius:12px; color:#FFFEFB; background:transparent; font:600 15px/1.5 var(--sans); cursor:pointer; }
.crab-h5 .event-photo-viewer button:focus-visible { outline:3px solid #79B8F6; outline-offset:3px; }
.crab-h5 .event-overview { min-width:0; padding:8px 0 22px; border-bottom:1px solid #DFD7C9; }
.crab-h5 .event-heading-meta { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; }
.crab-h5 .event-heading-meta > .tag { margin:0; padding:3px 8px; border:0; border-radius:5px; background:#F7EDCB; color:#65552F; font:600 12px/1.5 var(--sans); }
.crab-h5 .event-status { max-width:100%; color:var(--ink-2); font:500 12px/1.5 var(--sans); overflow-wrap:anywhere; }
.crab-h5 .event-status.is-joined { color:#336C4B; }
.crab-h5 .event-detail-view .event-detail-title { margin:13px 0 20px; color:var(--ink); font:900 28px/1.3 var(--sans); letter-spacing:-.5px; overflow-wrap:anywhere; text-wrap:pretty; }
.crab-h5 .event-facts { display:flex; flex-direction:column; gap:10px; margin:0; padding:14px; border:0; border-radius:12px; background:#EDF4F7; }
.crab-h5 .event-fact { display:flex; align-items:flex-start; gap:9px; max-width:100%; min-width:0; }
.crab-h5 .event-fact dt { flex:0 0 18px; margin:0; }
.crab-h5 .event-fact-art { display:block; width:18px; height:22px; padding-top:2px; color:#516574; }
.crab-h5 .event-fact-art svg { display:block; width:18px; height:18px; }
.crab-h5 .event-fact-label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.crab-h5 .event-fact dd { min-width:0; margin:0; color:#42505C; font:500 13px/1.65 var(--sans); overflow-wrap:anywhere; }
.crab-h5 .event-detail-view .event-organizer.event-host { display:flex; align-items:center; gap:8px; margin:18px 0 0; padding:0; border:0; border-radius:0; background:transparent; }
.crab-h5 .event-host-avatar-link { display:grid; place-items:center; flex:0 0 44px; width:44px; min-height:44px; border-radius:50%; color:inherit; text-decoration:none; }
.crab-h5 .event-host-avatar { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; overflow:hidden; border:1px solid #DACDBB; border-radius:50%; background:var(--yellow-soft); color:var(--ink); font:700 14px/1 var(--sans); }
.crab-h5 .event-host-avatar > img { display:block; width:100%; height:100%; object-fit:cover; }
.crab-h5 .event-host-copy { min-width:0; }
.crab-h5 .event-host-copy > span { display:block; color:var(--ink-2); font:400 11px/1.5 var(--sans); }
.crab-h5 .event-detail-view .event-host strong { display:block; color:var(--ink); font:600 14px/1.6 var(--sans); overflow-wrap:anywhere; }
.crab-h5 .event-roster-tools { margin-top:14px; padding-top:6px; border-top:1px solid #E6DFD3; }
.crab-h5 .event-about { min-width:0; padding:24px 0; }
.crab-h5 .event-about > h2 { margin:0 0 15px; color:var(--ink); font:800 18px/1.5 var(--sans); }
.crab-h5 .event-detail-view .event-detail-body { margin:0; color:#302E32; font:400 16px/1.8 var(--sans); overflow-wrap:anywhere; white-space:pre-wrap; }
.crab-h5 .event-details-content { min-width:0; padding:0; }
.crab-h5 .event-personal-actions { display:flex; flex-wrap:wrap; gap:4px 18px; margin:0 0 24px; padding:12px 0; border-top:1px solid #DFD7C9; border-bottom:1px solid #DFD7C9; }
.crab-h5 .event-utility-action { min-height:44px; max-width:100%; padding:9px 0; border:0; border-radius:4px; color:#365F7A; background:transparent; text-align:left; font:600 13px/1.6 var(--sans); overflow-wrap:anywhere; cursor:pointer; }
.crab-h5 .event-cancel-action { color:#9B5149; margin-left:auto; font-weight:400; }
.crab-h5 .event-personal-actions.is-review { display:block; border:0; }
.crab-h5 .event-personal-actions .review-panel { padding:0; border:0; background:transparent; }
.crab-h5 .event-personal-actions .review-panel > strong { color:var(--ink); font:800 17px/1.5 var(--sans); }
.crab-h5 .event-personal-actions .mobile-textarea { min-height:120px; padding:14px; border:1px solid #BFAF94; border-radius:12px; background:var(--surface); font-size:16px; box-shadow:none; }
.crab-h5 .event-personal-actions .rating-row { flex-wrap:wrap; gap:8px; }
.crab-h5 .event-personal-actions .rating-row button { width:44px; height:44px; border:1px solid #BFAF94; border-radius:10px; color:var(--ink-2); background:var(--surface); box-shadow:none; }
.crab-h5 .event-personal-actions .rating-row button.is-active { color:var(--ink); background:var(--yellow-soft); }
.crab-h5 .event-community-note { display:grid; grid-template-columns:18px minmax(0,1fr); gap:8px; margin:0; padding-top:4px; }
.crab-h5 .event-community-note > span { padding-top:2px; color:#807A6E; }
.crab-h5 .event-community-note svg { width:18px; height:18px; }
.crab-h5 .event-safety-copy { color:#787267; font:400 12px/1.7 var(--sans); overflow-wrap:anywhere; }
.crab-h5 .event-action-bar { position:relative; z-index:10; display:flex; align-items:center; gap:24px; flex:none; padding:12px 22px calc(12px + env(safe-area-inset-bottom)); border-top:1px solid #D9D0C0; background:#F6EDD9; }
.crab-h5 .event-footer-count { display:flex; flex-direction:column; gap:2px; flex:0 1 88px; min-width:0; }
.crab-h5 .event-footer-count strong { color:var(--ink); font:700 19px/1.3 var(--mono); overflow-wrap:anywhere; }
.crab-h5 .event-footer-count > span { color:var(--ink-2); font:400 11px/1.5 var(--sans); overflow-wrap:anywhere; }
.crab-h5 .event-action-bar .event-main-action { flex:1; min-width:0; min-height:50px; padding:11px 13px; border:1.6px solid var(--ink); border-radius:14px; box-shadow:1px 2px 0 var(--ink); color:var(--ink); font:800 15px/1.45 var(--sans); overflow-wrap:anywhere; }
.crab-h5 .event-group-unread { display:inline-block; min-width:20px; margin-left:8px; padding:1px 5px; border-radius:10px; background:#FFFCF5; font:700 12px/1.5 var(--sans); }
.crab-h5 .event-action-bar .event-main-action:disabled { opacity:1; color:var(--ink-2); border:1px solid #C3BAAC; background:#E9E4DA; box-shadow:none; cursor:default; }
.crab-h5 .event-detail-view :is(button,a):focus-visible { outline:3px solid #236CAF; outline-offset:3px; }
@media (max-width:350px) {
  .crab-h5 .event-detail-view > .event-detail-scroll { padding-inline:18px; }
  .crab-h5 .event-detail-view .event-detail-title { font-size:26px; }
  .crab-h5 .event-action-bar { gap:16px; padding-inline:18px; }
  .crab-h5 .event-footer-count { flex-basis:74px; }
  .crab-h5 .event-footer-count strong { font-size:18px; }
}