/* Sign-in, My Profile (tickets grouped by year), the bib pass and the /c/ card, corporate
   pages. Loaded after app.css + site.css on these pages only. Mobile first (600, 768, 1024, 1140);
   CSS-only effects with plain fallbacks; motion stops under prefers-reduced-motion (app.css). */

/* ---------- Sign in ---------- */
.my-auth{display:grid;gap:26px;padding-top:28px;padding-bottom:56px;align-items:start}
@media(min-width:1024px){.my-auth{grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:56px;padding-top:56px;align-items:center}}
.my-auth-title{max-width:16ch;margin:6px 0 12px;color:var(--paper);font-size:clamp(2rem,1.4rem + 2.8vw,3.4rem);line-height:1;letter-spacing:-.035em;text-wrap:balance}
.my-auth-lead{max-width:34rem;margin:0;color:var(--lilac);font-size:1.06rem}
.my-auth-points{display:none;gap:12px;margin:24px 0 0;padding:0;list-style:none;color:var(--paper);font-weight:600}
@media(min-width:768px){.my-auth-points{display:grid}}
.my-auth-points li{display:flex;align-items:center;gap:12px}
.my-auth-points .icon{flex:none;width:36px;height:36px;padding:8px;border-radius:12px;background:rgba(255,79,163,.14);color:var(--magenta-soft)}
.my-auth-card{padding:26px 22px}
@media(min-width:600px){.my-auth-card{padding:32px}}
.my-auth-card .flow-title{margin:0 0 8px}
.my-auth-card .lead{margin:0 0 20px}
.my-auth-help{display:flex;gap:8px;align-items:flex-start;margin:6px 0 0;font-size:.88rem;color:var(--muted)}
.my-auth-help .icon{flex:none;margin-top:3px}

/* ---------- My Profile: head ---------- */
.my-page{padding-top:28px;padding-bottom:64px}
@media(min-width:768px){.my-page{padding-top:44px}}
.my-head{display:grid;gap:16px;margin-bottom:24px}
@media(min-width:768px){.my-head{grid-template-columns:minmax(0,1fr) auto;align-items:end}}
.my-title{margin:4px 0 6px;color:var(--paper);font-size:clamp(2rem,1.5rem + 2.2vw,3rem);line-height:1.02}
.my-summary{margin:0;color:var(--lilac);font-size:1.05rem;font-weight:600}
.my-who{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.my-who form{margin:0}
.my-who-text{display:flex;align-items:center;gap:8px;margin:0;color:var(--lilac);font-size:.92rem;overflow-wrap:anywhere}
.my-who-text strong{color:var(--paper)}
.my-who-text .icon{flex:none}
.my-pair-note a{color:inherit;font-weight:700}
.my-empty{max-width:640px;margin:8px auto 0}

/* ---------- Years (details/summary: open and closed without JavaScript) ---------- */
.my-year{margin:0 0 18px;border-top:1px solid var(--line)}
.my-year-head{display:flex;align-items:center;gap:14px;min-height:56px;padding:12px 4px;cursor:pointer;list-style:none;border-radius:12px}
.my-year-head::-webkit-details-marker{display:none}
.my-year-head::marker{content:""}
.my-year-head:hover .my-year-label{color:#fff}
.my-year-label{margin:0;color:var(--paper);font-size:clamp(1.6rem,1.3rem + 1.2vw,2.2rem);letter-spacing:-.03em}
.my-year-count{padding:4px 12px;border-radius:999px;background:var(--chip-bg);color:var(--chip-ink);font-size:.82rem;font-weight:700}
.my-year-chevron{margin-left:auto;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--paper);transition:transform .3s var(--ease)}
.my-year[open] > .my-year-head .my-year-chevron{transform:rotate(180deg)}
.my-tickets{display:grid;gap:22px;margin:6px 0 10px;padding:0;list-style:none}

/* ---------- Tickets: a race-bib band over (phones) or beside (desktop) a paper stub ---------- */
.my-ticket{--bib:linear-gradient(150deg,#ff8ec7 0%,var(--magenta) 45%,var(--coral) 100%);--notch:12px;position:relative;display:grid;border-radius:var(--radius);filter:drop-shadow(0 20px 26px rgba(3,2,14,.5))}
.my-ticket.is-pending{--bib:linear-gradient(150deg,#c3b6ff 0%,var(--violet-soft) 45%,#ffa6d2 100%)}
.my-ticket.is-off{--bib:linear-gradient(150deg,#ece9fb 0%,#d3cef0 60%,#bfb8e6 100%)}
.my-ticket-bib{position:relative;display:flex;flex-direction:column;gap:4px;padding:22px 22px 20px;border-radius:var(--radius) var(--radius) 0 0;background:var(--bib);color:var(--midnight)}
.my-ticket-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.my-pill{--dot:var(--lime);background:rgba(14,12,38,.86);color:var(--paper)}
.my-pill .dot{background:var(--dot)}
.is-pending .my-pill{--dot:var(--amber)}
.is-off .my-pill{--dot:var(--lilac)}
.my-ticket-no{font-family:var(--mono);font-size:.84rem;font-weight:700;letter-spacing:.04em;opacity:.85}
.my-ticket-city{margin:8px 0 0;color:var(--midnight);font-size:clamp(2.1rem,1.7rem + 1.8vw,2.8rem);line-height:.95;letter-spacing:-.035em}
.my-ticket-title{margin:2px 0 6px;font-weight:700;font-size:.95rem}
.my-ticket-facts{display:grid;gap:4px;margin:0;padding:0;list-style:none;font-weight:600;font-size:.94rem}
.my-ticket-facts li{display:flex;align-items:flex-start;gap:8px}
.my-ticket-facts .icon{flex:none;margin-top:3px}
.my-ticket-stub{position:relative;display:grid;gap:16px;align-content:start;min-width:0;padding:22px;border-radius:0 0 var(--radius) var(--radius);background:var(--paper);color:var(--midnight);
  --ink:var(--midnight);--ink-2:#34305e;--muted:#5c5888;--line:#dcd8f3;--line-strong:#c9c4ec;--ghost-bg:#fff;--chip-bg:#e9e6fb;--chip-ink:#3d3970;--link:var(--pink-ink);
  --green-50:#e5f6ef;--green-700:var(--green-ink);--danger:#c62828;--danger-50:#fdecec;--focus-color:var(--violet);color-scheme:light}
.my-ticket-stub::before{content:"";position:absolute;top:0;left:calc(var(--notch) + 8px);right:calc(var(--notch) + 8px);border-top:2px dashed #c9c4ec}
@supports ((-webkit-mask:none) or (mask:none)){
  .my-ticket-bib{-webkit-mask:radial-gradient(circle var(--notch) at 0 100%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--notch) at 100% 100%,#0000 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle var(--notch) at 0 100%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--notch) at 100% 100%,#0000 98%,#000) right/51% 100% no-repeat}
  .my-ticket-stub{-webkit-mask:radial-gradient(circle var(--notch) at 0 0,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--notch) at 100% 0,#0000 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle var(--notch) at 0 0,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--notch) at 100% 0,#0000 98%,#000) right/51% 100% no-repeat}
}
@media(min-width:900px){
  .my-ticket{grid-template-columns:300px minmax(0,1fr)}
  .my-ticket-bib{border-radius:var(--radius) 0 0 var(--radius);padding:26px}
  .my-ticket-stub{border-radius:0 var(--radius) var(--radius) 0;padding:24px 28px}
  .my-ticket-stub::before{top:calc(var(--notch) + 8px);bottom:calc(var(--notch) + 8px);left:0;right:auto;border-top:0;border-left:2px dashed #c9c4ec}
  @supports ((-webkit-mask:none) or (mask:none)){
    .my-ticket-bib{-webkit-mask:radial-gradient(circle var(--notch) at 100% 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle var(--notch) at 100% 100%,#0000 98%,#000) bottom/100% 51% no-repeat;mask:radial-gradient(circle var(--notch) at 100% 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle var(--notch) at 100% 100%,#0000 98%,#000) bottom/100% 51% no-repeat}
    .my-ticket-stub{-webkit-mask:radial-gradient(circle var(--notch) at 0 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle var(--notch) at 0 100%,#0000 98%,#000) bottom/100% 51% no-repeat;mask:radial-gradient(circle var(--notch) at 0 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle var(--notch) at 0 100%,#0000 98%,#000) bottom/100% 51% no-repeat}
  }
}
.my-note{display:flex;gap:8px;align-items:flex-start;margin:0;padding:10px 12px;border-radius:12px;background:#ebe8ff;color:#34305e;font-size:.9rem;font-weight:600}
.my-note .icon{flex:none;margin-top:3px;color:var(--violet)}
.my-people{display:grid;gap:0;margin:0;padding:0;list-style:none}
.my-person{display:grid;gap:10px;padding:14px 0;border-bottom:1px solid var(--line)}
.my-person:first-child{padding-top:0}
.my-person:last-child{border-bottom:0;padding-bottom:0}
@media(min-width:600px){.my-person{grid-template-columns:minmax(0,1fr) auto;align-items:start;column-gap:18px}.my-person > .my-group-note,.my-person > .my-actions{grid-column:1 / -1}}
.my-person.is-cancelled .my-person-name{text-decoration:line-through;text-decoration-thickness:1px}
.my-person-name{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:0;font-weight:800;font-size:1.08rem;line-height:1.3}
.my-person-name .badge{text-decoration:none}
.my-person-meta{margin:2px 0 0;color:var(--muted);font-size:.9rem}
.my-ids{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.my-ids div{display:grid;gap:2px;padding:6px 12px;border:1px dashed var(--line-strong);border-radius:12px;background:#fff}
.my-ids dt{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.my-ids dd{margin:0;font-weight:800}
.my-mono{font-family:var(--mono);font-size:1rem}
.my-bib{border-style:solid!important;border-color:transparent!important;background:var(--midnight)!important}
.my-bib dt{color:var(--lilac)!important}
.my-bib dd{font-family:var(--font-display);font-size:1.5rem;line-height:1.05;letter-spacing:-.01em;color:var(--lime)}
.my-group-note{display:flex;gap:8px;align-items:center;margin:0;font-size:.9rem;font-weight:600;color:var(--ink-2)}
.my-actions,.my-order-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.my-order-actions{padding-top:14px;border-top:1px solid var(--line)}
.my-ticket-stub .btn-ghost:hover{border-color:var(--violet);background:#ebe8ff}
@media(max-width:419px){.my-order-actions .btn,.my-actions .btn{flex:1 1 100%}}

/* ---------- The bib pass and the /c/ card ---------- */
.my-pass{width:100%;max-width:440px;display:grid;justify-items:center;gap:16px}
.my-pass-logo{border-radius:14px}
.my-pass-logo img{height:64px;width:auto;padding:6px 10px;border-radius:14px;background:#fff}
.my-pass-card{width:100%;border-radius:28px;overflow:hidden;background:var(--paper);color:var(--midnight);box-shadow:0 30px 70px -30px rgba(3,2,14,.9);color-scheme:light}
.my-pass-band{padding:24px 24px 20px;background:linear-gradient(150deg,#ff8ec7 0%,var(--magenta) 45%,var(--coral) 100%);text-align:center}
.my-pass-kicker{margin:0;font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.my-pass-name{margin:6px 0 2px;color:var(--midnight);font-size:clamp(1.6rem,1.3rem + 1.4vw,2.1rem);overflow-wrap:anywhere}
.my-pass-event{margin:0;font-weight:700}
.my-pass-bib{display:inline-grid;justify-items:center;margin-top:14px;padding:8px 26px;border-radius:16px;background:var(--midnight);color:var(--paper)}
.my-pass-bib span{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lilac)}
.my-pass-bib strong{font-family:var(--font-display);font-size:2.6rem;line-height:1;color:var(--lime);letter-spacing:-.01em}
.my-pass-body{display:grid;justify-items:center;gap:14px;padding:22px 22px 24px}
.my-pass-qr{display:grid;place-items:center;width:100%}
.my-pass-qr .qr{width:min(100%,280px);height:auto;padding:10px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px #dcd8f3}
.my-pass-instr{display:flex;gap:8px;align-items:flex-start;margin:0;font-weight:700;text-align:left}
.my-pass-instr .icon{flex:none;margin-top:3px;color:var(--pink-ink)}
.my-pass-facts{display:grid;gap:10px;width:100%;margin:0;padding:14px 0 0;border-top:1px dashed #c9c4ec}
.my-pass-facts div{display:grid;grid-template-columns:120px 1fr;gap:10px}
.my-pass-facts dt{color:#5c5888;font-size:.88rem}
.my-pass-facts dd{margin:0;font-weight:700;overflow-wrap:anywhere}
.my-pass-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0}
.my-scan .my-scan-who{display:flex;justify-content:center;align-items:center;gap:14px;margin:14px 0 18px}
.my-scan-initial{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--magenta),var(--coral));color:var(--midnight);font-family:var(--font-display);font-size:1.6rem;font-weight:800}
.my-scan-bib{display:grid;justify-items:center;padding:6px 20px;border-radius:14px;background:var(--midnight);box-shadow:inset 0 0 0 1px var(--line-strong)}
.my-scan-bib small{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lilac)}
.my-scan-bib strong{font-family:var(--font-display);font-size:2rem;line-height:1.05;color:var(--lime)}
.my-scan .my-pass-qr{margin:0 0 16px}
.my-scan .error-logo img{height:64px}
@media print{
  .my-pass-links,.minimal-footer{display:none}
  .my-pass-card{box-shadow:none;border:1px solid #999}
}

/* ---------- Corporate pages ---------- */
.corp-page{display:grid;gap:22px;max-width:720px;padding-top:28px;padding-bottom:64px}
@media(min-width:768px){.corp-page{padding-top:48px}}
.corp-title{margin:4px 0 8px;color:var(--paper);font-size:clamp(1.9rem,1.4rem + 2.2vw,2.9rem);line-height:1.02;text-wrap:balance}
.corp-lead{max-width:36rem;margin:0;color:var(--lilac);font-size:1.04rem}
.corp-card{padding:24px 22px}
@media(min-width:600px){.corp-card{padding:30px}}
.corp-card .flow-title{margin:0 0 14px}
.corp-code-input{font-family:var(--mono);font-size:1.25rem!important;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.corp-applied{display:flex;gap:8px;align-items:flex-start;margin:0 0 16px;padding:10px 14px;border-radius:12px;background:var(--green-50);color:var(--green-700);font-weight:600}
.corp-applied .icon{flex:none;margin-top:3px}
.corp-cities{display:grid;gap:12px}
@media(min-width:600px){.corp-cities{grid-template-columns:repeat(2,minmax(0,1fr))}}
.corp-city{position:relative;display:grid;gap:4px;min-height:96px;padding:16px 52px 16px 18px;border:0;border-radius:18px;background:linear-gradient(150deg,#ff8ec7 0%,var(--magenta) 45%,var(--coral) 100%);color:var(--midnight);font:inherit;text-align:left;cursor:pointer;transition:transform .35s var(--ease),box-shadow .3s}
.corp-city:hover{transform:translateY(-2px);box-shadow:0 14px 30px -14px rgba(255,79,163,.8)}
.corp-city:focus-visible{outline:3px solid var(--violet);outline-offset:3px}
.corp-city-name{font-family:var(--font-display);font-size:1.6rem;font-weight:800;line-height:1;letter-spacing:-.03em}
.corp-city-meta{display:flex;align-items:center;gap:6px;font-weight:600;font-size:.9rem}
.corp-city-go{position:absolute;right:14px;top:50%;display:grid;place-items:center;width:34px;height:34px;margin-top:-17px;border-radius:50%;background:var(--midnight);color:var(--paper)}

/* Kicker labels with an icon, on the stage */
.my-head .kicker-light,.my-auth-intro .kicker-light,.corp-head .kicker-light{display:flex;align-items:center;gap:8px}
.corp-card .fine a{display:inline-block;padding:12px 0;margin:-12px 0}
.my-paging{display:flex;justify-content:center;margin:8px 0 18px}
/* The resend label ("available after 60 seconds") wraps on 320/360 px phones instead of widening the page. */
.otp-actions form{min-width:0;max-width:100%}
.otp-actions .btn-link{white-space:normal;text-align:left}
.my-data{max-width:760px;margin:32px auto 0;padding:24px 22px}.my-data-links{display:flex;flex-wrap:wrap;gap:10px}.my-data-sub{margin:22px 0 6px;font-size:1.05rem}.my-data-requests{margin:0;padding-left:1.1em}.my-data-requests li{margin-bottom:6px}