:root{color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:#08080c;color:#f5f5f7;font:16px/1.55 Inter,system-ui,sans-serif}
[hidden]{display:none!important}
.profile-page{max-width:1200px;margin:auto;padding:48px 32px 80px}
.profile-kicker{color:#ff3346;font-size:11px;font-weight:800;letter-spacing:.17em;margin:0 0 10px}
.profile-page h1{font-size:clamp(32px,4.8vw,54px);line-height:1.1;letter-spacing:-.04em;margin:0 0 28px}
.profile-muted{color:#a9a9b8;font-size:14px}
.account-provider-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
#connections .account-provider-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:16px;margin-top:18px}
.connection-card{padding:24px;border:1px solid #ffffff20;border-radius:12px;background:#121218;min-width:0}
#connections .connection-card{padding:20px;overflow-wrap:anywhere}
#connections .connection-card>p:empty{display:none}
#connections .profile-heading{margin-top:0;gap:12px}#connections .profile-heading h3{margin:0;font-size:18px}#connections #retryConnections{font-size:12px;padding:8px 12px}
#connections .connection-card>a{display:inline-block;font-size:13px;margin-top:14px}
.connection-actions{display:flex;flex-wrap:wrap;gap:10px}
.connection-card h3{margin:0}
.connection-card details{margin-top:20px}
.connection-card summary,#profileAccount summary{cursor:pointer;font-weight:600}
#profileAccount{max-width:720px}
#connections{scroll-margin-top:90px}
@media(max-width:620px){.account-provider-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){#connections .account-provider-grid{grid-template-columns:minmax(0,1fr)}}
:is(.profile-page,.creator-dialog) a{color:inherit}
:is(.profile-page,.creator-dialog) :is(a,button,input,textarea,select,summary):focus-visible{outline:2px solid white;outline-offset:4px}
:is(.profile-page,.creator-dialog) button,.profile-actions a{border:1px solid #ffffff28;border-radius:8px;padding:11px 17px;background:#24242c;color:white;font:600 14px/1.4 Inter,system-ui,sans-serif;cursor:pointer;text-decoration:none}
:is(.profile-page,.creator-dialog) .profile-primary{background:#e50914;border-color:#e50914}
:is(.profile-page,.creator-dialog) button:disabled{opacity:.5;cursor:wait}
:is(.profile-page,.creator-dialog) label,:is(.profile-page,.creator-dialog) legend{display:block;font-size:14px;font-weight:650;margin:14px 0 8px}
:is(.profile-page,.creator-dialog) :is(input:not([type=radio]):not([type=checkbox]),textarea,select){width:100%;border:1px solid #ffffff30;border-radius:8px;background:#0b0b11;color:#fff;padding:12px;font:inherit}
:is(.profile-page,.creator-dialog) textarea{resize:vertical}
:is(.profile-page,.creator-dialog) select{max-width:320px}
:is(.profile-page,.creator-dialog) .check{display:flex;align-items:flex-start;gap:10px;font-size:13px;font-weight:400;color:#c8c8d1}
.check input{flex:none;margin-top:5px}
.profile-actions{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}
.profile-actions:empty{display:none}
.profile-admin-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.profile-admin-actions button{padding:8px 12px;font-size:12px}
.profile-summary{display:flex;align-items:center;gap:24px;padding:26px;border:1px solid #ffffff20;border-radius:14px;background:linear-gradient(115deg,#291018,#121218 70%)}
.profile-summary h2{margin:0;font-size:28px;overflow-wrap:anywhere}
.profile-summary>div{min-width:0;flex:1}
.profile-summary>button{flex:none}
.profile-summary:has(.profile-inline-editor:not([hidden])){align-items:start}
.profile-summary p:last-child{margin-bottom:0}
#profileBio{white-space:pre-wrap;overflow-wrap:anywhere}
.profile-identity .profile-inline-trigger{display:inline-flex;align-items:baseline;gap:10px;max-width:100%;padding:0;border:0;border-radius:4px;background:transparent;text-align:left;font:inherit;color:inherit;white-space:pre-wrap;overflow-wrap:anywhere}
.profile-inline-trigger>span:first-child{min-width:0;overflow-wrap:anywhere}
.profile-inline-pencil{flex:none;color:#a9a9b8;font-size:14px;opacity:.65}
.profile-inline-trigger:hover .profile-inline-pencil{opacity:1;color:white}
.profile-inline-editor{max-width:560px;margin:12px 0}.profile-inline-editor .profile-actions{margin:12px 0}.profile-inline-editor .profile-muted{font-size:12px;margin:8px 0}
.profile-editor details{margin-top:20px}.profile-editor summary{cursor:pointer}
.profile-page .profile-avatar{position:relative;display:grid;place-items:center;flex:none;width:80px;height:80px;padding:0;border:0;background:#e50914;border-radius:20px;font-size:32px;overflow:hidden}
.profile-avatar>span:first-child,.profile-picture-preview>span:first-child{display:grid;place-items:center;width:100%;height:100%}
.profile-avatar img{width:100%;height:100%;object-fit:cover}
.profile-avatar__edit{position:absolute;inset:auto 0 0;background:#000b;color:#fff;font-size:10px;font-weight:700;line-height:1.7;text-align:center;pointer-events:none}
.profile-avatar{flex-shrink:0}
.profile-page .profile-avatar[data-avatar=moon]{background:#513395}.profile-page .profile-avatar[data-avatar=game]{background:#14615c}.profile-page .profile-avatar[data-avatar=flower]{background:#873663}.profile-page .profile-avatar[data-avatar=film]{background:#22558f}.profile-page .profile-avatar[data-avatar=bolt]{background:#785215}
.creator-dialog.profile-picture-dialog{width:min(440px,calc(100% - 32px))}
.profile-picture-dialog .profile-picture-preview{position:relative;display:grid;place-items:center;width:104px;height:104px;padding:0;overflow:hidden;border-radius:20px;font-size:44px}
.profile-picture-preview img{width:100%;height:100%;object-fit:cover}
.profile-picture-dialog fieldset{border:0;padding:0;margin:20px 0}
.profile-picture-dialog .picture-format{font-size:12px;margin:10px 0}
.profile-picture-dialog .avatar-choices{gap:8px}
.profile-picture-dialog .avatar-choices label{min-width:76px;margin:0}
.avatar-choices label:has(:focus-visible){outline:2px solid white;outline-offset:3px}
.picture-help summary{font-size:13px;cursor:pointer;color:#a9a9b8}
.profile-editor{margin-top:18px;padding:24px;background:#121218;border:1px solid #ffffff26;border-radius:12px}
.profile-editor h2,.profile-editor h3{margin-top:0}
.profile-editor fieldset{border:0;margin:20px 0;padding:0}
.avatar-choices{display:flex;flex-wrap:wrap;gap:10px}
.avatar-choices label{position:relative;display:grid;justify-items:center;gap:5px;min-width:78px;border:1px solid #ffffff2a;border-radius:10px;padding:10px;background:#191921;cursor:pointer}
.avatar-choices label:has(:checked){border-color:#ff3345;background:#3a111c}
.avatar-choices input{position:absolute;opacity:0;width:1px;height:1px}
.avatar-choices span{font-size:24px}
.profile-workspace-nav{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border-bottom:1px solid #ffffff20;margin-top:20px}
.profile-shortcuts{display:flex;flex:1 1 340px;min-width:0;gap:26px;overflow-x:auto;scrollbar-width:none;padding:6px}
.profile-shortcuts::-webkit-scrollbar{display:none}
.profile-shortcuts a{flex:none;white-space:nowrap;font-size:14px;font-weight:700;text-decoration:none;padding:15px 0 12px;border-bottom:3px solid transparent;color:#bdbdcb}
.profile-shortcuts a:hover{color:#fff}
.profile-shortcuts a[aria-selected=true]{color:#ff5664;border-bottom-color:#ff3346}
.profile-review-link{font-size:13px;font-weight:600;text-decoration:none;padding:12px 4px}
.profile-review-link:hover{text-decoration:underline}
.profile-page [role=tabpanel]:focus-visible{outline:2px solid white;outline-offset:6px}
.profile-page section[id]{scroll-margin-top:90px}
.profile-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:36px}
.profile-heading h2{margin:0;font-size:25px;letter-spacing:-.025em}
.profile-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.library-toolbar{display:grid;grid-template-columns:minmax(180px,220px) minmax(0,1fr) auto;align-items:center;gap:16px;margin-top:30px}
.library-toolbar label{margin:0;min-width:0}
.library-toolbar select{display:block;width:100%;margin:0;max-width:none}
.library-toolbar #libraryUsage{margin:0;text-align:right;font-size:13px;overflow-wrap:anywhere}
.library-toolbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.library-toolbar-actions button{white-space:nowrap}
@media(max-width:640px){.library-toolbar{grid-template-columns:minmax(0,1fr) auto;gap:12px}.library-toolbar label{grid-column:1/-1}.library-toolbar #libraryUsage{text-align:left;font-size:12px}.library-toolbar-actions button{padding:12px;font-size:13px}}
#libraryStatus,#postStatus,#profileEditStatus,#mediaStatus,#clipStatus{color:#c6c6d1;font-size:14px}
#profileEditStatus:empty,#postStatus:empty,#mediaStatus:empty{display:none}
.media-grid{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:0;margin:22px 0}
.media-card{min-width:0}
.profile-page .media-card-open{display:block;padding:0;text-align:left;width:100%;height:100%;overflow:hidden;border-radius:12px;background:#141419;border:1px solid #ffffff18;transition:border-color .15s,transform .15s}
.profile-page .media-card-open:hover{border-color:#ffffff70;transform:translateY(-2px)}
.media-art{position:relative;aspect-ratio:16/9;display:grid;place-items:center;background:radial-gradient(ellipse at 70% 0%,#432a45,#141823 85%);overflow:hidden}
.media-card:nth-child(3n+2) .media-art{background:radial-gradient(ellipse at 20% 0%,#254d53,#141823 85%)}
.media-card:nth-child(3n+3) .media-art{background:radial-gradient(ellipse at 70% 0%,#60422c,#141823 85%)}
.media-symbol{font-size:32px;color:#ffffffbb}
.media-art img{width:100%;height:100%;object-fit:cover}
.upload-badge{position:absolute;top:10px;right:10px;background:#080a10e8;border:1px solid #ffffff30;border-radius:6px;padding:5px 8px;font-size:10px;font-weight:700;letter-spacing:.02em;color:#eeeff4}
.media-copy{padding:16px}
.media-copy small,.text-post>small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#b6b6c5}
.media-copy h3{font-size:16px;line-height:1.35;margin:8px 0;overflow-wrap:anywhere}
.media-copy p{font-size:12px;font-weight:400;color:#9292a4;margin:0}
.library-note{font-size:12px;max-width:720px}
.text-posts{list-style:none;display:grid;gap:14px;padding:0}
.text-post{padding:22px;border:1px solid #ffffff20;border-radius:12px;background:#121218}
.text-post h3{margin:8px 0}
.text-post p{white-space:pre-wrap;overflow-wrap:anywhere;color:#c6c6d1}
.creator-dialog{width:min(960px,calc(100vw - 40px));max-height:calc(100dvh - 40px);padding:28px;border:1px solid #ffffff30;border-radius:16px;background:#101016;color:#f5f5f7;overflow:auto}
.creator-dialog::backdrop{background:#000c;backdrop-filter:blur(8px)}
.add-media-dialog{max-width:720px;padding:22px}.media-method{margin-top:16px;padding:16px;border:1px solid #ffffff25;border-radius:12px;font-size:14px;line-height:1.45}.media-method--recommended{border-color:#f0445870;background:#20121a}.media-method h3{margin:0;font-size:20px}.media-method>p{overflow-wrap:anywhere}.media-method .profile-actions{margin:14px 0 0}.media-method .profile-muted{font-size:12px}#chooseMediaFile:disabled{cursor:not-allowed}#addLinkStatus:empty{display:none}
.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.dialog-heading h2{font-size:26px;margin:0;overflow-wrap:anywhere}
.dialog-heading>div{min-width:0}
/* Keep pointer/touch dismissal and keyboard focus visible in the long upload
   dialogs. This does not add a fixed header to the watch/trim workspace. */
.add-media-dialog>.dialog-heading{position:sticky;top:8px;z-index:2;background:#101016;box-shadow:0 -9px 0 #101016,0 8px 0 #101016}
.studio-tabs{display:flex;gap:10px;margin:22px 0}
.studio-tabs [aria-pressed=true]{background:#f3f3f7;color:#17171c}
.studio-player{aspect-ratio:16/9;background:#050509;border-radius:10px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
/* A shared room owns its height. Centering its 360px minimum inside a second
   16:9 flex frame clips and disables the header/hotbar on narrow screens.
   Images, external iframes and loading/error fallbacks keep the normal frame. */
#mediaPlayer.studio-player:has(>.toybox-room){display:block;aspect-ratio:auto}
.studio-player :is(video,img,iframe){width:100%;height:100%;object-fit:contain;border:0}
.studio-player p{padding:0 20px;text-align:center}
#clipStudio video{width:100%;max-height:460px;background:#000;border-radius:8px}
#clipStudio .editor-preview-room{width:100%;height:auto;aspect-ratio:var(--preview-aspect,16/9);min-height:240px;max-height:min(62dvh,520px);border-radius:8px;overflow:hidden}
#clipStudio .editor-preview-room video{height:100%;max-height:none;border-radius:0}
#clipStudio .editor-preview-room:fullscreen{height:100dvh;min-height:0;max-height:none;aspect-ratio:auto;border-radius:0}
#clipStudio>.profile-muted{margin:0 0 14px;font-size:12px;line-height:1.5}
#clipInputs{border:0;padding:0;margin:0;min-width:0}
.clip-range{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.creator-dialog input[type=range]{padding:0;margin-top:14px;accent-color:#e50914}
.creator-dialog summary{cursor:pointer;font-weight:600;padding:12px 0}
.creator-dialog progress{width:100%;accent-color:#e50914}
#mediaMetadata{padding-top:8px;border-top:1px solid #ffffff20}
#exportResult{margin-top:25px}
@media(max-width:760px){.media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-page{padding:36px 22px 60px}.profile-summary{gap:18px;flex-wrap:wrap}.profile-summary>#editProfile{margin-left:98px}.creator-dialog{width:calc(100vw - 24px);padding:20px}.dialog-heading h2{font-size:22px}}
@media(max-width:480px){.profile-page{padding:30px 18px 60px}.profile-summary{padding:18px;gap:15px}.profile-page .profile-avatar{width:60px;height:60px;border-radius:15px}.profile-summary h2{font-size:23px}.profile-summary>#editProfile{margin-left:75px}.profile-heading h2{font-size:23px}.media-grid{grid-template-columns:1fr}.profile-editor{padding:18px}.creator-dialog{padding:16px}.dialog-heading h2{font-size:20px}.studio-tabs button{padding:10px 12px}.clip-range{gap:12px}}
@media(max-width:760px){.profile-summary{display:grid;grid-template-columns:80px minmax(0,1fr)}.profile-summary>#editProfile{grid-column:2;margin-left:0;justify-self:start}}
@media(max-width:480px){.profile-summary{grid-template-columns:60px minmax(0,1fr)}}
.roleplay-connection h4{margin:24px 0 12px}.roleplay-connection form{max-width:620px}.roleplay-connection input{width:100%;box-sizing:border-box}.roleplay-account{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:16px 0}.roleplay-account small{flex-basis:100%}#gameCharacters{margin-bottom:36px}#gameCharacters article{min-width:0;overflow-wrap:anywhere}#roleplayStatus{overflow-wrap:anywhere;font-size:14px}#roleplayStatus:empty{display:none}
.character-life{box-sizing:border-box;width:min(820px,calc(100vw - 28px));max-height:88dvh;overflow:auto;background:#111218;color:#f7f7f8;border:1px solid #3a3a43;border-radius:18px;padding:28px;overflow-wrap:anywhere}
.character-life::backdrop{background:#000b}.character-life .profile-heading{align-items:flex-start;gap:18px}.character-life h2{margin-top:0}.character-life section{border-top:1px solid #ffffff20;padding-top:18px;margin-top:24px}.character-life label{display:grid;gap:8px;max-width:340px}.character-life select,.character-life button{font:inherit;color:inherit;background:#25262e;border:1px solid #494951;border-radius:8px;padding:12px;cursor:pointer}.character-life button:focus-visible,.character-life select:focus-visible{outline:2px solid #fff;outline-offset:3px}.character-life [hidden]{display:none!important}.life-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px}.life-facts dt{font-size:13px;color:#aeb4c1}.life-facts dd{margin:6px 0 0}.life-events{list-style:none;padding:0}.life-events li{padding:16px;border-left:3px solid #e50924;background:#ffffff05;margin:14px 0}.life-events h4{margin:0 0 6px}.life-events time{font-size:13px;color:#aeb4c1}.life-events p{margin-bottom:0}
@media(max-width:480px){.character-life{padding:18px}.character-life h2{font-size:23px}.life-facts{grid-template-columns:1fr}.character-life .profile-heading{flex-wrap:nowrap}}
.game-character-card{position:relative}.game-character-card:hover{border-color:#a5abb9}.game-character-open{display:block;font:inherit;color:#fff;background:transparent;border:0;padding:0;text-align:left;cursor:pointer;font-weight:700}.game-character-open::after{content:"";position:absolute;inset:0;border-radius:inherit}.game-character-open:focus-visible{outline:none}.game-character-open:focus-visible::after{outline:2px solid #fff;outline-offset:4px}.game-character-card a{display:inline-block;margin-top:16px;position:relative;z-index:1;color:#afc5e6}
.character-panel{box-sizing:border-box;width:min(820px,calc(100vw - 28px));max-height:88dvh;overflow:auto;background:#111218;color:#f7f7f8;border:1px solid #3a3a43;border-radius:18px;padding:28px;overflow-wrap:anywhere}.character-panel::backdrop{background:#000b}.character-panel .profile-heading{align-items:flex-start;gap:18px;flex-wrap:nowrap}.character-panel h2{margin-top:0}.character-panel section{border-top:1px solid #ffffff20;padding-top:18px;margin-top:24px}.character-panel button{font:inherit;color:inherit;background:#25262e;border:1px solid #494951;border-radius:8px;padding:12px;cursor:pointer}.character-panel button:focus-visible{outline:2px solid #fff;outline-offset:3px}.character-panel [hidden]{display:none!important}.character-panel-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px}.character-panel-facts dt{font-size:13px;color:#aeb4c1}.character-panel-facts dd{margin:6px 0 0}.character-panel-notice{background:#ffffff08;border-left:3px solid #e50924;padding:16px}
@media(max-width:480px){.character-panel{padding:18px}.character-panel h2{font-size:23px}.character-panel-facts{grid-template-columns:1fr}}
/* Creator guides and durable Spotlight requests. */
.guide-editor{margin:1.4rem 0;padding:1rem;border:1px solid #363641;border-radius:12px;background:#11131c}
.guide-editor>summary{cursor:pointer;font-weight:700}.guide-editor[open]>summary{margin-bottom:1rem}
.guide-editor .check{display:flex;gap:.75rem;align-items:center}.guide-editor .check input{width:auto}
#guideChapters{list-style:none;padding:0;display:grid;gap:.8rem}
.guide-chapter-row{display:grid;grid-template-columns:90px minmax(0,1fr);gap:.65rem;padding:1rem;border:1px solid #363641;border-radius:10px}
.guide-chapter-row label{min-width:0}.guide-chapter-row label:nth-child(3){grid-column:1/-1}.guide-chapter-row button{justify-self:start;grid-column:1/-1}
.spotlight-badge{position:absolute;left:10px;bottom:10px;padding:.35rem .6rem;border-radius:6px;background:#291a43;color:#e6d6ff;font-size:.75rem;font-weight:700}
#myPromotions>.rewards-faq{margin-top:2rem}#myPromotions summary{cursor:pointer;font-weight:700}
@media(max-width:480px){.guide-chapter-row{grid-template-columns:1fr}.guide-chapter-row label,.guide-chapter-row button{grid-column:1}.studio-tabs{flex-wrap:nowrap;overflow-x:auto;gap:6px;margin:16px 0}.studio-tabs button{flex:0 0 auto;min-height:44px;padding:10px 8px;font-size:12px;white-space:nowrap}}
