/* BTC onboarding pages — brand tokens and shell copied from the main site */
:root{
  --ink:#0A1B3D;
  --ink-2:#0F2456;
  --chalk:#F7F7F2;
  --pink:#D9A727;
  --turf:#1F9D5C;
  --sand:#F0D896;
  --slate:#9FB0D6;
  --line: rgba(247,247,242,0.14);
  --red:#A61E2B;
  --red-soft:#E8828C;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--ink);
  color:var(--chalk);
  font-family:'Work Sans', sans-serif;
  overflow-x:hidden;
  min-height:100vh;
  display:flex; flex-direction:column;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}
h1,h2,h3{
  font-family:'Archivo Black', sans-serif;
  text-transform:uppercase;
  letter-spacing:0.01em;
  line-height:1.02;
}
.mono{ font-family:'JetBrains Mono', monospace; }
a{color:inherit; text-decoration:none;}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--pink);
  outline-offset:3px;
}
img{display:block; max-width:100%;}
[hidden]{display:none !important;}

/* ---------- NAV ---------- */
nav{
  position:sticky; top:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 6vw;
  background:linear-gradient(180deg, rgba(11,31,42,0.96), rgba(11,31,42,0.85));
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.brand{ display:flex; align-items:center; gap:12px; font-family:'Archivo Black', sans-serif; font-size:14px; letter-spacing:0.03em; }
.brand img{width:38px; height:38px; border-radius:50%; flex-shrink:0;}
@media (max-width:480px){ .brand{font-size:12px;} .brand img{width:32px; height:32px;} }
.nav-cta{
  background:var(--pink); color:var(--ink); padding:9px 18px; border-radius:2px; border:none; cursor:pointer;
  font-family:'Work Sans', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase;
  transition:transform 0.15s ease, background 0.2s; white-space:nowrap;
}
.nav-cta:hover{transform:translateY(-1px); background:#eec158;}
.nav-ghost{
  border:1px solid rgba(245,247,242,0.4); color:var(--chalk); background:transparent; padding:8px 14px; border-radius:2px; cursor:pointer;
  font-family:'Work Sans', sans-serif; font-size:12px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; white-space:nowrap;
}
.nav-ghost:hover{border-color:var(--pink);}

/* ---------- SHELL ---------- */
main{flex:1; padding:48px 6vw 80px;}
.wrap{max-width:720px; margin:0 auto;}
.wrap.wide{max-width:1100px;}
.eyebrow, .section-tag{
  font-family:'JetBrains Mono', monospace; color:var(--pink); font-size:12px; letter-spacing:0.16em;
  text-transform:uppercase; margin-bottom:14px; display:flex; align-items:center; gap:10px;
}
.eyebrow::before{content:""; width:22px; height:2px; background:var(--pink); display:inline-block;}
.page-title{font-size:clamp(30px,7vw,50px); margin-bottom:14px;}
.page-title .hl{color:var(--pink);}
.lede{color:var(--slate); font-size:16px; line-height:1.7; max-width:560px;}

.btn-primary{
  background:var(--pink); color:var(--ink); padding:15px 28px; border-radius:2px; border:none; cursor:pointer;
  font-family:'Work Sans', sans-serif; font-weight:700; font-size:14px; letter-spacing:0.05em; text-transform:uppercase;
  transition:transform 0.15s ease, box-shadow 0.2s, background 0.2s; display:inline-block; text-align:center;
}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(217,167,39,0.3); background:#eec158;}
.btn-primary:disabled{opacity:0.6; cursor:progress; transform:none; box-shadow:none;}
.btn-ghost{
  border:1px solid rgba(245,247,242,0.4); color:var(--chalk); background:transparent; padding:15px 24px; border-radius:2px; cursor:pointer;
  font-family:'Work Sans', sans-serif; font-weight:600; font-size:14px; letter-spacing:0.05em; text-transform:uppercase;
  transition:border-color 0.2s, background 0.2s; display:inline-block; text-align:center;
}
.btn-ghost:hover{border-color:var(--pink); background:rgba(217,167,39,0.12);}

/* ---------- FOOTER ---------- */
footer{
  padding:32px 6vw; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
}
.fbrand{display:flex; align-items:center; gap:12px; font-family:'Archivo Black', sans-serif; font-size:13px; letter-spacing:0.03em;}
.fbrand img{width:30px; height:30px; border-radius:50%;}
footer .fnote{color:var(--slate); font-size:13px;}
footer .fnote a{color:var(--pink);}

/* ---------- WIZARD ---------- */
.progress{margin:28px 0 30px;}
.progress-meta{display:flex; justify-content:space-between; gap:12px; font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--slate); margin-bottom:10px;}
.progress-meta .now{color:var(--pink);}
.progress-track{height:4px; background:var(--line); border-radius:2px; overflow:hidden;}
.progress-fill{height:100%; width:0; background:var(--pink); transition:width 0.3s ease;}

.card{border:1px solid var(--line); background:var(--ink-2); padding:32px; border-radius:2px;}
@media (max-width:560px){ .card{padding:22px 18px;} main{padding:28px 16px 60px;} nav{padding:12px 16px;} }
.step h2{font-size:clamp(22px,5vw,30px); margin-bottom:10px;}
.step .step-intro{color:var(--slate); font-size:15px; line-height:1.65; margin-bottom:26px;}
.step .step-intro strong{color:var(--chalk);}

.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:0 16px;}
@media (max-width:560px){ .grid-2{grid-template-columns:1fr;} }
.field{margin-bottom:18px;}
.field label, .field .label{
  display:block; font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--slate); margin-bottom:8px;
}
.field label .opt{color:rgba(159,176,214,0.6); text-transform:none; letter-spacing:0.02em;}
.field input, .field select, .field textarea{
  width:100%; background:transparent; border:1px solid var(--line); color:var(--chalk);
  padding:13px 14px; font-family:'Work Sans', sans-serif; font-size:16px; border-radius:2px; transition:border-color 0.2s;
}
.field textarea{min-height:88px; resize:vertical; line-height:1.5;}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--pink); outline:none;}
.field select option{background:var(--ink);}
.field input[type="date"]{color-scheme:dark;}
.field.invalid input, .field.invalid select, .field.invalid textarea{border-color:var(--red-soft);}
.field .hint{color:var(--slate); font-size:12px; margin-top:6px; line-height:1.5;}
.derived{display:flex; gap:10px; flex-wrap:wrap; margin:-4px 0 18px;}
.chip{font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; padding:6px 10px; border:1px solid rgba(217,167,39,0.4); color:var(--pink); border-radius:2px; background:rgba(217,167,39,0.06);}

.choice-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
@media (max-width:480px){ .choice-grid.two-up-mobile{grid-template-columns:1fr 1fr;} .choice-grid:not(.two-up-mobile){grid-template-columns:1fr;} }
.choice{
  text-align:left; background:var(--ink); border:1px solid var(--line); color:var(--chalk); border-radius:2px;
  padding:22px 20px; cursor:pointer; font-family:'Work Sans', sans-serif; transition:border-color 0.2s, background 0.2s;
  display:flex; flex-direction:column; gap:6px;
}
.choice:hover{border-color:rgba(217,167,39,0.6);}
.choice .ct{font-family:'Archivo Black', sans-serif; font-size:18px; text-transform:uppercase;}
.choice .cd{color:var(--slate); font-size:13px; line-height:1.5;}
.choice.big{padding:30px 22px;}
.choice.big .ct{font-size:24px;}
.choice[aria-pressed="true"]{border-color:var(--pink); background:rgba(217,167,39,0.12);}
.choice[aria-pressed="true"] .ct{color:var(--pink);}
.toggle-row{display:flex; gap:12px;}
.toggle-row .choice{flex:1; align-items:center; padding:16px;}

.check{display:flex; gap:14px; align-items:flex-start; padding:18px; border:1px solid var(--line); background:var(--ink); border-radius:2px; margin-bottom:12px; cursor:pointer;}
.check input{width:22px; height:22px; accent-color:var(--pink); flex-shrink:0; margin-top:1px;}
.check .t{font-weight:600; font-size:15px;}
.check .d{color:var(--slate); font-size:13px; margin-top:4px; line-height:1.55;}
.check.invalid{border-color:var(--red-soft);}

.private-note{display:flex; gap:10px; align-items:flex-start; padding:14px 16px; border:1px solid rgba(217,167,39,0.35); background:rgba(217,167,39,0.06); border-radius:2px; font-size:13px; color:var(--chalk); line-height:1.55; margin-bottom:22px;}
.private-note .k{font-family:'JetBrains Mono', monospace; color:var(--pink); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; flex-shrink:0; padding-top:2px;}

.error-box{border:1px solid var(--red-soft); background:rgba(166,30,43,0.18); color:var(--chalk); padding:13px 16px; border-radius:2px; font-size:14px; line-height:1.5; margin-top:18px;}

.wizard-nav{display:flex; justify-content:space-between; gap:12px; margin-top:28px;}
.wizard-nav .btn-primary{margin-left:auto; min-width:150px;}

/* Club Code */
.code-count{font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--slate); margin-bottom:16px;}
.code-count strong{color:var(--pink);}
.code-list{display:flex; flex-direction:column; gap:10px;}
.code-sec{border:1px solid var(--line); background:var(--ink); border-radius:2px; overflow:hidden;}
.code-sec .head{display:flex; align-items:center; gap:14px; padding:16px 18px; width:100%; background:none; border:none; color:var(--chalk); text-align:left; font-family:'Work Sans', sans-serif; cursor:default;}
.code-sec .num{width:30px; height:30px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono', monospace; font-size:12px; flex-shrink:0; color:var(--slate);}
.code-sec .title{font-family:'Archivo Black', sans-serif; font-size:15px; text-transform:uppercase; letter-spacing:0.02em;}
.code-sec .sub{font-size:12px; color:var(--slate); font-family:'JetBrains Mono', monospace; letter-spacing:0.06em; text-transform:uppercase; margin-left:auto;}
.code-sec .body{padding:0 18px 18px 62px; color:var(--slate); font-size:14px; line-height:1.7;}
.code-sec .body ul{margin:0 0 16px 18px;}
.code-sec .body li{margin-bottom:6px;}
.code-sec .body strong{color:var(--chalk);}
.code-sec.locked{opacity:0.45;}
.code-sec.locked .sub::after{content:"Locked";}
.code-sec.active{border-color:var(--pink);}
.code-sec.active .num{border-color:var(--pink); color:var(--pink);}
.code-sec.done .num{background:var(--turf); border-color:var(--turf); color:var(--chalk);}
.code-sec.done .sub{color:var(--turf);}
.code-sec.done .sub::after{content:"Understood";}
.code-sec.done .head{cursor:pointer;}
.ack-btn{background:var(--pink); color:var(--ink); border:none; padding:12px 18px; border-radius:2px; font-family:'Work Sans', sans-serif; font-weight:700; font-size:13px; letter-spacing:0.05em; text-transform:uppercase; cursor:pointer;}
.ack-btn:hover{background:#eec158;}
@media (max-width:560px){ .code-sec .body{padding:0 16px 16px 16px;} .code-sec .sub{display:none;} }

/* Review */
.review{display:grid; grid-template-columns:minmax(120px, 34%) 1fr; border-top:1px solid var(--line);}
.review dt, .review dd{padding:12px 0; border-bottom:1px solid var(--line); font-size:14px; line-height:1.5;}
.review dt{font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--slate); padding-right:14px; padding-top:14px;}
.review dd{color:var(--chalk); overflow-wrap:anywhere; white-space:pre-line;}
.review .group{grid-column:1 / -1; font-family:'Archivo Black', sans-serif; text-transform:uppercase; font-size:13px; color:var(--pink); padding:20px 0 8px; border-bottom:1px solid var(--line); letter-spacing:0.04em;}
.review .group:first-child{padding-top:8px;}
.review .ok{color:var(--turf); font-weight:600;}

/* ---------- WELCOME ---------- */
.welcome-hero{
  text-align:center; border:1px solid var(--line); border-radius:2px; padding:44px 22px 40px;
  background: radial-gradient(ellipse 600px 320px at 50% 0%, rgba(217,167,39,0.18), transparent 70%), var(--ink-2);
}
.welcome-hero .eyebrow{justify-content:center;}
.welcome-hero h1{font-size:clamp(26px,6vw,42px); margin-bottom:26px;}
.player-code{
  font-family:'Archivo Black', sans-serif; font-size:clamp(46px, 16vw, 150px); line-height:0.95; color:var(--pink);
  letter-spacing:0.01em; word-break:keep-all; white-space:nowrap;
}
.code-label{font-family:'JetBrains Mono', monospace; font-size:13px; letter-spacing:0.12em; text-transform:uppercase; color:var(--chalk); margin-top:20px;}
.code-label .dim{color:var(--slate);}
.pack-head{margin:56px 0 22px;}
.pack-head h2{font-size:clamp(24px,5vw,34px);}
.pack{display:grid; grid-template-columns:repeat(3, 1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
@media (max-width:820px){ .pack{grid-template-columns:1fr;} }
.pack-card{background:var(--ink); padding:30px 26px; display:flex; flex-direction:column; gap:12px;}
.pack-card .n{font-family:'Archivo Black', sans-serif; font-size:40px; color:var(--pink); line-height:1;}
.pack-card h3{font-size:18px;}
.pack-card p{color:var(--slate); font-size:14px; line-height:1.65; flex:1;}
.pack-card .facts{display:flex; flex-direction:column; gap:8px; flex:1;}
.pack-card .fact{display:flex; gap:12px; font-size:14px; align-items:baseline;}
.pack-card .fact .k{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--pink); letter-spacing:0.06em; text-transform:uppercase; width:62px; flex-shrink:0;}
.pack-card .go{font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--pink); border:1px solid rgba(217,167,39,0.4); padding:10px 14px; border-radius:2px; align-self:flex-start; transition:background 0.2s, color 0.2s;}
.pack-card .go:hover{background:var(--pink); color:var(--ink);}
.members-strip{margin-top:1px; border:1px solid var(--line); background:var(--ink-2); padding:22px 26px; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;}
.members-strip .t{font-weight:600;}
.members-strip .d{color:var(--slate); font-size:13px; margin-top:4px;}

/* ---------- ADMIN ---------- */
.gate{max-width:440px; margin:8vh auto 0;}
.toolbar{display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin:22px 0 18px;}
.toolbar .search{flex:1 1 240px;}
.toolbar .search input{width:100%; background:transparent; border:1px solid var(--line); color:var(--chalk); padding:13px 14px; font-family:'Work Sans', sans-serif; font-size:16px; border-radius:2px;}
.toolbar .search input:focus{border-color:var(--pink); outline:none;}
.filters{display:flex; gap:8px; flex-wrap:wrap;}
.filter{background:transparent; border:1px solid var(--line); color:var(--slate); padding:9px 12px; border-radius:2px; font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; cursor:pointer;}
.filter[aria-pressed="true"]{border-color:var(--pink); color:var(--pink); background:rgba(217,167,39,0.08);}
.stats{font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--slate);}
.stats strong{color:var(--chalk);}

.ptable{width:100%; border-collapse:collapse; border:1px solid var(--line);}
.ptable th{text-align:left; font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--slate); font-weight:400; padding:12px 14px; border-bottom:1px solid var(--line); background:var(--ink-2);}
.ptable td{padding:14px; border-bottom:1px solid var(--line); font-size:14px; vertical-align:middle;}
.ptable tbody tr{cursor:pointer; transition:background 0.15s;}
.ptable tbody tr:hover, .ptable tbody tr:focus{background:var(--ink-2); outline:none;}
.ptable .code{font-family:'JetBrains Mono', monospace; color:var(--pink); font-weight:600; white-space:nowrap;}
.ptable .pname{font-weight:600;}
.ptable .meta{color:var(--slate); font-size:12px; margin-top:3px;}
.flag{display:inline-block; font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:0.08em; text-transform:uppercase; padding:4px 8px; border-radius:2px; margin:2px 4px 2px 0; white-space:nowrap;}
.flag.med{background:var(--red); color:var(--chalk); font-weight:600;}
.flag.nophoto{border:1px solid var(--sand); color:var(--sand);}
.flag.junior{border:1px solid var(--slate); color:var(--slate);}
@media (max-width:700px){
  .ptable thead{display:none;}
  .ptable, .ptable tbody, .ptable tr, .ptable td{display:block; width:100%;}
  .ptable tr{display:grid; grid-template-columns:auto 1fr; gap:4px 14px; padding:14px; border-bottom:1px solid var(--line);}
  .ptable td{padding:0; border:none;}
  .ptable td.c-code{grid-row:1 / span 2;}
  .ptable td.c-exp{display:none;}
  .ptable td.c-type{display:none;}
  .ptable td.c-flags{grid-column:2;}
}
.empty{padding:40px 20px; text-align:center; color:var(--slate); border:1px solid var(--line); border-top:none;}

.sheet-backdrop{position:fixed; inset:0; background:rgba(4,10,24,0.72); z-index:200; display:flex; justify-content:flex-end;}
.sheet{width:min(560px, 100%); height:100%; overflow-y:auto; background:var(--ink); border-left:1px solid var(--line); padding:26px 26px 60px;}
@media (max-width:560px){ .sheet{padding:20px 16px 60px;} }
.sheet-top{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:18px;}
.sheet .bigcode{font-family:'Archivo Black', sans-serif; font-size:34px; color:var(--pink); line-height:1;}
.sheet h2{font-size:22px; margin-top:8px;}
.sheet .flags{margin:10px 0 6px;}
.sheet .alert{border:1px solid var(--red-soft); background:rgba(166,30,43,0.2); padding:14px 16px; border-radius:2px; margin:14px 0 4px; font-size:14px; line-height:1.55;}
.sheet .alert .k{display:block; font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--red-soft); margin-bottom:6px;}
.sheet a.tel{color:var(--pink); font-weight:600;}
.close-btn{background:transparent; border:1px solid var(--line); color:var(--chalk); width:40px; height:40px; border-radius:2px; font-size:20px; cursor:pointer; flex-shrink:0;}
.close-btn:hover{border-color:var(--pink);}
