/* The GivenGain look, as the platform uses it: Figtree, the navy ground, the coral and yellow
   accents, the soft blobs. Shared by the sign-in page and the administration screen so the two
   never drift apart. */
:root{
  --navy:#15006D; --navy-deep:#0E0049; --coral:#EA605A; --yellow:#FFDF71;
  --pink:#F590BC; --mint:#8DE6E6; --green:#48C298; --violet:#7C5CFC;
  --ink:#23213a; --muted:#6a6880; --paper:#fff; --paper-soft:#f7f6fb; --line:#e7e5f3;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--ink);
  background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-weight:800;line-height:1.12;color:var(--navy);letter-spacing:-.015em}
a{color:var(--coral);text-decoration:none}

/* ---------- the sign-in ground ---------- */
body.auth{background:var(--navy-deep)}
body.auth main.auth-card{margin:clamp(48px,11vh,120px) auto clamp(56px,12vh,130px)}
body.auth::before,body.auth::after,body.auth .blob3{position:fixed}
body.auth::before,body.auth::after{content:"";position:absolute;border-radius:50%;filter:blur(90px);opacity:.42;z-index:0}
body.auth::before{width:620px;height:620px;background:var(--pink);top:-200px;left:-180px}
body.auth::after{width:720px;height:720px;background:var(--violet);bottom:-280px;right:-220px}
body.auth .blob3{position:absolute;width:420px;height:420px;border-radius:50%;background:var(--mint);
  filter:blur(110px);opacity:.3;top:38%;right:14%;z-index:0}

.auth-card{position:relative;z-index:1;width:calc(100% - 40px);max-width:430px;background:var(--paper);
  border-radius:24px;padding:40px 38px 34px;box-shadow:0 30px 80px rgba(8,0,42,.45)}
.auth-card .gg{height:34px;width:auto;display:block;margin-bottom:28px;color:var(--navy)}
.auth-card h1{font-size:1.7rem;margin-bottom:10px}
.auth-card p{color:var(--muted);font-size:.98rem;margin-bottom:20px}
.auth-card p b{color:var(--navy)}
.auth-card label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.auth-card input[type=email]{width:100%;font-family:inherit;font-size:1rem;color:var(--ink);
  background:var(--paper-soft);border:1.5px solid var(--line);border-radius:12px;padding:14px 16px;outline:none}
.auth-card input[type=email]:focus{border-color:var(--violet);background:#fff}
.auth-btn{display:inline-block;width:100%;margin-top:18px;background:var(--yellow);color:var(--navy);
  border:0;border-radius:999px;padding:15px 30px;font-family:inherit;font-weight:800;font-size:1rem;
  cursor:pointer;transition:transform .12s ease,filter .12s ease}
.auth-btn:hover{transform:translateY(-1px);filter:brightness(1.03)}
.auth-btn[disabled]{opacity:.55;cursor:default;transform:none}
.auth-alt{display:inline-block;margin-top:18px;font-size:.88rem;font-weight:600}
.auth-note{margin-top:22px;padding-top:18px;border-top:1px solid var(--line);
  color:var(--muted);font-size:.82rem;line-height:1.55}
.auth-msg{margin-top:18px;border-radius:12px;padding:14px 16px;font-size:.9rem;font-weight:500;line-height:1.5}
.auth-msg.good{background:rgba(72,194,152,.14);color:#136B51}
.auth-msg.warn{background:#FFF7DD;color:#5A4A00}
.auth-msg.bad{background:rgba(234,96,90,.13);color:#9C2A24}
.auth-msg a{word-break:break-all;font-weight:700}

/* ---------- GivenGain's own screen ---------- */
body.admin{background:var(--paper-soft);display:block;min-height:100vh}
body.admin::before,body.admin::after{display:none}
/* The same shape as the dashboard: the navy stops at the bar, the heading sits on the page, and
   the tab row sticks beneath the bar with a hairline rather than a band. */
.adm-head{background:var(--paper-soft);color:var(--ink);padding:14px 0 0}
.adm-wrap{max-width:1060px;margin:0 auto;padding:0 28px}
.adm-top{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.adm-top .gg{height:30px;width:auto;display:block;color:#fff}
.adm-top .who{font-size:.82rem;color:rgba(255,255,255,.72);font-weight:600;display:flex;align-items:center;gap:14px}
.adm-top .who a{color:#fff;opacity:.75;font-weight:700}
.adm-top .who a:hover{opacity:1}
.adm-head h1{color:var(--navy);font-size:clamp(1.5rem,2.7vw,2rem);letter-spacing:-.02em;margin:0 0 7px}
.adm-head p{color:var(--muted);font-size:.92rem;max-width:66ch;margin:0 0 12px}
.adm-body{max-width:1060px;margin:0 auto;padding:22px 28px 70px}
.adm-card{background:#fff;border-radius:20px;padding:26px 28px;box-shadow:0 10px 30px rgba(21,0,109,.07);margin-bottom:22px}
.adm-card h2{font-size:1.15rem;margin-bottom:6px}
.adm-card .sub{color:var(--muted);font-size:.9rem;margin-bottom:18px}
.adm-card .sub b{color:var(--navy)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em;background:var(--paper-soft);
  border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.adm-form{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1.2fr) auto;gap:12px;align-items:end}
.adm-form label{display:block;font-size:.68rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.adm-form input{width:100%;font-family:inherit;font-size:.95rem;color:var(--ink);background:var(--paper-soft);
  border:1.5px solid var(--line);border-radius:11px;padding:11px 13px;outline:none}
.adm-form input:focus{border-color:var(--violet);background:#fff}
.adm-btn{background:var(--navy);color:#fff;border:0;border-radius:999px;padding:12px 24px;
  font-family:inherit;font-weight:800;font-size:.9rem;cursor:pointer;white-space:nowrap}
.adm-btn:hover{background:#1d0a86}
.adm-btn.ghost{background:#fff;color:var(--navy);border:1px solid var(--line)}
.adm-btn.ghost:hover{background:var(--paper-soft);border-color:rgba(21,0,109,.3)}
.adm-btn.quiet{background:none;color:var(--muted);font-weight:700;padding:6px 10px;font-size:.82rem}
.adm-btn.quiet:hover{color:var(--coral);background:rgba(234,96,90,.09)}
@media(max-width:820px){.adm-form{grid-template-columns:1fr}}
.u{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1.6fr) auto;gap:14px;align-items:center;
  padding:14px 0;border-bottom:1px solid var(--line)}
.u:last-child{border-bottom:0}
.u-who b{display:block;color:var(--navy);font-weight:700;font-size:.95rem;word-break:break-all}
.u-who span{display:block;color:var(--muted);font-size:.78rem;margin-top:2px}
.u-ev{display:flex;gap:7px;flex-wrap:wrap}
.u-ev a{background:var(--paper-soft);border:1px solid var(--line);border-radius:999px;padding:5px 12px;
  font-size:.8rem;font-weight:700;color:var(--navy)}
.u-ev a:hover{border-color:rgba(21,0,109,.3);background:#fff}
.u-act{display:flex;gap:6px;justify-self:end}
@media(max-width:700px){.u{grid-template-columns:1fr;gap:8px}.u-act{justify-self:start}}
/* Everyone who may open this manager's dashboard, each with their own sign-in link. The rules are
   written through .u-who, which styles every span inside it as a block and would otherwise break
   the chip over two lines. */
.u-who .u-people{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.u-who .u-person{display:inline-flex;align-items:center;gap:2px;background:var(--paper-soft);
  border:1px solid var(--line);border-radius:999px;padding:3px 5px 3px 12px;font-size:.78rem;
  font-weight:600;color:var(--navy);max-width:100%;margin:0}
.u-who .u-person .pm{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--navy);font-size:.78rem;margin:0;max-width:26ch}
.u-who .u-person button{background:none;border:0;cursor:pointer;color:var(--muted);width:22px;height:22px;
  border-radius:50%;display:inline-flex;align-items:center;justify-content:center;padding:0;flex:0 0 auto}
.u-who .u-person button svg{width:13px;height:13px}
.u-who .u-person button:hover{background:#fff;color:var(--navy)}
.u-who .u-person button.x:hover{background:rgba(234,96,90,.15);color:var(--coral)}
.adm-msg{border-radius:12px;padding:13px 16px;font-size:.9rem;font-weight:500;margin-bottom:16px}
.adm-msg.good{background:rgba(72,194,152,.14);color:#136B51}
.adm-msg.bad{background:rgba(234,96,90,.13);color:#9C2A24}
.adm-msg.warn{background:#FFF7DD;color:#5A4A00}
.adm-empty{color:var(--muted);font-size:.92rem;padding:10px 0}
.pill-seed{background:var(--violet-light,#DCD3FA);color:var(--navy);border-radius:999px;padding:3px 10px;
  font-size:.7rem;font-weight:800;letter-spacing:.04em;margin-left:8px}
.logo-thumb{width:42px;height:42px;object-fit:contain;background:var(--paper-soft);border:1px solid var(--line);
  border-radius:10px;padding:4px;float:left;margin-right:12px}
.logo-pick{margin-top:20px}
.logo-pick > label{display:block;font-size:.68rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  color:var(--muted)}
.hintline{color:var(--muted);font-size:.85rem;margin:6px 0 0;max-width:62ch}
.logo-has{display:inline-flex;align-items:center;gap:8px}
.logo-has img{width:40px;height:40px;object-fit:contain;background:var(--paper-soft);
  border:1px solid var(--line);border-radius:10px;padding:4px}
.adm-form input[type=file]{background:none;border:1.5px dashed var(--line);padding:9px 12px;font-size:.85rem;color:var(--muted)}
.adm-form input[type=file]:hover{border-color:var(--violet)}

/* ---------- connecting events to a manager ---------- */
.ev-pick{margin-top:20px}
.ev-pick > label{display:block;font-size:.68rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  color:var(--muted);margin-bottom:7px}
/* The address field, which behaves like the event search: what is typed becomes a chip. */
.ev-pick > input[type=email]{width:100%;font-family:inherit;font-size:.95rem;color:var(--ink);
  background:var(--paper-soft);border:1.5px solid var(--line);border-radius:11px;padding:11px 13px;outline:none}
.ev-pick > input[type=email]:focus{border-color:var(--violet);background:#fff}
.ev-pick > .hintline{margin:7px 0 0}
.ev-search{position:relative}
.ev-search > svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted)}
.ev-search input{width:100%;font-family:inherit;font-size:.95rem;color:var(--ink);background:var(--paper-soft);
  border:1.5px solid var(--line);border-radius:11px;padding:11px 13px 11px 40px;outline:none}
.ev-search input:focus{border-color:var(--violet);background:#fff}
.ev-results{position:absolute;z-index:20;top:calc(100% + 6px);left:0;right:0;background:#fff;
  border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 44px rgba(21,0,109,.16);
  max-height:330px;overflow:auto;padding:6px}
.ev-row{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:0;
  font-family:inherit;padding:9px 10px;border-radius:10px;cursor:pointer}
.ev-row:hover{background:var(--paper-soft)}
.ev-row .av{width:32px;height:32px;border-radius:9px;background:var(--navy);color:#fff;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;font-size:.66rem;font-weight:800;overflow:hidden}
.ev-row .av img{width:100%;height:100%;object-fit:cover;display:block}
.ev-n{min-width:0}
.ev-n b{display:block;color:var(--navy);font-weight:700;font-size:.9rem;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.ev-n span{display:block;color:var(--muted);font-size:.76rem;margin-top:1px}
.ev-none{padding:12px;color:var(--muted);font-size:.88rem}
.ev-chosen{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.ev-chip{display:inline-flex;align-items:center;gap:8px;background:var(--paper-soft);border:1px solid var(--line);
  border-radius:999px;padding:7px 8px 7px 14px;font-size:.85rem;font-weight:700;color:var(--navy)}
.ev-chip button{background:none;border:0;cursor:pointer;color:var(--muted);font-size:1.05rem;line-height:1;
  width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
.ev-chip button:hover{background:rgba(234,96,90,.15);color:var(--coral)}
.ev-head{font-size:.65rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
  padding:10px 10px 6px}
.ev-row.is-team .av{background:var(--violet)}
.ev-chip.team{background:var(--violet-light,#DCD3FA);border-color:transparent}
.ev-chip.team i{font-style:normal;font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:var(--violet);margin-right:2px}
.u-ev .ev-tag{background:var(--paper-soft);border:1px solid var(--line);border-radius:999px;padding:5px 12px;
  font-size:.8rem;font-weight:700;color:var(--navy)}
.u-ev .ev-tag.team{background:var(--violet-light,#DCD3FA);border-color:transparent}

/* ---------- searching and sorting the manager list ---------- */
.shead2{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:6px}
.shead2 .sub{margin-bottom:0}
.adm-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.adm-search{position:relative}
.adm-search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--muted)}
.adm-search input{font-family:inherit;font-size:.88rem;color:var(--ink);background:var(--paper-soft);
  border:1.5px solid var(--line);border-radius:999px;padding:9px 14px 9px 34px;width:230px;outline:none}
.adm-search input:focus{border-color:var(--violet);background:#fff}
.adm-sort{display:inline-flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.adm-sort select{appearance:none;font-family:inherit;font-size:.88rem;font-weight:600;color:var(--navy);
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%2315006D' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 12px center/10px;
  border:1.5px solid var(--line);border-radius:999px;padding:9px 32px 9px 14px;cursor:pointer;text-transform:none;letter-spacing:0}
.adm-sort select:focus{border-color:var(--violet);outline:none}
@media(max-width:720px){.adm-tools{width:100%}.adm-search{flex:1}.adm-search input{width:100%}}

/* ---------- the access screen's own sections ---------- */
.adm-tabbar{background:var(--paper-soft);position:sticky;top:var(--headh,66px);z-index:40}
.adm-tabs{display:flex;gap:2px;margin:0}
.adm-tabs button{appearance:none;border:0;background:none;font-family:inherit;font-size:14.5px;font-weight:700;
  color:var(--muted);padding:7px 14px;border-radius:9px 9px 0 0;cursor:pointer;position:relative;top:1px;
  white-space:nowrap;border-bottom:3px solid transparent;transition:color .12s,background .12s}
.adm-tabs button:hover{color:var(--navy);background:#fff}
.adm-tabs button[aria-selected="true"]{color:var(--navy);border-bottom-color:var(--navy)}
@media(max-width:600px){.adm-tabs{overflow-x:auto;scrollbar-width:none}.adm-tabs::-webkit-scrollbar{display:none}}

/* ---------- a card that folds away ---------- */
/* Closed, there is no card at all: one + button, and the list of managers below it. Open, the +
   turns into the way to close it again. */
.open-card{padding:0;overflow:hidden;position:relative}
.open-card:not(.open){background:none;box-shadow:none;margin-bottom:0}
/* The + sits at the end of the Event access line, where a thing to add belongs. */
.adm-titlerow{display:flex;align-items:center;justify-content:space-between;gap:18px}
.adm-titlerow h1{margin:0 0 7px}
.open-add{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;flex:0 0 auto;
  border-radius:50%;background:var(--navy);color:#fff;border:0;cursor:pointer;
  box-shadow:0 8px 20px rgba(21,0,109,.18);transition:background .2s ease,transform .18s ease}
.open-add svg{width:20px;height:20px;display:block}
.open-add:hover{background:#25119c;transform:translateY(-1px)}
.open-add[hidden]{display:none}
.open-close{position:absolute;top:16px;right:18px;display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;background:none;border:0;color:var(--muted);cursor:pointer;
  transition:background .2s ease,color .2s ease}
.open-close svg{width:18px;height:18px;display:block}
.open-close:hover{background:var(--paper-soft);color:var(--navy)}
.open-card:not(.open) .open-close{display:none}
/* A max-height slide rather than the 0fr/1fr grid trick: the event search has to hang outside the
   card, and a grid row that must stay clipped cannot allow that. */
.open-body{max-height:0;overflow:hidden;opacity:0;transition:max-height .28s ease,opacity .2s ease}
.open-card.open .open-body{max-height:1100px;overflow:visible;opacity:1}
.open-card.open .open-body > form{padding:24px 28px 26px}
.open-body > form > h2{font-size:1.15rem;font-weight:800;color:var(--navy);letter-spacing:-.015em;
  margin:0 0 6px;padding-right:40px}
.open-body > form > .sub{margin:0 0 16px;max-width:62ch}
.open-card.open{overflow:visible}
@media(prefers-reduced-motion:reduce){.open-body{transition:none}}