/* Pipio V4.9.88 — GROUP 4 Account & Creator Studio Premium
 * Presentation layer. Scoped selectors preserve Player, LIVE, Diamond and all API flows.
 */
:root{
  --p88-plum:#281b46;
  --p88-purple:#6e48dc;
  --p88-border:#e6def2;
  --p88-shadow:0 16px 40px rgba(57,35,108,.095);
}
/* Account home: clear separation between personal identity and creator studio */
body.pipio-pro .pipio88-me{max-width:760px;padding-bottom:35px}
body.pipio-pro .pipio88-me .pipio72-account-heading{margin:8px 0 21px}
body.pipio-pro .pipio88-me .pipio72-eyebrow{font-size:11px;color:#6d47bb}
body.pipio-pro .pipio88-me .pipio72-account-heading h1{font-weight:900;letter-spacing:-.055em;font-size:clamp(30px,5vw,40px);color:#261b3a}
body.pipio-pro .pipio88-account-subtitle{margin:8px 0 0;font-size:13px;line-height:1.6;color:#786d89}
body.pipio-pro .pipio88-me .pipio72-personal-card{
  border-color:#e8dff5;border-radius:24px;padding:clamp(14px,3vw,24px);
  background:linear-gradient(125deg,#fff 12%,#f7f2ff 100%);
  box-shadow:var(--p88-shadow);position:relative;overflow:hidden;
}
body.pipio-pro .pipio88-me .pipio72-personal-card:after{
  content:"";position:absolute;top:-85px;right:-80px;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle,rgba(174,130,250,.17),transparent 68%);pointer-events:none;
}
body.pipio-pro .pipio88-me .pipio72-personal-card .pipio-me-avatar{width:72px;height:72px;border:3px solid #fff;box-shadow:0 8px 18px #49306e29}
body.pipio-pro .pipio88-me .pipio72-personal-info strong{font-size:clamp(16px,3vw,21px);color:#28203a}
body.pipio-pro .pipio88-me .pipio72-personal-info small{color:#6c607b;line-height:1.45}
body.pipio-pro .pipio88-me .pipio72-personal-caption{width:fit-content;padding:5px 9px;background:#e9e0fd;border-radius:30px;color:#5539aa;font-weight:800;font-size:10px;margin-top:6px}
body.pipio-pro .pipio88-me .pipio-edit-avatar{border-radius:11px;min-height:41px;position:relative;z-index:1}
body.pipio-pro .pipio88-me .pipio78-account-switch{
  min-height:72px;border:1px solid #ddc9fe;border-radius:20px;
  background:linear-gradient(110deg,#f0e9ff,#f7f3ff);color:#312348;
  box-shadow:0 6px 22px #49306e12;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
body.pipio-pro .pipio88-me .pipio78-account-switch:active{transform:scale(.992)}
@media(hover:hover){body.pipio-pro .pipio88-me .pipio78-account-switch:hover{border-color:#ae8dec;box-shadow:0 12px 26px #49306e1d}}
body.pipio-pro .pipio88-me .pipio78-account-switch-label strong{font-size:15px;color:#302346}
body.pipio-pro .pipio88-me .pipio78-account-switch-label small{color:#6b6080}
body.pipio-pro .pipio88-me .pipio78-google-symbol{border-radius:11px;background:white;border:1px solid #ddd2f0;color:#7056d7;width:41px;height:41px;display:grid;place-items:center;font-size:24px;font-weight:850;flex:none}
body.pipio-pro .pipio88-account-security-note{display:flex;align-items:start;gap:8px;padding:4px 8px;margin:9px 0 0;font-size:11px;line-height:1.65;color:#766886}
body.pipio-pro .pipio88-account-security-note svg{flex:none;margin-top:1px;color:#7454bc}
body.pipio-pro .pipio88-me .pipio72-account-section-heading{margin-top:27px}
body.pipio-pro .pipio88-me .pipio72-account-section-heading h2{font-size:16px;color:#342746}
body.pipio-pro .pipio88-me .pipio72-account-links{padding:3px 14px!important;border-radius:21px;border:1px solid var(--p88-border);box-shadow:0 7px 28px #49306e0b}
body.pipio-pro .pipio88-me .pipio72-account-links>button{min-height:83px!important;transition:background-color .17s ease}
body.pipio-pro .pipio88-me .pipio72-account-links>button:hover{background:#faf7ff}
body.pipio-pro .pipio88-me .pipio72-account-links strong{color:#31243f;font-weight:810}
body.pipio-pro .pipio88-me .pipio72-account-links small{color:#776b83}
body.pipio-pro .pipio88-me .pipio72-account-settings{border-top:1px solid #e6dfea;padding-top:12px}
/* Creator workspace: dark identity header with limited compact actions */
body.pipio-pro .pipio72-studio{max-width:1040px}
body.pipio-pro .pipio72-studio .pipio72-studio-hero{
  border-radius:25px;background:linear-gradient(125deg,#15152a 2%,#25204b 50%,#56327e 100%);
  box-shadow:0 16px 34px #20163124;border:1px solid #ffffff14;
}
body.pipio-pro .pipio72-studio .pipio72-studio-statistics{gap:10px}
body.pipio-pro .pipio72-studio .pipio72-studio-statistics>div{border-radius:11px;padding:8px;background:#ffffff09}
body.pipio-pro .pipio72-studio .pipio72-studio-verified{background:#225a4773;padding:5px 9px;border-radius:999px}
body.pipio-pro .pipio72-studio .pipio72-studio-pending{background:#67512d88;padding:5px 9px;border-radius:999px}
body.pipio-pro .pipio88-studio-quick{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 25px}
body.pipio-pro .pipio88-studio-quick button{
  display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;
  border:1px solid #e3d9f1;border-radius:15px;min-height:49px;
  font-weight:750;font-size:13px;line-height:1.3;font-family:inherit;color:#604791;background:#f6f0ff;
  transition:background-color .2s ease,border-color .2s ease,transform .2s ease;
}
body.pipio-pro .pipio88-studio-quick button.pipio88-primary-quick{color:white;border-color:#774bdc;background:linear-gradient(110deg,#7447db,#a35de5);box-shadow:0 9px 18px #7043d42a}
body.pipio-pro .pipio88-studio-quick button:focus-visible{outline:3px solid #a786fa;outline-offset:3px}
@media(hover:hover){body.pipio-pro .pipio88-studio-quick button:hover{transform:translateY(-1px);border-color:#ac8ce5}}
body.pipio-pro .pipio72-studio .creator-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;gap:6px}
body.pipio-pro .pipio72-studio .creator-tab{white-space:nowrap;flex:0 0 auto;min-width:85px;padding-inline:13px;min-height:46px;outline-offset:-3px}
body.pipio-pro .pipio72-studio .creator-tab.active{background:#f4efff;border-radius:12px 12px 0 0}
body.pipio-pro .pipio88-create-studio{max-width:720px;margin:auto}
body.pipio-pro .pipio88-create-studio .page-header{border-radius:20px 20px 0 0;margin:0;padding:22px 23px;background:linear-gradient(115deg,#241941,#5d3c93);color:white}
body.pipio-pro .pipio88-create-studio .page-header h1{color:white;margin:5px 0 9px}
body.pipio-pro .pipio88-create-studio .page-header p{color:#dfd4fa;margin:0}
body.pipio-pro .pipio88-create-studio .surface{margin:0;border-radius:0 0 20px 20px;border:1px solid #e6daef;border-top:0}
body.pipio-pro .pipio88-creator-kicker{color:#edc3f6;font-size:11px;font-weight:860;letter-spacing:.13em}
body.pipio-pro .pipio88-studio-help{color:#726681;font-size:12px;margin:10px 0 0;line-height:1.6}
/* Account modal and Google auth: natural single primary action, no fake sign-in state */
body.pipio-pro .modal:has(.pipio77-auth-google){width:min(94vw,490px);max-height:calc(100dvh - 35px);overflow-y:auto;border-radius:25px}
body.pipio-pro .modal .pipio77-auth-google{padding:6px 0 2px}
body.pipio-pro .modal .pipio77-google-button{display:flex;align-items:center;justify-content:center;gap:12px;border-radius:15px;letter-spacing:.005em;box-shadow:0 10px 22px #7648cd2f}
body.pipio-pro .pipio88-google-g{display:grid;place-items:center;width:27px;height:27px;background:#fff;border-radius:50%;font-size:19px;font-weight:900;color:#704bc8;line-height:1}
body.pipio-pro .modal :is(.pipio77-auth-google p,.pipio77-auth-note,.pipio77-browser-hint){line-height:1.6;color:#796e88}
body.pipio-pro .modal .pipio77-email-details{border-color:#ddd1ee;border-radius:15px;padding:15px;background:#faf7ff}
body.pipio-pro .modal .pipio77-email-details summary{min-height:36px;display:list-item;align-content:center;color:#513778}
body.pipio-pro .modal :is(.pipio77-email-details input,#pipio88-account-name){border-radius:12px;min-height:46px;padding:11px 12px}
body.pipio-pro .modal #auth-error:not([hidden]){line-height:1.55;overflow-wrap:anywhere;padding:12px;border-radius:12px}
body.pipio-pro .pipio88-form-note{color:#7c6d8c;font-size:12px;line-height:1.55;margin:-4px 0 10px}
@media(max-width:560px){
 body.pipio-pro .pipio88-me .pipio72-personal-card{padding:15px 12px;gap:9px;border-radius:20px}
 body.pipio-pro .pipio88-me .pipio72-personal-card .pipio-me-avatar{width:62px;height:62px}
 body.pipio-pro .pipio88-me .pipio-edit-avatar{min-height:38px;padding:8px 11px}
 body.pipio-pro .pipio88-me .pipio78-account-switch{padding:13px;gap:10px}
 body.pipio-pro .pipio88-me .pipio78-account-switch-label small{font-size:11px}
 body.pipio-pro .pipio88-me .pipio72-account-links>button{min-height:74px!important}
 body.pipio-pro .pipio72-studio .pipio72-studio-statistics>div{padding:4px}
 body.pipio-pro .pipio88-studio-quick{gap:7px;margin-bottom:20px}
 body.pipio-pro .pipio88-studio-quick button{min-height:45px;font-size:12px;gap:5px;padding:6px}
 body.pipio-pro .pipio88-create-studio .page-header{padding:21px 17px}
 body.pipio-pro .modal:has(.pipio77-auth-google){width:min(100vw - 20px,490px);max-height:calc(100dvh - 25px)}
}
@media(max-width:360px){
 body.pipio-pro .pipio88-me .pipio72-personal-info strong{font-size:15px}
 body.pipio-pro .pipio88-me .pipio72-personal-info small{font-size:10px}
 body.pipio-pro .pipio88-studio-quick button svg{width:15px;height:15px}
}
@media(prefers-reduced-motion:reduce){body.pipio-pro .pipio88-me .pipio78-account-switch,body.pipio-pro .pipio88-studio-quick button{transition:none!important}}
