.profile-hub{--ph-line:rgba(193,201,197,.16);width:100%;max-width:2200px;margin:0 auto;display:grid;gap:16px;min-width:0}
.profile-hub *{box-sizing:border-box}.profile-hub [hidden]{display:none!important}
.ph-hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;min-height:164px;padding:25px 28px;overflow:hidden;border:1px solid var(--ph-line);border-radius:12px;background-color:#181e20;background-image:linear-gradient(90deg,rgba(12,17,19,.82),rgba(12,17,19,.25)),linear-gradient(0deg,rgba(12,17,19,.75),transparent),url('/assets/profile-roadside.webp');background-position:center,center,center 48%;background-size:cover;background-repeat:no-repeat;background-clip:padding-box}
.ph-hero:before{content:none}
.ph-identity{display:flex;align-items:center;gap:22px;min-width:0}.ph-identity>div:last-child{min-width:0}.ph-identity h1{font-size:clamp(24px,2vw,34px);line-height:1.2;margin:7px 0 8px;overflow-wrap:anywhere}.ph-identity p{margin:0;color:#c1c6c5;font-size:13px}
.ph-avatar{display:block!important;width:96px!important;height:96px!important;min-width:96px;flex:none;border-radius:16px!important;border:1px solid rgba(221,215,196,.4);box-shadow:0 5px 18px #0007;object-fit:cover}.ph-privacy{display:flex;align-items:center;gap:8px;color:#c1c6c5;font-size:12px;white-space:nowrap}.ph-privacy .icon{width:17px}
.ph-tabs{display:flex;gap:6px;padding:4px;border-bottom:1px solid var(--ph-line)}.ph-tabs button{display:flex;justify-content:center;align-items:center;gap:9px;border:1px solid transparent;border-radius:7px;padding:11px 19px;color:var(--muted,#acb5b6);background:transparent;font:inherit;font-size:13px;cursor:pointer;transition:background .2s,color .2s}.ph-tabs button[aria-pressed=true]{color:var(--text,#e6e9e7);background:rgba(219,224,219,.07);border-color:var(--ph-line)}.ph-tabs .icon{width:17px;height:17px}
.ph-identity-grid{display:grid;grid-template-columns:minmax(270px,.8fr) minmax(0,2fr);gap:16px}.ph-main,.ph-access-main{display:grid;gap:16px;align-content:start}.profile-hub .card{padding:22px;min-width:0;background:linear-gradient(125deg,rgba(32,37,39,.9),rgba(23,28,30,.96));border:1px solid var(--ph-line);border-radius:10px;box-shadow:0 6px 16px #00000010}.profile-hub h2{font-size:17px;line-height:1.3;margin:3px 0 0}.profile-hub h3{font-size:14px;line-height:1.4;margin:0}.profile-hub p{font-size:13px;line-height:1.55;color:var(--muted,#b1b8b7);margin:8px 0 0}.profile-hub small{font-size:11px;line-height:1.5;color:var(--muted,#a6b0b0)}.profile-hub .eyebrow{font-size:10px;color:#c1b799;letter-spacing:.14em}.profile-hub .button{font-size:12px;min-height:37px;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:normal;text-align:center}.profile-hub .button .icon{width:15px;height:15px}.profile-hub .text-link{font-size:12px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}.profile-hub .text-link .icon{width:14px;height:14px}.profile-hub .ph-feedback{min-height:20px;margin:8px 0 0;font-size:12px;color:#d5c9a6;overflow-wrap:anywhere}
.ph-account header{margin-bottom:23px}.ph-account form>label{display:block;font-size:12px;margin-bottom:7px}.ph-name-input{display:flex;gap:8px}.ph-name-input input{width:100%;min-width:0}.profile-hub input:not([type=file]){font:inherit;font-size:13px;border-radius:6px;padding:10px 12px;background:#101719;border:1px solid #3a4346;color:#e2e7e5;outline-offset:3px;min-width:0}.profile-hub input:focus-visible{outline:2px solid #b7b19f}.ph-account form>small{display:block;margin-top:7px}.ph-photo{border-top:1px solid var(--ph-line);margin-top:23px;padding-top:20px}.ph-photo-actions{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 8px}.ph-upload{position:relative;cursor:pointer;overflow:hidden}.ph-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.ph-upload:focus-within{outline:2px solid #b7b19f;outline-offset:3px}.ph-photo>small{display:block}.ph-photo .text-link{margin-top:12px}
.ph-connection-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:19px}.ph-connection-grid article{display:flex;gap:10px;min-width:0}.ph-connection-grid article+article{border-left:1px solid var(--ph-line);padding-left:16px}.ph-connection-grid article>div{min-width:0}.ph-connection-grid p{margin:3px 0;font-size:12px;overflow-wrap:anywhere}.ph-connection-grid small{display:block;overflow-wrap:anywhere}.ph-connection-icon{width:29px;height:29px;flex:none;display:grid;place-items:center;color:#b9c3c4}.ph-connection-icon svg{width:23px;height:23px}.ph-connection-grid .text-link{margin-top:3px}.ph-channels>header{display:flex;justify-content:space-between;gap:20px;align-items:center}.ph-channels>header>.icon{color:#b2b9b5;width:24px}.ph-channel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;margin-top:17px}.ph-channel-field{display:grid;gap:7px;min-width:0}.ph-channel-field>span{display:flex;align-items:center;gap:8px;font-size:12px}.ph-channel-field svg{width:18px;height:18px;flex:none}.ph-channel-field small{margin-left:auto}.ph-channels footer{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:17px}.ph-channels footer small{max-width:370px}
.ph-access-grid{display:grid;grid-template-columns:minmax(280px,1fr) minmax(0,1.65fr);gap:16px}.ph-subscription-list{display:grid;gap:14px;margin:18px 0}.ph-subscription{padding:16px;border:1px solid var(--ph-line);border-radius:8px}.ph-status-line{display:flex;gap:8px;align-items:center;color:#c5cabe;font-size:12px;margin-bottom:10px}.ph-status-line svg{width:17px}.ph-subscription dl{display:grid;grid-template-columns:1fr 1.5fr;gap:12px;margin:16px 0}.ph-subscription dt{color:#abb5b4;font-size:11px}.ph-subscription dd{margin:4px 0 0;font-size:13px;overflow-wrap:anywhere}.profile-hub .ph-remaining{color:#d5c9a6;margin:0 0 14px}.ph-empty{padding:25px 5px}.ph-empty>.icon{width:32px;height:32px;color:#c1b799;margin-bottom:15px}.ph-plan{margin-top:4px}.ph-server{display:flex;align-items:center;gap:13px;padding:16px 0;border-bottom:1px solid var(--ph-line);text-decoration:none;color:inherit}.ph-server>div{flex:1;min-width:0}.ph-server h3{overflow-wrap:anywhere}.ph-server p{margin:3px 0;font-size:12px}.ph-server>span{width:50px;height:50px;flex:none}.ph-server>span>*{width:50px!important;height:50px!important;object-fit:cover;border-radius:9px}.ph-server>.icon{width:16px}.ph-memberships>.text-link{margin-top:17px}.ph-invitations header{display:flex;align-items:center;justify-content:space-between}.ph-count{font-size:12px;background:#ffffff0a;border:1px solid var(--ph-line);padding:3px 9px;border-radius:50px}.ph-invite{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:15px}.ph-invite>div:last-child{display:flex;gap:8px}.ph-empty-copy{padding:15px 0}.ph-access,.ph-identity-grid{animation:ph-enter .25s ease both}.ph-loading{padding:30px}.avatar.ph-custom-avatar{background-position:center!important;background-size:cover!important}
@keyframes ph-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(min-width:2000px){.profile-hub{gap:22px}.ph-hero{min-height:210px}.profile-hub .card{padding:28px}.ph-main{gap:22px}.ph-channel-grid{gap:22px}.ph-identity-grid{grid-template-columns:minmax(340px,.75fr) minmax(0,2fr)}}
@media(max-height:940px) and (min-width:1000px){.profile-hub{gap:10px}.ph-hero{min-height:128px;padding:18px 23px}.ph-avatar{width:78px!important;height:78px!important;min-width:78px}.profile-hub .card{padding:17px}.ph-identity-grid,.ph-main{gap:12px}.ph-account header{margin-bottom:16px}.ph-photo{margin-top:17px;padding-top:16px}.ph-connection-grid{margin-top:13px}.ph-channel-grid{margin-top:12px;gap:10px}.ph-channels footer{margin-top:12px}.ph-tabs button{padding:9px 15px}}
@media(max-width:1100px){.ph-identity-grid{grid-template-columns:minmax(245px,.85fr) minmax(0,1.7fr)}.ph-connection-grid{gap:10px}.ph-connection-grid article{gap:6px}.ph-connection-grid article+article{padding-left:10px}.ph-connection-icon{display:none}.ph-privacy{display:none}.ph-access-grid{grid-template-columns:minmax(270px,1fr) minmax(0,1.4fr)}}
@media(max-width:760px){.profile-hub{gap:12px}.ph-hero{padding:22px 18px;min-height:172px}.ph-identity{gap:14px}.ph-avatar{width:72px!important;height:72px!important;min-width:72px;border-radius:12px!important}.ph-identity h1{font-size:23px}.ph-identity p{font-size:12px}.ph-tabs{gap:3px;padding:0 0 8px}.ph-tabs button{flex:1;font-size:12px;padding:10px 7px;gap:6px}.ph-tabs .icon{width:16px;flex:none}.ph-identity-grid,.ph-access-grid{grid-template-columns:1fr}.profile-hub .card{padding:18px}.ph-connection-grid{grid-template-columns:1fr;gap:16px}.ph-connection-grid article+article{border-left:0;border-top:1px solid var(--ph-line);padding:15px 0 0}.ph-connection-icon{display:grid}.ph-channel-grid{grid-template-columns:1fr;gap:16px}.ph-channels footer{align-items:flex-start;flex-direction:column}.ph-channels footer button{align-self:flex-end}.ph-invite{align-items:flex-start;flex-direction:column}.ph-subscription dl{grid-template-columns:1fr 1.5fr}}
@media(prefers-reduced-motion:reduce){.ph-access,.ph-identity-grid{animation:none}.ph-tabs button{transition:none}}

.profile-hub button.text-link{border:0;background:transparent;color:#c9c3af;padding:2px 0;box-shadow:none}.profile-hub button.text-link:hover{color:#f0e7cd}.ph-server>span img{width:100%;height:100%;object-fit:cover}

@media(max-height:940px) and (min-width:1000px){
 .ph-hero{min-height:88px;padding:12px 18px}.ph-avatar{width:62px!important;height:62px!important;min-width:62px}.ph-identity h1{font-size:24px;margin:3px 0}.ph-identity p{display:none}.ph-tabs{padding:0 0 5px}.ph-tabs button{padding:8px 13px}
 .ph-identity-grid{grid-template-columns:minmax(230px,.9fr) minmax(180px,.75fr) minmax(0,1.65fr)}.ph-main{display:contents}.ph-connection-grid{grid-template-columns:1fr;gap:14px}.ph-connection-grid article{gap:8px}.ph-connection-grid article+article{padding:12px 0 0;border-left:0;border-top:1px solid var(--ph-line)}.ph-connection-icon{display:none}
 .ph-photo-actions{flex-direction:column;align-items:stretch}.ph-photo-actions .button{min-height:34px}.ph-photo p{margin-top:5px}.ph-account header{margin-bottom:15px}.ph-channels footer{gap:8px;align-items:flex-end}.ph-channels footer small{max-width:65%}.ph-channels footer button{min-width:98px}.ph-channel-field small{font-size:10px}.ph-name-input{flex-wrap:wrap}.ph-name-input input{flex:1;min-width:120px}.ph-name-input button{min-height:34px}.ph-channels>p{max-width:65ch}
}

.profile-hub .ph-upload{flex-direction:row}
@media(max-height:940px) and (min-width:1000px){.ph-photo>p,.ph-account header>.eyebrow{display:none}.ph-photo-actions{margin-top:10px}}

@media(max-height:1080px) and (min-width:1000px){.ph-access-grid{grid-template-columns:1.55fr 1fr;gap:12px}.ph-subscription-list{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin:13px 0}.ph-subscription{padding:13px}.ph-subscription dl{grid-template-columns:1fr;gap:8px;margin:10px 0}.ph-server{padding:10px 0}.ph-access-main{gap:12px}.ph-memberships>.text-link{margin-top:10px}.ph-empty-copy{padding:8px 0}.ph-plan{margin-top:0}}

.ph-cancel-note{display:block!important;margin-top:10px}

@media(max-height:1080px) and (min-width:1000px){.ph-subscriptions>header>.eyebrow,.ph-memberships>header>p{display:none}.ph-subscription-list{margin:10px 0}.ph-invitations [data-invite-message]:empty{display:none}}

/* Preserve usable height below browser chrome on 1080p displays. */
@media(min-width:1000px) and (min-height:941px) and (max-height:1080px){
 .profile-hub{gap:12px}.ph-hero{min-height:132px;padding:18px 24px}.ph-avatar{width:80px!important;height:80px!important;min-width:80px}
 .profile-hub .card{padding:18px}.ph-main,.ph-access-main{gap:12px}.ph-connection-grid{margin-top:15px}.ph-channel-grid{gap:12px 18px;margin-top:14px}.ph-channels footer{margin-top:14px}
}



/* Subscription actions have their own row, independent of reference length. */
.ph-subscription{display:flex;flex-direction:column;align-items:flex-start;min-width:0;gap:8px}
.ph-subscription>p,.ph-subscription>h3{margin:0}
.ph-subscription>.button{margin-top:auto;max-width:100%;min-height:38px;white-space:normal;line-height:1.4;text-align:center;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.ph-order-reference{display:block;overflow-wrap:anywhere;margin:0 0 6px;color:var(--muted)}
@media(max-width:760px){.ph-subscription>.button{min-height:44px;width:100%}}

@media(min-width:1000px) and (max-height:740px){
 .profile-hub .ph-hero{min-height:88px;padding-block:12px}
 .profile-hub .ph-subscriptions{padding:13px 17px}
 .profile-hub{gap:12px}
 .ph-subscription{gap:6px;padding:11px}
 .ph-subscription dl{margin:7px 0}
 .profile-hub .ph-remaining{margin-bottom:8px}
}
.ph-streamer-bio{display:grid;gap:6px;margin-top:14px}.ph-streamer-bio>span{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--text)}.ph-streamer-bio small{font-size:10px;color:var(--muted)}.ph-streamer-bio textarea{display:block;width:100%;height:76px;min-height:76px;resize:vertical;border:1px solid var(--ph-line);border-radius:7px;background:#101719a6;color:var(--text);padding:9px 11px;font:12px/1.5 inherit;line-height:1.5}.ph-streamer-bio textarea:focus-visible{outline:2px solid #c5b28b;outline-offset:2px}
@media(min-width:1000px) and (max-height:940px){.ph-streamer-bio{margin-top:10px}.ph-streamer-bio textarea{height:66px;min-height:66px}.ph-channels footer{margin-top:10px}.ph-channels .ph-feedback:empty{display:none}}
.ph-streamer-bio textarea{font-family:inherit;font-size:12px}
@media(min-width:1000px) and (max-height:800px){
 .ph-channels>p,.ph-channels>header .eyebrow{display:none}
 .profile-hub .ph-channels{padding:13px 16px}.ph-channels h2{margin:0}
 .ph-channel-grid{margin-top:10px;gap:8px}.ph-channels input:not([type=file]){padding:8px 10px}
 .ph-streamer-bio{margin-top:10px;gap:4px}.ph-streamer-bio textarea{height:60px;min-height:60px}
 .ph-channels footer{margin-top:8px}.ph-channels footer small{font-size:10px}.ph-channels .ph-feedback{margin-top:4px}
}

/* Banked access is one balance; receipts remain individual and compact. */
.ph-access-balance{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;padding:12px 0 14px;border-bottom:1px solid var(--ph-line);margin-bottom:12px}.ph-access-balance strong{font-size:21px;color:var(--text)}.ph-access-balance span{font-size:12px;color:var(--muted)}
.ph-receipt{gap:7px}.ph-receipt-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px;width:100%}.ph-receipt-heading h3{margin:0;font-size:15px}.ph-receipt-heading>strong{font-size:14px;white-space:nowrap}.ph-receipt>p{font-size:12px;color:var(--muted)}.ph-receipt footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;width:100%;padding-top:5px}.ph-receipt footer small{font-size:10px;color:var(--muted)}.ph-receipt .text-link{display:inline-flex;align-items:center;gap:7px;min-height:36px}.ph-receipt .text-link svg{width:14px;height:14px}

.ph-receipt .ph-status-line{margin-bottom:0}.ph-past-orders{font-size:12px;color:var(--muted)}.ph-past-orders>summary{cursor:pointer;padding:8px 0}.ph-past-orders[open]>.ph-receipt{margin-top:8px}.ph-receipt footer{border-top:1px solid var(--ph-line)}

.ph-connections .ph-link-policy{display:flex;align-items:flex-start;gap:8px;margin:12px 0 0;font-size:11px;line-height:1.5;color:var(--muted)}.ph-link-policy svg{width:15px;height:15px;flex:0 0 15px;margin-top:1px}

@media(min-width:1000px) and (min-height:941px) and (max-height:1080px){.profile-hub{gap:10px}.profile-hub .card{padding:16px}.ph-main{gap:10px}}
@media(min-width:1000px) and (max-height:940px){.ph-connections .ph-link-policy{margin-top:10px}.ph-connection-grid{gap:12px}.ph-connection-grid article+article{padding-top:10px}}
