/* Shared Event Companion surfaces and controls. */
.ec-page{display:flex;flex-direction:column;gap:12px;padding:12px;min-width:0;color:var(--ink,#182733)}
.ec-card,.ec-glass,.ec-pills,.ec-seg{background:var(--glass);color:var(--ink);border:var(--glass-border);box-shadow:var(--glass-shadow);backdrop-filter:var(--glass-filter);-webkit-backdrop-filter:var(--glass-filter);border-radius:14px}
.ec-glass,.ec-solid{padding:12px;min-width:0;border-radius:14px}
.ec-solid{background:#fff;color:var(--ink,#182733)}
.ec-pills{position:sticky;top:var(--topbar-h);z-index:8;display:flex;gap:8px;padding:6px;overflow-x:auto;max-width:100%;box-sizing:border-box}
.ec-pills>a,.ec-pills>button,.ec-seg>a,.ec-seg>button{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 12px;box-sizing:border-box;border:0;border-radius:14px;background:transparent;color:inherit;text-decoration:none;font:inherit}
.ec-pills>*{flex:0 0 auto}
.ec-pills [aria-pressed="true"],.ec-pills [aria-current="page"],.ec-seg [aria-current="page"],.ec-seg [aria-pressed="true"]{background:#0E8C8C;color:#fff}
.ec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0}
.ec-card{display:block;min-width:0;overflow:hidden;border-radius:14px;background:var(--glass);color:var(--ink,#182733);text-decoration:none}
.ec-card-img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background-size:cover;background-position:center}
.ec-card-img img{width:100%;height:100%;object-fit:cover}
.ec-card-body{padding:12px;overflow-wrap:anywhere}.ec-card-body strong,.ec-card-body small{display:block}.ec-card-body small{margin-top:4px;color:var(--fog,#44525c)}
.ec-banner{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box;width:100%;min-width:0;height:64px;min-height:44px;padding:8px 12px;overflow:hidden;border-radius:14px;text-shadow:0 1px 3px rgba(0,0,0,.6);background-color:#182733;background-size:cover;background-position:center;color:#fff;text-decoration:none}
.ec-banner::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,0,0,.6),rgba(0,0,0,.05))}
.ec-banner span{flex:none;color:#fff;font-weight:700;overflow-wrap:anywhere}.ec-banner small{color:#fff;font-size:12px}
.ec-seg{display:flex;gap:4px;padding:4px;min-width:0}.ec-seg>*{flex:1;min-width:0}
.ec-skel{min-height:20px;border-radius:14px;background:linear-gradient(100deg,#dbe2e5 25%,#f1f4f5 45%,#dbe2e5 65%);background-size:200% 100%;animation:ec-shimmer 1.5s linear infinite}
@keyframes ec-shimmer{to{background-position:-200% 0}}
.ec-empty{text-align:center;padding:24px 12px;color:var(--fog,#44525c)}.ec-empty strong{display:block;color:var(--ink,#182733)}.ec-empty p{margin:8px 0 12px}.ec-empty button{min-height:44px}
.ec-badge{display:inline-flex;align-items:center;border-radius:999px;padding:3px 8px;background:#e0f2f2;color:#176363;font-size:12px;font-weight:700}
.ec-timeline{display:flex;flex-direction:column;gap:12px}.ec-tl{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;min-width:0}
.ec-page :focus-visible,.ec-banner:focus-visible,.ec-seg :focus-visible,.ec-pills :focus-visible{outline:3px solid #0E8C8C;outline-offset:-3px}
@media(prefers-reduced-motion:reduce){.ec-skel{animation:none}}