/* Creator side: a connected mobile app, inside the same nCircle glass world. */
.creator-mobile-title{display:none}
.creator-experience{display:grid;grid-template-columns:minmax(0,.95fr) minmax(350px,1.05fr);gap:6vw;padding-inline:7vw;align-items:start;position:relative}
.creator-story{min-width:0;grid-column:1;grid-row:1}
.creator-story .scene{padding:118px 0 145px;min-height:100svh;justify-content:flex-start}
.creator-story .scene-panel{width:100%;max-width:100%;padding:30px}
.creator-story h1{font-size:clamp(40px,4.6vw,69px);line-height:1.02;letter-spacing:-.06em;font-weight:500;text-wrap:balance}
.creator-story h2{font-size:clamp(38px,4vw,58px)}
.creator-story .scene-lede{font-size:15px;line-height:1.7;max-width:350px;margin-top:22px}
.creator-story .scene-note{font-size:11px;max-width:350px}
.creator-story .scene-action{font-size:12px;gap:20px}
.creator-story .scene-action[aria-pressed=true]{background:rgba(177,232,244,.65);border-color:#007f9973;color:var(--web-glass-accent)}
.creator-app-stage{grid-column:2;grid-row:1;position:sticky;top:96px;align-self:start;display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0;pointer-events:auto;z-index:3}
.creator-stage-label{display:flex;justify-content:space-between;gap:18px;width:min(360px,100%);font:400 9px/1.5 var(--font-mono);text-transform:uppercase;letter-spacing:.04em;padding:8px 12px;border:1px solid #fff;border-radius:14px;background:var(--web-glass-bg);color:var(--text-secondary)}
.creator-stage-label>span+span{color:var(--web-glass-accent)}
.creator-app-stage .creator-device{width:min(360px,100%);height:min(704px,calc(100svh - 265px));min-height:400px;box-shadow:0 24px 55px -25px #0b25417a,inset 0 0 0 3px #ffffff24}
.creator-app-stage .creator-app-controls{display:none}
.creator-app-stage .device-caption{font-size:10px;line-height:1.6;width:min(360px,100%);max-width:100%;min-height:36px;margin:0;padding:8px 12px}
.creator-device .phone-dock{left:17px;right:17px;height:65px;bottom:20px;padding:4px 5px;gap:3px}
.creator-device .phone-dock button{width:20%;min-width:44px;height:53px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:22px}
.phone-dock button span{font-size:8px;line-height:1.2;font-weight:500}
.creator-device .creator-screen{bottom:100px}
.creator-device:not([data-app-screen=studio]) .creator-screen{bottom:100px}
.creator-device .phone-dock button[aria-pressed=true]{box-shadow:0 2px 12px #0923332b}
.phone-profile-editor{display:grid;gap:13px}
.phone-profile-editor>div{display:grid;gap:6px}
.phone-profile-editor label{font-size:11px;font-weight:500;line-height:1.4}
.phone-profile-editor label>span{font-size:9px;color:#d1eaf5;font-weight:400}
.phone-profile-editor input,.phone-profile-editor select{width:100%;min-width:0;min-height:44px;padding:9px 11px;border:1px solid #ffffff80;border-radius:12px;background:#ffffff18;color:#fff;font-size:13px;box-shadow:inset 0 1px 0 #ffffff20}
.phone-profile-editor input::placeholder{color:#d6e9f2b3}
.phone-profile-editor option{color:#173f56;background:#edf8fc}
.phone-profile-editor .phone-action{margin-top:2px}
.phone-profile-editor .phone-fine-print{margin-top:0}
.phone-text-button{min-height:44px;background:none;border:0;text-decoration:underline;text-underline-offset:4px;font-size:11px;color:#e1f2fb}
.phone-completion.is-complete i{width:100%}
.phone-thread-tabs{display:flex;gap:7px;margin:-2px 0 16px}
.phone-thread-tabs button{flex:1;min-height:44px;padding:8px 7px;border:1px solid #ffffff69;border-radius:14px;background:#ffffff12;font-size:11px;color:#e4f4fb}
.phone-thread-tabs button[aria-pressed=true]{color:#123d52;background:#e4f9ff;border-color:#fff}
.phone-message-log{display:grid;gap:10px}
.phone-bubble{max-width:92%;justify-self:start;padding:12px 13px;border:1px solid #ffffff40;border-radius:4px 16px 16px;background:linear-gradient(130deg,#ffffff21,#ffffff0d)}
.phone-bubble>span{display:block;font-size:8px;color:#b9eaf5;margin-bottom:6px}
.phone-bubble p{font-size:12px;line-height:1.65}
.phone-bubble.from-creator{justify-self:end;border-radius:16px 4px 16px 16px;background:#87d9e424}
.phone-bubble-draft{border-style:dashed;border-color:#b0edf5;background:#d5f6ff!important;color:#143a4e}
.phone-bubble-draft>span{color:#15556c}
.phone-compose{display:grid;gap:7px;margin-top:17px;padding-top:14px;border-top:1px solid #ffffff40}
.phone-compose label{font-size:11px}
.phone-compose>div{display:flex;gap:8px}
.phone-compose input{width:100%;min-width:0;min-height:44px;border:1px solid #ffffff7a;border-radius:12px;background:#ffffff1c;color:#fff;font-size:12px;padding:10px}
.phone-compose input::placeholder{color:#d2e9f5cc}
.phone-compose button{width:44px;height:44px;border:1px solid #fff;border-radius:12px;background:#d6f5ff;display:grid;place-items:center;color:#19485c;flex:none}
.phone-compose p{font-size:9px;line-height:1.6;color:#e0f1f8;margin-top:2px}
@media(min-width:801px) and (max-width:1100px){.creator-experience{padding-inline:5vw;gap:5vw;grid-template-columns:minmax(0,1fr) minmax(330px,1fr)}.creator-story .scene-panel{padding:26px}.creator-story h1{font-size:49px}.creator-story h2{font-size:44px}.creator-story .scene-lede{font-size:14px}}
/* At phone and tablet widths, enter the app directly. The web chrome remains available. */
@media(max-width:800px){
 .creator-mobile-title{display:block}
 body.creator-app-first{height:100dvh;overflow:hidden}
 .creator-app-first #main{height:100dvh;min-height:0}
 .creator-experience{display:block;padding:0;height:100%}
 .creator-story{display:none}
 .creator-app-stage{position:fixed;top:88px;bottom:66px;left:50%;transform:translateX(-50%);width:min(520px,calc(100% - 24px));height:calc(100dvh - 154px);gap:0;z-index:3}
 .creator-stage-label{display:none}
 .creator-app-stage .creator-device{width:100%;height:100%;min-height:0;max-width:none;border-radius:27px;border-color:#ffffff94;box-shadow:inset 0 1px 0 #ffffff70,0 14px 50px -24px #0a304d80}
 .creator-app-stage .phone-island,.creator-app-stage .device-top,.creator-app-stage .device-bottom{display:none}
 .creator-device .phone-topbar{top:12px;left:16px;right:16px}
 .creator-device .phone-topbar h2{font-size:20px}
 .creator-device .phone-new-ideas{top:67px;right:17px;min-height:40px;font-size:11px}
 .creator-device .phone-notifications{top:65px}
 .creator-device .creator-screen{inset:109px 20px 94px;padding-right:4px}
 .creator-device:not([data-app-screen=studio]) .creator-screen{inset:78px 20px 94px}
 .creator-device .studio-reference{padding-top:clamp(60px,13svh,128px)}
 .creator-device .studio-reference h3{font-size:18px;line-height:1.4;margin:9px 0 15px}
 .creator-device .phone-kicker{font-size:9px}
 .creator-device .studio-actions button{font-size:13px;min-height:44px}
 .creator-device .studio-titles{padding:12px 14px;margin-top:15px}.studio-titles ol{font-size:12px;line-height:1.7}
 .creator-device .studio-scores strong{font-size:24px}.creator-device .studio-scores>div+div strong{font-size:20px}.studio-scores span{font-size:8px}
 .creator-device .phone-fine-print{font-size:10px;line-height:1.6}
 .creator-device .phone-view-heading h3{font-size:30px;line-height:1.1}
 .phone-view-heading>p{max-width:none;font-size:14px;line-height:1.6}
 .phone-detail-list span{font-size:12px}.phone-detail-list strong{font-size:14px;line-height:1.5}
 .phone-profile-summary strong{font-size:14px}.phone-profile-summary span{font-size:12px}.phone-profile-summary small{font-size:11px}
 .phone-completion>span,.phone-completion p{font-size:11px}
 .phone-profile-editor label{font-size:12px}.phone-profile-editor input,.phone-profile-editor select,.phone-compose input{font-size:16px}
 .phone-profile-editor{gap:14px}.phone-profile-editor .phone-fine-print{font-size:11px}
 .phone-gig-card>img{width:104px;height:175px}.phone-gig-card strong{font-size:19px}.phone-gig-card em{font-size:12px}.phone-gig-card small{font-size:9px}.phone-gig-card b{font-size:12px}.phone-gig-card.compact strong{font-size:17px}
 .phone-brief-card>p,.phone-timeline strong,.phone-feedback p,.phone-bubble p{font-size:14px;line-height:1.6}
 .phone-timeline small{font-size:12px}.phone-project strong{font-size:16px}.phone-project>div>span{font-size:11px}
 .phone-bubble>span{font-size:10px}.phone-thread-tabs button{font-size:12px}.phone-compose label{font-size:12px}.phone-compose p{font-size:11px}
 .phone-action,.creator-device .phone-action{font-size:13px;min-height:46px}
 .creator-device .phone-dock{left:14px;right:14px;bottom:13px;height:66px;border-radius:24px}
 .creator-device .phone-dock button{min-height:52px;border-radius:17px}.phone-dock button span{font-size:9px}
 .creator-app-stage .device-caption{position:absolute;width:1px;height:1px;min-height:0;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
 .creator-app-first .world-controls{inset:auto 12px 9px;min-height:45px;height:45px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;gap:8px;border-radius:16px}
 .creator-app-first .world-caption,.creator-app-first .world-position,.creator-app-first .next-chapter{display:none}
 .creator-app-first .world-actions{order:0;display:flex}.creator-app-first .motion-control{background:none;border:0;min-height:44px;padding:7px 0;font-size:9px}
 .creator-app-first .nav-signature{display:none}
}
@media(max-width:360px){.creator-app-stage{width:calc(100% - 20px)}.creator-device .creator-screen{left:16px;right:16px}.creator-device:not([data-app-screen=studio]) .creator-screen{left:16px;right:16px}.creator-device .phone-view-heading h3{font-size:27px}.phone-gig-card>img{width:85px}.creator-device .studio-reference h3{font-size:16px}.phone-dock button span{font-size:8px}}
@media(prefers-reduced-transparency:reduce){.creator-app-stage .phone-glass,.creator-app-stage .phone-icon-button,.creator-app-stage .phone-thread-tabs button{background:#234c63;backdrop-filter:none;-webkit-backdrop-filter:none}.creator-app-stage .phone-dock{background:#d4e9f5;backdrop-filter:none;-webkit-backdrop-filter:none}.creator-stage-label{background:#edf7fc}}
@media(forced-colors:active){.creator-stage-label,.creator-app-stage .creator-device{background:Canvas;color:CanvasText;border:1px solid CanvasText}.creator-app-stage .phone-tint{background:Canvas}.phone-profile-editor input,.phone-profile-editor select,.phone-thread-tabs button,.phone-compose input,.phone-compose button,.phone-bubble{background:Canvas;color:CanvasText;border:1px solid CanvasText}.creator-app-stage .phone-dock{background:Canvas;border:1px solid CanvasText}.creator-app-stage .phone-backdrop{display:none}}
/* In the inbox, the conversation scrolls and the composer stays within thumb reach. */
.creator-device[data-app-screen=messages] .creator-screen{display:flex;flex-direction:column;overflow:hidden;min-height:0}
.creator-device[data-app-screen=messages] .phone-view-heading{flex:none;margin-bottom:12px}
.creator-device[data-app-screen=messages] .phone-view-heading>p{display:none}
.creator-device[data-app-screen=messages] .phone-thread-tabs{flex:none;margin-bottom:10px}
.creator-device[data-app-screen=messages] .phone-message-log{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c5e6f06b transparent;align-content:start;padding-right:3px}
.creator-device[data-app-screen=messages] .phone-compose{flex:none;margin-top:10px;padding-top:10px}
.phone-profile-summary>div{min-width:0}
.phone-detail-list strong,.phone-profile-summary strong,.phone-project strong,.phone-bubble p{overflow-wrap:anywhere}
@media(max-width:800px) and (max-height:740px){.creator-device[data-app-screen=messages] .phone-view-heading h3{font-size:25px;margin-block:6px}.creator-device[data-app-screen=messages] .phone-view-heading{margin-bottom:9px}.phone-compose p{font-size:9px}.phone-compose{gap:5px}}
.creator-device input:focus-visible,.creator-device select:focus-visible{outline:2px solid #c4f3ff;outline-offset:2px;box-shadow:0 0 0 4px #007f9966}
@media(prefers-reduced-transparency:reduce){.creator-app-stage .phone-tint{background:#173e56}.creator-app-stage .phone-new-ideas{background:#234c63;backdrop-filter:none}.creator-app-stage .phone-thread-tabs button[aria-pressed=true]{background:#e4f9ff;color:#123d52}.creator-app-stage .phone-bubble{background:#264e64}.creator-app-stage .phone-bubble.from-creator{background:#315e73}}