:root { color-scheme:light; --purple:#6b36ad; --ink:#302044; --muted:#685777; --line:#d8c9e9; --paper:#f7f5fa; --tint:#ede6f7; font-family:Arial,Helvetica,sans-serif; color:var(--ink); background:var(--paper); font-synthesis:none; }
* { box-sizing:border-box; }
body { margin:0; min-width:0; }
button,a { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
a { color:var(--purple); text-decoration:none; }
button { font:inherit; cursor:pointer; }
:focus-visible { outline:3px solid #a970ee; outline-offset:4px; }
.skip-link { position:fixed; z-index:10; top:8px; left:8px; transform:translateY(-160%); padding:12px; background:white; border-radius:8px; }
.skip-link:focus { transform:translateY(0); }
.masthead { background:var(--ink); color:white; padding:23px 16px 12px; text-align:center; border-top:4px solid var(--purple); }
.brand { display:flex; align-items:center; justify-content:center; gap:12px; margin:0; font-size:inherit; }
.brand img { flex-shrink:0; }
.wordmark { display:flex; flex-direction:column; text-align:left; gap:6px; font:700 2.1rem/.95 Georgia,'Times New Roman',serif; letter-spacing:-.055em; }
.wordmark>span { font:550 .75rem/1 Arial,Helvetica,sans-serif; text-transform:uppercase; letter-spacing:.32em; padding-left:2px; }
.companion-link { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:8px; font-size:.8125rem; border-radius:8px; }
.masthead .companion-link { color:#e9def8; margin-top:7px; }
.companion-link:hover { text-decoration:underline; text-underline-offset:4px; }
main { width:min(1200px,100%); margin:0 auto; padding:28px 24px 0; min-height:calc(100svh - 300px); }
.categories { display:flex; justify-content:center; margin-bottom:25px; }
.category-bubble { display:flex; flex-wrap:wrap; justify-content:center; width:max-content; max-width:100%; gap:5px; padding:7px; border:1px solid #cbb5e5; border-radius:12px; background:var(--tint); }
.category-bubble button { display:flex; flex:0 0 68px; width:68px; min-height:78px; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:7px 3px; border:1px solid #b79ace; border-radius:7px; color:var(--purple); background:white; font-size:.875rem; line-height:1.2; }
.category-bubble button[aria-selected="true"] { color:white; background:var(--purple); border-color:var(--purple); }
.category-bubble button:hover { box-shadow:inset 0 0 0 1px currentColor; }
.category-bubble svg { width:18px; height:18px; stroke:currentColor; stroke-width:1.7; fill:none; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.results-heading { display:flex; justify-content:space-between; align-items:center; gap:14px; min-height:32px; margin-bottom:12px; color:var(--muted); font-size:.875rem; }
.results-heading p { margin:0; }
.results-heading>span { font-size:.8125rem; text-align:right; }
.empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:280px; padding:30px 20px; border:1px solid var(--line); border-radius:12px; background:white; text-align:center; }
.empty-state img { display:block; width:min(420px,100%); aspect-ratio:7/3; height:auto; object-fit:cover; border-radius:9px; margin-bottom:25px; }
.empty-state h2 { margin:0 0 10px; font:700 1.5rem/1.25 Georgia,'Times New Roman',serif; letter-spacing:-.025em; }
.empty-state p { max-width:36ch; margin:0; font-size:1rem; line-height:1.5; color:var(--muted); }
.empty-state[hidden],.load-error[hidden] { display:none; }
.place-list { display:grid; gap:10px; }
.place-card { background:white; border:1px solid var(--line); border-left:4px solid var(--purple); border-radius:10px; padding:13px 16px; }
.place-card h2 { margin:0 0 6px; font-size:1rem; line-height:1.4; }
.place-card p { margin:5px 0; font-size:1rem; line-height:1.5; color:var(--muted); }
.place-card .place-address { font-size:.875rem; }
.place-links { display:flex; flex-wrap:wrap; gap:8px 18px; }
.place-links a { display:inline-flex; align-items:center; min-height:44px; font-size:.875rem; }
footer { padding:34px 20px 22px; text-align:center; }
.brand-small { gap:9px; }
.brand-small .wordmark { font-size:1.5rem; gap:4px; }
.brand-small .wordmark>span { font-size:.75rem; letter-spacing:.23em; }
footer .companion-link { margin-top:8px; }
@media(max-width:480px) { main { padding:22px 12px 0; } .categories { margin-bottom:17px; } .empty-state { padding:26px 16px; } }
.masthead { padding:22px 16px; }
.brand-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:18px; }
.companion-logo-link { display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px; width:44px; height:44px; padding:5px; border-radius:10px; }
.companion-logo-link:hover { background:#ffffff12; }
footer { background:var(--ink); color:white; padding:28px 20px; margin-top:30px; }

/* Match the responsive date and category tiles on Tamigi Events. */
:root {
  --control-width:clamp(44px,calc(30px + 3.333333vw),54px);
  --control-gap:clamp(3px,calc(.2px + .666667vw),5px);
  --control-padding:clamp(6px,calc(4.6px + .333333vw),7px);
  --control-label-size:clamp(.71875rem,calc(.5875rem + .5vw),.8125rem);
}
.category-bubble { gap:var(--control-gap); padding:var(--control-padding); }
.category-bubble button {
  flex:0 0 var(--control-width); width:var(--control-width); min-width:44px; min-height:72px;
  gap:5px; padding:7px 0; font-size:var(--control-label-size); letter-spacing:-.06em; overflow-wrap:anywhere;
}
.category-bubble button>span { min-width:0; max-width:100%; }

.portal-home { color:inherit; text-decoration:none; } .masthead h1 { margin:0; }
