/* SESSIONATOR — vintage studio faceplate, built dark because the sheet is
   meant to feel like gear, not like a web form. */

:root{
  --ink:#0E0C0A; --panel:#171310; --panel-2:#1F1A15; --panel-3:#272019;
  --edge:#2E2720; --edge-hi:#3D342A;
  --cream:#F4EAD8; --cream-dim:#C6B9A4; --muted:#8A7E6E; --faint:#5E554A;
  --brass:#C9973F; --brass-dim:#8A6B31;
  --oxblood:#A03428; --amber:#FFB020; --green:#57B37D;
  --display:'Anton',Impact,'Haettenschweiler','Arial Narrow Bold',sans-serif;
  --label:'Barlow Condensed','Oswald',system-ui,sans-serif;
  --body:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --r:10px; --shadow:0 18px 44px rgba(0,0,0,.55);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--ink); color:var(--cream-dim);
  font:15px/1.6 var(--body);
  background-image:
    radial-gradient(1100px 620px at 50% -10%, rgba(201,151,63,.075), transparent 65%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 1px, transparent 1px 3px);
  min-height:100vh;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--brass)}

/* ---------------------------------------------------- shell */
.wrap{max-width:900px;margin:0 auto;padding:26px 18px 200px}
.masthead{text-align:center;padding:14px 0 24px}
.masthead img{margin:0 auto;width:min(430px,80vw)}
.tagline{
  font-family:var(--label);font-weight:600;font-size:12.5px;
  letter-spacing:.34em;text-transform:uppercase;color:var(--faint);
  margin:16px 0 0;
}

/* ---------------------------------------------------- progress rail */
.rail{display:flex;gap:5px;margin:0 0 22px}
.rail button{
  flex:1;background:var(--panel);border:1px solid var(--edge);color:var(--faint);
  border-radius:6px;padding:9px 4px 8px;cursor:pointer;font-family:var(--label);
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  transition:.18s; position:relative; overflow:hidden;
}
.rail button .n{display:block;font-family:var(--mono);font-size:14px;letter-spacing:0;margin-bottom:2px}
.rail button:hover:not(:disabled){border-color:var(--edge-hi);color:var(--muted)}
.rail button[aria-current="step"]{border-color:var(--brass);color:var(--cream);background:var(--panel-2)}
.rail button[aria-current="step"]::after{
  content:"";position:absolute;inset:auto 0 0 0;height:2px;background:var(--brass)
}
.rail button.done{color:var(--brass-dim);border-color:var(--brass-dim)}
.rail button:disabled{cursor:not-allowed;opacity:.45}
@media (max-width:620px){
  .rail button{font-size:0;padding:8px 3px;letter-spacing:0}
  .rail button .n{font-size:13px;margin:0}
}

/* ---------------------------------------------------- panels */
.panel{
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--edge);border-radius:var(--r);box-shadow:var(--shadow);
  padding:26px 24px;margin:0 0 18px;
}
.panel[hidden]{display:none}
.panel > h2{
  font-family:var(--display);font-weight:400;font-size:clamp(22px,4.4vw,30px);
  letter-spacing:.02em;color:var(--cream);margin:0 0 4px;text-transform:uppercase;
}
.panel > .lede{color:var(--muted);margin:0 0 22px;font-size:14px}
.sect-rule{
  height:1px;background:linear-gradient(90deg,var(--brass-dim),transparent);
  margin:26px 0 20px;border:0;
}

/* ---------------------------------------------------- fields */
.grid{display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid .full{grid-column:1/-1}
@media (max-width:600px){.grid,.grid.three{grid-template-columns:1fr}}

.field{display:flex;flex-direction:column;gap:6px;min-width:0}
label,.lbl{
  font-family:var(--label);font-size:11.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted);
}
label .req{color:var(--oxblood);margin-left:3px}
input,select,textarea{
  width:100%;background:var(--ink);color:var(--cream);
  border:1px solid var(--edge);border-radius:7px;padding:11px 12px;
  font:15px/1.4 var(--body);transition:border-color .15s,box-shadow .15s;
  -webkit-appearance:none;appearance:none;
}
select{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23C9973F' stroke-width='1.8' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:34px;
}
input[type=date]{padding-right:10px}
textarea{min-height:96px;resize:vertical;line-height:1.55}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--brass);box-shadow:0 0 0 3px rgba(201,151,63,.16);
}
input::placeholder,textarea::placeholder{color:var(--faint)}
input[aria-invalid="true"],select[aria-invalid="true"],textarea[aria-invalid="true"]{
  border-color:var(--oxblood);box-shadow:0 0 0 3px rgba(160,52,40,.18);
}
/* Checkboxes need their own box AND their own tick: the blanket
   `appearance:none` above removes the native control entirely. */
input[type=checkbox]{
  width:20px;height:20px;flex:0 0 auto;padding:0;cursor:pointer;
  border:1px solid var(--edge-hi);border-radius:5px;background:var(--ink);
  display:grid;place-content:center;transition:background .14s,border-color .14s;
}
input[type=checkbox]::before{
  content:"";width:12px;height:12px;background:#191307;transform:scale(0);
  transition:transform .13s cubic-bezier(.2,.9,.3,1.3);
  clip-path:polygon(14% 44%,0 59%,38% 100%,100% 22%,84% 7%,38% 68%);
}
input[type=checkbox]:checked{background:var(--brass);border-color:var(--brass)}
input[type=checkbox]:checked::before{transform:scale(1)}
input[type=checkbox]:hover:not(:checked){border-color:var(--brass-dim)}
input[type=checkbox]:focus-visible{outline:2px solid var(--brass);outline-offset:2px}

.err{color:#E8695A;font-size:12.5px;font-family:var(--label);letter-spacing:.06em;min-height:0}
.hint{color:var(--faint);font-size:12.5px}

/* ---------------------------------------------------- song cards */
.song{
  background:var(--panel);border:1px solid var(--edge);border-left:3px solid var(--brass-dim);
  border-radius:9px;padding:20px 18px;margin:0 0 14px;
}
.song-head{display:flex;align-items:center;gap:12px;margin:0 0 16px}
.song-no{
  font-family:var(--display);font-size:22px;color:var(--brass);line-height:1;
  background:var(--ink);border:1px solid var(--edge);border-radius:6px;
  padding:7px 11px 5px;min-width:44px;text-align:center;
}
.song-head h3{
  font-family:var(--label);font-size:14px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--cream-dim);margin:0;flex:1;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.kill{
  background:none;border:1px solid var(--edge);color:var(--faint);border-radius:6px;
  padding:6px 11px;cursor:pointer;font-family:var(--label);font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;transition:.15s;
}
.kill:hover{border-color:var(--oxblood);color:#E8695A}

/* ---------------------------------------------------- service picker */
.svc{display:grid;gap:9px;margin:0 0 4px}
.opt{
  display:flex;gap:12px;align-items:flex-start;padding:13px 14px;cursor:pointer;
  background:var(--ink);border:1px solid var(--edge);border-radius:8px;transition:.15s;
}
.opt:hover{border-color:var(--edge-hi)}
.opt input{margin:1px 0 0}
.opt.on{border-color:var(--brass);background:var(--panel-2)}
.opt .t{flex:1;min-width:0}
.opt .t b{
  display:block;color:var(--cream);font:600 14px/1.35 var(--body);letter-spacing:.01em;
}
.opt .t span{display:block;color:var(--faint);font-size:12.5px;margin-top:2px}
.opt .p{
  font-family:var(--mono);font-size:14px;color:var(--brass);white-space:nowrap;
  align-self:center;font-weight:600;
}
.opt .p.tbd{color:var(--muted);font-size:12px;letter-spacing:.1em}

/* ---------------------------------------------------- chips */
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 6px}
.chip{
  display:inline-flex;align-items:center;gap:7px;padding:7px 12px;cursor:pointer;
  background:var(--ink);border:1px solid var(--edge);border-radius:100px;
  font-family:var(--label);font-size:13px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);transition:.15s;user-select:none;
}
.chip:hover{border-color:var(--edge-hi);color:var(--cream-dim)}
.chip input{display:none}
.chip.on{background:var(--brass);border-color:var(--brass);color:#1A1509}
.chip::before{
  content:"";width:0;height:9px;margin-right:0;background:currentColor;
  transition:width .14s,margin-right .14s;
  clip-path:polygon(14% 44%,0 59%,38% 100%,100% 22%,84% 7%,38% 68%);
}
.chip.on::before{width:11px;margin-right:1px}

/* Picked world instruments read as selected too. */
.tag::before{
  content:"";width:10px;height:9px;background:var(--brass);flex:0 0 auto;
  clip-path:polygon(14% 44%,0 59%,38% 100%,100% 22%,84% 7%,38% 68%);
}
.picked{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0 0}
.tag{
  display:inline-flex;align-items:center;gap:8px;padding:6px 8px 6px 12px;
  background:var(--panel-3);border:1px solid var(--edge-hi);border-radius:100px;
  font-size:13px;color:var(--cream-dim);
}
.tag button{
  background:none;border:0;color:var(--faint);cursor:pointer;font-size:16px;
  line-height:1;padding:0 2px;
}
.tag button:hover{color:var(--oxblood)}

/* ---------------------------------------------------- warnings */
.warn{
  display:flex;gap:10px;padding:11px 13px;border-radius:7px;font-size:13px;
  background:rgba(160,52,40,.11);border:1px solid rgba(160,52,40,.4);color:#E9A79C;
  margin:10px 0 0;line-height:1.5;
}
.warn.amber{background:rgba(255,176,32,.09);border-color:rgba(255,176,32,.36);color:#EFC583}
.warn b{color:var(--cream)}
.warn[hidden]{display:none}

/* ---------------------------------------------------- uploads */
.drop{
  /* It's a <label>, which is inline by default — without this the dashed
     border fragments across line boxes instead of drawing one clean box. */
  display:block;
  border:2px dashed var(--edge-hi);border-radius:10px;padding:34px 20px;text-align:center;
  background:var(--ink);transition:.18s;cursor:pointer;
}
.drop:hover,.drop.over{border-color:var(--brass);background:var(--panel-2)}
.drop .big{
  font-family:var(--display);font-size:19px;color:var(--cream);text-transform:uppercase;
  letter-spacing:.03em;margin:0 0 6px;
}
.drop .sm{color:var(--faint);font-size:13px;margin:0}
.drop input{display:none}
.files{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px}
.file{
  display:flex;align-items:center;gap:12px;padding:11px 13px;background:var(--panel);
  border:1px solid var(--edge);border-radius:8px;font-size:13.5px;
}
.file.bad{border-color:rgba(160,52,40,.55);background:rgba(160,52,40,.08)}
.file.ok{border-color:rgba(87,179,125,.4)}
.file .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--cream)}
.file .sz{font-family:var(--mono);font-size:11.5px;color:var(--faint);white-space:nowrap}
.file .st{font-family:var(--label);font-size:11px;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.file .st.up{color:var(--brass)} .file .st.done{color:var(--green)} .file .st.fail{color:#E8695A}
.bar{height:3px;background:var(--edge);border-radius:2px;overflow:hidden;margin-top:7px}
.bar i{display:block;height:100%;background:var(--brass);width:0;transition:width .25s}

/* ---------------------------------------------------- review + totals */
.review{display:grid;gap:2px;margin:0 0 6px}
.line{
  display:flex;gap:14px;justify-content:space-between;padding:10px 0;
  border-bottom:1px solid var(--edge);font-size:14px;
}
.line .d{color:var(--cream-dim);min-width:0}
.line .d small{display:block;color:var(--faint);font-size:12px;margin-top:2px}
.line .v{font-family:var(--mono);color:var(--cream);white-space:nowrap;font-size:14px}
.line.sum{border-bottom:0;padding-top:15px;font-size:16px}
.line.sum .d{font-family:var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--cream)}
.line.sum .v{color:var(--brass);font-size:21px;font-weight:600}
.line.tbd .v{color:var(--amber);font-size:12px;letter-spacing:.12em;font-family:var(--label);text-transform:uppercase}

/* ---------------------------------------------------- terms */
.terms{
  max-height:280px;overflow-y:auto;background:var(--ink);border:1px solid var(--edge);
  border-radius:8px;padding:18px 20px;font-size:13.5px;line-height:1.62;color:var(--muted);
}
.terms h4{
  font-family:var(--label);font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--brass);margin:18px 0 5px;
}
.terms h4:first-child{margin-top:0}
.terms strong{color:var(--cream)}
.credit-box{
  background:var(--panel-3);border:1px solid var(--brass-dim);border-radius:8px;
  padding:15px 17px;margin:0 0 16px;
}
.credit-box .lbl{color:var(--brass);display:block;margin-bottom:8px}
.credit-box p{
  margin:0 0 5px;font-family:var(--display);font-size:15px;color:var(--cream);
  letter-spacing:.03em;text-transform:uppercase;line-height:1.4;
}
.sig{
  display:grid;grid-template-columns:1fr 190px;gap:14px;align-items:end;margin-top:16px;
}
@media (max-width:600px){.sig{grid-template-columns:1fr}}
.sig .signed{
  font-family:'Caveat',cursive;font-size:26px;color:var(--cream);
  background:var(--ink);border-bottom:1px solid var(--brass);border-radius:7px 7px 0 0;
}

/* ---------------------------------------------------- buttons + dock */
.btn{
  font-family:var(--label);font-size:13px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;padding:13px 26px;border-radius:8px;cursor:pointer;
  border:1px solid var(--edge-hi);background:var(--panel-3);color:var(--cream-dim);
  transition:.16s;
}
.btn:hover:not(:disabled){border-color:var(--brass);color:var(--cream)}
.btn.go{background:var(--brass);border-color:var(--brass);color:#191307}
.btn.go:hover:not(:disabled){background:#DBA748;border-color:#DBA748;color:#191307}
.btn:disabled{opacity:.42;cursor:not-allowed}
.btn.wide{width:100%}

.dock{
  position:fixed;left:0;right:0;bottom:0;z-index:40;
  background:linear-gradient(180deg,rgba(14,12,10,.86),var(--ink) 42%);
  border-top:1px solid var(--edge);backdrop-filter:blur(9px);
  padding:12px 18px calc(12px + env(safe-area-inset-bottom));
}
.dock-in{
  max-width:900px;margin:0 auto;display:flex;align-items:center;gap:14px;
}
.dock .tot{flex:1;min-width:0}
.dock .tot .lbl{display:block;font-size:10.5px;margin-bottom:2px}
.dock .tot .amt{
  font-family:var(--mono);font-size:22px;font-weight:600;color:var(--brass);line-height:1.1;
}
.dock .tot .amt small{font-size:11px;color:var(--amber);font-family:var(--label);
  letter-spacing:.12em;text-transform:uppercase;margin-left:7px}
@media (max-width:520px){
  .dock .tot .amt{font-size:18px}
  .btn{padding:12px 16px;font-size:12px;letter-spacing:.14em}
}

/* ---------------------------------------------------- done screen */
.done-card{text-align:center;padding:44px 26px}
.done-card .no{
  font-family:var(--mono);font-size:27px;color:var(--brass);letter-spacing:.06em;
  margin:16px 0 6px;font-weight:600;
}
.done-card h2{margin-bottom:10px}
.spinner{
  width:15px;height:15px;border:2px solid rgba(255,255,255,.22);border-top-color:var(--brass);
  border-radius:50%;display:inline-block;animation:spin .7s linear infinite;vertical-align:-2px;
}
@keyframes spin{to{transform:rotate(360deg)}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.foot{text-align:center;color:var(--faint);font-size:12px;padding:26px 0 0}

/* On narrow phones the price column starves the description into two-word
   lines. Below 430px switch to a small grid: box and title stay on one row,
   the price drops beneath the text rather than orphaning the checkbox. */
@media (max-width:430px){
  .opt{display:grid;grid-template-columns:auto 1fr;gap:7px 12px;align-items:start}
  .opt input{grid-column:1;grid-row:1;margin-top:3px}
  .opt .t{grid-column:2;grid-row:1}
  .opt .p{grid-column:2;grid-row:2;justify-self:start;align-self:start;font-size:15px}
}

/* ---------------------------------------------------- payment methods */
.pay{
  background:var(--panel-3);border:1px solid var(--edge-hi);border-radius:9px;
  padding:16px 18px;margin:0 0 16px;
}
.pay .lbl{display:block;color:var(--brass);margin-bottom:4px}
.pay .note{color:var(--faint);font-size:12.5px;margin:0 0 12px;line-height:1.5}
.pay ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pay li{
  display:flex;align-items:center;gap:12px;padding:10px 13px;
  background:var(--ink);border:1px solid var(--edge);border-radius:7px;
}
.pay .m{
  font-family:var(--label);font-size:11.5px;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted);width:82px;flex:0 0 auto;
}
.pay .h{
  flex:1;min-width:0;font-family:var(--mono);font-size:14px;color:var(--cream);
  overflow-wrap:anywhere;text-decoration:none;
}
a.h:hover{color:var(--brass)}
.pay .copy{
  background:none;border:1px solid var(--edge-hi);color:var(--faint);border-radius:6px;
  padding:5px 10px;cursor:pointer;font-family:var(--label);font-size:10.5px;
  letter-spacing:.16em;text-transform:uppercase;transition:.15s;flex:0 0 auto;
}
.pay .copy:hover{border-color:var(--brass);color:var(--brass)}
.pay .copy.done{border-color:var(--green);color:var(--green)}
@media (max-width:430px){
  .pay li{flex-wrap:wrap;gap:6px 10px}
  .pay .m{width:auto}
  .pay .h{flex:1 1 100%;order:3}
}

/* ---------------------------------------------------- console dashboard */
.meter{
  background:var(--panel);border:1px solid var(--edge);border-radius:10px;
  padding:16px 18px;margin:0 0 16px;
}
.meter .top{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap}
.meter .amt{font-family:var(--mono);font-size:19px;color:var(--cream);font-weight:600}
.meter .amt b{color:var(--brass)}
.meter .sub{color:var(--faint);font-size:12.5px}
.meter .track{height:6px;background:var(--ink);border-radius:3px;overflow:hidden;margin-top:11px;display:flex}
.meter .track i{display:block;height:100%}
.meter .track .a{background:var(--brass)}
.meter .track .b{background:var(--oxblood)}
.meter .keys{display:flex;gap:16px;margin-top:9px;font-size:11.5px;color:var(--faint);flex-wrap:wrap}
.meter .keys span{display:flex;align-items:center;gap:6px}
.meter .keys i{width:9px;height:9px;border-radius:2px;display:block}

.card{
  background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--edge);border-left:3px solid var(--brass-dim);
  border-radius:10px;padding:18px 20px;margin:0 0 14px;
}
.card.expiring{border-left-color:var(--amber)}
.card.expired{border-left-color:var(--oxblood)}
.card .hd{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:4px}
.card .hd h3{
  font-family:var(--display);font-size:19px;font-weight:400;color:var(--cream);
  margin:0;flex:1;min-width:0;text-transform:uppercase;letter-spacing:.02em;
}
.card .who{color:var(--muted);font-size:13px;margin:0 0 14px}
.card .who .no{font-family:var(--mono);color:var(--brass);font-size:12px}
.card .cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:720px){.card .cols{grid-template-columns:1fr}}
.card .col h4{
  font-family:var(--label);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--faint);margin:0 0 8px;display:flex;justify-content:space-between;gap:8px;
}
.card .col h4 em{font-style:normal;color:var(--muted);font-family:var(--mono);letter-spacing:0}
.frow{
  display:flex;align-items:center;gap:9px;padding:8px 10px;margin-bottom:5px;
  background:var(--ink);border:1px solid var(--edge);border-radius:6px;font-size:12.5px;
}
.frow .n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--cream-dim)}
.frow .s{font-family:var(--mono);font-size:10.5px;color:var(--faint);white-space:nowrap}
.frow .ic{
  width:15px;height:15px;flex:0 0 auto;border-radius:3px;display:grid;place-content:center;
  font-size:9px;font-weight:700;
}
.frow.got{border-color:rgba(87,179,125,.36)}
.frow.got .ic{background:var(--green);color:#0B1A10}
.frow .mini{
  background:none;border:1px solid var(--edge-hi);color:var(--muted);border-radius:5px;
  padding:4px 8px;cursor:pointer;font-family:var(--label);font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;flex:0 0 auto;transition:.14s;
}
.frow .mini:hover{border-color:var(--brass);color:var(--brass)}
.frow .mini.del:hover{border-color:var(--oxblood);color:#E8695A}
.none{color:var(--faint);font-size:12.5px;font-style:italic;padding:6px 0}
.exp{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;padding-top:13px;
  border-top:1px solid var(--edge);font-size:12.5px;color:var(--muted);
}
.exp .pill2{
  font-family:var(--label);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  padding:4px 10px;border-radius:100px;border:1px solid var(--edge-hi);color:var(--muted);
}
.exp .pill2.live{border-color:var(--green);color:var(--green)}
.exp .pill2.soon{border-color:var(--amber);color:var(--amber)}
.exp .pill2.dead{border-color:var(--oxblood);color:#E8695A}
.exp .sp{flex:1}
.acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.acts .btn{padding:9px 14px;font-size:11px;letter-spacing:.14em}
.acts .btn.danger{border-color:rgba(160,52,40,.55);color:#E8695A}
.acts .btn.danger:hover{border-color:var(--oxblood);background:rgba(160,52,40,.12)}

/* Duration picker sits flush against its Create-link button. */
.linkpick{display:inline-flex;align-items:stretch}
.linkpick select{
  width:auto;border-radius:8px 0 0 8px;border-right:0;padding:9px 30px 9px 12px;
  font-family:var(--label);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  background-position:right 9px center;
}
.linkpick .btn{border-radius:0 8px 8px 0}

/* Payment rules + the deposit split, on the sheet. */
.pay .rules{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:7px}
.pay .rules li{
  position:relative;padding-left:16px;font-size:13px;line-height:1.5;color:var(--cream-dim);
}
.pay .rules li::before{
  content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;
  background:var(--oxblood);
}
.pay .rules strong{color:var(--cream)}
.pay .deposit{
  display:flex;justify-content:space-between;gap:14px;padding:8px 12px;margin-bottom:5px;
  background:var(--ink);border:1px solid var(--edge);border-radius:6px;font-size:13px;
}
.pay .deposit b{font-family:var(--mono);color:var(--brass)}
.pay .pay-go{text-decoration:none;border-color:var(--brass);color:var(--brass)}
.pay .pay-go:hover{background:var(--brass);color:#191307}