:root{
--bg-0:#1a0a1e; --bg-1:#240d2c; --bg-2:#2e1038;
--panel:#2a0f33; --panel-2:#371345;
--pink:#FF2D78; --magenta:#CC0066; --gold:#FFD700;
--text:#ffe6f3; --text-dim:#c79bb8; --white:#ffffff;
--glow-pink:0 0 12px rgba(255,45,120,.7),0 0 24px rgba(204,0,102,.5);
--glow-gold:0 0 12px rgba(255,215,0,.8),0 0 26px rgba(255,215,0,.5);
--glow-white:0 0 10px rgba(255,255,255,.9),0 0 22px rgba(255,255,255,.6);
--radius:18px; --card-w:320px;
--id-purple:#663399; --id-blue:#2638b3; --id-pink:#e925c2;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
font-family:"Segoe UI",system-ui,Arial,sans-serif;
color:var(--text);
background:
radial-gradient(900px 500px at 15% -5%,rgba(255,45,120,.16),transparent 60%),
radial-gradient(900px 600px at 90% 0%,rgba(204,0,102,.18),transparent 55%),
radial-gradient(700px 700px at 50% 110%,rgba(155,89,182,.14),transparent 60%),
var(--bg-0);
min-height:100vh;
}
a{ color:var(--pink); text-decoration:none; }
a:hover{ text-decoration:underline; text-shadow:var(--glow-pink); }
.wrap{ max-width:1200px; margin:0 auto; padding:24px 18px 80px; }
.wide{ max-width:1500px; }

/* ---------- Headers / typography ---------- */
.brand{ display:flex; align-items:center; gap:12px; }
.brand .heart{ width:44px; height:44px; display:grid; place-items:center; font-size:26px; line-height:1; color:#fff; }
.brand .heart svg{ display:block; width:44px; height:44px; }
.brand h1{ font-size:1.35rem; letter-spacing:.32em; margin:0; font-weight:800; text-transform:uppercase; text-shadow:var(--glow-pink); }
.topbar{ display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:18px; flex-wrap:wrap; }
.display-title{ font-size:clamp(2.4rem,7vw,5rem); font-weight:900; letter-spacing:.04em; text-transform:uppercase; line-height:1; margin:6px 0; color:#fff; text-shadow:0 0 18px rgba(255,45,120,.9),0 0 38px rgba(204,0,102,.6),3px 3px 0 var(--magenta); }
.eyebrow{ color:var(--gold); letter-spacing:.4em; font-weight:700; text-transform:uppercase; font-size:.8rem; text-shadow:0 0 8px rgba(255,215,0,.5); }
.subtext{ color:var(--text-dim); font-weight:600; }
.hearts-row{ color:var(--gold); letter-spacing:.6em; opacity:.8; margin:8px 0; }

/* ---------- Panels ---------- */
.panel{ background:linear-gradient(160deg,rgba(255,45,120,.10),rgba(40,12,50,.85)); border:1px solid rgba(255,45,120,.35); border-radius:24px; padding:26px; margin-bottom:22px; box-shadow:inset 0 0 30px rgba(255,45,120,.08),0 6px 26px rgba(0,0,0,.5); }
.hero{ position:relative; overflow:hidden; }

/* ---------- Buttons ---------- */
.btn{ cursor:pointer; border:none; border-radius:999px; padding:12px 22px; font-weight:800; letter-spacing:.04em; font-size:.95rem; color:#fff; background:linear-gradient(90deg,var(--magenta),var(--pink)); box-shadow:var(--glow-pink); transition:transform .15s,box-shadow .15s,opacity .15s; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 0 18px rgba(255,45,120,.9),0 0 36px rgba(204,0,102,.7); }
.btn:active{ transform:translateY(0); }
.btn:disabled{ opacity:.4; cursor:not-allowed; box-shadow:none; }
.btn-ghost{ background:transparent; border:1px solid rgba(255,45,120,.5); box-shadow:none; color:var(--text); padding:9px 16px; font-size:.85rem; }
.btn-ghost:hover{ background:rgba(255,45,120,.12); box-shadow:var(--glow-pink); }
.btn-sm{ padding:8px 14px; font-size:.8rem; }
.btn-gold{ background:linear-gradient(90deg,#b8860b,var(--gold)); color:#2a0f33; box-shadow:var(--glow-gold); }
.btn-danger{ background:linear-gradient(90deg,#5e0d23,#a01540); }
.btn-grey{ background:linear-gradient(90deg,#3a3a3a,#555); box-shadow:none; }

/* ---------- Forms ---------- */
.field{ margin-bottom:20px; }
.field label.lbl{ display:block; font-weight:800; letter-spacing:.06em; text-transform:uppercase; font-size:.82rem; margin-bottom:6px; color:#fff; text-shadow:0 0 6px rgba(255,45,120,.4); }
.hint{ display:block; color:var(--text-dim); font-size:.8rem; margin-bottom:8px; }
input[type=text],input[type=password],textarea,select{ width:100%; padding:12px 14px; border-radius:12px; font-size:.95rem; color:var(--text); background:rgba(20,7,26,.7); border:1px solid rgba(255,45,120,.4); outline:none; transition:border-color .15s,box-shadow .15s; font-family:inherit; }
textarea{ min-height:90px; resize:vertical; }
input:focus,textarea:focus,select:focus{ border-color:var(--pink); box-shadow:var(--glow-pink); }
select option{ background:#240d2c; color:var(--text); }
.checkgrid{ display:grid; gap:8px; }
.cols-2{ grid-template-columns:repeat(2,1fr); }
.cols-4{ grid-template-columns:repeat(4,1fr); }
@media(max-width:700px){ .cols-4{ grid-template-columns:repeat(2,1fr); } }
.checkitem{ display:flex; align-items:center; gap:8px; font-size:.88rem; color:var(--text); cursor:pointer; padding:4px 0; }
.checkitem input{ width:18px; height:18px; accent-color:var(--pink); cursor:pointer; }
.consent-box{ display:flex; gap:12px; align-items:flex-start; background:rgba(255,45,120,.08); border:1px solid rgba(255,45,120,.3); border-radius:12px; padding:14px; }
.consent-box input{ width:22px; height:22px; accent-color:var(--pink); margin-top:2px; }

/* ---------- Password visibility toggle ---------- */
.pw-input-wrap{
  position:relative;
  display:flex;
  align-items:center;
}
.pw-input-wrap input{
  flex:1;
  padding-right:44px;
}
.pw-toggle{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  background:none;
  border:none;
  cursor:pointer;
  font-size:1.1rem;
  color:var(--text-dim);
  padding:4px 6px;
  line-height:1;
  transition:color .15s;
  display:flex;
  align-items:center;
  justify-content:center;
}
.pw-toggle:hover{ color:var(--pink); }
.pw-toggle:focus{ outline:none; }

/* ---------- Accordion (intake page — wrapper pattern) ---------- */
.accordion{ border:1px solid rgba(255,45,120,.4); border-radius:12px; overflow:hidden; }
.accordion-head{ display:flex; justify-content:space-between; align-items:center; padding:12px 14px; cursor:pointer; background:rgba(255,45,120,.1); }
.accordion-head .sub{ color:var(--text-dim); font-size:.8rem; font-weight:600; }
.accordion-head .chev{ transition:transform .2s; }
.accordion.open .accordion-head .chev{ transform:rotate(180deg); }
.accordion-body{ display:none; padding:14px; }
.accordion.open .accordion-body{ display:block; }

/* ---------- Accordion (admin page — sibling toggle pattern) ---------- */
.accordion-head[data-acc]{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 18px; cursor:pointer;
  background:rgba(255,45,120,.12);
  border:1px solid rgba(255,45,120,.38);
  border-radius:12px;
  font-weight:800; font-size:1rem; letter-spacing:.06em; text-transform:uppercase;
  color:#fff; text-shadow:0 0 6px rgba(255,45,120,.4);
  transition:background .15s;
  user-select:none;
}
.accordion-head[data-acc]:hover{ background:rgba(255,45,120,.22); }
.accordion-head[data-acc] .acc-arrow{ font-size:.8rem; transition:transform .2s; display:inline-block; }
.accordion > .accordion-head[data-acc]{
  border:none;
  border-radius:0;
  margin-top:0;
}
.accordion-body{
  display:none;
  padding:20px 18px 24px;
  border:1px solid rgba(255,45,120,.25);
  border-top:none;
  border-radius:0 0 12px 12px;
  background:rgba(20,7,26,.45);
  margin-bottom:4px;
}
.accordion-body.open{ display:block; }
.accordion-body.open ~ .accordion-head[data-acc] .acc-arrow,
.accordion-head[data-acc]:has(+ .accordion-body.open) .acc-arrow{ transform:rotate(180deg); }

/* ---------- Admin general ---------- */
.admin-intro{ color:var(--text-dim); font-size:.9rem; margin:0 0 14px; }
.admin-status{ min-height:1.4em; font-size:.88rem; font-weight:700; margin-bottom:10px; border-radius:8px; padding:0 4px; }
.admin-status.ok{ color:#aef5c8; }
.admin-status.warn{ color:var(--gold); }
.admin-status.err{ color:#ffb3ac; }
.admin-table{ width:100%; border-collapse:collapse; margin-bottom:14px; }
.admin-table th{ text-align:left; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--text-dim); border-bottom:1px solid rgba(255,45,120,.3); padding:6px 10px; }
.admin-table td{ padding:8px 10px; border-bottom:1px solid rgba(255,255,255,.06); font-size:.9rem; }
.admin-actions{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.err-msg{ color:#ffb3ac; font-size:.82rem; font-weight:700; margin-top:6px; display:none; }
.err-msg.show{ display:block; }

/* ---------- Password admin section ---------- */
.pw-admin-section{
  background:rgba(255,45,120,.06);
  border:1px solid rgba(255,45,120,.25);
  border-radius:14px;
  padding:18px 20px;
  margin-bottom:20px;
}
.pw-admin-label{
  margin:0 0 12px;
  font-size:.85rem;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#fff;
  text-shadow:0 0 6px rgba(255,45,120,.4);
}
.pw-current-row{
  display:flex;
  gap:8px;
  align-items:center;
  margin-bottom:14px;
}
.pw-current-row .pw-readonly{
  flex:1;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,45,120,.3);
  color:var(--text);
  font-family:monospace;
  font-size:.95rem;
  letter-spacing:.04em;
  cursor:default;
  width:auto;
}
.pw-current-row .btn-sm{
  flex-shrink:0;
  font-size:1rem;
  padding:8px 12px;
}
.pw-admin-fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 16px;
}
.pw-admin-fields label{
  display:flex;
  flex-direction:column;
  gap:5px;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--text-dim);
}
.pw-admin-fields label input{
  width:100%;
  margin:0;
}
.pw-admin-fields .err-msg{
  grid-column:1 / -1;
}
@media(max-width:560px){
  .pw-admin-fields{ grid-template-columns:1fr; }
  .pw-current-row{ flex-wrap:wrap; }
  .pw-current-row .pw-readonly{ width:100%; }
}

/* ---------- Messages ---------- */
.msg{ padding:14px 18px; border-radius:12px; margin-top:16px; font-weight:700; display:none; }
.msg.show{ display:block; }
.msg.ok{ background:rgba(46,204,113,.15); border:1px solid #2ecc71; color:#aef5c8; }
.msg.err{ background:rgba(231,76,60,.15); border:1px solid #e74c3c; color:#ffb3ac; }

/* ---------- Summary tiles ---------- */
.tiles{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:20px; }
@media(max-width:700px){ .tiles{ grid-template-columns:repeat(2,1fr); } }
.tile{ background:linear-gradient(160deg,rgba(255,45,120,.12),rgba(40,12,50,.8)); border:1px solid rgba(255,45,120,.35); border-radius:18px; padding:18px 22px; box-shadow:inset 0 0 20px rgba(255,45,120,.07); }
.tile .num{ font-size:2.6rem; font-weight:900; line-height:1; color:#fff; text-shadow:var(--glow-pink); }
.tile .cap{ color:var(--pink); font-weight:800; letter-spacing:.05em; margin-top:4px; }
.tile-link{ display:block; text-decoration:none; cursor:pointer; transition:transform .15s, box-shadow .15s, border-color .15s; }
.tile-link:hover{ transform:translateY(-3px); border-color:rgba(255,45,120,.75); box-shadow:0 0 18px rgba(255,45,120,.35),inset 0 0 20px rgba(255,45,120,.1); text-decoration:none; }
.tile-link:hover .num{ text-shadow:0 0 18px rgba(255,45,120,1),0 0 32px rgba(204,0,102,.8); }
.tile-link:active{ transform:translateY(0); }

/* ---------- Filter row ---------- */
.filters{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media(max-width:900px){ .filters{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .filters{ grid-template-columns:1fr; } }
.filtcol .flbl{ font-size:.72rem; letter-spacing:.12em; font-weight:800; color:var(--text-dim); text-transform:uppercase; margin-bottom:6px; }
.dropdown{ position:relative; }
.dropdown-toggle{ width:100%; text-align:left; display:flex; justify-content:space-between; align-items:center; padding:12px 14px; border-radius:12px; background:rgba(20,7,26,.7); border:1px solid rgba(255,45,120,.4); color:var(--text); cursor:pointer; font-weight:700; }
.dropdown-menu{ display:none; position:absolute; z-index:40; top:calc(100% + 6px); left:0; right:0; max-height:260px; overflow:auto; background:#240d2c; border:1px solid rgba(255,45,120,.5); border-radius:12px; padding:10px; box-shadow:0 10px 30px rgba(0,0,0,.6); }
.dropdown.open .dropdown-menu{ display:block; }
.dropdown-menu .all-toggle{ border-bottom:1px solid rgba(255,45,120,.3); margin-bottom:6px; padding-bottom:8px; font-weight:800; color:#fff; }
.toggle-row{ display:flex; gap:18px; flex-wrap:wrap; align-items:center; margin-top:16px; }
.toggle-row .checkitem{ background:rgba(255,45,120,.08); border:1px solid rgba(255,45,120,.3); padding:8px 14px; border-radius:999px; }

/* ---------- Card groups ---------- */
.group{ margin-top:30px; }
.group-head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.group-head h2{ margin:0; font-size:1.3rem; letter-spacing:.18em; text-transform:uppercase; color:#fff; text-shadow:var(--glow-pink); }
.group-head .count{ background:var(--magenta); color:#fff; border-radius:999px; padding:2px 12px; font-weight:800; box-shadow:var(--glow-pink); }

.card-rail{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; padding:6px 2px 18px; }

/* ---------- Card ---------- */
.card{ width:100%; border-radius:var(--radius); padding:16px; position:relative; background:#2a0f33; color:var(--text); transition:transform .2s,box-shadow .2s,filter .2s; border:2px solid transparent; overflow:hidden; }
.card:hover{ transform:translateY(-3px); }

.card .grad{ position:absolute; inset:0; border-radius:inherit; z-index:0; opacity:.85; overflow:hidden; }
.card .grad.has-sym::after{
content:attr(data-sym);
position:absolute; right:-10px; bottom:-24px;
font-size:180px; line-height:1;
color:rgba(255,255,255,.16); pointer-events:none;
font-family:"Segoe UI Symbol","Noto Sans Symbols2",sans-serif;
}

.card .grad.sym-nb::after{
right:-4px;
bottom:-8px;
font-size:132px;
line-height:.9;
font-family:"Segoe UI Symbol","Noto Sans Symbols2",sans-serif;
}

.card .inner{ position:relative; z-index:1; }
.card .row{ display:flex; justify-content:space-between; align-items:flex-start; gap:8px; }
.badge{ display:inline-block; padding:3px 12px; border-radius:999px; font-size:.7rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; background:rgba(0,0,0,.55); color:#fff; }

/* ---------- Stars ---------- */
.stars{ display:flex; gap:6px; align-items:center; min-height:34px; }
.star{ font-size:1.9rem; line-height:1; animation:sparkle 2.2s ease-in-out infinite; }
.star-white{ color:#fff; text-shadow:0 0 8px #fff,0 0 16px #ff9ec4,0 0 26px #ff2d78; }
.star-gold{ color:var(--gold); text-shadow:0 0 8px #fff6b0,0 0 16px var(--gold),0 0 28px #ffae00; }
@keyframes sparkle{
0%,100%{ transform:scale(1) rotate(0deg); filter:brightness(1); }
50%{ transform:scale(1.18) rotate(8deg); filter:brightness(1.5); }
}

.uname{ font-size:1.35rem; font-weight:900; margin:8px 0 6px; color:#fff; word-break:break-word; display:inline-block; background:rgba(15,5,20,.78); padding:4px 10px; border-radius:8px; }
.kv{ margin:6px 0; font-size:.84rem; line-height:1.4; background:rgba(15,5,20,.72); padding:6px 9px; border-radius:8px; word-break:break-word; }
.kv b{ color:#fff; }
.kv .val{ color:rgba(255,255,255,.95); }
.kv a{ color:#ff9ec4; font-weight:700; }

.kv.ident-purple{ background:var(--id-purple); }
.kv.ident-blue{ background:var(--id-blue); }
.kv.ident-pink{ background:var(--id-pink); }
.kv.ident-purple b,.kv.ident-blue b,.kv.ident-pink b{ color:#fff; }
.kv.ident-purple .val,.kv.ident-blue .val,.kv.ident-pink .val{ color:#fff; }

.notes{ background:rgba(0,0,0,.4); border-radius:10px; padding:8px 10px; font-size:.82rem; margin:8px 0; }
.card-actions{ display:flex; gap:8px; flex-wrap:wrap; margin:12px 0 8px; }

/* ---------- Card checkboxes ---------- */
.card-checks{ display:grid; grid-template-columns:1fr 1fr; gap:10px 14px; align-items:center; border-top:1px solid rgba(255,255,255,.18); padding-top:12px; margin-top:4px; }
.card-checks .checkitem{ display:flex; align-items:center; gap:8px; font-size:.85rem; line-height:1.2; color:#fff; margin:0; padding:0; min-height:22px; }
.card-checks .checkitem input[type=checkbox]{ width:18px; height:18px; min-width:18px; flex:0 0 18px; margin:0; accent-color:var(--pink); cursor:pointer; }

@media(max-width:560px){
.card-checks{ grid-template-columns:1fr; }
}

/* border / glows by status */
.card.st-open{ border:2px solid transparent; animation:rainbow 4s linear infinite; }
.card.st-claimed{ border-color:transparent; box-shadow:0 4px 18px rgba(0,0,0,.5); }
.card.st-cumplete{ border-color:transparent; box-shadow:0 4px 18px rgba(0,0,0,.5); }

.card.st-open.nominated{
border-color:rgba(255,215,0,.8);
box-shadow:var(--glow-gold);
animation:none;
}

.card.st-claimed.nominated{
border-color:rgba(255,215,0,.8);
box-shadow:var(--glow-gold);
}

.card.st-cumplete.nominated{
border-color:rgba(255,215,0,.8);
box-shadow:var(--glow-gold);
}

.card.st-rejected{ border-color:#5e0d23; box-shadow:0 0 10px rgba(94,13,35,.6); filter:saturate(.35) brightness(.8); }

@keyframes rainbow{
0%{ box-shadow:0 0 14px #ff2d78; border-color:#ff2d78; }
20%{ box-shadow:0 0 14px #ffd700; border-color:#ffd700; }
40%{ box-box:0 0 14px #2ecc71; border-color:#2ecc71; }
60%{ box-shadow:0 0 14px #5dade2; border-color:#5dade2; }
80%{ box-shadow:0 0 14px #9b59b6; border-color:#9b59b6; }
100%{ box-shadow:0 0 14px #ff2d78; border-color:#ff2d78; }
}

/* ============================================================
FINAL SACRIFICE
============================================================ */
.card.final{
background:linear-gradient(135deg,#7a5200 0%,#b8860b 18%,#ffd700 42%,#fff3b0 50%,#ffd700 58%,#b8860b 82%,#7a5200 100%);
background-size:280% 280%;
animation:winnerShimmer 6s ease-in-out infinite, winnerPulse 2.6s ease-in-out infinite;
border:3px solid #fff3b0!important;
box-shadow:0 0 22px rgba(255,215,0,.85),0 0 48px rgba(255,170,0,.6),inset 0 0 40px rgba(255,255,255,.25)!important;
color:#2a0f33;
}
.card.final .grad{ display:none; }
.card.final .uname{ background:rgba(42,15,51,.82); color:#ffe98a; box-shadow:0 0 10px rgba(0,0,0,.4); }
.card.final .badge{ background:#2a0f33; color:var(--gold); }
.card.final .kv{ background:rgba(255,255,255,.62); }
.card.final .kv b{ color:#2a0f33; }
.card.final .kv .val{ color:#3a1a10; }
.card.final .kv a{ color:#8a1452; }
.card.final .kv.ident-purple{ background:var(--id-purple); }
.card.final .kv.ident-blue{ background:var(--id-blue); }
.card.final .kv.ident-pink{ background:var(--id-pink); }
.card.final .kv.ident-purple .val,.card.final .kv.ident-blue .val,.card.final .kv.ident-pink .val{ color:#fff; }
.card.final .kv.ident-purple b,.card.final .kv.ident-blue b,.card.final .kv.ident-pink b{ color:#fff; }
.card.final .notes{ background:rgba(0,0,0,.18); color:#2a0f33; }
.card.final .card-checks{ border-color:rgba(0,0,0,.3); }
.card.final .card-checks .checkitem{ color:#2a0f33; font-weight:700; }
.card.final .star-white{ color:#fff; }

.winner-crown{
position:absolute; top:-6px; left:50%; transform:translateX(-50%);
z-index:3; font-size:2.6rem; line-height:1;
filter:drop-shadow(0 0 10px rgba(255,215,0,.95)) drop-shadow(0 0 18px rgba(255,140,0,.7));
animation:crownBob 2.4s ease-in-out infinite;
pointer-events:none;
}
@keyframes winnerShimmer{ 0%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } 100%{ background-position:0% 50%; } }
@keyframes winnerPulse{ 0%,100%{ box-shadow:0 0 22px rgba(255,215,0,.85),0 0 48px rgba(255,170,0,.6),inset 0 0 40px rgba(255,255,255,.25); } 50%{ box-shadow:0 0 34px rgba(255,215,0,1),0 0 70px rgba(255,170,0,.85),inset 0 0 55px rgba(255,255,255,.4); } }
@keyframes crownBob{ 0%,100%{ transform:translateX(-50%) translateY(0) rotate(-4deg); } 50%{ transform:translateX(-50%) translateY(-5px) rotate(4deg); } }

.card.blacklisted .grad{ display:none; }
.card.blacklisted{ background:#222!important; border-color:#444!important; box-shadow:none!important; filter:grayscale(.7) brightness(.7)!important; color:#bbb; animation:none!important; }
.card.blacklisted .uname{ color:#ddd; }

/* ---------- Overlays / modals ---------- */
.overlay{ position:fixed; inset:0; background:rgba(10,4,14,.82); backdrop-filter:blur(4px); display:none; align-items:center; justify-content:center; z-index:100; padding:20px; }
.overlay.show{ display:flex; }
.modal{ width:min(460px,100%); background:linear-gradient(160deg,#371345,#240d2c); border:1px solid rgba(255,45,120,.5); border-radius:20px; padding:26px; box-shadow:0 0 30px rgba(255,45,120,.4),0 20px 60px rgba(0,0,0,.7); }
.modal h3{ margin:0 0 14px; letter-spacing:.06em; color:#fff; text-shadow:var(--glow-pink); }
.modal .modal-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:18px; }
.pw-overlay{ position:fixed; inset:0; background:rgba(10,4,14,.82); backdrop-filter:blur(4px); display:none; align-items:center; justify-content:center; z-index:100; padding:20px; }
.pw-overlay.show{ display:flex; }
.pw-overlay .modal{ text-align:center; }
.pw-overlay .heart{ margin:0 auto 14px; width:76px; height:76px; display:grid; place-items:center; font-size:52px; }
.pw-overlay .heart svg{ display:block; width:76px; height:76px; }
#adminPwBtn{ margin-top:12px; }

/* ---------- Confirm modal admin password block (Issue #31) ---------- */
.confirm-admin-pw-wrap{
  margin-top:14px;
  padding:14px 16px;
  background:rgba(255,45,120,.07);
  border:1px solid rgba(255,45,120,.3);
  border-radius:12px;
}
.confirm-admin-pw-wrap .field{
  margin-bottom:0;
}
.confirm-admin-pw-wrap .lbl{
  display:block;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.75rem;
  margin-bottom:6px;
  color:var(--text-dim);
}
.confirm-admin-pw-err{
  margin-top:8px!important;
  padding:8px 12px!important;
  font-size:.8rem!important;
}
.confirm-note-wrap{
  margin-top:14px;
}
.confirm-note-wrap .field{
  margin-bottom:0;
}
.confirm-note-wrap textarea{
  min-height:70px;
}
.confirm-note-err{
  margin-top:8px!important;
  padding:8px 12px!important;
  font-size:.8rem!important;
}

/* utility */
.spacer{ flex:1; }
.muted{ color:var(--text-dim); }
.center{ text-align:center; }

/* =============================================================
   CHECK-IN BAR (Feature 1 — Issue #17)
   ============================================================= */
.checkin-bar{
  margin-top:14px;
  padding:8px 14px;
  background:rgba(255,45,120,.07);
  border:1px solid rgba(255,45,120,.3);
  border-radius:12px;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:10px;
  max-width:50%;
  width:fit-content;
  min-width:320px;
}

.checkin-select-wrap{
  display:flex;
  flex:1;
  gap:10px;
  align-items:center;
}
.checkin-select{
  flex:1;
  min-width:160px;
  width:auto;
  padding:7px 12px;
  border-radius:10px;
  background:rgba(20,7,26,.8);
  border:1px solid rgba(255,45,120,.45);
  color:var(--text);
  font-size:.88rem;
  font-weight:600;
  cursor:pointer;
  transition:border-color .15s,box-shadow .15s;
}
.checkin-select:focus{
  border-color:var(--pink);
  box-shadow:var(--glow-pink);
  outline:none;
}
.checkin-select option{ background:#240d2c; color:var(--text); }

.checkin-active{
  display:flex;
  flex:1;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.checkin-status{
  font-size:.9rem;
  font-weight:700;
  color:var(--text);
  letter-spacing:.02em;
}
.checkin-status strong{
  color:var(--pink);
  text-shadow:var(--glow-pink);
  font-size:.95rem;
}

.checkin-bar.is-active{
  border-color:rgba(255,45,120,.65);
  box-shadow:0 0 14px rgba(255,45,120,.25),inset 0 0 18px rgba(255,45,120,.07);
  animation:checkinPulse 3s ease-in-out infinite;
}
@keyframes checkinPulse{
  0%,100%{ box-shadow:0 0 14px rgba(255,45,120,.25),inset 0 0 18px rgba(255,45,120,.07); }
  50%{ box-shadow:0 0 26px rgba(255,45,120,.45),inset 0 0 28px rgba(255,45,120,.12); }
}

@media(max-width:760px){
  .checkin-bar{ max-width:100%; width:100%; }
}
@media(max-width:560px){
  .checkin-bar{ flex-wrap:wrap; }
  .checkin-select-wrap{ flex-direction:column; align-items:stretch; width:100%; }
  .checkin-select{ width:100%; }
  .checkin-active{ flex-direction:column; align-items:flex-start; }
}

/* =============================================================
   RAIDER PROFILE MODAL (Feature 2 — Register / View-Edit)
   ============================================================= */

.modal-wide{
  width:min(860px,96vw);
  display:grid;
  grid-template-columns:1fr 320px;
  gap:0 28px;
  align-items:start;
}
.modal-wide h3{ grid-column:1 / -1; }
.modal-wide .modal-form-col{
  max-height:72vh;
  overflow-y:auto;
  padding-right:8px;
}
.modal-wide .modal-preview-col{
  position:sticky;
  top:0;
}
.modal-wide .modal-actions{ grid-column:1 / -1; }

.modal-wide .modal-form-col::-webkit-scrollbar{ width:5px; }
.modal-wide .modal-form-col::-webkit-scrollbar-track{ background:transparent; }
.modal-wide .modal-form-col::-webkit-scrollbar-thumb{ background:rgba(255,45,120,.4); border-radius:4px; }

.field-hint{
  display:block;
  font-size:.76rem;
  color:var(--text-dim);
  font-style:italic;
  margin-top:3px;
  margin-bottom:6px;
}

input[readonly]{ opacity:.6; cursor:not-allowed; border-style:dashed; }

/* =============================================================
   RAIDER CARD PREVIEW (inside modal-wide)
   ============================================================= */
.raider-card-preview{
  background:linear-gradient(160deg,rgba(255,45,120,.18),rgba(40,12,50,.92));
  border:1px solid rgba(255,45,120,.5);
  border-radius:var(--radius);
  padding:18px 16px;
  box-shadow:0 0 18px rgba(255,45,120,.2),inset 0 0 20px rgba(255,45,120,.06);
  min-height:160px;
}
.rcp-label{ font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800; color:var(--text-dim); margin-bottom:10px; }
.rcp-name{ font-size:1.25rem; font-weight:900; color:#fff; text-shadow:var(--glow-pink); word-break:break-word; margin-bottom:6px; }
.rcp-meta{ font-size:.82rem; font-weight:700; color:var(--pink); letter-spacing:.06em; margin-bottom:10px; }
.rcp-row{ font-size:.82rem; color:var(--text); background:rgba(15,5,20,.65); border-radius:8px; padding:5px 8px; margin-bottom:5px; line-height:1.4; word-break:break-word; }
.rcp-row b{ color:#fff; }
.rcp-tagline{ font-size:.8rem; font-style:italic; color:var(--text-dim); border-top:1px solid rgba(255,45,120,.25); padding-top:8px; margin-top:8px; word-break:break-word; }

@media(max-width:700px){
  .modal-wide{ grid-template-columns:1fr; }
  .modal-wide .modal-preview-col{ position:static; margin-top:16px; }
  .modal-wide .modal-form-col{ max-height:none; overflow-y:visible; padding-right:0; }
}

/* Floating return-to-top button */
.back-to-top{
  position:fixed; right:24px; bottom:24px; z-index:60;
  width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; line-height:1; color:var(--white); cursor:pointer;
  background:linear-gradient(135deg,var(--pink),var(--magenta));
  border:1px solid rgba(255,45,120,.6); box-shadow:var(--glow-pink);
  opacity:0; visibility:hidden; transform:translateY(12px);
  transition:opacity .25s ease,transform .25s ease,visibility .25s ease,filter .2s ease;
}
.back-to-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover{ filter:brightness(1.15); transform:translateY(-2px); }
.back-to-top:active{ transform:translateY(0) scale(.95); }
.back-to-top:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
@media (max-width:520px){ .back-to-top{ right:16px; bottom:16px; width:46px; height:46px; font-size:1.3rem; } }
@media (prefers-reduced-motion:reduce){ .back-to-top{ transition:opacity .2s ease,visibility .2s ease; transform:none; } .back-to-top.show{ transform:none; } }

/* =============================================================
   CLAIM CONFIRMATION MODAL (Issue #57)
   ============================================================= */

.claim-confirm-modal{
  width:min(520px,100%);
  position:relative;
  max-height:88vh;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,45,120,.4) transparent;
}
.claim-confirm-modal::-webkit-scrollbar{ width:5px; }
.claim-confirm-modal::-webkit-scrollbar-track{ background:transparent; }
.claim-confirm-modal::-webkit-scrollbar-thumb{ background:rgba(255,45,120,.4); border-radius:4px; }

/* X close button — top-right of modal */
.modal-close-x{
  position:absolute;
  top:14px;
  right:16px;
  background:none;
  border:none;
  color:var(--text-dim);
  font-size:1.2rem;
  line-height:1;
  cursor:pointer;
  padding:4px 6px;
  border-radius:6px;
  transition:color .15s, background .15s;
  z-index:2;
}
.modal-close-x:hover{
  color:#fff;
  background:rgba(255,45,120,.2);
}
.modal-close-x:focus-visible{
  outline:2px solid var(--pink);
  outline-offset:2px;
}

/* Sub-heading below the Claimed! title */
.claim-confirm-sub{
  margin:0 0 14px;
  font-size:.88rem;
}

/* Card rendered inside the modal:
   - deep dark diagonal gradient matching intake page vibe
   - links remain clickable
   - no hover lift */
#claimConfirmCard .card{
  width:100%;
  margin:0;
  box-sizing:border-box;
  cursor:default;
}
#claimConfirmCard .card:hover{
  transform:none !important;
}
/* Dark pink → dark purple → near-black diagonal gradient */
#claimConfirmCard .card .grad{
  background: linear-gradient(135deg, #3d0020 0%, #6b0040 25%, #4a005e 55%, #1a0a1e 100%) !important;
  opacity: 1 !important;
}

/* Cumplete + Cancel button row at the bottom of the claim confirm modal */
.claim-confirm-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(255,45,120,.25);
}
