/* The Prop Letter: sign-up band, join tick box, preferences page */
.phn{--g:var(--ph-gold,#FECC02);--w:var(--ph-wine,#6B003E);--ink:var(--ph-ink,#F6EFEF);--soft:var(--ph-ink-soft,#CBA6BD);--line:var(--ph-line,#5A1C40);--d:'Work Sans',system-ui,sans-serif;--m:'Instrument Sans',ui-monospace,monospace;color:var(--ink)}
.phn--band{background:var(--g);color:#1D1206;padding:64px 0}
.phn-in{max-width:1240px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:start}
.phn-k{font:600 12px var(--m);letter-spacing:.18em;text-transform:uppercase;margin:0 0 14px;color:var(--w)}
.phn h2{font:900 clamp(38px,5vw,72px)/.9 var(--d);letter-spacing:-.05em;margin:0;color:#1D1206}
.phn h2 span{color:var(--w)}
.phn-lead{margin:18px 0 0;max-width:36ch;font-size:16px;line-height:1.55;color:#3a2410}
.phn-form{display:grid;gap:16px}
.phn-row{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:12px}
.phn-f{display:flex;flex-direction:column;gap:6px;font:600 12px var(--m);letter-spacing:.06em;text-transform:uppercase}
.phn-f small{text-transform:none;letter-spacing:0;opacity:.7}
.phn-f input{width:100%;box-sizing:border-box;background:#fff !important;border:2px solid #1D1206 !important;border-radius:12px;padding:14px 16px;font:500 16px var(--d);color:#1D1206 !important}
.phn-f input:focus{outline:3px solid var(--w);outline-offset:2px}
.phn-cats{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.phn-cats legend{font:600 12px var(--m);letter-spacing:.06em;text-transform:uppercase;margin-bottom:10px;padding:0}
.phn-cats legend small{text-transform:none;letter-spacing:0;opacity:.7;margin-left:6px}
.phn-cats label{position:relative;cursor:pointer}
.phn-cats input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.phn-cats span{display:inline-block;padding:9px 14px;border-radius:999px;border:2px solid #1D1206;font:700 14px var(--d);transition:background .15s,color .15s}
.phn-cats input:checked+span{background:#1D1206;color:var(--g)}
.phn-cats input:focus-visible+span{outline:3px solid var(--w);outline-offset:2px}
.phn-btn{justify-self:start;background:#1D1206;color:var(--g);border:0;border-radius:999px;padding:16px 28px;font:900 17px var(--d);cursor:pointer}
.phn-btn:hover{background:var(--w);color:#fff}
.phn-btn--ghost{background:transparent;color:inherit;border:2px solid currentColor}
.phn-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.phn-done{background:#1D1206;color:var(--ink);border-radius:18px;padding:24px 26px;font-size:16px;line-height:1.5}
.phn-done b{color:var(--g)}
/* Tick box on /join/ */
.phn-join{display:flex;gap:10px;align-items:flex-start;margin:6px 0 14px;font-size:14px;line-height:1.45;cursor:pointer}
.phn-join input{margin-top:3px;width:18px;height:18px;accent-color:var(--ph-gold,#FECC02);flex:0 0 auto}
/* My Account line */
.phn-acct{margin-top:18px;padding:14px 16px;border-radius:12px;border:1px dashed var(--ph-line,#5A1C40)}
.phn-acct p{margin:0}
/* Preferences page (dark) */
.phn-page{padding:64px 0 90px;color:var(--ph-ink,#F6EFEF)}
.phn-page-in{max-width:720px;margin:0 auto;padding:0 24px}
.phn-page .phn-k{color:var(--ph-gold,#FECC02)}
.phn-page h1{font:900 clamp(40px,6vw,76px)/.92 'Work Sans',sans-serif;letter-spacing:-.05em;margin:0 0 20px}
.phn-msg{background:rgba(254,204,2,.12);border:1px solid var(--ph-gold,#FECC02);border-radius:12px;padding:14px 16px}
.phn-who{color:var(--ph-ink-soft,#CBA6BD)}
.phn-page .phn-cats span{border-color:rgba(246,239,239,.4);color:var(--ph-ink,#F6EFEF)}
.phn-page .phn-cats input:checked+span{background:var(--ph-gold,#FECC02);border-color:var(--ph-gold,#FECC02);color:#1D1206}
.phn-page .phn-btn{background:var(--ph-gold,#FECC02);color:#1D1206}
.phn-page .phn-btn--ghost{background:transparent;color:var(--ph-ink,#F6EFEF)}
.phn-actions{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:860px){
  .phn--band{padding:44px 0}
  .phn-in{grid-template-columns:1fr;gap:26px;padding:0 20px}
  .phn-row{grid-template-columns:1fr}
}