:root{color-scheme:dark;--ink:#edf3ff;--muted:#9dacbd;--panel:#111d30;--line:#2a3b52;--accent:#76d9ff}*{box-sizing:border-box}body{margin:0;background:#080f1c;color:var(--ink);font:16px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:var(--accent)}.portal-header{padding:16px clamp(16px,4vw,56px);display:flex;align-items:center;gap:28px;justify-content:space-between;border-bottom:1px solid var(--line)}.site-logo img{width:190px;max-height:85px;object-fit:contain}.primary-nav{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.primary-nav a,.quiet{padding:9px 12px;text-decoration:none;border-radius:9px;color:var(--ink)}.primary-nav a:hover,.primary-nav a[aria-current=page]{background:#19314b}.primary-nav form{margin:0}.workspace{width:min(1180px,100%);padding:28px clamp(16px,4vw,36px);margin:0 auto;min-height:70vh}h1{font-size:clamp(1.75rem,4vw,2.65rem);line-height:1.16;letter-spacing:-.035em;margin:12px 0 24px}h2{font-size:1.35rem}.muted,small{color:var(--muted)}.back-row{margin-bottom:16px}.back-row a{text-decoration:none}.card,.panel{background:var(--panel);border:1px solid var(--line);padding:22px;border-radius:16px;margin:16px 0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(270px,100%),1fr));gap:18px}.grid .card{margin:0}label{display:block;margin:14px 0;font-weight:600}input:not([type=checkbox]):not([type=radio]):not([type=color]),textarea,select{display:block;width:100%;background:#081324;color:var(--ink);border:1px solid #45556c;border-radius:9px;font:inherit;padding:12px;margin-top:6px}input[type=color]{width:88px;height:44px;margin-left:12px}input[type=checkbox]{width:20px;height:20px;vertical-align:middle;margin-right:8px}textarea{min-height:150px;resize:vertical}form{margin-bottom:16px}button,.btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;background:#86dcfa;color:#041524;font:600 15px/1.3 system-ui;border:1px solid transparent;border-radius:9px;padding:11px 18px;margin:6px 6px 6px 0;text-decoration:none}.btn.secondary,.quiet{background:transparent;color:var(--ink);border-color:#485a73}.btn.danger{background:#542535;color:#ffe3e9}.btn:disabled,button:disabled{opacity:.5;cursor:not-allowed}.notice{padding:14px 18px;border:1px solid var(--line);border-radius:10px;margin:14px 0}.notice.success{background:#0f372f;color:#aff4d5}.notice.error{background:#401f2b;color:#ffcad1}.notice.warning{background:#3b301c;color:#ffdf9d}.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:22px}.adminbar{padding:12px 24px;background:#533e13;color:#ffebbd;position:sticky;top:0;z-index:100}.adminbar a{float:right;color:#fff}.site-footer{border-top:1px solid var(--line);padding:22px;text-align:center;color:var(--muted)}.site-footer span{display:block;font-size:13px;margin-top:6px}.stat{font-size:2.2rem;font-weight:750;display:block}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}th{color:var(--muted);font-size:.85rem}.badge{display:inline-block;border:1px solid #4a5c71;border-radius:99px;padding:3px 10px;font-size:12px}.image-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:16px}.image-grid img{width:100%;height:160px;object-fit:contain;border-radius:10px;background:#06101b}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}:focus-visible{outline:3px solid #ffe096;outline-offset:3px}@media(max-width:720px){.portal-header{display:block;padding:12px 16px}.site-logo img{width:150px}.primary-nav{gap:2px;margin-top:8px}.primary-nav a,.quiet{font-size:13px;padding:8px}.adminbar a{float:none;display:block}.workspace{padding-top:16px}.card,.panel{padding:16px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.artist-identity{text-align:center;padding:22px}.artist-logo{width:min(320px,80%);max-height:240px;object-fit:contain}.song-card{display:flex;align-items:center;justify-content:space-between;gap:20px}.up-next{font-size:1.25rem}.artist-page{border-radius:18px;padding:clamp(12px,3vw,28px)}

.editor-image{width:100%;height:140px;object-fit:contain;background:#050b14;border-radius:10px}.artist-page{position:relative;overflow:hidden;background:var(--artist-bg,#0b1020);color:var(--artist-text,#f5f7ff)}.artist-content{position:relative;z-index:1}.artist-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28;pointer-events:none}.artist-page .panel,.artist-page .card{background:var(--artist-bg);color:var(--artist-text)}.artist-page .muted{color:inherit;opacity:.8}.artist-page .btn{background:var(--artist-primary);color:var(--artist-button)}.artist-page .btn.secondary{background:var(--artist-bg);color:var(--artist-text)}.artist-page a:not(.btn){color:inherit;text-decoration:underline}.artist-cover{width:100%;max-height:300px;object-fit:cover;border-radius:12px}

/* CP055: payment settings */
.payment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1rem}
.payment-card{display:flex;flex-direction:column;gap:.35rem}
.payment-card .btn{align-self:flex-start;margin-top:auto}
.payment-card dt{font-weight:600;margin-top:.65rem}
.payment-card dd{margin:.15rem 0 .7rem;overflow-wrap:anywhere}
.payment-state{display:inline-block;padding:.3rem .6rem;border:1px solid currentColor;border-radius:.4rem;font-size:.95rem}
.payment-destination{overflow-wrap:anywhere}

/* Dashboard summaries need separate boxes, including when the card is a link. */
.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:16px;margin:16px 0}
.metric-grid>.card{display:flex;flex-direction:column;gap:8px;min-width:0;margin:0;overflow-wrap:anywhere}
.metric-grid>.card>strong{display:block;font-size:clamp(1.5rem,4vw,2.2rem);line-height:1.2}
.metric-grid>.card>span{display:block}
.metric-card{color:var(--ink);text-decoration:none}
.metric-card:hover{border-color:var(--accent);background:#19314b}
.action-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:18px 0}
.action-row>.btn{max-width:100%;margin:0;overflow-wrap:anywhere}

/* Keep navigation inside its header and wrap the selected act independently. */
.portal-header .site-logo{flex:0 0 190px;width:190px;max-width:100%;margin:0}
.primary-nav{flex:1 1 0;min-width:0}
.primary-nav>a{display:inline-flex;align-items:center;flex:0 0 auto;min-height:44px;white-space:nowrap}
.primary-nav>span{flex-basis:100%;min-width:0;overflow-wrap:anywhere}
.primary-nav>form{flex:0 0 auto}
.primary-nav .quiet{margin:0}
.adminbar{overflow-wrap:anywhere}
.workspace h1{overflow-wrap:anywhere}
@media(max-width:720px){.portal-header .site-logo{width:150px}}

.venue-logo{display:block;width:180px;height:120px;max-width:100%;object-fit:contain;margin:.75rem 0}.venue-details{overflow-wrap:anywhere}.venue-details p{margin:.4rem 0}

/* Saved profile image framing and live editor previews. */
.image-frame{position:relative;overflow:hidden;background:transparent}
.image-frame .framed-image{display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;border-radius:0}
.artist-logo-frame{width:min(320px,80%);aspect-ratio:4/3;margin:0 auto}
.artist-hero-frame{width:100%;height:clamp(120px,25vw,300px);border-radius:12px}
.crop-editor{min-width:0;margin:16px 0;padding:12px;border:1px solid var(--line);border-radius:12px}
.crop-editor legend{font-weight:600;padding:0 6px}
.crop-preview{width:100%;aspect-ratio:16/9;background:#050b14;border:1px solid #45556c;border-radius:10px}
.crop-preview-logo{aspect-ratio:4/3}
.crop-preview-hero{aspect-ratio:16/5}
.crop-preview [data-crop-empty]{display:block;padding:16px;font-weight:400;color:var(--muted)}
.crop-preview [hidden]{display:none!important}
.crop-editor input[type=range]{padding:0;min-height:36px;accent-color:var(--accent)}
.crop-editor output{font-weight:400;font-variant-numeric:tabular-nums}

/* CP071Q: shared containment for every portal, support and public screen. */
.workspace{min-width:0;overflow-wrap:anywhere}
.workspace :where(.card,.panel,.grid,.payment-grid,.image-grid,form,fieldset,details,dl,section,article){min-width:0;max-width:100%}
.workspace :where(h1,h2,h3,p,li,dt,dd,a,label,legend,strong,span){overflow-wrap:anywhere}
.workspace h1{max-width:100%}
.workspace :where(button,.btn){max-width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere;text-align:center}
.workspace :where(input,select,textarea){min-width:0;max-width:100%}
/* WebKit may otherwise propagate the intrinsic width of hidden native options. */
.workspace label:has(>select){contain:layout}
.workspace :where(fieldset,legend){min-inline-size:0}
.workspace :where(img,video,canvas,svg){max-width:100%}
.primary-nav>a,.primary-nav button,.primary-nav>form,.primary-nav>span{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.portal-header{min-width:0}
.primary-nav{max-width:100%}
.adminbar :where(form,button){min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.metric-grid{clear:both}
.metric-grid>.card{display:flex;position:relative;min-width:0;max-width:100%;text-decoration:none}
.metric-grid>.card>strong,.metric-grid>.card>span{display:block;min-width:0;max-width:100%}
.metric-grid+.action-row{clear:both}
.action-row{min-width:0;max-width:100%}
.action-row>*{min-width:0;max-width:100%}
.table-wrap{width:100%;max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.table-wrap:focus-visible{outline-offset:-3px}
.table-wrap table{max-width:none}
.table-wrap :where(th,td){min-width:8rem}
.song-card{flex-wrap:wrap;min-width:0}
.song-card>div{flex:1 1 180px;min-width:0;max-width:100%}
.song-card>.btn{flex:0 1 auto}
.site-footer{overflow-wrap:anywhere}
@media(max-width:480px){.image-grid{grid-template-columns:repeat(auto-fill,minmax(min(165px,100%),1fr))}}
/* Audience window controls must honor their hidden state despite button layout rules. */
.display-launcher [hidden]{display:none!important}

/* Saved artist themes follow the selected act; public shells never inherit account navigation. */
.artist-themed{background:var(--portal-bg);color:var(--ink)}
.artist-themed :where(input:not([type=checkbox]):not([type=radio]):not([type=color]),textarea,select){background:var(--portal-bg);color:var(--ink);border-color:var(--line)}
.artist-themed :where(button,.btn){background:var(--portal-button);color:var(--portal-button-ink);font-family:inherit}
.artist-themed :where(.btn.secondary,.quiet){background:transparent;color:var(--ink);border-color:var(--line)}
.artist-themed .btn.danger{background:#542535;color:#ffe3e9}
.artist-themed .primary-nav :where(a:hover,a[aria-current=page]){background:var(--portal-active-bg)}
.artist-themed :where(.badge,.table-wrap,.crop-editor){border-color:var(--line)}
.artist-themed .tagline,.artist-page .tagline{color:var(--artist-text,var(--ink))!important}
.artist-themed .image-grid img{background:var(--portal-bg)}
.artist-page .muted{opacity:1}
.public-audience .portal-header{justify-content:center;padding-block:12px}
.public-audience .portal-header .site-logo{flex-basis:150px;width:150px}
.public-audience .workspace{padding-top:12px}
.artist-page .artist-logo{width:min(240px,60%);max-height:180px}
.artist-page .artist-logo-frame{width:min(240px,60%)}
.artist-section{min-width:0}
/* Private controls for the separately owned audience window stay reachable while scrolling. */
.display-launcher .display-host-controls{position:fixed;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));z-index:10001;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;max-width:min(36rem,calc(100vw - 24px));padding:.75rem;background:var(--panel,#131c2e);color:var(--ink,#f5f7ff);border:1px solid var(--line,#344158);border-radius:.75rem;box-shadow:0 4px 24px #0008}
.display-host-controls :where(button,a){min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}.display-host-controls p{flex-basis:100%;margin:0;overflow-wrap:anywhere}.display-launcher .display-host-controls[hidden]{display:none!important}

/* Native auto popovers own switching, outside-click dismissal and Escape, even without JS. */
.portal-header{position:relative;z-index:50}
.primary-nav .nav-group{position:relative;flex:0 1 auto;min-width:0;max-width:100%}
.primary-nav .nav-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;margin:0;padding:9px 12px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--ink);font:inherit;cursor:pointer;overflow-wrap:anywhere}
.nav-trigger:hover,.nav-group.current-group>.nav-trigger,.nav-group:has(>.nav-submenu:popover-open)>.nav-trigger,.nav-trigger[aria-expanded=true]{background:var(--portal-active-bg,#19314b)}
.nav-trigger:focus-visible{outline:3px solid #ffe096;outline-offset:3px}
.nav-chevron{transition:transform .15s ease}
.nav-group:has(>.nav-submenu:popover-open) .nav-chevron,.nav-trigger[aria-expanded=true] .nav-chevron{transform:rotate(180deg)}
.primary-nav .nav-submenu{display:flex;flex-direction:column;gap:3px;width:max-content;min-width:min(15rem,calc(100vw - 32px));max-width:min(22rem,calc(100vw - 32px));max-height:min(65vh,32rem);overflow-y:auto;margin:4px 0 0;padding:8px;background:var(--panel,#111d30);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px #0006}
.primary-nav .nav-submenu[hidden]{display:none!important}
@supports selector(:popover-open){
 .primary-nav .nav-submenu[popover]{position:fixed;inset:auto;left:var(--nav-left,16px);top:var(--nav-top,auto);bottom:var(--nav-bottom,16px);margin:0;max-height:var(--nav-height,min(65vh,32rem))}
 .primary-nav .nav-submenu[popover]:not(:popover-open){display:none!important}
 .primary-nav .nav-submenu::backdrop{background:transparent;pointer-events:none}
}
.primary-nav .nav-submenu a{display:block;min-height:44px;white-space:normal;overflow-wrap:anywhere}
.primary-nav .nav-submenu form{padding-top:6px;border-top:1px solid var(--line)}
.primary-nav .nav-submenu .quiet{width:100%;justify-content:flex-start;text-align:left}
.primary-nav .nav-act{font-size:.85rem}
.primary-nav [data-nav-fallback]>.nav-submenu{position:absolute;left:0;top:100%;z-index:60}
@media(max-width:720px){.primary-nav [data-nav-fallback]:has(>.nav-submenu:not([hidden])){flex:1 0 100%}.primary-nav [data-nav-fallback]>.nav-submenu{position:static;width:100%;min-width:0;max-width:100%}}
@media(max-width:720px){.primary-nav .nav-trigger{font-size:14px;padding:8px 10px}}

/* Musician home: compact saved public-page identity, with tools in the shared navigation. */
.musician-home{min-height:clamp(360px,50vh,540px);padding:0}
.musician-home .artist-content{display:flex;flex-direction:column;align-items:center;min-height:inherit;width:100%}
.musician-home .artist-identity{width:100%;padding:clamp(20px,4vw,40px) clamp(16px,4vw,40px) 12px;overflow-wrap:anywhere}
.musician-home .artist-identity h1{margin:0 0 12px}
.musician-home .tagline{margin:0;overflow-wrap:anywhere}
.musician-home-logo{flex:1;display:flex;align-items:center;justify-content:center;width:100%;padding:16px clamp(20px,5vw,48px) 36px}
.musician-home .artist-logo,.musician-home .artist-logo-frame{width:min(320px,80%);max-height:260px;margin:0}

/* Full-page saves remain reachable at the end of each editor section. */
.section-actions{clear:both;display:flex;align-items:center;flex-wrap:wrap;gap:1.25rem;margin:1.5rem 0 0;padding:1rem 0 0;border-top:1px solid var(--line)}
.section-actions>button,.section-actions>a{margin:0;min-height:44px;max-width:100%}
.editor-section-note{margin:0 0 1rem;color:var(--muted)}
