.discovery { margin:0; background:#f8f7f2; color:#202a35; font-family:Geist,system-ui,"Noto Sans TC",sans-serif; line-height:1.65; }
/* Japanese text takes Japanese glyph shapes and kinsoku breaks; system fonts only. */
.discovery:lang(ja) { font-family:Geist,"Hiragino Sans","Hiragino Kaku Gothic ProN","BIZ UDPGothic","Yu Gothic UI",Meiryo,"Noto Sans JP",system-ui,sans-serif; line-break:strict; }
/* The header is the shared public one (site-header.css), full width; only
   the content keeps to the 960px column. */
.discovery main,.discovery footer { max-width:960px; margin:auto; padding:24px; }
/* On a phone the content starts where the header's brand does. */
@media(max-width:760px) { .discovery main,.discovery footer { padding:24px 16px; } }
.discovery footer { border-top:1px solid #dfe3df; font-size:14px; }
/* One scale for every introduction page, largest to smallest: the name, a
   section, a card's own title, body text, buttons, then secondary facts,
   each step about 1.2 of the next. A heading is never smaller than the
   controls under it. */
.discovery h1 { margin:12px 0; font-size:clamp(26px,5vw,36px); line-height:1.35; overflow-wrap:anywhere; }
.discovery h2 { font-size:22px; line-height:1.4; margin:40px 0 12px; }
.discovery h3 { font-size:18px; margin:28px 0 0; }
.discovery a { color:#306d59; text-underline-offset:4px; overflow-wrap:anywhere; }
.discovery a:focus-visible { outline:3px solid #d99b44; outline-offset:4px; }
/* #626b73 on the page background is 5.06:1, clear of the 4.5:1 body-text minimum. */
.discovery .eyebrow { font-variant-numeric:tabular-nums; color:#626b73; }
/* An event's two entries are the circle page's button family: ink for the
   map the page leads with, soft white with a structural line for its peer. */
.discovery .entries { display:flex; flex-wrap:wrap; gap:8px; }
.discovery :is(.primary,.secondary) { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 20px; border:1px solid #202a35; border-radius:7px; background:#202a35; color:#f9faf8; font-size:15px; font-weight:700; text-decoration:none; }
.discovery .primary:hover { background:#34404d; }
.discovery .secondary { border-color:#cfd5cf; background:#f9faf8; color:#202a35; }
.discovery .secondary:hover { background:#f0f2ef; }
.circle-directory { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr)); gap:0 24px; padding:0; list-style:none; }
.circle-directory a { display:block; padding:12px 0; border-bottom:1px solid #dfe3df; }
/* A circle's booths, one card per day and place: the code is what a reader
   matches against the hall's signs, so it is the largest thing on the card.
   Its tint is the booth's own map colour, so the card and the slot agree. */
.booth-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:12px; margin:12px 0 0; padding:0; list-style:none; }
.booth-card { display:flex; flex-direction:column; gap:6px; padding:16px 18px; border:1px solid #dfe3df; border-radius:12px; background:#f9faf8; }
.booth-card p { margin:0; }
.booth-when { font-size:18px; font-weight:700; font-variant-numeric:tabular-nums; }
.booth-codes { display:flex; flex-wrap:wrap; gap:8px; }
.booth-code { --tone:#707a82; min-width:64px; padding:2px 10px; border-radius:7px; background:color-mix(in srgb,var(--tone),#fff 80%); color:color-mix(in srgb,var(--tone),#1d2730 55%); font:800 26px/1.3 Geist,system-ui,sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.02em; text-align:center; }
.tone-coral { --tone:#e86f5d; } .tone-mint { --tone:#57a88e; } .tone-blue { --tone:#4f83bd; } .tone-amber { --tone:#d99b44; } .tone-lilac { --tone:#8b72b1; }
/* A booth that is no longer the destination loses its colour; the status
   words say why, so colour is never the only signal. */
.booth-card.retired .booth-code { --tone:#707a82; }
.booth-where { color:#626b73; font-size:14px; }
.booth-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:6px; }
.discovery .booth-map { display:inline-flex; align-items:center; min-height:44px; padding:0 14px; border:1px solid #cfd5cf; border-radius:7px; background:#f8f7f2; color:#202a35; font-size:15px; font-weight:700; text-decoration:none; }
.discovery .booth-map:hover { background:#f0f2ef; }
.booth-plan:empty { display:none; }
.status { color:#a43e30; }
.booth-plan { display:flex; }
@media(max-width:540px) { .booth-actions > * { flex:1 1 100%; justify-content:center; } .booth-plan > * { flex:1; } .discovery .entries > * { flex:1 1 0; } }
.discovery .claim { margin-top:32px; }
.discovery footer a + a { margin-left:20px; }
/* /portal/: what circles and organizers get after signing in. Each section
   leads with its demos, then how to get in beside what it opens. */
.portal-jump { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.portal-jump a { display:inline-flex; align-items:center; min-height:44px; padding:0 16px; border:1px solid #cfd5cf; border-radius:999px; background:#f9faf8; color:#202a35; font-weight:700; text-decoration:none; }
.portal-jump a:hover { background:#f0f2ef; }
.portal-section { margin-top:48px; padding-top:32px; border-top:1px solid #dfe3df; scroll-margin-top:16px; }
.portal-section .eyebrow { margin:0; font-weight:700; }
.discovery .portal-section h2 { margin:4px 0 20px; font-size:clamp(22px,4vw,28px); }
.portal-demos { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr)); gap:16px; }
.portal-demos figure { margin:0; }
.portal-demos img { display:block; width:100%; height:auto; border:1px solid #dfe3df; border-radius:12px; background:#f9faf8; }
.portal-demos figcaption { margin-top:8px; color:#626b73; font-size:14px; }
.portal-columns { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); gap:8px 32px; }
.portal-columns :is(ol,ul) { margin:10px 0 0; padding-left:1.4em; }
.portal-columns li + li { margin-top:6px; }
.discovery .portal-note { color:#626b73; font-size:14px; }
.portal-section .entries { margin-top:20px; }