:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-height: 100vh; min-height: 100dvh; background: linear-gradient(154deg, #071c59 0%, #0c45c0 49%, #2d78ff 100%); color: #fff; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
.event-shell { min-height: 100vh; min-height: 100dvh; padding: max(24px, env(safe-area-inset-top)) 20px max(32px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; align-items: center; }
.event-brand { width: min(100%, 520px); padding: 4px 4px 28px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.event-brand__identity { display: flex; align-items: center; gap: 10px; min-width: 0; }
.event-brand__mark { display: block; width: 32px; height: 32px; object-fit: contain; flex: 0 0 auto; }
.event-brand__wordmark { display: block; color: #fff; font-size: 28px; font-weight: 800; letter-spacing: -.055em; line-height: 1; }
.app-navigation { display: flex; align-items: center; gap: 8px; min-width: 0; }
.space-switcher, .account-trigger { border: 1px solid rgba(255,255,255,.28); color: #fff; background: rgba(4, 31, 92, .28); box-shadow: 0 8px 20px rgba(0, 18, 70, .16); backdrop-filter: blur(10px); }
.space-switcher { min-width: 0; display: inline-flex; align-items: center; gap: 6px; height: 38px; max-width: min(46vw, 260px); padding: 0 11px; border-radius: 999px; font-weight: 760; }
.space-switcher__icon { font-size: 15px; opacity: .88; }
.space-switcher__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.space-switcher__chevron { font-size: 16px; line-height: 1; opacity: .8; }
.account-trigger { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; padding: 0; border-radius: 50%; font-size: 13px; font-weight: 850; }
.space-switcher:focus-visible, .account-trigger:focus-visible, .navigation-sheet button:focus-visible { outline: 3px solid rgba(35,119,255,.34); outline-offset: 3px; }
.navigation-sheet { width: min(100%, 560px); max-width: 560px; margin: auto auto 0; border: 0; border-radius: 26px 26px 0 0; padding: 10px 20px calc(22px + env(safe-area-inset-bottom)); color: #10204b; background: #fff; box-shadow: 0 -18px 60px rgba(0, 16, 66, .26); }
.navigation-sheet::backdrop { background: rgba(3, 15, 53, .48); backdrop-filter: blur(4px); }
.navigation-sheet__handle { width: 42px; height: 4px; border-radius: 999px; margin: 2px auto 17px; background: #d6deeb; }
.navigation-sheet__header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.navigation-sheet__header h2 { margin: 0; color: #10204b; font-size: 20px; letter-spacing: -.025em; }
.navigation-sheet__close { display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; padding: 0; color: #38507f; background: #edf2fb; font-size: 24px; line-height: 1; }
.space-list { display: grid; gap: 7px; }
.space-list__item { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; border: 1px solid transparent; border-radius: 16px; padding: 14px 13px; text-align: left; color: #10204b; background: transparent; }
.space-list__item:hover { background: #f3f7ff; }
.space-list__item.is-active { border-color: #bdd3ff; background: #edf4ff; }
.space-list__check { width: 18px; color: #1457d7; font-weight: 900; text-align: center; }
.space-list__copy { display: grid; gap: 3px; min-width: 0; }
.space-list__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 800; }
.space-list__type { color: #687b9d; font-size: 12px; font-weight: 650; }
.space-list__role { color: #5872a7; font-size: 12px; font-weight: 700; }
.account-summary { display: grid; gap: 3px; padding: 8px 2px 18px; }
.account-summary strong { color: #10204b; font-size: 17px; }
.account-summary span { color: #687b9d; font-size: 14px; overflow-wrap: anywhere; }
.account-actions { display: grid; border-top: 1px solid #e5ebf5; }
.account-action { width: 100%; display: flex; align-items: center; justify-content: space-between; border: 0; border-bottom: 1px solid #e5ebf5; padding: 17px 2px; color: #1d3560; background: transparent; text-align: left; font-weight: 760; }
.account-action--danger { color: #b33e36; }
@media (min-width: 760px) { .navigation-sheet { margin: 88px max(22px, calc((100vw - 1120px) / 2)) auto auto; border-radius: 20px; padding-bottom: 18px; } .navigation-sheet__handle { display: none; } }
.event-panel { width: min(100%, 520px); margin: auto 0; border: 1px solid rgba(255,255,255,.24); border-radius: 28px; padding: clamp(24px, 7vw, 40px); background: rgba(255,255,255,.96); color: #10204b; box-shadow: 0 22px 70px rgba(0, 12, 56, .38); }
.event-loading { min-height: 220px; display: grid; place-content: center; gap: 14px; text-align: center; color: #38507f; }
.spinner { width: 28px; height: 28px; border-radius: 50%; border: 3px solid #d7e3fc; border-top-color: #1457d7; margin: auto; animation: spin .75s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.eyebrow { margin: 0 0 8px; font-size: 11px; line-height: 1.2; letter-spacing: .12em; font-weight: 800; color: #1760dd; }
h1 { margin: 0; font-size: clamp(28px, 8vw, 40px); line-height: 1.07; letter-spacing: -.045em; color: #0b245e; }
.lede { margin: 14px 0 26px; color: #526687; font-size: 16px; line-height: 1.5; }
form { display: grid; gap: 16px; }
label { display: grid; gap: 7px; font-size: 13px; font-weight: 750; color: #20365e; }
input, textarea { width: 100%; border: 1px solid #c8d5ea; border-radius: 13px; padding: 13px 14px; color: #10204b; outline: none; background: #fff; transition: border-color .15s, box-shadow .15s; }
textarea { resize: vertical; min-height: 110px; }
input:focus, textarea:focus { border-color: #1760dd; box-shadow: 0 0 0 3px rgba(23,96,221,.15); }
.primary-button { margin-top: 4px; border: 0; border-radius: 14px; padding: 14px 17px; color: #fff; font-weight: 800; background: linear-gradient(135deg, #0d45bc, #2678f3); box-shadow: 0 8px 17px rgba(14,71,184,.25); }
.primary-button:disabled, .text-button:disabled { cursor: wait; opacity: .62; }
.fine-print { margin: 17px 0 0; font-size: 12px; line-height: 1.45; color: #71809a; }
.back-button, .text-button { border: 0; padding: 0; background: transparent; color: #1457d7; font-weight: 750; }
.back-button { margin-bottom: 24px; }
.text-button { margin-top: 20px; }
.form-status { margin: 21px 0 0; border-radius: 12px; padding: 12px 14px; font-size: 14px; line-height: 1.35; color: #73351d; background: #fff4e9; }
.form-status.is-success { color: #175837; background: #eaf8ef; }
.space-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.space-heading .text-button { margin-top: 2px; white-space: nowrap; }
.space-cards { display: grid; gap: 12px; }
.space-card { border-radius: 18px; padding: 18px; color: #fff; background: linear-gradient(137deg, #0e337f, #1d6ee7); box-shadow: 0 9px 20px rgba(18,60,136,.18); }
.space-card.is-own { outline: 3px solid rgba(69,135,255,.28); }
.space-card h2 { margin: 0; font-size: 21px; letter-spacing: -.03em; }
.space-card p { margin: 6px 0 0; color: rgba(255,255,255,.87); line-height: 1.42; }
.space-card .card-subtitle { font-size: 14px; font-weight: 700; }
.space-card .card-description { font-size: 14px; }
@media (max-width: 390px) { .event-panel { border-radius: 22px; padding: 24px 20px; } .event-brand { padding-bottom: 16px; } }